/* ============================================================================
   Mode accessibilité — activé par data-a11y="1" sur <html>.
   Chargé APRÈS le <style> de chaque page : un seul fichier surcharge la palette
   des 28 pages statiques ET des pages générées par server.js, sans dupliquer.

   Axe indépendant du thème : il se combine avec clair OU sombre, parce que le
   besoin diffère (photophobie -> sombre ; certaines basses visions -> clair).

   Palette validée par calcul, pas à l'œil :
     · tous les textes ≥ 7:1 (WCAG AAA, au-delà du 4.5:1 exigé par RGAA 3.2)
     · bordures et composants ≥ 3:1 (RGAA 3.3)
     · focus ≥ 3:1 (RGAA 10.7)
     · contrastes vérifiés après simulation deutéranopie / protanopie / tritanopie
   Le contraste repose sur la LUMINANCE, jamais sur la teinte seule : les liens
   sont donc toujours soulignés (RGAA 10.6) et jamais signalés par la couleur seule.
   ============================================================================ */

/* ---------- Sombre accessible (défaut du mode) ---------- */
:root[data-a11y="1"] {
  --bg: #000000;   --bg2: #101F26;  --bg3: #1B2F38;  --bg4: #24404B;
  --fg: #FFFFFF;   --fg2: #EDF6F9;  --fg3: #C6DAE3;  --fg4: #B3CBD6;
  --cy: #7FDCF5;   --cy-l: #7FDCF5; --cy-d: #5AB8D4;
  --gr: #7FE8BE;   --gr-d: #5AC49A; --deep: #101F26;
  --bd: #8AA5B1;   --bd2: #8AA5B1;  --bd3: #C6DAE3;
  --s1: #101F26;   --s2: #1B2F38;
  --glo: #8AA5B1;  --glo2: #8AA5B1;
  --nav-bg: #000000;
  /* Les dégradés portaient du texte blanc illisible : on passe en aplat. */
  --grad: #7FDCF5; --grad-r: #7FDCF5;
  --grad-soft: #101F26;
  --a11y-btn-fg: #00131B;   /* texte sur bouton principal — 12.1:1 */
  --a11y-focus: #FFD24A;    /* jaune hors palette de marque — 9.7:1 sur le fond */
  --a11y-on-accent: #00131B;
}

/* ---------- Clair accessible ---------- */
:root[data-a11y="1"][data-theme="light"] {
  --bg: #FFFFFF;   --bg2: #EFF6F8;  --bg3: #E1EDF1;  --bg4: #D2E3E9;
  --fg: #000000;   --fg2: #13252C;  --fg3: #2F4A55;  --fg4: #314D58;
  --cy: #0A4A63;   --cy-l: #0A4A63; --cy-d: #073949;
  --gr: #0B4F38;   --gr-d: #083B2A; --deep: #13252C;
  --bd: #4A6570;   --bd2: #4A6570;  --bd3: #2F4A55;
  --s1: #EFF6F8;   --s2: #E1EDF1;
  --glo: #4A6570;  --glo2: #4A6570;
  --nav-bg: #FFFFFF;
  --grad: #0A4A63; --grad-r: #0A4A63;
  --grad-soft: #EFF6F8;
  --a11y-btn-fg: #FFFFFF;   /* texte sur bouton principal — 9.7:1 */
  --a11y-focus: #8A3D00;    /* brun soutenu — 6.4:1 sur le fond */
  --a11y-on-accent: #FFFFFF;
}

/* ---------- RGAA 10.6 : un lien ne se signale jamais par la seule couleur ---------- */
:root[data-a11y="1"] main a,
:root[data-a11y="1"] footer a,
:root[data-a11y="1"] .fcol a,
:root[data-a11y="1"] p a,
:root[data-a11y="1"] li a {
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-thickness: 1px;
  text-decoration-color: currentColor;
}

/* ---------- RGAA 10.7 : focus toujours visible, même au clavier seul ---------- */
:root[data-a11y="1"] :focus-visible {
  outline: 3px solid var(--a11y-focus) !important;
  outline-offset: 2px !important;
  border-radius: 2px;
}
/* Les pages posent outline:none en comptant sur un box-shadow : on rétablit. */
:root[data-a11y="1"] input:focus-visible,
:root[data-a11y="1"] textarea:focus-visible,
:root[data-a11y="1"] select:focus-visible,
:root[data-a11y="1"] button:focus-visible,
:root[data-a11y="1"] a:focus-visible,
:root[data-a11y="1"] summary:focus-visible {
  outline: 3px solid var(--a11y-focus) !important;
  outline-offset: 2px !important;
}

/* ---------- Texte en dégradé : illisible, on repasse en aplat ---------- */
:root[data-a11y="1"] .ci-h em,
:root[data-a11y="1"] .cta-h em,
:root[data-a11y="1"] .why-h em,
:root[data-a11y="1"] .stat .v {
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  color: var(--cy-l) !important;
}

/* ---------- Boutons : le color:#fff des pages est en dur, on le corrige ---------- */
:root[data-a11y="1"] .btn-c,
:root[data-a11y="1"] .btn-c:hover {
  background: var(--grad) !important;
  color: var(--a11y-btn-fg) !important;
  border: 1px solid var(--a11y-btn-fg);
  box-shadow: none !important;
  filter: none !important;
}
/* Boutons des formulaires générés (actualités, newsletter) : même traitement. */
:root[data-a11y="1"] form button[style],
:root[data-a11y="1"] main form button {
  background: var(--grad) !important;
  color: var(--a11y-btn-fg) !important;
  border: 1px solid var(--a11y-btn-fg) !important;
}
:root[data-a11y="1"] .badge,
:root[data-a11y="1"] .st-nouveau {
  background: var(--grad) !important;
  color: var(--a11y-on-accent) !important;
}

/* ---------- Repères non colorés : bordures franches plutôt que halos ---------- */
:root[data-a11y="1"] .card,
:root[data-a11y="1"] .stat,
:root[data-a11y="1"] .pcard,
:root[data-a11y="1"] .postform,
:root[data-a11y="1"] .video,
:root[data-a11y="1"] figure img {
  border: 1px solid var(--bd2) !important;
}
:root[data-a11y="1"] .nav {
  border-bottom: 2px solid var(--bd2) !important;
  backdrop-filter: none !important;
  background: var(--nav-bg) !important;
}

/* ---------- Confort de lecture (basse vision) ---------- */
:root[data-a11y="1"] body { line-height: 1.75; }
:root[data-a11y="1"] p,
:root[data-a11y="1"] li { font-weight: 400; }   /* le 300 d'origine est trop fin */
:root[data-a11y="1"] main { letter-spacing: .01em; }

/* ---------- Animations : le mode s'adresse aussi aux sensibilités vestibulaires ---------- */
:root[data-a11y="1"] *,
:root[data-a11y="1"] *::before,
:root[data-a11y="1"] *::after {
  animation-duration: .001ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: .001ms !important;
}
:root[data-a11y="1"] .rev { opacity: 1 !important; transform: none !important; }

/* ---------- Le bouton lui-même ---------- */
.a11y-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; padding: 0;
  border-radius: 10px; border: 1px solid var(--bd2);
  background: var(--s1); color: var(--fg2);
  cursor: pointer; flex: none;
}
.a11y-btn:hover { border-color: var(--bd3); color: var(--fg); }
.a11y-btn svg { width: 19px; height: 19px; display: block; }
.a11y-btn[aria-pressed="true"] {
  background: var(--cy-l); color: var(--bg); border-color: var(--cy-l);
}
:root[data-a11y="1"] .a11y-btn[aria-pressed="true"] {
  background: var(--grad); color: var(--a11y-btn-fg); border-color: var(--a11y-btn-fg);
}
/* Dans la barre des pages secondaires et des actualités */
.nav-in .a11y-btn { margin-left: auto; margin-right: 12px; }
