/* Opravy layoutu (11.–12. 10. 2026), patria za zrubko-theme-1.0.css.
   Téma je výpis vypočítaných štýlov z jednej konkrétnej stránky, preto obsahuje natvrdo
   zapísané rozmery, ktoré na iných stránkach a šírkach nesedia. */

/* Prázdny div.messages má v téme top: 0 aj bottom: 900px, takže na vysokom displeji
   je to neviditeľná vrstva (z-index 1003) cez celú hlavičku – nedá sa klikať.
   S bottom: auto má výšku obsahu, prázdny teda 0 px. */
div.messages:not(#z):not(#z):not(#z):not(#z) {
  bottom: auto;
}

/* Skryté prvky pre čítačky majú v téme natvrdo top v tisícoch px (napr. 7182px = výška
   domovskej stránky), každá kratšia stránka sa preto natiahne prázdnym miestom pod pätičkou.
   Nadpisy výpisu (blog, kategórie, stránkovanie) doplnené 12. 10. 2026. */
#screen-reader-announcer:not(#z):not(#z):not(#z):not(#z),
#listingControlsHeading:not(#z):not(#z):not(#z):not(#z),
#articlesListHeading:not(#z):not(#z):not(#z):not(#z),
#paginationTitle:not(#z):not(#z):not(#z):not(#z) {
  top: 0;
  bottom: auto;
  left: 0;
  right: auto;
}

/* Ikona knihy pri „Montážne návody“ je v téme len pre šírku 480–767 px; inde ostane
   biely štvorec (::before s bielym pozadím bez masky). */
div.navigation-in.menu > ul.menu-level-1 > li.menu-item-1097 > a:not(#z):not(#z):not(#z)::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 19.5A2.5 2.5 0 0 1 6.5 17H20M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 19.5A2.5 2.5 0 0 1 6.5 17H20M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Shoptet dáva názvu produktu height: 45px (2 riadky), téma prepisuje overflow na visible,
   takže 3–4-riadkový názov ESSVE prekrýva cenu. Platí v kategóriách aj v slideroch,
   na desktope aj na mobile (desktop doplnený 12. 10. 2026). */
.products-block.products .p .name {
  height: auto;
}

/* Karty v slideri rovnako vysoké, cena a tlačidlo v jednej línii. flex-basis: auto
   je nutné – Shoptetových 100 % by inak pri vyššej karte zalomilo tlačidlo vedľa ceny. */
.products-block .slick-track > .product:not(#z):not(#z) {
  height: auto;
}
.products-block .slick-track > .product > .p:not(#z):not(#z) {
  height: calc(100% - 8px);
}
.products-block .slick-track > .product .p-in-in {
  flex: 1 0 auto;
}
.products-block .slick-track > .product .p-bottom .prices:not(#z):not(#z) {
  flex-basis: auto;
}

/* Mobil: všetko len pod 768 px, kde Shoptet zapína mobilnú hlavičku. */
@media (max-width: 767px) {
  /* Pri scrolle nadol Shoptet vysunie riadok s logom (.top-navigation-bar, 50 px) preč,
     ale #header s vyhľadávaním ostáva na top: 50px – nad ním presvitá obsah. */
  #header {
    transition: transform .15s;
  }
  .scrolled-down body.ums_mobile_header_v1--on:not(.ordering-process):not(.search-window-visible) #header {
    transform: translateY(-50px);
  }

  /* Téma má pevnú šírku karty 195 px (prevzatú z desktopu); na 390 px telefóne sa druhá
     karta orezáva. Dve celé karty = (šírka okna − 2 × 10 px okraj) / 2. */
  div.products.products-block > div.draggable > div > div.product.col-sm-6:not(#z):not(#z) {
    flex-basis: calc((100vw - 20px) / 2);
    min-width: calc((100vw - 20px) / 2);
  }

  /* Chat tlačidlo (zrubko-chat) zakrývalo text a krížik spodného oznamu (57 px).
     Po zavretí oznamu ho Shoptet z DOM odstráni, tlačidlo sa vráti na 20 px. */
  body:has(.site-msg.information) #zr-chat-launcher {
    bottom: 77px;
  }
}

/* Farby newslettera, pätičky a cookie lišty (12. 10. 2026). Šablóna má v Shoptete všetky
   hlavné farby čierne (--color-primary atď. = #000000); hnedú dodával starý INAQ_style_v3.css.
   Téma zrubko-theme-1.0.css vznikla zo stránky bez zobrazenej cookie lišty a overovacieho
   obrázka, takže ich farby nepozná – tlačidlá spadli na čiernu, nadpis a odkaz na čiernu
   na tmavozelenom pozadí. Hnedá #A0522D podľa dizajn manuálu, hover #7E4023 z pôvodného štýlu. */
.custom-footer__newsletter h2:not(#z):not(#z):not(#z):not(#z) {
  color: #e5e5e5;
}
.custom-footer__newsletter label:not(#z):not(#z):not(#z),
.custom-footer__newsletter .consents:not(#z):not(#z):not(#z),
.custom-footer__newsletter .consents a:not(#z):not(#z):not(#z) {
  color: #fff;
}
/* Shoptet dáva poľu pre text z obrázka placeholder „Zadajte Váš e-mail“ – mätie, skryť ho. */
.custom-footer__newsletter input[name=captcha]::placeholder {
  color: transparent;
}
.custom-footer__newsletter .btn.btn-primary:not(#z):not(#z):not(#z) {
  background-color: #A0522D;
  border-color: #A0522D;
  color: #fff;
}
.custom-footer__newsletter .btn.btn-primary:not(#z):not(#z):not(#z):hover {
  background-color: #7E4023;
  border-color: #7E4023;
}

/* Odkazy v pätičke mali #4d4d4d na čiernom pozadí (kontrast ~2,4 : 1), ako telefón a e-mail vedľa. */
#footer .footer-section-content a:not(#z):not(#z):not(#z) {
  color: #e5e5e5;
}
#footer .footer-section-content a:not(#z):not(#z):not(#z):hover {
  color: #fff;
}

.siteCookies__button[data-testid=buttonCookiesAccept]:not(#z):not(#z):not(#z),
.siteCookies__link.js-cookies-settings:not(#z):not(#z):not(#z) {
  background-color: #A0522D;
  border-color: #A0522D;
  color: #fff;
}
.siteCookies__button[data-testid=buttonCookiesAccept]:not(#z):not(#z):not(#z):hover,
.siteCookies__link.js-cookies-settings:not(#z):not(#z):not(#z):hover {
  background-color: #7E4023;
  border-color: #7E4023;
  opacity: 1;
}
/* „Odmietnuť“ ako v pôvodnom štýle: biele, podčiarknutý text. */
.siteCookies__button[data-testid=buttonCookiesReject]:not(#z):not(#z):not(#z) {
  background-color: #fff;
  border: none;
  color: #000;
  font-weight: 400;
  text-decoration: underline;
}

/* Prepínač jazykov: téma skrýva názov jazyka (font-size: 0) a cez ::after dáva skratku SK/EN,
   ktorá font-size: 0 zdedí – v rozbalenom menu ostali len vlajky. Zobraziť plný názov
   „Slovenčina“ / „English“ (Pavol, 12. 10. 2026), skratku zrušiť. */
ul.languagesMenu__list.languagesMenu__list--language > li > a.languagesMenu__list__link > span.languagesMenu__list__name:not(#z):not(#z):not(#z) {
  font-size: 14px;
}
ul.languagesMenu__list.languagesMenu__list--language > li > a.languagesMenu__list__link > span.languagesMenu__list__name:not(#z):not(#z):not(#z)::after {
  content: none;
}

/* --- Kontrola layoutu 12. 10. 2026 (kod/zrubko-ui-patch/20261012-kontrola-layoutu.html) --- */

/* Formuláre (registrácia, kontakt, prihlásenie…): téma farbí text popisu poľa v
   span.required-asterisk na bielu – na bielom formulári ho nevidno. Biela patrí len
   tmavému newsletteru, ten má farbu z pravidla vyššie. */
fieldset > div.form-group.smart-label-wrapper > label > span.required-asterisk:not(#z):not(#z):not(#z) {
  color: inherit;
}
.custom-footer__newsletter span.required-asterisk:not(#z):not(#z):not(#z):not(#z) {
  color: #fff;
}

/* Odosielacie tlačidlá formulárov v obsahu stránky („Registrovať“, „Odoslať“…) berú
   --color-primary šablóny, ktorá je čierna. Premennú nemeníme – berú z nej farbu aj
   bežné odkazy na webe. */
#content form .btn.btn-primary:not(#z):not(#z):not(#z),
#content form input[type=submit].btn:not(#z):not(#z):not(#z) {
  background-color: #A0522D;
  border-color: #A0522D;
  color: #fff;
}
#content form .btn.btn-primary:not(#z):not(#z):not(#z):hover,
#content form input[type=submit].btn:not(#z):not(#z):not(#z):hover {
  background-color: #7E4023;
  border-color: #7E4023;
}

/* „Upraviť nastavenie cookies“ pri copyrighte: čierny odkaz na čiernej pätičke. Cez tento
   odkaz zákazník mení alebo odvoláva súhlas s cookies, musí byť viditeľný. */
#footer .copyright a.cookies-settings:not(#z):not(#z):not(#z) {
  color: #e5e5e5;
  text-decoration: underline;
}
#footer .copyright a.cookies-settings:not(#z):not(#z):not(#z):hover {
  color: #fff;
}

/* Hnedá čiara pod nadpisom stĺpca pätičky má natvrdo top: 27.8px (pod prvým riadkom);
   keď sa nadpis zalomí (napr. „Užitočné informácie“ pri ~1 400 px), ide cez text. */
#footer .footer-section-header h3:not(#z):not(#z):not(#z)::before {
  top: auto;
  bottom: 0;
}

/* Montážne návody: karty „súvisiace“ majú tmavozelené pozadie a biely text, nadpis však
   dostal tmavosivú z témy (kontrast 2,3 : 1). */
.zrn .card4 h2:not(#z):not(#z):not(#z) {
  color: #fff !important;
}

/* Mriežky v obsahu stránok majú v téme natvrdo výšky riadkov (grid-template-rows v px)
   z jednej šírky okna; pri inej šírke alebo dlhšom texte sa text oreže alebo prekrýva
   ďalší riadok (Doprava a platba, O nás, Kontakt, Predajňa, montážne návody, domovská
   stránka). Výška riadku podľa obsahu. */
.shipping-section-grid:not(#z):not(#z):not(#z),
.shipping-section-paymethods:not(#z):not(#z):not(#z),
.shipping-section-contacts:not(#z):not(#z):not(#z),
.about-us-section-grid:not(#z):not(#z):not(#z),
.about-us-section-gallery:not(#z):not(#z):not(#z),
.about-us-section-hero:not(#z):not(#z):not(#z),
.about-us-section-box-row:not(#z):not(#z):not(#z),
.contact-section-info-grid:not(#z):not(#z):not(#z),
.store-section-gallery:not(#z):not(#z):not(#z),
.store-section-maps:not(#z):not(#z):not(#z),
.store-section-hero:not(#z):not(#z):not(#z),
.blk-articles > .articles:not(#z):not(#z):not(#z),
.blk-products > .prod:not(#z):not(#z):not(#z),
.zrn .g2:not(#z):not(#z):not(#z),
#zr-brand-osmo > ul:not(#z):not(#z):not(#z),
#zr-brand-osmo > div:not(#z):not(#z):not(#z) {
  grid-template-rows: none;
}

@media (max-width: 767px) {
  /* Pole množstva pri „Do košíka“: label má natvrdo height: 72px a pole v ňom sedí nižšie
     ako tlačidlá +/− – číslo vyzerá posunuté k spodnému okraju. */
  form.variant-submit > fieldset > span.quantity > label:not(#z):not(#z):not(#z) {
    height: auto;
  }
}

/* Hlavné tlačidlo nákupu (detail produktu ESSVE „Pridať do košíka“, rovnaká trieda aj
   v objednávke) berie --color-secondary šablóny = čierna. Dizajn manuál, kap. 04: primárne
   tlačidlo #A0522D, pri prejdení #7E4023, zaoblenie 5 px, váha 600; čierne tlačidlá sa
   nepoužívajú. Pri dreve má „Do košíka“ hnedú už z vlastného skriptu. (12. 10. 2026) */
.btn.btn-conversion:not(#z):not(#z):not(#z),
a.btn.btn-conversion:not(#z):not(#z):not(#z) {
  background-color: #A0522D;
  border-color: #A0522D;
  color: #fff;
  border-radius: 5px;
  font-weight: 600;
}
.btn.btn-conversion:not(#z):not(#z):not(#z):hover,
a.btn.btn-conversion:not(#z):not(#z):not(#z):hover {
  background-color: #7E4023;
  border-color: #7E4023;
  color: #fff;
}
.btn.btn-conversion:not(#z):not(#z):not(#z):focus-visible,
a.btn.btn-conversion:not(#z):not(#z):not(#z):focus-visible {
  outline: 2px solid #1B2E1B;
  outline-offset: 2px;
}

/* Štítok „Novinka“: Shoptet ho farbí #6495ED (S 79 %, L 66 %) – mimo palety, biely text
   len 3,0 : 1. Variant E (Pavol, 12. 10. 2026): odtieň modrej ostáva (H 219°), sýtosť a
   svetlosť z akčnej sienny #A0522D (S 56 %, L 40 %) → #2D539F, biely text 7,4 : 1.
   Písmo Medium 500 a zaoblenie 5 px podľa dizajn manuálu. */
.flag.flag-new:not(#z):not(#z):not(#z) {
  background-color: #2D539F;
  color: #fff;
  font-weight: 500;
  border-radius: 5px;
}

/* Štítky produktov podľa dizajn manuálu 2.1 (kap. 02, Štítky produktov). Akcia a zľava
   (kruh/obdĺžnik „−X %“) majú jednu farbu – obe znamenajú nižšiu cenu. (12. 10. 2026) */
.flag.flag-action:not(#z):not(#z):not(#z),
.flag.flag-discount:not(#z):not(#z):not(#z) {
  background-color: #9F2D40;
  color: #fff;
}
.flag.flag-action:not(#z):not(#z):not(#z),
.flag.flag-tip:not(#z):not(#z):not(#z) {
  font-weight: 500;
  border-radius: 5px;
}
.flag.flag-tip:not(#z):not(#z):not(#z) {
  background-color: #1B2E1B;
  color: #fff;
}
/* Technické príznaky riadia skripty dopravy a rezania, zákazník ich nevidí. „Rezanie na
   mieru“ malo bielu farbu – biely štítok na fotke, ktorý čítačka aj tak prečíta. */
.flag.flag-rezanie-na-mieru:not(#z):not(#z):not(#z),
.flag.flag-atyp-doprava:not(#z):not(#z):not(#z) {
  display: none;
}

/* Predchádzajúca cena pri zľave (§ 7 zákona 108/2024 Z. z.): prečiarknutá, tlmená farba
   textu z manuálu. .zr-prev-price dopĺňa zrubko-predchadzajuca-cena_N.js (drevo, cena
   za m² a varianty), .price-standard vykresľuje Shoptet (ESSVE a ostatné). */
.zr-prev-price,
.price-final .price-standard,
.p-final-price-wrapper .price-standard {
  margin-left: 6px;
  color: #5C5C5C;
  font-size: .85em;
  font-weight: 400;
  text-decoration: line-through;
  white-space: nowrap;
}
.variant-summary-main .zr-prev-price {
  display: block;
  margin-left: 0;
}
/* Percento zľavy pri cene na detaile – farba zľavy z manuálu namiesto žiarivo červenej. */
.p-final-price-wrapper .price-save:not(#z):not(#z):not(#z) {
  color: #9F2D40;
}

/* Po zapnutí „Štandardná cena: zobraziť“ dostane karta so zľavou triedu action-price a téma
   ju farbí #FF4433 (žiarivá červená mimo palety) a pôvodnú cenu čiernou s vyššou prioritou
   ako pravidlo vyššie. Cena ostáva ako pri ostatných kartách, pôvodná cena tlmená. */
div.prices > div.price.price-final.action-price:not(#z):not(#z):not(#z):not(#z),
div.prices > div.price.price-final.action-price > strong.action-price:not(#z):not(#z):not(#z):not(#z) {
  color: #000;
}
div.prices > div.price.price-final > span.price-standard:not(#z):not(#z):not(#z),
div.prices > div.price.price-final > span.price-standard > span:not(#z):not(#z):not(#z) {
  color: #5C5C5C;
}

/* --- Kontrola na šírkach 1440 / 1366 / 1280 / 1024 / 768 / 390 px (12. 10. 2026) --- */

/* Horný riadok 768–1199 px: otváracie hodiny (::after pri telefóne) natiahnu riadok, prepínač
   jazykov vypadne za okraj obrazovky a s ním sa posunie aj tlačidlo prihlásenia, ktoré
   potom prekrýva ikonu košíka (klik na košík otvoril prihlásenie). Hodiny sú v pätičke. */
@media (min-width: 768px) and (max-width: 1199px) {
  .top-navigation-contacts a.project-phone:not(#z):not(#z):not(#z):not(#z)::after {
    content: none;
    display: none;
  }
}

/* Zľava na karte: téma ju posúva natvrdo (left: 187px / 256px podľa šírky, pri ktorej vznikla);
   pri 768 px skončí mimo karty aj obrazovky. Vždy vpravo hore v karte. */
.products-block .p .flags-extra:not(#z):not(#z):not(#z):not(#z) {
  left: auto;
  right: 10px;
  width: auto;
}

/* Detail dreva: „Cena za m² / Balenie / Cena za balenie“ sú tri stĺpce bez zalomenia; keď je
   karta variantu úzka (≈1366–1400 px, mobil, EN texty), text vyteká do susedného stĺpca.
   Pri úzkej karte dva stĺpce, tretí pod nimi. */
.variant-meta:not(#z):not(#z):not(#z) {
  container-type: inline-size;
}
@container (max-width: 330px) {
  .variant-summary-info:not(#z):not(#z):not(#z) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    row-gap: 12px;
  }
}

/* Rezanie na mieru (zrubko-doprava): téma dáva prepínačom position: absolute a ruší ich vzhľad,
   takže ležia neviditeľné pod textom – zákazník nevidí, čo má vybrané. */
.zd-choice input[type=radio]:not(#z):not(#z):not(#z):not(#z) {
  position: static;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  border: 0;
  background: none;
  -webkit-appearance: radio;
  appearance: auto;
  accent-color: #1B2E1B;
}

/* Jednotka pri cene („/ bal.“, „/ ks“) mala #B2B2B2 – kontrast 2,1 : 1. Tlmený text z manuálu. */
.pr-list-unit:not(#z):not(#z):not(#z) {
  color: #5C5C5C;
}

/* Detail dreva: poradie zhora nadol varianta → doprava → rezanie (12. 10. 2026). Téma dáva
   každému div v stĺpci order: -7, tabuľke doručenia -4 a košíku -2. Box dopravy a rezania
   (div.zd-root) tak pri dreve bez variantov (KVH) predbehol cenu aj košík; pri obkladoch
   sedel len vďaka poradiu v HTML. Košík preto patrí k výberu variantu (-7) a box dopravy
   za neho (-6), pred krátky popis (-5). :has() obmedzuje zmenu na drevo, ESSVE ostáva. */
#product-detail-form .p-info-wrapper:has(> .zd-root) > table.detail-parameters:not(#z):not(#z):not(#z):not(#z),
#product-detail-form .p-info-wrapper:has(> .zd-root) > div.add-to-cart:not(#z):not(#z):not(#z):not(#z) {
  order: -7;
}
#product-detail-form .p-info-wrapper > div.zd-root:not(#z):not(#z):not(#z):not(#z) {
  order: -6;
}