/* ============================================================
   Navigator Hub — GÓRNY PASEK (#globalTopbar)
   Wariant B (decyzja Soni 12.10), od 13.10: szukajka · zespół (ui/line-bar.css) · SMS · [odstęp] · Twoja linia ·
   powitanie z datą i godziną · awatar.
   - pełna data (#globalClockDate, DD.MM.RRRR) ukryta — krótka „wt 13.10” jest pod powitaniem; element zostaje w DOM,
     bo Pulpit czyta jego tekst;
   - imię i rola przy awatarze ukryte (są w stopce menu bocznego); imię zalogowanej osoby jest w dymku awatara
     (app.js: „<Imię> — ustawienia konta”), żeby na wspólnym komputerze recepcji było wiadomo, czyje konto jest otwarte;
   - jeden krój paska (--nh-font-bar = Figtree; reszta Huba: treść Open Sans, tytuły Montserrat — 21.10) — poza powitaniem z godziną
     (--nh-font-hello = krój powitania z Pulpitu, decyzja Soni 13.10),
     rozmiary --nh-text-bar (14 px) i --nh-text-bar-sub (13 px), grubości 500/600.
   GRANAT NA WSZYSTKICH EKRANACH (decyzja Soni 13.10): tło = token --nh-topbar-bg (od menu bocznego ten sam granat,
   w prawo gradient w morski). Dawniej granat tylko na Pulpicie (reguły z !important w redesign-kokpit.css — usunięte).
   Tylko tokeny, zero !important. Ładowany PO styles.css i redesign-kokpit.css (wygrywa kolejnością + specyficznością).
   ============================================================ */
.global-topbar {
  font-family: var(--nh-font-bar);
  background: var(--nh-topbar-bg);
  border-bottom: 0;
  backdrop-filter: none;
  color: var(--nh-text-on-dark);
  /* Rozmiary liter CAŁEGO paska (zespół, Twoja linia, SMS, godzina, szukajka) — tokeny paska z tokens.css. */
  --bar-fs: var(--nh-text-bar);
  --bar-fs-sub: var(--nh-text-bar-sub);
  /* Na granacie morski akcent lupy i kursora byłby za ciemny — jasny kremowy (search-enhance.js czyta te tokeny). */
  --nh-search-ico: var(--nh-text-on-dark);
  --nh-caret: var(--nh-text-on-dark);
}
.global-topbar .topbar-clock-date,
.global-topbar .topbar-user-info,
.global-topbar .topbar-divider { display: none; }

/* POWITANIE przy awatarze (decyzja Soni 13.10, przeniesione z Pulpitu; makieta PhXq3g2oNnNgYKEtafyQqT):
   wiersz 1 „Dzień dobry, Kasia”, wiersz 2 „wt 13.10 · 14:32” — biało, krojem powitania z Pulpitu (--nh-font-hello =
   Montserrat), godzina tym samym krojem. Jeden wiersz „Dzień dobry, Kasia · wt 13.10” obok godziny spychał pasek do
   drugiego wiersza już na 1440 px z rozwiniętym menu — dlatego dwa wiersze. */
.global-topbar .topbar-hello { flex-direction: column; align-items: flex-end; justify-content: center; gap: 3px; white-space: nowrap; color: var(--nh-text-on-dark); }
.global-topbar .topbar-hello-name { font: 600 var(--nh-text-hello)/1.15 var(--nh-font-hello); }
.global-topbar .topbar-hello-when { font: 500 var(--nh-text-hello-sub)/1.15 var(--nh-font-hello); color: var(--nh-ondark-txt1); font-variant-numeric: tabular-nums; }
.global-topbar .topbar-clock-time { font: inherit; color: inherit; }
/* Brak miejsca (data-fit z NH.lineBar.fit(), ui/line-bar.js): 3 = bez „Dzień dobry, …”, 4 = także bez daty — zostaje sama
   godzina, jak przed 13.10. Wcześniej (poziomy 1–2) skracają się opisy linii i imiona przy stałych liniach 101/102. */
.global-topbar[data-fit="3"] .topbar-hello-name,
.global-topbar[data-fit="4"] .topbar-hello-name,
.global-topbar[data-fit="4"] .topbar-hello-date { display: none; }
.global-topbar[data-fit="3"] .topbar-hello-when,
.global-topbar[data-fit="4"] .topbar-hello-when { font-weight: 600; font-size: var(--nh-text-hello); color: var(--nh-text-on-dark); }
.global-topbar .topbar-avatar { width: var(--space-6); height: var(--space-6); border-radius: 50%; font: 600 var(--nh-text-sm)/1 var(--nh-font-bar); }

/* Szukajka (dawniej style inline w index.html, z jasnym tłem i obramowaniem ustawianym w onfocus/onblur) */
.global-topbar #globalSearchInput {
  width: 100%; box-sizing: border-box;
  padding: var(--space-2) var(--space-3) var(--space-2) calc(var(--space-6) + var(--space-2));   /* miejsce na lupę */
  background: var(--nh-ondark-fill); border: 1px solid var(--nh-ondark-line); border-radius: var(--radius-sm);
  color: var(--nh-text-on-dark); font: 500 var(--bar-fs)/1.3 var(--nh-font-bar);
  outline: none; transition: border-color .15s, box-shadow .15s;
}
.global-topbar #globalSearchInput::placeholder { color: var(--nh-ondark-txt2); font-weight: 400; }
.global-topbar #globalSearchInput:focus { border-color: var(--nh-ondark-accent); box-shadow: 0 0 0 3px var(--nh-ondark-fill2); }

/* SMS: tekst + licznik obok (dawniej szara ramka z licznikiem przyklejonym w rogu) */
.topbar-sms {
  display: inline-flex; align-items: center; gap: var(--space-1); margin: 0; cursor: pointer;
  padding: var(--space-1) var(--space-2); border: 0; border-radius: var(--radius-sm); background: transparent;
  color: var(--nh-text); font: 500 var(--bar-fs)/1 var(--nh-font-bar);
}
.global-topbar .topbar-sms { color: var(--nh-text-on-dark); }
.global-topbar .topbar-sms:hover { background: var(--nh-ondark-fill2); }
.topbar-sms:focus-visible { outline: 2px solid var(--nh-ondark-accent); outline-offset: 2px; }
.topbar-sms[hidden] { display: none; }   /* (26.10) licznik szkiców (#szkiceTopbarBtn) chowa się atrybutem — display: inline-flex wyżej by go przebił */
.topbar-sms .nh-icon { --icon-color: currentColor; }
.topbar-sms-badge {
  display: inline-block; min-width: var(--space-4); padding: 0 var(--space-1); border-radius: var(--nh-r-pill);
  background: var(--nh-miss-text); color: var(--nh-surface); font: 700 var(--nh-text-xs)/1.5 var(--nh-font-bar); text-align: center;
}

/* Telefon: wiersz 1 = szukajka · SMS · awatar, wiersz 2 = Twoja linia · zespół (cały wiersz dla linii).
   Dawniej SMS i awatar dzieliły wiersz z liniami i na 320–360 px spadały do trzeciego wiersza albo nachodziły
   na zespół (przegląd kodu #1232). Złamanie wiersza = pseudo-element o pełnej szerokości między grupami order. */
@media (max-width: 640px) {
  .global-topbar .topbar-search-wrap { flex: 1 1 0; order: -2; }
  .global-topbar #smsTopbarBtn, .global-topbar #szkiceTopbarBtn { order: -1; }   /* (26.10) licznik szkiców obok SMS */
  .global-topbar .topbar-user { order: -1; }
  .global-topbar::after { content: ''; flex-basis: 100%; height: 0; order: 0; }
  .topbar-sms-tx { display: none; }   /* sama ikona + licznik (nazwa w title) */
}