/* ============================================================
   BMM v2.0.0 — OSP Editorial Tokens
   Familien-Look mit RMS / NZA / Fux
   ============================================================
   Light + Dark Theme, Reset, Aurora-Background (opt-in),
   Typografie-Basics, Form-Element-Lesbarkeit
   ============================================================ */

:root, [data-theme="light"] {
  --primary:        #0080C9;
  --primary-dark:   #005f97;
  --primary-soft:   #e6f3fb;
  --accent:         #DC500F;
  --accent-dark:    #a83b08;
  --accent-soft:    #fdeee5;
  --accent-green:   #10B981;   /* SiegAI-Wortmarke (RMS-Footer) */

  --bg:             #f4f7fa;
  --surface:        #ffffff;
  --surface-2:      #f0f6fb;
  --border:         #e2e8f0;
  --border-strong:  #cbd5e1;

  --text:           #0f172a;
  --text-muted:     #475569;
  --text-subtle:    #94a3b8;
  --text-faint:     #cbd5e1;

  --st-lager:          #16a34a;
  --st-lager-soft:     #dcfce7;
  --st-reparatur:      #DC500F;
  --st-reparatur-soft: rgba(220,80,15,0.12);
  --st-umbau:          #0080C9;
  --st-umbau-soft:     rgba(0,128,201,0.12);
  --st-verleih:        #7c3aed;
  --st-verleih-soft:   rgba(124,58,237,0.12);
  --st-ausgemustert:   #64748b;
  --st-gesperrt:       #b91c1c;

  --ampel-ok:       #22C55E;
  --ampel-faellig:  #EAB308;
  --ampel-overdue:  #EF4444;

  --aurora-1:       var(--primary);
  --aurora-2:       #5fb4dc;
  --aurora-3:       var(--accent);

  --glass-bg:       rgba(255,255,255,0.74);
  --glass-bg-solid: rgba(255,255,255,0.94);
  --glass-border:   rgba(0,128,201,0.15);
  --glass-shadow:   0 4px 16px rgba(0,128,201,0.08);
  --glass-blur:     blur(18px) saturate(150%);

  --hdr-bg:         rgba(0,128,201,0.92);
  --hdr-border:     rgba(220,80,15,0.22);

  --shadow-sm:      0 1px 2px rgba(0,0,0,0.05);
  --shadow-md:      0 4px 12px rgba(14,30,52,0.08);
  --shadow-xl:      0 12px 36px -8px rgba(0,128,201,0.18);

  --radius-sm:      6px;
  --radius:         10px;
  --radius-lg:      14px;
  --radius-xl:      18px;

  /* Spacing-Skala (4px-Basis) — V2 B1. Neue Komponenten nutzen diese Stufen
     statt freier px-Werte, fuer eine konsistente vertikale Rhythmik. */
  --space-1:        4px;
  --space-2:        8px;
  --space-3:        12px;
  --space-4:        16px;
  --space-5:        24px;
  --space-6:        32px;
  --space-8:        48px;

  /* Elevation-Policy (V2 B1): produktiv nur ZWEI Stufen verwenden —
     --shadow-sm (ruhend: Cards/Inputs) und --shadow-md (angehoben: Hover/Popover).
     --shadow-xl ist Overlays/Modals vorbehalten, nie fuer Inline-Elemente.
     Ampel-Tokens (--ampel-*) = Kalibrier-/Pruefstatus; Status-Tokens (--st-*) =
     BM-Betriebsstatus — bewusst getrennt, nicht zusammenfuehren. */

  --motion-fast:    120ms;
  --motion-base:    180ms;
  --motion-medium:  240ms;
  --motion-slow:    450ms;
  --ease:           cubic-bezier(.4,0,.2,1);
  --ease-out:       cubic-bezier(.16,1,.3,1);
  --ease-spring:    cubic-bezier(.2,.8,.25,1);

  --font-display:   'Montserrat', system-ui, sans-serif;
  --font-body:      'Open Sans',  system-ui, sans-serif;
  --font-mono:      'Fira Code',  'JetBrains Mono', monospace;

  --sidebar-w:      244px;
  --sidebar-w-collapsed: 72px;
  --header-h:       64px;
  --footer-h:       40px;   /* RMS-Stil 3-spaltig (Copyright / SiegAI / Version) */
}

[data-theme="dark"], html.dark {
  --primary:        #1ea3ec;
  --primary-soft:   rgba(30,163,236,0.16);
  --accent:         #ff7a3d;
  --accent-soft:    rgba(255,122,61,0.16);

  --bg:             #0a1220;
  --surface:        #141d2f;
  --surface-2:      #1a2440;
  --border:         #1f2a3d;
  --border-strong:  #2a3754;

  --text:           #f1f5f9;
  --text-muted:     #cbd5e1;
  --text-subtle:    #a3b3c7;

  --glass-bg:       rgba(34,46,64,0.78);
  --glass-bg-solid: rgba(40,55,76,0.96);
  --glass-border:   rgba(255,255,255,0.12);
  --glass-shadow:   0 6px 24px rgba(0,0,0,0.45);

  --st-lager-soft:     rgba(34,197,94,0.16);
  --st-reparatur-soft: rgba(255,122,61,0.18);
  --st-umbau-soft:     rgba(30,163,236,0.18);
  --st-verleih-soft:   rgba(167,139,250,0.18);
}

/* ============================================================
   Reset + Base
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }

body {
  font-family: var(--font-body);
  font-size: 0.95rem;
  line-height: 1.55;
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
  position: relative;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

/* Aurora-Background — opt-in via body.has-aurora (Dashboard + Login only).
   Plan-Entscheidung Kap. 4.1: zurueckhaltend, geschaeftlicher Einsatz. */
body.has-aurora::before {
  content: "";
  position: fixed;
  inset: -20%;
  z-index: 0;
  opacity: 0.10;
  filter: blur(120px);
  background:
    radial-gradient(45% 55% at 12% 18%, var(--aurora-1) 0%, transparent 60%),
    radial-gradient(35% 45% at 88% 12%, var(--aurora-2) 0%, transparent 60%);
  animation: aurora-drift 60s ease-in-out infinite alternate;
  pointer-events: none;
}
[data-theme="dark"] body.has-aurora::before { opacity: 0.18; }

@keyframes aurora-drift {
  0%   { transform: translate(0,0)    scale(1); }
  50%  { transform: translate(2%,-1%) scale(1.08); }
  100% { transform: translate(-1%,2%) scale(1.04); }
}

h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 700;
  margin: 0;
  letter-spacing: -.015em;
}
h1 { font-size: 2.5rem;  line-height: 1.05; letter-spacing: -.025em; }
h2 { font-size: 1.5rem;  line-height: 1.2; }
h3 { font-size: 1.05rem; line-height: 1.3; }

.mono, code { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }

.eyebrow {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-subtle);
}

/* ============================================================
   Form-Elements: Theme-Lesbarkeit (kritischer Fix PLAN-04)
   ============================================================
   User-Agent-Defaults setzen schwarzen Text + weisses BG —
   im Dark-Mode unlesbar. Hier global via Token-Werte ueberschreiben.
   Niedrige Spezifitaet, damit Komponenten-Klassen ueberlagern koennen. */

input, select, textarea, button {
  color: var(--text);
  -webkit-text-fill-color: var(--text);
}
input::placeholder, textarea::placeholder {
  color: var(--text-subtle);
  opacity: 1;
}
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
select,
textarea {
  background: var(--surface);
}
select option {
  background: var(--surface);
  color: var(--text);
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition-duration: 0.01ms !important; }
  body.has-aurora::before { animation: none !important; }
}