/* Blaulicht Network — Design Tokens (dark-first, Blueprint) */

:root {
    /* Surfaces */
    --bl-bg: #0a0e17;
    --bl-bg-elevated: #0f172a;
    --bl-bg-gradient: linear-gradient(165deg, #070b14 0%, #0b1220 42%, #111827 100%);
    --bl-card: rgba(15, 23, 42, 0.78);
    --bl-card-hover: rgba(22, 32, 52, 0.92);
    --bl-card-solid: #121826;
    --bl-surface-light: #ffffff;
    --bl-surface-light-muted: #f8fafc;

    /* Text */
    --bl-text: #f8fafc;
    --bl-text-muted: rgba(226, 232, 240, 0.78);
    --bl-text-subtle: rgba(148, 163, 184, 0.92);
    --bl-text-on-light: #0f172a;
    --bl-text-on-light-muted: #475569;
    --bl-text-on-dark: #ffffff;

    /* Accent (Blaulicht red) + Blueprint cyan glow */
    --bl-accent: #e63946;
    --bl-accent-hover: #ff4d5a;
    --bl-accent-glow: rgba(230, 57, 70, 0.4);
    --bl-glow: #38bdf8;
    --bl-glow-soft: rgba(56, 189, 248, 0.32);
    --bl-glow-border: rgba(56, 189, 248, 0.42);
    --bl-link: #7dd3fc;
    --bl-link-hover: #bae6fd;

    /* Borders & shadows */
    --bl-border: rgba(255, 255, 255, 0.1);
    --bl-border-strong: rgba(255, 255, 255, 0.16);
    --bl-shadow: 0 8px 32px rgba(0, 0, 0, 0.35);
    --bl-shadow-sm: 0 2px 12px rgba(0, 0, 0, 0.25);

    /* Radius & typography */
    --bl-radius: 14px;
    --bl-radius-sm: 10px;
    --bl-radius-lg: 18px;
    --bl-font: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;

    /* Org theme vars (set via vehicleThemeStyle inline) */
    --v-primary: var(--bl-accent);
    --v-bg: var(--bl-bg);
    --v-card-bg: var(--bl-card);
    --v-text: var(--bl-text);
    --v-text-muted: var(--bl-text-muted);
    --v-border: var(--bl-border);
    --v-button-glow: var(--bl-accent);
    --v-button-fade: 0.6;
    --v-hero-fade: var(--bl-bg);
    --v-hero-fade-opacity: 0.85;

    /* Legacy aliases (app.css compatibility) */
    --bg-page: var(--bl-bg);
    --bg-card: var(--bl-card-solid);
    --bg-dark: #070b14;
    --bg-dark-mid: #121a2c;
    --bg-dark-soft: #1e293b;
    --accent: var(--bl-accent);
    --accent-hover: var(--bl-accent-hover);
    --accent-glow: var(--bl-accent-glow);
    --text-primary: var(--bl-text);
    --text-secondary: var(--bl-text-muted);
    --text-muted: var(--bl-text-subtle);
    --text-on-dark: var(--bl-text);
    --border: var(--bl-border);
    --border-light: rgba(255, 255, 255, 0.08);
    --shadow-sm: var(--bl-shadow-sm);
    --shadow-md: var(--bl-shadow);
    --shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.45);
    --radius: var(--bl-radius-lg);
    --radius-sm: var(--bl-radius-sm);
    --nav-height: 72px;
    --font: var(--bl-font);
    --success: #10b981;
    --warning: #f59e0b;
    --danger: #ef4444;
    --info: #60a5fa;
    --card-accent: var(--bl-accent);
}