/*
 * WhyData design tokens -- the single declaration of the palette.
 *
 * Source of truth:
 *   dev-docs/untracked/Ken/JSON Pack (anonymized)/config/ui_tokens.json
 *
 * Names below are the ui_tokens.json keys, prefixed `--wd-`, deliberately: a token
 * called `--wd-panel-secondary` needs no lookup table to check against the spec,
 * where a shortened invented name would. Every `-rgb` companion is the same colour
 * as a comma-separated triplet, which is the form DataTables' `--dt-*` variables
 * take; the HSL form Chainlit's theme.json needs lives in that repo, because bare
 * HSL triplets are meaningless to CSS here.
 *
 * PROVENANCE RULING (2026-08-09, made explicit because it is a judgement call).
 * The pack itself is uncommitted, carrier-derived documentation. `ui_tokens.json`
 * is the one file in it that carries no data: fifteen colours, three typography
 * values and a grid opacity, no identifiers, and the anonymisation map
 * (dev-docs/untracked/anonymization-map.md) catalogues no replacement inside it.
 * Transcribing those values into this tracked stylesheet therefore puts no
 * carrier-derived data into git. Everything value-bearing -- chart data, table
 * rows, KPI figures, source-card text, guardrail wording -- stays in the
 * uncommitted store and reaches a page only at request time.
 * If that ruling is ever rejected, the fallback is to read the tokens out of the
 * uncommitted store into a Twig global; the cost is that a fresh checkout renders
 * unstyled, which is why it is the fallback and not the design.
 *
 * Registered by one line in assets/app.js, before ./styles/app.css. No other file
 * may declare a `--wd-*` value: two declarations of a palette drift, and the whole
 * point of this file is that the Overview, Analytics, Evidence Library and chat
 * pages cannot disagree about what "panel" means.
 */

:root {
    /* ------------------------------------------------------------------ colors */
    --wd-background:            #02192b;
    --wd-background-rgb:        2, 25, 43;
    --wd-background-deep:       #01131f;
    --wd-background-deep-rgb:   1, 19, 31;
    --wd-panel:                 #07334a;
    --wd-panel-rgb:             7, 51, 74;
    --wd-panel-secondary:       #0c3b5b;
    --wd-panel-secondary-rgb:   12, 59, 91;
    --wd-panel-deep:            #041d2b;
    --wd-panel-deep-rgb:        4, 29, 43;
    --wd-divider:               #1b5a76;
    --wd-divider-rgb:           27, 90, 118;
    --wd-primary-cyan:          #00beda;
    --wd-primary-cyan-rgb:      0, 190, 218;
    --wd-success-green:         #66e34e;
    --wd-success-green-rgb:     102, 227, 78;
    --wd-accent-orange:         #ff6742;
    --wd-accent-orange-rgb:     255, 103, 66;
    --wd-risk-red:              #ff4f5e;
    --wd-risk-red-rgb:          255, 79, 94;
    --wd-accent-purple:         #9e6bff;
    --wd-accent-purple-rgb:     158, 107, 255;
    --wd-warning-yellow:        #ffc83d;
    --wd-warning-yellow-rgb:    255, 200, 61;
    --wd-text-primary:          #f2f7fa;
    --wd-text-primary-rgb:      242, 247, 250;
    --wd-text-muted:            #b9d2e6;
    --wd-text-muted-rgb:        185, 210, 230;
    --wd-text-secondary:        #7d97aa;
    --wd-text-secondary-rgb:    125, 151, 170;

    /* -------------------------------------------------------------- typography */
    --wd-font-family: Helvetica, Arial, sans-serif;
    --wd-body-size: 14px;
    --wd-table-size: 12px;

    /* ---------------------------------------------------------- chart_defaults */
    --wd-grid-opacity: 0.15;

    /* ------------------------------------------------------------ status_tones */
    /* Aliases of the colours above, exactly as ui_tokens.json declares them. A tone
       never introduces a colour of its own -- that is what makes "risk" one hex
       across four pages instead of four hexes that nearly match. */
    --wd-tone-positive: var(--wd-success-green);
    --wd-tone-warning:  var(--wd-warning-yellow);
    --wd-tone-risk:     var(--wd-risk-red);
    --wd-tone-info:     var(--wd-primary-cyan);
    --wd-tone-neutral:  var(--wd-accent-purple);
}