﻿/* v97: font Hanken Grotesk se nacita <link>em v Zahlavi (preconnect + css2), @import odstranen (blokoval vykresleni) */

:root{
  /* v18 INK MONOCHROM (Robin 2026-06-12, vybral z 9 smeru "H"): akcent = cerna jako logo,
     brainmarket princip. --g/--gd uz NEJSOU zelene — jsou to obecne AKCENT tokeny.
     Zelena zustava jen sem antick y pres --ok (Skladem). */
  --g:#141815; --gd:#3a403b;   /* v32: hover akcent = VIDITELNY grafit (byl #000 = cerna na cernou neznat; Robin: "at zmeni barvu vic"). Mimo hover jen 3x barva textu => grafit neznat. */
  --ink:#141815; --mut:#5f6361;   /* ztmaveno z #73787a → lepší kontrast (audit: šedá byla 4.54:1, těsně nad WCAG AA) */
  --line:#dcdcd7; --soft:#f4f4f2; --tint:#e4e4e0;   /* v66: JEDNA seda ve 2 krocich (byly f4f6f4 do zelena + efefed tepla = 'dve sede') · v120 (8. 9.): --line 1,18→1,38:1 a --tint 1,19→1,27:1 k bile (funkcni linky a hover na slabych monitorech mizely); --soft = dekor, beze zmeny */
  --sale:#c0392b;
  --ok:#0f7a4d;                   /* semanticka zelena: JEN dostupnost "Skladem" */
  --h:'Hanken Grotesk',sans-serif;
  /* v79: JEDEN tvar sipky pro cely web = chevron BEZ ocasku (Robin 3. 9.: 'aby to korespondovalo cele').
     Pouziva karuselove tlacitko i dlazdice kategorii; breadcrumb a podkategorie maji typograficky \203a. */
  --chev:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23141815' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 6 15 12 9 18'/%3E%3C/svg%3E");
  --chev-w:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 6 15 12 9 18'/%3E%3C/svg%3E");
  /* v81: dvojity chevron pro CTA banneru (Robin: na konverznim tlacitku dve sipecky). Tvar = tentyz chevron bez ocasku, jen dvakrat. */
  --chev2w:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 24' fill='none' stroke='%23ffffff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='7 6 13 12 7 18'/%3E%3Cpolyline points='16 6 22 12 16 18'/%3E%3C/svg%3E");
}

#footer .footer-rows .site-name { display:none; }
#footer .custom-footer { padding-left:0 !important; background:#F6F6F6; padding-top:45px; padding-bottom:35px; }
#footer .container { background-color:#efefef; }
.homepage-box.before-carousel { margin:0; padding:0; border:0; background:transparent; }
.odber { background-color:#EFEFEF; }
.category-perex.empty-content-category { display:none !important; }
.top-navigation-menu { display:none !important; }

@media screen and (min-width:1200px){
  .p-detail-info, .p-detail-inner-header { margin-left:50%; padding-left:20px; }
  .p-image-wrapper { margin-top:-72px; }
}

input, select, textarea { border-width:1px; }
input:focus, input:focus-visible, select:focus, select:focus-visible,
textarea:focus, textarea:focus-visible { outline:none !important; box-shadow:none !important; border-width:2px !important; border-style:solid !important; border-color:#9e9e9e !important; }
input[type="search"]:focus, input[type="search"]:focus-visible { border-color:#9e9e9e !important; }
.cart-content input:focus, .ordering-process input:focus, .cart-content select:focus, .ordering-process select:focus { border-color:#9e9e9e !important; }
button:focus, button:focus-visible { outline:none !important; box-shadow:none !important; }
input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
input[type="number"] { -moz-appearance:textfield; appearance:textfield; }

body{ font-family:var(--h) !important; }
button, input, select, textarea, .btn{ font-family:var(--h) !important; }
.homepage-box .h4, .products-block .h4, div.h4{ font-family:var(--h) !important; font-weight:700 !important; }

input[type=text], input[type=email], input[type=password], input[type=tel], input[type=search], input[type=number], textarea{ border:1.5px solid var(--line) !important; border-radius:10px !important; }

input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, textarea:-webkit-autofill, select:-webkit-autofill{ -webkit-box-shadow:0 0 0 1000px #fff inset !important; box-shadow:0 0 0 1000px #fff inset !important; -webkit-text-fill-color:var(--ink) !important; caret-color:var(--ink); }

.product{ border:0 !important; transition:transform .2s, box-shadow .2s; }
.product:hover{ transform:none !important; }
/* v11 SCOPE: kartovy vzhled JEN pro kartove kontejnery — .products-block (B2C grid, homepage,
   vyhledavani) a .products-top (Nejprodavanejsi). HLAVNI B2B RADKOVY VYPIS prihlasenych
   velkoobchodnich skupin je .products-page.products-INLINE (bez products-top!) a karty mu
   rozbijely radky (90 % obratu!) — ten zustava nativni, jen typografie/barvy. */
.products-block .product > .p, .products-block .product .p, .products-top .product .p{
  background:#fff !important; border:1px solid var(--line) !important; border-radius:16px !important;
  padding:16px; overflow:hidden; box-shadow:0 1px 2px rgba(0,0,0,.04);
  transition:box-shadow .3s, transform .3s; height:100%; position:relative; text-align:left;
}
.products-block .product .p:hover, .products-top .product .p:hover{ transform:translateY(-4px); box-shadow:0 24px 48px -28px rgba(20,24,21,.16); }
/* FIX v9c: zarovnani spodku karet — cena+tlacitko byly v kazde karte jinak vysoko podle delky
   nazvu/hvezdicek. Flex column + margin-top:auto ukotvi p-bottom (cena/btn) dolu jednotne. */
/* v15: flex-column/zarovnani JEN .products-block — na .products-top (Nejprodavanejsi) delal
   na desktopu vysoke karty s 90px obrazkem uprostred prazdna ("rozbity pohled" — Robin).
   Desktop products-top = nativni kompaktni radek (obrazek vlevo, text vpravo) + nas box;
   sloupcovy stack pro products-top zustava JEN v ≤991 bloku (fix lamani po pismenech). */
.products-block .product .p{ display:flex !important; flex-direction:column !important; }
.products-block .product .p .p-in{ display:flex !important; flex-direction:column !important; flex:1 1 auto !important; }
/* v33 ZAROVNANI DETAIL TLACITEK (Robin 2026-06-16: "tlacitka na ruznych urovnich, jde to na stejne
   misto?"). DETAIL je nahore v .p-bottom; doted .p-bottom mela margin-top:auto (ukotvena DOLU) =>
   jeji vyska (delka aroma) menila vysku DETAIL. Reseni: .p-bottom hned po .p-in-in (ne dolu) +
   nazev fixni vyska 2 radky (jediny promenny prvek NAD tlacitkem) => DETAIL u vsech karet stejne. */
.products-block .product .p .p-in .p-bottom{ margin-top:0 !important; }
.products-block .product .p a.name{ min-height:46px !important; display:block !important; }
.products-block .product .p .widget-parameter-wrapper{ margin-top:10px !important; }

.products-block .product .p .image{ background:var(--soft) !important; border-radius:12px !important; padding:14px !important; position:relative; display:flex !important; align-items:center; justify-content:center; }
.products-block .product .p .image img{ mix-blend-mode:multiply; }

/* v12b: B2B/RADKOVY VYPIS — JEDNA definice pro VSECHNY radkove vypisy (Robin: styl se nesmi
   definovat per-misto). `.products-inline:not(.products-top)` = kategorie (products-page),
   HOMEPAGE sekce prihlasenych B2B (homepage-products-N), vyhledavani — vsude stejny ramecek
   + hover efekt, layout zustava RADKOVY (flex/row nativni, nesahat!). */
.products-inline:not(.products-top) .product{ border:0 !important; }
.products-inline:not(.products-top) .product .p{ background:#fff !important; border:1px solid var(--line) !important; border-radius:12px !important; padding:10px 16px !important; margin-bottom:10px !important; box-shadow:0 1px 2px rgba(0,0,0,.04); transition:box-shadow .3s, transform .3s; }
.products-inline:not(.products-top) .product .p:hover{ transform:translateY(-2px); box-shadow:0 16px 32px -22px rgba(20,24,21,.16); }
.product > .p > .p-code{ top:8px; right:8px; }

.product .flags-default{ position:absolute !important; top:12px !important; left:12px !important; right:auto !important; bottom:auto !important; display:flex !important; flex-direction:column !important; align-items:flex-start !important; gap:6px !important; z-index:3 !important; }
.product .flags-extra, .product .extra-flags{ position:absolute !important; top:12px !important; right:12px !important; left:auto !important; bottom:auto !important; display:block !important; width:auto !important; max-width:none !important; white-space:nowrap !important; z-index:3 !important; }

.product .flag{ border-radius:999px !important; font-family:var(--h) !important; line-height:1.25 !important; /* v65: velikost/vaha/padding ridi D3 nize */ box-shadow:none !important; width:auto !important; height:auto !important; }

.product .flags-extra .flag-discount{ display:inline-block !important; float:none !important; max-width:none !important; min-width:0 !important; width:auto !important; height:auto !important; border-radius:999px !important; padding:4px 10px !important; font-size:0 !important; line-height:1 !important; text-align:center !important; }
.product .flags-extra .flag-discount .price-standard{ display:none !important; }
.product .flags-extra .flag-discount .price-save{ display:inline-block !important; font-size:11.5px !important; line-height:1.25 !important; white-space:nowrap !important; font-weight:700 !important; font-family:var(--h) !important; }

.product .prices .price-save{ color:var(--sale) !important; font-weight:600 !important; font-size:13px !important; }

.p-final-price-wrapper .price-save{ color:var(--sale) !important; font-weight:600 !important; }

.product .p a.name{ font-family:var(--h) !important; font-size:19px !important; font-weight:700 !important; letter-spacing:-.01em; line-height:1.2 !important; color:var(--ink) !important; }
.product .p a.name:hover{ color:var(--gd) !important; text-decoration:none !important; }
.product .availability span{ color:var(--g) !important; font-weight:600; display:inline-flex; align-items:center; gap:6px; font-family:var(--h); }
.product .availability span::before{ content:""; width:6px; height:6px; border-radius:50%; background:currentColor; display:inline-block; } /* v65: currentColor — tecka = barva textu (v17 prebiji color na mut/ok, tecka zustavala cerna) */
.product .price.price-final{ font-family:var(--h) !important; letter-spacing:-.01em; color:var(--ink) !important; } /* v65: velikost/vaha ridi D4 nize */
.product .price.price-final small{ font-size:12px; font-weight:500; color:var(--mut); }
.product .price-standard{ color:var(--mut); text-decoration:line-through; font-size:13px; }
/* v13 grafy audit: #a4a8a4 melo kontrast 2.4:1 na bile (pod WCAG 4.5) → --mut (5.9:1) */
/* v21 (Robin 2026-06-15): tabulkove cislice na cenach/parametrech => cifry stejne siroke,
   ceny v kartach/tabulce neposkakuji pri zmene mnozstvi/variant. Hanken Grotesk je podporuje. */
.product .prices, .product .price, .price-final, .p-final-price-wrapper, .price-save, .price-standard, .detail-parameters td, .pagination__link{ font-variant-numeric:tabular-nums !important; }

.product .widget-parameter-list{ display:flex; flex-wrap:wrap; gap:6px; list-style:none; padding:0; margin:10px 0 16px; }
.product .widget-parameter-list .widget-parameter-value{ margin:0; padding:0; }
.product .p .widget-parameter-list .widget-parameter-value a{ display:inline-flex !important; align-items:center; justify-content:center; text-align:center; min-width:46px; border:1px solid var(--line); border-radius:999px; padding:4px 14px !important; box-sizing:border-box; font-size:12.5px; font-weight:500; color:var(--ink) !important; text-decoration:none; transition:.15s; font-family:var(--h); }
.product .p .widget-parameter-list .widget-parameter-value a:hover{ background:#fff !important; border-color:var(--g) !important; color:var(--g) !important; }

.btn{ border-radius:12px !important; font-family:var(--h) !important; transition:background .15s, border-color .15s, color .15s !important; }

.btn-cart, .btn-conversion, a.btn-conversion{ background:var(--g) !important; border:1.5px solid var(--g) !important; color:#fff !important; border-radius:12px !important; font-family:var(--h); font-weight:700; }
.btn-cart:hover, .btn-conversion:hover{ background:var(--gd) !important; border-color:var(--gd) !important; }
.product .btn-primary, a.btn-primary{ background:#fff !important; border:1.5px solid var(--g) !important; color:var(--g) !important; border-radius:12px !important; font-family:var(--h); font-weight:700; }
.product .btn-primary:hover, a.btn-primary:hover{ background:var(--tint) !important; border-color:var(--gd) !important; color:var(--gd) !important; }
.btn-secondary{ background:#fff !important; border:1px solid var(--line) !important; color:var(--ink) !important; border-radius:12px !important; }

/* FIX v9c: padding — tlacitko melo nativne vysku jen 26px, s radiusem 12 vypadalo jako kulata pilulka */
html body .btn.btn-sm.btn-primary, html body #formDiscussion .btn, #formDiscussion .btn, #productDiscussion .btn-primary{ border-radius:12px !important; background:var(--g) !important; border:1.5px solid var(--g) !important; color:#fff !important; font-family:var(--h) !important; font-weight:700 !important; padding:10px 20px !important; height:auto !important; line-height:1.2 !important; }
html body .btn.btn-sm.btn-primary:hover, #formDiscussion .btn:hover, #productDiscussion .btn-primary:hover{ background:var(--gd) !important; border-color:var(--gd) !important; }

/* v30: SJEDNOCENI TLACITEK (Robin 2026-06-16) — dorovnani odchylek z button_audit.py:
   radius vsude 12 (Hledat/stranky/newsletter byly 10), primarni CTA vaha 700.
   3 tiery uz existuji: PRIMARNI .btn-conversion/.btn-cart/.btn-default/.btn-login (ink fill 700),
   SEKUNDARNI .btn-primary (ink outline 700), TICHA .btn-secondary/.btn-icon/.pagination (--line 600). */
/* stepper mnozstvi +/- byl nativni: seda #4d4d4d, vaha 300 => do systemu (ink, citelne). */
.quantity button.increase, .quantity button.decrease, .quantity .increase__sign, .quantity .decrease__sign{ color:var(--ink) !important; font-weight:600 !important; }
/* login = primarni akce => ink fill (mel .btn-secondary=bila + nativni krivy padding 5/9/4). */
.btn.btn-login, button.btn-login{ background:var(--g) !important; border:1.5px solid var(--g) !important; color:#fff !important; border-radius:12px !important; font-family:var(--h) !important; font-weight:700 !important; padding:11px 22px !important; height:auto !important; line-height:1.2 !important; }
.btn.btn-login:hover, button.btn-login:hover{ background:var(--gd) !important; border-color:var(--gd) !important; color:#fff !important; }

/* v32 JEDNODUCHE HOVERY (Robin 2026-06-16: "stacilo aby tlacitko zmenilo barvu vic, na co
   komplikovane animace" — zrusen lift/stin z v31, jen ZMENA BARVY).
   PRIMARNI ink-fill resi uz token --gd (#3a403b) ve vsech `:hover{background:var(--gd)}` pravidlech. */
/* SEKUNDARNI ink-outline (DETAIL): hover = vypln ink (invert) = jasna zmena barvy. */
.product .btn-primary:hover, a.btn-primary:hover, .p-detail a.p-all:hover, a.btn.p-all:hover,
.tab-content a.btn-default:hover{
  background:var(--ink) !important; border-color:var(--ink) !important; color:#fff !important;
}
/* TICHA line-outline: ramecek ztmavne na ink + jemny tint.
   v59b: btn-icon (kosik v hlavicce) hover JEN desktop — na mobilu se :hover po tapu
   „prilepi" a kolem nativni ikony kosiku se vykreslovala seda pilulka. */
.btn-secondary:hover, .pagination__link:hover{
  border-color:var(--ink) !important; background:var(--tint) !important; color:var(--ink) !important;
}
@media (min-width:768px){
.navigation-buttons a.btn-icon:hover{
  border-color:var(--ink) !important; background:var(--tint) !important; color:var(--ink) !important;
}
}

/* v32 NEWSLETTER SIPKA: byla glyph z ikonofontu "shoptet" (::before) => rozbije se kdyz font
   nenacte. Prestylovat SAMOTNE ::before na vlastni SVG (NESAHAT na position tlacitka — Shoptet ho
   ma absolute u inputu, position:relative z v31 ho shodilo dolu). Layout zustava nedotceny. */
.btn-arrow-right::before{ content:"" !important; font-family:var(--h) !important; position:absolute !important; top:50% !important; left:50% !important; transform:translate(-50%,-50%) !important; width:20px !important; height:20px !important; margin:0 !important; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='4' y1='12' x2='20' y2='12'/%3E%3Cpolyline points='13 5 20 12 13 19'/%3E%3C/svg%3E") center/20px no-repeat !important; }

/* v59: VŠECHNA pravidla hlavičky jen ≥768 — na mobilu je hlavička 100% NATIVNÍ
   (Robin 1. 9.: naše desktop pravidla ji trhala na dva řádky, košík utíkal dolů). */
@media (min-width:768px){
.header-top{ padding:18px 0 14px !important; }
}

/* FIX v9: DESKTOP NAV LAYOUT jen od 768px — Shoptet prepina na mobilni drawer pod 768px;
   tyhle !important layout pravidla (absolute + flex radek + stretch) driv platila i v draweru
   a vyskladala mobilni menu vodorovne do jedne rady = rozbity mobil */
@media (min-width: 768px){
nav.fitted, nav.fitted.visible{ position:relative !important; min-height:50px !important; margin:0 !important; overflow:visible !important; z-index:1; display:flex !important; align-items:center !important; }

/* FIX v9c: full-bleed BILY pas menu (drive jen hairline => na strankach se sedym pozadim
   /kosik/ vznikal bily/sedy schod na krajich, protoze bily bg mel jen container-wide .menu)
   v12: hairline NAD MENU definitivne PRYC (Robin 2026-06-11: "linku nad menu nechci" —
   "linka fine" se tykala RAMECKU u B2B produktu, ne teto cary). */
nav.fitted::before, nav.visible::before{ content:""; position:absolute; top:0; left:50%; transform:translateX(-50%); width:100vw; height:100%; background:#fff; z-index:-1; pointer-events:none; }
/* FIX v9b: NAV ROBUSTNE, BEZ ZAVISLOSTI NA .fitted TRIDE.
   Shoptetimu JS (fitted/burger "Vice") se neda verit — meri sirky polozek PRED nactenim
   webfontu a trida .fitted bliká podle timingu => polozky pretekaly pres burger, rezaly se
   na hrane viewportu, nebo druhy radek utikal na banner.
   Reseni: menu je STATICKY v toku (nav roste s obsahem), zalamovani povolene vzdy,
   burger schovany (vsechny polozky jsou videt). Zadna absolutni vyska = zadny 4px gap
   (dropdown navazuje primo na spodek nav diky position:relative na nav). */
nav.fitted, nav.fitted.visible, nav.visible, header nav{ position:relative !important; min-height:0 !important; height:auto !important; margin:0 !important; overflow:visible !important; z-index:1; display:block !important; }
.navigation-in.menu{ position:static !important; width:auto !important; max-width:100% !important; padding:0 !important; background:transparent !important; border:0 !important; margin:0 !important; display:block !important; }
.navigation-in.menu ul.menu-level-1{ display:flex !important; flex-wrap:wrap !important; align-items:stretch !important; gap:2px !important; width:auto !important; max-width:100% !important; }
/* visibility:visible !important prebiji INLINE visibility:hidden, ktere Shoptet JS dava
   polozkam pri mereni/preteceni a s nasim statickym layoutem je uz neodkryje */
.navigation-in.menu ul.menu-level-1 > li{ display:flex !important; align-items:stretch !important; border-left:0 !important; border-right:0 !important; visibility:visible !important; }
.navigation-in.menu ul.menu-level-1 > li > a{ visibility:visible !important; }
.navigation-in.menu ul.menu-level-1 > li > a{ display:inline-flex !important; align-items:center !important; }
.menu-helper{ display:none !important; }
}

/* v23: PODTRZITKO misto pilulky (Robin 2026-06-15: pilulka co se lepi na panel = picovina,
   navic aktivni pilulka + hover pilulka = dve zvyrazneni naraz). Skill ui-ux-pro-max:
   "highlight active nav item with underline" (border-b-2). Zadne podbarveni tabu => zadny
   sev s panelem, zadna dve zvyrazneni. Pilulka byla v17; tohle ji NAHRAZUJE. */
.navigation-in.menu a{ color:var(--ink) !important; font-weight:600 !important; font-size:15px !important; letter-spacing:.005em; font-family:var(--h); padding:14px 14px !important; border-radius:0 !important; position:relative !important; background:transparent !important; transition:color .18s ease !important; }
.navigation-in.menu a::after{ content:none !important; }
.navigation-in.menu a:hover{ color:var(--gd) !important; background:transparent !important; }
.navigation-in.menu .active, .navigation-in.menu li.active > a{ color:var(--ink) !important; background:transparent !important; font-weight:700 !important; }
/* underline indikator JEN na top-level polozkach (desktop), ne na odkazech v panelu. */
@media (min-width:768px){
  /* v23b: GPU vrstva (will-change/translateZ) => animace bezi na kompozitoru, ne na main
     threadu, ktery v moment otevreni blokuje render panelu (Robin: "zasekava se podtrzitko"). */
  .navigation-in.menu ul.menu-level-1 > li > a::after{ content:"" !important; position:absolute !important; left:14px !important; right:14px !important; bottom:9px !important; height:2px !important; background:var(--ink) !important; transform:scaleX(0) translateZ(0) !important; transform-origin:center !important; transition:transform .16s ease-out !important; will-change:transform !important; backface-visibility:hidden !important; }
  .navigation-in.menu ul.menu-level-1 > li:hover > a::after,
  .navigation-in.menu ul.menu-level-1 > li.exp:hover > a::after,
  .navigation-in.menu ul.menu-level-1 > li.active > a::after{ transform:scaleX(1) translateZ(0) !important; }

  /* v26: SCRIM ZRUSEN (Robin 2026-06-15: "udelej jak Brouwland — pouze stin, jde o to aby se to
     popnulo"). Ztmavovani pozadi (dim) bylo zdrojem blikani pri prechodu sub->bez. Misto toho panel
     POPNE silnym stinem (viz box-shadow u .menu-level-2 vyse). Zadny scrim, zadne zvedani headeru. */
}

.navigation-in.menu > ul > li, .navigation-in.menu ul.menu-level-1 > li{ border-left:0 !important; border-right:0 !important; }

.menu-helper::after, .menu-helper > span{ background:transparent !important; background-color:transparent !important; color:var(--ink) !important; border:0 !important; box-shadow:none !important; }

.breadcrumbs-wrapper{ margin-top:16px !important; }

@media (min-width:768px){
.top-navigation-bar{ background:var(--soft) !important; border-bottom:1px solid var(--line) !important; }
.top-navigation-bar *{ background-color:transparent !important; }
}

.sidebar.sidebar-left, .sidebar-left, .sidebar-inner{ background:transparent !important; }
.filter-sections{ background:transparent !important; }
@media (min-width:768px){
.top-navigation-bar, .top-navigation-contacts, .top-navigation-contact, .top-navigation-bar a, .top-navigation-contacts a, .top-navigation-bar span{ color:#5c645c !important; font-size:13px !important; }
.top-navigation-bar a:hover{ color:var(--g) !important; }
.top-navigation-bar .languagesMenu__content{ background:transparent !important; }
.top-navigation-bar .languagesMenu *{ color:#5c645c !important; }
.languagesMenu__list, .languagesMenu__list *{ background:#fff !important; color:var(--ink) !important; }
}

/* FIX v9: jen #header (site hlavicka) — hole "header" chytalo i <header> obal nadpisu
   na statickych strankach (Vykup/Servis kegu, O nas) = oramovane/podsvicene zahlavi */
@media (min-width:768px){
#header{ box-shadow:0 2px 14px rgba(0,0,0,.06) !important; position:relative; z-index:5; }

.header-top{ display:flex !important; align-items:center !important; gap:28px !important; justify-content:flex-start !important; }
.header-top .site-name-wrapper{ flex:0 0 auto !important; width:auto !important; }
.header-top .search{ flex:1 1 auto !important; width:auto !important; max-width:760px !important; margin:0 !important; }
.header-top .search-form, .header-top .search fieldset, .header-top .search input:not([type=hidden]):not([type=submit]){ width:100% !important; }
.header-top .navigation-buttons{ flex:0 0 auto !important; width:auto !important; margin-left:auto !important; }
}

.breadcrumbs-wrapper, .breadcrumbs-wrapper a, .breadcrumbs-wrapper span, .breadcrumbs-wrapper li{ font-size:12px !important; }

.search-form input.search-input, .search-form input[type=search], .search-form .query-input, .search-form input:not([type=hidden]):not([type=submit]){ height:46px !important; border-radius:12px !important; border:1.5px solid var(--line) !important; padding-left:44px !important; padding-right:108px !important; background:#fff url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%236e756e' stroke-width='2' stroke-linecap='round'><circle cx='11' cy='11' r='7'/><path d='M21 21l-4.3-4.3'/></svg>") no-repeat 14px center !important; }
.search-form input:focus{ border-color:var(--g) !important; background-color:#fff !important; box-shadow:0 0 0 4px var(--tint) !important; }
/* v51: position:absolute DOPLNENO (Robin 2026-08-31: "tlacitko krive, neni spolu se searchem")
   — btn byl nativne static, takze top/right 4px NEplatily a tlacitko viselo VNE pilulky nalepene
   nahore; input pritom ma vpravo padding 108px prave pro tlacitko uvnitr. .search-form je relative. */
.search-form .btn, .search-form button[type=submit]{ position:absolute !important; top:4px !important; right:4px !important; height:38px !important; border-radius:12px !important; background:var(--ink) !important; border-color:var(--ink) !important; color:#fff !important; padding:0 20px !important; font-weight:700 !important; }
.search-form .btn:hover{ background:var(--gd) !important; }

.btn-default{ background:var(--ink) !important; border-color:var(--ink) !important; color:#fff !important; border-radius:12px !important; font-family:var(--h); font-weight:700 !important; padding:11px 22px !important; }

@media (min-width:768px){
.navigation-buttons a.btn-icon{ background:#fff !important; color:var(--ink) !important; border:1.5px solid var(--line) !important; border-radius:12px !important; padding:9px 15px !important; display:inline-flex !important; align-items:center !important; gap:9px !important; height:auto !important; font-weight:600 !important; font-size:14px !important; font-family:var(--h) !important; }
.navigation-buttons a.btn-icon .cart-price{ color:var(--ink) !important; }
.navigation-buttons a.btn-icon:hover{ background:var(--tint) !important; border-color:var(--ink) !important; color:var(--ink) !important; } /* v67: tichy tier (bylo bily + --g == ink => jen ramecek) */
.navigation-buttons a.btn-icon::before, .navigation-buttons .btn-icon::before{
  content:"" !important; font-family:inherit !important; display:inline-block !important; width:22px !important; height:22px !important; vertical-align:middle;
  background:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23141815' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'><circle cx='9' cy='20' r='1.4'/><circle cx='18' cy='20' r='1.4'/><path d='M2 3h3l2.4 12a1.8 1.8 0 0 0 1.8 1.45h8.1a1.8 1.8 0 0 0 1.78-1.5L22 7H6.2'/></svg>") no-repeat center/contain !important;
}
}

.subcategories.with-image li a, .subcategories li a, .subcategories a{
  border-radius:12px !important; border:1px solid var(--line) !important; background:#fff !important; transition:.18s !important;
}
.subcategories.with-image li a:hover, .subcategories li a:hover, .subcategories a:hover{
  border-color:var(--g) !important; background:var(--tint) !important; color:var(--g) !important;
}

.p-detail-info .flag, .p-image .flag{ border-radius:999px !important; font-family:var(--h) !important; font-weight:700 !important; font-size:11px !important; padding:4px 10px !important; line-height:1.25 !important; box-shadow:none !important; width:auto !important; height:auto !important; }
.p-detail-info .flags-default{ display:flex !important; flex-wrap:wrap !important; gap:6px !important; align-items:center !important; }

.p-image .flags-extra{ top:12px !important; right:12px !important; bottom:auto !important; left:auto !important; display:block !important; width:auto !important; }
.p-image .flags-extra .flag-discount{ display:inline-block !important; float:none !important; max-width:none !important; min-width:0 !important; width:auto !important; height:auto !important; min-height:0 !important; border-radius:999px !important; padding:4px 10px !important; font-size:0 !important; line-height:1 !important; text-align:center !important; }
.p-image .flags-extra .flag-discount .price-standard{ display:none !important; }
.p-image .flags-extra .flag-discount .price-save{ display:inline-block !important; font-size:11.5px !important; line-height:1.25 !important; white-space:nowrap !important; font-weight:700 !important; font-family:var(--h) !important; }

/* v13b: SYSTEMOVE stitky (Akce, Novinka, sleva-%) — NEMAJI color picker v adminu (na rozdil
   od custom priznaku Cryo/Super nabidka/Leto..., ktere barvi Robin v adminu) → CSS je jedine
   misto. Brand paleta: Akce=sale cervena, Novinka=pine, sleva=ink pilulka (dle navrhu 03). */
.flag.flag-action{ background:var(--sale) !important; color:#fff !important; }
.flag.flag-new{ background:var(--g) !important; color:#fff !important; }
/* v16: sleva CERVENA (ink pilulku Robin zamitl) — sale sémantika jednotne s Akce */
.flag.flag-discount{ background:var(--sale) !important; color:#fff !important; }
.flag.flag-discount .price-save{ color:#fff !important; }

/* v16: stitky NESMI prevrstvit otevrene menu — mely z:3 a v DOM jsou az za hlavickou,
   takze prekreslovaly mobilni drawer (z:auto) i cokoliv z hlavicky s nizsim z */
.flags-default, .flags-extra, .product .flag, .extra-flags{ z-index:1 !important; }

/* v11: jen .products-top (carousel) — bare .products-inline skryvalo stitky i v B2B radkovem vypisu */
.products-top .flags-default, .products-top .flags-extra, .products-top .extra-flags{ display:none !important; }

.box-categories .pageElement__heading, .box-categories h3{ font-family:var(--h) !important; font-size:12px !important; letter-spacing:.09em !important; text-transform:uppercase !important; color:var(--mut) !important; font-weight:700 !important; }
.box-categories .categories a{ font-family:var(--h) !important; color:var(--ink) !important; border-radius:8px !important; transition:background .15s, color .15s !important; }
.box-categories .categories a:hover{ background:var(--tint) !important; color:var(--ink) !important; } /* v66: idiom 'polozka seznamu' = jen podklad */
.box-categories .categories .active > a:hover, .box-categories .categories li.active > a:hover{ color:var(--gd) !important; } /* v66: hover reaguje i na aktivni (byl tint->tint = nic) */
.box-categories .categories li.active > a, .box-categories .categories .active > a{ color:var(--g) !important; font-weight:700 !important; background:var(--tint) !important; }
.box-categories .categories .active, .box-categories .categories li.active{ background:transparent !important; }

.toggle-filters, a.toggle-filters{ color:var(--g) !important; font-family:var(--h) !important; font-weight:600 !important; }
.slider-wrapper .ui-slider{ background:var(--line) !important; border:0 !important; border-radius:999px !important; height:5px !important; }
.slider-wrapper .ui-slider-range{ background:var(--g) !important; }
.slider-wrapper .ui-slider-handle{ background:var(--g) !important; border:2px solid var(--g) !important; border-radius:50% !important; }

.slider-wrapper .ui-slider-handle::after{ top:50% !important; left:50% !important; transform:translate(-50%,-50%) !important; margin:0 !important; }
.param-filter-top, .param-filter-top *{ font-family:var(--h) !important; }
.param-filter-top label{ color:var(--ink) !important; }
.filter-sections label:hover, .param-filter-top label:hover{ color:var(--gd) !important; cursor:pointer; } /* v66: filtr mel nulovy hover */
input[type=checkbox], input[type=radio]{ accent-color:var(--g) !important; }

.pagination{ font-family:var(--h) !important; }
.pagination__list{ display:inline-flex !important; align-items:center !important; gap:8px !important; flex-wrap:wrap; }
.pagination .pagination__currentPage, .pagination__link{ display:inline-flex !important; align-items:center !important; justify-content:center !important; min-width:38px !important; min-height:38px !important; box-sizing:border-box !important; }
.pagination a, .pagination__link, .pagination span{ border-radius:12px !important; font-family:var(--h) !important; transition:.15s !important; }

.pagination__link{ border:1px solid var(--line) !important; padding:6px 12px !important; color:var(--ink) !important; background:#fff !important; }
.pagination a:hover, .pagination__link:hover{ border-color:var(--g) !important; color:var(--g) !important; background:var(--tint) !important; }
.pagination .pagination__currentPage, .pagination [aria-current], .pagination strong, .pagination .active, .pagination .selected{ background:var(--g) !important; color:#fff !important; border-color:var(--g) !important; border-radius:12px !important; padding:6px 12px !important; display:inline-block; }

.listSorting{ font-family:var(--h) !important; }
.listSorting__control{ font-family:var(--h) !important; color:var(--mut) !important; background:transparent !important; border:0 !important; font-weight:600 !important; position:relative !important; transition:color .15s !important; }
.listSorting__control:hover{ color:var(--ink) !important; }
.listSorting__control--active, .listSorting__control--current, .listSorting__control[aria-pressed="true"], .listSorting__control.active, .listSorting__control.selected{ color:var(--ink) !important; font-weight:700 !important; }
/* v36: PODTRZITKO jako menu+taby (Robin: jednotny styl hoveru — sort menil jen barvu). */
.listSorting__control::after{ content:"" !important; position:absolute !important; left:20px !important; right:20px !important; bottom:5px !important; height:2px !important; background:var(--ink) !important; transform:scaleX(0) !important; transform-origin:center !important; transition:transform .16s ease-out !important; }
/* v38: sort = stejne jako taby (Robin: hover podtrzitko fungovalo, vratit; + aktivni schovat pri
   hoveru jineho => jedna cara). */
.listSorting__control--active::after, .listSorting__control--current::after, .listSorting__control[aria-pressed="true"]::after, .listSorting__control.active::after, .listSorting__control.selected::after,
.listSorting__control:hover::after{ transform:scaleX(1) !important; }
.listSorting:hover .listSorting__control--active:not(:hover)::after,
.listSorting:hover .listSorting__control.active:not(:hover)::after,
.listSorting:hover .listSorting__control.selected:not(:hover)::after,
.listSorting:hover .listSorting__control[aria-pressed="true"]:not(:hover)::after{ transform:scaleX(0) !important; }

/* v15b: FULL-BLEED footer — seda na #footer (cela sirka), vnitrni containery transparentni.
   Drive byla seda jen na .footer-rows (1418px) => na sirokych monitorech bile pruhy po stranach. */
#footer{ background:var(--soft) !important; }
#footer .custom-footer{ background:transparent !important; }
#footer .container.footer-rows, #footer .container{ background:transparent !important; }
#footer, #footer p, #footer li, #footer span, #footer td{ font-family:var(--h) !important; color:var(--mut) !important; }
/* v15b: SJEDNOCENI SEDYCH PRUHU — .category-header (radici lista) a .shp-tabs (Popis/Diskuze)
   mely #F6F6F6, footer --soft #f4f6f4 => tri ruzne sede. Vse na --soft. */
.category-header{ background:var(--soft) !important; }
.shp-tabs{ background:var(--soft) !important; }
/* v36: .shp-tabs-HOLDER (obal kolem tabu) mel nativni #f6f6f6 = JINA seda nez footer/--soft
   (Robin 2026-06-16: "barva pozadi je jina seda nez footer") => take na --soft. */
.shp-tabs-holder{ background:var(--soft) !important; }
#footer .custom-footer h3, #footer .custom-footer h4, #footer .footer-title, #footer .pageElement__heading{ font-family:var(--h) !important; font-size:13px !important; letter-spacing:.05em !important; text-transform:uppercase !important; color:var(--ink) !important; font-weight:700 !important; }
#footer a{ color:var(--ink) !important; transition:color .15s !important; }
#footer a:hover{ color:var(--gd) !important; } /* v66: --g==--ink od v18 => hover nebyl videt */

#footer .facebook a, #footer .instagram a, #footer .youtube a{ font-size:0 !important; letter-spacing:0 !important; }
#footer .facebook a::after{ content:"Facebook" !important; font-size:14px !important; }
#footer .instagram a::after{ content:"Instagram" !important; font-size:14px !important; }
#footer .youtube a::after{ content:"YouTube" !important; font-size:14px !important; }

.odber{ background:var(--soft) !important; }
.odber, .odber *{ font-family:var(--h) !important; }
.odber .btn, .odber .btn-arrow-right, .btn-arrow-right{ background:var(--g) !important; border-color:var(--g) !important; color:#fff !important; border-radius:12px !important; font-weight:700 !important; }
.odber .btn:hover, .btn-arrow-right:hover{ background:var(--gd) !important; }
.odber input:not([type=submit]):not([type=hidden]){ border-radius:12px !important; border:1.5px solid var(--line) !important; font-family:var(--h) !important; }
.odber a{ color:var(--g) !important; }

.p-detail select, .form-group select, select:not(.hidden-split-parameter){ border:1.5px solid var(--line) !important; border-radius:10px !important; min-height:42px !important; background-color:#fff !important; font-family:var(--h) !important; color:var(--ink) !important; }
.p-detail select:focus, .form-group select:focus{ border-color:var(--g) !important; box-shadow:0 0 0 3px var(--tint) !important; }

/* v15: zeleny accent u VARIANTNICH selectu ODSTRANEN (Robin) — bil se se systemovou modrou
   hover barvou nativniho popupu (tu CSS neprebije), pulka zelena pulka modra = nekonzistence */

html body .quantity{ display:inline-block !important; position:relative !important; padding:0 !important; width:auto !important; background:#fff !important; border:0 !important; box-shadow:none !important; }
html body .quantity label{ display:block !important; margin:0 !important; padding:0 !important; }
html body .quantity input.amount{ width:72px !important; box-sizing:border-box !important; height:44px !important; padding:0 30px 0 6px !important; text-align:center !important; border:1.5px solid var(--line) !important; border-radius:10px !important; background:#fff !important; }
html body .quantity .increase, html body .quantity .decrease{ position:absolute !important; right:0 !important; left:auto !important; top:auto !important; width:26px !important; height:21px !important; border:0 !important; border-left:1.5px solid var(--line) !important; border-radius:0 !important; background:#fff !important; box-shadow:none !important; padding:0 !important; margin:0 !important; }
html body .quantity .increase{ top:1px !important; bottom:auto !important; border-bottom:1.5px solid var(--line) !important; border-radius:0 9px 0 0 !important; }
html body .quantity .decrease{ top:auto !important; bottom:1px !important; border-radius:0 0 9px 0 !important; }
.quantity .increase__sign, .quantity .decrease__sign{ color:var(--ink) !important; }

.shp-tabs .shp-tab-link{ font-family:var(--h) !important; font-weight:600 !important; color:var(--ink) !important; border:0 !important; position:relative !important; padding:12px 18px !important; background:transparent !important; }
.shp-tabs .shp-tab-link:hover{ color:var(--g) !important; }
.shp-tabs .shp-tab-link.active, .shp-tabs li.active > .shp-tab-link, .shp-tabs .shp-tab-link[aria-selected="true"]{ color:var(--g) !important; font-weight:700 !important; }
/* v34: TABY = PODTRZITKO jako menu (Robin 2026-06-16: pilulka pryc — jednotny styl hoveru; navic
   pilulka mela --tint = JINA seda nez pas --soft/footer). Zadne pozadi, jen ink podtrzitko. */
.shp-tabs .shp-tab-link{ border-radius:0 !important; background:transparent !important; margin:0 2px !important; transition:color .16s ease !important; }
.shp-tabs .shp-tab-link:hover{ background:transparent !important; color:var(--gd) !important; }
.shp-tabs .shp-tab-link.active, .shp-tabs li.active > .shp-tab-link{ background:transparent !important; color:var(--ink) !important; }
.shp-tabs .shp-tab-link::after{ content:"" !important; position:absolute !important; left:18px !important; right:18px !important; bottom:6px !important; height:2px !important; background:var(--ink) !important; transform:scaleX(0) !important; transform-origin:center !important; transition:transform .16s ease-out !important; }
/* v39: cara JEN pod aktivnim/otevrenym tabem; hover meni jen BARVU (viz `:hover` color vyse),
   zadnou caru nepridava (Robin 2026-06-16: "sledovani mysi delalo dve cary"). Staticka cara
   technicky NEMUZE udelat dve — at je `.active` na <a> nebo na <li>. `[aria-selected]` pokryva
   i variantu, kdy Shoptet znaci otevreny tab pres ARIA misto tridy .active. Cely follow-mouse
   blok (v38 :hover::after + .shp-tabs:hover ...:not(:hover)) ZRUSEN — byl zdrojem dvou car. */
.shp-tabs .shp-tab-link.active::after, .shp-tabs li.active > .shp-tab-link::after,
.shp-tabs .shp-tab-link[aria-selected="true"]::after,
.shp-tabs li[aria-selected="true"] > .shp-tab-link::after{ transform:scaleX(1) !important; }
/* v40: taby jsou `.p-detail a` => chytalo je obecne `.p-detail a:hover{text-decoration:underline}`
   ( r. ~597) => hoverovany tab dostal text-decoration podtrzeni NAVIC k ::after care aktivniho =
   DVE cary (to, co Robin videl). Taby maji vlastni ::after indikator => zadne text-decoration. */
.shp-tabs .shp-tab-link, .shp-tabs .shp-tab-link:hover{ text-decoration:none !important; }

/* COOKIE LISTA (v9) — byla defaultni nestylovana */
.siteCookies{ font-family:var(--h) !important; border-radius:14px !important; border:1px solid var(--line) !important; box-shadow:0 12px 40px rgba(0,0,0,.14) !important; }
.siteCookies__button{ background:var(--g) !important; color:#fff !important; border:0 !important; border-radius:12px !important; font-weight:700 !important; font-family:var(--h) !important; }
.siteCookies__button:hover{ background:var(--gd) !important; }
.siteCookies__link{ background:#fff !important; color:var(--ink) !important; border:1.5px solid var(--line) !important; border-radius:12px !important; font-family:var(--h) !important; }
.siteCookies__link:hover{ border-color:var(--g) !important; color:var(--g) !important; }

.detail-parameters, .detail-parameters *{ font-family:var(--h) !important; }
.detail-parameters .parameter-name, .detail-parameters td:first-child, .detail-parameters th{ color:var(--mut) !important; font-weight:500 !important; }
.detail-parameters .parameter-value, .detail-parameters td:last-child{ color:var(--ink) !important; font-weight:700 !important; }

.p-detail a, .p-detail-info a{ color:var(--g) !important; }
/* FIX v9c: "Zobrazit vsechny podobne produkty" — .btn-default (ink pozadi) + zeleny text
   z pravidla vyse = cerne tlacitko se zelenym textem. Predelano na outline sekundarni. */
.p-detail a.p-all, a.btn.p-all, .tab-content a.btn-default{ background:#fff !important; border:1.5px solid var(--g) !important; color:var(--g) !important; }
.p-detail a.p-all:hover, a.btn.p-all:hover, .tab-content a.btn-default:hover{ background:var(--tint) !important; color:var(--gd) !important; border-color:var(--gd) !important; }

.breadcrumbs{ border-bottom:0 !important; display:flex !important; align-items:center !important; flex-wrap:wrap !important; }
.breadcrumbs, .breadcrumbs *{ min-height:0 !important; padding-top:0 !important; padding-bottom:0 !important; }
.breadcrumbs > span{ display:inline-flex !important; align-items:center !important; }
.navigation-home-icon{ padding-left:22px !important; padding-right:0 !important; }

.breadcrumbs::before{ left:0 !important; }

html body .breadcrumbs > span > a::after, html body .breadcrumbs > span > a::before{ content:none !important; font-size:0 !important; width:0 !important; padding:0 !important; margin:0 !important; }

.breadcrumbs .navigation-bullet{ display:none !important; font-size:0 !important; }

.breadcrumbs > span:not(:last-child)::after{ content:'\203a' !important; color:#c4c9c4 !important; font-size:15px !important; font-weight:400 !important; margin:0 9px !important; display:inline-block !important; }
.breadcrumbs-wrapper{ padding-top:8px !important; padding-bottom:8px !important; }

@media(max-width:767px){
  .breadcrumbs{ flex-wrap:nowrap !important; overflow-x:auto !important; white-space:nowrap !important; -webkit-overflow-scrolling:touch; }
  .breadcrumbs > span{ flex:0 0 auto !important; }
  .breadcrumbs > span:not(:last-child)::after{ margin:0 5px !important; }
}

.btn-login, .btn.btn-secondary.btn-login{ background:var(--g) !important; border:1.5px solid var(--g) !important; color:#fff !important; font-weight:700 !important; }
.btn-login:hover{ background:var(--gd) !important; border-color:var(--gd) !important; }

.slider-wrapper .ui-slider-handle{ top:50% !important; margin-top:-10px !important; }

.param-filter-top input[type=checkbox], input[type=checkbox]{ border-radius:5px !important; }

.filter-count{ background:var(--soft) !important; color:var(--mut) !important; border-radius:999px !important; padding:1px 9px !important; font-size:12px !important; font-weight:600 !important; margin-left:6px !important; display:inline-block; min-width:20px; text-align:center; }

h1,h2,h3,.section-name{ font-family:var(--h) !important; }

@media(max-width:767px){
  /* v11: scope na kartove kontejnery, at to nerozbiji B2B radkovy vypis na mobilu */
  .products-block .product .p-tools, .products-block .product .p-bottom{ width:100% !important; }
  .products-block .product .p-tools .btn, .products-block .product .btn-primary, .products-block .product .btn-cart, .products-block .product .btn-conversion, .products-block a.btn-primary{ width:100% !important; display:block !important; margin-top:12px !important; padding:13px !important; float:none !important; }
  .products-block .product .price, .products-block .product .prices{ text-align:left !important; }
  .products-block .product .widget-parameter-list{ margin:12px 0 18px !important; }
  .products-block .product .prices, .products-block .product .offers, .products-block .product .price{ margin-top:6px !important; }
}

/* =========================================================
   BEEREX Shoptet safe fixes v7
   Keep these at the end so they win over the older overrides.
   ========================================================= */

:where(a, button, input, select, textarea, .btn):focus-visible {
  outline: 3px solid var(--tint) !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 1px var(--g) !important;
}

button:focus:not(:focus-visible),
.btn:focus:not(:focus-visible) {
  outline: none !important;
  box-shadow: none !important;
}

/* FIX v9c: modry focus ramecek na mobilu — JS po prepnuti tabu fokusuje .tab-pane (div),
   mobilni prohlizec na nem kresli modry UA focus ring a ten se prenasi mezi zalozkami.
   Divy nejsou interaktivni → ring vypnout; odkazy jen pri tapu (ne klavesnici). */
.tab-pane:focus, .tab-content:focus, [class*="shp-tab"]:focus:not(:focus-visible),
a:focus:not(:focus-visible) {
  outline: none !important;
  box-shadow: none !important;
}
html { -webkit-tap-highlight-color: transparent; }

.search-form input:focus-visible,
.p-detail select:focus-visible,
.form-group select:focus-visible {
  border-color: var(--g) !important;
  box-shadow: 0 0 0 4px var(--tint) !important;
}

@media (min-width: 768px) and (max-width: 1199px) {
  .header-top { gap: 18px !important; }
  .header-top .search { max-width: none !important; }
}
@media (max-width: 1199px) {
  .navigation-in.menu a { padding-left: 11px !important; padding-right: 11px !important; font-size: 14px !important; }
}

/* v59b: hlavičkové řádky z 991-bloku scopovány na 768–991 — na mobilu dávaly prázdné
   .header-top výšku 28px a její bílý rodič překryl text otevřeného cart okna
   („zmizel nápis košík je prázdný"). Karty níže platí dál pro celé ≤991. */
@media (min-width: 768px) and (max-width: 991px) {
  /* FIX v9: search NEzalamovat na vlastni radek (order:3 + flex:1 0 100% prelilo search
     pres nav radek = prekryti menu na tabletu 768-991). Inline jako nativni sablona. */
  .header-top { gap: 14px !important; padding: 14px 0 !important; }
  .header-top .search { max-width: none !important; }
  nav.fitted, nav.fitted.visible { min-height: 46px !important; }
}
@media (max-width: 991px) {
  /* FIX v9: cena v karte vyctu — na uzke karte byla v 76px sloupci vedle DETAIL tlacitka
     a lamala se na 2-3 radky ("od 106,20 Kc"). Stack: cena nad tlacitkem.
     POZOR: obal mezi .p-bottom a .prices je na kategorii ANONYMNI div (jen homepage ma .offers). */
  .products-block .product .p-bottom{ width:100% !important; }
  .products-block .product .p-bottom > div{ display:block !important; }
  .products-block .product .p-bottom .prices{ width:100% !important; float:none !important; }
  .products-block .product .p-bottom .btn, .products-block .product .p-bottom .btn-primary{ margin-top:8px !important; float:none !important; }
  /* FIX v9: karty "Nejprodavanejsi" (.products-top) — na uzke sirce byl obrazek vlevo
     a nazev v ~52px sloupci = lamani po pismenech ("Chme l Vera"). Stack svisle.
     v11: scope na .products-top, bare .products-inline by stackoval i B2B radky. */
  .products-top .product .p { display: flex !important; flex-direction: column !important; }
  .products-top .product .p .image { width: 100% !important; max-width: none !important; margin: 0 0 10px !important; }
  .products-top .product .p .p-in, .products-top .product .p .p-bottom { width: 100% !important; margin: 0 !important; }
}

@media (max-width: 767px) {
  /* v59: reset kosiku smazan — pill styl je nove scopovan na ≥768, mobil je nativni */
  /* v16: otevreny mobilni DRAWER vzdy NAD obsahem (nativne z-index auto => stitky z produktu
     prosvitaly pres otevrene menu kategorii) */
  .navigation-in.menu{ z-index:4000 !important; }
  /* v59: mobilni .header-top pravidla SMAZANA — desktop flex pravidla jsou nove scopovana
     na ≥768 (hlavicka na mobilu je cela nativni), takze neni co resetovat. */
  .search-form input.search-input,
  .search-form input[type=search],
  .search-form .query-input,
  .search-form input:not([type=hidden]):not([type=submit]) { height: 44px !important; padding-right: 94px !important; }
  .search-form .btn,
  .search-form button[type=submit] { height: 36px !important; padding: 0 14px !important; }
  .wide-carousel,
  .carousel-inner,
  .carousel .item { border-radius: 0 !important; }
  .product .p a.name { font-size: 17px !important; }
}

@media (max-width: 480px) {
  /* FIX v9: btn-icon pill pravidla odstranena — pod 768px je kosik cista ikona (reset v 767 bloku),
     tahle pozdejsi pravidla by reset prebila a vratila padding */
  .product .flags-default { top: 10px !important; left: 10px !important; }
  .product .flags-extra,
  .product .extra-flags { top: 10px !important; right: 10px !important; }
}

/* =========================================================
   AUDIT KONZISTENCE (merge 2026-06-10) — na konci, ať vyhraje
   ========================================================= */
/* Sjednocení zaoblení tlačítek na 12px. Audit naměřil 0/9/10/12px (např. „Přidat do košíku" na detailu = 0px,
   některá pravidla na klonu nevyhrávala). `html body` = vysoká specificita, ať přebije nativní šablonu.
   Stepper (.increase/.decrease) NENÍ .btn → zůstává s vlastními dělícími rohy. Search lupa drží 10px záměrně. */
html body .btn, html body a.btn, html body button.btn,
html body .btn-conversion, html body .add-to-cart-button, html body .btn-cart,
html body .product .btn-primary, html body a.btn-primary, html body .btn-default{ border-radius:12px !important; }
html body .search-form .btn, html body .search-form button[type=submit]{ border-radius:12px !important; }

/* ===== v13 GRAFICKY AUDIT — sjednoceni barev (nalezeno paletovym sweepem) ===== */
/* Zbytky stare theme-olivove rgb(37,113,10) na odkazech/akcich mimo nase komponenty
   („Zobrazit vice produktu", „Detailni informace", odkazy v obsahu, fusion tlacitka).
   Pozn.: definitivni fix u zdroje = Navrhar primarni barva na 0f7a4d (Robinuv ukol). */
button.btn--link, .btn--link, button.chevron-after, button.chevron-down-after, .fusion-button-text{ color:var(--g) !important; }
/* v15: plosna pravidla `.content a` / `.sidebar a` → zelena ODSTRANENA (Robinova stiznost
   „proc tolik zeleneho" — obarvilo nazvy clanku, ceny, kdeco). Genericke odkazy ridi
   NAVRHAR (Barva sablony 1 = pine), CSS barvi jen sve konkretni komponenty. */
/* Nazvy clanku = ink, zelena jen hover */
.news-item a.title{ color:var(--ink) !important; }
.news-item a.title:hover{ color:var(--g) !important; }
/* Texty rgb(77,77,77) (stara theme sed) → ink, jednotne s nasi paletou */
.content p, .content li, .p-desc, .latest-contribution-description, .availability-label, .listItemsTotal,
.filter-sections .from, .filter-sections .to, .sidebar .from, .sidebar .to{ color:var(--ink); }

/* ===== v14 FOOTER PLATBY — jeden souvisly pas (drive VISA/MC 34px vlevo pod nadpisem,
   Comgate 24px jinde a jinak — ruzne velikosti, rozhazene). Oba bloky maji border-top,
   stejne zarovnani a sjednocene vysky log => cte se jako jedna sekce pres celou sirku. ===== */
/* v16b: bez border-top (Robin: cary ve footeru nechce) — sekci oddeluje jen mezera */
.custom-footer__onlinePayments, .custom-footer__banner1{ border-top:0 !important; margin-top:18px !important; padding-top:10px !important; display:flex !important; align-items:center !important; }
.custom-footer, #footer .custom-footer{ border-top:0 !important; }
.custom-footer__onlinePayments{ flex:0 0 auto !important; width:auto !important; gap:22px !important; }
.custom-footer__onlinePayments .pageElement__heading{ margin:0 !important; }
.custom-footer__onlinePayments p{ margin:0 !important; display:flex !important; align-items:center !important; }
.custom-footer__onlinePayments img{ height:26px !important; width:auto !important; }
.custom-footer__banner1{ flex:1 1 auto !important; width:auto !important; padding-left:28px !important; }
.custom-footer__banner1 .banner, .custom-footer__banner1 .banner-wrapper, .custom-footer__banner1 a{ margin:0 !important; padding:0 !important; display:flex !important; align-items:center !important; }
.custom-footer__banner1 img{ height:22px !important; width:auto !important; opacity:.8; }
@media (max-width: 767px){
  .custom-footer__onlinePayments, .custom-footer__banner1{ flex-wrap:wrap !important; padding-left:0 !important; }
}

/* ===== v17 DOSTUPNOSTI — stav BEZ barvy v adminu (Na dotaz) dedil zelenou z theme;
   default = neutralni seda. Skladem (#009901 inline z adminu) sjednocen na pine.
   Vyprodano: nastavit CERVENOU v adminu (Nastaveni->Dostupnosti), inline projde. ===== */
.availability{ color:var(--mut) !important; }
.availability span:not([style]){ color:var(--mut) !important; }
.availability span[style*="009901"]{ color:var(--ok) !important; }

/* ===== v14 STATICKE STRANKY — typograficky rytmus (obsah je spravne centrovany 800px sloupec) ===== */
.type-page .content-inner h1{ margin:4px 0 22px !important; }
.type-page .content-inner h2{ margin:26px 0 12px !important; }
.type-page .content-inner h3{ margin:22px 0 10px !important; }
.type-page .content-inner p{ line-height:1.7 !important; margin-bottom:14px !important; }
.type-page .content-inner ul, .type-page .content-inner ol{ margin:12px 0 18px !important; line-height:1.7 !important; }

/* ===== v40 (Robin 2026-06-16): hover PODTRZENI ZRUSENO uplne (byl to v18 affordance pattern).
   Robin: "podkresluji se i nazvy a to nebylo tak". Cerna->cerna nebylo videt, tak jsem kdysi dal
   podtrzeni — ted misto nej JEMNA ZMENA BARVY: nazvy produktu cerna->grafit --gd (viz
   `.product .p a.name:hover` vyse), footer/top-bar uz barvu meni (mut->ink). Explicitni none =
   pojistka, ze zadne pravidlo (ani thema, ani moje) podtrzeni nevrati. Mega-menu dropdown
   (.menu-level-2/3 a:hover) ponechan beze zmeny — jeho podtrzeni je soucasti schvaleneho menu. ===== */
#footer a:hover, .news-item a.title:hover, .product .p a.name:hover,
.p-detail a:not(.btn):not(.p-all):not([class*="btn"]):hover, .top-navigation-bar a:hover{ text-decoration:none !important; }
.news-item a.title:hover{ color:var(--gd) !important; }

/* overflow-wrap — dlouhé názvy (např. „…Frozen CRYO™ Hop Mosaic (USA)") se nepřetečou z kontejneru */
.product .p a.name, .p-detail h1, .breadcrumbs span, .p-detail-info, .product .p{ overflow-wrap:break-word !important; word-break:break-word !important; }

/* ===== v19+v20 — MEGA-DROPDOWN PREDELAN (Robin 2026-06-12: miniatury pryc + "u nas katastrofa,
   Brouwland to ma dobre"). Sablona: dlazdice s obrazkem (slot 116px, min-height 75px) a 3. uroven
   jako INLINE vycet s natvrdo psanymi carkami (textove uzly v li!) => carky zabiji font-size:0.
   Cilovy vzhled: vzdusny bily panel se stinem, 4 sloupce, tucny nazev podkategorie,
   pod nim svisly seznam 3. urovne. Desktop-only (mobilni drawer ma vlastni layout). ===== */
.navigation-in.menu a.menu-image{ display:none !important; }
@media (min-width:768px){
  /* panel: vzduch + stin (zadne cary). Sablona otvira pres tridu `exp` na li (display:flex)
     => v otevrenem stavu prepnout na CSS COLUMNS (masonry) — flex radky delaly obri diry,
     kdyz jedna podkategorie mela dlouhou 3. uroven (radek vysoky jak nejvyssi polozka) */
  /* pozadi panelu = --tint jako pilulka aktivni polozky => otevreny tab se do panelu "rozpusti" */
  /* v23b: panel BILY + v26 SILNY "POP" stin (Brouwland styl, Robin: jen stin at to popne).
     Dvouvrstvy stin = mekky velky halo + ostrejsi blizky okraj => panel jasne plave nad strankou.
     POZOR: NEsahat na position panelu — v zakladu je absolute (overlay); position:relative ho rozbije. */
  .navigation-in.menu ul.menu-level-2{ padding:26px 34px 30px !important; background:#fff !important; box-shadow:0 28px 56px -16px rgba(20,24,21,.34), 0 10px 22px -12px rgba(20,24,21,.22) !important; }
  /* v23: pilulkovy "fuse" blok (v21/v22) ODSTRANEN — otevreny tab uz nema zadne podbarveni,
     indikace je podtrzitkem (viz blok ANIMACE vyse). Panel proste sjede pod lisku. */
  .navigation-in.menu ul.menu-level-1 > li.exp > ul.menu-level-2{ display:block !important; columns:4 !important; column-gap:34px !important; }
  /* polozka = blok ve sloupci, nedelit pres sloupce, bez dlazdicove rezervy */
  .navigation-in.menu ul.menu-level-2 > li{ display:block !important; width:auto !important; min-height:0 !important; padding:0 0 16px !important; break-inside:avoid !important; }
  .navigation-in.menu ul.menu-level-2 > li > div{ width:100% !important; display:block !important; }
  /* nazev podkategorie = tucny ink, kompaktni (prebiji genericke nav padding 14px) */
  .navigation-in.menu ul.menu-level-2 > li > div > a{ display:block !important; padding:4px 0 !important; font-size:15px !important; font-weight:700 !important; border-radius:0 !important; background:transparent !important; }
  .navigation-in.menu ul.menu-level-2 > li > div > a:hover{ background:transparent !important; color:var(--gd) !important; text-decoration:underline !important; }
  /* "Vse z kategorie" v bocnim stromu kategorii (vklada beerex-menu.js) */
  .box-categories li.bx-show-all > a{ font-weight:700 !important; color:var(--gd) !important; }
  .box-categories li.bx-show-all > a:hover{ text-decoration:none !important; } /* v66: bez podtrzeni — polozka seznamu ma jen podklad (+barva z B3) */
  /* "Zobrazit vse" (vklada beerex-menu.js) — radek pres vsechny sloupce nahore */
  .navigation-in.menu ul.menu-level-2 > li.bx-show-all{ column-span:all !important; padding:0 0 14px !important; }
  .navigation-in.menu ul.menu-level-2 > li.bx-show-all a{ display:inline-block !important; padding:4px 0 !important; font-size:14px !important; font-weight:700 !important; color:var(--gd) !important; background:transparent !important; border-radius:0 !important; }
  .navigation-in.menu ul.menu-level-2 > li.bx-show-all a:hover{ text-decoration:underline !important; }
  /* 3. uroven: svisly seznam, mensi a tissi; font-size:0 na li zabije textove carky.
     Sablona ji kolabuje pres .has-more-items{max-height:0;overflow:hidden} + "..." expander
     (span.more-items-trigger) => rozbalit natrvalo, expander skryt */
  .navigation-in.menu ul.menu-level-3{ display:block !important; margin:2px 0 0 !important; font-size:0 !important; max-height:none !important; overflow:visible !important; }
  .navigation-in.menu .more-items-trigger{ display:none !important; }
  .navigation-in.menu ul.menu-level-3 li{ display:block !important; font-size:0 !important; }
  .navigation-in.menu ul.menu-level-3 li a{ display:block !important; padding:3px 0 !important; font-size:13.5px !important; font-weight:500 !important; color:var(--mut) !important; border-radius:0 !important; background:transparent !important; }
  .navigation-in.menu ul.menu-level-3 li a:hover{ color:var(--gd) !important; background:transparent !important; text-decoration:underline !important; }
}
/* mobil/drawer: jen skryt rezervu po obrazku */
@media (max-width:767px){
  .navigation-in.menu ul.menu-level-2 > li{ min-height:0 !important; }
  .navigation-in.menu ul.menu-level-2 > li > div{ width:100% !important; }
}

/* ===== v20 — DLAZDICE PODKATEGORII NAD VYPISEM => TEXTOVE PILULKY (Robin 2026-06-12:
   "kategorie se dubluji v pilulkach nad produktama") — obrazkove dlazdice mely stejne
   nahodne fotky/placeholdery jako menu; NEMAZAT cely blok (na mobilu je sidebar skryty
   => dlazdice = hlavni navigace podkategorii), jen zhutnit na textove pilulky. ===== */
/* v20b (Robin: pilulky nevyrazne, puvodni ramecky byly usporadanejsi) => jednotne RAMECKY
   v gridu: stejna sirka, border, sipka vpravo — rad jako drive, ale textove, bez obrazku */
ul.subcategories{ display:grid !important; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)) !important; gap:10px !important; margin:8px 0 18px !important; padding:0 !important; }
ul.subcategories > li{ width:auto !important; max-width:none !important; padding:0 !important; margin:0 !important; min-height:0 !important; display:block !important; }
ul.subcategories .image{ display:none !important; }
ul.subcategories > li > a{ display:flex !important; align-items:center !important; justify-content:space-between !important; gap:10px !important; width:auto !important; min-width:0 !important; height:100% !important; padding:12px 14px !important; border:1px solid var(--line) !important; border-radius:10px !important; background:#fff !important; color:var(--ink) !important; font-family:var(--h); font-weight:600 !important; font-size:13.5px !important; line-height:1.25 !important; white-space:normal !important; transition:background .15s ease, border-color .15s ease; }
ul.subcategories > li > a .text{ display:block !important; white-space:normal !important; overflow:visible !important; text-overflow:clip !important; flex:1 1 auto !important; font-size:13.5px !important; padding:0 !important; margin:0 !important; }
ul.subcategories > li > a::before{ content:none !important; }
ul.subcategories > li > a::after{ content:'\203a' !important; background:none !important; background-image:none !important; position:static !important; width:auto !important; height:auto !important; font-size:17px !important; line-height:1 !important; color:var(--mut) !important; flex:none !important; }
ul.subcategories > li > a:hover{ background:var(--tint) !important; border-color:var(--mut) !important; color:var(--gd) !important; text-decoration:none !important; }
ul.subcategories > li > a:hover::after{ color:var(--gd) !important; }
@media (max-width:767px){
  ul.subcategories{ grid-template-columns:repeat(2,1fr) !important; gap:8px !important; }
  ul.subcategories > li > a{ padding:11px 12px !important; font-size:13px !important; }
}

/* =========================================================
   v51 — IKONY KATEGORII ODSTRANENY (Robin 2026-08-31: "ikonky dat pryc").
   Cely v48 blok s --bxi maskami smazan — EN mutace je stejne nemela
   (nekonzistence) a michaly styly kresby. Z v48 ZUSTAVA jen drawer fix:
   ========================================================= */
@media (max-width:767px){
  /* drawer zacinal na y=0 POD fixni horni listou (lupa+burger ~50px) => prvni polozka
     (Chmel) byla schovana. Predexistujici bug, viditelne od m_drawer auditu. */
  .navigation-in.menu{ padding-top:52px; }
  /* v59: bloky v54b/v56/v56c/v58 SMAZÁNY — všechny záplatovaly artefakty našich
     desktopových pravidel hlavičky přetékajících do mobilu. Ta jsou nyní scopovaná
     na ≥768 a mobilní hlavička (vč. drawer/search chování) je plně nativní Shoptet. */
}

/* =========================================================
   v49 — KOMPRESE MENU (Robin 2026-08-06: "menu se lame do 2 radku")
   Krok 1 misto burgeru: pod 1320 px mensi font + tesnejsi paddingy
   top-level polozek => jeden radek vydrzi cca do ~1000 px.
   Underline ::after ma left/right vazane na padding => menit spolu.
   ========================================================= */
@media (min-width:768px) and (max-width:1400px){
  .navigation-in.menu ul.menu-level-1 > li > a{ font-size:14px !important; padding:14px 9px !important; letter-spacing:0 !important; }
  .navigation-in.menu ul.menu-level-1 > li > a::after{ left:9px !important; right:9px !important; }
}
@media (min-width:768px) and (max-width:1160px){
  .navigation-in.menu ul.menu-level-1 > li > a{ font-size:13px !important; padding:13px 6px !important; }
  .navigation-in.menu ul.menu-level-1 > li > a::after{ left:6px !important; right:6px !important; }
}

/* =========================================================
   v52 — KATEGORIE: duplicity a poradi (Robin 2026-08-31)
   ========================================================= */
/* A) Podkategorie se DUBLOVALY: pilulky nad vypisem + strom vlevo. Desktop => pilulky skryt
   (strom umi i sourozence a ostatni kategorie, pilulky jen deti; produkty zacnou o ~270px vys).
   Mobil/tablet <992 pilulky ZUSTAVAJI — sidebar je tam skryty a pilulky jsou jedina navigace. */
@media (min-width:992px){
  .type-category .category-top ul.subcategories{ display:none !important; }
}
/* B) Text kategorie (perex) DOLU pod vypis produktu. Cisty CSS reorder: #content ma jen
   2 deti (.category-top + .category-content-wrapper); display:contents vyzdvihne deti
   category-top na uroven flexu a perex dostane order az za wrapper. DOM se NEMENI (SEO ok),
   plati pro vsechny sirky i /en/. */
.type-category #content{ display:flex !important; flex-direction:column !important; }
.type-category .category-top{ display:contents !important; }
.type-category .category-perex{ order:10 !important; margin-top:32px !important; }

/* =========================================================
   v50 — 3 FIXY z design review 2026-08-31
   ========================================================= */
/* FIX 1: mobilni kosik/checkout — nativni sablona .header-top na ordering-process kolabuje
   na vysku 0 (deti skryte), ale nase paddingy (r.156 + r.519) z nej delaly 24px prazdny bily
   pas uvnitr #header (z-index 5), ktery prekryval nadpis "Vas nakupni kosik je prazdny". */
@media (max-width:767px){
  body.ordering-process .header-top{ padding:0 !important; }
}
/* FIX 2: vyhledavani — radek "Clanky" (.search-results-group-list ul) mel nativni CSS COLUMNS
   (bloky vedle sebe s dirami, 3. odkaz plaval vpravo). Zrusit columns => cisty svisly seznam. */
.search-results-group-list ul{ display:block !important; columns:auto !important; column-count:auto !important; margin:6px 0 10px !important; padding:0 !important; }
.search-results-group-list ul li:not(.no-display){ display:block !important; float:none !important; width:auto !important; margin:0 0 6px !important; padding:0 !important; list-style:none !important; }
.search-results-group-list ul li a{ font-family:var(--h) !important; }
/* FIX 3: karty — "od 888,16 Kc vcetne DPH" (.price-additional) se lamalo ("DPH" samo na radku)
   a DETAIL tlacitka v radku karet nebyla v jedne lince. Markup: .p-bottom > ANONYMNI flex div
   > [.prices, .p-tools(btn), pripadne p.p-desc]. Reseni: prices basis 0 (roste do zbytku vedle
   tlacitka, nowrap radky se vejdou; basis auto z nowrap obsahu tlacilo btn na 2. radek!),
   jednotna min-vyska 70px (3 radky, obsah kotveny nahoru => hlavni ceny v jedne lince napric
   kartami) + btn na flex-end radku => DETAIL u vsech karet stejne. Desktop-only; ≤991 ma
   vlastni stack (r.495+).
   Scope jen .products-block (ne B2B .products-inline!). */
@media (min-width:992px){
  .products-block .product .p-bottom > div{ align-items:flex-end !important; }
  .products-block .product .p-bottom .prices{ flex:1 1 0% !important; min-width:0 !important; min-height:70px !important; }
  .products-block .product .p-bottom .p-tools{ flex:0 0 auto !important; }
  .products-block .product .prices .price-additional{ white-space:nowrap !important; }
}

/* =========================================================
   v53 — VARIANTA D „VZDUCH" (Robin 2026-09-01: „A/B/C neharmonické, texty malé,
   Upgates šablona vyladěnější" → změřeno: klon 14px/1.38 + 6 šedých + hlučné čipy;
   Upgates 16px/1.7, 1 tmavá + 1 tint + 1 akcent. D = typografie + hierarchie
   nadpisů + úklid šedých + tišší čipy + cenová hierarchie + detail + rytmus
   homepage. Barevnost zůstává ink monochrom, akcent řešíme až na čistém základu.)
   ========================================================= */

/* --- D1 TYPOGRAFIE: základ 15/1.55, obsahové texty 16/1.7, nadpisy = kostra --- */
body{ font-size:15px !important; line-height:1.55 !important; color:var(--ink) !important; }
.content p, .content li, .basic-description, .basic-description p, .basic-description li,
.category-perex, .category-perex p, .category-perex li,
.type-page .content-inner p, .type-page .content-inner li,
.latest-contribution-description{ font-size:16px !important; line-height:1.7 !important; }
h1, .category-title{ font-size:38px !important; font-weight:700 !important; line-height:1.15 !important; letter-spacing:-.015em !important; color:var(--ink) !important; }
.p-detail h1, .p-detail-inner-header h1{ font-size:32px !important; }
h2{ font-size:26px !important; font-weight:700 !important; line-height:1.2 !important; color:var(--ink) !important; }
h3{ font-size:20px !important; font-weight:700 !important; color:var(--ink) !important; }
/* homepage nadpisy sekcí (šablona = div.h4); pojistka: h4 uvnitř karty zpět na velikost názvu */
.type-index .h4, .type-index h4, .homepage-box .h4{ font-size:24px !important; font-weight:700 !important; color:var(--ink) !important; letter-spacing:-.01em !important; }
.type-index .product .h4, .products-block .product .h4{ font-size:19px !important; }
@media (max-width:767px){
  h1, .category-title{ font-size:28px !important; }
  .p-detail h1, .p-detail-inner-header h1{ font-size:25px !important; }
  .type-index .h4, .type-index h4, .homepage-box .h4{ font-size:21px !important; }
}

/* --- D2 ÚKLID ŠEDÝCH: vše na ink + mut (žádné #4d4d4d/#5c645c/#1f1f1f); hlavička jen desktop --- */
@media (min-width:768px){
.top-navigation-bar, .top-navigation-contacts, .top-navigation-contact, .top-navigation-bar a,
.top-navigation-contacts a, .top-navigation-bar span, .top-navigation-bar .languagesMenu *{ color:var(--mut) !important; }
}
/* aroma/podtext v kartě: tišší (mut), hierarchie název > cena > aroma */
.product .p-desc{ color:var(--mut) !important; font-size:13.5px !important; line-height:1.5 !important; }

/* --- D3 TIŠŠÍ ČIPY (barvy custom příznaků dál řídí admin — CSS jen tvar/váha) --- */
.product .flag, .p-detail-info .flag, .p-image .flag{ font-size:10.5px !important; font-weight:600 !important; padding:3px 9px !important; letter-spacing:.02em !important; }
.product .flags-extra .flag-discount .price-save, .p-image .flags-extra .flag-discount .price-save{ font-size:11px !important; font-weight:600 !important; }

/* --- D4 CENOVÁ HIERARCHIE: jedna dominantní cena, zbytek drobně a šedě --- */
.product .price.price-final{ font-size:21px !important; font-weight:700 !important; }
.product .price-additional{ font-size:12px !important; color:var(--mut) !important; }
.p-detail .p-final-price-wrapper .price-final{ font-size:34px !important; font-weight:800 !important; letter-spacing:-.02em !important; }
.p-detail .price-additional, .p-info-wrapper .price-additional{ font-size:13px !important; color:var(--mut) !important; }

/* --- D5 DETAIL: popis 75ch, související jako kompaktní řádek.
       (v64: pravidla .bx-moved-params SMAZÁNA — přesun parametrů k CTA zrušen v JS v29,
       Robin 1. 9.: parametry nativně v tabu Popis) --- */
.basic-description{ max-width:75ch !important; }
.p-detail .products-related{ display:flex !important; flex-wrap:wrap !important; gap:14px !important; }
.p-detail .products-related .product{ flex:0 0 300px !important; width:300px !important; max-width:300px !important; padding:0 !important; }

/* --- D6 HOMEPAGE RYTMUS: sekce = 1 řádek s horizontálním posunem (scroll-snap),
       šipky vkládá beerex-menu.js v27. Scope jen .products-block (B2B .products-inline
       zůstává řádkový — invariant v11/v12). --- */
html:not(:has(script[src*="_doplnky/slider/"])) .type-index .products-block:not(.products-related):not(.products-inline):not(.products-top):not(.swiper-wrapper){ display:flex !important; flex-wrap:nowrap !important; overflow-x:auto !important; scroll-snap-type:x proximity !important; gap:14px !important; margin-left:0 !important; margin-right:0 !important; padding:4px 2px 16px !important; scrollbar-width:thin !important; scrollbar-color:var(--line) transparent !important; }
/* v54: CELÉ karty v řádku (Robin 1. 9.: „slider schovává půlku karty") — šířka karty = přesný
   podíl kontejneru: 4 na ≥1200, 3 na 992–1199, 2 na 768–991. Mobil <768 má záměrně 82 %
   (kus další karty = jediná viditelná pobídka ke swipu — šipky tam nejsou). */
html:not(:has(script[src*="_doplnky/slider/"])) .type-index .products-block:not(.products-related):not(.products-inline):not(.products-top):not(.swiper-wrapper) > .product{ flex:0 0 calc((100% - 56px)/5) !important; width:auto !important; min-width:calc((100% - 56px)/5) !important; max-width:calc((100% - 56px)/5) !important; scroll-snap-align:start !important; padding:0 !important; float:none !important; }
@media (min-width:992px) and (max-width:1199px){
  html:not(:has(script[src*="_doplnky/slider/"])) .type-index .products-block:not(.products-related):not(.products-inline):not(.products-top):not(.swiper-wrapper) > .product{ flex-basis:calc((100% - 28px)/3) !important; min-width:calc((100% - 28px)/3) !important; max-width:calc((100% - 28px)/3) !important; }
}
@media (min-width:768px) and (max-width:991px){
  html:not(:has(script[src*="_doplnky/slider/"])) .type-index .products-block:not(.products-related):not(.products-inline):not(.products-top):not(.swiper-wrapper) > .product{ flex-basis:calc((100% - 14px)/2) !important; min-width:calc((100% - 14px)/2) !important; max-width:calc((100% - 14px)/2) !important; }
}
@media (max-width:767px){
  html:not(:has(script[src*="_doplnky/slider/"])) .type-index .products-block:not(.products-related):not(.products-inline):not(.products-top):not(.swiper-wrapper) > .product{ flex-basis:82% !important; min-width:82% !important; max-width:82% !important; }
}
.type-index .products-block::-webkit-scrollbar{ height:8px; }
.type-index .products-block::-webkit-scrollbar-thumb{ background:var(--line); border-radius:999px; }
.type-index .products-block::-webkit-scrollbar-track{ background:transparent; }
.bx-carousel{ position:relative !important; }
.bx-car-btn{ position:absolute; top:38%; width:42px; height:42px; border-radius:50%; border:1px solid var(--line); background:#fff; box-shadow:0 6px 18px rgba(20,24,21,.12); cursor:pointer; z-index:5; display:flex; align-items:center; justify-content:center; padding:0; transition:border-color .15s, background .15s; }
.bx-car-btn::before{ content:""; width:18px; height:18px; background:center/contain no-repeat var(--chev); }
.bx-car-btn.bx-left{ left:-8px; } .bx-car-btn.bx-left::before{ transform:rotate(180deg); }
.bx-car-btn.bx-right{ right:-8px; }
.bx-car-btn:hover{ border-color:var(--ink); background:var(--tint); }
.bx-car-btn.bx-hidden{ opacity:0; pointer-events:none; }
/* v54: prázdné hodnocení na detailu neukazovat (řádek „Neohodnoceno" pod H1 podkopává důvěru);
   :has bez podpory = graceful (řádek zůstane). Hodnocené produkty hvězdy mají dál. */
.p-detail-info .stars-wrapper:not(:has(.star:not(.star-off))){ display:none !important; }
.bx-car-btn{ transition:border-color .15s, background .15s, opacity .2s; }
@media (max-width:767px){ .bx-car-btn{ display:none !important; } }

/* =========================================================
   v61 — SCHVÁLENÁ VÁRKA A (oponentura 2026-09-01, Robin GO):
   A1 našeptávač: produkty NAD články, články max 3
   A2 CTA na detailu neaktivní, dokud nejsou zvoleny všechny varianty + zvýraznit selecty
   A3 login box ze sidebaru kategorií pryč (login v top liště zůstává)
   ========================================================= */

/* --- A1 NAŠEPTÁVAČ: DOM pořadí = články > produkty > „Zobrazit vše". Flex reorder:
   produkty (ul.search-whisperer-products) první, články za ně, trigger dole.
   Flex JEN na .active (nativní skrývání zavřeného panelu nesmíme přebít).
   Články omezeny na 3 (nth-child). Platí desktop i mobil i /en/ — pravidla míří na
   panel samotný, ne na hlavičku (lekce v59 dodržena). */
.search-whisperer.active{ display:flex !important; flex-direction:column !important; }
.search-whisperer > .search-whisperer-products{ order:1 !important; }
.search-whisperer > .search-whisperer-documents:not(.text-center){ order:2 !important; }
.search-whisperer > .search-whisperer-documents.text-center{ order:3 !important; }
.search-whisperer > .search-whisperer-documents:not(.text-center) > .search-whisperer-document:nth-child(n+4){ display:none !important; }

/* --- A2 CTA BEZ VARIANTY: Shoptet drží stav v selectech (.hidden-split-parameter;
   prázdná hodnota = „Zvolte variantu"; produkt může mít VÍC parametrů — balení + šarže,
   koupit jde až s oběma). Dokud je JAKÝKOLIV select prázdný: CTA vybledlé (zůstává
   klikací — nativní klik zvýrazní nevybraný select přes body.variant-not-chosen),
   nevybrané selecty zvýrazněné ink rámečkem. Bez :has podpory = graceful (nic).
   Bezvariantní produkty selecty nemají → nespadnou do podmínky. */
body.type-detail:has(.product-top select.hidden-split-parameter option[value=""]:checked) .product-top .add-to-cart-button{
  opacity:.45 !important; cursor:not-allowed !important;
}
body.type-detail:has(.product-top select.hidden-split-parameter option[value=""]:checked) .product-top .add-to-cart-button:hover{
  background:var(--g) !important; border-color:var(--g) !important;
}
.product-top select.hidden-split-parameter:has(option[value=""]:checked){
  border-color:var(--ink) !important;
}
/* nativní „zapomněl jsi variantu" stav po kliku — ať ladí s paletou (žádná cizí červeň navíc) */
body.variant-not-chosen .variant-list select.hidden-split-parameter:has(option[value=""]:checked){
  border-color:var(--sale) !important; box-shadow:0 0 0 3px rgba(192,57,43,.12) !important;
}

/* --- A3 LOGIN BOX V SIDEBARU PRYČ (Robin GO; přihlášení zůstává v top liště).
   Scope PŘÍSNĚ na sidebar — top-bar login popup je jiný element a nesmí zmizet. */
.sidebar .box-login{ display:none !important; }

/* =========================================================
   v62 — MIKRO-POLISH (Robin GO 1. 9.: „b1 go, b2 b, b3 ano"
   z POLISH_audit_navrhy_2026-09-01.md)
   ========================================================= */

/* --- B1 HOVERY: mrtvé/neviditelné hovery do systému (ink → grafit --gd) --- */
/* newsletter tlačítko footeru: .btn-primary MIMO .product => propadlo v32 pravidlům;
   hover byl #141815→#000 (neviditelný) a váha 400. Dorovnat na primární tier. */
.subscribe-form .btn, .custom-footer__newsletter .btn{ font-weight:700 !important; } /* v68: bez #footer — na produkci je formular mimo footer */
.subscribe-form .btn:hover, .custom-footer__newsletter .btn:hover{
  background:var(--gd) !important; border-color:var(--gd) !important; color:#fff !important;
}
/* „Zobrazit více produktů" + „Rozbalit filtr" + „Podrobnosti hodnocení": hover = změna barvy */
button.chevron-after:hover, .toggle-filters:hover, a.toggle-filters:hover,
button.btn--link:hover, .btn--link:hover{ color:var(--gd) !important; }

/* --- B2b IKONY: sjednocení na náš stroke styl (rozsah „b") --- */
/* ① HERO šipky banneru: byly celovýškové pásy s bílým font glyphem — dva styly šipek
   na jedné stránce vedle bx-car-btn. Nyní stejný kruhový tvar; nativní opacity mechaniku
   (objevení na hover carouselu) NEpřebíjíme. Desktop-only, mobil nativní.
   v101 (5. 9.): scope body:not(.mobile) — Shoptet na telefonu NALEZATO (>=768 px, body.mobile) kreslil
   nativní mobilní šipku a náš kruh přes sebe; na mobilním UA teď zůstávají nativní šipky v každé šířce. */
@media (min-width:768px){
  body:not(.mobile) .wide-carousel .carousel-control{ top:50% !important; bottom:auto !important; transform:translateY(-50%) !important;
    width:46px !important; height:46px !important; border-radius:50% !important; background:#fff !important;
    border:1px solid var(--line) !important; box-shadow:0 6px 18px rgba(20,24,21,.12) !important;
    display:flex !important; align-items:center !important; justify-content:center !important;
    text-shadow:none !important; }
  body:not(.mobile) .wide-carousel .carousel-control.left{ left:18px !important; }
  body:not(.mobile) .wide-carousel .carousel-control.right{ right:18px !important; }
  /* v62b: glyph pseudo si šablona pozicuje ABSOLUTNĚ k vnitřní hraně (flex centrování na
     rodiči ho nechytá) => centrovat natvrdo absolute + translate. */
  body:not(.mobile) .wide-carousel .carousel-control::before{ content:"" !important; font-family:var(--h) !important; font-size:0 !important;
    width:18px !important; height:18px !important; margin:0 !important; display:block !important;
    position:absolute !important; top:50% !important; left:50% !important; right:auto !important; bottom:auto !important;
    transform:translate(-50%,-50%) !important;
    background:center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23141815' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 6 15 12 9 18'/%3E%3C/svg%3E") !important; }
  body:not(.mobile) .wide-carousel .carousel-control.left::before{ transform:translate(-50%,-50%) rotate(180deg) !important; }
  body:not(.mobile) .wide-carousel .carousel-control:hover{ border-color:var(--ink) !important; background:var(--tint) !important; }
}
/* ② chevron „>" UVNITŘ CTA košíku pryč (čistší tlačítko; NB/Upgates styl) — detail i výpis */
.add-to-cart-button::before, .btn-cart::before, .btn-conversion::before{ content:none !important; margin:0 !important; }
/* ③ breadcrumb domek: font glyph → stroke SVG (barva --mut jako zbytek breadcrumbu) */
.breadcrumbs::before{ content:"" !important; font-family:var(--h) !important; font-size:0 !important;
  width:17px !important; height:17px !important; top:50% !important; margin-top:-8.5px !important;
  background:center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235f6361' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10.5 12 3l9 7.5'/%3E%3Cpath d='M5 9.5V21h14V9.5'/%3E%3C/svg%3E") !important; }
/* ④ TISK / ZEPTAT SE / SDÍLET: font glyphy → stroke SVG (20px, ink) */
.link-icon.print::before, .link-icon.chat::before, .link-icon.share::before, .link-icon.watchdog::before{
  content:"" !important; font-family:var(--h) !important; font-size:0 !important;
  width:20px !important; height:20px !important; margin:0 auto 6px !important; display:block !important;
  background:center/contain no-repeat !important; }
.link-icon.print::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23141815' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9V3h12v6'/%3E%3Cpath d='M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2'/%3E%3Crect x='6' y='14' width='12' height='7'/%3E%3C/svg%3E") !important; }
.link-icon.chat::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23141815' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 11.5a8.4 8.4 0 0 1-8.5 8.3 8.9 8.9 0 0 1-3.2-.6L3 21l1.8-5.3a8 8 0 0 1-.8-3.7A8.4 8.4 0 0 1 12.5 3.2 8.4 8.4 0 0 1 21 11.5z'/%3E%3C/svg%3E") !important; }
.link-icon.share::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23141815' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='18' cy='5' r='2.6'/%3E%3Ccircle cx='6' cy='12' r='2.6'/%3E%3Ccircle cx='18' cy='19' r='2.6'/%3E%3Cpath d='m8.3 10.8 7.4-4.2M8.3 13.2l7.4 4.2'/%3E%3C/svg%3E") !important; }
/* v66: Hlidaci pes (zapnut na klonu 2. 9., produkce ho ma) — stejny stroke styl jako ostatni ikony (zvonek) */
.link-icon.watchdog::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23141815' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9'/%3E%3Cpath d='M10.3 21a1.9 1.9 0 0 0 3.4 0'/%3E%3C/svg%3E") !important; }

/* --- B3 LEVÉ MENU --- */
/* ① „Vše z kategorie X →" ztišit (křičelo víc než kategorie samotné) — přebíjí pravidlo v ≥768 bloku */
@media (min-width:768px){
  .box-categories li.bx-show-all > a{ font-weight:500 !important; color:var(--mut) !important; }
  .box-categories li.bx-show-all > a:hover{ color:var(--gd) !important; }
}
/* ② rozbalovací +/− (cat-trigger): PONECHÁN NATIVNÍ (v62b oprava — 22px box lezl na text
   a kategorie BEZ dětí mají nativně neviditelný statický trigger, kterému zvětšení udělalo
   box za slovem). Zvětšování je navíc zbytečné: trigger NENÍ přepínač, klik naviguje jako
   celý řádek (rozbalení je server-side). Jen posun k novému 40px odsazení: */
.box-categories .categories ul .cat-trigger{ left:20px !important; }
/* ③ odsazení 2. úrovně 50→40 px (dlouhé názvy se méně lámou); top-level 30 px zůstává;
   3. úroveň (Cryo Hop…) drží schodek +16 px */
.box-categories .categories ul a{ padding-left:40px !important; }
.box-categories .categories ul ul a{ padding-left:56px !important; }

/* =========================================================
   v65 — REVIZE KÓDU PŘED DEPLOYEM (2026-09-02, REVIZE_kod_pred_deployem_2026-09-02.md)
   ① scope homepage karuselů (D6) srovnán s JS: + :not(.products-inline):not(.products-top)
      (B2B ověřeno na klonu: sekce jsou products-inline BEZ products-block => žádná změna
      renderu, jen jeden scope pro CSS i JS) ② tečka dostupnosti currentColor (byla natvrdo
      černá u zeleného/šedého textu) ③ jediná hranice max-width:768 → 767 (ostatních 9 bloků)
      ④ smazána pravidla přebitá variantou D: .product .flag velikost/váha/padding,
      .price-final 24/800, .price-additional 11px, mobilní price-final 22px.
   Render-identické kromě ②. Žádná nová pravidla.
   ========================================================= */

/* =========================================================
   v66 — JEDEN HOVER-JAZYK + JEDNA SEDA (Robin 2. 9. „všechno" na AUDIT_stavy_interakci_2026-09-02.md)
   Pravidlo (memory redesignu, hlida audit/state_audit.py):
     1 navigacni text (top menu, razeni, taby, breadcrumb) = barva --gd + podtrzitko
     2 polozka seznamu/panelu (strom, dropdown, naseptavac) = podklad --tint, BEZ podtrzeni; aktivni = tint+700; aktivni+hover = text --gd
     3 tlacitka = 3 tiery (primarni ink-fill -> --gd, sekundarni outline -> invert, ticha line -> tint)
   Zmeny: tokeny --soft/--tint (B) · strom hover/aktivni+hover/Vse z kategorie/filtr (A, vyse u zdroje) ·
   footer + razeni --current (C, vyse) · nize: modal Odeslat + Tisk/Sdilet pryc (D).
   ========================================================= */
/* C: 'Odeslat' v Zeptat se (colorbox .content-modal) = .btn-primary MIMO .product => propadal sablone:
   hover #141815->#000 (neviditelny), vaha 400. Dorovnat na primarni tier (stejna lekce jako B1 newsletter). */
.content-modal .btn-primary, #cboxContent .btn-primary{ font-weight:700 !important; }
.content-modal .btn-primary:hover, #cboxContent .btn-primary:hover{ background:var(--gd) !important; border-color:var(--gd) !important; color:#fff !important; }
/* D: Tisk + Sdilet na detailu pryc (Robin 2. 9.: B2B suroviny nikdo netiskne/nesdili; admin prepinac pro Tisk neexistuje,
   Sdilet je jen FB 'Sdileci tlacitko'). Zeptat se + Hlidaci pes zustavaji (pes = admin Zobrazeni zbozi, option.watchdog). */
.link-icon.print, .link-icon.share{ display:none !important; }
/* ikonove odkazy detailu (Zeptat se, Hlidat) = navigacni text => hover barva --gd (state_audit: mely nulovy hover) */
.link-icon:hover, .link-icon:hover span{ color:var(--gd) !important; }

/* =========================================================
   v67 — SWEEP KLONU (SWEEP_klon_2026-09-02.md, Robin 2. 9. „go A+B")
   A = jasne chyby, B = schvalena doporuceni. B8 (staticke) NEDELANO: 800px sloupec je vycentrovany zamer.
   ========================================================= */
/* A1: ceny byly v Roboto (sablona: .price-additional/.price-measure/.price-final-holder/.parameter-dependent/.nowrap) — 50x na homepage */
.prices, .prices *, .p-final-price-wrapper, .p-final-price-wrapper *, .price-additional, .price-measure, .price-final-holder, .parameter-dependent, .price-final-holder .nowrap, .p-info-wrapper .nowrap{ font-family:var(--h) !important; }
/* A2: footer — sablonovy .banner min-height:220 => ~200px mrtveho mista pod VISA/MC (mobil), zbytecna vyska i na desktopu */
.custom-footer__banner1 .banner{ min-height:0 !important; height:auto !important; }
/* A3: perex kategorie pod vypisem mel 135 znaku/radek — stejny limit jako popis detailu */
.type-category .category-perex{ max-width:75ch !important; }
/* A5: 'Prihlaseni' v top-baru #767676 na --soft = 4,0:1 (pod AA) — D2 chytal jen <a>, tohle je button */
@media (min-width:768px){
  .top-navigation-bar button, .top-navigation-bar .btn, .top-navigation-bar [class*="login"]{ color:var(--mut) !important; }
}
/* A6: strankovani — aktivni stranka 16px vs odkazy 14px */
.pagination__link, .pagination .pagination__currentPage, .pagination a, .pagination span{ font-size:14px !important; }
/* B1: clanky — titulky a.title byly 24px/300 (sablona) mimo system nadpisu; 80px mezery mezi clanky */
.news-item a.title{ font-weight:600 !important; }
.news-item{ margin-bottom:48px !important; }
/* B4: filtr — hodnoty s 0 polozkami (Novinka 0, Tip 0) skryt; :has skryje i obalovy div, fallback label */
.filter-sections label.filter-label.disabled, .param-filter-top label.filter-label.disabled{ display:none !important; }
.filter-sections div:has(> label.filter-label.disabled){ display:none !important; }
/* B5: homepage — 'Posledni komentare' (5) vs 'Posledni hodnoceni' (3) => 650px prazdno; komentare max 3 */
.latest-contribution-discussion > a.latest-contribution-inner:nth-of-type(n+4){ display:none !important; }
/* B6: prazdny kosik — odrazky kategorii => pilulky; nadpis 'POTREBUJETE POMOC?' (h2.h4 uppercase) do systemu jako h3 */
.cart-empty .empty-cart-boxes ul{ display:flex !important; flex-wrap:wrap !important; gap:8px !important; list-style:none !important; padding:0 !important; margin:0 0 8px !important; }
.cart-empty .empty-cart-boxes ul li{ margin:0 !important; padding:0 !important; }
.cart-empty .empty-cart-boxes ul li a{ display:inline-flex !important; align-items:center !important; padding:8px 14px !important; border:1px solid var(--line) !important; border-radius:999px !important; background:#fff !important; color:var(--ink) !important; font-weight:600 !important; font-size:13.5px !important; text-decoration:none !important; transition:background .15s, border-color .15s !important; }
.cart-empty .empty-cart-boxes ul li a:hover{ background:var(--tint) !important; border-color:var(--mut) !important; color:var(--gd) !important; }
.cart-empty .h4, .cart-empty h2.h4{ text-transform:none !important; font-size:20px !important; font-weight:700 !important; letter-spacing:0 !important; }
/* B7: registrace/login — formular 440px v leve pulce, prava prazdna => vycentrovana karta */
@media (min-width:768px){
  body.in-registrace #content > .content-inner, body.in-login #content > .content-inner{ max-width:600px !important; margin:0 auto !important; padding:32px 36px !important; border:1px solid var(--line) !important; border-radius:16px !important; box-sizing:border-box !important; }
  body.in-registrace #register-form, body.in-login #formLogin{ width:100% !important; max-width:none !important; }
}

/* =========================================================
   v68 — INVENTURA DOPLNKU PRODUKCE vs. KLON (2. 9. vecer, INVENTURA_doplnky_2026-09-02.md)
   Produkce ma DKlab Sliderplus Home (swiper) na homepage sekcich: .products-block ... .swiper-wrapper.
   Nas D6 karusel (flex + overflow-x) + JS v30 se zapina JEN kde DKlab NENI: html:not(:has(script[src*="_doplnky/slider/"]))
   (skript je v HTML od zacatku — trida .swiper-wrapper naskakuje az po inicializaci doplnku, tj. pozde) + :not(.swiper-wrapper)
   => na klonu beze zmeny, na produkci zadna kolize; po vypnuti doplnku naskoci nas karusel sam.
   Sablona main-11 je na produkci i klonu identicka (stejny build hash) — selektory sedi (health --base 0).
   ========================================================= */

/* =========================================================
   v69 — CLANEK: 'Predchozi / Dalsi clanek' (Robin 2. 9.: bez hoveru). Markup: .news-item-detail .next-prev a.btn
   = HOLY .btn bez tieru (transparent, ink 1px, vaha 400) => hover propadal sablone (#141815->#000, neviditelny).
   Sekundarni tier jako DETAIL (ink outline 700, hover = invert). Pridano do state_audit ITEMS.
   ========================================================= */
.news-item-detail .next-prev .btn{ background:#fff !important; border:1.5px solid var(--g) !important; color:var(--g) !important; font-weight:700 !important; padding:10px 20px !important; margin:0 6px !important; }
.news-item-detail .next-prev .btn:hover{ background:var(--ink) !important; border-color:var(--ink) !important; color:#fff !important; }

/* =========================================================
   v70 — HOMEPAGE PROTOTYP (Robin 2. 9.: ukaz na klonu; RESEARCH_konverzni_homepage_2026-09-02.md H1/H5)
   1) Uvitaci text (nativni blok, renderuje se AZ POD produkty) nahoru za hero cistym CSS order,
      scope body.type-index; footer/odber/loga zustavaji dole. 2) dlazdice kategorii (.bx-tiles) ve stylu
      pilulek podkategorii. 3) "Zobrazit vse z X" pod sekci (vklada JS v31 jen kde cilova stranka existuje).
   ========================================================= */
.type-index .overall-wrapper{ display:flex !important; flex-direction:column !important; }
/* flex polozky: min-width:auto by nechalo kontejner produktu vyrust na sirku nowrap karuselu (mobil 1669px => overflow) */
.type-index .overall-wrapper > *{ min-width:0 !important; max-width:100% !important; }
.type-index .overall-wrapper > .welcome-wrapper{ order:3 !important; }
/* v73: po JS presunu (v33) je blok uvnitr main.content.wide (mobil) => pas na plnou sirku pres zaporne okraje kontejneru */
.type-index main.content .welcome-wrapper{ width:100vw !important; max-width:100vw !important; margin:0 0 8px calc(50% - 50vw) !important; }
.type-index main.content .welcome-wrapper .welcome{ padding:0 20px !important; }
.type-index .overall-wrapper > .content-wrapper.container:not(.before-carousel){ order:4 !important; }
.type-index .overall-wrapper > .latest-contribution-box{ order:5 !important; }
.type-index .overall-wrapper > .loga-position-paticka{ order:7 !important; }
.type-index .overall-wrapper > .odber{ order:8 !important; }
.type-index .overall-wrapper > footer, .type-index .overall-wrapper > #footer{ order:9 !important; }
.type-index .welcome-wrapper .welcome{ padding:0 !important; }
/* v74 (Robin 2. 9.: bordel s kostkama pod hero) - dva sede pasy nad sebou + bile krabicky v sedem = vrstveni.
   Blok na BILE, kazda dlazdice = JEDEN tvar: tlumeny podklad podle suroviny (salvej / slad / krem / ocel),
   foto multiply do podkladu, text uvnitr dole. Zadne ramecky, zadny stin v klidu.
   v75 (Robin: barevne tony + odznaky = vizualni bordel) => vsechny dlazdice JEDEN neutralni podklad --soft, zadne tony, zadne ikony. */
.type-index .welcome-wrapper, .type-index .welcome-wrapper.homepage-box{ background:#fff !important; border:0 !important; margin:0 !important; padding:0 !important; }
.type-index .welcome-wrapper .welcome > div{ max-width:none !important; width:auto !important; margin:0 !important; }
.bx-welcome{ max-width:none !important; margin:0; padding:44px 0 12px; }
.bx-welcome > *, .bx-welcome-head{ max-width:none !important; width:auto !important; margin-left:0 !important; margin-right:0 !important; }
.bx-welcome-head{ display:flex; align-items:baseline; justify-content:flex-start; gap:18px; flex-wrap:wrap; margin-bottom:20px; text-align:left; }
.type-index .welcome-wrapper .welcome, .type-index .welcome-wrapper .welcome > div{ text-align:left !important; }
.bx-eyebrow{ font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--mut); }
.bx-welcome h1{ font-size:28px !important; line-height:1.15 !important; margin:0 !important; letter-spacing:-.015em !important; }
.bx-tiles{ display:grid !important; grid-template-columns:repeat(4,1fr) !important; gap:16px !important; list-style:none !important; padding:0 !important; margin:0 !important; }
.bx-tiles li{ margin:0 !important; padding:0 !important; }
.bx-tiles a{ display:flex !important; flex-direction:column !important; height:300px; padding:0 !important; border:0 !important; border-radius:18px !important; overflow:hidden !important; background:var(--soft) !important; color:var(--ink) !important; text-decoration:none !important; box-shadow:none !important; transition:transform .25s, box-shadow .25s !important; }




.bx-tiles a:hover{ transform:translateY(-4px); box-shadow:0 28px 48px -30px rgba(20,24,21,.28); color:var(--ink) !important; }
.bx-tiles .bx-tile-img{ display:flex !important; flex:1 1 auto; align-items:center; justify-content:center; padding:26px 26px 6px; background:transparent !important; min-height:0; }
.bx-tiles .bx-tile-img img{ max-height:100% !important; max-width:100% !important; width:auto !important; height:auto !important; object-fit:contain; mix-blend-mode:multiply; transition:transform .35s; }
.bx-tiles a:hover .bx-tile-img img{ transform:scale(1.04); }
.bx-tiles .bx-tile-txt{ display:grid !important; grid-template-columns:1fr auto; grid-template-rows:auto auto; column-gap:12px; align-items:center; padding:12px 20px 20px; text-align:left; }
.bx-tiles .bx-tile-lb{ display:block !important; grid-column:1; grid-row:1; font-weight:700 !important; font-size:19px !important; letter-spacing:-.01em; line-height:1.2; }
.bx-tiles .bx-tile-sub{ display:block !important; grid-column:1; grid-row:2; font-size:13px; color:var(--mut); margin-top:3px; }
.bx-tiles .bx-tile-txt::after{ content:''; grid-column:2; grid-row:1 / 3; width:38px; height:38px; border-radius:50%; background-color:#fff; background-image:var(--chev); background-repeat:no-repeat; background-position:center; background-size:16px 16px; transition:background-color .15s, transform .25s; }
.bx-tiles a:hover .bx-tile-txt::after{ background-color:var(--g); background-image:var(--chev-w); transform:translateX(3px); }
@media (max-width:991px){ .bx-tiles{ gap:12px !important; } .bx-tiles a{ height:230px; } .bx-tiles .bx-tile-lb{ font-size:17px !important; } }
@media (max-width:767px){ .bx-welcome{ padding:22px 0 8px; } .bx-welcome-head{ margin-bottom:14px; gap:6px; } .bx-welcome h1{ font-size:22px !important; } .bx-tiles{ grid-template-columns:repeat(2,1fr) !important; gap:10px !important; } .bx-tiles a{ height:180px; border-radius:14px !important; } .bx-tiles .bx-tile-img{ padding:14px 14px 4px; } .bx-tiles .bx-tile-txt{ padding:6px 14px 14px; } .bx-tiles .bx-tile-lb{ font-size:15px !important; } .bx-tiles .bx-tile-sub{ display:none !important; } .bx-tiles .bx-tile-txt::after{ width:30px; height:30px; font-size:15px; } }
/* HLAVICKY SEKCI: titulek VLEVO v lince s kartami + Zobrazit vse VPRAVO (JS v32 vklada odkaz do hlavicky) - jeden vzor pro vsechny sekce */
.type-index .homepage-box .h4, .type-index div.h4{ display:flex !important; align-items:baseline !important; justify-content:space-between !important; gap:16px !important; text-align:left !important; margin:34px 0 14px !important; }
.type-index .h4 .bx-head-all{ font-size:14px !important; font-weight:600 !important; color:var(--mut) !important; text-decoration:none !important; white-space:nowrap; letter-spacing:0 !important; }
.type-index .h4 .bx-head-all:hover{ color:var(--gd) !important; }
/* "Zobrazit vse z X" pod sekci (JS v31) — tichy tier, hover tint (idiom tlacitko) */
.bx-section-all{ display:flex !important; justify-content:center !important; margin:2px 0 26px !important; }
.bx-section-all a{ display:inline-flex !important; align-items:center !important; gap:6px !important; padding:9px 16px !important; border:1px solid var(--line) !important; border-radius:12px !important; color:var(--ink) !important; font-weight:600 !important; font-size:14px !important; text-decoration:none !important; background:#fff !important; }
.bx-section-all a:hover{ background:var(--tint) !important; border-color:var(--ink) !important; color:var(--ink) !important; }

/* =========================================================
   v76 — PLAN_homepage_menu_2026-09-03 (Robin GO): H1 "Vse, co vase pivo potrebuje.", USP radek (3 fakta z webu),
   tonovane dlazdice BEZ ikon (Robin: tony ok, ikony ne), menu 8 polozek => komprese v49 zrusena.
   ========================================================= */
.bx-usp{ display:grid !important; grid-template-columns:repeat(3,1fr) !important; gap:16px !important; list-style:none !important; padding:0 !important; margin:0 0 22px !important; }
.bx-usp li{ display:flex !important; flex-direction:column !important; gap:2px; padding:14px 18px !important; margin:0 !important; border:1px solid var(--line) !important; border-radius:12px !important; background:#fff !important; }
.bx-usp b{ font-weight:700 !important; font-size:15px !important; color:var(--ink) !important; }
.bx-usp span{ font-size:13px !important; color:var(--mut) !important; }
/* v119 (8. 9.): tóny o 5 % tmavší + sytější (Robin „zkus A“) — původní #e8efe1/#f3e8d5/#f6ede4/#e7ebee měly k bílé
   kontrast 1,16–1,21:1 a na slabších monitorech (Sabča, Alex) splývaly s bílou. Nové 1,26–1,35:1. Stejné tóny má podklad.py (bannery). */
.bx-tiles li:nth-child(1) a{ background:#dbeacd !important; }
.bx-tiles li:nth-child(2) a{ background:#f5dfb9 !important; }
.bx-tiles li:nth-child(3) a{ background:#f5e0cb !important; }
.bx-tiles li:nth-child(4) a{ background:#d6dfe5 !important; }
@media (max-width:767px){ .bx-usp{ grid-template-columns:1fr !important; gap:8px !important; margin-bottom:14px !important; } .bx-usp li{ padding:10px 14px !important; flex-direction:row !important; align-items:baseline !important; gap:8px; flex-wrap:wrap; } .bx-usp b{ font-size:14px !important; } .bx-usp span{ font-size:12px !important; } }
/* menu ma 8 polozek => normalni velikost 15px na vsech sirkach >= 768 (prebiji v49 kompresi) */
@media (min-width:768px){
  .navigation-in.menu ul.menu-level-1 > li > a{ font-size:15px !important; padding:14px 14px !important; letter-spacing:.005em !important; }
  .navigation-in.menu ul.menu-level-1 > li > a::after{ left:14px !important; right:14px !important; }
}

/* v77 (Robin 3. 9.): USP a eyebrow pryc (HTML), H1 -> hned dlazdice; odstup posledni sekce -> komentare byl maly;
   "Zobrazit vse" v hlavickach sekci zruseno (JS v36) - bylo jen u sudu = nekonzistence. */
.bx-welcome-head{ margin-bottom:18px !important; }
.type-index .overall-wrapper > .latest-contribution-box{ margin-top:56px !important; }
.type-index .latest-contribution-wrapper{ padding-top:8px !important; }

/* v78 (3. 9., vlastni nalez z iPhone screenshotu): karty v mobilnim karuselu se natahovaly na vysku nejvyssi karty
   (aroma + cipy) => 500-700 px prazdna v karte. Na mobilu karty vlastni vyska (flex-start), prazdno je mimo kartu. */
@media (max-width:767px){
  .type-index .products-block:not(.products-related):not(.products-inline):not(.products-top){ align-items:flex-start !important; }
  .type-index .products-block:not(.products-related):not(.products-inline):not(.products-top) > .product .p{ height:auto !important; }
}

/* ==========================================================================
   v81 — NATIVNI BANNEROVE TEXTY (Robin 3. 9.: "chci nativni")
   Shoptet umi u banneru typu Obrazek pole Nazev / Text / Text odkazu a sablona je
   vypisuje jako <span class="extended-banner-texts"> se tremi spany uvnitr.
   BEZ nas je sazi absolutne na nahodne souradnice (titulek 34x203, text 34x740,
   odkaz 1360x484, 15-20px, weight 400) = nepouzitelne. Prebijeme kompletne.
   PODMINKA: podklad banneru musi mit volne misto VPRAVO (desktop) / DOLE (mobil).
   Bannery bez vyplnenych textu maji na <a> tridu .extended-empty a tyhle spany vubec
   nevzniknou -> stavajicich 188 obrazkovych banneru se to netyka.
   ========================================================================== */
#carousel .item > a{ position:relative !important; display:block !important; }

/* mobil je zaklad (invariant 3: desktop layout az v min-width:768px) */
#carousel .extended-banner-texts{
  position:absolute !important; inset:0 !important; width:auto !important; height:auto !important;
  display:flex !important; flex-direction:column !important;
  justify-content:flex-end !important; align-items:center !important; text-align:center !important;
  /* v87: text a tlacitko vys pod motiv (Robin) — drive 7 %, bylo to nalepene dole */
  padding:0 6% 17% !important; pointer-events:none;   /* klikaci zustava cely slide */
}
#carousel .extended-banner-title{
  position:static !important; width:auto !important; margin:0 !important;
  background:none !important; box-shadow:none !important; border:0 !important; padding:0 !important;
  max-width:9.5em !important;   /* v em -> titulek se zalomi sam, at je font jakkoli velky */
  font-family:var(--h) !important; font-weight:800 !important; text-transform:uppercase !important;
  font-size:clamp(15px,5.6vw,30px) !important; line-height:1.06 !important;
  letter-spacing:-.02em !important; color:var(--ink) !important;
}
#carousel .extended-banner-text{
  position:static !important; width:auto !important; margin:8px 0 0 !important;
  background:none !important; box-shadow:none !important; border:0 !important; padding:0 !important;
  max-width:22em !important;
  font-size:clamp(11px,3.1vw,17px) !important; line-height:1.35 !important;
  font-weight:400 !important; color:var(--mut) !important;
}
#carousel .extended-banner-link{
  position:static !important; width:auto !important;
  display:inline-flex !important; align-items:center !important; gap:.55em !important;
  /* v86: vyssi tlacitko (Robin: bylo ploche) */
  /* v87: na mobilu bylo tlacitko male — vetsi pismo i vypln (Robin) */
  margin-top:18px !important; padding:1.05em 2em !important; border:0 !important; border-radius:12px !important;
  background:var(--ink) !important; color:#fff !important;
  font-weight:700 !important; font-size:clamp(14px,4.6vw,20px) !important; line-height:1 !important;
}
#carousel .extended-banner-link::after{
  content:'' !important; width:1.45em; height:1.15em; flex:none;
  background:center/contain no-repeat var(--chev2w);
}
@media (min-width:768px){
  #carousel .extended-banner-texts{
    /* v85: sloupec s textem sedi v PRAVE casti banneru (Robin: "text a tlacitko dat doprava"),
       vsechny tri prvky sdili jednu levou hranu.
       v86: spodni padding zvedne cely blok o kus VYS (Robin), poloha se drzi svisleho stredu. */
    /* v88: 56 % bylo moc blizko motivu (u sirokych motivu zbylo 72 px) -> 61 % */
    left:61% !important; right:0 !important; top:0 !important; bottom:0 !important;
    justify-content:center !important; align-items:flex-start !important; text-align:left !important;
    padding:0 4% 7% 0 !important;
  }
  #carousel .extended-banner-title{ font-size:clamp(22px,3.35vw,58px) !important; }
  #carousel .extended-banner-text{ font-size:clamp(12px,1.3vw,22px) !important; margin-top:12px !important; }
  #carousel .extended-banner-link{ font-size:clamp(12px,1.25vw,21px) !important; margin-top:26px !important;
                                  padding:1.2em 1.9em !important; }   /* v86: vyssi tlacitko */
}

/* ================================================================================
   v89 (4. 9. 2026, Robin GO na bod 2 z NAVRH_bannery_karty_brainmarket_2026-09-04.md)
   B1  karty 5 v rade na >=1200 (zmena calc v D6 pravidle vyse: 42px/4 -> 56px/5)
   B2  pevne sloty v karte: nazev 16px/2 radky, aroma max 2 radky, cipy jednotny odstup
   C   posuvnik pod karusely skryt na desktopu (sipky + peek staci; Windows ho kreslil jako "ruler")
   D   blog blok na homepage = NATIVNI Shoptet (rubrika -> Zobrazit clanky na domovske strance),
       sablona vklada .homepage-blog-wrapper za posledni produktovou sekci; tady jen vzhled:
       3 karty (obrazek 5:3, titul, perex 3 radky), mobil = radek obrazek 120px + text.
   ================================================================================ */
@media (min-width:1200px){
  .type-index .products-block .product .p a.name{ font-size:16px !important; line-height:1.3 !important; min-height:42px !important; }
}
.type-index .products-block .product .p .p-desc{ display:-webkit-box !important; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden !important; margin:8px 0 0 !important; }
.type-index .products-block .product .p .widget-parameter-wrapper{ margin-top:auto !important; padding-top:10px !important; }
.type-index .products-block .product .p .widget-parameter-list{ margin:0 !important; }
@media (min-width:768px){
  html:not(:has(script[src*="_doplnky/slider/"])) .type-index .products-block:not(.products-related):not(.products-inline):not(.products-top):not(.swiper-wrapper){ scrollbar-width:none !important; }
  .type-index .products-block::-webkit-scrollbar{ display:none !important; height:0 !important; }
}
.type-index .homepage-blog-wrapper{ display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:14px !important; margin:56px 0 0 !important; padding:0 !important; width:auto !important; }
.type-index .homepage-blog-wrapper .homepage-group-title{ grid-column:1 / -1 !important; margin:0 0 6px !important; padding:0 !important; text-align:left !important; flex:none !important; }
.type-index .homepage-blog-wrapper .news-item{ display:block !important; width:auto !important; flex:none !important; margin:0 !important; padding:0 !important; border:0 !important; }
.type-index .homepage-blog-wrapper .news-item > a{ display:block !important; text-decoration:none !important; color:var(--ink) !important; }
.type-index .homepage-blog-wrapper .news-item .image{ width:auto !important; margin:0 0 12px !important; float:none !important; text-align:left !important; }
.type-index .homepage-blog-wrapper .news-item .image img{ display:block !important; width:100% !important; height:auto !important; aspect-ratio:5 / 3; object-fit:cover; border-radius:12px !important; }
.type-index .homepage-blog-wrapper .news-item .text{ padding:0 !important; }
.type-index .homepage-blog-wrapper .news-item .title{ display:block !important; font-family:var(--h) !important; font-size:18px !important; font-weight:600 !important; line-height:1.3 !important; color:var(--ink) !important; margin:0 0 6px !important; transition:color .15s; }
.type-index .homepage-blog-wrapper .news-item > a:hover .title{ color:var(--gd) !important; text-decoration:underline !important; text-underline-offset:3px; }
.type-index .homepage-blog-wrapper .news-item .description{ font-size:14px !important; line-height:1.6 !important; color:var(--mut) !important; display:-webkit-box !important; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden !important; margin:0 !important; }
.type-index .homepage-blog-wrapper .news-item .read-article{ display:none !important; }
@media (max-width:767px){
  .type-index .homepage-blog-wrapper{ grid-template-columns:1fr !important; gap:16px !important; margin-top:40px !important; }
  .type-index .homepage-blog-wrapper .news-item > a{ display:grid !important; grid-template-columns:120px minmax(0,1fr) !important; gap:12px !important; align-items:start !important; }
  .type-index .homepage-blog-wrapper .news-item .image{ margin:0 !important; }
  .type-index .homepage-blog-wrapper .news-item .title{ font-size:16px !important; }
  .type-index .homepage-blog-wrapper .news-item .description{ -webkit-line-clamp:2; font-size:13.5px !important; }
}

/* ================================================================================
   v90 (4. 9. 2026 vecer, Robin z telefonu: "komentare a hodnoceni zmensit, swipe neni stabilni -> tlacitka")
   A  mobil: karusel = sipky VIDITELNE (38px kruhy u fotky, uvnitr drahy), scroll-snap MANDATORY
      (kazdy tah skonci na cele karte), overscroll-x contain (zadny odraz stranky). Krok sipky = 1 karta (JS v39).
      Prebiji v64 pravidlo `@media(max-width:767px){ .bx-car-btn{display:none} }` (pozdeji v souboru = vyhrava).
   B  mobil: Posledni komentare / hodnoceni kompaktni — nadpis 20px, avatar/foto 40px, nazev produktu 15px,
      meta 12px, text 14px max 3 radky, mensi rozestupy. Desktop beze zmeny.
   ================================================================================ */
@media (max-width:767px){
  html:not(:has(script[src*="_doplnky/slider/"])) .type-index .products-block:not(.products-related):not(.products-inline):not(.products-top):not(.swiper-wrapper){ scroll-snap-type:x mandatory !important; overscroll-behavior-x:contain !important; scroll-padding-left:2px !important; }
  .bx-car-btn{ display:flex !important; width:38px !important; height:38px !important; top:104px !important; }
  .bx-car-btn.bx-left{ left:6px !important; } .bx-car-btn.bx-right{ right:6px !important; }
  .bx-car-btn::before{ width:16px; height:16px; }
  .type-index .overall-wrapper > .latest-contribution-box{ margin-top:36px !important; }
  .latest-contribution-box h2{ font-size:20px !important; line-height:1.25 !important; margin-bottom:12px !important; }
  .latest-contribution-inner{ display:flex !important; gap:10px !important; padding:8px 0 !important; margin:0 !important; }
  .latest-contribution-image{ flex:0 0 40px !important; width:40px !important; }
  .latest-contribution-image img, .latest-contribution-image .vote-initials{ width:40px !important; height:40px !important; line-height:40px !important; font-size:13px !important; }
  .latest-contribution-content{ min-width:0 !important; }
  h4.latest-contribution-product, .latest-contribution-product{ font-size:15px !important; line-height:1.3 !important; margin:0 0 2px !important; font-weight:600 !important; }
  .latest-contribution-info{ font-size:12px !important; line-height:1.4 !important; margin-bottom:4px !important; }
  /* v91: hvezdicky nechat nativne (inline-block je stavel pod sebe) */
  .latest-contribution-description{ font-size:14px !important; line-height:1.5 !important; display:-webkit-box !important; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden !important; }
  .latest-contribution-discussion{ margin-bottom:20px !important; }
}

/* ================================================================================
   v92 (4. 9. 2026 noc, Robin z telefonu): (1) sipky karuselu na mobilu SVISLE NA STRED karty
   (top:50% + translateY, ne pevnych 104px); (2) ikona kosiku v mobilni hlavicce = stejny SVG vozik
   jako na desktopu (nativne shoptet font glyph U+E921). Meni se JEN pseudo-element ::before ikony,
   ne struktura mobilni hlavicky (lekce v59). Lupa a burger zustavaji nativni.
   ================================================================================ */
@media (max-width:767px){
  .bx-car-btn{ top:50% !important; transform:translateY(-50%) !important; }
  .navigation-buttons a.cart-count::before, .navigation-buttons a.btn-icon.cart-count::before{
    content:"" !important; font-size:0 !important; line-height:0 !important; display:inline-block !important; width:26px !important; height:26px !important; vertical-align:middle !important;
    background:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23141815' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'><circle cx='9' cy='20' r='1.4'/><circle cx='18' cy='20' r='1.4'/><path d='M2 3h3l2.4 12a1.8 1.8 0 0 0 1.8 1.45h8.1a1.8 1.8 0 0 0 1.78-1.5L22 7H6.2'/></svg>") no-repeat center/contain !important;
  }
}

/* ================================================================================
   v93 (4. 9. 2026, Robin GO "texty jo i stranky"): SERVISNI STRANKA .bx-service
   (Vykup keg sudu, Servis keg sudu, CZ+EN). Markup: _prototypes/stranky/ (vykup, servis, -en).
   Jazyk = dlazdice homepage (ton ocel #e7ebee, radius 16, bez ramecku), tlacitka = nase tiery.
   ================================================================================ */
.bx-service{ font-family:var(--h); }
.bx-service .bx-lead{ font-size:18px !important; line-height:1.55 !important; color:var(--ink) !important; max-width:62ch; margin:0 0 28px !important; }
.bx-service h2{ font-size:24px !important; font-weight:700 !important; letter-spacing:-.01em !important; color:var(--ink) !important; margin:40px 0 14px !important; }
.bx-service h3{ font-size:17px !important; font-weight:600 !important; color:var(--ink) !important; margin:22px 0 6px !important; }
.bx-service p, .bx-service li{ font-size:16px !important; line-height:1.7 !important; color:var(--ink) !important; max-width:75ch; }
.bx-service ul.bx-benefits{ list-style:none !important; padding:0 !important; margin:0 0 14px !important; display:grid !important; grid-template-columns:repeat(4,minmax(0,1fr)) !important; gap:12px !important; max-width:none !important; }
.bx-service ul.bx-benefits li{ background:#d6dfe5 !important; /* v119 */ border-radius:16px !important; padding:18px 18px 16px !important; margin:0 !important; max-width:none !important; }
.bx-service ul.bx-benefits h3{ margin:0 0 6px !important; font-size:16px !important; }
.bx-service ul.bx-benefits p{ margin:0 !important; font-size:14px !important; line-height:1.5 !important; color:var(--mut) !important; }
.bx-service .bx-trust{ font-size:14px !important; color:var(--mut) !important; margin:0 0 8px !important; }
.bx-service ol.bx-steps{ list-style:none !important; padding:0 !important; margin:0 !important; counter-reset:bx; display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:14px !important; max-width:none !important; }
.bx-service ol.bx-steps li{ counter-increment:bx; position:relative; padding:0 0 0 46px !important; margin:0 !important; max-width:none !important; font-size:15px !important; line-height:1.55 !important; }
.bx-service ol.bx-steps li::before{ content:counter(bx); position:absolute; left:0; top:0; width:32px; height:32px; border-radius:50%; background:var(--ink); color:#fff; font-weight:700; font-size:15px; display:flex; align-items:center; justify-content:center; }
.bx-service ol.bx-steps li strong{ display:block; font-weight:700; margin-bottom:2px; }
.bx-service .bx-cta{ background:var(--soft) !important; border-radius:16px !important; padding:28px 28px 24px !important; margin:40px 0 20px !important; }
.bx-service .bx-cta h2{ margin:0 0 6px !important; }
.bx-service .bx-cta p{ margin:0 0 14px !important; }
.bx-service .bx-cta-btns{ display:flex !important; flex-wrap:wrap; align-items:center; gap:10px 22px !important; margin:0 !important; }
.bx-service .bx-cta-btns .btn{ margin:0 !important; }
.bx-service .bx-cta-link{ color:var(--ink) !important; font-weight:600 !important; text-decoration:underline !important; text-underline-offset:3px; }
.bx-service .bx-cta-link:hover{ color:var(--gd) !important; }
.bx-service .bx-links{ font-size:14px !important; color:var(--mut) !important; margin:0 !important; }
.bx-service .bx-links a{ color:var(--ink) !important; font-weight:600 !important; }
@media (max-width:767px){
  .bx-service ul.bx-benefits{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:10px !important; }
  .bx-service ul.bx-benefits li{ padding:14px !important; }
  .bx-service ol.bx-steps{ grid-template-columns:1fr !important; }
  .bx-service .bx-cta{ padding:20px 18px !important; }
  .bx-service .bx-lead{ font-size:17px !important; }
}

/* ================================================================================
   v94 (4. 9. 2026, Robin: "odstranit podtrzeni u odkazu, jak resime odkaz u nas aby to bylo jedine")
   JEDEN JAZYK TEXTOVYCH ODKAZU v obsahu = stejny jako navigace (invariant 13):
   klid = ink, vaha 600, BEZ podtrzeni; hover = --gd + podtrzeni. Plati pro obsahove bloky
   (servisni stranky, clanky, staticke stranky, perex kategorie). Tlacitka (.btn*) vynechana.
   Dosud: sablona/Navrhar dava obsahovym odkazum zelenou + podtrzeni; .bx-cta-link mel podtrzeni v klidu.
   ================================================================================ */
.bx-service a:not([class*="btn"]):not([style]), .news-item-detail a:not([class*="btn"]):not([style]), article.pageArticleDetail a:not([class*="btn"]):not([style]), .category-perex a:not([class*="btn"]):not([style]){
  color:var(--ink) !important; font-weight:600 !important; text-decoration:none !important; transition:color .15s;
}
.bx-service a:not([class*="btn"]):not([style]):hover, .news-item-detail a:not([class*="btn"]):not([style]):hover, article.pageArticleDetail a:not([class*="btn"]):not([style]):hover, .category-perex a:not([class*="btn"]):not([style]):hover{
  color:var(--gd) !important; text-decoration:underline !important; text-underline-offset:3px;
}
.bx-service .bx-cta-link{ text-decoration:none !important; }
.bx-service .bx-cta-link:hover{ text-decoration:underline !important; }
/* v95: tlacitka v obsahu bez podtrzeni (sablona dava .content a underline); inline-stylovane odkazy (stare clanky) vynechany z v94 */
.bx-service .btn, .news-item-detail .btn, article.pageArticleDetail .btn, .bx-service .btn:hover{ text-decoration:none !important; }

/* v96 (4. 9. 2026, Robin: nativni kontaktni formular na strance): .bx-form = klon #formContact z /kontakt/ (JS v41).
   Po namontovani se tlacitko "Poptat" schova (formular je primo tady), e-mail a telefon zustavaji. */
.bx-service .bx-form{ margin:6px 0 18px !important; max-width:560px; }
.bx-service .bx-form:empty{ display:none !important; }
.bx-service .bx-form .form-group{ margin-bottom:12px !important; }
.bx-service .bx-form label{ font-size:13px !important; font-weight:600 !important; color:var(--ink) !important; margin-bottom:4px !important; display:block !important; }
.bx-service .bx-form .form-control{ width:100% !important; font-family:var(--h) !important; font-size:15px !important; background:#fff !important; }
.bx-service .bx-form textarea.form-control{ min-height:150px !important; line-height:1.5 !important; }
.bx-service .bx-form .consents p.label{ font-size:12.5px !important; color:var(--mut) !important; margin:0 !important; }
.bx-service .bx-form .consents a{ color:var(--ink) !important; font-weight:600 !important; }
.bx-service .bx-form .btn{ background:var(--g) !important; border:1.5px solid var(--g) !important; color:#fff !important; border-radius:12px !important; font-weight:700 !important; padding:11px 24px !important; }
.bx-service .bx-form .btn:hover{ background:var(--gd) !important; border-color:var(--gd) !important; }
.bx-service .bx-form .submit-wrapper{ margin:4px 0 0 !important; }
.bx-service .bx-cta-has-form .bx-cta-btns .btn{ display:none !important; }
.bx-service .bx-cta-has-form .bx-cta-btns{ margin-top:6px !important; }

/* v98 (4. 9. 2026 vecer, Robin: "registrace: tlacitko nalepene na footer, mozna i jinde; jsou vsude nase fonty?")
   A  odstup obsahu od paticky: registrace 12-45 px, kategorie NAHORU 30 px -> jednotny spodni odstup #content
      mimo homepage (ta ma vlastni rytmus): desktop 64 px, mobil 40 px.
   B  posledni Roboto/Arial: h4 v komentarich/hodnoceni a nadpis vysledku hledani (sablona dava h4 Roboto),
      inicialy avataru (Arial) -> Hanken. Font ikon 'shoptet' zustava (ikony). */
body:not(.type-index) #content{ padding-bottom:64px !important; }
@media (max-width:767px){ body:not(.type-index) #content{ padding-bottom:40px !important; } }
.latest-contribution-product, h4.latest-contribution-product, .search-products-heading, h4.search-products-heading, .vote-initials, h4.sr-only{ font-family:var(--h) !important; }

/* ================================================================================
   v99 (5. 9. 2026, HANDOFF_redesign_2026-09-04 bod D3 - clanky; Robin: "ano")
   A  VYPIS /nase-novinky/ + /en/blog/ (body.type-posts-listing): dosud 800px sloupec, obrazek vlevo
      + text vpravo, 48px mezery. Ted stejny jazyk jako blog blok na homepage (v89 D):
      mrizka 3 karet (obrazek 5:3 cover, titul 18/600, datum --mut, perex 3 radky), mobil radek 120px + text.
      Sablona omezuje .content-inner na 800px -> uvolneno jen na vypisu (detail zustava 800 = citelna sirka).
      Pozn.: markup vypisu je .image > a + .text > a.title (2 odkazy), homepage ma .news-item > a (1 odkaz),
      proto vlastni blok; hodnoty (radius, fonty, clampy) drzet shodne s v89.
   B  DETAIL (body.type-post): hlavni obrazek clanku nad textem = <figure class="bx-article-hero"> vklada
      JS v43 (mountArticleImage) z meta[itemprop=url]; jen kdyz v tele zadny <img> neni (Amplifire, Rhapzody,
      EN Oats maji vlastni). Bez orezu na pomer (bannery 5:3 i 1042x330), strop vysky 480px.
   C  TLACITKA V TIERU v tele clanku: .btn-conversion = primarni (global), .btn-primary = outline (dorovnano
      pro tento kontext, gotcha "btn-primary mimo .product propada sablone"). MOST: stara inline zelena
      #65A83A (5 tlacitek Nealko/BEST NP/Cryo Fresh + 1 odkaz) -> ink tier, dokud Robin neopravi HTML
      clanku v adminu (obsah, ne CSS; po oprave most nic nematchuje = neskodny).
   D  posledni cizi font: "Cena" ve filtru (#filters .slider-wrapper h4 span, Roboto ze sablony) -> Hanken.
   ================================================================================ */
/* A - vypis */
.type-posts-listing .content-inner{ max-width:none !important; margin:0 !important; }
.type-posts-listing .news-wrapper{ display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:36px 24px !important; margin:8px 0 0 !important; padding:0 !important; width:auto !important; }
.type-posts-listing .news-item{ display:block !important; width:auto !important; flex:none !important; margin:0 !important; padding:0 !important; border:0 !important; }
.type-posts-listing .news-item .image{ width:auto !important; margin:0 0 12px !important; float:none !important; text-align:left !important; }
.type-posts-listing .news-item .image a{ display:block !important; }
.type-posts-listing .news-item .image img{ display:block !important; width:100% !important; height:auto !important; aspect-ratio:5 / 3; object-fit:cover; border-radius:12px !important; }
.type-posts-listing .news-item .text{ width:auto !important; padding:0 !important; margin:0 !important; }
.type-posts-listing .news-item .title{ display:block !important; font-family:var(--h) !important; font-size:18px !important; font-weight:600 !important; line-height:1.3 !important; color:var(--ink) !important; margin:0 0 6px !important; text-decoration:none !important; transition:color .15s; }
.type-posts-listing .news-item:hover .title{ color:var(--gd) !important; text-decoration:underline !important; text-underline-offset:3px; }
.type-posts-listing .news-item time{ display:block !important; font-size:13px !important; color:var(--mut) !important; margin:0 0 8px !important; }
.type-posts-listing .news-item .description{ font-size:14px !important; line-height:1.6 !important; color:var(--mut) !important; display:-webkit-box !important; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden !important; margin:0 !important; }
.type-posts-listing .news-item .description p{ margin:0 !important; color:inherit !important; }
.type-posts-listing .news-item .read-article{ display:none !important; }
@media (max-width:767px){
  .type-posts-listing .news-wrapper{ grid-template-columns:1fr !important; gap:20px !important; }
  .type-posts-listing .news-item{ display:grid !important; grid-template-columns:120px minmax(0,1fr) !important; gap:12px !important; align-items:start !important; }
  .type-posts-listing .news-item .image{ margin:0 !important; }
  .type-posts-listing .news-item .title{ font-size:16px !important; }
  .type-posts-listing .news-item time{ font-size:12px !important; margin-bottom:4px !important; }
  .type-posts-listing .news-item .description{ -webkit-line-clamp:2; font-size:13.5px !important; }
}
/* A2 - tablet 768-1099: 2 sloupce (3x220px bylo tesne) */
@media (min-width:768px) and (max-width:1099px){ .type-posts-listing .news-wrapper{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; } }
/* B - detail: hlavni obrazek */
.news-item-detail .bx-article-hero{ display:block !important; margin:4px 0 28px !important; padding:0 !important; }
.news-item-detail .bx-article-hero img{ display:block !important; width:100% !important; height:auto !important; max-height:480px !important; object-fit:cover; border-radius:16px !important; }
.news-item-detail time{ display:block !important; color:var(--mut) !important; }
/* C - tlacitka v tele clanku */
.news-item-detail .text .btn{ display:inline-block !important; padding:11px 22px !important; border-radius:12px !important; font-family:var(--h) !important; font-weight:700 !important; font-size:15px !important; line-height:1.3 !important; text-decoration:none !important; transition:background .15s, color .15s, border-color .15s; }
.news-item-detail .text .btn-primary{ background:#fff !important; border:1.5px solid var(--g) !important; color:var(--g) !important; }
.news-item-detail .text .btn-primary:hover{ background:var(--ink) !important; border-color:var(--ink) !important; color:#fff !important; }
.news-item-detail .text a[style*="background: #65A83A" i], .news-item-detail .text a[style*="background:#65A83A" i]{ display:inline-block !important; background:var(--g) !important; border:1.5px solid var(--g) !important; color:#fff !important; border-radius:12px !important; padding:11px 22px !important; font-family:var(--h) !important; font-weight:700 !important; text-decoration:none !important; transition:background .15s, border-color .15s; }
.news-item-detail .text a[style*="background: #65A83A" i]:hover, .news-item-detail .text a[style*="background:#65A83A" i]:hover{ background:var(--gd) !important; border-color:var(--gd) !important; }
.news-item-detail .text a[style*="color: #65a83a" i]:not([style*="background" i]), .news-item-detail .text a[style*="color:#65a83a" i]:not([style*="background" i]){ color:var(--ink) !important; font-weight:600 !important; text-decoration:none !important; }
.news-item-detail .text a[style*="color: #65a83a" i]:not([style*="background" i]):hover, .news-item-detail .text a[style*="color:#65a83a" i]:not([style*="background" i]):hover{ color:var(--gd) !important; text-decoration:underline !important; text-underline-offset:3px; }
/* D - "Cena" ve filtru */
#filters .slider-wrapper h4, #filters .slider-wrapper h4 span{ font-family:var(--h) !important; }

/* ================================================================================
   v100 (5. 9. 2026, Robin: "banery - resils jak to vypada na jinych rozlisenich, tabletu?")
   PROBLEM: Shoptet vybira desktop/mobil banner podle USER-AGENTU, ale v81-v88 sazi text podle
   SIRKY OKNA (media 768). Nesoulad = text pres motiv: desktopovy banner v okne < 768 px
   (Robinuv screenshot: uzke okno na PC) a mobilni banner na telefonu NALEZATO (iPhone 844 px).
   Tablet (iPad 834/1194, desktop UA) byl v poradku.
   RESENI: rozlozeni podle TYPU BANNERU - sablona dava <img width=1418 height=572> (desktop)
   nebo <img width=801 height=866> (mobil, rozmery z BANNERY_zadani_pro_grafiku). :has() prebije
   media query at je okno jakekoli; media query zustava jako fallback pro prohlizece bez :has().
   Fonty zustavaji ve vw (clamp ma minima), takze v uzkem okne se jen zmensi, nepretecou.
   ================================================================================ */
/* desktopovy (siroky) banner = sloupec vpravo, vzdy */
#carousel .item:has(img[width="1418"]) .extended-banner-texts{
  left:61% !important; right:0 !important; top:0 !important; bottom:0 !important;
  justify-content:center !important; align-items:flex-start !important; text-align:left !important;
  padding:0 4% 7% 0 !important;
}
#carousel .item:has(img[width="1418"]) .extended-banner-title{ font-size:clamp(17px,3.35vw,58px) !important; }
#carousel .item:has(img[width="1418"]) .extended-banner-text{ font-size:clamp(11px,1.3vw,22px) !important; margin-top:12px !important; }
#carousel .item:has(img[width="1418"]) .extended-banner-link{ font-size:clamp(11px,1.25vw,21px) !important; margin-top:18px !important; padding:1.1em 1.7em !important; }
@media (min-width:768px){
  #carousel .item:has(img[width="1418"]) .extended-banner-link{ margin-top:26px !important; padding:1.2em 1.9em !important; }
}
/* mobilni (vysoky) banner = text dole na stred, vzdy (i telefon nalezato) */
#carousel .item:has(img[width="801"]) .extended-banner-texts{
  left:0 !important; right:0 !important; top:0 !important; bottom:0 !important;
  justify-content:flex-end !important; align-items:center !important; text-align:center !important;
  padding:0 6% 17% !important;
}
#carousel .item:has(img[width="801"]) .extended-banner-title{ font-size:clamp(15px,5.6vw,30px) !important; }
#carousel .item:has(img[width="801"]) .extended-banner-text{ font-size:clamp(11px,3.1vw,17px) !important; margin-top:8px !important; }
#carousel .item:has(img[width="801"]) .extended-banner-link{ font-size:clamp(14px,4.6vw,20px) !important; margin-top:18px !important; padding:1.05em 2em !important; }

/* =========================================================
   v102 (7. 9.) — MOBIL: nižší produktová karta + menší galerie na detailu.
   Podnět: externí UX audit (nálezy 5 a 10), Robin „zkus“. Karta na 390 px měřila 684 CSS px
   (fotka 245 vč. paddingu, hvězdičky 48, ceny 76, tlačítko 52+8, popis 20+19, pilulky 80).
   Pole karty ZŮSTÁVAJÍ (název 17 px, ceny 21 px beze změny — Robin 1. 9. „ne malé texty“),
   mění se jen prostor: fotka max 150 px, těsnější mezery, tlačítko 44 px.
   Scope: jen .products-block (kategorie, hledání, home karusely) a jen < 768 px; B2B .products-inline
   a PC netknuto. Detail: fotka max 240 px (natural 768×1024 → na mobilu 278 px + 38 px mezera).
   Rollback = smazat tento blok.
   ========================================================= */
@media (max-width:767px){
  .products-block .product .p{ padding:12px !important; }
  .products-block .product .p .image{ padding:10px !important; margin:0 0 8px !important; }
  .products-block .product .p .image img{ max-height:150px !important; width:auto !important; max-width:100% !important; object-fit:contain !important; }
  .products-block .product .p a.name{ margin-bottom:6px !important; min-height:0 !important; }
  .products-block .product .p .stars-wrapper, .products-block .product .p .ratings-wrapper{ padding-bottom:4px !important; min-height:0 !important; }
  .products-block .product .p-bottom .prices{ min-height:0 !important; margin-top:2px !important; }
  .products-block .product .p-bottom .price-final{ margin-top:2px !important; }
  .products-block .product .p-bottom .price-measure{ margin-top:4px !important; }
  .products-block .product .p-bottom .p-tools .btn{ padding:9px 14px !important; margin-top:6px !important; }
  .products-block .product .p .p-desc{ margin-top:8px !important; }
  .products-block .product .p .widget-parameter-wrapper{ margin-top:6px !important; padding-top:8px !important; }
  .type-detail .p-image{ margin-bottom:14px !important; }
  .type-detail .p-image img{ max-height:240px !important; width:auto !important; max-width:100% !important; margin:0 auto !important; object-fit:contain !important; display:block !important; }
}

/* =========================================================
   v103 (7. 9.) — OBJEDNÁVKA krok 2: tlačítko „Potřebujete pomoc?“ (Shoptet `.toggle-contacts`,
   obsah = text + <br> + <span>telefon</span>; klik = rozbalí kontakty a přepíše text na „Skrýt kontakty“).
   Robin (iPhone 15 Pro, Safari): po načtení jen první řádek nahoře, číslo chybí; po rozbalení a sbalení
   je tlačítko celé. Reprodukce v Chrome (11 šířek) ani WebKit (iPhone emulace) NEÚSPĚŠNÁ, žádné naše
   pravidlo na číslo nemíří. Obranná úprava: telefon jako vlastní blokový řádek (nezávisle na <br>),
   barva a písmo dědí, výška auto. Nic jiného se nemění. Rollback = smazat blok.
   ========================================================= */
.ordering-process .toggle-contacts{ display:block !important; height:auto !important; min-height:0 !important; line-height:1.5 !important; padding:11px 22px !important; white-space:normal !important; overflow:visible !important; text-align:center !important; }
.ordering-process .toggle-contacts > span{ display:block !important; color:inherit !important; font-size:inherit !important; line-height:inherit !important; margin-top:2px !important; }
.ordering-process .toggle-contacts br{ display:none !important; }

/* =========================================================
   v104 (7. 9.) — iOS SAFARI: automatická detekce telefonních čísel. Safari na iPhonu obalí číslo v prostém
   textu do <a href="tel:"> a ten dostane barvu odkazu (ink) → na tmavém tlačítku „Potřebujete pomoc?“
   (krok 2 objednávky) bylo číslo černé na černém = „chybělo“ (Robin, screenshoty 7. 9. 13:15). Po rozbalení
   a sbalení Shoptet text přepíše z data-original-text a Safari detekci nezopakuje → číslo bílé. Emulace
   (Chrome i WebKit) detekci nedělá, proto nereprodukovatelné. Oprava: odkaz tel uvnitř tlačítek dědí barvu.
   Doplněk pro den D (Záhlaví): <meta name="format-detection" content="telephone=no"> — volitelné.
   ========================================================= */
.btn a[href^="tel:"], .btn a[href^="tel:"]:hover, .ordering-process .toggle-contacts a{ color:inherit !important; text-decoration:none !important; font:inherit !important; }

/* =========================================================
   v105 (7. 9.) — B2B ŘÁDKOVÝ VÝPIS (.products-inline): produkt BEZ variant má místo „Detail“ rovnou
   tlačítko „Do košíku“ (`button.btn-cart` + `span.to-cart-text`). Shoptet v řádcích text skrývá
   (`.to-cart-text{display:none}`) a kreslí jen ikonu přes `::before` (font shoptet, \e921); naše v949
   `.btn-cart::before{content:none}` ikonu smazala → zůstal prázdný černý obdélník 22×44 (Robin, 7. 9.,
   HyperBoost Mosaic 100 g). Oprava: v řádcích text zobrazit, tlačítko = konverzní tier (zelená), stejná
   výška jako „Detail“ (36 px). Karty (.products-block) a detail netknuty. Rollback = smazat blok.
   ========================================================= */
.products-inline .p-tools .btn-cart .to-cart-text{ display:inline !important; }
.products-inline .p-tools .btn-cart{ display:inline-flex !important; align-items:center !important; justify-content:center !important; width:auto !important; min-width:0 !important; height:36px !important; padding:0 16px !important; margin:0 !important; font-family:var(--h) !important; font-size:14px !important; font-weight:700 !important; letter-spacing:.02em !important; text-transform:uppercase !important; white-space:nowrap !important; background:var(--g) !important; border:1.5px solid var(--g) !important; color:#fff !important; border-radius:12px !important; }
.products-inline .p-tools .btn-cart:hover{ background:var(--gd) !important; border-color:var(--gd) !important; color:#fff !important; }

/* =========================================================
   v106 (7. 9.) — MOBILNÍ HLAVIČKA: sjednocení tří ikon (Robin: „lupa, košík a burger jsou jiné“).
   Stav před: lupa = nativní glyph 18 px šedá #767676 · košík = náš stroke SVG 26 px ink (v92) ·
   burger = nativní glyph 14 px bílá v šedém kruhu #666 32 px. Po: všechny tři = stroke SVG 26 px,
   ink #141815, síla čáry 1.9, bez kruhu; tap plocha 40×40 zůstává (mění se JEN ::before, ne struktura
   hlavičky — lekce v59). Otevřený stav menu řeší Shoptet vlastním `.navigation-close`, netknuto.
   Rollback = smazat blok.
   ========================================================= */
@media (max-width:767px){
  a.toggle-window[data-target=search]::before, a.toggle-window[data-target=navigation]::before{
    content:"" !important; font-size:0 !important; line-height:0 !important; color:transparent !important;
    background-color:transparent !important; border-radius:0 !important; box-shadow:none !important;
    width:26px !important; height:26px !important; display:block !important; margin:7px auto !important;
    background-repeat:no-repeat !important; background-position:center !important; background-size:contain !important;
  }
  a.toggle-window[data-target=search]::before{
    background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23141815' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'><circle cx='10.5' cy='10.5' r='6.5'/><path d='m20 20-4.6-4.6'/></svg>") !important;
  }
  a.toggle-window[data-target=navigation]::before{
    background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23141815' stroke-width='1.9' stroke-linecap='round'><path d='M3.5 6.5h17M3.5 12h17M3.5 17.5h17'/></svg>") !important;
  }
}

/* =========================================================
   v107→v108 (7. 9.) — MOBILNÍ HLAVIČKA: košík svisle na střed s lupou a burgerem (Robin: „košík se vybíjí“).
   Příčina: ikona košíku (v92) je `inline-block` 26 px s `vertical-align:middle` v odkazu vysokém 26 px
   s line-height 24 → řádkový box ji vysouvá nad odkaz (~5 px výš než ostatní). Oprava: odkaz 40 px na y=5 jako
   ostatní (top:-45), ikona `block` s margin-top 11 → optický střed 29 px u všech tří (měřeno z pixelů).
   ========================================================= */
@media (max-width:767px){
  /* odkaz košíku: nativně 26 px vysoký na y=11 (top:-39) → srovnat s lupou/burgerem (40 px na y=5, ikona od 16 px) */
  .navigation-buttons a.cart-count, .navigation-buttons a.btn-icon.cart-count{ height:40px !important; top:-45px !important; padding:0 !important; line-height:40px !important; }
  .navigation-buttons a.cart-count::before, .navigation-buttons a.btn-icon.cart-count::before{ display:block !important; margin:11px 20px 0 0 !important; }
}

/* =========================================================
   v109→v110 (7. 9.) — B2B KARTY NA HOMEPAGE (.bx-b2b-cards, JS v40 z řádků): pilulky variant seděly NAD cenou
   (v řádkovém markupu je .widget-parameter-wrapper uvnitř .p-in před .p-bottom), zatímco B2C karta je má dole.
   Robin 7. 9.: „varianty odjely nahoru a nalezly na cenu“ — stav byl stejný už ve v101 (ověřeno), ale
   nekonzistence je skutečná. Oprava: .p-in jako display:contents → děti se stanou položkami flex sloupce .p
   a dají se seřadit: obsah (name+ratings) → ceny+Detail → pilulky dole (jako B2C, v89).
   Jen homepage B2B karty; řádky v kategoriích (.products-inline) netknuty. Rollback = smazat blok.
   ========================================================= */
/* v110: pilulky jsou uvnitř .p-in-in (ne přímo v .p-in) → i .p-in-in jako contents, děti dostanou order 1 */
.products-block.bx-b2b-cards .product .p .p-in, .products-block.bx-b2b-cards .product .p .p-in-in{ display:contents !important; } /* v112: bez .type-index — platí i pro mobilní karty v kategoriích */
.products-block.bx-b2b-cards .product .p > .image{ order:0 !important; }
.products-block.bx-b2b-cards .product .p .p-in-in > *{ order:1 !important; }
.products-block.bx-b2b-cards .product .p .p-bottom{ order:2 !important; }
.products-block.bx-b2b-cards .product .p .widget-parameter-wrapper{ order:3 !important; margin-top:auto !important; padding-top:10px !important; }

/* =========================================================
   v111 (7. 9.) — KARTA SE SLEVOU V B2B (Robin: „ŽPČ −11 % rozbíjí kartu“). Řádkový markup (a z něj B2B karty)
   nese v .prices navíc „Původně: <s>45 Kč</s> (–11 %)“; .price-standard je u nás skrytý (v18), takže zůstal
   osiřelý řádek „Původně: (–11 %)“ a blok cen měl 116 px místo 70 → Detail se posunul k měrné ceně.
   Sleva je na kartě už jako štítek „−11 %“ na fotce → v kartách řádek skrýt celý (label + částka + procento).
   Detail produktu a řádkový výpis (.products-inline) netknuty. Rollback = smazat blok.
   ========================================================= */
.products-block .product .prices .price-standard-wrapper, .products-block .product .prices .price-standard-label, .products-block .product .prices .price-save{ display:none !important; }

/* =========================================================
   v112 (7. 9.) — B2B KARTY V KATEGORIÍCH NA MOBILU (JS v44 přejmenuje .products-inline → .products-block.bx-b2b-cards
   i v kategoriích pod 768 px; Robin: „na mobilu mít klasické karty“). CSS: v110 pravidla bez .type-index (výše),
   text „Do košíku“ v kartách viditelný (Shoptet ho v řádkovém markupu skrývá, naše ::before ikonu maže — viz v105),
   tlačítko v kartě přes celou šířku jako Detail. Rollback = smazat blok + vrátit .type-index ve v110.
   ========================================================= */
.products-block .product .p .btn-cart .to-cart-text{ display:inline !important; }
.products-block.bx-b2b-cards .product .p-tools .btn-cart{ width:100% !important; display:block !important; height:auto !important; padding:11px 14px !important; margin:0 !important; text-align:center !important; }
.products-block.bx-b2b-cards .product .p-bottom .p-tools{ width:100% !important; }

/* v113 (7. 9.) — B2B karty: řádkový markup má u produktu bez variant vedle „Do košíku“ ještě záložní odkaz
   `a.btn-primary.secondary-to-cart-btn` (Shoptet ho skrývá jen v .products-inline; po přejmenování na karty
   se ukázaly dva stohované knoflíky). V kartách skrýt — do detailu vede fotka i název. */
.products-block.bx-b2b-cards .product .secondary-to-cart-btn{ display:none !important; }

/* v114 (7. 9.) — B2B mobilní karta, produkt bez variant: počítadlo kusů (z řádkového markupu) + „Do košíku“ v JEDNOM
   řádku (B2C karta počítadlo nemá; B2B ho potřebuje). Formulář = flex, počítadlo pevné, tlačítko dobere zbytek. */
.products-block.bx-b2b-cards .product .p-tools form.pr-action{ display:flex !important; align-items:stretch !important; gap:8px !important; width:100% !important; }
.products-block.bx-b2b-cards .product .p-tools form.pr-action .quantity{ flex:0 0 auto !important; margin:0 !important; }
.products-block.bx-b2b-cards .product .p-tools form.pr-action .btn-cart{ flex:1 1 auto !important; width:auto !important; margin:0 !important; height:auto !important; }

/* =========================================================
   v115→v116 (7. 9.) — HLAVNÍ MENU NA JEDNOM ŘÁDKU (Robin: „při zmenšení se propisuje pod sebe do dvou řádků“).
   Měřeno: 13 položek = 1198 px; kontejner 1378 (≥1440) · 1138 (1200–1439) · 932 (992–1199) · 707 (768–991)
   → lámalo se už od 1366 px. Odstupňování: 1200–1439 menší odsazení + písmo 14,5; 992–1199 písmo 13 + odsazení 6;
   768–991 jeden řádek s vodorovným posunem (skrytý posuvník + přechod vpravo). Položky se nikdy nelámou uvnitř
   (nowrap + flex:none) — v115 to nemělo a text se lámal v položce (menu 56–70 px vysoké, stránka přetékala).
   Font-size musí jít přes `ul.menu-level-1 > li > a` (specifičtější pravidlo výše). Po vlně 3 (8 položek) stupně
   přestanou působit samy. Rollback = smazat blok.
   ========================================================= */
@media (min-width:768px){
  .navigation-in.menu ul.menu-level-1{ flex-wrap:nowrap !important; }
  .navigation-in.menu ul.menu-level-1 > li{ flex:0 0 auto !important; }
  .navigation-in.menu ul.menu-level-1 > li > a{ white-space:nowrap !important; }
}
@media (min-width:1200px) and (max-width:1439px){
  .navigation-in.menu ul.menu-level-1 > li > a{ padding:14px 9px !important; font-size:14.5px !important; letter-spacing:0 !important; }
  .navigation-in.menu ul.menu-level-1 > li > a::after{ left:9px !important; right:9px !important; }
}
@media (min-width:992px) and (max-width:1199px){
  .navigation-in.menu ul.menu-level-1{ overflow-x:auto !important; overflow-y:hidden !important; scrollbar-width:none !important; }
  .navigation-in.menu ul.menu-level-1::-webkit-scrollbar{ display:none !important; }
  .navigation-in.menu ul.menu-level-1 > li > a{ padding:14px 6px !important; font-size:13px !important; letter-spacing:0 !important; }
  .navigation-in.menu ul.menu-level-1 > li > a::after{ left:6px !important; right:6px !important; }
}
@media (min-width:768px) and (max-width:991px){
  .navigation-in.menu{ position:relative !important; }
  .navigation-in.menu ul.menu-level-1{ overflow-x:auto !important; overflow-y:hidden !important; scrollbar-width:none !important; -webkit-overflow-scrolling:touch !important; padding-right:40px !important; }
  .navigation-in.menu ul.menu-level-1::-webkit-scrollbar{ display:none !important; }
  .navigation-in.menu ul.menu-level-1 > li > a{ padding:14px 8px !important; font-size:13.5px !important; letter-spacing:0 !important; }
  .navigation-in.menu ul.menu-level-1 > li > a::after{ left:8px !important; right:8px !important; }
  .navigation-in.menu::after{ content:"" !important; position:absolute !important; top:0 !important; right:0 !important; bottom:0 !important; width:48px !important; pointer-events:none !important; background:linear-gradient(90deg, rgba(255,255,255,0), #fff 70%) !important; }
}

/* =========================================================
   v117 (7. 9.) — KOMPAKTNÍ KARTY „NEJPRODÁVANĚJŠÍ“ (.products-top) na 992–1439 px: obrázek vlevo + název
   v ~105 px sloupci lámal slova uprostřed („Revitalizova ný“, „(stohovateln ý)“) — nález virtuálního zákazníka
   na 1280 px (/keg-sudy/, /30l/). Do 991 px už karty stojí svisle (v9); rozšířeno i na 992–1439 s menším obrázkem.
   Navíc dělení slov spojovníkem u názvů karet (lang=cs) jako záchrana pro extra dlouhá slova. Rollback = smazat blok.
   ========================================================= */
@media (min-width:992px) and (max-width:1439px){
  .products-top .product .p{ display:flex !important; flex-direction:column !important; }
  .products-top .product .p .image{ width:100% !important; max-width:none !important; margin:0 0 10px !important; }
  .products-top .product .p .image img{ max-height:96px !important; width:auto !important; margin:0 auto !important; display:block !important; }
  .products-top .product .p .p-in, .products-top .product .p .p-bottom{ width:100% !important; margin:0 !important; }
}
.product .p a.name{ hyphens:auto !important; -webkit-hyphens:auto !important; }

/* =========================================================
   v118 (8. 9.) — KONTRASTNÍ MOTIV WINDOWS (forced-colors). Robin: Olegovi s nastavením pro slabý zrak „vybledly
   bannery a dlaždice“. Ověřeno emulací: prohlížeč v forced-colors přebarví text hera na systémovou modrou s bílým
   podkladem, tlačítka na bílá, dlaždicím sebere pastel. Prvky, které mají vlastní vysoký kontrast (ink na pastelu,
   bílá na inku), necháme v našich barvách; zbytek stránky (texty, odkazy, formuláře) systému necháme — to je
   správné chování pro uživatele s vlastním motivem. Rollback = smazat blok.
   ========================================================= */
@media (forced-colors: active){
  #carousel .extended-banner-texts, #carousel .extended-banner-title, #carousel .extended-banner-text, #carousel .extended-banner-link,
  .btn-conversion, .btn-cart, .add-to-cart-button, .btn-default, .btn-primary,
  .welcome-wrapper a, .bx-tiles a, .bx-tile, .bx-usp li,
  .products-block .product .p, .products-top .product .p, .flag{ forced-color-adjust:none !important; }
  /* kde není vlastní pozadí, ať zůstane čitelnost: banner texty inkově */
  #carousel .extended-banner-title, #carousel .extended-banner-text{ color:var(--ink) !important; background:transparent !important; }
}

/* =========================================================
   v121→v123 (8. 9.) — PŘEPÍNAČ JAZYKA v horní liště (Robin: „vlaječky aby korespondovaly designu“). Nativní panel = bílý
   obdélník bez rádiusu a stínu, vlajky 24×24 s ostrými rohy. Po: panel jako naše dropdowny (radius 12, jemná linka,
   stín, položky s hover --tint), vlajky 18 px kulaté (viewBox symbolu je 32×32 → clip circle bez deformace),
   jemný rámeček, o krok tlumenější sytost, aktivní jazyk tučně. Rollback = smazat blok.
   ========================================================= */
.languagesMenu__list.languagesMenu__list--language, .languagesMenu__list.languagesMenu__list--currency{
  background:#fff !important; border:1px solid var(--line) !important; border-radius:12px !important; box-shadow:0 12px 32px -18px rgba(20,24,21,.25) !important;
  padding:6px !important; min-width:160px !important; margin-top:6px !important; overflow:hidden !important;
}
.languagesMenu__list li{ border:0 !important; }
.languagesMenu__list .languagesMenu__list__link{ display:flex !important; align-items:center !important; gap:10px !important; padding:9px 12px !important; border-radius:8px !important; font-family:var(--h) !important; font-size:14px !important; color:var(--ink) !important; text-decoration:none !important; }
.languagesMenu__list .languagesMenu__list__link:hover{ background:var(--tint) !important; color:var(--ink) !important; }
.languagesMenu__list .languagesMenu__list__name--actual{ font-weight:700 !important; }
.languagesMenu__list .shp-flag{ width:18px !important; height:18px !important; flex:0 0 18px !important; border-radius:50% !important; clip-path:circle(50% at 50% 50%) !important; box-shadow:inset 0 0 0 1px rgba(20,24,21,.12) !important; filter:saturate(.85) !important; }
/* v122: doladění v121 — bílý podklad pod textem při hoveru (dědictví pravidla .languagesMenu__list *{background:#fff}) a odrážky seznamu u měny */
.languagesMenu__list, .languagesMenu__list li{ list-style:none !important; padding-left:6px !important; margin:0 !important; }
.languagesMenu__list li{ padding-left:0 !important; }
.languagesMenu__list li::before, .languagesMenu__list li::marker{ content:none !important; display:none !important; }
.languagesMenu__list .languagesMenu__list__link, .languagesMenu__list .languagesMenu__list__link *{ background:transparent !important; }
.languagesMenu__list .languagesMenu__list__link:hover{ background:var(--tint) !important; }
/* v123: odrážka „•“ u měn je ::before na odkazu (Shoptet .languagesMenu__list__link--currency::before) → pryč */
.languagesMenu__list .languagesMenu__list__link::before{ content:none !important; display:none !important; }
/* v124: kulatý ořez vlajek seděl špatně (symbol 32×32 má vlajku s okraji) → hranaté, jen menší a tlumenější (Robin 8. 9.) */
.languagesMenu__list .shp-flag{ width:20px !important; height:20px !important; flex:0 0 20px !important; border-radius:0 !important; clip-path:none !important; box-shadow:none !important; filter:saturate(.85) !important; }

/* v125: blok značek před patičkou (Robin 8. 9.: „vrátit na home značky, bez karuselu, před footer“). HTML .bx-brands je na konci Uvítacího textu s atributem hidden; JS v45 mountBrands ho přesune před #footer a hidden odebere. Loga = bývalý DKlab logo slider (Crisp, Lallemand, Blefa, Yakima Chief, BESTMALZ), bílé pozadí → sekce bílá. */
.bx-brands{ max-width:1200px; margin:48px auto 40px; padding:0 20px; text-align:center; }
.bx-brands-h{ font-size:13px !important; font-weight:600 !important; letter-spacing:.08em; text-transform:uppercase; color:var(--mut) !important; margin:0 0 22px !important; }
.bx-brands-list{ display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:20px 44px; list-style:none; margin:0; padding:0; }
.bx-brands-list li{ margin:0; padding:0; }
.bx-brands-list li::before, .bx-brands-list li::marker{ content:none; display:none; }
.bx-brands-list a{ display:block; text-decoration:none !important; border:0 !important; }
.bx-brands-list img{ display:block; height:56px; width:auto; max-width:170px; object-fit:contain; filter:grayscale(1); opacity:.72; transition:filter .2s, opacity .2s; }
.bx-brands-list a:hover img, .bx-brands-list a:focus-visible img{ filter:none; opacity:1; }
@media (max-width:767px){ .bx-brands{ margin:32px auto 28px; } .bx-brands-list{ gap:14px 24px; } .bx-brands-list img{ height:40px; max-width:120px; } }
/* v126: loga viditelnější (opacity .72→.82); mobil 3+2 místo 4+1 (Robin 8. 9. večer „vypadá to divně“ — prázdný blok kvůli lazy obrázkům řeší JS v46) */
.bx-brands-list img{ opacity:.82; }
@media (max-width:767px){ .bx-brands-list{ gap:18px 0; } .bx-brands-list li{ flex:0 0 33.333%; display:flex; justify-content:center; } .bx-brands-list img{ height:38px; max-width:104px; } }
/* v127: blok značek = karty jako dlaždice (Robin 8. 9. večer: „příliš malé, vypadají divně, udělej jako dlaždice“) — bílá karta s linkou a rádiusem 16 jako produktová karta, logo barevné 72 px, název značky pod ním; nadpis jako u sekcí (24px/700); zarovnání na obsah (1178 − 2×40 = 1098 jako dlaždice); mobil = posuvná řada se snapem, 2,2 karty na šířku. Přebíjí v125/v126. */
.bx-brands{ max-width:1178px !important; margin:56px auto 48px !important; padding:0 40px !important; text-align:left !important; }
.bx-brands-h{ font-size:24px !important; font-weight:700 !important; letter-spacing:-.01em !important; text-transform:none !important; color:var(--ink) !important; margin:0 0 18px !important; line-height:1.2 !important; }
.bx-brands-list{ display:grid !important; grid-template-columns:repeat(5,1fr) !important; gap:16px !important; }
.bx-brands-list li{ display:block !important; flex:none !important; }
.bx-brands-list a{ display:flex !important; flex-direction:column; align-items:center; justify-content:center; gap:14px; background:#fff; border:1px solid var(--line) !important; border-radius:16px; padding:22px 16px 18px; min-height:156px; box-shadow:0 1px 2px rgba(0,0,0,.04); transition:border-color .2s, box-shadow .2s, transform .2s; }
.bx-brands-list a:hover, .bx-brands-list a:focus-visible{ border-color:var(--ink) !important; box-shadow:0 8px 24px rgba(20,24,21,.08); transform:translateY(-2px); }
.bx-brands-list img{ height:72px !important; width:auto !important; max-width:100% !important; filter:none !important; opacity:1 !important; }
.bx-brands-list .bx-brand-nm{ font-size:14px; font-weight:600; color:var(--ink); line-height:1.25; text-align:center; }
@media (max-width:991px){ .bx-brands{ padding:0 20px !important; } .bx-brands-list{ grid-template-columns:repeat(3,1fr) !important; } }
@media (max-width:767px){ .bx-brands{ margin:36px auto 32px !important; padding:0 !important; } .bx-brands-h{ padding:0 16px; } .bx-brands-list{ display:flex !important; overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; gap:12px !important; padding:2px 16px 8px; scrollbar-width:none; } .bx-brands-list::-webkit-scrollbar{ display:none; } .bx-brands-list li{ flex:0 0 44% !important; scroll-snap-align:start; } .bx-brands-list a{ min-height:136px; padding:16px 12px 14px; } .bx-brands-list img{ height:56px !important; } .bx-brands-list .bx-brand-nm{ font-size:13px; } }
/* v128: mobil = mřížka 2 sloupce jako dlaždice (v127 flex se zalamoval nezáměrně), 5. karta na střed přes celou šířku */
@media (max-width:767px){ .bx-brands-list{ display:grid !important; grid-template-columns:repeat(2,1fr) !important; gap:12px !important; padding:0 16px !important; overflow:visible !important; scroll-snap-type:none !important; } .bx-brands-list li{ flex:none !important; width:auto !important; } .bx-brands-list li:last-child:nth-child(odd){ grid-column:1 / -1; width:calc(50% - 6px) !important; margin:0 auto; } }
/* v129: zarovnání bloku značek na linku sekcí (nadpis i karty x=107 na PC jako Novinky; mobil nadpis 10 px, karty 12 px jako produktové sekce) + rytmus: 34 px nad nadpisem jako mezi sekcemi. Když je blok mezi sekcemi (JS v47), spodní odstup dává následující sekce; před patičkou 48 px. */
.bx-brands{ max-width:1178px !important; padding:0 20px !important; margin:34px auto 0 !important; }
.bx-brands.bx-brands--footer{ margin:56px auto 48px !important; }
.bx-brands-h{ margin:0 0 16px !important; }
@media (max-width:767px){ .bx-brands{ margin:34px auto 0 !important; padding:0 !important; } .bx-brands.bx-brands--footer{ margin:36px auto 32px !important; } .bx-brands-h{ padding:0 10px !important; } .bx-brands-list{ padding:0 12px !important; } }
/* v130: blok značek uvnitř obsahového kontejneru (JS v50 = mezi Pivní sudy a Nové články) → bez vlastního paddingu, ať nadpis i karty sedí na x=107 jako sekce (mobil 10/12). Varianta před patičkou (.bx-brands--footer) si padding nechává. */
.bx-brands:not(.bx-brands--footer){ max-width:none !important; padding:0 !important; margin:34px 0 0 !important; }
@media (max-width:767px){ .bx-brands:not(.bx-brands--footer) .bx-brands-h{ padding:0 !important; } .bx-brands:not(.bx-brands--footer) .bx-brands-list{ padding:0 2px !important; } }
/* v134+v135 (10. 9. 2026, Robin: "filtr Zeme puvodu ma byt nahore, pred Formou"; v133 = slepa ulicka, sekce nejsou primo v #filters):
   Shoptet radi sekce filtru ABECEDNE podle zobrazovaneho nazvu (CZ i EN jinak) a poradi z adminu ignoruje -> poradi drzi CSS.
   Parametricke sekce + Znacky + pocet lezi v #category-filter-hover (sbaleno = bez tridy, rozbaleno = .visible), Na sklade/Akce a
   tlacitko Rozbalit jsou mimo nej. Flex jen na .visible, aby sbaleni zustalo. Poradi: Zeme puvodu (21), Druh (275, Outlet),
   Pivni styl (66), Aroma (18), Typ (117), Forma (96), Hmotnost (5), ostatni parametricke (Stav, Ucel, slad, kvasnice), Znacky, pocet.
   Obecne pravidlo je PRED specifickymi (stejna specificita, vyhrava posledni). */
#category-filter-hover.visible{ display:flex !important; flex-direction:column !important; }
@media (max-width:767px){ #category-filter-hover{ display:flex !important; flex-direction:column !important; } }  /* v135: mobil (<=767) = suplik, blok se nesbaluje tridou */
#category-filter-hover > *{ order:50; }
#category-filter-hover .filter-section-parametric{ order:20; }
#category-filter-hover .filter-section-parametric-id-21{ order:2; }
#category-filter-hover .filter-section-parametric-id-275{ order:3; }
#category-filter-hover .filter-section-parametric-id-66{ order:4; }
#category-filter-hover .filter-section-parametric-id-18{ order:5; }
#category-filter-hover .filter-section-parametric-id-117{ order:6; }
#category-filter-hover .filter-section-parametric-id-96{ order:7; }
#category-filter-hover .filter-section-parametric-id-5{ order:8; }
#category-filter-hover .filter-section-manufacturer{ order:40; }
#category-filter-hover .filter-section-count{ order:60; }
