/* Pán Kukučka, štýly, ktoré musia platiť UŽ PRI PRVOM VYKRESLENÍ stránky (proti poskakovaniu, CLS).
   Od 12.11.2026. Nahrať do Shoptetu: Správca súborov, priečinok upload. V Záhlaví ho načítava riadok
   <link rel="stylesheet" href="/user/documents/upload/pk-web-v1.css">
   Pri zmene nové meno súboru (pk-web-v2.css), inak prehliadače držia starú verziu.

   Prečo: pk-web-vN.js a pk-titulka-vN.js bežia až po načítaní stránky a menia rozloženie
   (vkladajú rad kategórií, prestylujú pás výhod). Návštevník vidí stránku skôr a potom poskočí.
   Tu je len to, čo treba mať hneď. Zvyšok štýlov ostáva v skriptoch.
   ⚠ Rozmery rezerv sú zmerané 12.11.2026. Keď sa zmení výška radu kategórií alebo lišty, uprav ich tu. */

/* 1. Horná lišta „Pečieme každý týždeň…“ (doplnok Header info bar) sa vkladá až po načítaní celej stránky.
      Kým tam nie je, drží jej miesto prázdny pás v jej farbe. Keď ju návštevník zavrel, inline skript
      v Záhlaví dá na <html> triedu pk-hib-x a rezerva sa nekreslí. */
html:not(.pk-hib-x) .overall-wrapper:not(:has(> .js-header-info-bar))::before{content:"";display:block;height:37px;background:#f0bf9b}
@media (min-width:768px){html:not(.pk-hib-x) .overall-wrapper:not(:has(> .js-header-info-bar))::before{height:30px}}

/* 2. Titulka: Shoptet carousel skryť hneď (rad kategórií ho nahrádza) a kým rad nie je, držať jeho miesto. */
.type-index .banners-row .wide-carousel,.type-index #carousel{display:none!important}
.type-index .banners-row:not(:has(+ .pk-tit))::after{content:"";display:block;height:320px}
@media (min-width:768px){.type-index .banners-row:not(:has(+ .pk-tit))::after{height:350px}}

/* 3. Pás výhod: garancia zvýraznená hneď, nie až keď skript pridá triedu pk-garancia / pk-gar.
      Kópia pravidiel z pk-web-vN.js (všetky stránky) a z pk-titulka-vN.js (cssPod, titulka),
      trieda nahradená :has(a[href$="/garancia/"]). Pri zmene vzhľadu garancie zmeniť aj tu. */
.benefitBanner .benefitBanner__item:has(a[href$="/garancia/"]){order:-1;background:#FFF0E6;border:2px solid #00845B;border-radius:12px;padding:8px 10px;box-shadow:0 2px 10px rgba(0,132,91,.18)}
.benefitBanner .benefitBanner__item:has(a[href$="/garancia/"]) .benefitBanner__picture{flex:0 0 56px!important;width:56px!important;max-width:56px!important;height:56px!important}
.benefitBanner .benefitBanner__item:has(a[href$="/garancia/"]) img.benefitBanner__img{width:56px!important;max-width:56px!important;height:56px!important;max-height:56px!important}
.benefitBanner .benefitBanner__item:has(a[href$="/garancia/"]) .benefitBanner__title{color:#00845B;font-weight:800;font-size:18px}
.benefitBanner .benefitBanner__item:has(a[href$="/garancia/"]) .benefitBanner__data{color:#3F1D14;font-weight:700;font-size:14px}
/* Pečať garancie: v Shoptete obrázok nemá, pk-web ho vkladá skriptom. Kým tam nie je, kreslí ju CSS na rovnakom mieste. */
.benefitBanner .benefitBanner__item:has(a[href$="/garancia/"]):not(:has(img)) .benefitBanner__link::before{content:"";flex:0 0 56px;width:56px;height:56px;background:url(/user/documents/upload/benefit_chrumkava_garancia_150.png) center/contain no-repeat}
.in-index .benefitBanner.position--benefitHomepage .benefitBanner__item:has(a[href$="/garancia/"]):not(:has(img)) .benefitBanner__link::before{flex:0 0 52px;width:52px;height:52px}

.in-index .benefitBanner.position--benefitHomepage{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:14px 0 0!important;padding:0!important}
.in-index .benefitBanner.position--benefitHomepage .benefitBanner__item{width:auto!important;max-width:none!important;margin:0!important;padding:8px 4px!important;background:#FAF6F2;border-radius:10px;border:0;box-shadow:none;display:flex!important;flex-direction:column;align-items:center;text-align:center;gap:2px}
.in-index .benefitBanner.position--benefitHomepage .benefitBanner__link{display:flex!important;flex-direction:column;align-items:center;gap:2px;text-decoration:none!important;color:inherit!important}
.in-index .benefitBanner.position--benefitHomepage .benefitBanner__link *{text-decoration:none!important}
.in-index .benefitBanner.position--benefitHomepage .benefitBanner__picture{flex:0 0 26px!important;width:26px!important;max-width:26px!important;height:26px!important;margin:0!important}
.in-index .benefitBanner.position--benefitHomepage img.benefitBanner__img{width:26px!important;max-width:26px!important;height:26px!important;max-height:26px!important}
.in-index .benefitBanner.position--benefitHomepage .benefitBanner__title{display:block!important;font-size:12.5px!important;line-height:1.15!important;margin:0 0 2px!important;font-weight:800!important;color:#3F1D14!important;text-decoration:none!important}
.in-index .benefitBanner.position--benefitHomepage .benefitBanner__data{display:block!important}
.in-index .benefitBanner.position--benefitHomepage .benefitBanner__item:not(:has(a[href$="/garancia/"])),.in-index .benefitBanner.position--benefitHomepage .benefitBanner__item:not(:has(a[href$="/garancia/"])) .benefitBanner__link{justify-content:flex-start!important}
.in-index .benefitBanner.position--benefitHomepage .benefitBanner__item:not(:has(a[href$="/garancia/"])) .benefitBanner__picture{margin:0 0 4px!important}
.in-index .benefitBanner.position--benefitHomepage .benefitBanner__data{font-size:11.5px!important;line-height:1.25!important;opacity:.75;color:#3F1D14!important}
.in-index .benefitBanner.position--benefitHomepage .benefitBanner__item:has(a[href$="/garancia/"]){grid-column:1/-1;order:-1;flex-direction:row;text-align:left;background:#FFF0E6;border:2px solid #00845B!important;border-radius:14px;padding:10px 14px!important;box-shadow:none!important}
.in-index .benefitBanner.position--benefitHomepage .benefitBanner__content{line-height:1.2!important}
.in-index .benefitBanner.position--benefitHomepage .benefitBanner__item:has(a[href$="/garancia/"]) .benefitBanner__link{flex-direction:row;gap:12px;width:100%}
.in-index .benefitBanner.position--benefitHomepage .benefitBanner__item:has(a[href$="/garancia/"]) .benefitBanner__content{text-align:left!important}
.in-index .benefitBanner.position--benefitHomepage .benefitBanner__item:has(a[href$="/garancia/"]) .benefitBanner__picture,.in-index .benefitBanner.position--benefitHomepage .benefitBanner__item:has(a[href$="/garancia/"]) img.benefitBanner__img{flex:0 0 52px!important;width:52px!important;max-width:52px!important;height:52px!important;max-height:52px!important}
.in-index .benefitBanner.position--benefitHomepage .benefitBanner__item:has(a[href$="/garancia/"]) .benefitBanner__title{font-size:17px!important;font-weight:900!important;color:#00845B!important}
.in-index .benefitBanner.position--benefitHomepage .benefitBanner__item:has(a[href$="/garancia/"]) .benefitBanner__data{font-size:13px!important;opacity:1;font-weight:400!important}
.in-index .benefitBanner.position--benefitHomepage .benefitBanner__item:has(a[href$="/garancia/"]) .benefitBanner__link:after{content:"→";margin-left:auto;color:#00845B;font-weight:900;font-size:20px}
@media (min-width:768px){
.in-index .benefitBanner.position--benefitHomepage{grid-template-columns:1.6fr 1fr 1fr 1fr}
.in-index .benefitBanner.position--benefitHomepage .benefitBanner__item:has(a[href$="/garancia/"]){grid-column:auto}
.in-index .benefitBanner.position--benefitHomepage .benefitBanner__item{flex-direction:row;justify-content:center;text-align:left;gap:10px}
.in-index .benefitBanner.position--benefitHomepage .benefitBanner__link{flex-direction:row;gap:10px}
.in-index .benefitBanner.position--benefitHomepage .benefitBanner__title{font-size:14px!important}
.in-index .benefitBanner.position--benefitHomepage .benefitBanner__data{font-size:12.5px!important}
}

/* 4. Presunuté z inline <style> v Záhlaví (uvoľní miesto v poli s limitom 8192 znakov). */
.social-buttons-wrapper{display:none!important}
.pk-u{list-style:none;margin:14px 0 0;padding:0;line-height:1.9}
.pk-u b{color:#00845B}
