/* LIGNES — variables visuelles de l'application métier
   Source : Charte de marque et interfaces numériques v1.4 (9 novembre 2026), p. 08, 09, 18, 21–23.
   Valeurs EXACTES de la charte : kaolin, granit, grand-fond, bleu-mineral, bleu-interface.
   Valeurs DÉRIVÉES (provisoires, à valider) : nuances de granit et de bleu minéral sur Kaolin,
   calculées pour tenir les seuils WCAG 2.2 AA (contrastes indiqués en commentaire, calcul sRVB).
   COULEURS D'ÉTAT (DEC-023, 09/11/2026, demande de l'équipe — exception à la charte p. 09 et 17
   qui interdit les couleurs d'alerte) : rouge = négatif ou grave, vert = au-dessus des attentes,
   orange = vigilance. Toujours doublées d'un mot ou d'un signe (jamais la couleur seule).
   Deux jeux : foncé sur Kaolin, clair sur Granit (blocs anthracite). */

:root {
  /* ---- Couleurs de la charte (exactes) ---- */
  --kaolin: #F7F3E9;          /* fond de travail, libellés clairs sur Granit */
  --granit: #242220;          /* texte, navigation, fonds inversés — 14,31:1 sur Kaolin */
  --grand-fond: #0F5257;      /* score en écart notable, poinçon — SUR KAOLIN UNIQUEMENT — 8,01:1 */
  --bleu-mineral: #337DAB;    /* focus, sélection, traits d'action — 4,06:1 sur Kaolin, 3,52:1 sur Granit (non textuel) */
  --bleu-interface: #286589;  /* texte de lien, fond du bouton principal — 5,72:1 avec Kaolin */

  /* ---- Couleurs d'état (DEC-023) — contraste texte sur le fond indiqué ---- */
  --rouge: #B42318;          /* 5,93:1 sur Kaolin ; Kaolin sur ce rouge 5,93:1 (étiquette pleine) */
  --vert: #196B33;           /* 5,94:1 sur Kaolin, 5,26:1 sur ligne sélectionnée ; Kaolin sur ce vert 5,94:1 */
  --orange: #A64B00;         /* 5,22:1 sur Kaolin */
  --rouge-clair: #FF8B7B;    /* 6,97:1 sur Granit */
  --vert-clair: #6FD08C;     /* 8,36:1 sur Granit */
  --orange-clair: #F5A33B;   /* 7,69:1 sur Granit ; Granit sur cet orange 7,69:1 (étiquette pleine) */

  /* ---- Rôles (à utiliser dans les composants, jamais les valeurs brutes) ---- */
  --negatif: var(--rouge);
  --positif: var(--vert);
  --vigilance: var(--orange);
  --trait-accent: var(--granit);   /* traits forts (tableaux, indicateurs) ; s'éclaircit dans un bloc anthracite */
  --fond: var(--kaolin);
  --fond-inverse: var(--granit);
  --texte: var(--granit);
  --texte-inverse: var(--kaolin);
  --texte-secondaire: #5F5D58;   /* dérivé : Granit 72 % sur Kaolin — 5,93:1 (texte ≥ 4,5) */
  --trait-champ: #787670;        /* dérivé : Granit 60 % — 4,10:1 (bord de champ, repère nécessaire ≥ 3) */
  --trait-discret: #C2BFB7;      /* dérivé : Granit 25 % — séparateurs décoratifs seulement */
  --surface-survol: #EAE6DD;     /* dérivé : Granit 6 % — survol de ligne ; Granit dessus 12,73:1 */
  --surface-selection: #E3E7E3;  /* dérivé : Bleu minéral 10 % — ligne sélectionnée ; Granit 12,69:1, Grand Fond 7,11:1 */
  --action: var(--bleu-interface);
  --action-texte: var(--kaolin);
  --lien: var(--bleu-interface);
  --focus: var(--bleu-mineral);
  --selection-trait: var(--bleu-mineral);
  --score-notable: var(--grand-fond);   /* jamais sur fond Granit */

  /* ---- Typographie (charte p. 08 et 21) ---- */
  --police-texte: "Hanken Grotesk", "Helvetica Neue", Arial, sans-serif;  /* 500 texte, 600 titres */
  --police-mesure: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;  /* 600 : TOUT chiffre */
  --police-methode: "Source Serif 4", Georgia, serif;  /* italique : note de méthode uniquement */
  --graisse-texte: 500;
  --graisse-titre: 600;
  --graisse-mesure: 600;

  --taille-xs: 0.75rem;   /* 12 px — mentions, unités */
  --taille-s: 0.875rem;   /* 14 px — tableaux, libellés */
  --taille-m: 1rem;       /* 16 px — texte courant */
  --taille-l: 1.25rem;    /* 20 px — titres de section */
  --taille-xl: 1.5rem;    /* 24 px — titre d'écran */
  --taille-xxl: 2.25rem;  /* 36 px — indicateur principal */
  --interligne: 1.5;
  --interligne-serre: 1.25;

  /* ---- Espacements : unité de 4 px ---- */
  --e-1: 4px; --e-2: 8px; --e-3: 12px; --e-4: 16px; --e-6: 24px; --e-8: 32px; --e-12: 48px;

  /* ---- Grille ---- */
  --largeur-max: 1440px;
  --gouttiere: 24px;
  --hauteur-barre: 64px;   /* contient le logo à 48 px : mot LIGNES ≈ 24 px, minimum écran de la charte p. 07 */
  --hauteur-ligne-tableau: 36px;
  --hauteur-champ: 36px;   /* cible tactile/clic ≥ 24 px (WCAG 2.5.8) */

  /* ---- Formes ---- */
  --rayon: 5px;            /* DEC-024 : encadrements arrondis à 5 px, à la demande de l'équipe (la charte v1.4 indiquait 2 px) */
  --trait: 1px;
  --trait-fort: 2px;
  --anneau-focus: 0 0 0 2px var(--kaolin), 0 0 0 4px var(--focus);  /* espace Kaolin puis anneau (charte p. 22) */
}