/* =============================================================================
   Palette: v3 — Warm + Einladend (Bütten als Hintergrund)
   =============================================================================
   Layer 1 (Palette / raw scales). Wird VOR tokens.css geladen — semantic
   Tokens dort referenzieren diese Werte.

   Palette tauschen: diese Datei durch andere Palette ersetzen (gleiche
   Variable-Namen, andere Hex-Werte). Semantic- und Component-Tokens bleiben
   unangefasst.

   Acht Skalen × 11 Stufen (50–950):
     terracotta — Brand, Primary-Aktion
     fir        — Erfolg / Gebucht
     amber      — Notiz / Post-it
     bordeaux   — Fehler / Warnung (eigene Hue, nicht Terrakotta)
     ink        — Information / Sekundär / Link
     paper      — Bütten / Backgrounds / Card-Flächen / Borders
     slate      — Neutral / Text / UI-Chrome
   ============================================================================= */

:root {
  /* ── Terrakotta — gebrannter Ton, warm + präsent ────────────────────── */
  --terracotta-50:  #FDF5EF;
  --terracotta-100: #FCDFCB;
  --terracotta-200: #F7BE99;
  --terracotta-300: #EE9866;
  --terracotta-400: #DD723C;
  --terracotta-500: #C24B1A;   /* Primary Brand */
  --terracotta-600: #A33D14;
  --terracotta-700: #83310F;
  --terracotta-800: #65260B;
  --terracotta-900: #481B07;
  --terracotta-950: #2A1004;

  /* ── Tanne (Fir) — Erfolg / Gebucht ──────────────────────────────────── */
  --fir-50:  #EFF6EE;
  --fir-100: #D9E8D6;
  --fir-200: #B2D0AB;
  --fir-300: #83B17B;
  --fir-400: #578E4F;
  --fir-500: #3D7236;
  --fir-600: #2D5828;
  --fir-700: #23441F;
  --fir-800: #1A3318;
  --fir-900: #112210;
  --fir-950: #081308;

  /* ── Amber — Notiz / Post-it ─────────────────────────────────────────── */
  --amber-50:  #FFFAE0;
  --amber-100: #FFEFA8;
  --amber-200: #FCDE6E;
  --amber-300: #F0C434;
  --amber-400: #D6A40A;
  --amber-500: #AD8200;
  --amber-600: #866400;
  --amber-700: #634900;
  --amber-800: #453300;
  --amber-900: #2D2100;
  --amber-950: #171000;

  /* ── Bordeaux — Fehler / Warnung ─────────────────────────────────────── */
  --bordeaux-50:  #FBEEEE;
  --bordeaux-100: #F2D4D4;
  --bordeaux-200: #E0A8A8;
  --bordeaux-300: #C97C7C;
  --bordeaux-400: #B05757;
  --bordeaux-500: #9A3838;
  --bordeaux-600: #7E2C2C;
  --bordeaux-700: #612323;
  --bordeaux-800: #451A1A;
  --bordeaux-900: #2B1010;
  --bordeaux-950: #170808;

  /* ── Tinte (Ink) — Information / Link / Sekundär ─────────────────────── */
  --ink-50:  #F0F3F8;
  --ink-100: #DCE3EE;
  --ink-200: #B4C2D8;
  --ink-300: #869BBA;
  --ink-400: #5A739A;
  --ink-500: #3D567C;
  --ink-600: #2F4363;
  --ink-700: #24344C;
  --ink-800: #1A2536;
  --ink-900: #101822;
  --ink-950: #080C12;

  /* ── Bütten (Paper) — Backgrounds / Card-Flächen / Borders
     Entsättigte, hellere Bütten-Skala. paper-50 ist App-Body. */
  --paper-0:   #FFFFFF;   /* Eingabefelder — reines Weiß auf warmem Grund */
   --paper-50:  #FCFAF8;   /* App-Body (sehr hell) */
  --paper-100: #F8F4EF;   /* Card-Background */
  --paper-150: #F4EEE8;   /* Hover-State für Cards / Subtile Highlights */
  --paper-200: #EFE9E1;   /* Eingabefelder / Muted Backgrounds */
  --paper-250: #E8E0D7;   /* Hover-State für Muted Elements / Light Borders */
  --paper-300: #E2D7CC;
  --paper-400: #C3B3A3;
  --paper-500: #A18E7C;
  --paper-600: #82705E;
  --paper-700: #665646;
  --paper-800: #4A3E31;
  --paper-900: #30271E;
  --paper-950: #1A1510;

  /* ── Kraft — Aktenordner-Rücken (Belegboxen-Regal). Vier eng gestaffelte
     Bütten-Töne für die Quartals-Tönung (Q1 hell → Q4 dunkel). ─────────── */
  /* Q1 warmes Bütten-Sand → Q4 Anthrazit (klassischer Leitz-Ordnerrücken). */
  --kraft-q1: #D9C7B0;
  --kraft-q2: #B59A7B;
  --kraft-q3: #837567;
  --kraft-q4: #45423E;

  /* ── Schiefer (Slate) — Neutral / Text / UI-Chrome ───────────────────── */
  --slate-50:  #F5F4F1;
  --slate-100: #E8E5DF;
  --slate-200: #CFCAC0;
  --slate-300: #A9A296;
  --slate-400: #7B746A;
  --slate-500: #56504A;
  --slate-600: #403B36;
  --slate-700: #2E2A26;
  --slate-800: #1F1C19;
  --slate-900: #13110F;
  --slate-950: #0A0908;

  /* ── RGB-Channel-Tokens — für rgba()-Aufrufe mit Palette-Bindung
     CSS hat keine native Syntax, um `var(--color)` mit Alpha zu kombinieren.
     RGB-Channels lösen das: rgba(var(--terracotta-600-rgb), 0.18). Pflicht
     für jede Palette: dieselben Channel-Tokens, dann funktioniert ein
     Palette-Swap auch für Shadows/Backdrops/Tints automatisch. */
  --slate-900-rgb:      19, 17, 15;
  --terracotta-600-rgb: 163, 61, 20;
  --terracotta-400-rgb: 221, 114, 60;
  --amber-500-rgb:      173, 130, 0;
  --ink-500-rgb:        61, 86, 124;
  --ink-400-rgb:        90, 115, 154;
  --ink-300-rgb:        134, 155, 186;
  --fir-500-rgb:        61, 114, 54;
  --bordeaux-500-rgb:   154, 56, 56;
  --paper-50-rgb:       253, 252, 250;

  /* ── Aktenordner-Farben — kräftig = gut sichtbar/leuchtend (Leitz-Stil),
     NICHT dunkel. Rücken (-body) lebhaft + hell; Deckel (-cap) nur so tief
     wie nötig, damit der weiße Typ-Text (EIN/AUS) AA-lesbar bleibt. Warm
     getönt, damit sie mit der Bütten-Palette harmonieren. */
  --ordner-anthrazit-body: #6B6258; --ordner-anthrazit-cap: #463F37;
  --ordner-bordeaux-body:  #BE4A45; --ordner-bordeaux-cap:  #8C2F2C;
  --ordner-blau-body:      #3E83BC; --ordner-blau-cap:      #2A5B86;
  --ordner-gruen-body:     #5BA84B; --ordner-gruen-cap:     #3E7A35;
  --ordner-gold-body:      #E0A92C; --ordner-gold-cap:      #8B6510;
  --ordner-grau-body:      #A79E94; --ordner-grau-cap:      #6A6058;
  --ordner-taupe-body:     #CBA77C; --ordner-taupe-cap:     #7D6345;
  --ordner-oliv-body:      #9DA046; --ordner-oliv-cap:      #6B6E2C;
}