/* ============================================================
   FAZONETKA - Uprava homepage (uvodni strany)
   ============================================================
   Vsechny CSS upravy tykajici se HOMEPAGE jsou od ted spolecne
   v tomto jednom souboru (misto samostatneho souboru pro kazdou
   drobnost) - do pole "Zahlavi" v administraci tak pribude jen
   jeden odkaz na tento soubor, at se nevycerpava limit 8192 znaku.

   Pri kazde zmene obsahu se cely soubor uklada pod novym cislem
   verze v nazvu (v1, v2, v3...), aby prohlizece spolehlive nacetly
   novou verzi a ne starou z mezipameti.

   Barvy, pismo a zaobleni pouzite v teto i dalsich upravach
   homepage:
   - pismo: Roboto (bezny text), Raleway (nadpisy/popisky)
   - modra (odkazy/informacni prvky): #2274A5
   - zelena (odkazy/informacni prvky): #48B333
   - oranzova (JEN nakup/kosik): #F68E5F
   - svetle modra (podklady/rámečky): rgba(164, 219, 232, 0.45)
     - stejny odstin, jaky uz je u produktu v ramecku s dostupnymi
       velikostmi (.fzt-sizes-banner)
   - zlata (hvezdicky/hodnoceni): #ECB911
   - zaobleni rohu: 6px u vseho noveho

   ------------------------------------------------------------
   v1 - prvni banner nahore pod vyhledavanim ("Podzim patri ven"),
   POUZE MOBILNI ZOBRAZENI (do 767px), zbytek banneru (velikost,
   pomer stran, umisteni, vzhled) zustava presne stejny jako drive:
   - zaobleni rohu banneru 6px
   - mezera 6px mezi vyhledavacim polem a bannerem
   - mezera 6px mezi bannerem a dalsim blokem pod nim

   Technicka poznamka: banner je carousel s id "carousel". Mezera
   nad nim byla dana obecnou "mezerou pod hlavickou" (10px), ktera
   se pouziva na cele strance - proto je zmena scopovana jen na
   homepage (body.in-index) a jen na mobil, aby se nedotkla
   ostatnich stranek. Drobny -2px dopocet reaguje na to, ze hlavicka
   je na mobilu "plovouci" (position:fixed) a pro ni vyhrazene misto
   je o 2px vyssi, nez sama skutecne je - zmereno primo na webu.

   ------------------------------------------------------------
   v2 - novy uzky proužek s hodnocenim obchodu, hned POD hlavnim
   bannerem. POUZE MOBILNI ZOBRAZENI. Stejna sirka jako banner,
   svetle modre pozadi, zaobleni 6px.

   v3 - mezera 6px i POD timto proužkem (k dalsimu bloku), stejne
   jako uz je nad nim a kolem hlavniho banneru.

   v4 - obsah proužku (viz doplnkovy JS soubor, ktery skutecny
   obsah vklada): nazev "Hodnoceni obchodu" tucne cerne, prumerne
   hodnoceni + hvezdicky zlate, tenka tmava oddelovaci cara, tucny
   pocet recenzi. Cely proužek je nyni odkaz na /hodnoceni-obchodu/.

   v5 (tato verze) - vsechny texty v proužku zvetseny o 1 px
   (13px -> 14px). Ostatni vzhled, rozestupy ani vyska proužku se
   temer nezmeni.

   Dale v teto verzi: POD proužek s hodnocenim pribyla dve nova
   proklikavaci tlacitka vedle sebe ("PDF střihy" / "Tištěné
   střihy"), viz doplnkovy JS soubor, ktery je vklada. Stejne
   svetle modre pozadi a zaobleni 6px jako u proužku, vyska cca
   2x vyssi. Na jejich miste se schovavaji dva puvodni bannery
   (next-to-carousel-banners), ktere tyto tlacitka nahrazuji -
   POUZE MOBILNI ZOBRAZENI, na pocitaci zustavaji puvodni bannery
   beze zmeny.
   ============================================================ */

@media (max-width: 767px) {
  body.in-index .container.content-wrapper {
    padding-top: 6px !important;
  }
  body.in-index #carousel img {
    border-radius: 6px;
  }
  body.in-index #carousel {
    margin-top: -2px;
    margin-bottom: 6px;
  }
}

/* ---- proužek s hodnocenim obchodu ---- */

/* na pocitaci se nezobrazuje vubec */
#fzhp-rating-strip {
  display: none;
}

@media (max-width: 767px) {
  body.in-index #fzhp-rating-strip {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 6px 12px;
    background: rgba(164, 219, 232, 0.45);
    border-radius: 6px;
    box-sizing: border-box;
    margin-bottom: 6px;
    gap: 8px;
    font-family: 'Roboto', -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    font-size: 14px;
    flex-wrap: nowrap;
    white-space: nowrap;
    text-decoration: none;
    color: inherit;
    cursor: pointer;
  }
}

.fzhp-label {
  font-family: 'Raleway', -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  font-weight: 700;
  color: #000000;
}
.fzhp-score {
  color: #ECB911;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 3px;
}
.fzhp-sep {
  width: 1px;
  height: 16px;
  background: #1F1F1F;
}
.fzhp-count {
  font-weight: 700;
  color: #1F1F1F;
}

/* ---- dve tlacitka "PDF střihy" / "Tištěné střihy" pod proužkem ---- */

/* na pocitaci se nezobrazuji, puvodni bannery zustavaji beze zmeny */
#fzhp-cat-buttons {
  display: none;
}

@media (max-width: 767px) {
  /* schovat puvodni dva bannery (next-to-carousel-banners) - nahrazuji
     je nova tlacitka nize */
  body.in-index .banners-row > .col-sm-4 {
    display: none !important;
  }

  body.in-index #fzhp-cat-buttons {
    display: flex;
    gap: 6px;
    margin-bottom: 6px;
  }

  body.in-index .fzhp-cat-btn {
    flex-grow: 1 !important;
    flex-shrink: 1 !important;
    flex-basis: 0 !important;
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 76px;
    padding: 8px 10px;
    box-sizing: border-box;
    background: rgba(164, 219, 232, 0.45);
    border-radius: 6px;
    text-decoration: none;
    color: inherit;
    cursor: pointer;
  }

  body.in-index .fzhp-cat-btn img {
    width: 56px;
    height: 56px;
    flex-shrink: 0;
    object-fit: contain;
  }

  body.in-index .fzhp-cat-btn span {
    font-family: 'Raleway', -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    font-weight: 700;
    font-size: 14px;
    color: #000000;
    line-height: 1.15;
  }
}