/* Compact sun/moon control in the header */
.theme-header-btn {
    width: 2.2rem;
    height: 2.2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    padding: 0;
    border: 0;
    border-radius: 0.55rem;
    background: transparent;
    color: #475569;
    cursor: pointer;
    transition: background 0.18s ease, color 0.18s ease;
}

.theme-header-btn:hover {
    background: rgba(10, 58, 92, 0.08);
    color: #0a3a5c;
}

.theme-header-btn svg {
    width: 1.2rem;
    height: 1.2rem;
}

.theme-header-btn .theme-icon-moon {
    display: none;
}

html[data-theme="dark"] .theme-header-btn {
    color: #d6ebff;
}

html[data-theme="dark"] .theme-header-btn:hover {
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
}

html[data-theme="dark"] .theme-header-btn .theme-icon-sun {
    display: none;
}

html[data-theme="dark"] .theme-header-btn .theme-icon-moon {
    display: block;
}

.portal-auth-nav-end {
    display: flex;
    align-items: center;
    gap: 0.45rem;
}

/* Bottom-right social FAB — expands upward */
.social-fab {
    position: fixed;
    right: 1.15rem;
    left: auto;
    bottom: max(1.15rem, env(safe-area-inset-bottom, 0px));
    z-index: 10000;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.55rem;
    width: auto;
    height: auto;
    overflow: visible;
    pointer-events: none;
}

.social-fab-links {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.55rem;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    transform: translateY(10px);
    transition: opacity 0.2s ease, transform 0.2s ease, max-height 0.25s ease;
}

.social-fab-link {
    width: 3.05rem;
    height: 3.05rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border-radius: 50%;
    color: #fff;
    box-shadow: 0 10px 22px rgba(10, 58, 92, 0.22);
    text-decoration: none;
}

.social-fab.is-open .social-fab-links {
    max-height: 18rem;
    opacity: 1;
    overflow: visible;
    pointer-events: auto;
    transform: none;
}

.social-fab-link svg {
    width: 1.35rem;
    height: 1.35rem;
    fill: currentColor;
}

.social-fab-link--whatsapp { background: #25d366; }
.social-fab-link--instagram { background: linear-gradient(135deg, #f58529 0%, #dd2a7b 50%, #8134af 100%); }
.social-fab-link--telegram { background: #229ed9; }
.social-fab-link--messenger { background: #006aff; }

.social-fab-trigger {
    position: relative;
    width: 3.55rem;
    height: 3.55rem;
    padding: 0.55rem;
    border: 0;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 14px 32px rgba(10, 58, 92, 0.24);
    cursor: pointer;
    pointer-events: auto;
}

.social-fab-trigger-grid,
.social-fab-trigger-close {
    position: absolute;
    inset: 0.55rem;
    transition: opacity 0.18s ease, transform 0.18s ease;
}

.social-fab-trigger-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.22rem;
}

.social-fab-mini {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #fff;
}

.social-fab-mini svg {
    width: 0.7rem;
    height: 0.7rem;
    fill: currentColor;
}

.social-fab-trigger-close {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #475569;
    opacity: 0;
    pointer-events: none;
    transform: scale(0.6);
}

.social-fab-trigger-close svg {
    width: 1.2rem;
    height: 1.2rem;
}

.social-fab.is-open .social-fab-trigger-grid {
    opacity: 0;
    transform: scale(0.6);
}

.social-fab.is-open .social-fab-trigger-close {
    opacity: 1;
    transform: scale(1);
}

html[data-theme="dark"] .social-fab-trigger {
    background: #fff;
}

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

/* Landing */
html[data-theme="dark"] body.landing-body {
    color: #eaf3ff;
    background: linear-gradient(180deg, #061422 0%, #0a2238 48%, #07181f 100%);
}

html[data-theme="dark"] .landing-bg {
    background:
        radial-gradient(920px 540px at 8% -8%, rgba(0, 145, 255, 0.18), transparent 58%),
        radial-gradient(780px 480px at 108% 18%, rgba(0, 74, 128, 0.22), transparent 54%),
        radial-gradient(700px 420px at 50% 108%, rgba(10, 58, 92, 0.35), transparent 58%),
        linear-gradient(165deg, #061422 0%, #0a2238 38%, #07181f 100%);
}

html[data-theme="dark"] .landing-bg::before {
    background-image:
        linear-gradient(rgba(94, 200, 255, 0.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(94, 200, 255, 0.06) 1px, transparent 1px);
}

html[data-theme="dark"] .landing-bg::after {
    background:
        radial-gradient(ellipse at 50% 100%, rgba(0, 145, 255, 0.12), transparent 52%),
        linear-gradient(180deg, rgba(0, 0, 0, 0.18), transparent 22%, transparent 78%, rgba(0, 0, 0, 0.28));
}

html[data-theme="dark"] .faq-trigger,
html[data-theme="dark"] .faq-question,
html[data-theme="dark"] .faq-panel > p,
html[data-theme="dark"] .section-head .eyebrow {
    color: #eaf3ff;
}

html[data-theme="dark"] .site-footer {
    background: linear-gradient(160deg, #031018 0%, #062840 48%, #0a3a5c 100%);
}

html[data-theme="dark"] .ask-ai-section {
    background: #0b1624;
}

html[data-theme="dark"] .ask-ai-section h2 {
    color: #eaf3ff;
}

html[data-theme="dark"] .ask-ai-section p {
    color: #9bb3c7;
}

html[data-theme="dark"] .glass-nav {
    background: rgba(8, 24, 40, 0.92);
    border-bottom-color: rgba(255, 255, 255, 0.08);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.28);
}

html[data-theme="dark"] .btn-ghost {
    color: #d6ebff;
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.16);
}

html[data-theme="dark"] .section-head h2,
html[data-theme="dark"] .product-copy h2,
html[data-theme="dark"] .lead,
html[data-theme="dark"] .product-copy p,
html[data-theme="dark"] .benefit-list,
html[data-theme="dark"] .faq-item,
html[data-theme="dark"] .portals-shell-card,
html[data-theme="dark"] .portal-login-item h3,
html[data-theme="dark"] .portal-login-item p {
    color: #eaf3ff;
}

html[data-theme="dark"] .portals-shell-card,
html[data-theme="dark"] .student-card,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .ambition-card,
html[data-theme="dark"] .journey-step,
html[data-theme="dark"] .faq-item {
    background: rgba(13, 36, 56, 0.88);
    border-color: rgba(255, 255, 255, 0.08);
    box-shadow: 0 16px 36px rgba(0, 0, 0, 0.28);
}

html[data-theme="dark"] .land-section,
html[data-theme="dark"] .roles-section,
html[data-theme="dark"] .faq-section,
html[data-theme="dark"] .partners-section,
html[data-theme="dark"] .why-section,
html[data-theme="dark"] .ambition-section {
    background: transparent;
}

html[data-theme="dark"] .muted,
html[data-theme="dark"] .section-head p,
html[data-theme="dark"] .stat-card span {
    color: #9bb3c7;
}

html[data-theme="dark"] .stat-card strong,
html[data-theme="dark"] .ambition-card h3,
html[data-theme="dark"] .journey-step h3 {
    color: #eaf3ff;
}

/* Login landings */
html[data-theme="dark"] .student-auth-body,
html[data-theme="dark"] .portal-auth-body {
    background: #071422;
    color: #eaf3ff;
}

html[data-theme="dark"] .student-auth-nav,
html[data-theme="dark"] .portal-auth-nav {
    background: rgba(8, 24, 40, 0.9);
    border-bottom-color: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .student-nav-link,
html[data-theme="dark"] .student-hero-copy h1,
html[data-theme="dark"] .student-card h3,
html[data-theme="dark"] .student-section-head h2 {
    color: #eaf3ff;
}

html[data-theme="dark"] .student-card,
html[data-theme="dark"] .student-login-card,
html[data-theme="dark"] .portal-auth-card,
html[data-theme="dark"] .student-gap,
html[data-theme="dark"] .uni-lifecycle {
    background: #0f2740;
    border-color: rgba(255, 255, 255, 0.1);
    color: #eaf3ff;
}

html[data-theme="dark"] .student-hero-copy p,
html[data-theme="dark"] .student-muted,
html[data-theme="dark"] .student-card p {
    color: #9bb3c7;
}

html[data-theme="dark"] .student-btn-ghost {
    color: #d6ebff;
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.18);
}

html[data-theme="dark"] .student-auth-bg::before {
    background: linear-gradient(
        180deg,
        rgba(7, 20, 34, 0.35) 0%,
        rgba(7, 20, 34, 0.55) 40%,
        rgba(7, 20, 34, 0.92) 100%
    );
}

html[data-theme="dark"] .portal-auth-admin-main {
    background: rgba(7, 20, 34, 0.35);
}

html[data-theme="dark"] .portal-auth-brand h2,
html[data-theme="dark"] .portal-auth-brand p {
    color: #eaf3ff;
}

html[data-theme="dark"] .portal-auth-footer,
html[data-theme="dark"] .portal-auth-footer--admin {
    color: #9bb3c7;
}

/* Dashboards: shell + common Tailwind surfaces */
html[data-theme="dark"] body {
    background-color: #071422;
    color: #eaf3ff;
}

html[data-theme="dark"] body.landing-body {
    color: #eaf3ff;
    background: linear-gradient(180deg, #061422 0%, #0a2238 48%, #07181f 100%);
}

html[data-theme="dark"] body.bg-slate-50,
html[data-theme="dark"] body.min-h-screen,
html[data-theme="dark"] body.bg-gray-100,
html[data-theme="dark"] [class*="bg-[#f4f6f8]"],
html[data-theme="dark"] [class*="bg-[#f4f8fc]"] {
    background-color: #071422 !important;
    color: #eaf3ff;
}

html[data-theme="dark"] .bg-white {
    background-color: #0f2740 !important;
}

html[data-theme="dark"] .bg-slate-50,
html[data-theme="dark"] .bg-gray-50,
html[data-theme="dark"] .bg-gray-100 {
    background-color: #0b1f33 !important;
}

html[data-theme="dark"] .text-slate-900,
html[data-theme="dark"] .text-gray-900,
html[data-theme="dark"] .text-slate-800,
html[data-theme="dark"] .text-slate-700 {
    color: #eaf3ff !important;
}

html[data-theme="dark"] .text-slate-600,
html[data-theme="dark"] .text-gray-600,
html[data-theme="dark"] .text-gray-500,
html[data-theme="dark"] .text-slate-500 {
    color: #9bb3c7 !important;
}

html[data-theme="dark"] .border-gray-200,
html[data-theme="dark"] .border-slate-200,
html[data-theme="dark"] .border-gray-100 {
    border-color: rgba(255, 255, 255, 0.1) !important;
}

@media (max-width: 640px) {
    .social-fab {
        right: 0.8rem;
        bottom: max(0.95rem, env(safe-area-inset-bottom, 0px));
    }

    .social-fab-trigger {
        width: 3.25rem;
        height: 3.25rem;
    }
}