/* assets/styles/design-tokens.css */
:root {
    --font-display: 'Archivo', sans-serif;
    --font-mono: 'IBM Plex Mono', monospace;
    --font-body: 'Inter', sans-serif;

    /* Valeurs de secours en hexadécimal (navigateurs sans support d'oklch(), ex. Chrome < 111 —
       rencontré sur une tablette de terrain en Chrome 108) : oklch() n'est pas juste ignoré, une
       variable qui le contient devient invalide "at computed-value time" dès qu'elle est utilisée
       via var() sur un navigateur qui ne le comprend pas, ce qui fait retomber TOUTE la couleur du
       thème sur les valeurs par défaut du navigateur. Le bloc @supports plus bas réapplique les
       vraies valeurs oklch (perceptuellement uniformes) dès que le navigateur les supporte — ces
       valeurs hex ne sont qu'un filet de sécurité, pas la définition canonique de la palette. */
    --link: #aa5b00;
    --link-hover: #cb7a00;

    /* Dark theme (default, "terrain/nuit") */
    --bg: #0a0704;
    --surface: #17130e;
    --surface-raised: #1e1a14;
    --border-strong: #181611;
    --border-subtle: #36322d;
    --text: #f6f1eb;
    --text-muted: #978e82;
    --accent: #e89d00;
    --on-accent: #16140f;
    --active-bg: #e89d0029;
    --ok-bg: #25984d;
    --ok-text: #08210f;
    --warn-bg: #e78b30;
    --warn-text: #2a1400;
    --bad-bg: #c92f33;
    --bad-text: #fff;
    --na-bg: #36322d;
    --na-text: #aca397;
}

:root[data-theme="light"] {
    --bg: #faf4ec;
    --surface: #fffdf9;
    --surface-raised: #f1eae1;
    --border-strong: #181611;
    --border-subtle: #c9c3bc;
    --text: #14110d;
    --text-muted: #5a544c;
    --accent: #b76c00;
    --on-accent: #fff8ec;
    --active-bg: #b76c0024;
    --ok-bg: #43a65f;
    --ok-text: #04240f;
    --warn-bg: #ee9748;
    --warn-text: #2a1400;
    --bad-bg: #c92f33;
    --bad-text: #fff;
    --na-bg: #d2cdc7;
    --na-text: #4d473f;
}

@supports (color: oklch(0 0 0)) {
    :root {
        --link: oklch(0.55 0.16 70);
        --link-hover: oklch(0.65 0.16 70);

        --bg: oklch(0.13 0.012 75);
        --surface: oklch(0.19 0.012 75);
        --surface-raised: oklch(0.22 0.012 75);
        --border-strong: oklch(0.2 0.01 90);
        --border-subtle: oklch(0.32 0.01 75);
        --text: oklch(0.96 0.01 75);
        --text-muted: oklch(0.65 0.02 75);
        --accent: oklch(0.75 0.16 75);
        --active-bg: oklch(0.75 0.16 75 / 0.16);
        --ok-bg: oklch(0.6 0.15 150);
        --warn-bg: oklch(0.72 0.15 60);
        --bad-bg: oklch(0.55 0.19 25);
        --na-bg: oklch(0.32 0.01 75);
        --na-text: oklch(0.72 0.02 75);
    }

    :root[data-theme="light"] {
        --bg: oklch(0.97 0.012 75);
        --surface: oklch(0.995 0.006 75);
        --surface-raised: oklch(0.94 0.014 75);
        --border-subtle: oklch(0.82 0.012 75);
        --text: oklch(0.18 0.01 75);
        --text-muted: oklch(0.45 0.015 75);
        --accent: oklch(0.6 0.15 70);
        --active-bg: oklch(0.6 0.15 70 / 0.14);
        --ok-bg: oklch(0.65 0.14 150);
        --warn-bg: oklch(0.75 0.14 60);
        --bad-bg: oklch(0.55 0.19 25);
        --na-bg: oklch(0.85 0.01 75);
        --na-text: oklch(0.4 0.015 75);
    }
}