/* ─────────────────────────────────────────────────────────────────────
   tokens.css — la charte graphique Hexagone, en jetons.

   ⚠️⚠️ CE FICHIER NE SE MODIFIE PAS ICI. C'est une COPIE.

   La source unique est la charte graphique Hexagone (agence « Il était une
   Marque », édition 2024) et la maquette de référence de Cockpit, d'où ce
   bloc est repris tel quel. Les hexadécimaux ci-dessous ont été confrontés
   un à un à la charte officielle le 2026-09-14 : ils concordent.

   La règle qui va avec, et elle se paie cher quand on l'oublie : **aucune
   couleur ne s'écrit à la main dans le reste du code.** On emploie
   var(--…). Un code hexadécimal recopié ne suit ni une évolution de la
   charte ni un thème sombre — et il ne se signale jamais : il est
   simplement un peu faux.

   ⚠️ Aucune police n'est chargée depuis Internet. « Plus Jakarta Sans » est
   employée si le poste l'a, sinon la police du système prend le relais. Le
   navigateur d'un agent de collectivité ne doit interroger personne d'autre
   qu'Interstis.
   ───────────────────────────────────────────────────────────────────── */

:root {
  /* Les six couleurs du symbole Hexagone, et leurs déclinaisons foncées. */
  --hex-green: #00af9f;         --hex-green-deep: #00665b;
  --hex-blue: #4541ff;          --hex-blue-light: #cdddff;
  --hex-blue-deep: #102c96;     --hex-blue-light-deep: #4e89e5;
  --hex-pink: #dd179c;          --hex-pink-deep: #9e1058;
  --hex-yellow: #fbba33;        --hex-yellow-deep: #db7f12;
  --hex-orange: #fa8d39;        --hex-orange-deep: #a14600;

  /* Le violet foncé de la charte. Il n'a pas de « + foncé » : c'est lui,
     la teinte sombre. --hex-violet-clair est un éclaircissement. */
  --hex-violet: #31084c;
  --hex-violet-deep: #31084c;
  --hex-violet-clair: #4a1a6e;

  /* Le blanc de la charte — le texte posé sur un fond plein. */
  --blanc: #ffffff;

  /* Mise en page. */
  --bg: #f6f4f9;
  --bg-subtle: #fafaff;
  --card: #ffffff;
  --border: #ece8f1;
  --border-strong: #d8d2e2;
  --divider: #f0ecf5;
  --chip-bg: #f4f1f9;

  --text-strong: #1a0d2b;
  --text-body: #3d3450;
  --text-muted: #7a6e8a;
  --text-faint: #b3a9c3;

  /* Rôles. On parle en rôle, pas en couleur : « danger », pas « rose ». */
  --primary: var(--hex-pink);
  --primary-soft: #fcdcef;
  --primary-hover: #c1108a;
  --success: var(--hex-green);   --success-bg: #dff6f3;
  --warning: var(--hex-yellow);  --warning-bg: #fdf1d9;
  --danger: var(--hex-pink);     --danger-bg: #fcdcef;
  --info: var(--hex-blue);       --info-bg: #e7e6ff;

  /* Tailles de texte. */
  --fs-xs: 11px;  --fs-sm: 12px;  --fs-base: 13px; --fs-md: 14px;
  --fs-lg: 16px;  --fs-xl: 18px;  --fs-2xl: 22px;  --fs-3xl: 28px;

  /* Espacements. */
  --s1: 4px;  --s2: 8px;  --s3: 12px; --s4: 16px; --s5: 20px;
  --s6: 24px; --s8: 32px; --s10: 40px;

  /* Arrondis. */
  --r-sm: 6px; --r-md: 8px; --r-lg: 10px; --r-xl: 14px;
  --r-2xl: 20px; --r-full: 9999px;

  /* Ombres. */
  --shadow-sm: 0 1px 2px rgba(49, 8, 76, .04);
  --shadow-md: 0 1px 3px rgba(49, 8, 76, .06), 0 1px 2px rgba(49, 8, 76, .04);
  --shadow-lg: 0 4px 12px rgba(49, 8, 76, .08), 0 2px 4px rgba(49, 8, 76, .04);
  --shadow-xl: 0 12px 32px rgba(49, 8, 76, .12);

  --ease: cubic-bezier(.4, 0, .2, 1);
  --font: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --mono: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
}