/**
 * Mode sombre — activé via html[data-theme="dark"] (panneau Accessibilité).
 * S’appuie sur les tokens CSS pour couvrir l’essentiel du site.
 */

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

    --color-primary: #3a9da3;
    --color-primary-light: #5eb8bd;
    --color-primary-dark: #c8e4e6;

    --color-secondary-brand: #e88b66;
    --color-secondary: #d97a52;
    --color-secondary-hover: #f0a080;
    --color-secondary-on-dark: #f5a574;

    --color-accent: #e8c84a;
    --color-stat-lime: #d4bc78;

    --color-bg: #0f1a1c;
    --color-bg-soft: #152428;
    --color-bg-alt: #1a2e32;
    --color-surface: #1e3236;
    --color-surface-hover: #253d42;

    --color-text-main: #eef4f4;
    --color-text-muted: #a8b8bc;
    --color-text-subtle: #8a9aa0;
    --color-text-light: #ffffff;

    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.28);
    --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.35);
    --shadow-lg: 0 20px 40px rgba(0, 0, 0, 0.42);
    --shadow-glow: 0 8px 28px rgba(232, 139, 102, 0.22);
    --shadow-card-hover: 0 18px 36px rgba(0, 0, 0, 0.38);

    --hero-overlay-gradient:
        linear-gradient(
            90deg,
            rgba(5, 37, 39, 0.72) 0%,
            rgba(5, 37, 39, 0.52) 38%,
            rgba(5, 37, 39, 0.24) 67%,
            rgba(5, 37, 39, 0.28) 100%
        ),
        linear-gradient(
            180deg,
            rgba(4, 26, 28, 0.06) 0%,
            rgba(4, 26, 28, 0.18) 100%
        );
}

html[data-theme='dark'] body {
    background-image: radial-gradient(120% 85% at 100% 0%, rgba(58, 157, 163, 0.12) 0%, transparent 55%),
        radial-gradient(90% 65% at 0% 100%, rgba(232, 139, 102, 0.08) 0%, transparent 52%);
}

html[data-theme='dark'] h1,
html[data-theme='dark'] h2,
html[data-theme='dark'] h3,
html[data-theme='dark'] h4,
html[data-theme='dark'] h5,
html[data-theme='dark'] h6 {
    color: var(--color-primary-dark);
}

html[data-theme='dark'] .bg-light {
    background: radial-gradient(circle at 12% 8%, rgba(232, 139, 102, 0.1), transparent 28rem),
        linear-gradient(180deg, rgba(30, 50, 54, 0.95) 0%, rgba(21, 36, 40, 0.98) 100%),
        var(--color-bg-soft);
}

html[data-theme='dark'] .bg-white-pure {
    background: var(--color-surface);
}

html[data-theme='dark'] .bg-cream {
    background: radial-gradient(circle at 86% 14%, rgba(58, 157, 163, 0.12), transparent 26rem),
        linear-gradient(180deg, #1a2e32 0%, #152428 100%);
}

html[data-theme='dark'] .bg-teal-mist {
    background: radial-gradient(circle at 16% 18%, rgba(232, 200, 74, 0.1), transparent 24rem),
        linear-gradient(135deg, rgba(21, 36, 40, 0.98) 0%, rgba(30, 50, 54, 0.92) 52%, rgba(26, 46, 50, 0.96) 100%);
}

html[data-theme='dark'] .a11y-toolbar {
    border-bottom-color: rgba(200, 228, 230, 0.12);
}

html[data-theme='dark'] .a11y-toolbar .a11y-btn {
    border-color: rgba(200, 228, 230, 0.22);
}

html[data-theme='dark'] .a11y-toolbar .a11y-toggle {
    border-color: rgba(200, 228, 230, 0.35);
    color: var(--color-text-main);
}

html[data-theme='dark'] .a11y-toolbar .a11y-toggle[aria-pressed='true'] {
    background: rgba(58, 157, 163, 0.2);
    border-color: var(--color-primary-light);
}

html[data-theme='dark'] .a11y-toolbar__title {
    color: var(--color-text-main);
}

html[data-theme='dark'] .header.scrolled {
    background: rgba(15, 26, 28, 0.96);
    border-bottom-color: rgba(200, 228, 230, 0.1);
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.35);
}

html[data-theme='dark'] .header.scrolled .nav-links a,
html[data-theme='dark'] .header.scrolled .logo-title,
html[data-theme='dark'] .header.scrolled .logo-subtitle {
    color: var(--color-text-main);
}

html[data-theme='dark'] .page-inscription .inscription-toc {
    background: rgba(15, 26, 28, 0.94);
    border-color: rgba(200, 228, 230, 0.1);
}

html[data-theme='dark'] .page-inscription .inscription-toc.is-stuck {
    background: rgba(30, 50, 54, 0.96);
}

html[data-theme='dark'] .page-inscription .inscription-toc__label,
html[data-theme='dark'] .page-inscription .inscription-toc__list {
    background: rgba(30, 50, 54, 0.85);
    border-color: rgba(200, 228, 230, 0.12);
}

html[data-theme='dark'] .csh-surface-card,
html[data-theme='dark'] .benefit-card,
html[data-theme='dark'] .service-card,
html[data-theme='dark'] .form-card {
    border-color: rgba(200, 228, 230, 0.1);
}

/* Menu mobile (max 1024px) en theme sombre.
   Le panneau code des fonds blancs en dur ; en theme sombre, le texte utilise
   des tokens clairs (color-text-main devient tres clair), d'ou un texte clair
   sur fond blanc illisible. On retablit des surfaces sombres coherentes. */
@media (max-width: 1024px) {
    /* Header ouvert : fond sombre au lieu du blanc codé en dur */
    html[data-theme='dark'] body.nav-open .header,
    html[data-theme='dark'] body.nav-open .header:not(.scrolled) {
        background-color: rgba(15, 26, 28, 0.98) !important;
        box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45) !important;
    }

    /* Logo : version blanche sur header sombre */
    html[data-theme='dark'] body.nav-open .header .logo-white,
    html[data-theme='dark'] body.nav-open .header:not(.scrolled) .logo-white {
        display: block !important;
    }
    html[data-theme='dark'] body.nav-open .header .logo-color,
    html[data-theme='dark'] body.nav-open .header:not(.scrolled) .logo-color {
        display: none !important;
    }

    /* Panneau de navigation : dégradé sombre (le #fff codé en dur disparaît) */
    html[data-theme='dark'] body.nav-open .nav-links {
        background: linear-gradient(180deg, var(--color-bg) 0%, var(--color-bg-soft) 100%);
        border-top-color: rgba(200, 228, 230, 0.1);
    }

    /* Cartes de liens : surface sombre + texte clair lisible */
    html[data-theme='dark'] body.nav-open .nav-links > li:not(.nav-link--mobile-heading) > a {
        background: var(--color-surface);
        border-color: rgba(200, 228, 230, 0.12);
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
        color: var(--color-text-main) !important;
    }

    html[data-theme='dark'] body.nav-open .nav-links a:hover,
    html[data-theme='dark'] body.nav-open .nav-links a:focus-visible {
        background: var(--color-surface-hover);
        border-color: rgba(200, 228, 230, 0.28);
        color: var(--color-primary-dark) !important;
    }

    html[data-theme='dark'] body.nav-open .nav-links a[aria-current='page'] {
        background: rgba(58, 157, 163, 0.18);
        border-color: rgba(232, 139, 102, 0.45);
        color: var(--color-text-light) !important;
    }

    /* Barre d’actions (bas d’écran) : fond sombre */
    html[data-theme='dark'] body.nav-open .nav-actions {
        background: linear-gradient(180deg, rgba(15, 26, 28, 0) 0%, var(--color-bg) 32%, var(--color-bg-soft) 100%);
        border-top-color: rgba(200, 228, 230, 0.1);
    }
}

/* Contraste élevé + sombre : le mode contraste garde la priorité d’accessibilité */
html.a11y-high-contrast[data-theme='dark'] body {
    background: #000 !important;
    color: #fff !important;
}