/* ============================================================
   Balsa — Farb-Tokens (v2, 2026-07-02; alle Kontraste auf Balsaweiß)
   Zwei Ebenen: Brand-Roh (--balsa-*, nie direkt nutzen) → Semantisch.
   Komponenten nutzen NUR die semantische Ebene. Kein Blau, nirgends.
   ============================================================ */

:root {
  /* --- Ebene 1: Brand-Roh (nie direkt in Komponenten) --- */
  --balsa-balsaweiss: #FCF9F6;        /* Hintergrund — nie reines Weiß */
  --balsa-sand: #EDE0D4;              /* Flächen/Karten/User-Bubble */
  --balsa-sand-deep: #E6D5C3;         /* Sidebar/Panels */
  --balsa-bernstein: #D4956A;         /* Sekundär/Brücke, Illustration */
  --balsa-terrakotta: #B85C3A;        /* Primär: Flächen/Buttons (4.32 — kein Fließtext) */
  --balsa-terrakotta-hover: #A04E2F;  /* Hover + Akzent-Text/Link (5.52 AA) */
  --balsa-muskat: #7A4A35;            /* warmer Tiefton (7.0 AAA) */
  --balsa-tiefbraun: #1E0F06;         /* primärer Text (17.8 AAA) */
  --balsa-terrakotta-08: rgba(184, 92, 58, .08);
  --balsa-terrakotta-12: rgba(184, 92, 58, .12);
  --balsa-terrakotta-30: rgba(184, 92, 58, .30);
  --balsa-border: #D4C4B0;
  --balsa-border-light: #E6D8CC;

  /* --- Ebene 2: Semantisch — Flächen & Text --- */
  --bg-primary: var(--balsa-balsaweiss);
  --bg-secondary: var(--balsa-sand);
  --bg-sidebar: var(--balsa-sand-deep);
  --bg-inset: rgba(30, 15, 6, .04);
  --fg-primary: var(--balsa-tiefbraun);   /* 17.8 AAA */
  --fg-secondary: #5C4033;                /* 8.95 AAA */
  --fg-tertiary: #7A6258;                 /* 5.39 AA */
  --fg-on-accent: #FFFFFF;                /* auf Terrakotta 4.54 AA */
  --fg-accent: #A04E2F;                   /* Links/Akzent-TEXT, 5.52 AA */
  --link: #A04E2F;
  --accent: var(--balsa-terrakotta);      /* nur Flächen/Buttons */
  --accent-hover: #A04E2F;
  --accent-light: var(--balsa-terrakotta-08);
  --accent-strong: var(--balsa-terrakotta-12);
  --border: var(--balsa-border);
  --border-light: var(--balsa-border-light);

  /* Bubble-Füllungen (Chat-Flächen) */
  --bubble-user: var(--balsa-sand);
  --bubble-ai: transparent;

  /* --- Status: EIN warmer Satz — nie Farbe allein, immer Icon + Text --- */
  --error-base: #C2402A;    /* 4.93 AA */
  --error-bg: #FBEAE5;
  --error-border: #F2C8BA;
  --error-text: #A63A22;    /* 6.16; 5.54 auf error-bg */
  --warning-base: #B45309;  /* 4.79 */
  --warning-bg: #FBF3E2;
  --warning-border: #EFDCB2;
  --warning-text: #96540A;  /* 5.61; hält auf Sand (4.54) */
  --success-base: #4A7023;  /* warmes Oliv, 5.51 */
  --success-bg: #F2F6E9;
  --success-border: #D9E4C0;
  --success-text: #4A7023;
  --info-bg: var(--bg-inset);      /* info = neutral, KEIN Blau */
  --info-border: var(--border);
  --info-text: var(--fg-primary);

  /* Indikator-Punkte (Live-Puls, Ampel) — NUR Dots, immer mit Label */
  --indicator-green: #5A8F32;
  --indicator-amber: #D97706;
  --indicator-red: #D14A32;

  /* --- Datenvisualisierung (kategorial, in dieser Reihenfolge) --- */
  --chart-1: #B85C3A;   /* Terrakotta 4.32 */
  --chart-2: #7A4A35;   /* Muskat 7.00 */
  --chart-3: #4A7023;   /* Olivgrün 5.51 */
  --chart-4: #5C4033;   /* Braun-Mittel 8.95 */
  --chart-5: #D4956A;   /* Bernstein — nur Fläche mit Border/beschriftet */
}