/* ============================================================================
   STIG ROCK - BRAND TOKENS
   Quelle: BRAND-GUIDE.md (Business Edition Vol. 01 · 2026)
   ----------------------------------------------------------------------------
   Wird NACH tailwind.css geladen und ueberschreibt dessen Palette zur Laufzeit.
   Rebranding = nur Block 1 anfassen.
   ========================================================================== */

/* ------------------------------------------------------------------
   1) MARKENFARBEN (offiziell, Abschnitt 2 des Guides)
   ------------------------------------------------------------------ */
:root {
  --carbon-black: #0a0a0a; /* Primaer: dunkle Flaechen, Text, Buttons */
  --classic-white: #faf7f2; /* Hintergrund: warmes Off-White */
  --business-grey: #a6a4a9; /* Sekundaer: Flaechen, Linien, Grosstext */

  /* Erweiterung aus dem PDF-Layout */
  --copper: #b8956f; /* EINZIGER Akzent - Labels, Zahlen, Hover, Linien */
  --copper-deep: #8b5a4a;
  --ink: #2c2419; /* Fliesstext: warmes Schwarzbraun */
  --taupe: #6b5d4f; /* Muted-Text (WCAG-fest, anders als Business Grey) */

  /* Semantische Aliase */
  --primary: var(--copper);
  --primary-hover: var(--copper-deep);
  --primary-contrast: var(--classic-white);

  --font-brand: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
  --tracking-label: 0.18em;
}

/* ------------------------------------------------------------------
   2) STATUSFARBEN
   Der Guide kennt keine Statusfarben - ein Backoffice braucht sie aber
   (Betrag positiv, KYC abgelehnt). Deshalb bewusst warme, entsaettigte
   Toene aus der Kupfer-/Ink-Familie. Kein Blau, kein Tuerkis, kein Pink.
   ------------------------------------------------------------------ */
:root {
  --success: #5f7c4f; /* gedecktes Moosgruen */
  --danger: #8b3a3a; /* Ziegelrot, verwandt mit Copper Deep */
  --warning: var(--copper);
}

/* ------------------------------------------------------------------
   3) TAILWIND-MAPPING
   ------------------------------------------------------------------ */
:root {
  /* Akzent-Rampe -> bg-brand-500, text-brand-500, border-brand-500/30 … */
  --color-brand-25: #fbf8f4;
  --color-brand-50: #f6efe6;
  --color-brand-100: #ecdfcd;
  --color-brand-200: #dcc7a9;
  --color-brand-300: #ccaf86;
  --color-brand-400: #c2a27b;
  --color-brand-500: var(--copper);
  --color-brand-600: #a77f58;
  --color-brand-700: var(--copper-deep);
  --color-brand-800: #6f4739;
  --color-brand-900: #55372c;
  --color-brand-950: #34211a;

  --color-success-50: #eef2ea;
  --color-success-500: var(--success);
  --color-success-600: #4e6741;
  --color-error-50: #f6eaea;
  --color-error-500: var(--danger);
  --color-error-600: #742f2f;
  --color-warning-50: #f7f0e7;
  --color-warning-500: var(--warning);
  --color-warning-600: #a77f58;

  /* Karten liegen als Reinweiss auf dem warmen Off-White der Seite */
  --color-white: #ffffff;

  /* Warme Neutral-Rampe: traegt Flaechen, Linien und Text */
  --color-gray-25: #fdfcfa;
  --color-gray-50: var(--classic-white); /* Seiten-Hintergrund */
  --color-gray-100: #f1ece4; /* dezente Fuellung */
  --color-gray-200: #e2dcd2; /* Haarlinien */
  --color-gray-300: #cfc7bc; /* Linien / Text auf Dunkel */
  --color-gray-400: var(--business-grey); /* Muted-Text auf Dunkel */
  --color-gray-500: var(--taupe); /* Muted-Text auf Hell */
  --color-gray-600: #55493d;
  --color-gray-700: #3b3227;
  --color-gray-800: var(--ink); /* Ueberschriften auf Hell */
  --color-gray-900: var(--carbon-black);
  --color-gray-950: #050505;
  --color-gray-dark: #141312;
}

/* ------------------------------------------------------------------
   4) DARK MODE - nur Flaechen und Linien.
   gray-300/400/500 bleiben hell, sie tragen dort den Text.
   ------------------------------------------------------------------ */
/* --color-white bleibt #ffffff - es traegt im Darkmode den TEXT (text-white).
   Dunkle Kartenflaechen kommen aus .sr-panel bzw. dark:bg-*-Varianten. */
.dark {
  --color-gray-700: #2a2724;
  --color-gray-800: #232120; /* Haarlinien */
  --color-gray-900: var(--carbon-black); /* Sidebar / Header / Page */
  --color-gray-950: #050505;
  --color-gray-dark: #141312;

  --primary-contrast: var(--carbon-black);
}

/* ------------------------------------------------------------------
   5) FORM-SPRACHE (Guide Abschnitt 9)
   "Kein Border-Radius. Keine Schatten, keine Verlaeufe."
   Beides sitzt in Tailwind hinter Variablen - hier global abgeschaltet.
   ------------------------------------------------------------------ */
:root {
  --radius-xs: 0px;
  --radius-sm: 0px;
  --radius-md: 0px;
  --radius-lg: 0px;
  --radius-xl: 0px;
  --radius-2xl: 0px;
  --radius-3xl: 0px;
  --radius-4xl: 0px;

  --shadow-theme-xs: 0 0 #0000;
  --shadow-theme-sm: 0 0 #0000;
  --shadow-theme-md: 0 0 #0000;
  --shadow-theme-lg: 0 0 #0000;
  --shadow-theme-xl: 0 0 #0000;
}