/* ═══════════════ STUDIA SUP — THÈME CLAIR ═══════════════
   Surcouche des pages de lecture. Le sombre reste le défaut et
   l'identité ; le clair reprend la MÊME palette, inversée :
     fond      #F7F9F8 (le blanc du thème) et #ECF1EE pour les
               sections alternées
     texte     #0B120E (le noir verdâtre)
     accent    #1B6B35 pour le TEXTE — l'émeraude #2E9E4F ne donne
               que 3,2:1 sur blanc, le vert foncé monte à 6,1:1.
               L'émeraude reste le fond des boutons (texte blanc).
     or        #F2C230 illisible sur blanc : #8A6208 pour le texte,
               l'or d'origine ne sert plus qu'aux filets décoratifs.
   Chargé après les autres feuilles ; tout est préfixé
   [data-theme="clair"], donc rien ne bouge en sombre. */

[data-theme="clair"] {
  --black: #F7F9F8;
  --white: #0B120E;
  --glass-bg: rgba(255,255,255,.8);
  --glass-border: rgba(11,18,14,.12);
  --accent-texte: #1B6B35;
  --or-texte: #8A6208;
  --fond: #F7F9F8;
  --fond-alt: #ECF1EE;
  --fond-carte: #FFFFFF;
  --bord: rgba(11,18,14,.12);
  --encre: #0B120E;
  --encre-douce: rgba(11,18,14,.66);
  --encre-tenue: rgba(11,18,14,.64);
}

[data-theme="clair"] body,
[data-theme="clair"] .page-accueil,
[data-theme="clair"] .page-filiere,
[data-theme="clair"] .page-inscription {
  background: var(--fond);
  color: var(--encre);
}
[data-theme="clair"] .page-inscription {
  background:
    radial-gradient(ellipse 70% 45% at 20% 0%, rgba(46,158,79,.09), transparent 65%),
    radial-gradient(ellipse 60% 40% at 85% 90%, rgba(30,136,199,.07), transparent 65%),
    var(--fond);
}

/* ── En-tête ─────────────────────────────────────────────────── */
[data-theme="clair"] .hd {
  background: rgba(247,249,248,.88);
  border-bottom-color: var(--bord);
}
[data-theme="clair"] .hd__nav a { color: rgba(11,18,14,.72); }
[data-theme="clair"] .hd__nav a:hover { color: var(--encre); }
[data-theme="clair"] .hd__menu {
  background: #fff;
  border-color: var(--bord);
  box-shadow: 0 24px 60px rgba(11,18,14,.14);
}
[data-theme="clair"] .hd__menu a:hover { background: rgba(11,18,14,.05); }
[data-theme="clair"] .hd__menu a:first-child { color: var(--accent-texte); border-bottom-color: var(--bord); }
[data-theme="clair"] .hd__menu-note { color: var(--encre-tenue); }
[data-theme="clair"] .hd__burger { color: var(--encre); border-color: var(--bord); }
[data-theme="clair"] .hd.is-open .hd__nav { background: #fff; border-bottom-color: var(--bord); }

/* Le logo est blanc : sur fond clair il disparaît. On l'inverse. */
[data-theme="clair"] .hd__logo img,
[data-theme="clair"] .ins-header__logo,
[data-theme="clair"] .footer__brand { filter: invert(1) hue-rotate(180deg); }

/* ── Pastilles langue & thème ────────────────────────────────── */
[data-theme="clair"] .lang-switch,
[data-theme="clair"] .theme-switch {
  border-color: var(--bord);
  background: rgba(11,18,14,.04);
}
[data-theme="clair"] .lang-switch__btn { color: rgba(11,18,14,.6); }
[data-theme="clair"] .lang-switch__btn:hover { color: var(--encre); }
[data-theme="clair"] .lang-switch__btn[aria-current="true"] { background: var(--green); color: #fff; }

/* ── Hero de page & sections ─────────────────────────────────── */
/* .filieres porte son propre fond sombre (--fil-bg) : sans ça le titre
   du hero resterait noir sur noir. */
[data-theme="clair"] .filieres { --fil-bg: var(--fond); }
[data-theme="clair"] .filieres::before { opacity: .35; }
[data-theme="clair"] .fil-paths { opacity: .35; }
[data-theme="clair"] .page-filiere { background: var(--fond); }
[data-theme="clair"] .fp-hero::before { opacity: .5; }
[data-theme="clair"] .fp-title,
[data-theme="clair"] .fp-h2,
[data-theme="clair"] .fil-title,
[data-theme="clair"] .of-pole__titre,
[data-theme="clair"] .pg-carte h3,
[data-theme="clair"] .of-carte__titre,
[data-theme="clair"] .fp-step h3 { color: var(--encre); }
[data-theme="clair"] .fp-desc,
[data-theme="clair"] .fil-sub,
[data-theme="clair"] .fp-step p,
[data-theme="clair"] .pg-carte p,
[data-theme="clair"] .pg-liste span { color: var(--encre-douce); }
[data-theme="clair"] .fp-back { color: var(--encre-douce); }
[data-theme="clair"] .fp-back:hover { color: var(--encre); }
[data-theme="clair"] .fp-note { color: var(--encre-tenue); border-color: var(--bord); }
[data-theme="clair"] .fp-section--alt,
[data-theme="clair"] .of-pole--alt { background: var(--fond-alt); }

[data-theme="clair"] .fil-eyebrow,
[data-theme="clair"] .of-pole__lien,
[data-theme="clair"] .pg-carte__fleche,
[data-theme="clair"] .pg-liste strong,
[data-theme="clair"] .pg-faq summary::after,
[data-theme="clair"] .of-niveau__n,
[data-theme="clair"] .of-col__compte,
[data-theme="clair"] .fp-step__n { color: var(--accent-texte); }
[data-theme="clair"] .fil-eyebrow__dot { background: var(--accent-texte); }

/* Cartes, listes, panneaux : le blanc pur ressort sur le fond cassé. */
[data-theme="clair"] .pg-carte,
[data-theme="clair"] .pg-liste li,
[data-theme="clair"] .pg-faq details,
[data-theme="clair"] .pg-mesrs,
[data-theme="clair"] .of-col,
[data-theme="clair"] .of-carte,
[data-theme="clair"] .fp-step,
[data-theme="clair"] .of-col li {
  background: var(--fond-carte);
  border-color: var(--bord);
}
[data-theme="clair"] .of-col li { background: var(--fond-alt); }
[data-theme="clair"] .pg-carte--lien:hover { border-color: rgba(46,158,79,.55); }
[data-theme="clair"] .pg-faq summary { color: var(--encre); }
[data-theme="clair"] .pg-faq details p { color: var(--encre-douce); }
[data-theme="clair"] .pg-mesrs p { color: var(--encre-douce); }
[data-theme="clair"] .pg-mesrs .pg-mesrs__ref { color: var(--or-texte); }

/* Mot de la Direction Générale */
[data-theme="clair"] .dir__lettre,
[data-theme="clair"] .dir__poles li { background: var(--fond-carte); border-color: var(--bord); }
[data-theme="clair"] .dir__lettre { border-left-color: var(--or-texte); }
[data-theme="clair"] .dir__eyebrow { color: var(--or-texte); }
/* Les paragraphes se distinguent par leur classe : on passe par
   `p.classe` pour rester au-dessus de la règle générique `.dir__lettre p`,
   sans quoi l'accroche et l'adresse retomberaient en gris de corps. */
[data-theme="clair"] .dir__lettre p { color: var(--encre-douce) !important; }
[data-theme="clair"] .dir__titre,
[data-theme="clair"] .dir__lettre p.dir__salut,
[data-theme="clair"] .dir__poles a,
[data-theme="clair"] .dir__signature-nom { color: var(--encre) !important; }
[data-theme="clair"] .dir__lettre p.dir__accroche,
[data-theme="clair"] .dir__poles a:hover { color: var(--accent-texte) !important; }
[data-theme="clair"] .dir__signature { border-top-color: var(--bord); }
[data-theme="clair"] .dir__signature-lieu { color: var(--encre-tenue); }

[data-theme="clair"] .of-col__titre { color: var(--encre); }
[data-theme="clair"] .of-niveau__l,
[data-theme="clair"] .of-carte__niveaux { color: var(--encre-douce); }
[data-theme="clair"] .of-carte__niveaux strong { color: var(--encre); }
[data-theme="clair"] .of-total { color: var(--encre-douce); }
[data-theme="clair"] .of-total strong { color: var(--encre); }
[data-theme="clair"] .offre { background: var(--fond-alt); }

/* Listes de parcours et de métiers : elles gardaient la couleur claire du
   thème sombre — blanc sur blanc, 1,05:1 à la mesure. */
[data-theme="clair"] .of-col li,
[data-theme="clair"] .fil-jobs li,
[data-theme="clair"] .fp-jobs li,
[data-theme="clair"] .fil-card__desc,
[data-theme="clair"] .fil-jauge__label,
[data-theme="clair"] .fil-sig { color: var(--encre-douce); }
[data-theme="clair"] .fil-jobs li,
[data-theme="clair"] .fp-jobs li { background: var(--fond-alt); border-color: var(--bord); }
[data-theme="clair"] .fil-card { background: var(--fond-carte); border-color: var(--bord); }
[data-theme="clair"] .fil-card__title { color: var(--encre); }
[data-theme="clair"] .fil-pt { background: var(--accent-texte); }

/* Liens en émeraude sur blanc : 3,43:1. Le vert foncé passe à 6,1:1. */
[data-theme="clair"] .pg-contact .pg-carte a,
[data-theme="clair"] .ft-lien--vert,
[data-theme="clair"] a.js-wa { color: var(--accent-texte); }

/* Les accents de pôle : lisibles sur blanc. */
[data-theme="clair"] .fil-page--clair    { --accent: #2F6B4C; }
[data-theme="clair"] .fil-page--emeraude { --accent: #17703E; }
[data-theme="clair"] .fil-page--or       { --accent: #8A6208; }
[data-theme="clair"] .of-carte--clair    { --of-accent: #2F6B4C; }
[data-theme="clair"] .of-carte--emeraude { --of-accent: #17703E; }
[data-theme="clair"] .of-carte--or       { --of-accent: #8A6208; }

/* ── Boutons ─────────────────────────────────────────────────── */
/* L'émeraude reste le fond ; le texte passe en blanc (5,4:1). */
[data-theme="clair"] .fil-btn--primary,
[data-theme="clair"] .btn--primary { color: #fff; }
[data-theme="clair"] .fil-btn--ghost {
  color: var(--encre); border-color: var(--bord); background: #fff;
}
[data-theme="clair"] .fil-btn--ghost:hover { border-color: var(--accent-texte); }
[data-theme="clair"] .fil-badge { color: var(--accent-texte); border-color: rgba(27,107,53,.35); }

/* ── Inscription ─────────────────────────────────────────────── */
[data-theme="clair"] .ins-card { background: #fff; border-color: var(--bord); }
[data-theme="clair"] .ins-intro__title,
[data-theme="clair"] .step__title { color: var(--encre); }
[data-theme="clair"] .ins-intro__sub,
[data-theme="clair"] .field__hint,
[data-theme="clair"] .steps__label { color: var(--encre-douce); }
[data-theme="clair"] .ins-intro__eyebrow { color: var(--or-texte); }
[data-theme="clair"] .page-inscription .req { color: #A3400F; }
[data-theme="clair"] .page-inscription .opt { color: var(--encre-tenue); }
[data-theme="clair"] .page-inscription .field label { color: var(--encre); }
[data-theme="clair"] .page-inscription .field input,
[data-theme="clair"] .page-inscription .field select,
[data-theme="clair"] .page-inscription .field textarea {
  background: #fff; color: var(--encre);
  border-color: rgba(11,18,14,.2);
  color-scheme: light;
}
[data-theme="clair"] .steps::before { background: rgba(11,18,14,.14); }
[data-theme="clair"] .steps__dot { background: #fff; border-color: rgba(11,18,14,.2); color: var(--encre); }
[data-theme="clair"] .steps__item.is-current .steps__dot { background: var(--green); border-color: var(--green); color: #fff; }
[data-theme="clair"] .steps__item.is-current .steps__label { color: var(--encre); }
[data-theme="clair"] .ins-header__back { background: rgba(11,18,14,.06); border-color: var(--bord); color: var(--encre); }
[data-theme="clair"] .ins-footnote { color: var(--encre-tenue); }
[data-theme="clair"] .recap { background: rgba(46,158,79,.08); border-color: rgba(27,107,53,.3); color: var(--encre); }
[data-theme="clair"] .recap strong { color: var(--or-texte); }
[data-theme="clair"] .consent { color: var(--encre-douce); }
[data-theme="clair"] .mobilite { background: rgba(46,158,79,.06); border-color: rgba(27,107,53,.35); }
[data-theme="clair"] .mobilite__titre { color: var(--accent-texte); }
[data-theme="clair"] .pieces-note { background: var(--fond-alt); border-color: var(--bord); color: var(--encre-douce); }
[data-theme="clair"] .pieces-note a { color: var(--accent-texte); }
[data-theme="clair"] .ins-back-home--pieces { color: var(--accent-texte); }

/* ── Pied de page ────────────────────────────────────────────── */
[data-theme="clair"] .footer { border-top-color: var(--bord); color: var(--encre-douce); }
[data-theme="clair"] .footer__legal { color: var(--encre-tenue); }

/* L'anneau de focus jaune est invisible sur fond clair : vert foncé. */
[data-theme="clair"] :focus-visible { outline-color: var(--accent-texte); }

/* Nav mobile dépliée (sous 1120 px) : fond opaque clair. */
[data-theme="clair"] .hd.is-open .hd__nav a { color: var(--encre); }

/* Frais de scolarité (frais-scolarite.html) */
[data-theme="clair"] .fr-simu,
[data-theme="clair"] .fr-table-wrap { background: var(--fond-carte); border-color: var(--bord); }
[data-theme="clair"] .fr-simu__sous,
[data-theme="clair"] .fr-ligne__quoi,
[data-theme="clair"] .fr-rentree__detail { color: var(--encre-douce); }
[data-theme="clair"] .fr-panneau { background: var(--fond-alt); border-color: var(--bord); }
[data-theme="clair"] .fr-panneau--rentree {
  background: linear-gradient(160deg, #E7F3E9 0%, #F2F8F3 100%);
  border-color: rgba(46,158,79,.35);
}
[data-theme="clair"] .fr-panneau__titre,
[data-theme="clair"] .fr-ligne__quand,
[data-theme="clair"] .fr-mini { color: var(--encre-tenue); }
[data-theme="clair"] .fr-rentree__total { color: var(--encre); }
[data-theme="clair"] .fr-rentree__note { color: var(--or-texte); }
[data-theme="clair"] .fr-ligne { border-bottom-color: var(--bord); }
[data-theme="clair"] .fr-ligne--totale { border-top-color: var(--bord); }
[data-theme="clair"] .fr-ligne--totale .fr-ligne__combien { color: var(--accent-texte); }
[data-theme="clair"] .fr-select {
  background-color: #fff; color: var(--encre); border-color: var(--bord);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%230B120E' stroke-width='2'/%3E%3C/svg%3E");
  color-scheme: light;
}
[data-theme="clair"] .fr-seg { background: var(--fond-alt); border-color: var(--bord); }
[data-theme="clair"] .fr-seg__btn { color: var(--encre-douce); }
[data-theme="clair"] .fr-seg__btn:hover { color: var(--encre); }
[data-theme="clair"] .fr-seg__btn.is-actif { background: var(--green); color: #fff; }
[data-theme="clair"] .fr-table th { color: var(--encre-tenue); border-bottom-color: var(--bord); }
[data-theme="clair"] .fr-table td { border-bottom-color: var(--bord); }

/* Les couleurs de la grille : les teintes pastel du fond sombre
   deviennent des encres soutenues sur fond clair. */
[data-theme="clair"] .fr-t--dut { background: rgba(15,118,110,.055); }
[data-theme="clair"] .fr-t--dut .fr-niveau { color: #0F766E; }
[data-theme="clair"] .fr-t--lic { background: rgba(22,101,52,.055); }
[data-theme="clair"] .fr-t--lic .fr-niveau { color: #166534; }
[data-theme="clair"] .fr-t--mas { background: rgba(161,98,7,.06); }
[data-theme="clair"] .fr-t--mas .fr-niveau { color: #A16207; }
[data-theme="clair"] .fr-table th.fr-c--comptant, [data-theme="clair"] .fr-table td.fr-c--comptant { color: #15803D; }
[data-theme="clair"] .fr-table th.fr-c--tranches, [data-theme="clair"] .fr-table td.fr-c--tranches { color: #A16207; }
[data-theme="clair"] .fr-table th.fr-c--mensu,    [data-theme="clair"] .fr-table td.fr-c--mensu    { color: #0F766E; }
[data-theme="clair"] .fr-table td.fr-c--comptant .fr-mini { color: rgba(21,128,61,.65); }
/* Cartes du tableau sur téléphone (voir css/frais.css) */
@media (max-width: 720px) {
  [data-theme="clair"] .fr-table tr { background: #fff; border-color: var(--bord); }
  [data-theme="clair"] .fr-table td { border-bottom-color: var(--bord); }
  [data-theme="clair"] .fr-table td::before { color: var(--encre-tenue); }
  [data-theme="clair"] .fr-table td.fr-niveau {
    background: var(--fond-alt); border-bottom-color: var(--bord);
  }
  [data-theme="clair"] .fr-t--dut { background: rgba(15,118,110,.05); }
  [data-theme="clair"] .fr-t--lic { background: rgba(22,101,52,.05); }
  [data-theme="clair"] .fr-t--mas { background: rgba(161,98,7,.055); }
}

/* ── Formation continue (css/soir.css) ───────────────────────────
   La carte du soir reste bleu nuit dans les deux thèmes — ses couleurs
   sont posées en dur, rien à reprendre ici. Mais l'en-tête de section et
   les cartes de parcours vivent sur le fond de page : eux doivent suivre
   le thème, sinon c'est du blanc sur blanc. */
[data-theme="clair"] .soir-titre { color: var(--encre); }
[data-theme="clair"] .soir-sous { color: var(--encre-douce); }
[data-theme="clair"] .soir-eyebrow { color: #0E6E9E; }
[data-theme="clair"] .soir-eyebrow__dot {
  background: #0E6E9E; box-shadow: 0 0 0 0 rgba(14,110,158,.6);
}
[data-theme="clair"] .soir-niveau {
  background: #fff; border-color: var(--bord);
}
[data-theme="clair"] .soir-niveau__tete { border-bottom-color: var(--bord); }
[data-theme="clair"] .soir-niveau__nom { color: var(--accent-texte); }
[data-theme="clair"] .soir-niveau__duree { color: var(--encre-tenue); }
[data-theme="clair"] .soir-niveau li { color: var(--encre-douce); }

/* ── Pastille de thème & langue en pied de page ──────────────────
   Les verts clairs des icônes (menthe, lime) tombent à 1,4:1 sur un
   fond blanc : sur le thème clair ils passent aux verts soutenus déjà
   employés pour le texte accentué. */
[data-theme="clair"] .theme-switch__btn { color: rgba(27,107,53,.5); }
[data-theme="clair"] .theme-switch__btn:hover { color: var(--accent-texte); }
[data-theme="clair"] .theme-switch__btn[data-theme-btn="clair"]:hover { color: #4D7C0F; }
[data-theme="clair"] .theme-switch__btn[aria-current="true"] {
  background: rgba(46,158,79,.16); color: #15803D;
}
[data-theme="clair"] .theme-switch__btn[data-theme-btn="clair"][aria-current="true"] {
  background: rgba(132,204,22,.22); color: #4D7C0F;
}
[data-theme="clair"] .pied-langue__label { color: var(--encre-tenue); }
[data-theme="clair"] .regime__titre { color: var(--encre); }
[data-theme="clair"] .regime__opt { background: #fff; border-color: rgba(11,18,14,.18); }
[data-theme="clair"] .regime__opt:has(input:checked) {
  border-color: var(--green); background: rgba(46,158,79,.08);
}
[data-theme="clair"] .regime__det { color: var(--encre-douce); }