/* Design-Werte aus docs/Design/Design-Dokumentation.md, Kapitel 9.2.
   Einzige Quelle für Farben, Abstände und Maße – Komponenten verwenden nur diese Variablen. */
:root {
  /* Marke */
  --brand-grey: #4D4D4D;  --brand-red: #C50A1D;  --brand-red-hover: #A30818;  --brand-red-pressed: #8A0714;
  --brand-red-text: #C50A1D;
  /* Akzent: Primärbutton, aktiver Reiter, Balken, Fokus. Ändert je Mandant das Farbschema (data-scheme am <html>, Blöcke unten); Grau-, Status- und KI-Farben
     bleiben in jedem Schema gleich. --brand-* gehört nur zur Wortmarke. */
  --accent: #C50A1D;  --accent-hover: #A30818;  --accent-pressed: #8A0714;  --accent-on: #FFFFFF;  --accent-text: #C50A1D;
  /* Neutral */
  --bg: #FFFFFF;  --surface-1: #F7F7F7;  --surface-2: #EFEFEF;  --nav-active: #EAEAEA;
  --border: #E2E2E2;  --border-strong: #C6C6C6;
  --logo-plate: transparent;  /* Fläche hinter dem Firmenlogo: hell = keine, im Dunkelmodus eine helle Kachel (FE-057) */
  --text-1: #1A1A1A;  --text-2: #545454;  --text-3: #767676;
  /* Status */
  --success-fg: #17693F; --success-bg: #E6F4EC;
  --warning-fg: #8A5A00; --warning-bg: #FFF3D6;
  --error-fg:   #B93A0B; --error-bg:   #FDEDE6;  --danger-hover: #9C3009; --danger-pressed: #822808;
  --info-fg:    #1F5FBF; --info-bg:    #E7F0FC;
  --neutral-fg: #545454; --neutral-bg: #F0F0F0;
  /* KI */
  --ai-fg: #5A45C8;  --ai-bg: #F1EEFD;  --ai-mark-strong: #DCD4FA;
  /* Diagramme (ErpChart, Apache ECharts): geprüfte Reihenpalette, mindestens 3:1 zu --bg und --surface-1 (Architekturtest ChartPaletteTests).
     Kein Rot (Fehler/Marke), kein Violett (KI) als Reihe; Reihe 1 ist Markengrau, damit Ein-Reihen-Diagramme ruhig bleiben. */
  --chart-1: #4D4D4D;  --chart-2: #2F6DB5;  --chart-3: #2E8B6A;  --chart-4: #B87A0E;
  --chart-5: #1F8FA3;  --chart-6: #8C6D4F;  --chart-7: #6E7F99;  --chart-8: #6B7F2A;
  /* Kennfarben (Mandanten-Streifen und -Chip, Kalenderkategorien): immer zusammen mit Kürzel bzw. Buchstabe, nie Markenrot, Fehlerfarbe oder KI-Violett;
     mindestens 3:1 zu --bg und --surface-1 (Architekturtest ColorSchemeTests). */
  --cat-grey: #767676;  --cat-slate: #5A6B85;  --cat-blue: #2F6DB5;  --cat-teal: #1C8394;
  --cat-green: #2E8B6A;  --cat-ochre: #B87A0E;  --cat-brown: #8C6D4F;  --cat-plum: #94476B;
  /* Form */
  --radius-chip: 4px;  --radius-button: 6px;  --radius-card: 8px;  --radius-overlay: 12px;
  --shadow-popover: 0 4px 16px rgba(0,0,0,.12);  --shadow-dialog: 0 12px 40px rgba(0,0,0,.18);
  --scrim: rgba(26,26,26,.32);
  --focus-ring: 0 0 0 2px color-mix(in srgb, var(--accent-text) 15%, transparent);
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 24px; --space-6: 32px; --space-7: 48px;
  --row-compact: 32px;  --row-default: 36px;  --row-comfortable: 44px;
  --font-sans: "Segoe UI Variable Text", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif;
  --shell-header: 48px; --shell-nav: 216px; --shell-nav-collapsed: 56px; --shell-tabs: 36px;
  --sidebar-min: 300px; --sidebar-s: 360px; --sidebar-m: 480px; --sidebar-l: 640px; --sidebar-max: 720px;
  color-scheme: light;
}

[data-theme="dark"] {
  --bg: #1A1A1A;  --surface-1: #202020;  --surface-2: #2A2A2A;  --nav-active: #2A2A2A;
  --border: #383838;  --border-strong: #4D4D4D;
  --logo-plate: #F2F2F2;
  --text-1: #F2F2F2;  --text-2: #C2C2C2;  --text-3: #9E9E9E;
  --brand-red-text: #F04A5A;  /* Wortmarke im Dunkelmodus */
  --accent-text: #F04A5A;  /* Balken, Fokus, Akzenttext – der Primärbutton bleibt --accent */
  --success-fg: #5CCB8F; --success-bg: #15301F;
  --warning-fg: #F2BE4A; --warning-bg: #33280F;
  --error-fg:   #FF8A5C; --error-bg:   #3A1D12;  --danger-hover: #C9471A;
  --info-fg:    #7FB0FF; --info-bg:    #14253F;
  --neutral-fg: #C2C2C2; --neutral-bg: #2A2A2A;
  --ai-fg: #A898FF;  --ai-bg: #231D3F;
  --chart-1: #C2C2C2;  --chart-2: #6FA3E0;  --chart-3: #5CCB8F;  --chart-4: #E3B04B;
  --chart-5: #5CC4D6;  --chart-6: #C4A184;  --chart-7: #9FB0C6;  --chart-8: #A8BF5E;
  --cat-grey: #9E9E9E;  --cat-slate: #9FB0C6;  --cat-blue: #6FA3E0;  --cat-teal: #5CC4D6;
  --cat-green: #5FBF9A;  --cat-ochre: #E3B04B;  --cat-brown: #C4A184;  --cat-plum: #D68AAF;
  --shadow-popover: 0 4px 16px rgba(0,0,0,.5);
  color-scheme: dark;
}

/* Farbschemas je Mandant (Entscheidung „Farbschemas je Mandant“): ändern nur die Akzent-Gruppe. „banond“ (Markenrot) ist der Standard in :root.
   Hell/Dunkel wählt jede Person selbst – jedes Schema hat deshalb beide Blöcke. Werte vorläufig, Pascal legt sie endgültig fest. */
[data-scheme="graphit"]  { --accent: #3A3F45;  --accent-hover: #2B2F34;  --accent-pressed: #1F2327;  --accent-on: #FFFFFF;  --accent-text: #3A3F45; }
[data-scheme="blau"]     { --accent: #1D3F86;  --accent-hover: #163270;  --accent-pressed: #102758;  --accent-on: #FFFFFF;  --accent-text: #1D3F86; }
[data-scheme="petrol"]   { --accent: #0F6B73;  --accent-hover: #0B565D;  --accent-pressed: #08444A;  --accent-on: #FFFFFF;  --accent-text: #0F6B73; }
[data-scheme="gruen"]    { --accent: #4A5D23;  --accent-hover: #3C4C1C;  --accent-pressed: #2F3D16;  --accent-on: #FFFFFF;  --accent-text: #4A5D23; }

[data-scheme="graphit"][data-theme="dark"] { --accent: #A9B1BB;  --accent-hover: #C0C7CF;  --accent-pressed: #8E96A0;  --accent-on: #1A1A1A;  --accent-text: #C5CBD2; }
[data-scheme="blau"][data-theme="dark"]    { --accent: #3F63C4;  --accent-hover: #5072D0;  --accent-pressed: #3454B0;  --accent-on: #FFFFFF;  --accent-text: #A3B1F2; }
[data-scheme="petrol"][data-theme="dark"]  { --accent: #12767F;  --accent-hover: #17808A;  --accent-pressed: #0E636B;  --accent-on: #FFFFFF;  --accent-text: #4FC1CC; }
[data-scheme="gruen"][data-theme="dark"]   { --accent: #566A25;  --accent-hover: #5F7329;  --accent-pressed: #485A1F;  --accent-on: #FFFFFF;  --accent-text: #A8BF5E; }