/* Nuage : jetons de couleur et de matière, repris de Courrier (design/e-verre/css/jetons.css).
   tests-interface/contraste.py lit ce fichier : garder une déclaration par ligne et les deux
   blocs « clair » et « sombre ». js/theme.js pose data-theme avant le premier rendu. */

/* ---- clair ---- */
:root {
  color-scheme: light;
  --fond: #eef0f5;
  --tache-1: rgba(118, 132, 255, 0.16);
  --tache-2: rgba(80, 196, 186, 0.12);
  --tache-3: rgba(255, 176, 128, 0.10);

  --surface: #ffffff;
  --surface-2: #f4f5f8;
  --surface-3: #e9ebf0;
  --trait: rgba(20, 22, 30, 0.08);
  --trait-fort: rgba(20, 22, 30, 0.16);

  --texte: #15161a;
  --texte-2: #4a4d57;
  --texte-3: #686c77;

  --accent: #4338ca;
  --accent-fond: #4338ca;
  --accent-sur: #ffffff;
  --accent-doux: rgba(67, 56, 202, 0.10);
  --urgent: #b42318;
  --urgent-doux: rgba(180, 35, 24, 0.10);
  --succes: #1f7a4d;
  --succes-doux: rgba(31, 122, 77, 0.12);
  --alerte: #9a5b00;
  --alerte-doux: rgba(154, 91, 0, 0.12);
  /* Fonds pleins sous du texte blanc (pastilles) : identiques dans les deux thèmes. */
  --succes-fond: #1f7a4d;
  --alerte-fond: #9a5b00;
  --urgent-fond: #b42318;

  /* Teintes des types de fichiers (icônes sur surface pleine). */
  --t-dossier: #4f46e5;
  --t-image: #0f766e;
  --t-pdf: #b42318;
  --t-video: #be185d;
  --t-audio: #c2410c;
  --t-texte: #475569;
  --t-archive: #92400e;
  --t-code: #6d28d9;

  /* Verre : teinte posée sous le texte. Opacité choisie pour que --texte et
     --texte-2 restent >= 4,5:1 même si le fond derrière est noir pur. */
  --verre-teinte: 250, 251, 253;
  --verre: rgba(250, 251, 253, 0.78);
  --verre-fort: rgba(250, 251, 253, 0.86);
  --verre-plein: #f7f8fb;
  --mica: rgba(250, 251, 253, 0.55);
  --verre-trait: rgba(20, 22, 30, 0.10);
  --verre-reflet: rgba(255, 255, 255, 0.85);
  --verre-bord: rgba(255, 255, 255, 0.55);
  --voile: rgba(16, 18, 26, 0.28);

  --ombre-1: 0 1px 2px rgba(16, 18, 26, 0.06), 0 6px 18px rgba(16, 18, 26, 0.08);
  --ombre-2: 0 2px 6px rgba(16, 18, 26, 0.08), 0 18px 48px rgba(16, 18, 26, 0.18);
}

/* ---- sombre ---- */
:root[data-theme="sombre"] {
  color-scheme: dark;
  --fond: #0d0e12;
  --tache-1: rgba(99, 102, 241, 0.16);
  --tache-2: rgba(20, 184, 166, 0.09);
  --tache-3: rgba(236, 72, 153, 0.06);

  --surface: #17181d;
  --surface-2: #1e2026;
  --surface-3: #272a31;
  --trait: rgba(255, 255, 255, 0.07);
  --trait-fort: rgba(255, 255, 255, 0.14);

  --texte: #f2f3f5;
  --texte-2: #b9bcc6;
  --texte-3: #9a9eaa;

  --accent: #a5b4fc;
  --accent-fond: #818cf8;
  --accent-sur: #0d0e12;
  --accent-doux: rgba(129, 140, 248, 0.16);
  --urgent: #fca5a5;
  --urgent-doux: rgba(248, 113, 113, 0.14);
  --succes: #86efac;
  --succes-doux: rgba(74, 222, 128, 0.14);
  --alerte: #fcd34d;
  --alerte-doux: rgba(252, 211, 77, 0.12);

  --t-dossier: #a5b4fc;
  --t-image: #5eead4;
  --t-pdf: #fca5a5;
  --t-video: #f9a8d4;
  --t-audio: #fdba74;
  --t-texte: #cbd5e1;
  --t-archive: #fcd34d;
  --t-code: #c4b5fd;

  --verre-teinte: 24, 26, 32;
  --verre: rgba(24, 26, 32, 0.80);
  --verre-fort: rgba(24, 26, 32, 0.88);
  --verre-plein: #1b1d23;
  --mica: rgba(24, 26, 32, 0.55);
  --verre-trait: rgba(255, 255, 255, 0.10);
  --verre-reflet: rgba(255, 255, 255, 0.10);
  --verre-bord: rgba(255, 255, 255, 0.04);
  --voile: rgba(0, 0, 0, 0.50);

  --ombre-1: 0 1px 2px rgba(0, 0, 0, 0.30), 0 8px 24px rgba(0, 0, 0, 0.30);
  --ombre-2: 0 2px 8px rgba(0, 0, 0, 0.35), 0 24px 64px rgba(0, 0, 0, 0.50);
}