/* SolarEG Monitoring — design tokens
 * Default theme: DARK ("velín"), chosen for dispatcher eye comfort during long shifts.
 * Light theme is a user option. Apply on <html data-theme="dark|light|system">.
 * Never use status colors decoratively; every status also has a shape + text label.
 */

:root,
[data-theme="dark"] {
  color-scheme: dark;
  /* surfaces */
  --bg: #0C1316;
  --surface: #131C20;
  --surface-2: #172227;
  --line: #233139;
  --line-strong: #344650;
  /* text */
  --ink: #E6EDF0;
  --ink-2: #C2CDD3;
  --muted: #8F9DA6;
  /* brand / accents */
  --brand: #43B8B3;
  --brand-ink: #04201F;
  --brand-soft: #11302F;
  --sun: #E2B04C;          /* power / production series */
  --sun-soft: #2B2313;
  /* chart series (non-status) */
  --s1: #E2B04C;
  --s2: #43B8B3;
  --s3: #A9B8C9;
  /* status semantics */
  --crit: #FF7A6E;   --crit-bg: #3B1613;   --on-crit: #2A0905;  /* provider alarm, critical severity */
  --warn: #F5A04E;   --warn-bg: #36230E;                        /* warning severity, deadlines */
  --ok: #4CD08E;     --ok-bg: #0E2B1D;                          /* in operation, fresh data */
  --off: #D3DADF;    --off-bg: #2A343A;                         /* device unreachable */
  --stale: #B9A2F7;  --stale-bg: #261C3F;                       /* stale data (always with timestamp) */
  --coll: #74A9F6;   --coll-bg: #122441;                        /* data-collection (API) error */
  --unk: #9AA6AF;                                               /* unknown state */
  /* map */
  --map: #162024; --map-line: #26343A; --water: #17303A;
  /* skeleton */
  --sk: #1E2A2F;
  --shadow-overlay: 0 16px 40px rgba(0, 0, 0, .35);
}

[data-theme="light"] {
  color-scheme: light;
  --bg: #F3F5F6;
  --surface: #FFFFFF;
  --surface-2: #F8FAFA;
  --line: #E2E7EA;
  --line-strong: #C9D1D6;
  --ink: #0F1B22;
  --ink-2: #33434D;
  --muted: #5A6873;
  --brand: #0B6E73;
  --brand-ink: #FFFFFF;
  --brand-soft: #E2F0F0;
  --sun: #9A6400;
  --sun-soft: #FBF0D9;
  --s1: #B7791F;
  --s2: #0B6E73;
  --s3: #6B7F95;
  --crit: #B42318;   --crit-bg: #FCE9E7;   --on-crit: #FFFFFF;
  --warn: #A64B00;   --warn-bg: #FDEEDC;
  --ok: #0A6B43;     --ok-bg: #E3F4EA;
  --off: #2E3A43;    --off-bg: #E2E6E9;
  --stale: #6232C4;  --stale-bg: #EFE9FC;
  --coll: #1556C9;   --coll-bg: #E6EEFC;
  --unk: #5A6873;
  --map: #EEF1EE; --map-line: #D5DCD7; --water: #D6E6EE;
  --sk: #E6EAEC;
  --shadow-overlay: 0 8px 24px rgba(15, 27, 34, .16);
}

@media (prefers-color-scheme: light) {
  [data-theme="system"] {
    color-scheme: light;
    --bg: #F3F5F6; --surface: #FFFFFF; --surface-2: #F8FAFA; --line: #E2E7EA; --line-strong: #C9D1D6;
    --ink: #0F1B22; --ink-2: #33434D; --muted: #5A6873;
    --brand: #0B6E73; --brand-ink: #FFFFFF; --brand-soft: #E2F0F0; --sun: #9A6400; --sun-soft: #FBF0D9;
    --s1: #B7791F; --s2: #0B6E73; --s3: #6B7F95;
    --crit: #B42318; --crit-bg: #FCE9E7; --on-crit: #FFFFFF; --warn: #A64B00; --warn-bg: #FDEEDC;
    --ok: #0A6B43; --ok-bg: #E3F4EA; --off: #2E3A43; --off-bg: #E2E6E9;
    --stale: #6232C4; --stale-bg: #EFE9FC; --coll: #1556C9; --coll-bg: #E6EEFC; --unk: #5A6873;
    --map: #EEF1EE; --map-line: #D5DCD7; --water: #D6E6EE; --sk: #E6EAEC;
    --shadow-overlay: 0 8px 24px rgba(15, 27, 34, .16);
  }
}

:root {
  /* typography */
  --font-sans: 'IBM Plex Sans', system-ui, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, monospace;
  --fs-page: 28px;   /* 600 */
  --fs-h1: 22px;     /* 600 */
  --fs-kpi: 30px;    /* 600, tabular-nums */
  --fs-card: 14px;   /* 600 */
  --fs-body: 14px;
  --fs-table: 13px;
  --fs-meta: 12px;
  --lh: 1.45;
  /* spacing scale */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px; --sp-7: 40px;
  /* radius */
  --r-tag: 4px;      /* care-level tags, kbd */
  --r-ctl: 7px;      /* buttons, inputs, chips */
  --r-card: 10px;    /* cards, map */
  --r-dlg: 12px;     /* dialogs */
  --r-pill: 11px;    /* status pills */
  /* sizes */
  --ctl-h: 34px; --chip-h: 32px; --input-h: 36px; --search-h: 38px; --nav-item-h: 36px;
  --side-w: 224px;
  --content-max: 1680px;
  /* thresholds (defaults, configurable in Nastavení monitoringu) */
  --stale-after-min: 30;
  --offline-after-min: 30;
}
