/* Лентата над резултатите (име на хотел · Мапа · Цена · Ѕвездички).

   `!important` не е немарност: Emotion ги пишува своите <style> ПО нашиот
   <link>, па при иста специфичност победува неговиот — мерено 26.08.2026 на
   `z-index`, каде 1250 стигна до страницата како 1.

   Лепењето е ЧИСТ CSS `sticky` — ниту еден нов јазол во React-овото дрво.
   Претходната верзија вметнуваше местодржач и рушеше `removeChild` (31.08). */
.sv-results-bar {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: var(--sv-bar-top, 0px) !important;
  z-index: 1190 !important;              /* под пребарувачот (1200), над картичките */
  /* `--brand-bg` НЕ постои во нивниот билд (мерено: има само
     `--brand-bg-gradient`), а лентата мора да е непроѕирна — картичките
     ѝ поминуваат под неа. Затоа позадината на тенантот, па површината,
     па бело. */
  background: var(--brand-bg-gradient, var(--brand-surface, #fff)) !important;
  padding: 8px 0 !important;
}

/* Сенка и заоблување само ДОДЕКА е залепена — за да не изгледа како лента
   кога си на врвот на списокот. Белегот е `data-sv-stuck`, не класа: className
   на тој јазол го пишува React (N13/N14) и додадена класа би исчезнала. */
.sv-results-bar[data-sv-stuck="1"] {
  padding: 8px 12px !important;
  margin-left: -12px !important;
  margin-right: -12px !important;
  border-radius: 0 0 14px 14px !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .10) !important;
  border-bottom: 1px solid var(--brand-border, #e6e6e6) !important;
}

/* Насловот „Пронајдени N хотели" е информација, не контрола — во залепен вид
   на телефон отстапува место, за да не изеде трет ред од екранот. */
@media (max-width: 640px) {
  .sv-results-bar[data-sv-stuck="1"] > :first-child { display: none !important; }
  .sv-results-bar[data-sv-stuck="1"] { padding: 6px 10px !important; }
  .sv-results-bar[data-sv-stuck="1"] > :last-child { width: 100% !important; }
}

/* Полето за име прво во групата на телефон — тоа е причината лентата да се
   бара. Над 640px останува на своето место покрај „Мапа". */
.sv-name-filter-h, .sv-name-filter-p { order: -1; }
@media (min-width: 641px) {
  .sv-name-filter-h, .sv-name-filter-p { order: 0; }
}
