/*
 * Presura Design Tokens (v2)
 * ---------------------------------------------------------------
 * Enige token-bron voor de Presura visuele update. Aliast bestaande
 * `--presura-*` waarden zodat introductie visueel neutraal is.
 *
 * Structuur:
 *   :root                → light / editorial default
 *   [data-theme="night"] → dark thema (bestaande workspace look)
 *   [data-theme="ops"]   → admin mission-control (Adm-1 activeert dit)
 *
 * Uitbreidbaar. Verwijderen/hernoemen = CHANGE (zie guardrails
 * "Design System v2"). Zie docs/PRESURA_REDESIGN_PROPOSAL.md §3.1.
 */

:root {
    /* ---------- Kleur ---------- */
    --psr-color-bg: #f7f5ef;                 /* alias --presura-bg */
    --psr-color-surface: #fffdfa;            /* alias --presura-surface */
    --psr-color-surface-muted: #f3f0e8;      /* alias --presura-surface-muted */
    --psr-color-surface-elev: #ffffff;
    --psr-color-border: #c8d7d2;             /* alias --presura-border */
    --psr-color-border-strong: #a4b8b2;
    --psr-color-text: #073f3a;               /* alias --presura-text */
    --psr-color-text-muted: #58716d;         /* alias --presura-text-muted */
    --psr-color-text-inverse: #f4f1e8;

    --psr-color-accent: #21877f;             /* alias --presura-teal */
    --psr-color-accent-soft: rgba(33, 135, 127, 0.14);
    --psr-color-accent-strong: #0f5f57;

    --psr-color-info: #54b9dc;               /* alias --presura-weather-blue */
    --psr-color-info-soft: rgba(84, 185, 220, 0.16);

    --psr-color-warning: #eba93a;            /* alias --presura-warning */
    --psr-color-warning-soft: rgba(235, 169, 58, 0.18);
    --psr-color-success: #94d66f;            /* alias --presura-success */
    --psr-color-success-soft: rgba(148, 214, 111, 0.2);
    --psr-color-danger: #d95c5c;             /* alias --presura-danger */
    --psr-color-danger-soft: rgba(217, 92, 92, 0.16);

    /* ---------- Typografie ----------
       Inter en IBM Plex zijn optioneel: als er lokaal geen self-hosted
       .woff2 aanwezig is (Guardrails §Security — geen third-party fonts),
       vallen we onder de systeem-stack (Segoe UI/San Francisco/...). Om
       Inter te activeren: leg `/assets/fonts/Inter.woff2` neer en voeg
       een `@font-face` toe onderaan dit bestand. */
    --psr-font-sans: "Inter", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
    --psr-font-display: "Inter Display", "Inter", "Segoe UI", system-ui, sans-serif;
    --psr-font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, "Cascadia Code", "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;

    --psr-fw-regular: 400;
    --psr-fw-medium: 500;
    --psr-fw-semibold: 600;
    --psr-fw-bold: 700;

    /* Modular scale, ~1.2 ratio, base 1rem */
    --psr-fs-1: 0.72rem;
    --psr-fs-2: 0.82rem;
    --psr-fs-3: 0.94rem;   /* body */
    --psr-fs-4: 1.08rem;
    --psr-fs-5: 1.28rem;
    --psr-fs-6: 1.6rem;
    --psr-fs-7: 2.15rem;
    --psr-fs-8: 2.85rem;

    --psr-lh-tight: 1.15;
    --psr-lh-snug: 1.35;
    --psr-lh-normal: 1.5;

    --psr-tracking-tight: -0.02em;
    --psr-tracking-normal: 0;
    --psr-tracking-loose: 0.08em;
    --psr-tracking-caps: 0.14em;

    /* ---------- Spacing (4-punts) ---------- */
    --psr-space-0: 0;
    --psr-space-1: 4px;
    --psr-space-2: 8px;
    --psr-space-3: 12px;
    --psr-space-4: 16px;
    --psr-space-5: 24px;
    --psr-space-6: 32px;
    --psr-space-7: 48px;
    --psr-space-8: 64px;

    /* ---------- Radii ---------- */
    --psr-radius-sm: 8px;
    --psr-radius-md: 12px;         /* alias --presura-radius-lg */
    --psr-radius-lg: 18px;         /* alias --presura-radius-xl */
    --psr-radius-pill: 999px;

    /* ---------- Elevatie ---------- */
    --psr-shadow-1: 0 1px 2px rgba(7, 63, 58, 0.06), 0 1px 1px rgba(7, 63, 58, 0.04);
    --psr-shadow-2: 0 8px 20px rgba(7, 63, 58, 0.08);   /* alias --presura-shadow-soft */
    --psr-shadow-3: 0 18px 48px rgba(4, 23, 22, 0.12); /* alias --presura-shadow-panel */
    --psr-shadow-inset: inset 0 1px 0 rgba(255, 255, 255, 0.4);

    /* ---------- Motion ---------- */
    --psr-ease-standard: cubic-bezier(0.2, 0.8, 0.2, 1);
    --psr-ease-emphasize: cubic-bezier(0.32, 0.72, 0, 1);
    --psr-duration-fast: 120ms;
    --psr-duration-base: 180ms;
    --psr-duration-slow: 260ms;

    /* ---------- Z-index (respecteert bestaande shell-schaal) ---------- */
    --psr-z-base: 1;
    --psr-z-overlay: 20;
    --psr-z-floating: 40;
    --psr-z-sticky: 60;
    --psr-z-sidebar: var(--presura-shell-z-sidebar, 2400);
    --psr-z-topbar: var(--presura-shell-z-topbar, 2450);
    --psr-z-backdrop: var(--presura-shell-z-backdrop, 2600);
    --psr-z-drawer: var(--presura-shell-z-drawer, 2700);
    --psr-z-modal: 3000;
    --psr-z-toast: 3100;
}

/* ---------- Dark thema (aliast bestaande night-waarden) ---------- */
body[data-theme="night"],
[data-theme="night"] {
    --psr-color-bg: #071716;
    --psr-color-surface: #0c201e;
    --psr-color-surface-muted: #0f2523;
    --psr-color-surface-elev: #10292a;
    --psr-color-border: #29433f;
    --psr-color-border-strong: #3a5a55;
    --psr-color-text: #f4f1e8;
    --psr-color-text-muted: #a8bfba;
    --psr-color-text-inverse: #073f3a;

    --psr-color-accent-soft: rgba(33, 135, 127, 0.24);
    --psr-color-info-soft: rgba(84, 185, 220, 0.22);
    --psr-color-warning-soft: rgba(235, 169, 58, 0.26);
    --psr-color-success-soft: rgba(148, 214, 111, 0.24);
    --psr-color-danger-soft: rgba(217, 92, 92, 0.22);

    --psr-shadow-1: 0 1px 2px rgba(0, 0, 0, 0.36), 0 1px 1px rgba(0, 0, 0, 0.2);
    --psr-shadow-2: 0 20px 48px rgba(0, 0, 0, 0.26);
    --psr-shadow-3: 0 24px 56px rgba(0, 0, 0, 0.36);
    --psr-shadow-inset: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

/* ---------- Ops thema (admin mission-control; Adm-1 activeert) ---------- */
[data-theme="ops"] {
    --psr-color-bg: #05101a;
    --psr-color-surface: #0a1a25;
    --psr-color-surface-muted: #0c2130;
    --psr-color-surface-elev: #10283a;
    --psr-color-border: #1e3a4f;
    --psr-color-border-strong: #2c5372;
    --psr-color-text: #eaf3f5;
    --psr-color-text-muted: #8fa8b5;

    --psr-color-accent: #7ccbe6;
    --psr-color-accent-soft: rgba(124, 203, 230, 0.14);
    --psr-color-accent-strong: #a1e0f4;

    --psr-color-info: #54b9dc;
    --psr-color-warning: #f4b752;
    --psr-color-success: #74d1a1;
    --psr-color-danger: #ef6f6f;

    --psr-shadow-1: 0 1px 2px rgba(0, 0, 0, 0.42), 0 1px 1px rgba(0, 0, 0, 0.28);
    --psr-shadow-2: 0 18px 40px rgba(0, 0, 0, 0.38);
    --psr-shadow-3: 0 24px 60px rgba(0, 0, 0, 0.5);
}