/* public/assets/css/tokens.css
 * Fuchs Office design tokenek - EGY forrás: az office (common.css) és a weboldalak
 * (sites/_core, publikáláskor bemásolva) is ezt használja, így együtt fejlődnek.
 * Csak változók (+ sötét mód); komponens-stílus ide ne kerüljön.
 */

/* ==========================================
   DESIGN TOKENEK (Fuchs Office, 2026-11 redesign)
   A régi változónevek megmaradtak, hogy a modul-CSS-ek ne törjenek el.
   ========================================== */
:root {
    --font-main: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
    --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

    --color-primary: #005cb2;
    --color-primary-hover: #004a8f;
    --color-primary-pale: #e8f1fb;
    --color-success: #0b6b47;
    --color-success-hover: #08553a;
    --color-success-pale: #e7f6ee;
    --color-warning: #8a4b08;
    --color-warning-pale: #fef6e7;
    --color-warning-border: #f5d9a8;
    --color-danger: #b42318;
    --color-danger-hover: #912018;
    --color-danger-pale: #fef3f2;
    --color-danger-border: #f4caca;
    --color-bg-main: #f6f7f9;
    --color-surface: #ffffff;
    --color-surface-muted: #fafbfc;
    --color-text-dark: #0f172a;
    --color-text-muted: #5b6474;
    --color-border: #e4e7ec;
    --color-border-strong: #c9d1dc;
    --color-primary-border: #bfd8f2;
    --color-success-border: #b4e2c9;
    --color-surface-sunken: #eef1f5;
    --color-hover: #f1f3f6;
    --color-current-col: #f5f9fe;
    --color-text-secondary: #334155;
    --color-on-primary: #ffffff;     /* szöveg a primary/success/danger hátterű gombon */
    --color-brand-panel: #0f172a;    /* login bal oldali márkasáv */
    --color-code-bg: #0f172a;

    --radius-sm: 8px;
    --radius-md: 10px;
    --radius-lg: 12px;
    --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.06);
    --focus-ring: 0 0 0 3px rgba(0, 92, 178, 0.18);
    color-scheme: light;
}

/* Sötét mód: a rendszer-beállítást követi, kivéve ha a felhasználó kézzel választott
   (<html data-theme="light|dark">, lásd layouts/main.php + ui.js) */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --color-primary: #5aa2ec;
        --color-primary-hover: #7ab5f0;
        --color-primary-pale: #15263b;
        --color-primary-border: #24476b;
        --color-success: #4ccf8e;
        --color-success-hover: #6ddba3;
        --color-success-pale: #12291f;
        --color-success-border: #1f5038;
        --color-warning: #e8b35a;
        --color-warning-pale: #2b2213;
        --color-warning-border: #5a4420;
        --color-danger: #f07a72;
        --color-danger-hover: #f49a93;
        --color-danger-pale: #2e1716;
        --color-danger-border: #5c2a27;
        --color-bg-main: #0e1116;
        --color-surface: #161b22;
        --color-surface-muted: #1b212a;
        --color-surface-sunken: #222a35;
        --color-hover: #232b36;
        --color-current-col: #17202b;
        --color-text-dark: #e6e9ef;
        --color-text-secondary: #c3cad5;
        --color-text-muted: #9aa4b2;
        --color-border: #2a323d;
        --color-border-strong: #3a4452;
        --color-on-primary: #0b1220;
        --color-brand-panel: #0b1220;
        --color-code-bg: #0b1220;
        --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
        --focus-ring: 0 0 0 3px rgba(90, 162, 236, 0.35);
        color-scheme: dark;
    }
}

:root[data-theme="dark"] {
    --color-primary: #5aa2ec;
    --color-primary-hover: #7ab5f0;
    --color-primary-pale: #15263b;
    --color-primary-border: #24476b;
    --color-success: #4ccf8e;
    --color-success-hover: #6ddba3;
    --color-success-pale: #12291f;
    --color-success-border: #1f5038;
    --color-warning: #e8b35a;
    --color-warning-pale: #2b2213;
    --color-warning-border: #5a4420;
    --color-danger: #f07a72;
    --color-danger-hover: #f49a93;
    --color-danger-pale: #2e1716;
    --color-danger-border: #5c2a27;
    --color-bg-main: #0e1116;
    --color-surface: #161b22;
    --color-surface-muted: #1b212a;
    --color-surface-sunken: #222a35;
    --color-hover: #232b36;
    --color-current-col: #17202b;
    --color-text-dark: #e6e9ef;
    --color-text-secondary: #c3cad5;
    --color-text-muted: #9aa4b2;
    --color-border: #2a323d;
    --color-border-strong: #3a4452;
    --color-on-primary: #0b1220;
    --color-brand-panel: #0b1220;
    --color-code-bg: #0b1220;
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
    --focus-ring: 0 0 0 3px rgba(90, 162, 236, 0.35);
    color-scheme: dark;
}
