/* =============================================================================
   TerraTrack — Design Tokens
   =============================================================================
   Variables CSS centralisées : couleurs, espacements, rayons, typographie.
   Modifier UNIQUEMENT ici pour changer l'apparence globale.

   Palette TerraTrack (par défaut) — ajustée Sprint 1 :
   - Fond légèrement plus clair (#0e1117 vs #080a0e) → moins fatigant
   - Accent or légèrement adouci (#e3a32a vs #e8a020) → moins criard
   - Contrastes texte/fond conformes WCAG AA
   ========================================================================= */

:root {
  /* ---------- Surfaces (fonds) ---------- */
  --bg:      #0e1117;   /* fond principal — adouci vs #080a0e */
  --sur:     #141822;   /* surfaces secondaires (inputs, scroll bg) */
  --card:    #181d2a;   /* cartes principales */
  --card2:   #1d2333;   /* cartes imbriquées / hover */

  /* ---------- Bordures ---------- */
  --bor:     #232a3e;
  --bor2:    #2a3148;

  /* ---------- Accent or (couleur de marque) ---------- */
  --acc:        #e3a32a;            /* doré principal — adouci */
  --acc2:       #f0bc54;            /* doré clair (hover, texte) */
  --acc3:       #ffd280;            /* doré très clair (highlights) */
  --acc-dim:    #1f1808;            /* fond doré sombre (badges) */
  --acc-glow:   rgba(227,163,42,.15); /* halo focus */

  /* ---------- Statuts ---------- */
  --grn:        #22c55e;  --grn-dim:  #052e16;
  --red:        #ef4444;  --red-dim:  #2a0808;
  --pur:        #a855f7;  --pur-dim:  #1a0830;
  --blue:       #3b82f6;  --blue-dim: #071630;
  --orange:     #f59e0b;  --orange-dim: #1a1008;

  /* ---------- Texte ---------- */
  --txt:     #f0f2f8;   /* texte principal — légèrement adouci vs blanc pur */
  --txt2:    #8892a8;   /* texte secondaire */
  --txt3:    #4a536b;   /* texte tertiaire (labels, métadonnées) — éclairci pour lisibilité */

  /* ---------- Safe areas (iOS notch / home indicator) ---------- */
  --st: env(safe-area-inset-top, 0px);
  --sb: env(safe-area-inset-bottom, 0px);

  /* ---------- Rayons ---------- */
  --r:   16px;   /* cartes principales */
  --r2:  12px;   /* inputs, boutons */
  --r3:  8px;    /* petits éléments */

  /* ---------- Espacements (échelle 4px) ---------- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;

  /* ---------- Ombres ---------- */
  --sh-sm: 0 2px 8px rgba(0,0,0,.3);
  --sh-md: 0 4px 16px rgba(0,0,0,.4);
  --sh-lg: 0 12px 40px rgba(0,0,0,.6);

  /* ---------- Transitions ---------- */
  --ease-out:    cubic-bezier(.16, 1, .3, 1);
  --ease-in-out: cubic-bezier(.4, 0, .2, 1);
  --t-fast:      150ms;
  --t-base:      200ms;
}