/* way2flow design tokens. One source; tenant skins may override --accent and the logo only. */

@font-face { font-family: "Unbounded"; src: url("../fonts/unbounded-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Unbounded"; src: url("../fonts/unbounded-latin-600-normal.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Unbounded"; src: url("../fonts/unbounded-latin-700-normal.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("../fonts/ibm-plex-sans-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("../fonts/ibm-plex-sans-latin-500-normal.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("../fonts/ibm-plex-sans-latin-600-normal.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Martian Mono"; src: url("../fonts/martian-mono-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Martian Mono"; src: url("../fonts/martian-mono-latin-500-normal.woff2") format("woff2"); font-weight: 500; font-display: swap; }

/* Base modes. Neutrals come from the mode; a personal tint can lean them toward any hue.
   Text is --ink or --ink-2. --ink-3 is for hairline-weight marks and large numerals only (3:1), never small text.
   Signals are fills; where a signal has to be read as text or a thin line, use its -text or -line token, which
   keeps the hue and meets contrast on that theme's ground. */
:root,
:root[data-theme="dark"] {
    --bg-0: #111213; --surface-0: #18191B; --raised-0: #202225;
    --ink: #EDEBE6; --ink-2: #9A988F; --ink-3: #77756E;
    --hairline-0: #2E3033; --grid-0: #1C1D1F;
    --shadow: rgba(0, 0, 0, 0.55);
    --scrim: rgba(17, 18, 19, 0.78);
    --accent-default: #EDEBE6;
    --field-border: #727479;
    --sig-live-text: #5CF2B4; --sig-you-text: #FFB020; --sig-verify-text: #B8E62E; --sig-alarm-text: #FF6B7A; --sig-done-text: #3FBF85;
    --sig-live-line: #5CF2B4; --sig-you-line: #FFB020; --sig-verify-line: #B8E62E;
    --light-ring: transparent;
    color-scheme: dark;
}

:root[data-theme="light"] {
    --bg-0: #F2F0EA; --surface-0: #FBFAF6; --raised-0: #FFFFFF;
    --ink: #151515; --ink-2: #55534E; --ink-3: #7E7B73;
    --hairline-0: #D9D5CB; --grid-0: #E7E3DA;
    --shadow: rgba(21, 21, 21, 0.12);
    --scrim: rgba(242, 240, 234, 0.72);
    --accent-default: #151515;
    --field-border: #8E8A80;
    --sig-live-text: #0A7A50; --sig-you-text: #8A5300; --sig-verify-text: #4B5E00; --sig-alarm-text: #B3001B; --sig-done-text: #17724B;
    --sig-live-line: #0E9460; --sig-you-line: #A86A00; --sig-verify-line: #6E8A00;
    --light-ring: #151515;
    color-scheme: light;
}

:root[data-theme="black"] {
    --bg-0: #000000; --surface-0: #09090A; --raised-0: #121214;
    --ink: #F2F0EB; --ink-2: #8E8C85; --ink-3: #6E6C66;
    --hairline-0: #232427; --grid-0: #0D0D0F;
    --shadow: rgba(0, 0, 0, 0.9);
    --scrim: rgba(0, 0, 0, 0.82);
    --accent-default: #F2F0EB;
    --field-border: #6A6C72;
    --sig-live-text: #5CF2B4; --sig-you-text: #FFB020; --sig-verify-text: #B8E62E; --sig-alarm-text: #FF6B7A; --sig-done-text: #3FBF85;
    --sig-live-line: #5CF2B4; --sig-you-line: #FFB020; --sig-verify-line: #B8E62E;
    --light-ring: transparent;
    color-scheme: dark;
}

:root[data-theme="contrast"] {
    --bg-0: #FFFFFF; --surface-0: #FFFFFF; --raised-0: #FFFFFF;
    --ink: #000000; --ink-2: #1F1F1F; --ink-3: #3A3A3A;
    --hairline-0: #000000; --grid-0: #D0D0D0;
    --shadow: rgba(0, 0, 0, 0.3);
    --scrim: rgba(255, 255, 255, 0.94);
    --accent-default: #000000;
    --field-border: #000000;
    --sig-live-text: #005C3B; --sig-you-text: #6B4000; --sig-verify-text: #3A4A00; --sig-alarm-text: #A00018; --sig-done-text: #0F5E3C;
    --sig-live-line: #005C3B; --sig-you-line: #6B4000; --sig-verify-line: #3A4A00;
    --light-ring: #000000;
    color-scheme: light;
}

:root {
    --tint: #7FA7FF;
    --tint-amount: 0%;
    --bg: color-mix(in oklab, var(--bg-0), var(--tint) var(--tint-amount));
    --surface: color-mix(in oklab, var(--surface-0), var(--tint) var(--tint-amount));
    --raised: color-mix(in oklab, var(--raised-0), var(--tint) calc(var(--tint-amount) * 0.7));
    --hairline: color-mix(in oklab, var(--hairline-0), var(--tint) calc(var(--tint-amount) * 1.6));
    --grid: color-mix(in oklab, var(--grid-0), var(--tint) calc(var(--tint-amount) * 1.3));
    --accent: var(--accent-custom, var(--accent-skin, var(--accent-default)));
    --accent-ink: var(--accent-ink-custom, var(--bg-0));
    /* Focus never follows the accent: it stays ink so it is visible whatever accent a person picks. */
    --focus: var(--ink);
}

:root {
    /* Signals: fixed meaning in every theme and every tenant skin. */
    --sig-queued: #6B7A8F;
    --sig-active: #FF4A1C;
    --sig-review: #2F4BFF;
    --sig-verify: #B8E62E;
    --sig-done: #1F8A5B;
    --sig-canceled: var(--ink-2);
    --sig-live: #5CF2B4;
    --sig-you: #FFB020;
    --sig-alarm: #E5213A;

    --font-display: "Unbounded", "Arial Black", sans-serif;
    --font-text: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
    --font-mono: "Martian Mono", "SFMono-Regular", Consolas, monospace;

    --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s6: 24px; --s8: 32px; --s12: 48px;
    --radius: 2px;
    --chamfer-plate: 12px;
    --chamfer-card: 8px;

    --rail-w: 64px;
    --bar-h: 56px;
    --inbox-w: 320px;
    --tray-h: 220px;
    --strip-h: 76px;
    --col-w: 296px;
    --card-w: 280px;

    --ease-settle: cubic-bezier(.2, .8, .2, 1);
    --ease-flip: cubic-bezier(.3, .7, .2, 1);
    --ease-spring: cubic-bezier(.34, 1.56, .64, 1);
    --t-settle: 180ms;
    --t-flip: 240ms;
}

.cat-queued   { --cat: var(--sig-queued); }
.cat-active   { --cat: var(--sig-active); }
.cat-review   { --cat: var(--sig-review); }
.cat-verify   { --cat: var(--sig-verify); }
:root[data-theme="light"] .cat-verify, :root[data-theme="contrast"] .cat-verify { --cat: var(--sig-verify-line); }
.cat-done     { --cat: var(--sig-done); }
.cat-canceled { --cat: var(--sig-canceled); }

/* Sheets outside the shell (Hangar, the draft review, slips) follow the inbox width the shell settles on. */
:root:has(.shell.inbox-collapsed) { --inbox-w: 48px; }
@media (max-width: 1439px) {
    :root { --inbox-w: 48px; }
    :root:has(.shell.inbox-open:not(.lifted-shell)) { --inbox-w: 320px; }
}

:root[data-density="compact"] { --col-w: 256px; --card-w: 240px; font-size: 13px; }
:root[data-density="compact"] body { font-size: 13px; }

@media (prefers-reduced-motion: reduce) {
    :root { --t-settle: 1ms; --t-flip: 1ms; }
}

:root[data-motion="calm"] { --t-settle: 1ms; --t-flip: 1ms; }