/* Thème du site : TOUTES les couleurs viennent d'ici (charte Hoxidia modeles/CHARTE-VISUELLE.md, 16/10/2026).
   Quatre thèmes, chacun en clair et en sombre ; « Bleu Datachimy » par défaut. Depuis le 17/10 (minuit, Fidèle) :
   bleu + VERT seulement. Le vert (--accent-2) remplace l'orange ; plus d'ambre ni de violet ; le rouge ne sert qu'aux
   vraies erreurs, en liseré ; l'avertissement est gris foncé avec une icône. Le vert clair #16A34A n'est jamais un
   texte sur fond clair (3,3:1) : seulement trait, contour, ou texte sur panneau sombre. Le choix du visiteur (pied de page,
   « Apparence ») est posé par /js/theme.js sur <html> : data-theme (datachimy, royal, nuit, petrole) et data-mode
   (clair, sombre ; absent = suivre l'appareil). Un test vérifie le contraste AA des 8 combinaisons.
   Écarts voulus avec les valeurs de la charte, pour tenir le contraste AA qu'elle exige (16/10/2026) : fond des
   boutons plus foncé en Bleu Datachimy sombre (#2F7AAD) et Bleu royal sombre (#436EE0), accent de Nuit Jarvis
   clair #077B97 (au lieu de #0891B2), vert de Bleu Datachimy clair #167C3D (au lieu de #17803F). */
/* Bleu Datachimy */
:root,:root[data-theme="datachimy"]{
  color-scheme:light;
  --entete:#11649B;
  --fond:#F3F8FC;
  --surface:#FFFFFF;
  --bord:#D6E6F2;
  --texte:#0B2A42;
  --doux:#557590;
  --accent:#11649B;
  --sur-accent:#FFFFFF;
  --bleu-doux:#E1EFF9;
  --bleu-texte:#0C4F7C;
  --rouge-doux:#FDE3E5;
  --rouge:#C42B3A;
  --vert-doux:#DDF6E6;
  --vert:#167C3D;
  --accent-2:#16A34A;
  --sur-entete:#FFFFFF;
  --sur-entete-doux:rgba(255,255,255,.86);
  --entete-trait:var(--accent-2);
  --entete-bouton:#FFFFFF;
  --sur-entete-bouton:var(--entete);
  --logo-fond:#FFFFFF;
  --logo-etoile:var(--entete);
}
@media (prefers-color-scheme:dark){
:root:not([data-theme]):not([data-mode="clair"]),:root[data-theme="datachimy"]:not([data-mode="clair"]){
    color-scheme:dark;
    --entete:#0F3D63;
    --fond:#071B2E;
    --surface:#0D2A45;
    --bord:#1D4466;
    --texte:#EAF4FC;
    --doux:#9DBCD6;
    --accent:#3C9BDB;
  --fond-bouton:#2F7AAD;
    --sur-accent:#FFFFFF;
    --bleu-doux:#123A5C;
    --bleu-texte:#CDE6F8;
    --rouge-doux:#3F1620;
    --rouge:#FF7A85;
    --vert-doux:#0D3A2C;
    --vert:#4ADE80;
    --accent-2:#34D399;
    --sur-entete:#FFFFFF;
    --sur-entete-doux:rgba(255,255,255,.86);
    --entete-trait:var(--accent-2);
    --entete-bouton:#FFFFFF;
    --sur-entete-bouton:var(--entete);
    --logo-fond:#FFFFFF;
    --logo-etoile:var(--entete);
  }
}
:root[data-mode="sombre"]:not([data-theme]),:root[data-theme="datachimy"][data-mode="sombre"]{
  color-scheme:dark;
  --entete:#0F3D63;
  --fond:#071B2E;
  --surface:#0D2A45;
  --bord:#1D4466;
  --texte:#EAF4FC;
  --doux:#9DBCD6;
  --accent:#3C9BDB;
  --fond-bouton:#2F7AAD;
  --sur-accent:#FFFFFF;
  --bleu-doux:#123A5C;
  --bleu-texte:#CDE6F8;
  --rouge-doux:#3F1620;
  --rouge:#FF7A85;
  --vert-doux:#0D3A2C;
  --vert:#4ADE80;
  --accent-2:#34D399;
  --sur-entete:#FFFFFF;
  --sur-entete-doux:rgba(255,255,255,.86);
  --entete-trait:var(--accent-2);
  --entete-bouton:#FFFFFF;
  --sur-entete-bouton:var(--entete);
  --logo-fond:#FFFFFF;
  --logo-etoile:var(--entete);
}
/* Bleu royal */
:root[data-theme="royal"]{
  color-scheme:light;
  --fond:#F4F7FF;
  --surface:#FFFFFF;
  --bord:#DCE4F8;
  --texte:#0B1640;
  --doux:#5A6890;
  --accent:#1D4ED8;
  --sur-accent:#FFFFFF;
  --bleu-doux:#DCE7FF;
  --bleu-texte:#1E3A8A;
  --rouge-doux:#FDE2E4;
  --rouge:#C81E3A;
  --vert-doux:#DCFCE7;
  --vert:#15803D;
  --entete:var(--surface);
  --sur-entete:var(--texte);
  --sur-entete-doux:var(--doux);
  --entete-trait:var(--accent);
  --entete-bouton:var(--fond-bouton);
  --sur-entete-bouton:var(--sur-accent);
  --logo-fond:var(--accent);
  --logo-etoile:var(--sur-accent);
  --accent-2:#16A34A;
}
@media (prefers-color-scheme:dark){
:root[data-theme="royal"]:not([data-mode="clair"]){
    color-scheme:dark;
    --fond:#070D24;
    --surface:#0F1A3D;
    --bord:#22306A;
    --texte:#EAF0FF;
    --doux:#9FB0E0;
    --accent:#4C7DFF;
  --fond-bouton:#436EE0;
    --sur-accent:#FFFFFF;
    --bleu-doux:#1A2A66;
    --bleu-texte:#CFE0FF;
    --rouge-doux:#3D1220;
    --rouge:#FF6B81;
    --vert-doux:#0E3326;
    --vert:#4ADE80;
    --entete:var(--surface);
    --sur-entete:var(--texte);
    --sur-entete-doux:var(--doux);
    --entete-trait:var(--accent);
    --entete-bouton:var(--fond-bouton);
    --sur-entete-bouton:var(--sur-accent);
    --logo-fond:var(--accent);
    --logo-etoile:var(--sur-accent);
    --accent-2:#34D399;
  }
}
:root[data-theme="royal"][data-mode="sombre"]{
  color-scheme:dark;
  --fond:#070D24;
  --surface:#0F1A3D;
  --bord:#22306A;
  --texte:#EAF0FF;
  --doux:#9FB0E0;
  --accent:#4C7DFF;
  --fond-bouton:#436EE0;
  --sur-accent:#FFFFFF;
  --bleu-doux:#1A2A66;
  --bleu-texte:#CFE0FF;
  --rouge-doux:#3D1220;
  --rouge:#FF6B81;
  --vert-doux:#0E3326;
  --vert:#4ADE80;
  --entete:var(--surface);
  --sur-entete:var(--texte);
  --sur-entete-doux:var(--doux);
  --entete-trait:var(--accent);
  --entete-bouton:var(--fond-bouton);
  --sur-entete-bouton:var(--sur-accent);
  --logo-fond:var(--accent);
  --logo-etoile:var(--sur-accent);
  --accent-2:#34D399;
}
/* Nuit Jarvis */
:root[data-theme="nuit"]{
  color-scheme:light;
  --fond:#F0FBFD;
  --surface:#FFFFFF;
  --bord:#D2EEF4;
  --texte:#06222C;
  --doux:#4E7480;
  --accent:#077B97;
  --sur-accent:#FFFFFF;
  --bleu-doux:#E0F2FE;
  --bleu-texte:#075985;
  --rouge-doux:#FFE4E6;
  --rouge:#BE123C;
  --vert-doux:#D1FAE5;
  --vert:#047857;
  --entete:var(--surface);
  --sur-entete:var(--texte);
  --sur-entete-doux:var(--doux);
  --entete-trait:var(--accent);
  --entete-bouton:var(--fond-bouton);
  --sur-entete-bouton:var(--sur-accent);
  --logo-fond:var(--accent);
  --logo-etoile:var(--sur-accent);
  --accent-2:#16A34A;
}
@media (prefers-color-scheme:dark){
:root[data-theme="nuit"]:not([data-mode="clair"]){
    color-scheme:dark;
    --fond:#050816;
    --surface:#0B1230;
    --bord:#1B2A5A;
    --texte:#E6FBFF;
    --doux:#8FB3C8;
    --accent:#22D3EE;
    --sur-accent:#03202A;
    --bleu-doux:#0C2A44;
    --bleu-texte:#BAE6FD;
    --rouge-doux:#3A0F24;
    --rouge:#FB7185;
    --vert-doux:#06302A;
    --vert:#34D399;
    --entete:var(--surface);
    --sur-entete:var(--texte);
    --sur-entete-doux:var(--doux);
    --entete-trait:var(--accent);
    --entete-bouton:var(--fond-bouton);
    --sur-entete-bouton:var(--sur-accent);
    --logo-fond:var(--accent);
    --logo-etoile:var(--sur-accent);
    --accent-2:#34D399;
  }
}
:root[data-theme="nuit"][data-mode="sombre"]{
  color-scheme:dark;
  --fond:#050816;
  --surface:#0B1230;
  --bord:#1B2A5A;
  --texte:#E6FBFF;
  --doux:#8FB3C8;
  --accent:#22D3EE;
  --sur-accent:#03202A;
  --bleu-doux:#0C2A44;
  --bleu-texte:#BAE6FD;
  --rouge-doux:#3A0F24;
  --rouge:#FB7185;
  --vert-doux:#06302A;
  --vert:#34D399;
  --entete:var(--surface);
  --sur-entete:var(--texte);
  --sur-entete-doux:var(--doux);
  --entete-trait:var(--accent);
  --entete-bouton:var(--fond-bouton);
  --sur-entete-bouton:var(--sur-accent);
  --logo-fond:var(--accent);
  --logo-etoile:var(--sur-accent);
  --accent-2:#34D399;
}
/* Pétrole et or */
:root[data-theme="petrole"]{
  color-scheme:light;
  --fond:#F1FAF8;
  --surface:#FFFFFF;
  --bord:#CDEBE5;
  --texte:#05302B;
  --doux:#4F7A73;
  --accent:#0F766E;
  --sur-accent:#FFFFFF;
  --bleu-doux:#CCFBF1;
  --bleu-texte:#115E59;
  --rouge-doux:#FEE2E2;
  --rouge:#B91C1C;
  --vert-doux:#DCFCE7;
  --vert:#166534;
  --entete:var(--surface);
  --sur-entete:var(--texte);
  --sur-entete-doux:var(--doux);
  --entete-trait:var(--accent);
  --entete-bouton:var(--fond-bouton);
  --sur-entete-bouton:var(--sur-accent);
  --logo-fond:var(--accent);
  --logo-etoile:var(--sur-accent);
  --accent-2:#16A34A;
}
@media (prefers-color-scheme:dark){
:root[data-theme="petrole"]:not([data-mode="clair"]){
    color-scheme:dark;
    --fond:#041A1F;
    --surface:#0A2C33;
    --bord:#164A52;
    --texte:#E8FBF7;
    --doux:#8DBDB4;
    --accent:#2DD4BF;
    --sur-accent:#022C27;
    --bleu-doux:#123F47;
    --bleu-texte:#B6F0E6;
    --rouge-doux:#3D1418;
    --rouge:#F87171;
    --vert-doux:#0B3B2A;
    --vert:#4ADE80;
    --entete:var(--surface);
    --sur-entete:var(--texte);
    --sur-entete-doux:var(--doux);
    --entete-trait:var(--accent);
    --entete-bouton:var(--fond-bouton);
    --sur-entete-bouton:var(--sur-accent);
    --logo-fond:var(--accent);
    --logo-etoile:var(--sur-accent);
    --accent-2:#34D399;
  }
}
:root[data-theme="petrole"][data-mode="sombre"]{
  color-scheme:dark;
  --fond:#041A1F;
  --surface:#0A2C33;
  --bord:#164A52;
  --texte:#E8FBF7;
  --doux:#8DBDB4;
  --accent:#2DD4BF;
  --sur-accent:#022C27;
  --bleu-doux:#123F47;
  --bleu-texte:#B6F0E6;
  --rouge-doux:#3D1418;
  --rouge:#F87171;
  --vert-doux:#0B3B2A;
  --vert:#4ADE80;
  --entete:var(--surface);
  --sur-entete:var(--texte);
  --sur-entete-doux:var(--doux);
  --entete-trait:var(--accent);
  --entete-bouton:var(--fond-bouton);
  --sur-entete-bouton:var(--sur-accent);
  --logo-fond:var(--accent);
  --logo-etoile:var(--sur-accent);
  --accent-2:#34D399;
}

/* Correspondance avec les noms de couleurs déjà utilisés par les feuilles du site (boutique.css, pages.css,
   accueil, stats.css) : on ne change les couleurs qu'ici. */
:root{
  --ink:var(--texte);
  --ink-2:color-mix(in srgb,var(--texte) 82%,var(--doux));
  --ink-3:var(--doux);
  --blue:var(--accent);
  --blue-2:var(--accent);
  --blue-wash:var(--bleu-doux);
  --fond-bouton:var(--accent);
  --bouton:var(--fond-bouton);
  --sur-bouton:var(--sur-accent);
  --bouton-survol:color-mix(in srgb,var(--accent) 86%,#000);
  --green:var(--vert);
  --vert-texte:var(--vert);
  --line:var(--bord);
  --white:var(--surface);
  --zone:var(--fond);
  --carte:var(--surface);
  --tete:var(--entete);
  --nuit:color-mix(in srgb,var(--accent) 22%,#06101C);
  --sur-nuit:#FFFFFF;
  --sur-nuit-doux:rgba(255,255,255,.78);
  --trait-nuit:rgba(255,255,255,.16);
  --red:var(--rouge);
  --err-fond:var(--surface);
  --err-texte:var(--texte);
  --err-bord:var(--rouge);
  --ok-fond:var(--vert-doux);
  --ok-texte:var(--vert);
  --ok-bord:var(--vert);
  --alerte-fond:var(--surface);
  --alerte-bord:var(--bord);
  --alerte-texte:var(--texte);
  --alerte-trait:var(--doux);
  --bord-survol:color-mix(in srgb,var(--accent) 45%,var(--bord));
  --barre-nuage:var(--bord);
}

/* Réglage « Apparence » (pied de page de toutes les pages ; script /js/theme.js) */
.apparence{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;width:100%;padding-top:14px;border-top:1px solid var(--bord)}
.apparence[hidden]{display:none}
.apparence select{font:inherit;font-size:.86rem;color:var(--texte);background:var(--surface);border:1px solid var(--bord);border-radius:8px;padding:6px 10px}
.lecteur{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}