/* ==========================================================================
   Design Tokens — zentrale :root-Custom-Properties (keine Fremdbibliotheken)
   Muss VOR styles.css geladen werden. Werte 1:1 aus dem Bestand übernommen,
   damit die Umstellung rein strukturell ist und nichts optisch verändert.
   ========================================================================== */
:root {
  /* ---- Farb-Palette --------------------------------------------------- */
  /* Primitive Neutrale */
  --color-white:            #ffffff;
  --color-ink:              #15161a;   /* Fast-Schwarz (Diamant-Rand, HUD, Marquee) */
  --color-ink-2:            #1b1b1b;   /* Kritisch-Streifen dunkel */
  --color-neutral-300:      #cfd4da;   /* „keine" Ampel */
  --color-dep:              #9aa3ad;   /* Abhängigkeits-Pfeil */
  --color-surface-group:    #f7f8fa;   /* Gruppenzeile / Gruppenband */
  --color-surface-hover:    #e9ebef;   /* Hover-Fläche (lane-tools) */

  /* Semantische Status */
  --color-success:          #37b24d;   /* Ampel grün / Stabilität */
  --color-warning:          #f5b800;   /* Ampel gelb / Stabilität */
  --color-danger:           #e0392b;   /* Konflikt / Ampel rot */
  --color-danger-strong:    #c0271b;
  --color-danger-bg:        #fdecea;
  --color-danger-bg-hover:  #f9d9d5;
  --color-danger-bg-dark:   #3a1f1c;   /* Dark-Mode Konflikt-Fläche */
  --color-danger-on-dark:   #ff9b8f;   /* Dark-Mode Konflikt-Text */
  --color-accent-yellow:    #ffd23f;   /* Kritisch-Streifen / HUD-Highlight */

  /* Zeitachsen-Marker */
  --color-today:            #e74c3c;   /* „Heute"-Linie (rot) */
  --color-lookahead:        #0B5FFF;   /* Vorschau-Linie (blau) */

  /* Feiertag-Kennzeichnung */
  --color-holiday-bg:       #fbece6;
  --color-holiday-text:     #c0532a;

  /* Dark-Mode Flächen & Text-auf-Dunkel */
  --color-surface-dark-2:   #262b34;   /* Dark blk-detail */
  --color-surface-dark-hud: #23252b;   /* HUD-Input */
  --color-border-dark:      #3a3d44;   /* HUD-Rahmen */
  --color-text-on-dark:     #e7e9ee;
  --color-text-on-dark-dim: #d7dae0;
  --color-text-on-dark-mut: #8a94a0;
  --color-text-on-dark-faint:#aab;

  /* ---- Spacing-Skala (2px-Raster; Kernraster 4/8/12/16/20/24/32) ------- */
  /* Token-Name = Pixelwert → eindeutig prüfbar. */
  --space-0:  0;
  --space-2:  2px;
  --space-4:  4px;    /* ← Kernraster */
  --space-6:  6px;
  --space-8:  8px;    /* ← */
  --space-10: 10px;
  --space-12: 12px;   /* ← */
  --space-14: 14px;
  --space-16: 16px;   /* ← */
  --space-20: 20px;   /* ← */
  --space-24: 24px;   /* ← */
  --space-32: 32px;   /* ← */

  /* ---- Border-Radien -------------------------------------------------- */
  --radius-xs:    2px;
  --radius-sm:    4px;
  --radius-base:  5px;   /* aktueller Default (Karte/Label); liegt zwischen sm(4) & md(6) */
  --radius-md:    6px;
  --radius-lg:    8px;
  --radius-xl:    10px;
  --radius-2xl:   12px;
  --radius-pill:  20px;
  --radius-round: 50%;

  /* ---- Schatten-Stufen (Elevation) ------------------------------------ */
  --shadow-sm: 0 1px 2px rgba(0,0,0,.18);
  --shadow-md: 0 1px 3px rgba(0,0,0,.35);
  --shadow-lg: 0 4px 14px rgba(0,0,0,.25);
  --shadow-xl: 0 6px 16px rgba(0,0,0,.3);

  /* ---- Z-Index-Layer -------------------------------------------------- */
  --z-below:       0;
  --z-base:        1;   /* Bänder, Progress-Overlay */
  --z-raised:      2;   /* Resize-Griff, Gruppenband-Hover */
  --z-connectors:  4;   /* Abhängigkeits-Pfeile, Sammelbalken */
  --z-card:        6;   /* Prozesskarten, Blocker-Linie */
  --z-marker:      7;   /* Meilensteine, Heute-/Vorschau-Linie */
  --z-card-active: 8;   /* selektierte Karte */
  --z-handle:      10;  /* Link-Griff */
  --z-hud:         16;  /* Auswahl-Leiste */
  --z-dragging:    20;  /* gezogene Karte */
  --z-marquee:     28;  /* Auswahl-Rechteck */
  --z-overlay:     30;  /* temporäre Verbindungslinie */

  /* ---- Typo-Skala ----------------------------------------------------- */
  --font-2xs:  9px;
  --font-xs:   10px;
  --font-sm:   11px;
  --font-base: 12px;
  --font-md:   13px;   /* Body-Default */
  --font-lg:   14px;

  --weight-normal: 400;
  --weight-medium: 600;
  --weight-bold:   700;

  --leading-tight:  1.1;
  --leading-snug:   1.25;
  --leading-normal: 1.4;
}
