/*
 * tokens.css: the design tokens of the panel (web/panel/index.html): colours, states, series, brand gradient, shadows, radii, spacing and fonts, ported from the approved mockup (eksport/2026-11-04_konkurs-ux/final_src/style_tokens*.css).
 * Loaded by: web/panel/index.html (a link element, first of the style files); panel.css and addresses.css only read these tokens and define none of their own.
 * Colours: every themed token is written once as light-dark(light value, dark value). Both themes are allowed by default, so the system decides (Auto); the switch in the top bar sets data-theme on the html element (assets/js/theme-init.js also does it before the first paint) and that forces one of them.
 * The first block holds the new names of the mockup, the second block the old names that panel.css and addresses.css use, mapped onto the new ones so the views keep working until they are restyled. The old --ink is the text colour; the --ink of the mockup (the blue of "confirmed") is --ink-conf here.
 * The coral end of the brand gradient fails AA for white text, so text on a gradient (a badge, a primary button) uses --grad-strong, whose ends are darker: white on both ends is at least 4.6:1; --grad (the light ends) is for accents without text.
 * The only url() is in the two @font-face rules at the end (the Inter files in ../fonts/); there is no @import, so a Content-Security-Policy that allows only 'self' (with font-src 'self') is enough.
 * Type: the end of the file holds the type tokens (family Inter with a system fallback, size scale, weights, line heights, letter spacing, tabular figures and the sizes of the big numbers); the stylesheets read them and define none. Weights: 400 text, 500 labels, buttons and numbers, 600 sub-headings and small caps labels, 700 only the page headings and the brand name.
 * @comments-complete 2026-11-05
 */
:root {
  color-scheme: light dark;
  /* surfaces and text */
  --bg: light-dark(#f5f4fb, #0d0c19);
  --surface: light-dark(#ffffff, #16152a);
  --surface-2: light-dark(#efeef8, #1f1e36);
  --line: light-dark(#e0deee, #2c2a48);
  --line-strong: light-dark(#c4c1da, #46436e);
  --text: light-dark(#17152b, #f1f0fc);
  --text-2: light-dark(#46435f, #c2bfdd);
  --text-3: light-dark(#62607c, #a19ec2);
  --accent-text: light-dark(#4a44d6, #aba7ff);
  --accent-b-text: light-dark(#c7351e, #ff8a78);
  --focus: light-dark(#5b55f0, #a5a1ff);
  --scrim: light-dark(#0f0c28, #03020e);
  /* brand, taken from the mark (violet to coral) */
  --brand-a: #6e68ff;
  --brand-b: #ff5a43;
  --grad: linear-gradient(90deg, #6e68ff, #ff5a43);
  --grad-strong: linear-gradient(90deg, #5b55f0, #d9381f);
  --on-grad: #ffffff;
  /* states: the colour of the sign and word, and its tint */
  --st-current: light-dark(#0a7650, #52e0a2);
  --st-current-bg: light-dark(#e1f4eb, #123428);
  --st-older: light-dark(#96560a, #ffb84d);
  --st-older-bg: light-dark(#fdefd3, #3b2a0c);
  --st-before: light-dark(#2f6286, #86bdeb);
  --st-before-bg: light-dark(#e0edf6, #15304a);
  --st-none: light-dark(#62607c, #a19ec2);
  --st-none-bg: light-dark(#eae9f3, #26243f);
  --st-error: light-dark(#b81d3f, #ff8299);
  --st-error-bg: light-dark(#fbe3e8, #451722);
  --st-unknown: light-dark(#5a4fa8, #b5adf2);
  --st-unknown-bg: light-dark(#ece9f8, #2b2750);
  /* series (one slot per company), the add/remove pair, the blue of "confirmed" and the heat ramp */
  --s1: light-dark(#2f6bdb, #6ea2ff);
  --s2: light-dark(#0e8f80, #35d1bf);
  --s3: light-dark(#d4561f, #ff9a66);
  --s4: light-dark(#be3a8c, #f27cc4);
  --s5: light-dark(#7a4fe0, #b396ff);
  --s6: light-dark(#a87a06, #e8c24a);
  --s7: light-dark(#5a8f1c, #9ad14b);
  --s8: light-dark(#5a6b8a, #9aaac8);
  --s9: light-dark(#85829e, #7c7a99);
  --add: light-dark(#2f6bdb, #6ea2ff);
  --del: light-dark(#d4561f, #ff9a66);
  --ink-conf: light-dark(#3a4a7a, #8fa3da);
  --heat: light-dark(#1e4a9c, #8fbbff);
  --on-heat: light-dark(#ffffff, #0d0c19);
  /* shadows: the colour of the shade is dark in both themes, so in the dark theme it is hardly seen on the dark surfaces */
  --shade: light-dark(#17152b, #000000);
  --shadow: 0 1px 2px color-mix(in srgb, var(--shade) 6%, transparent), 0 6px 20px color-mix(in srgb, var(--shade) 6%, transparent);
  --shadow-pop: 0 10px 40px color-mix(in srgb, var(--shade) 25%, transparent);
  /* radii, spacing and fonts */
  --r-s: 6px;
  --r-m: 10px;
  --r-l: 16px;
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --mono: ui-monospace, "SF Mono", "Cascadia Mono", "Segoe UI Mono", Consolas, monospace;
  /* the old names of panel.css and addresses.css, mapped onto the new tokens */
  --page: var(--bg);
  --ink: var(--text);
  --ink-2: var(--text-2);
  --ink-3: var(--text-3);
  --band: var(--surface-2);
  --v1: var(--s1);
  --v2: var(--s2);
  --v3: var(--s3);
  --v4: var(--s4);
  --v5: var(--s5);
  --v6: var(--s6);
  --v7: var(--s7);
  --v8: var(--s8);
  --v9: var(--s9);
  --mix-hi: #ffffff;
  --mix-lo: #000000;
}
:root[data-theme="light"] { color-scheme: light; }
:root[data-theme="dark"] { color-scheme: dark; }
/* Inter, a variable font in two files; Polish letters live in the latin-ext file; font-display swap shows the system font until the file is there */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/inter-latin-wght-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/inter-latin-ext-wght-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
:root {
  /* the family: Inter first, then the system fonts */
  --font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  /* size scale */
  --fs-xs: 12px;
  --fs-s: 13px;
  --fs-m: 14px;
  --fs-base: 16px;
  --fs-l: 18px;
  --fs-xl: 22px;
  --fs-2xl: 28px;
  /* big numbers of the panel: about 25% smaller than before (was clamp(42px, 5.2vw, 62px), 30px and 46px) */
  --fs-num-xl: clamp(32px, 3.9vw, 46px);
  --fs-num-l: 22px;
  --fs-num-ring: 34px;
  /* weights */
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  /* line heights and letter spacing */
  --lh-tight: 1.2;
  --lh-snug: 1.35;
  --lh-body: 1.55;
  --ls-heading: -0.01em;
  --ls-number: -0.02em;
  --ls-caps: 0.06em;
  /* figures of equal width, for every number */
  --num: tabular-nums;
}
