/**
 * Theme Name: Default
 * Theme Label: Default (light)
 * Theme Slug: default
 *
 * Default modal skin: light dialog with Hero-Header-style CTAs (blue primary,
 * white/blue-outline secondary). Structural rules live in sm-base.css; this
 * file only sets the visual skin, reusing the theme design tokens.
 *
 * @package Socios_Modals
 * @since   1.0.0
 */

.socios-modal--default .socios-modal__dialog {
	background: var(--light-neutral-0, #fdfdfd);
	color: var(--dark-neutral-500, #14141e);
}

.socios-modal--default .socios-modal__heading {
	color: var(--dark-neutral-500, #14141e);
}

/* Primary CTA — blue (matches .sc-hero__primary-cta--blue). */
.socios-modal--default .socios-modal__cta--primary {
	background: var(--blue-500, #1833cb);
	color: var(--light-neutral-0, #fdfdfd);
	border-color: var(--blue-500, #1833cb) !important;
}

.socios-modal--default .socios-modal__cta--primary:hover,
.socios-modal--default .socios-modal__cta--primary:focus {
	color: var(--light-neutral-0, #fdfdfd);
}

/* Secondary CTA — white with blue outline (matches .sc-hero__secondary-cta). */
.socios-modal--default .socios-modal__cta--secondary {
	background: var(--light-neutral-0, #fdfdfd);
	color: var(--blue-500, #1833cb);
	border-color: var(--blue-500, #1833cb) !important;
}

.socios-modal--default .socios-modal__cta--secondary:hover,
.socios-modal--default .socios-modal__cta--secondary:focus {
	color: var(--blue-500, #1833cb);
}