/*
 * Conflr — shared design tokens.
 *
 * ## What this file is
 *
 * The one definition of the palette, the type, the radii and the shadows for
 * every Conflr admin. A module's own stylesheet comes after it and declares one
 * thing: which hue is its own.
 *
 *     :root {
 *         --module: var(--hue-space);        --module-strong: var(--hue-space-strong);
 *         --module-ink: var(--hue-space-ink); --module-soft: var(--hue-space-soft);
 *         --module-on-dark: var(--hue-space-on-dark);
 *     }
 *
 * The copies in each module's `public/admin/` are generated: run
 * `php tools/sync-theme.php` after editing this file (or anything under
 * `shared/theme/`), and `php tools/sync-theme.php --check` fails if a copy has
 * drifted. Physical copies rather than a shared URL because each module is
 * deployed on its own subdomain from its own directory.
 *
 * ## The rules that hold it together
 *
 * **1. Hue carries module identity, so state may not also be "some colour".**
 * Space is green, eSignage blue, Floorplan purple, Expo amber, Content pink, the
 * account service slate. State is exactly three things — done, waiting, wrong —
 * in green, amber, red. A green "Space" badge and a green "confirmed" badge must
 * never be able to mean the same thing.
 *
 * **2. A fill is not a text colour.** Every hue comes in tiers:
 *   - `--module`         the identity itself: dots, rails, icons, focus rings;
 *   - `--module-strong`  a button's ground, under white text (≥ 4.5:1);
 *   - `--module-ink`     text and links on white or on the soft ground;
 *   - `--module-soft`    a light ground (selected row, active tab, hover);
 *   - `--module-on-dark` the same identity, lightened to read on `--panel`.
 * The raw `--module` is never text and never a button: #279368 on white is
 * 3.4:1. Same for state — `--success` is a fill, `--success-ink` is its text,
 * and white on `--success` or `--danger` fails, so a pill uses ink on soft.
 *
 * Contrast of every pair below was measured (AA: 4.5:1 text, 3:1 non-text).
 */

/* ---- Fonts -------------------------------------------------------------------
   Served from each module's own `admin/fonts/` (synced with this file), not from
   a font CDN: no third-party request on every page view, and nothing to break if
   that host is unreachable from a venue's network. Both are SIL OFL; licences sit
   next to the files.
   ------------------------------------------------------------------------- */
@font-face {
    font-family: "Inter";
    src: url("fonts/InterVariable.woff2") format("woff2");
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "JetBrains Mono";
    src: url("fonts/JetBrainsMono-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "JetBrains Mono";
    src: url("fonts/JetBrainsMono-Medium.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

:root {
    /* ---- Hues, one family per module -------------------------------------
       All of them here, not only the current module's: the module switcher and
       the event's three spaces (Logistics / Content / Expo) show several at once.
       ------------------------------------------------------------------ */
    --hue-space: #279368;
    --hue-space-strong: #1F7F59;
    --hue-space-ink: #1B6E4D;
    --hue-space-soft: #E6F3EC;
    --hue-space-on-dark: #4CC08C;
    --hue-space-eyebrow: #7FD1AC;

    --hue-esignage: #3B7DE8;
    --hue-esignage-strong: #2563C9;
    --hue-esignage-ink: #1D4FA3;
    --hue-esignage-soft: #E8F0FD;
    --hue-esignage-on-dark: #6EA0F0;
    --hue-esignage-eyebrow: #9FBFF4;

    --hue-floorplan: #8C4FCB;
    --hue-floorplan-strong: #7A3FB8;
    --hue-floorplan-ink: #62309A;
    --hue-floorplan-soft: #F2EAFA;
    --hue-floorplan-on-dark: #B58AE3;
    --hue-floorplan-eyebrow: #CFB2EE;

    /* Warm, because the others are cool and a switcher tile has to be told apart
       at a glance. Also the ground of the exhibitor app's favicon. */
    --hue-expo: #C2611A;
    --hue-expo-strong: #A85414;
    --hue-expo-ink: #8A440F;
    --hue-expo-soft: #FBEEE3;
    --hue-expo-on-dark: #E9904B;
    --hue-expo-eyebrow: #F2B27E;

    /* The event's programme and documents. A space inside Space, not a module of
       its own yet, but it needs an identity in the event panel. */
    --hue-content: #C93A7E;
    --hue-content-strong: #B02F6C;
    --hue-content-ink: #92265A;
    --hue-content-soft: #FBE9F2;
    --hue-content-on-dark: #E472A8;
    --hue-content-eyebrow: #EFA3C6;

    /* The account service. Not a module — the door to all of them — so it is
       visibly neither green nor blue. Also the default below, so a module that
       forgets to declare its hue looks deliberate rather than broken. */
    --hue-auth: #4A5F86;
    --hue-auth-strong: #3E5175;
    --hue-auth-ink: #34456A;
    --hue-auth-soft: #EBEFF5;
    --hue-auth-on-dark: #9FB6DC;
    --hue-auth-eyebrow: #C3D1EA;

    /* ---- The current module ---------------------------------------------
       Overridden by each module's own stylesheet.
       ------------------------------------------------------------------ */
    --module: var(--hue-auth);
    --module-strong: var(--hue-auth-strong);
    --module-ink: var(--hue-auth-ink);
    --module-soft: var(--hue-auth-soft);
    --module-on-dark: var(--hue-auth-on-dark);
    --module-eyebrow: var(--hue-auth-eyebrow);

    /* ---- Neutrals --------------------------------------------------------
       Light, because of what these tools are: dense tables read at a desk in
       daylight for an hour at a time. Lines are neutral; the hue is spent on
       identity and actions, not on every outline.
       ------------------------------------------------------------------ */
    --bg: #F5F7FA;
    --surface: #FFFFFF;
    --surface-2: #F0F3F7;
    /* The ground of a table head: a step off white, not a band of grey. */
    --surface-head: #FAFBFC;
    --line: #E3E7EE;
    --line-strong: #CDD4DE;

    --text: #141B26;
    --text-2: #4B5565;
    /* The lightest text allowed: 4.9:1 on --bg, 4.8:1 on --surface-2. */
    --text-3: #636C7C;

    /* ---- State -----------------------------------------------------------
       Three, each with a fill, an ink for text and a soft ground.
       ------------------------------------------------------------------ */
    --success: #2F9E5F;
    --success-ink: #1D6B3E;
    --success-soft: #E5F4EA;
    --warning: #E0A100;
    --warning-ink: #8A5A00;
    --warning-soft: #FCF1D6;
    --danger: #D64545;
    --danger-ink: #A82828;
    --danger-soft: #FBE7E7;
    /* Text on a `--warning` fill (count of things waiting): 7.3:1. */
    --on-warning: #2B1D00;

    /* ---- Dark panel ------------------------------------------------------
       The sidebar once you are inside an event, and the PWAs' top bar. Dark is
       what makes "you are inside something" obvious at a glance.
       ------------------------------------------------------------------ */
    --panel: #1C3055;
    --panel-2: #243A63;
    --panel-active: #2C4677;
    --panel-deep: #15253F;
    --panel-line: #2E4570;
    --panel-text: #C9D3E6;
    --panel-muted: #8C9BB8;
    --panel-faint: #A9B6CE;

    /* ---- Shape -----------------------------------------------------------
       Cards 14, menus 10, buttons and fields 6, pills 999.
       ------------------------------------------------------------------ */
    --r-sm: 6px;
    --r-md: 10px;
    --r-lg: 14px;
    --r-pill: 999px;

    /* Soft and short: a heavy dark shadow on a light page reads as dirt. */
    --shadow-1: 0 1px 2px rgb(20 35 60 / 6%);
    --shadow-2: 0 10px 30px rgb(20 35 60 / 12%);
    --shadow-3: 0 14px 36px rgb(20 35 60 / 18%);

    --gap: 16px;

    /* ---- Type ------------------------------------------------------------
       Page title 28/700 · card title 16/600 · body 14 · table head 12/600 ·
       help 12.5. Numbers, dates and amounts use tabular figures.
       ------------------------------------------------------------------ */
    --font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    --fs-title: 28px;
    --fs-card-title: 16px;
    --fs-body: 14px;
    --fs-head: 12px;
    --fs-help: 12.5px;
}

/*
 * Older names, still referenced by stylesheets that have not been redone yet
 * (eSignage, parts of Space). Pointed at the tokens above rather than deleted,
 * so nothing has to be found and renamed in several files at once. New rules
 * use the names above.
 */
:root {
    --border: var(--line);
    --border-strong: var(--line-strong);
    --text-dim: var(--text-3);
    --accent: var(--module-strong);
    --accent-strong: var(--module-ink);
    --module-tint: var(--module-soft);
    --module-tint-2: color-mix(in srgb, var(--module) 22%, white);
    --module-on-panel: var(--module-on-dark);
    --success-tint: var(--success-soft);
    --warning-tint: var(--warning-soft);
    --danger-tint: var(--danger-soft);
    --panel-border: var(--panel-line);
    --panel-text-dim: var(--panel-muted);
    --radius: var(--r-md);

    --brand-blue: var(--hue-esignage);
    --brand-blue-light: #6098EE;
    --brand-navy: var(--panel);
    --brand-green: var(--hue-space);
    --brand-green-dark: var(--success-ink);
}