/* ============================================================
   Bishofit Topbar — смуга над шапкою.

   Каркас, який не залежить від налаштувань: кольори, розмір шрифту й
   висота приходять інлайновим style із ПЕРЕВІРЕНИХ значень
   (fn_bishofit_topbar_config перевіряє кожне поле при читанні).

   --placed ставить скрипт-переносник: до переносу смуга живе в потоці
   контенту і мусить бути невидимою. Без JS смуги немає взагалі —
   свідомо: банер — прикраса, він не вартий жодного ризику для сторінки.
   ============================================================ */

.bsh-topbar {
  display: none;
  align-items: center;
  justify-content: center;
  width: 100%;
  /* Вертикальні 6 px — щоб перенесений рядок не притискався до країв.
     Висота для тексту йде як min-height: довгий текст на вузькому
     екрані ПЕРЕНОСИТЬСЯ, і смуга підростає, а не обрізає його. */
  padding: 6px 14px;
  box-sizing: border-box;
  text-decoration: none !important;
  line-height: 1.25;
  text-align: center;
}

.bsh-topbar--placed { display: flex; }

/* Іконки в одному рядку з текстом: обтікають разом із ним і при
   переносі лишаються біля слів, а не по краях смуги. */
.bsh-topbar__in svg {
  vertical-align: -0.2em;
  margin: 0 8px;
}

.bsh-topbar__in svg:first-child { margin-left: 0; }
.bsh-topbar__in svg:last-child { margin-right: 0; }

/* ЛОГОТИП — власна картинка власника перед текстом. Висота приходить
   інлайном (порахована й обмежена в PHP), ширина рахується сама: логотип
   може бути і квадратним значком, і витягнутим написом, і обидва мусять
   лягти в рядок без спотворення.

   vertical-align: middle, а не базова лінія: у картинки базової лінії
   немає, і без цього рядка вона «сідає» нижче тексту на кілька пікселів. */
.bsh-topbar__logo {
  width: auto;
  vertical-align: middle;
  margin-right: 8px;
  /* Запобіжник на випадок дуже високої картинки: смуга однаково не
     розсунеться більше, ніж дозволено висотою рядка. */
  max-width: 40vw;
  object-fit: contain;
}

/* Картинковий режим: висота жорстка, зайве обрізається. */
.bsh-topbar--image { padding: 0; overflow: hidden; }

.bsh-topbar--image img {
  height: 100%;
  width: auto;
  display: block;
  margin: 0 auto;
}

/* Пристрої розводить медіа-запит, не скрипт: обидві смуги в розмітці,
   показується одна. Межа 1024 — та сама, що в банерів теми. */
@media (max-width: 1024px) {
  .bsh-topbar--desktop { display: none !important; }
}

@media (min-width: 1025px) {
  .bsh-topbar--mobile { display: none !important; }
}

/* Наша смуга замінює банер зі старої верхньої панелі (його повертає
   модуль bishofit_category) — інакше банерів стало б два. Потрійний
   клас — щоб перемогти правило повернення незалежно від порядку
   файлів у бандлі. Коли смуга вимкнена, класу bsh-topbar-on немає і
   старий банер працює як працював. */
html.bsh-topbar-on .tygh-top-panel.tygh-top-panel.tygh-top-panel {
  display: none !important;
}
