/* RailHQ-Designtokens als reines CSS (portiert aus RailHQ/dashboard/app/globals.css) */

:root {
  --color-bg-primary: #f8fafc;
  --color-bg-secondary: #ffffff;
  --color-bg-tertiary: #f1f5f9;
  --color-bg-elevated: #ffffff;

  --color-accent-primary: #0891b2;
  --color-accent-warm: #f97316;
  --color-accent-success: #10b981;
  --color-accent-warning: #f59e0b;
  --color-accent-error: #ef4444;

  --color-text-primary: #0f172a;
  --color-text-secondary: #475569;
  --color-text-muted: #94a3b8;
  --color-text-on-accent: #ffffff;

  --color-border: #e2e8f0;
  --color-border-hover: #cbd5e1;
  --color-ring: #0891b2;

  --shadow-card: 0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.04);
  --shadow-elevated: 0 4px 12px rgba(0,0,0,.1), 0 2px 4px rgba(0,0,0,.06);

  --sidebar-width: 256px;
  --font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;
}

.dark {
  --color-bg-primary: #0a0f1a;
  --color-bg-secondary: #111827;
  --color-bg-tertiary: #1e293b;
  --color-bg-elevated: #1e293b;

  --color-accent-primary: #06b6d4;
  --color-accent-warm: #fb923c;
  --color-accent-success: #10b981;
  --color-accent-warning: #f59e0b;
  --color-accent-error: #ef4444;

  --color-text-primary: #e2e8f0;
  --color-text-secondary: #94a3b8;
  --color-text-muted: #718096;
  --color-text-on-accent: #0a0f1a;

  --color-border: #1e293b;
  --color-border-hover: #334155;
  --color-ring: #06b6d4;

  --shadow-card: 0 1px 3px rgba(0,0,0,.3), 0 1px 2px rgba(0,0,0,.2);
  --shadow-elevated: 0 4px 12px rgba(0,0,0,.4), 0 2px 4px rgba(0,0,0,.3);
}

* { box-sizing: border-box; border-color: var(--color-border); }
html, body { margin: 0; padding: 0; }
body {
  background: var(--color-bg-primary);
  color: var(--color-text-primary);
  font-family: var(--font-sans);
  font-size: 14px;
}
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--color-bg-tertiary); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--color-border-hover); }