/*
Theme Name: MedSolutions Academy
Theme URI:  https://www.medsolutionsacademy.com
Description: Premium child theme of Twenty Twenty-Five for MED SOLUTIONS ACADEMY — healthcare licensing & Prometric exam preparation platform.
Author:      MedSolutions Academy
Template:    twentytwentyfive
Version:     3.2.0
Text Domain: medsolutions-academy
*/

:root,
[data-theme="light"] {
	--blue-deep: #0B4F87;
	--blue-navy: #083D6B;
	--green: #0C9A46;
	--green-fresh: #27B45B;
	--white: #FFFFFF;
	--gray-light: #F5F8FB;
	--charcoal: #2C3E50;
	--glass-bg: rgba(255, 255, 255, 0.62);
	--glass-border: rgba(255, 255, 255, 0.45);
	--shadow-soft: 0 20px 60px -20px rgba(8, 61, 107, 0.25);
	--radius-lg: 28px;
	--radius-md: 18px;
	--radius-sm: 12px;

	--msa-primary-blue: var(--blue-deep);
	--msa-secondary-blue: var(--blue-navy);
	--msa-primary-green: var(--green);
	--msa-accent-green: var(--green-fresh);
	--msa-white: var(--white);
	--msa-light-gray: var(--gray-light);
	--msa-dark-text: var(--charcoal);
	--msa-muted-text: rgba(44, 62, 80, 0.72);
	--msa-border: rgba(11, 79, 135, 0.08);
	--msa-glass-bg: var(--glass-bg);
	--msa-glass-border: var(--glass-border);
	--msa-shadow-sm: 0 14px 34px -22px rgba(11, 79, 135, 0.3);
	--msa-shadow-md: var(--shadow-soft);
	--msa-shadow-lg: 0 24px 50px -20px rgba(11, 79, 135, 0.3);
	--msa-radius-sm: var(--radius-sm);
	--msa-radius-md: var(--radius-md);
	--msa-radius-lg: var(--radius-lg);
	--msa-radius-xl: 40px;
	--msa-bg: var(--white);
	--msa-bg-alt: var(--gray-light);
	--msa-text: var(--charcoal);
	--msa-text-inverse: var(--white);
	--msa-header-bg: rgba(245, 248, 251, 0.78);
	--msa-footer-bg: var(--blue-navy);
	--msa-footer-text: rgba(255, 255, 255, 0.78);
	--msa-gradient-hero: linear-gradient(160deg, var(--blue-navy), var(--blue-deep));
	--msa-gradient-accent: linear-gradient(135deg, var(--green-fresh), var(--green));
	--msa-transition: 0.25s ease;
}

[data-theme="dark"],
@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) {
		--glass-bg: rgba(26, 35, 50, 0.72);
		--glass-border: rgba(255, 255, 255, 0.12);
		--gray-light: #0F1419;
		--charcoal: #E8EDF2;
		--msa-bg: #0F1419;
		--msa-bg-alt: #1A2332;
		--msa-text: #E8EDF2;
		--msa-muted-text: rgba(232, 237, 242, 0.72);
		--msa-header-bg: rgba(15, 20, 25, 0.92);
		--msa-border: rgba(255, 255, 255, 0.08);
	}
}

[data-theme="light"] {
	color-scheme: light;
}

[data-theme="dark"] {
	color-scheme: dark;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
	overflow-x: hidden;
}

body {
	font-family: 'Inter', system-ui, sans-serif;
	color: var(--charcoal);
	background:
		radial-gradient(1100px 700px at 85% -10%, rgba(11, 79, 135, 0.10), transparent 60%),
		radial-gradient(900px 600px at -10% 20%, rgba(12, 154, 70, 0.08), transparent 55%),
		var(--gray-light);
	overflow-x: hidden;
	margin: 0;
	transition: background-color var(--msa-transition), color var(--msa-transition);
}

h1,
h2,
h3,
.display,
.msa-section__title,
.msa-inner-hero__title {
	font-family: 'Fraunces', serif;
	letter-spacing: -0.01em;
}

.mono,
.msa-stat__number[data-msa-counter] {
	font-family: 'IBM Plex Mono', monospace;
	letter-spacing: 0.02em;
}

a {
	text-decoration: none;
	color: inherit;
}

img,
video,
svg {
	max-width: 100%;
	height: auto;
	display: block;
}

::selection {
	background: rgba(39, 180, 91, 0.25);
}

:focus-visible {
	outline: 2px solid var(--blue-deep);
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

.msa-animate {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity 0.6s ease, transform 0.6s ease;
}

.msa-animate.is-visible {
	opacity: 1;
	transform: translateY(0);
}

.msa-skip-link {
	position: absolute;
	top: -100%;
	left: 16px;
	z-index: 100000;
	padding: 8px 16px;
	background: var(--blue-deep);
	color: #fff;
	border-radius: var(--radius-sm);
	text-decoration: none;
	font-weight: 600;
}

.msa-skip-link:focus {
	top: 16px;
}

.wa-float,
.msa-whatsapp-float {
	position: fixed;
	bottom: 26px;
	right: 26px;
	width: 58px;
	height: 58px;
	border-radius: 50%;
	background: var(--green);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 1.5rem;
	box-shadow: 0 14px 30px -8px rgba(12, 154, 70, 0.6);
	z-index: 60;
	animation: msa-float 4s ease-in-out infinite;
	text-decoration: none;
	transition: transform var(--msa-transition);
}

.wa-float:hover,
.msa-whatsapp-float:hover {
	transform: scale(1.06);
	color: #fff;
}

.msa-whatsapp-float svg {
	width: 28px;
	height: 28px;
	fill: currentColor;
}

.msa-whatsapp-float__label {
	position: absolute;
	right: calc(100% + 12px);
	white-space: nowrap;
	background: var(--charcoal);
	color: #fff;
	padding: 6px 14px;
	border-radius: var(--radius-sm);
	font-size: 0.8125rem;
	font-weight: 500;
	opacity: 0;
	pointer-events: none;
	transition: opacity var(--msa-transition);
}

.msa-whatsapp-float:hover .msa-whatsapp-float__label {
	opacity: 1;
}

body.msa-page--exam {
	padding-bottom: calc(80px + env(safe-area-inset-bottom, 0px));
}

body.msa-page--exam .msa-whatsapp-float,
body.msa-page--exam .wa-float {
	bottom: calc(90px + env(safe-area-inset-bottom, 0px));
}
