/*
 * tokens.css — maklora-dashboard-r2 designsystem (AUTO-GENERATED)
 * Källa: maklora-dashboard-r2/_brain/registers/design.yaml
 * Regenerera: python3 -m _brain.tools.design_tokens --root <workspace>
 * RÖR EJ DIREKT. Ändra design.yaml och regenerera.
 */

/* === DARK (default) === */
:root, [data-theme="dark"] {
    --color-primary: #365fc0;
    --color-primary-hover: #2a4fa8;
    --color-accent-blue: #57c2ed;
    --color-brand-surface: #fefcfa;
    --color-success-green: #10b981;
    --color-warning-amber: #f59e0b;
    --color-danger-red: #dc2626;
    --color-info-blue: #365fc0;

    --badge-neutral-bg: rgba(100,116,139,0.12);
    --badge-info-bg: rgba(54,95,192,0.12);
    --badge-success-bg: rgba(52,211,153,0.12);
    --badge-varning-bg: rgba(251,191,36,0.12);
    --badge-risk-bg: rgba(248,113,113,0.12);
    --bg: #0b0f1a;
    --side: rgb(0 0 0 / .25);
    --card: rgb(255 255 255 / .05);
    --card-hover: rgb(255 255 255 / .075);
    --well: rgb(0 0 0 / .14);
    --line: rgb(255 255 255 / .10);
    --line-soft: rgb(255 255 255 / .06);
    --line-strong: rgb(255 255 255 / .15);
    --ring-card: inset 0 0 0 1px rgb(255 255 255 / .07);
    --text: #ffffff;
    --text-2: #a3aec0;
    --text-3: #71809a;
    --accent: #3d6fd0;
    --accent-hover: #4e80e0;
    --accent-text: #57c2ed;
    --accent-soft: rgb(87 194 237 / .12);
    --btn2-bg: rgb(255 255 255 / .10);
    --btn2-hover: rgb(255 255 255 / .18);
    --btn2-ring: rgb(255 255 255 / .06);
    --ok: #4ade80;
    --ok-bg: rgb(74 222 128 / .10);
    --ok-ring: rgb(74 222 128 / .28);
    --warn: #facc15;
    --warn-bg: rgb(250 204 21 / .10);
    --warn-ring: rgb(250 204 21 / .28);
    --err: #f87171;
    --err-bg: rgb(248 113 113 / .10);
    --err-ring: rgb(248 113 113 / .28);
    --info: #57c2ed;
    --info-bg: rgb(87 194 237 / .10);
    --info-ring: rgb(87 194 237 / .28);
    --shadow-xs: 0 0 0 0 transparent;
    --shadow-float: 0 12px 32px rgb(0 0 0 / .45);
    --input-bg: rgb(255 255 255 / .05);
    --input-ring: rgb(255 255 255 / .10);
    --glow: radial-gradient(52rem 17rem at 82% 0%, rgb(87 194 237 / .20), transparent 65%), radial-gradient(38rem 14rem at 55% 10%, rgb(54 95 192 / .16), transparent 62%);
    --font-ui: "Inter var", ui-sans-serif, system-ui, sans-serif;
    --font-ui-mono: "JBMono", ui-monospace, monospace;
    --radius-card: .5rem;
    --radius-btn: .375rem;
    --radius-input: .375rem;
    --radius-kbd: .25rem;
    --gutter: 2.5rem;
    --wrap-max: 90rem;
    --side-w: 17.5rem;
    --top-h: 4rem;
    --diagram-h: 11.25rem;

    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 16px;
    --space-lg: 24px;
    --space-xl: 32px;
    --space-2xl: 48px;
    --space-3xl: 64px;
    --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Inter', sans-serif;
    --font-mono: 'JetBrains Mono', 'Consolas', 'Courier New', monospace;
    --font-size-xs: 11px;
    --font-size-sm: 12px;
    --font-size-md: 13px;
    --font-size-lg: 15px;
    --font-size-xl: 16px;
    --font-size-2xl: 20px;
    --font-size-3xl: 24px;
    --font-size-4xl: 32px;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-bold: 600;
    --font-weight-heavy: 700;
    --line-height-tight: 1.2;
    --line-height-base: 1.5;
    --line-height-relaxed: 1.7;
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-pill: 9999px;
    --shadow-sm: 0 2px 8px rgba(15, 23, 42, 0.06);
    --shadow-md: 0 4px 14px rgba(0, 0, 0, 0.18);
    --shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.50);
    --shadow-panel: 0 2px 12px rgba(54, 95, 192, 0.08);
    --transition-fast: 100ms ease-out;
    --transition-base: 150ms ease-out;
    --transition-slow: 250ms ease-out;
    --font-stack: var(--font-sans);
}

/* === LIGHT (override via toggle) === */
[data-theme="light"] {
    --color-primary: #365fc0;
    --color-primary-hover: #2a4fa8;
    --color-accent-blue: #57c2ed;
    --color-brand-surface: #fefcfa;
    --color-success-green: #10b981;
    --color-warning-amber: #f59e0b;
    --color-danger-red: #dc2626;
    --color-info-blue: #365fc0;

    --badge-neutral-bg: rgba(100,116,139,0.12);
    --badge-info-bg: rgba(54,95,192,0.12);
    --badge-success-bg: rgba(52,211,153,0.12);
    --badge-varning-bg: rgba(251,191,36,0.12);
    --badge-risk-bg: rgba(248,113,113,0.12);
    --bg: #fefcfa;
    --side: #fdf8f2;
    --card: #fdf8f2;
    --card-hover: #f5efe9;
    --well: #f5ede0;
    --line: rgb(15 23 42 / .10);
    --line-soft: rgb(15 23 42 / .07);
    --line-strong: rgb(15 23 42 / .18);
    --ring-card: inset 0 0 0 1px rgb(15 23 42 / .07);
    --text: #0f172a;
    --text-2: #334155;
    --text-3: #64748b;
    --accent: #365fc0;
    --accent-hover: #2a4fa8;
    --accent-text: #2a4fa8;
    --accent-soft: rgb(54 95 192 / .09);
    --btn2-bg: #fefcfa;
    --btn2-hover: #e7e9ec;
    --btn2-ring: rgb(15 23 42 / .15);
    --ok: #15803d;
    --ok-bg: rgb(21 128 61 / .08);
    --ok-ring: rgb(21 128 61 / .20);
    --warn: #a16207;
    --warn-bg: rgb(161 98 7 / .08);
    --warn-ring: rgb(161 98 7 / .20);
    --err: #b91c1c;
    --err-bg: rgb(185 28 28 / .07);
    --err-ring: rgb(185 28 28 / .20);
    --info: #2059a8;
    --info-bg: rgb(32 89 168 / .07);
    --info-ring: rgb(32 89 168 / .20);
    --shadow-xs: 0 1px 2px 0 rgb(15 23 42 / .05);
    --shadow-float: 0 10px 15px -3px rgb(15 23 42 / .1), 0 4px 6px -4px rgb(15 23 42 / .1);
    --input-bg: #fefcfa;
    --input-ring: rgb(15 23 42 / .15);
}