/* =====================================================================
   Vendea Telemetry — KANONICKÝ DIZAJN-SYSTÉM (jeden zdroj pravdy)
   Fáza 1: definícia --ds-* tokenov (paleta, písmo, škála, medzery, rádiusy).
   Fáza 2: premapovanie starých sád (--p84/-p87/-p83 + semantické) na --ds-*.
   Načítané ako POSLEDNÝ CSS => jeho :root definície vyhrávajú v kaskáde.
   Základ palety = schválený "výraznejší farebný" dashboard.
   NEMENIŤ hodnoty po jednom v starých súboroch — meniť TU, na jednom mieste.
   ===================================================================== */

:root{
  /* ---- Povrchy a čiary ---- */
  --ds-bg:#0a1b2c;
  --ds-surface:#123457;
  --ds-surface-2:#0e2740;
  --ds-surface-3:#08202f;
  --ds-line:#204768;
  --ds-line-soft:#2b5478;
  --ds-table-head:#0e3f5e;       /* jednotná hlavička tabuliek */
  --ds-hover:rgba(56,189,248,.07);

  /* ---- Text ---- */
  --ds-text:#eaf5ff;
  --ds-muted:#a9cae8;
  --ds-text-inverse:#06202f;

  /* ---- Akcent (interaktívne / primárne) ---- */
  --ds-accent:#2f7ff0;
  --ds-accent-hover:#3f8ff8;
  --ds-accent-ink:#ffffff;
  --ds-neutral-ctl:#1c3e5c;      /* neutrálne tlačidlo / tab */

  /* ---- Stavy: vivid (badge/akcent) + strong (tlačidlá) + bg/fg ---- */
  --ds-ok:#2ee08a;   --ds-ok-strong:#16a674;   --ds-ok-bg:#0b6b4f;   --ds-ok-fg:#eafff6;
  --ds-warn:#ffb020; --ds-warn-strong:#d98c0a; --ds-warn-bg:#6e5410; --ds-warn-fg:#fff8e6;
  --ds-crit:#ff5468; --ds-crit-strong:#d3313f; --ds-crit-bg:#5f1622; --ds-crit-fg:#ffe4e7;
  --ds-info:#38bdf8; --ds-info-strong:#1f9fd8; --ds-info-bg:#0e4a6b; --ds-info-fg:#e6f9ff;
  --ds-neutral:#7fa0c0; --ds-neutral-bg:#16344f; --ds-neutral-fg:#cfe3f5;

  /* ---- Typografia (aplikuje sa vo Fáze 3; tu len definícia) ---- */
  --ds-font:system-ui,"Segoe UI",Arial,sans-serif;
  --ds-mono:"Consolas",ui-monospace,monospace;
  --ds-fs-1:11px; --ds-fs-2:12px; --ds-fs-3:13px; --ds-fs-4:14px;
  --ds-fs-5:16px; --ds-fs-6:20px; --ds-fs-7:28px;
  --ds-fw-normal:500; --ds-fw-bold:700; --ds-fw-heavy:850;

  /* ---- Medzery (4/8 systém) ---- */
  --ds-sp-1:4px; --ds-sp-2:8px; --ds-sp-3:12px; --ds-sp-4:16px; --ds-sp-5:24px; --ds-sp-6:32px;

  /* ---- Rádiusy / výška ovládačov / tiene ---- */
  --ds-radius-sm:8px; --ds-radius:10px; --ds-radius-lg:14px; --ds-radius-pill:999px;
  --ds-control-h:42px;
  --ds-shadow:0 8px 22px rgba(0,0,0,.25);
  --ds-shadow-sm:0 2px 8px rgba(0,0,0,.2);
}

/* =====================================================================
   FÁZA 2 — PREMAPOVANIE STARÝCH SÁD NA KANONICKÉ TOKENY
   (jedným ťahom zjednotí komponenty, ktoré tieto tokeny už používajú)
   ===================================================================== */
:root{
  /* ---- P8.7 natívne stránky (--p87-*) ---- */
  --p87-bg:var(--ds-bg);
  --p87-surface:var(--ds-surface);
  --p87-surface2:var(--ds-surface-2);
  --p87-line:var(--ds-line);
  --p87-soft:var(--ds-line-soft);
  --p87-text:var(--ds-text);
  --p87-muted:var(--ds-muted);
  --p87-blue:var(--ds-accent);
  --p87-green:var(--ds-ok);
  --p87-yellow:var(--ds-warn);
  --p87-red:var(--ds-crit);
  --p87-neutral:var(--ds-neutral);
  --p87-gap:var(--ds-sp-3);
  --p87-radius:var(--ds-radius-lg);

  /* ---- P8.4 kanonické stránky (--p84-*) ---- */
  --p84-bg:var(--ds-bg);
  --p84-surface:var(--ds-surface);
  --p84-surface-2:var(--ds-surface-2);
  --p84-surface-3:var(--ds-surface-3);
  --p84-border:var(--ds-line-soft);
  --p84-border-soft:var(--ds-line);
  --p84-muted:var(--ds-muted);
  --p84-text:var(--ds-text);
  --p84-nav:var(--ds-accent);
  --p84-neutral:var(--ds-neutral-ctl);
  --p84-confirm:var(--ds-ok-strong);
  --p84-create:var(--ds-warn-strong);
  --p84-danger:var(--ds-crit-strong);
  --p84-warning:var(--ds-warn-strong);
  --p84-control-h:var(--ds-control-h);
  --p84-gap:var(--ds-sp-3);
  --p84-radius:var(--ds-radius-lg);
  --p84-shadow:var(--ds-shadow);

  /* ---- P8.3 layout (--p83-*) ---- */
  --p83-accent:var(--ds-accent);
  --p83-border:var(--ds-line-soft);
  --p83-border-soft:var(--ds-line);
  --p83-good:var(--ds-ok);
  --p83-muted:var(--ds-muted);
  --p83-surface:var(--ds-surface);
  --p83-surface-2:var(--ds-surface-2);
  --p83-surface-3:var(--ds-surface-3);
  --p83-text:var(--ds-text);
  --p83-warning:var(--ds-warn);

  /* ---- Semantické tokeny (style.css) — povrchy/čiary/text + stavové okraje ---- */
  --bg:var(--ds-bg);
  --line:var(--ds-line);
  --panel:var(--ds-surface);
  --panel2:var(--ds-surface-2);
  --text:var(--ds-text);
  --muted:var(--ds-muted);
  --red:var(--ds-crit);
  --warn:var(--ds-warn);
  --ok-bd:var(--ds-ok);
  --attention-bd:var(--ds-warn);
  --critical-bd:var(--ds-crit);
  --info-bd:var(--ds-info);
}

/* --- OPRAVA SCOPE: p84/p83 sú definované na .p642-shell (obaľuje obsah),
   takže :root remap ich vnútri netienil. Re-mapujem ich AJ na .p642-shell
   (rovnaká špecificita, načítané neskôr → vyhráva) → panely obsahu konečne
   dostanú kanonické povrchy/okraje (skľudnenie jasných cyan okrajov). --- */
.p642-shell{
  /* p84 */
  --p84-bg:var(--ds-bg);--p84-surface:var(--ds-surface);--p84-surface-2:var(--ds-surface-2);
  --p84-surface-3:var(--ds-surface-3);--p84-border:var(--ds-line-soft);--p84-border-soft:var(--ds-line);
  --p84-muted:var(--ds-muted);--p84-text:var(--ds-text);--p84-nav:var(--ds-accent);
  --p84-neutral:var(--ds-neutral-ctl);--p84-confirm:var(--ds-ok-strong);--p84-create:var(--ds-warn-strong);
  --p84-danger:var(--ds-crit-strong);--p84-warning:var(--ds-warn-strong);
  --p84-control-h:var(--ds-control-h);--p84-gap:var(--ds-sp-3);--p84-radius:var(--ds-radius-lg);--p84-shadow:var(--ds-shadow);
  /* p83 */
  --p83-accent:var(--ds-accent);--p83-border:var(--ds-line-soft);--p83-border-soft:var(--ds-line);
  --p83-good:var(--ds-ok);--p83-muted:var(--ds-muted);--p83-surface:var(--ds-surface);
  --p83-surface-2:var(--ds-surface-2);--p83-surface-3:var(--ds-surface-3);--p83-text:var(--ds-text);--p83-warning:var(--ds-warn);
}

/* =====================================================================
   FÁZA 3 — PÍSMO, ŠKÁLA VEĽKOSTÍ A MEDZERY GLOBÁLNE
   Cielené na obsahovú časť (.content). `!important` je prechodné —
   Fáza 5 odstráni staré konfliktné pravidlá, potom môže padnúť.
   ===================================================================== */

/* Jeden font všade (Inter nebol nikdy načítaný — padal na Segoe UI) */
body,button,input,select,textarea,.content,.sidebar{font-family:var(--ds-font)!important}

/* Nadpisová škála */
.content .p87-page-header h2,.content .section>h1,.content .section>h2{font-size:var(--ds-fs-7)!important;line-height:1.18}
.content .panel h2,.content .clean-panel h2,.content .p87-panel h2{font-size:var(--ds-fs-6)!important}
.content .panel h3,.content .clean-panel h3,.content .p87-panel h3,.content .p87-panel-head h3{font-size:var(--ds-fs-6)!important;line-height:1.25}
.content h4{font-size:var(--ds-fs-5)!important}

/* Ovládače: jednotná výška + veľkosť písma (checkbox/radio vynechané) */
.content input:not([type=checkbox]):not([type=radio]),.content select,.content textarea{min-height:var(--ds-control-h)!important;font-size:var(--ds-fs-4)!important}

/* Tlačidlá */
.content .btn,.content .p87-btn{font-size:var(--ds-fs-2)!important}

/* Labely (jednotná veľkosť + váha) */
.content .p87-field>span,.content .toolbar>label,.content .chart-filter-grid>label,.content .p84-page>label{font-size:var(--ds-fs-2)!important;font-weight:var(--ds-fw-bold)!important}

/* Tabuľky */
.content .p2-table th,.content .p87-table th,.content .p83-table th,.content .p84-table th{font-size:var(--ds-fs-1)!important}
.content .p2-table td,.content .p87-table td,.content .p83-table td,.content .p84-table td{font-size:var(--ds-fs-3)!important}

/* Medzery: jednotný padding panelov + gap toolbarov/menu */
.content .panel,.content .clean-panel,.content .p87-panel{padding:var(--ds-sp-4)!important}
.content .toolbar,.content .p87-action-bar,.content .card-actions,.content .row-actions-v35521{gap:var(--ds-sp-3)!important}

/* =====================================================================
   FÁZA 4 — VIZUÁLNE ZJEDNOTENIE DUPLICITNÝCH KOMPONENTOV
   8 variantov barov, 6 KPI tried, 5 tabuliek, 5 tlačidiel → jeden vzhľad.
   (JS render-funkcie ostávajú; zjednocuje sa VZHĽAD cez zdieľané pravidlá.)
   ===================================================================== */

/* ---- Tlačidlá: jeden geometrický systém (.btn/.p87-btn) + malé (.mini-action) ---- */
.content .btn,.content .p87-btn{
  min-height:38px!important;padding:8px 16px!important;border-radius:var(--ds-radius)!important;
  font-size:var(--ds-fs-2)!important;font-weight:var(--ds-fw-bold)!important;
  display:inline-flex!important;align-items:center;justify-content:center;gap:7px;line-height:1.15;cursor:pointer}
.content .mini-action{
  min-height:30px!important;padding:6px 10px!important;border-radius:var(--ds-radius-sm)!important;
  font-size:var(--ds-fs-1)!important;font-weight:var(--ds-fw-bold)!important;display:inline-flex;align-items:center;gap:6px}
/* Farebné varianty na tokeny (default = akcent) */
.content .btn.ghost,.content .p87-btn.p87-ghost,.content .mini-action.ghost{background:var(--ds-surface-2)!important;border:1px solid var(--ds-line)!important;color:var(--ds-text)!important}
.content .btn.danger,.content .p87-btn.p87-danger,.content .mini-action.danger{background:var(--ds-crit-strong)!important;border:1px solid var(--ds-crit)!important;color:#fff!important}
.content .p87-btn.p87-confirm{background:var(--ds-ok)!important;border:1px solid var(--ds-ok)!important;color:#062e1c!important}

/* ---- Tabuľky: jeden vzhľad (hlavička/bunky/okraje/hover) ---- */
.content .p2-table th,.content .p87-table th,.content .p83-table th,.content .p84-table th{
  background:var(--ds-table-head)!important;color:var(--ds-text)!important;
  text-transform:uppercase;letter-spacing:.04em;padding:9px 10px!important}
.content .p2-table td,.content .p87-table td,.content .p83-table td,.content .p84-table td{
  border-top:1px solid var(--ds-line)!important;border-bottom:0!important;padding:9px 10px!important;vertical-align:top}
.content .p2-table tbody tr:hover td,.content .p87-table tbody tr:hover td,.content .p83-table tbody tr:hover td,.content .p84-table tbody tr:hover td{
  background:var(--ds-hover)!important}

/* ---- KPI dlaždice: jeden vzhľad (povrch/okraj/label/číslo); p87 si drží stavový ľavý pruh ---- */
.content .p84-kpis>div,.content .p87-kpi,.content .p83-kpis>div{
  background:var(--ds-surface)!important;border-radius:var(--ds-radius-lg)!important;padding:14px 16px!important;
  border:1px solid var(--ds-line)!important;border-left:6px solid var(--ds-info)!important}
.content .p84-kpis span,.content .p87-kpi span,.content .p83-kpis span{font-size:var(--ds-fs-2)!important;color:var(--ds-muted)!important;font-weight:var(--ds-fw-bold)!important}
.content .p84-kpis b,.content .p87-kpi b,.content .p83-kpis b{font-size:1.6rem!important;color:var(--ds-text)!important;font-weight:var(--ds-fw-heavy)!important;margin-top:5px}
/* stavový ľavý pruh musí prebiť default --ds-info (rovnaká špecifickosť, neskorší zápis + !important) */
.content .p87-kpi-ok{border-left-color:var(--ds-ok)!important}
.content .p87-kpi-warn{border-left-color:var(--ds-warn)!important}
.content .p87-kpi-danger{border-left-color:var(--ds-crit)!important}
.content .p87-kpi-neutral{border-left-color:var(--ds-neutral)!important}

/* ---- Legacy KPI dlaždice (.grid four/three > .card s .label+.value) na rovnaký vzhľad ----
   Pokrýva ~29 starých KPI mriežok naraz bez zásahu do JS render vrstiev (matrioška).
   Dashboard .card.state-card je Ivanom schválený a zostáva NETKNUTÝ (vylúčený). */
.content .grid.four>.card:not(.state-card):has(>.label),
.content .grid.three>.card:not(.state-card):has(>.label){
  background:var(--ds-surface)!important;border-radius:var(--ds-radius-lg)!important;
  border:1px solid var(--ds-line)!important;border-left:6px solid var(--ds-neutral)!important;
  padding:14px 16px!important;min-height:0!important;
  display:flex!important;flex-direction:column!important;box-shadow:none!important}
.content .grid.four>.card:not(.state-card)>.label,
.content .grid.three>.card:not(.state-card)>.label{
  font-size:var(--ds-fs-2)!important;color:var(--ds-muted)!important;font-weight:var(--ds-fw-bold)!important}
.content .grid.four>.card:not(.state-card)>.value,
.content .grid.three>.card:not(.state-card)>.value{
  font-size:1.6rem!important;line-height:1.15!important;color:var(--ds-text)!important;
  font-weight:var(--ds-fw-heavy)!important;margin-top:5px!important}
/* sémantické tóny pre legacy dlaždice (doplní sa v JS tam, kde má stav význam) */
.content .grid.four>.card.kpi-ok,.content .grid.three>.card.kpi-ok{border-left-color:var(--ds-ok)!important}
.content .grid.four>.card.kpi-warn,.content .grid.three>.card.kpi-warn{border-left-color:var(--ds-warn)!important}
.content .grid.four>.card.kpi-danger,.content .grid.three>.card.kpi-danger{border-left-color:var(--ds-crit)!important}
.content .grid.four>.card.kpi-info,.content .grid.three>.card.kpi-info{border-left-color:var(--ds-info)!important}
.content .grid.four>.card.kpi-ok>.value,.content .grid.three>.card.kpi-ok>.value{color:var(--ds-ok)!important}
.content .grid.four>.card.kpi-warn>.value,.content .grid.three>.card.kpi-warn>.value{color:var(--ds-warn)!important}
.content .grid.four>.card.kpi-danger>.value,.content .grid.three>.card.kpi-danger>.value{color:var(--ds-crit)!important}