/*
 * tokens.css — maklora-ui-kit-standardfix designsystem (AUTO-GENERATED)
 * Källa: maklora-ui-kit-standardfix/_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: #3a66c8;
    --color-primary-hover: #2f58b3;
    --color-accent-blue: #57c2ed;
    --color-brand-surface: #ffffff;
    --color-success-green: #2c9a6a;
    --color-warning-amber: #bf800e;
    --color-danger-red: #d9463f;
    --color-info-blue: #2f86d1;

    --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: #97a3b8;
    --accent: #3a66c8;
    --accent-hover: #2f58b3;
    --accent-text: #8fb2f5;
    --fokus: #8fb2f5;
    --pa-accent: #ffffff;
    --accent-soft: rgb(58 102 200 / .20);
    --btn2-bg: rgb(255 255 255 / .10);
    --btn2-hover: rgb(255 255 255 / .18);
    --btn2-ring: rgb(255 255 255 / .06);
    --ok: #6fd6a3;
    --ok-bg: rgb(44 154 106 / .16);
    --ok-ring: rgb(44 154 106 / .38);
    --warn: #f0c36a;
    --warn-bg: rgb(191 128 14 / .16);
    --warn-ring: rgb(191 128 14 / .38);
    --err: #f7a3a3;
    --err-bg: rgb(217 70 63 / .16);
    --err-ring: rgb(217 70 63 / .38);
    --info: #8cc4f7;
    --info-bg: rgb(47 134 209 / .16);
    --info-ring: rgb(47 134 209 / .38);
    --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: #6d7789;
    --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;
    --kontroll-h: 2.25rem;
    --kontroll-h-touch: 2.75rem;
    --rad-luft: 1rem;
    --rad-luft-tat: .375rem;
    --sektion-luft: 2.5rem;

    --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Inter', sans-serif;
    --font-mono: 'JetBrains Mono', 'Consolas', 'Courier New', monospace;
    --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: #3a66c8;
    --color-primary-hover: #2f58b3;
    --color-accent-blue: #57c2ed;
    --color-brand-surface: #ffffff;
    --color-success-green: #2c9a6a;
    --color-warning-amber: #bf800e;
    --color-danger-red: #d9463f;
    --color-info-blue: #2f86d1;

    --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: #ffffff;
    --side: #f7f7f8;
    --card: #f7f7f8;
    --card-hover: #efeff1;
    --well: #e9e9ec;
    --line: rgb(0 0 0 / .10);
    --line-soft: rgb(0 0 0 / .07);
    --line-strong: rgb(0 0 0 / .18);
    --ring-card: inset 0 0 0 1px rgb(0 0 0 / .07);
    --text: #18181b;
    --text-2: #3f3f46;
    --text-3: #5f5f68;
    --accent: #3a66c8;
    --accent-hover: #2f58b3;
    --accent-text: #2f58b3;
    --fokus: #2f58b3;
    --pa-accent: #ffffff;
    --accent-soft: rgb(58 102 200 / .10);
    --btn2-bg: #ffffff;
    --btn2-hover: #e9e9ec;
    --btn2-ring: rgb(0 0 0 / .15);
    --ok: #17663f;
    --ok-bg: rgb(44 154 106 / .12);
    --ok-ring: rgb(44 154 106 / .30);
    --warn: #80500a;
    --warn-bg: rgb(191 128 14 / .13);
    --warn-ring: rgb(191 128 14 / .32);
    --err: #b32424;
    --err-bg: rgb(217 70 63 / .10);
    --err-ring: rgb(217 70 63 / .28);
    --info: #1d5ea6;
    --info-bg: rgb(47 134 209 / .11);
    --info-ring: rgb(47 134 209 / .28);
    --shadow-xs: 0 1px 2px 0 rgb(0 0 0 / .05);
    --shadow-float: 0 10px 15px -3px rgb(15 23 42 / .1), 0 4px 6px -4px rgb(15 23 42 / .1);
    --input-bg: #ffffff;
    --input-ring: #85858f;
}
