/* ==========================================================================
   themes.css — jetons de COULEUR sémantiques pour les 6 combinaisons.
   Ambiances : data-ambiance="blue|green|aubergine" (bleu = défaut).
   Modes     : data-mode="light|dark" ; sans data-mode = « auto » (suit l'OS).
   Aucun composant ne doit référencer une couleur brute : uniquement ces variables.
   ========================================================================== */

/* --- CLAIR : base = Bleu, puis variantes d'ambiance ---------------------- */

:root,
[data-ambiance="blue"] {
  color-scheme: light;
  --bg: #F8FAFC;
  --surface: #FFFFFF;
  --surface-2: #EFF4F9;
  --text: #1C2B39;
  --muted: #45596D;
  --faint: #556A7E; /* RGAA 3.2 : ≥4.5:1 sur surface-2 (5.06) — anciennement #5E7285 (4.49, échec) */
  --primary: #0866D9;
  --primary-hover: #0A5AC0;
  --on-primary: #FFFFFF;
  --deep: #163A5F;
  --on-deep: #FFFFFF;
  --deep-muted: #B8CDE0;
  --accent: #EAF3FC;
  --accent-border: #BBD6F2;
  --border: #CFDBE8;
  --border-strong: #6E8399;
  --focus: #0653B0;
  --footer-bg: #111820;
  --footer-text: #C3D0DB;
}

[data-ambiance="green"] {
  color-scheme: light;
  --bg: #F6FBF9;
  --surface: #FFFFFF;
  --surface-2: #ECFDF5;
  --text: #0F2A22;
  --muted: #35544A;
  --faint: #557165;
  --primary: #047857;
  --primary-hover: #036048;
  --on-primary: #FFFFFF;
  --deep: #0B3B2E;
  --on-deep: #FFFFFF;
  --deep-muted: #A9D6C7;
  --accent: #ECFDF5;
  --accent-border: #B7E4CF;
  --border: #C6DED0;
  --border-strong: #6E9082;
  --focus: #036048;
  --footer-bg: #0C1512;
  --footer-text: #B4CCC2;
}

[data-ambiance="aubergine"] {
  color-scheme: light;
  --bg: #FAF7FA;
  --surface: #FFFFFF;
  --surface-2: #F4EAF3;
  --text: #2A1F2C;
  --muted: #574A5B;
  --faint: #665770; /* RGAA 3.2 : marge renforcée sur surface-2 (5.66) */
  --primary: #7C3F79;
  --primary-hover: #6A356A;
  --on-primary: #FFFFFF;
  --deep: #3D2440;
  --on-deep: #FFFFFF;
  --deep-muted: #D8BFD7;
  --accent: #F4EAF3;
  --accent-border: #E0C9DF;
  --border: #D9C6D8;
  --border-strong: #937B97;
  --focus: #6A356A;
  --footer-bg: #171017;
  --footer-text: #CBBBCD;
}

/* --- SOMBRE explicite (data-mode="dark") --------------------------------- */

[data-mode="dark"],
[data-mode="dark"][data-ambiance="blue"] {
  color-scheme: dark;
  --bg: #111820;
  --surface: #18232D;
  --surface-2: #21303D;
  --text: #F2F6FA;
  --muted: #C6D2DC;
  --faint: #9DB0BE;
  --primary: #55B4FF;
  --primary-hover: #7FC4FF;
  --on-primary: #0B1B2B;
  --deep: #0E2136;
  --on-deep: #F2F6FA;
  --deep-muted: #AECBE2;
  --accent: #17324A;
  --accent-border: #2C4A66;
  --border: #34485A;
  --border-strong: #6D8398;
  --focus: #79C3FF;
  --footer-bg: #0B1119;
  --footer-text: #AFC0CD;
}

[data-mode="dark"][data-ambiance="green"] {
  color-scheme: dark;
  --bg: #111A17;
  --surface: #18241F;
  --surface-2: #21302A;
  --text: #EAF6F1;
  --muted: #B9D0C7;
  --faint: #93B3A6;
  --primary: #34D399;
  --primary-hover: #5FE0AE;
  --on-primary: #06231A;
  --deep: #0C2A20;
  --on-deep: #EAF6F1;
  --deep-muted: #A9D6C7;
  --accent: #123A2C;
  --accent-border: #1E5140;
  --border: #35473E;
  --border-strong: #6C8B7D;
  --focus: #5FE0AE;
  --footer-bg: #0A120F;
  --footer-text: #A7C3B8;
}

[data-mode="dark"][data-ambiance="aubergine"] {
  color-scheme: dark;
  --bg: #17121A;
  --surface: #201826;
  --surface-2: #2B2032;
  --text: #F4EFF6;
  --muted: #D2C4D6;
  --faint: #AE99B4;
  --primary: #C79BE0;
  --primary-hover: #D6B4E9;
  --on-primary: #23162B;
  --deep: #2A1830;
  --on-deep: #F4EFF6;
  --deep-muted: #D8BFD7;
  --accent: #2E2036;
  --accent-border: #463453;
  --border: #45354B;
  --border-strong: #907E99;
  --focus: #D6B4E9;
  --footer-bg: #0F0B12;
  --footer-text: #C4B4CA;
}

/* --- AUTO : suit l'OS quand aucun mode clair n'est explicitement demandé -- */

@media (prefers-color-scheme: dark) {
  :root:not([data-mode="light"]),
  :root:not([data-mode="light"])[data-ambiance="blue"] {
    color-scheme: dark;
    --bg: #111820; --surface: #18232D; --surface-2: #21303D;
    --text: #F2F6FA; --muted: #C6D2DC; --faint: #9DB0BE;
    --primary: #55B4FF; --primary-hover: #7FC4FF; --on-primary: #0B1B2B;
    --deep: #0E2136; --on-deep: #F2F6FA; --deep-muted: #AECBE2;
    --accent: #17324A; --accent-border: #2C4A66;
    --border: #34485A; --border-strong: #6D8398; --focus: #79C3FF;
    --footer-bg: #0B1119; --footer-text: #AFC0CD;
  }
  :root:not([data-mode="light"])[data-ambiance="green"] {
    color-scheme: dark;
    --bg: #111A17; --surface: #18241F; --surface-2: #21302A;
    --text: #EAF6F1; --muted: #B9D0C7; --faint: #93B3A6;
    --primary: #34D399; --primary-hover: #5FE0AE; --on-primary: #06231A;
    --deep: #0C2A20; --on-deep: #EAF6F1; --deep-muted: #A9D6C7;
    --accent: #123A2C; --accent-border: #1E5140;
    --border: #35473E; --border-strong: #6C8B7D; --focus: #5FE0AE;
    --footer-bg: #0A120F; --footer-text: #A7C3B8;
  }
  :root:not([data-mode="light"])[data-ambiance="aubergine"] {
    color-scheme: dark;
    --bg: #17121A; --surface: #201826; --surface-2: #2B2032;
    --text: #F4EFF6; --muted: #D2C4D6; --faint: #AE99B4;
    --primary: #C79BE0; --primary-hover: #D6B4E9; --on-primary: #23162B;
    --deep: #2A1830; --on-deep: #F4EFF6; --deep-muted: #D8BFD7;
    --accent: #2E2036; --accent-border: #463453;
    --border: #45354B; --border-strong: #907E99; --focus: #D6B4E9;
    --footer-bg: #0F0B12; --footer-text: #C4B4CA;
  }
}
