/* =============================================================================
  COTE — variables globales
  ---------------------------------------------------------------------------
  Fichier      : assets/css/tokens.css
  Version      : 2.0.0
  Modifié le   : 2026-09-06
  Licence      : © 2026 Émile Snyers — voir LICENCE.txt
  Rôle         : couleurs, thèmes clair et cyanotype, typographie, espacements
  Licence      : © 2026 Émile Snyers — voir LICENCE.txt
  Dépendances  : aucune
   ============================================================================= */

/* =============================================================================
   1. STYLES — 1.1 Variables globales
   Toutes les couleurs, espacements et tailles passent par ces variables afin de
   permettre la personnalisation du thème et de la couleur principale.
   ============================================================================= */
:root{
  /* Typographie */
  --f-ui: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, "Helvetica Neue", Arial, sans-serif;
  --f-mono: ui-monospace, "SF Mono", "Cascadia Mono", "JetBrains Mono", Menlo, Consolas, monospace;
  --t-xs: .6875rem; --t-sm: .8125rem; --t-md: .9375rem; --t-lg: 1.0625rem;
  --t-xl: 1.375rem; --t-2xl: 1.875rem; --t-3xl: 2.5rem;

  /* Espacements */
  --e1: 4px; --e2: 8px; --e3: 12px; --e4: 16px; --e5: 24px; --e6: 32px; --e7: 48px; --e8: 64px;

  /* Rayons et bordures */
  --r-s: 5px; --r-m: 9px; --r-l: 14px;
  --bordure: 1px solid var(--trait);

  /* Surfaces et encre — thème clair (papier de bureau d'études) */
  --pap:    #f3f5f6;
  --pap-2:  #ffffff;
  --pap-3:  #e8ecee;
  --enc:    #16202b;
  --enc-2:  #465561;
  --enc-3:  #74848f;
  --trait:  #d3dade;
  --trait-fort: #a9b5bc;
  --grille: rgba(22,32,43,.055);
  --ombre:  0 1px 2px rgba(22,32,43,.06), 0 8px 24px -12px rgba(22,32,43,.18);
  --ombre-forte: 0 24px 60px -20px rgba(22,32,43,.35);
  --voile:  rgba(22,32,43,.42);

  /* Couleurs d'état */
  --ok:   #10745c;
  --warn: #a55a08;
  --err:  #b8283f;
  --ok-doux:   rgba(16,116,92,.10);
  --warn-doux: rgba(165,90,8,.10);
  --err-doux:  rgba(184,40,63,.09);

  /* Tracé du schéma */
  --sch-fond:   #ffffff;
  --sch-piece:  rgba(22,32,43,.045);
  --sch-trait:  #16202b;
  --sch-cote:   #0e7490;
  --sch-axe:    #a9b5bc;
  --sch-percage: rgba(14,116,144,.14);

  --entete-h: 58px;
}

/* Thème sombre : cyanotype — le tirage bleu des plans techniques. */
[data-theme="sombre"]{
  --pap:    #0c1c28;
  --pap-2:  #102534;
  --pap-3:  #16303f;
  --enc:    #e3f1f6;
  --enc-2:  #a7c3d0;
  --enc-3:  #74939f;
  --trait:  #21414f;
  --trait-fort: #35606f;
  --grille: rgba(160,220,240,.055);
  --ombre:  0 1px 2px rgba(0,0,0,.4), 0 10px 30px -14px rgba(0,0,0,.7);
  --ombre-forte: 0 24px 60px -18px rgba(0,0,0,.75);
  --voile:  rgba(4,14,20,.6);
  --ok:   #4bbf9c; --warn: #e0a44a; --err: #ef7b8e;
  --ok-doux: rgba(75,191,156,.12); --warn-doux: rgba(224,164,74,.12); --err-doux: rgba(239,123,142,.12);
  --sch-fond:  #0a1d29;
  --sch-piece: rgba(160,220,240,.05);
  --sch-trait: #cfe9f2;
  --sch-cote:  #5ec8e4;
  --sch-axe:   #4a7788;
  --sch-percage: rgba(94,200,228,.13);
}

/* Couleur principale — cinq déclinaisons */
[data-accent="cyan"]   { --acc:#0e7490; --acc-2:#0b5f77; --acc-doux:rgba(14,116,144,.10); --acc-texte:#ffffff; }
[data-accent="bleu"]   { --acc:#2b53c4; --acc-2:#1f409e; --acc-doux:rgba(43,83,196,.10);  --acc-texte:#ffffff; }
[data-accent="vert"]   { --acc:#1a7a45; --acc-2:#146237; --acc-doux:rgba(26,122,69,.10);  --acc-texte:#ffffff; }
[data-accent="ambre"]  { --acc:#a86205; --acc-2:#8a5004; --acc-doux:rgba(168,98,5,.10);   --acc-texte:#ffffff; }
[data-accent="violet"] { --acc:#6d3fbf; --acc-2:#59309f; --acc-doux:rgba(109,63,191,.10); --acc-texte:#ffffff; }
[data-theme="sombre"][data-accent="cyan"]   { --acc:#4fc3e2; --acc-2:#7dd6ee; --acc-doux:rgba(79,195,226,.14); --acc-texte:#06202b; }
[data-theme="sombre"][data-accent="bleu"]   { --acc:#7ba0f5; --acc-2:#9db8f8; --acc-doux:rgba(123,160,245,.14); --acc-texte:#0a1730; }
[data-theme="sombre"][data-accent="vert"]   { --acc:#5fcb8b; --acc-2:#84daa6; --acc-doux:rgba(95,203,139,.14); --acc-texte:#052313; }
[data-theme="sombre"][data-accent="ambre"]  { --acc:#e6ac52; --acc-2:#f0c27d; --acc-doux:rgba(230,172,82,.14); --acc-texte:#2a1a02; }
[data-theme="sombre"][data-accent="violet"] { --acc:#b28cf0; --acc-2:#c7abf5; --acc-doux:rgba(178,140,240,.14); --acc-texte:#1c0f36; }

/* Réduction des animations */
[data-anim="non"] *, [data-anim="non"] *::before, [data-anim="non"] *::after{
  animation-duration:.001ms !important; transition-duration:.001ms !important;
}
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
}
