/* STAVPORTAL V4 – spoločná hlavička: tokeny systému V4, tlačidlá hlavičky a mobilného menu, tooltip „B2B portál“.
   Načíta sa na VŠETKÝCH stránkach vrátane kalkulačiek, aby hlavička vyzerala všade rovnako (OWNER GO Zjednotenie
   hlavičky V4). Pravidlá platia iba v .hdr (hlavička + mobilné menu #drawer) – nič vo vnútri kalkulačiek (.calc-c, .calc-k).
   Hodnoty tlačidiel sú zhodné s assets/v4-system.css. Ikona B2B, jej poloha a štýl sa nemenia; tooltip iba na desktope
   (hover zariadenia, ≥ 960 px), pri hover aj fokuse, dá sa naň prejsť myšou a Esc ho skryje (assets/v3-a11y.js) –
   WCAG 1.4.13; prístupný názov je v aria-label (register V3, V4-B02). */

:root {
  --v4-ink: #0D0D0E;
  --v4-graphite: #252528;
  --v4-white: #FAFAF9;
  --v4-cu: #B87333;
  --v4-cu-hover: #C98546;
  --v4-cu-active: #B06C2F;
  --v4-danger: #B42318;
  /* svetlá plocha */
  --v4-focus: #0D0D0E;
  --v4-sec-fg: #0D0D0E;
  --v4-sec-bd: #58585C;
  --v4-sec-hover: rgb(13 13 14 / .06);
  --v4-seg-on-bg: #0D0D0E;
  --v4-seg-on-fg: #FAFAF9;
  --v4-dis-bg: #E7E5E1;
  --v4-dis-fg: #6B6B70;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --v4-focus: #FAFAF9; --v4-sec-fg: #FAFAF9; --v4-sec-bd: #8A8A8F; --v4-sec-hover: rgb(250 250 249 / .08);
    --v4-seg-on-bg: #FAFAF9; --v4-seg-on-fg: #0D0D0E; --v4-dis-bg: #2E2E32; --v4-dis-fg: #9A9AA0; --v4-danger: #F97066;
  }
}
:root[data-theme="dark"] {
  --v4-focus: #FAFAF9; --v4-sec-fg: #FAFAF9; --v4-sec-bd: #8A8A8F; --v4-sec-hover: rgb(250 250 249 / .08);
  --v4-seg-on-bg: #FAFAF9; --v4-seg-on-fg: #0D0D0E; --v4-dis-bg: #2E2E32; --v4-dis-fg: #9A9AA0; --v4-danger: #F97066;
}
/* tmavé plochy aj vo svetlom režime (rovnaký zoznam ako focus v r43 d.css + panel na úvode) */
:is(.on-dark, .final, .ftr, .pool, .screen, .panel-dark, .mdock, .biz) {
  --v4-focus: #FAFAF9; --v4-sec-fg: #FAFAF9; --v4-sec-bd: #8A8A8F; --v4-sec-hover: rgb(250 250 249 / .08);
  --v4-seg-on-bg: #FAFAF9; --v4-seg-on-fg: #0D0D0E; --v4-dis-bg: #2E2E32; --v4-dis-fg: #9A9AA0;
}

/* ---- tlačidlá hlavičky a mobilného menu (rovnaké ako v4-system.css) ---- */
.hdr .btn { min-height: 48px; padding: 0 22px; border-radius: 999px; border-width: 1.5px; font-size: 15px; font-weight: 600; letter-spacing: 0; text-transform: none; }
.hdr .btn-sm { min-height: 40px; padding: 0 16px; font-size: 14px; }
.hdr .btn-ink, .hdr .btn-line { background: transparent; color: var(--v4-sec-fg); border-color: var(--v4-sec-bd); }
.hdr .btn-ink:hover, .hdr .btn-line:hover { background: var(--v4-sec-hover); border-color: var(--v4-sec-fg); }
.hdr a.btn[data-open="intake"], .hdr .hdr-act a.btn[data-open="join"] { background: var(--v4-cu); color: var(--v4-ink); border-color: transparent; }
.hdr a.btn[data-open="intake"]:hover, .hdr .hdr-act a.btn[data-open="join"]:hover { background: var(--v4-cu-hover); border-color: transparent; }
.hdr a.btn[data-open="intake"]:active, .hdr .hdr-act a.btn[data-open="join"]:active { background: var(--v4-cu-active); }
.hdr .btn:active { transform: translateY(1px); }
.hdr .btn:focus-visible { outline: 2.5px solid var(--v4-focus); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { .hdr .btn:active { transform: none; } }

/* ---- tooltip „B2B portál“ ---- */
@media (hover: hover) and (min-width: 960px) {
  .hdr-login { position: relative; }
  .hdr-login::after {
    content: "B2B portál"; position: absolute; top: 100%; left: 50%; transform: translateX(-50%);
    border-top: 8px solid transparent; background-clip: padding-box; /* priehľadný most: kurzor môže prejsť na tooltip (WCAG 1.4.13) */
    background-color: #252528; color: #FAFAF9; box-shadow: 0 0 0 1px rgb(250 250 249 / .14); font: 500 12.5px/1 var(--font); white-space: nowrap;
    padding: 8px 10px; border-radius: 8px; pointer-events: none; opacity: 0; visibility: hidden; transition: opacity .12s; z-index: 80;
  }
  .hdr-login:hover::after, .hdr-login:focus-visible::after { opacity: 1; visibility: visible; pointer-events: auto; }
  .hdr-login.v4-tip-off::after { opacity: 0; visibility: hidden; }
}