/* ==========================================================================
   checkout-redesign.css  (v=5)  7. 9. 2026
   Drevko – redizajn košíka a objednávky pre šablónu Shoptet Disco
   (body.template-13, ums_forms_redesign--on). Pripravené na drevko.fr,
   selektory sú jazykovo nezávislé (body.ordering-process, #checkoutContent,
   #checkoutSidebar, .cart-table, .radio-wrapper …), takže súbor funguje
   na všetkých 7 e-shopoch. Jediné texty v CSS (riadok o bezpečnom nákupe
   pod tlačidlom) sú viazané na html[lang].

   v2 (podľa pripomienok, vzor kondela.sk/kosik):
   - svetlosivé pozadie stránky objednávky, biele karty bez ťažkých rámikov
   - krok 3: jeden súvislý formulár (osobné údaje + fakturačná adresa +
     dodacia adresa + poznámka + newsletter) v jednej bielej karte, štítky
     NAD poľami (bez plávajúcich štítkov), polia v dvoch stĺpcoch na desktope
   - krok 2: každá doprava/platba ako biela karta, prepínač vycentrovaný,
     vybraná karta s tmavým obrysom
   - blok „Potrebujete pomôcť?“ skrytý
   - mínus v množstve jemne červené
   - dostupnosť bez vlastného štítku – farba a text zo šablóny/administrácie
   - mobil: karty na celú šírku, tlačidlá 56 px, žiadne vodorovné posúvanie

   Iba CSS, žiadne zásahy do HTML ani JS Shoptetu. Nič, čo Shoptet prepína
   JavaScriptom (kupón, hlásenia validácie, nemožné kombinácie dopravy
   a platby, skrytie nevybraných možností, výber krajiny pri nákupe na firmu),
   sa nezobrazuje ani neskrýva natvrdo.

   Prešlo nezávislou revíziou (kaskáda voči Discu, stavy JS Shoptetu, responzivita,
   prístupnosť WCAG AA, zjednodušenie); po nej ubudlo ~15 pravidiel.

   Nasadenie: nahrať do /user/documents/ a do HTML kódu
   hlavičky pridať
   <link rel="stylesheet" href="/user/documents/checkout-redesign.css?v=5">
   Pri každej zmene súboru zvýšiť číslo ?v=.
   ========================================================================== */

/* ===== 0) TOKENY ========================================================= */
/* Tokeny sú zámerne na dvoch konkrétnych miestach, nie na :root – mimo
   objednávky a mini-košíka v hlavičke sa tak nemôžu s ničím pobiť. */
body.ordering-process,
.cart-widget{
  --dk-green:#93ba40;           /* značková zelená – tlačidlá, kruhy krokov */
  --dk-green-dark:#7ea233;      /* hover pozadia tlačidiel */
  --dk-green-text:#56731f;      /* zelený TEXT a zaškrtnuté prvky – 5,4:1 na bielej,
                                    ≥4,5:1 aj na sivom/zelenom podklade */
  --dk-green-soft:#f4f8ea;      /* rovnaké ako .drevko-tile.is-active na detaile */
  --dk-text:#202020;
  --dk-muted:#6d6d6d;           /* 5,3:1 na bielej */
  /* Pozadie stránky objednávky. Sivá verzia mala #f3f5f5 (Kondela má #f0f3f3);
     celý súbor s ňou je odložený v _archiv/checkout-redesign-sive-pozadie.css,
     takže sa dá vrátiť buď prepísaním tejto jednej hodnoty, alebo tým súborom. */
  --dk-page:#ffffff;
  --dk-border:#e4e7e7;          /* jemné rámiky kariet a oddeľovače */
  --dk-border-strong:#8a8f8f;   /* rámiky polí a prepínačov – 3,3:1 (WCAG 1.4.11) */
  --dk-bg-soft:#f3f5f5;
  --dk-danger:#d63500;
  --dk-danger-soft:#fdeeea;
  --dk-minus:#c9463a;           /* mínus v množstve */
  --dk-radius:12px;
  --dk-radius-sm:8px;
  --dk-shadow:0 1px 2px rgba(20,30,30,.06);   /* jediný, jemný tieň kariet */
  /* glow z detailu produktu (.drevko-tile:hover v drevko-variant-tiles-slider.css) */
  --dk-glow:0 0 0 3px rgba(147,186,64,.25), 0 2px 10px rgba(147,186,64,.35);
  /* tlmenejší variant pre stepper množstva – plný glow tam pôsobil príliš silno */
  --dk-glow-soft:0 0 0 2px rgba(147,186,64,.22);
  /* firemná hnedá z hlavičky a pätičky e-shopu (.top-navigation-bar, #footer);
     na bielej má 2,85:1, takže sa používa len na hover a na plochy */
  --dk-brown:#c38e63;
  --dk-focus:var(--dk-glow);
}

/* ===== 1) ROZLOŽENIE STRÁNKY ============================================ */
/* sivé pozadie len na krokoch objednávky; hlavička (#header) má vlastné biele */
body.ordering-process,
body.ordering-process .content-wrapper{
  background-color:var(--dk-page);
}
body.ordering-process .content-wrapper .content .content-inner{
  max-width:1180px;
  margin:0 auto;
}
/* Nad 1440 px Disco zúži #checkoutContent na 50 % a odsunie ho o 8 % zľava.
   Skúšali sme držať dve tretiny aj tam (formulár 813 px namiesto 610 pri 1500 px),
   ale široký formulár na veľkom monitore sa nepozdával – Discovo rozloženie
   ostáva. Hotové pravidlo je v commite 9dd2a5a. */
body.ordering-process .cart-inner{ padding:0; }
/* Disco na mobile dáva .cart-inner 0 20px 20px; .content tam nemá vlastné
   odsadenie, takže karty by sa dotýkali okraja displeja */
@media (max-width:991px){
  body.ordering-process .cart-inner{ padding:0 16px 20px; }
}

/* ===== 2) KROKY OBJEDNÁVKY (1 · 2 · 3) ================================== */
body.ordering-process ol.cart-header{
  max-width:760px;
  margin:6px auto 30px;
  counter-reset:steps;
}
/* na mobile je hlavička fixná a kroky boli nalepené presne na jej spodnú hranu */
@media (max-width:991px){
  body.ordering-process ol.cart-header{ margin:16px auto 22px; }
}
body.ordering-process ol.cart-header li{
  width:33.333%;
  padding:0 6px;
  min-width:0;
  overflow-wrap:anywhere;
  hyphens:auto;
}
body.ordering-process ol.cart-header li a,
body.ordering-process ol.cart-header li strong{
  display:block;
  background:transparent;
  color:var(--dk-muted);
  font-size:14px;
  line-height:1.3;
  text-decoration:none;
}
body.ordering-process ol.cart-header li a span,
body.ordering-process ol.cart-header li strong span{
  color:var(--dk-muted);
  text-decoration:none !important;
}
/* kruh s číslom */
body.ordering-process ol.cart-header li a:before,
body.ordering-process ol.cart-header li strong:before{
  width:36px;
  height:36px;
  line-height:32px;
  border-width:2px;
  border-color:var(--dk-border-strong);
  background-color:#fff;
  color:var(--dk-muted);
  font-size:15px;
  font-weight:700;
  margin:0 auto 10px;
  box-sizing:border-box;
  transition:background-color .2s, border-color .2s, color .2s;
}
/* aktívny krok */
body.ordering-process ol.cart-header li.active a:before,
body.ordering-process ol.cart-header li.active strong:before{
  background-color:var(--dk-green);
  border-color:var(--dk-green);
  color:#fff;
  box-shadow:0 0 0 4px rgba(147,186,64,.18);
}
body.ordering-process ol.cart-header li.active a span,
body.ordering-process ol.cart-header li.active strong span{
  color:var(--dk-text);
  font-weight:700;
}
/* hotový krok – fajka namiesto čísla (counter-increment ostáva z Disca) */
body.ordering-process ol.cart-header li.completed a:before,
body.ordering-process ol.cart-header li.completed strong:before{
  content:"\2713" / "";
  background-color:var(--dk-green);
  border-color:var(--dk-green);
  color:#fff;
  font-size:16px;
}
body.ordering-process ol.cart-header li.completed a span,
body.ordering-process ol.cart-header li.completed strong span{
  color:var(--dk-text);
}
body.ordering-process ol.cart-header li.completed a:hover span,
body.ordering-process ol.cart-header li.completed a:focus-visible span{
  color:var(--dk-green-text);
  text-decoration:underline !important;
}
body.ordering-process ol.cart-header li.completed a:hover:before{
  background-color:var(--dk-green-dark);
  border-color:var(--dk-green-dark);
}
/* Disco dáva odkazu kroku pri hoveri biele pozadie – na sivej stránke by svietilo */
body.ordering-process ol.cart-header li a:hover,
body.ordering-process ol.cart-header li a:focus-visible{ background:transparent; }
/* spojnica medzi krokmi */
body.ordering-process ol.cart-header li a span:after,
body.ordering-process ol.cart-header li strong span:after{
  top:17px;
  border-top-width:2px;
  border-top-color:#d5d9d9;
}
body.ordering-process ol.cart-header li.completed a span:after,
body.ordering-process ol.cart-header li.completed strong span:after{
  border-top-color:var(--dk-green);
}
@media (max-width:479px){
  body.ordering-process ol.cart-header li a,
  body.ordering-process ol.cart-header li strong{ font-size:12px; }
  body.ordering-process ol.cart-header li a:before,
  body.ordering-process ol.cart-header li strong:before{
    width:32px; height:32px; line-height:28px; font-size:14px; margin-bottom:8px;
  }
  body.ordering-process ol.cart-header li a span:after,
  body.ordering-process ol.cart-header li strong span:after{ top:15px; }
}

/* ===== 3) SPOLOČNÉ: KARTY, NADPISY, TLAČIDLÁ ============================ */
/* karta = každý .box.box-sm v obsahu objednávky */
body.ordering-process #checkoutContent .box.box-sm{
  background:#fff;
  border:1px solid var(--dk-border);
  border-radius:var(--dk-radius);
  padding:22px 24px 8px;
  margin:0 0 16px;
}
body.ordering-process #checkoutContent fieldset{ min-width:0; }

/* nadpisy sekcií – bez ikony, ako na Kondele (margin:0 ruší aj margin-top:66px,
   ktorý Disco dáva nadpisu platby) */
body.ordering-process.ordering-process #checkoutContent .co-box h2{
  margin:0 0 16px;
  padding-left:0;
  font-size:20px;
  line-height:28px;
  font-weight:700;
  color:var(--dk-text);
}
body.ordering-process.ordering-process #checkoutContent .co-box h2:before{ display:none; }
/* Ikony Shoptetu pri nadpisoch dopravy a platby. Triedu .order-icon dáva Shoptet
   len týmto dvom nadpisom, takže ostatné nadpisy objednávky ostávajú bez ikony.
   Disco ich kreslí absolútne (30 px, top:50%) – staviame ich do riadka s textom. */
body.ordering-process.ordering-process #checkoutContent .co-box h2.order-icon:before,
body.ordering-process.ordering-process #checkoutContent .co-box.co-contact-information h2:before,
body.ordering-process.ordering-process #checkoutContent .co-box.co-billing-address h2:before,
body.ordering-process.ordering-process #checkoutContent .co-box.co-shipping-address h2:before{
  display:inline-block;
  position:static;
  margin:0 10px 0 0;
  font-size:20px;
  line-height:1;
  vertical-align:-2px;
  font-weight:400;
  color:var(--dk-muted);
}

/* tlačidlá ďalej / objednať; poradie v column-reverse: späť (1) dole,
   text o bezpečnom nákupe (2), hlavné tlačidlo (3) hore */
body.ordering-process .next-step{
  display:flex;
  flex-direction:column-reverse;
  align-items:stretch;
  gap:6px;
  margin:18px 0 22px;
}
body.ordering-process .next-step .btn.btn-lg.btn-conversion{
  order:3;
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:0 8px;
  width:100%;
  min-height:56px;
  padding:12px 24px;
  border-radius:var(--dk-radius-sm);
  background:var(--dk-green);
  border-color:var(--dk-green);
  color:#fff;
  font-size:18px;
  font-weight:700;
  line-height:1.25;
  text-transform:none;
  box-shadow:0 4px 14px rgba(147,186,64,.35);
  transition:background-color .2s, border-color .2s, box-shadow .2s, transform .1s;
}
body.ordering-process .next-step .btn.btn-lg.btn-conversion:hover,
body.ordering-process .next-step .btn.btn-lg.btn-conversion:focus-visible{
  background:var(--dk-green-dark);
  border-color:var(--dk-green-dark);
  box-shadow:0 6px 18px rgba(147,186,64,.45);
}
body.ordering-process .next-step .btn.btn-lg.btn-conversion:active{ transform:translateY(1px); }
/* Disco štýluje priamo vnútorný span (verzálky, váha 400) – prepíšeme na ňom */
body.ordering-process .next-step .btn.btn-lg.btn-conversion .order-button-text{
  display:inline; font-size:18px; font-weight:700; line-height:1.25; text-transform:none;
}
body.ordering-process .next-step .next-step-forward:after{
  content:"\e90c";
  content:"\e90c" / "";
  font-size:16px;
  margin:0 0 0 4px;
}
/* Šípka doľava pred „Retour“ – rovnaký ikonový font ako šípka doprava
   v hlavnom tlačidle (tam je zrkadlová e90c), veľkosť podľa textu odkazu. */
body.ordering-process .next-step .next-step-back:before{
  content:"\e90b";
  content:"\e90b" / "";
  font-family:shoptet;
  font-weight:400;
  font-size:15px;
  line-height:1;
  vertical-align:middle;
  margin-right:6px;
  color:inherit;
}
/* „Commande avec obligation de paiement“ – druhý riadok menší */
body.ordering-process .next-step .next-step-finish .order-button-suffix{
  display:block;
  flex:0 0 100%;
  width:100%;
  margin:0;
  padding:0;
  font-size:12px;
  font-weight:400;
  line-height:1.2;
  opacity:.9;
  text-align:center;
}
/* späť – nenápadný odkaz */
body.ordering-process .next-step .btn.next-step-back{
  order:1;
  width:100%;
  min-height:44px;
  padding:8px 12px;
  line-height:26px;
  border-radius:var(--dk-radius-sm);
  background:transparent;
  border-color:transparent;
  color:var(--dk-muted);
  font-size:15px;
  font-weight:400;
  text-align:center;
}
body.ordering-process .next-step .btn.next-step-back .continue-shopping{ color:inherit; }
body.ordering-process .next-step .btn.next-step-back:hover{
  color:var(--dk-text);
  background:#e9eded;
  text-decoration:none;
}
/* text o bezpečnom nákupe pod tlačidlom – generuje sa len keď jazykové
   pravidlo nižšie nastaví obsah (::before:empty nie je platný selektor) */
body.ordering-process .next-step:before{
  content:none;
  order:2;
  display:block;
  margin:0 auto 2px;
  padding-left:20px;
  font-size:13px;
  line-height:20px;
  color:var(--dk-muted);
  text-align:center;
  background:no-repeat left center / 14px 14px url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236d6d6d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='4' y='11' width='16' height='10' rx='2'/><path d='M8 11V7a4 4 0 0 1 8 0v4'/></svg>");
}
/* [lang|=…] zachytí aj „de-AT“, „fr-FR“; text len tam, kde je tlačidlo ďalej/objednať */
html[lang|="fr"] body.ordering-process .next-step:has(.next-step-forward, .next-step-finish):before{ content:"Paiement 100 % sécurisé · Retour sous 14 jours"; }
html[lang|="sk"] body.ordering-process .next-step:has(.next-step-forward, .next-step-finish):before{ content:"Bezpečná platba · Vrátenie do 14 dní"; }
html[lang|="cs"] body.ordering-process .next-step:has(.next-step-forward, .next-step-finish):before{ content:"Bezpečná platba · Vrácení do 14 dnů"; }
html[lang|="de"] body.ordering-process .next-step:has(.next-step-forward, .next-step-finish):before{ content:"Sichere Zahlung · 14 Tage Rückgaberecht"; }
html[lang|="hu"] body.ordering-process .next-step:has(.next-step-forward, .next-step-finish):before{ content:"Biztonságos fizetés · 14 napos visszaküldés"; }
html[lang|="it"] body.ordering-process .next-step:has(.next-step-forward, .next-step-finish):before{ content:"Pagamento sicuro · Reso entro 14 giorni"; }

/* ===== 4) KROK 1 – KOŠÍK ================================================= */
/* tabuľka produktov ako karta (border-radius funguje len s border-collapse:separate) */
body.ordering-process .cart-table{
  border:1px solid var(--dk-border);
  border-collapse:separate;
  border-spacing:0;
  border-radius:var(--dk-radius);
  background:#fff;
  box-shadow:var(--dk-shadow);
  margin:0 0 16px;
  overflow:hidden;
}
body.ordering-process .cart-table tr>td{
  border-right:0;
  border-top:1px solid var(--dk-border);
  padding:18px 10px;
  vertical-align:middle;
  background:#fff;
}
body.ordering-process .cart-table tr:first-child>td{ border-top:0; }
body.ordering-process .cart-table tr.cart-table-header td{
  padding:14px 10px;
  background:#fafbfb;
  color:var(--dk-muted);
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
}
body.ordering-process .cart-table tr.cart-table-header + tr>td{ border-top:0; }
body.ordering-process .cart-table tr.cart-table-header td:first-child{ border-top-left-radius:11px; }
body.ordering-process .cart-table tr.cart-table-header td:last-child{ border-top-right-radius:11px; }
/* obrázok */
body.ordering-process .cart-table .cart-p-image{ width:112px; }
body.ordering-process .cart-table tr td.cart-p-image{ padding:18px 8px 18px 18px; }
body.ordering-process .cart-table .cart-p-image a{ display:block; }
body.ordering-process .cart-table .cart-p-image img{
  width:86px;
  height:86px;
  object-fit:contain;
  border:0;
  background:transparent;
  padding:0;
  box-sizing:border-box;
}
/* názov + variant */
body.ordering-process .cart-table .p-name{ padding-left:6px; }
body.ordering-process .cart-table .p-name .main-link{
  font-size:16px;
  font-weight:700;
  color:var(--dk-text);
  text-decoration:none;
  line-height:1.35;
}
body.ordering-process .cart-table .p-name .main-link:hover{ color:var(--dk-brown); }
body.ordering-process .cart-table .main-link-variant{
  display:block;
  margin-top:4px;
  font-size:13px;
  font-weight:400;
  color:var(--dk-muted);
  text-decoration:none;
}
body.ordering-process .cart-table .show-related{
  display:block;
  width:max-content;
  max-width:100%;
  margin-top:8px;
  font-size:13px;
  color:var(--dk-text);
  text-decoration:none;
}
body.ordering-process .cart-table .show-related:after{ text-decoration:none; }
body.ordering-process .cart-table .show-related:hover{ color:var(--dk-brown); text-decoration:none; }
body.ordering-process .cart-table .p-name .product-table-name-footer,
body.ordering-process .cart-table .p-name .dkLabCartNoteDetails{ padding-top:0; }
/* dostupnosť – rovnako ako na detaile produktu (product-detail-availability.css):
   tučný text 14 px s bodkou 9 px vo farbe stavu; farba a text prichádzajú
   zo šablóny / administrácie (inline štýl), žiadny vlastný štítok */
body.ordering-process .cart-table .availability-label{
  display:inline-flex;
  align-items:center;
  gap:7px;
  font-size:14px;
  font-weight:700;
  line-height:1.4;
}
body.ordering-process .cart-table .availability-label::before{
  content:"";
  width:9px;
  height:9px;
  border-radius:50%;
  background:currentColor;
  flex:0 0 auto;
}
/* stepper množstva – mínus jemne červené */
body.ordering-process .cart-table .p-quantity .quantity{
  display:inline-flex;
  align-items:center;
  height:44px;
  padding:0 40px;
  border:1px solid var(--dk-border-strong);
  /* rovnaké zaoblenie ako stepper na detaile produktu (.p-data-wrapper .quantity) */
  border-radius:var(--dk-radius-sm);
  background:#fff;
  font-size:16px;
  transition:border-color .2s, box-shadow .2s;
}
/* Disco dáva stepperu pri prejdení myšou čierny tieň 0 0 10px rgba(0,0,0,.16);
   namiesto neho len stmavíme rámik, tieň tam pôsobil príliš ťažko. */
body.ordering-process .cart-table .p-quantity .quantity:hover{
  box-shadow:none;
  border-color:var(--dk-text);
}
body.ordering-process .cart-table .p-quantity .quantity:focus-within{
  border-color:var(--dk-green-text);
  box-shadow:var(--dk-glow-soft);
}
body.ordering-process .cart-table .p-quantity .quantity label{ margin:0; display:block; }
body.ordering-process .cart-table .p-quantity .quantity input{
  width:40px;
  height:42px;
  font-family:inherit;
  font-size:16px;
  font-weight:700;
  color:var(--dk-text);
}
body.ordering-process .cart-table .quantity .decrease,
body.ordering-process .cart-table .quantity .increase{
  width:40px;
  height:42px;
  top:0;
  border:0;
  background:transparent;
  color:var(--dk-text);
  transition:background-color .15s, color .15s;
}
/* podsvietenie pri hoveri kopíruje rohy obalu (8 px mínus 1 px rámik) */
body.ordering-process .cart-table .quantity .decrease{ border-radius:7px 0 0 7px; }
body.ordering-process .cart-table .quantity .increase{ border-radius:0 7px 7px 0; }
body.ordering-process .cart-table .quantity .decrease{ color:var(--dk-minus); }
body.ordering-process .cart-table .quantity .decrease:before,
body.ordering-process .cart-table .quantity .increase:before{
  line-height:42px;
  font-size:8px;
  color:inherit;
}
body.ordering-process .cart-table .quantity .increase:hover{
  background:var(--dk-green-soft);
  color:var(--dk-green-text);
}
body.ordering-process .cart-table .quantity .decrease:hover{
  background:var(--dk-danger-soft);
  color:var(--dk-danger);
}
body.ordering-process .cart-table .quantity .decrease:hover:before,
body.ordering-process .cart-table .quantity .increase:hover:before{ color:inherit; }
/* ceny */
body.ordering-process .cart-table .p-price .price-final{ font-size:15px; font-weight:400; color:var(--dk-text); }
body.ordering-process .cart-table .p-price .unit-value{ font-size:13px; color:var(--dk-muted); }
body.ordering-process .cart-table .p-total .price-final{ font-size:17px; font-weight:700; color:var(--dk-text); }
body.ordering-process .cart-table tr>td.p-total{ min-width:150px; padding-right:18px; }
/* Nadpis stĺpca má sedieť nad cenou. V bunke je za cenou ešte tlačidlo na
   odstránenie (32 px a 15 px odstup), takže hlavička dostane o toľko väčšie
   odsadenie sprava. */
body.ordering-process .cart-table tr.cart-table-header td.p-total{ padding-right:65px; }
/* Stĺpec názvu berie všetku šírku navyše (width:100 %): pri auto rozložení tabuľky
   Chrome rozdeľoval prebytok medzi všetky stĺpce, takže obrázkový stĺpec mal pri 1536 px
   123 px namiesto 112 a blok ponuky „u produktu“ (pevné odsadenie 113 px) začínal 11 px
   pred názvom. Ostatné stĺpce ostávajú na šírke obsahu (hlavičky na jeden riadok). */
body.ordering-process .cart-table tr>td.p-name{ width:100%; }
/* odstránenie položky – stále viditeľné okrúhle tlačidlo.
   Disco: tr.removeable .remove-item{margin-right:-96px;width:96px} – vysúva
   ho mimo bunku, preto okraj vraciame na 0 */
body.ordering-process .cart-table tr.removeable .remove-item{
  opacity:1;
  width:32px;
  height:32px;
  padding:0;
  margin:0 0 0 10px;
  border-radius:50%;
  line-height:32px;
  text-align:center;
  color:var(--dk-muted);
  vertical-align:middle;
  transition:background-color .15s, color .15s;
}
/* Disco tu kreslí krížik (e912). Kôš je zrozumiteľnejší a zákazníci ho z iných
   e-shopov poznajú; je to tá istá ikona, akú má tlačidlo na zrušenie kupónu.
   Popis pre čítačky nesie Shoptetov <span class="sr-only">, preto alt text "". */
body.ordering-process .cart-table .remove-item:before{
  content:"\e944";
  content:"\e944" / "";
  /* kôš má viac kresby než krížik, preto o niečo väčší */
  font-size:14px;
  line-height:32px;
  color:inherit;
}
body.ordering-process .cart-table .remove-item:hover,
body.ordering-process .cart-table .remove-item:focus-visible{
  background:var(--dk-danger-soft);
  color:var(--dk-danger);
}
body.ordering-process .cart-table .remove-item:hover:before{ color:var(--dk-danger); }
body.ordering-process .cart-table .remove-item-placeholder{ display:none; }
/* Počet kusov skladom „(>3 pc)“ (span.availability-amount) sa v košíku nezobrazuje –
   zákazník ho chce len na detaile produktu. Shoptet ho v košíku vypisuje dvakrát:
   v bunke td.p-availability (desktop) a v .product-table-name-footer pod názvom (mobil);
   obe sú v .cart-table. Mini-košík ani kroky 2 a 3 ho nemajú. */
body.ordering-process .cart-table .availability-amount{ display:none; }
/* súvisiace produkty (rozbaľovací riadok) */
body.ordering-process .cart-table tr.related>td{
  padding:8px 18px 18px;
  background:#fafbfb;
}
body.ordering-process .cart-table .cart-related-product{
  display:flex;
  align-items:center;
  gap:14px;
  padding:10px 12px;
  margin-top:8px;
  border:1px solid var(--dk-border);
  border-radius:var(--dk-radius-sm);
  background:#fff;
  max-width:100%;
}
body.ordering-process .cart-table .cart-related-info{
  display:flex;
  align-items:center;
  gap:12px;
  flex:1 1 auto;
  min-width:0;
  width:auto;
}
body.ordering-process .cart-table .cart-related-img img{
  width:56px; height:56px; object-fit:contain;
  border:0; background:transparent;
}
body.ordering-process .cart-table .cart-related-name{
  font-size:14px; font-weight:700; color:var(--dk-text); text-decoration:none;
}
body.ordering-process .cart-table .cart-related-name:hover{ color:var(--dk-brown); }
body.ordering-process .cart-table .cart-related-availability{ font-size:13px; }
body.ordering-process .cart-table .cart-related-button{
  display:flex; align-items:center; gap:14px; flex:0 0 auto; width:auto;
}
body.ordering-process .cart-table .cart-related-button .price-final{ margin:0; font-size:15px; font-weight:700; }
body.ordering-process .cart-table .cart-related-button .btn.btn-sm{
  height:40px; line-height:38px; min-width:0; max-width:none; padding:0 16px;
  border-radius:var(--dk-radius-sm); font-size:14px;
}
/* style.css e-shopu nahrádza text tlačidla cez font-size:0 + :after – zachovať */
body.ordering-process .cart-table .cart-related-button .btn.btn-sm.add-to-cart-button{ font-size:0; }
body.ordering-process .cart-table .cart-related-button .btn.btn-sm.add-to-cart-button:after{ font-size:14px; }

/* Kupón + súhrn ceny. Oba stĺpce idú pod seba k pravému okraju a spoja sa do
   jednej karty: hore riadok s kupónom, pod ním sumy. V HTML je kupón pred
   cenovým boxom, takže vizuálne poradie sedí s poradím pri prechode tabulátorom. */
body.ordering-process .cart-inner .row.summary{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  margin:0;
}
body.ordering-process .cart-inner .row.summary>.col-md-8,
body.ordering-process .cart-inner .row.summary>.col-md-4{
  float:none;
  width:100%;
  max-width:380px;
  padding:0;
}
/* Doplnkový predaj z doplnku „Upsell a cross sell“ (.up-cart-offers-slot, pozícia
   „pod výpisom produktov“) na desktope VEDĽA súhrnu. .cart-inner je v Discu flex stĺpec
   s order (tabuľka 1, súhrn 4, blok doplnku medzi nimi); mriežka s oblasťami ho rozloží:
   tabuľka cez oba stĺpce, pod ňou vľavo nadpis ponuky, pod nadpisom vľavo karusel a vpravo
   kupón, sumy a tlačidlo. Pravý stĺpec je rozobratý na samostatné položky mriežky
   (display:contents na .row.summary, jeho stĺpcoch a .next-step), aby karusel spájal len
   riadky kupón – sumy – tlačidlo a končil presne pri spodnom okraji tlačidla „Poursuivre“;
   text o bezpečnom nákupe (.next-step:before) a odkaz späť majú vlastné riadky pod ním.
   Medzery, ktoré dával .next-step (14 px nad tlačidlom, 6 px medzi prvkami, 22 px pod
   odkazom), nesú položky. Blok doplnku aj jeho obal majú display:contents, aby sa nadpis
   a karusel stali položkami mriežky (Swiper meria až .swiper). Platí len keď blok
   existuje; bez doplnku ostáva Discov stĺpec. Pod 992 px ostáva stĺpec a blok je nad
   súhrnom. Poradie prvkov v DOM (a pri tabulátore) sa nemení.
   Karty: Swiper má slidesPerView:"auto" a slidesOffsetBefore/After 8 px, šírku karty
   berie z CSS. Karusel má záporný okraj 8 px, aby odsadenie Swiperu padlo mimo stĺpec
   a karty lícovali s tabuľkou; 4 karty × (100 % − 64 px)/4 + 3 medzery 16 px = šírka
   stĺpca (726 px pri 1280 px). Karty majú height:auto a flex obalu ich vyrovná na
   najvyššiu: obrázok 99 px + názov max. 2 riadky + cena a „+“ v jednom riadku = 205 px,
   presne výška súhrnu (kupón 50 + sumy 85 + 14 + tlačidlo 56). Karusel má align-self:start,
   takže rozbalený kupón roztiahne len pravý stĺpec a karty ostávajú (vo v=36 mali
   height:100 % riadkov mriežky a rástli s kupónom). Veľkosť textu (13 px),
   okraje nadpisu (16/10 px), rámik, zaoblenie a farby sú nastavené v doplnku; výber
   variantu je v doplnku prepnutý na vyskakovacie okno, aby v karte nebol rozbaľovací
   zoznam (40 px navyše). Selektory s .up-swiper-container .swiper-slide sú nutné: doplnok
   ich používa (0,4,0) a kratšie prebíjal (display:flex názvu rušil orezanie na 2 riadky,
   flex-wrap:wrap lámal tlačidlo pod cenu, obrázok mal 200×150 px).
   Namerané pri 1280 px: nadpis 519–536, karty aj kupón od 546, tlačidlo aj karty do 750. */
@media (min-width:992px){
  body.ordering-process .cart-inner:has(>.up-cart-offers-slot){
    display:grid;
    grid-template-columns:minmax(0,1fr) 380px;
    grid-template-areas:
      "tabulka tabulka"
      "nadpis  ."
      "karusel kupon"
      "karusel ceny"
      "karusel tlacidlo"
      ".       istota"
      ".       spat";
    column-gap:32px;
    align-items:start;
  }
  body.ordering-process .cart-inner:has(>.up-cart-offers-slot)>.cart-table{ grid-area:tabulka; }
  body.ordering-process .cart-inner:has(>.up-cart-offers-slot)>.up-cart-offers-slot,
  body.ordering-process .cart-inner:has(>.up-cart-offers-slot)>.up-cart-offers-slot>.up-after-cart-container,
  body.ordering-process .cart-inner:has(>.up-cart-offers-slot)>.row.summary,
  body.ordering-process .cart-inner:has(>.up-cart-offers-slot)>.row.summary>.col-md-8,
  body.ordering-process .cart-inner:has(>.up-cart-offers-slot)>.row.summary>.col-md-4,
  body.ordering-process .cart-inner:has(>.up-cart-offers-slot)>.row.summary .next-step{ display:contents; }
  body.ordering-process .cart-inner:has(>.up-cart-offers-slot) .up-after-cart-container>h4{ grid-area:nadpis; }
  body.ordering-process .cart-inner:has(>.up-cart-offers-slot) .up-swiper-container{ grid-area:karusel; align-self:start; min-width:0; margin:0 -8px; }
  body.ordering-process .cart-inner:has(>.up-cart-offers-slot) .row.summary .coupon-input{ grid-area:kupon; }
  body.ordering-process .cart-inner:has(>.up-cart-offers-slot) .row.summary .price-wrapper{ grid-area:ceny; }
  body.ordering-process .cart-inner:has(>.up-cart-offers-slot) .row.summary .next-step .btn-conversion{ grid-area:tlacidlo; margin-top:14px; }
  body.ordering-process .cart-inner:has(>.up-cart-offers-slot) .row.summary .next-step:before{ grid-area:istota; margin:6px auto 0; }
  body.ordering-process .cart-inner:has(>.up-cart-offers-slot) .row.summary .next-step .next-step-back{ grid-area:spat; margin:8px 0 22px; }
  /* karty rovnako vysoké (najvyššia z nich), cena a tlačidlo pri spodnom okraji */
  body.ordering-process .up-cart-offers-slot .swiper-wrapper{ padding:0; box-sizing:border-box; }
  body.ordering-process .up-cart-offers-slot .up-swiper-container .swiper-slide.up-product{
    display:flex; flex-direction:column; width:calc((100% - 64px)/4); height:auto; box-sizing:border-box;
  }
  body.ordering-process .up-cart-offers-slot .up-swiper-container .swiper-slide img.up-image{ height:99px; }
  body.ordering-process .up-cart-offers-slot .up-swiper-container .swiper-slide .up-product-content{ flex:1 1 auto; min-height:0; }
  body.ordering-process .up-cart-offers-slot .up-swiper-container .swiper-slide .up-product-content .up-product-description-container{
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  }
  body.ordering-process .up-cart-offers-slot .up-swiper-container .swiper-slide .up-product-price-container{ flex-wrap:nowrap; align-items:flex-end; gap:6px; }
  body.ordering-process .up-cart-offers-slot .up-swiper-container .swiper-slide .up-product-price-container>span{ min-width:0; }
  /* Šípky karuselu (zobrazia sa pri 5 a viac produktoch; ponuka vylučuje produkty,
     ktoré už sú v košíku). Doplnok ich kreslí ako kruh 56 px s tieňom na polovicu
     von z bloku (right:-28px); po zápornom okraji karuselu pravá šípka zasahovala
     4 px do rámika kupónu (namerané 770–826 vs kupón od 822). Menšie 40 px a len
     12 px za okraj stĺpca: pravá končí 20 px pred kupónom (tieň 10 px), ľavá
     rovnako symetricky do ľavého okraja stránky. Ikona (SVG 13×16) je centrovaná
     flexom z doplnku. */
  body.ordering-process .up-cart-offers-slot .up-swiper-container .up-swiper-button{ width:40px; height:40px; margin-top:-20px; }
  body.ordering-process .up-cart-offers-slot .up-swiper-container .up-swiper-button-next{ right:-4px; }
  body.ordering-process .up-cart-offers-slot .up-swiper-container .up-swiper-button-prev{ left:-4px; }
}
/* Ponuky doplnku „Upsell a cross sell“ v košíku: názov bez podčiarknutia – doplnok
   na to voľbu nemá. (Riadok dostupnosti sa skrýva v doplnku: „Zobrazit informaci
   o skladovosti“.) Len v objednávke; widgety doplnku na detaile produktu sa nemenia. */
body.ordering-process .up-product .up-product-url{ text-decoration:none; }
body.ordering-process .up-product .up-product-url:hover{ color:var(--dk-brown); text-decoration:none; }
/* Ponuka doplnku „u produktu v košíku“ („Recommandations d'achat“): doplnok vloží ZA riadok
   produktu riadok tr.up-products-cart s vnorenými tabuľkami (obal td.up-products-cart-wrapper
   → .up-addons-cell → tabuľka s nadpisom h4 a riadkami tr.up-product). Pôsobila ako
   samostatná tabuľka: linka nad ňou (naše tr>td), odsadenie 18/10 px, tučný nadpis 13 px.
   Teraz je súčasťou riadku produktu: bez hornej linky, obsah zarovnaný so stĺpcom názvu
   (113 px = obrázok 112 px + odsadenie názvu mínus 5 px vnútorného odsadenia doplnku),
   nadpis ako popisok stĺpcov (veľkosť 11 px a farba #6d6d6d sú nastavené v doplnku,
   verzálky a rozostup tu). Riadok tr.up-product má odsadenie z doplnku (!important).
   Namerané pri 1280 px: názov produktu od x 183, nadpis aj riadok ponuky od 183,
   „+“ 1142–1178 (kôš produktu 1183). */
body.ordering-process .cart-table tr.up-products-cart>td.up-products-cart-wrapper{ padding:0 18px 12px 113px; border-top:0; }
body.ordering-process .cart-table tr.up-products-cart .up-addons-cell{ padding:0; }
body.ordering-process .cart-table tr.up-products-cart table{ margin:0; }
body.ordering-process .cart-table h4.up-cart-header-cart_product{ text-transform:uppercase; letter-spacing:.04em; }
/* Riadky ponuky kompaktne vľavo a v stĺpcoch: obrázok, názov, cena a „+“ za sebou,
   ceny a „+“ všetkých riadkov pod sebou (šírka stĺpca názvu podľa najdlhšieho názvu).
   Doplnok rozťahoval stĺpec názvu a tlačil cenu s „+“ na pravý okraj tabuľky, a každý
   riadok bol samostatná mriežka, takže poloha ceny závisela od dĺžky názvu. Mriežkou je
   tbody (display:grid musí byť !important – doplnok/Disco vnucujú table-row-group),
   riadky tr.up-product (display:grid !important z doplnku) sú subgrid cez všetkých
   5 stĺpcov (image, name, variants, details, add-to-cart); bunky názvu, ceny a tlačidla
   sú display:contents, položkami sú ich deti. Riadok je široký len ako obsah, takže
   prípadná linka medzi riadkami nejde cez celý košík. Namerané pri 1280 px s dvoma
   riadkami: názov od 240, cena 702–741, „+“ 773–810 v oboch. */
body.ordering-process .cart-table tr.up-products-cart .up-addons-cell>table{ display:block; }
body.ordering-process .cart-table tr.up-products-cart .up-addons-cell>table>tbody{
  display:grid !important;
  grid-template-columns:max-content minmax(0,max-content) max-content max-content max-content;
  justify-content:start;
}
body.ordering-process .cart-table tr.up-products-cart tr.up-cart-header-container{ grid-column:1/-1; }
body.ordering-process .cart-table tr.up-products-cart tr.up-product{ grid-template-columns:subgrid; grid-column:1/-1; }
body.ordering-process .cart-table tr.up-products-cart tr.up-product>td.up-product-name>span{ margin-right:20px; }
body.ordering-process .cart-table tr.up-products-cart tr.up-product .up-price{ margin-right:12px; }
/* vrchná časť karty */
body.ordering-process .cart-inner .summary .coupon-input{
  padding:4px 22px;
  border:1px solid var(--dk-border);
  border-bottom:0;
  border-radius:var(--dk-radius) var(--dk-radius) 0 0;
  background:#fff;
}
body.ordering-process .cart-inner .summary .toggle-coupon-input-button{ width:100%; }
body.ordering-process .cart-inner .summary .discount-coupon .compact-form{
  max-width:none;
  margin:0 0 12px;
}
/* Uplatnený kupón. Shoptet nad neho vypíše ešte interný názov kupónu
   (.applied-coupon__heading, u nás „Coupon de réduction Embedded“), čo zákazníkovi
   nič nehovorí – riadok pod ním obsahuje aj číslo kupónu aj výšku zľavy.
   Pri uplatnenom kupóne Shoptet z obalu odoberie triedu .toggle-coupon-input,
   takže .discount-coupon je viditeľný sám od seba. */
body.ordering-process .cart-inner .summary .applied-coupon__heading{ display:none; }
body.ordering-process .cart-inner .summary .applied-coupon{
  display:flex;
  flex-direction:row;
  flex-wrap:nowrap;
  align-items:center;
  gap:10px;
  margin:6px 0 12px;
  padding:10px 12px;
  border:1px solid var(--dk-green);
  border-radius:var(--dk-radius-sm);
  background:var(--dk-green-soft);
}
body.ordering-process .cart-inner .summary .applied-coupon:before{
  content:"\e92a";
  content:"\e92a" / "";
  flex:0 0 auto;
  font-family:shoptet;
  font-weight:400;
  font-size:17px;
  line-height:1;
  color:var(--dk-green-text);
}
body.ordering-process .cart-inner .summary .applied-coupon>strong{
  flex:1 1 auto;
  min-width:0;
  overflow-wrap:anywhere;
  font-size:13px;
  font-weight:700;
  line-height:1.35;
  color:var(--dk-green-text);
}
/* odstránenie kupónu – Disco z toho robí zelené tlačidlo s písmenom „x“ */
body.ordering-process .cart-inner .summary .applied-coupon form{ flex:0 0 auto; margin:0; }
body.ordering-process .cart-inner .summary .applied-coupon fieldset{ margin:0; padding:0; border:0; }
body.ordering-process .cart-inner .summary .applied-coupon button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  min-height:0;
  padding:0;
  border:1px solid var(--dk-border-strong);
  border-radius:50%;
  background:#fff;
  color:var(--dk-muted);
  font-size:0;
  line-height:1;
  text-transform:none;
  cursor:pointer;
  transition:background-color .15s, border-color .15s, color .15s;
}
body.ordering-process .cart-inner .summary .applied-coupon button:before{
  content:"\e944";
  content:"\e944" / "";
  font-family:shoptet;
  font-weight:400;
  font-size:12px;
  line-height:1;
}
body.ordering-process .cart-inner .summary .applied-coupon button:hover,
body.ordering-process .cart-inner .summary .applied-coupon button:focus-visible{
  background:var(--dk-danger-soft);
  border-color:var(--dk-danger);
  color:var(--dk-danger);
}
body.ordering-process .cart-inner .summary .applied-coupon button:focus-visible{
  outline:0;
  box-shadow:0 0 0 3px rgba(214,53,0,.18);
}
body.ordering-process .toggle-coupon-input .toggle-coupon-input-button{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:10px 0;
  color:var(--dk-text);
  font-size:15px;
  font-weight:700;
  text-decoration:none;
  background:none;
  border:0;
  cursor:pointer;
}
body.ordering-process .toggle-coupon-input .toggle-coupon-input-button:after{ margin:0; font-size:10px; }
body.ordering-process .toggle-coupon-input .toggle-coupon-input-button:hover{ color:var(--dk-brown); }
/* nenápadná ikona zľavy pred textom */
body.ordering-process .toggle-coupon-input .toggle-coupon-input-button:before{
  content:"\e92a";
  content:"\e92a" / "";
  font-family:shoptet;
  font-weight:400;
  font-size:16px;
  line-height:1;
  color:var(--dk-text);
  -webkit-text-stroke:.5px currentColor;
}
body.ordering-process .discount-coupon .compact-form{
  display:flex;
  gap:8px;
  max-width:380px;
  margin-top:8px;
}
body.ordering-process .discount-coupon .compact-form .form-control{
  flex:1 1 auto;
  height:48px;
  border:1px solid var(--dk-border-strong);   /* Disco ruší pravý rámik (spojené s tlačidlom) */
  border-radius:var(--dk-radius-sm);
  background:#fff;
}
body.ordering-process .discount-coupon .compact-form .btn{
  flex:0 0 48px;
  width:48px;
  height:48px;
  padding:0;
  border-radius:var(--dk-radius-sm);
  background:var(--dk-text);
  border-color:var(--dk-text);
  color:#fff;
  line-height:48px;
}
body.ordering-process .discount-coupon .compact-form .form-control:focus{
  border-color:var(--dk-green-text);
  box-shadow:var(--dk-glow);
  outline:0;
}
body.ordering-process .discount-coupon .compact-form .btn:hover{ background:var(--dk-green-dark); border-color:var(--dk-green-dark); }
body.ordering-process .discount-coupon .compact-form .btn:before{ color:#fff; font-size:14px; line-height:48px; }

/* karta so súčtom v košíku */
body.ordering-process .cart-inner .summary .price-wrapper{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  justify-content:space-between;
  gap:2px 12px;
  padding:16px 22px;
  border:1px solid var(--dk-border);
  border-radius:var(--dk-radius);
  background:#fff;
  text-align:left;
}
/* keď je nad sumami blok kupónu, tvoria spolu jednu kartu */
body.ordering-process .cart-inner .row.summary:has(.coupon-input) .price-wrapper{
  border-radius:0 0 var(--dk-radius) var(--dk-radius);
}
body.ordering-process .cart-inner .summary .price-wrapper .price-label.price-primary{
  flex:1 1 auto;
  font-size:15px;
  font-weight:700;
  color:var(--dk-text);
  text-align:left;
}
body.ordering-process .cart-inner .summary .price-wrapper .price.price-primary{
  flex:0 0 auto;
  margin-left:auto;
  padding:0;
  font-size:28px;
  line-height:1.1;
  font-weight:800;
  color:var(--dk-text);
}
body.ordering-process .cart-inner .summary .price-wrapper .price-label.price-secondary{
  flex:1 1 auto; font-size:13px; color:var(--dk-muted); text-align:left;
}
body.ordering-process .cart-inner .summary .price-wrapper .price.price-secondary{
  flex:0 0 auto; margin-left:auto; padding:0; font-size:13px; color:var(--dk-muted);
}
body.ordering-process .cart-inner .next-step--cart{ margin-top:14px; }

/* košík na mobile a tablete (< 992 px) – každý produkt ako karta */
@media (max-width:991px){
  body.ordering-process .cart-table{
    border:0; border-radius:0; background:transparent; overflow:visible; box-shadow:none;
  }
  body.ordering-process .cart-table tr.cart-table-header{ display:none; }
  body.ordering-process .cart-table tr{
    position:relative;
    border:1px solid var(--dk-border);
    border-radius:var(--dk-radius);
    background:#fff;
    box-shadow:var(--dk-shadow);
    padding:14px 14px 12px;
    margin-bottom:12px;
    align-items:center;
  }
  body.ordering-process .cart-table tr:last-child{ margin-bottom:0; }
  body.ordering-process .cart-table tr>td,
  body.ordering-process .cart-table tr:first-child>td{
    border:0; padding:0 0 6px; background:transparent;
  }
  body.ordering-process .cart-table tr>td.cart-p-image{
    flex:0 0 84px; padding:0; margin-bottom:8px; align-self:flex-start;
  }
  body.ordering-process .cart-table .cart-p-image img{ width:76px; height:76px; }
  body.ordering-process .cart-table tr>td.p-name{
    flex:1 1 calc(100% - 84px); padding:0 0 0 10px; margin-bottom:8px; align-self:flex-start;
  }
  /* miesto pre kôš v pravom hornom rohu karty potrebuje len prvý riadok */
  body.ordering-process .cart-table .p-name .main-link{ padding-right:40px; }
  body.ordering-process .cart-table .p-name .main-link{ font-size:15px; }
  /* Disco pod 992 px odkaz na súvisiace produkty skrýva (riadok by sa nezobrazil správne) */
  body.ordering-process .cart-table .show-related{ display:none; }
  /* Popisky QUANTITÉ / PRIX À L'UNITÉ / TOTAL sú na mobile skryté: stepper,
     „30,60 € / pc“ a tučná suma sa vysvetľujú samy a popisky brali výšku. */
  body.ordering-process .cart-table .p-label{ display:none; }
  /* Disco tu skrýva bunku .p-availability a dostupnosť ukazuje pod názvom */
  body.ordering-process .cart-table .product-table-name-footer{ margin-top:6px; }
  body.ordering-process .cart-table .product-table-name-footer .p-label{ display:none; }
  /* 2. riadok karty: množstvo vľavo, cena za kus v strede, spolu vpravo – všetko
     na jednom riadku (pôvodne boli dva riadky s popiskami, karta bola o 21 px
     vyššia). Cena za kus sa smie zmrštiť a zalomiť („30,60 €“ / „/ pc“), takže
     riadok drží aj na 320 px. Žiadne linky vnútri karty – rozostup stačí. */
  body.ordering-process .cart-table tr>td.p-quantity,
  body.ordering-process .cart-table tr>td.p-price,
  body.ordering-process .cart-table tr>td.p-total{
    display:block; width:auto; min-width:0; padding:0; margin-top:12px;
    border-top:0; align-self:center;
  }
  body.ordering-process .cart-table tr>td.p-quantity{ flex:0 0 auto; text-align:left; }
  body.ordering-process .cart-table tr>td.p-price{ flex:1 1 0; padding:0 8px; text-align:center; }
  body.ordering-process .cart-table tr>td.p-total{ flex:0 0 auto; text-align:right; }
  body.ordering-process .cart-table tr>td.p-total .price-final{ font-size:18px; }
  /* Disco dáva td.p-name position:relative – krížik by sa kotvil oň, nie o kartu */
  body.ordering-process .cart-table tr>td.p-name{ position:static; }
  /* krížik v pravom hornom rohu karty */
  body.ordering-process .cart-table .inline.delete-cart-item{
    display:block; position:absolute; top:12px; right:12px; height:auto; margin:0; z-index:1;
  }
  body.ordering-process .cart-table .inline.delete-cart-item .remove-item{ margin:0; }
  body.ordering-process .cart-table .inline.delete-cart-item .remove-item:before{ font-size:13px; }
  /* Produkt pridaný z ponuky doplnku „Upsell a cross sell“: doplnok vloží do riadku
     bunku td.up-addon-cart-cell so zľavou („−28 % 6,90 €“), ktorú pod 992 px ukáže
     (display:block !important, width:100% !important, text-align:right !important).
     V našej karte (flex s order) nemala order, skončila navrchu vpravo a prekrývala
     kôš – ten sa nedal ťuknúť. Dávame ju pod riadok množstvo/cena/spolu, zarovnanú
     pod sumu; kôš má navyše z-index. Na desktope ju doplnok sám skrýva. */
  body.ordering-process .cart-table tr>td.up-addon-cart-cell{ order:7; margin-top:6px; padding:0; font-size:13px; }
  body.ordering-process .cart-table td.up-addon-cart-cell .up-addon-cart-price{ justify-content:flex-end; }
  /* Ponuka „u produktu v košíku“ vnútri bublinky produktu: vnorené tr/td doplnku by inak
     dostali štýly karty (rámik, zaoblenie, tieň, 14 px – karta v karte v karte). Blok
     (display:block !important – doplnok/Disco vnucujú table-row, bez toho neplatia okraje)
     má záporný horný okraj 23 px = 12 px medzera karty + 11 px (spodné odsadenie karty 12
     a rámik 1 mínus 2 px odstup od steppera – pri 25 px sa rámik bloku dotýkal steppera),
     takže začína 2 px pod riadkom množstva a bielym pozadím prekryje spodný rámik aj
     zaoblené rohy karty produktu (polomer 12 px, prekrytých 11 – vrchný 1 px oblúka je
     ešte zvislý); jeho ľavý/pravý/spodný rámik so spodným zaoblením tak pokračuje ako
     jedna bublinka. Nezávisí od :has() (v=39–41 menili kartu produktu cez :has(+ …)
     a zákazníkovi to na telefóne stále vyzeralo oddelene). Namerané na 375 px: karta
     581–788, stepper do 775, blok od 777, nadpis od 794 (asi 18 px pod stepperom); kôš aj
     stepper ostávajú ťuknuteľné. tr.up-product ostáva grid z doplnku (!important). */
  body.ordering-process .cart-table tr.up-products-cart{
    display:block !important; position:relative; z-index:1;
    padding:0; margin:-23px 0 12px; border-top:0; border-top-left-radius:0; border-top-right-radius:0; background:#fff;
  }
  body.ordering-process .cart-table tr.up-products-cart tr{
    display:block; position:static; padding:0; margin:0; border:0; border-radius:0; box-shadow:none; background:transparent;
  }
  body.ordering-process .cart-table tr.up-products-cart td{ display:block; width:100%; box-sizing:border-box; padding:0; border:0; background:transparent; }
  body.ordering-process .cart-table tr.up-products-cart>td.up-products-cart-wrapper{ padding:8px 14px 12px; border-top:0; }
  body.ordering-process .cart-table tr.up-products-cart table{ width:100%; margin:0; }
  /* Šípky karuselu ponuky na mobile: doplnok ich kladie na zvislý stred kariet, kruh
     56 px cez pravú kartu a 20 px za okraj (na 375 px 4 px mimo obrazovky). Zákazník
     hlásil, že ťuknutie na šípku na telefóne neposunie karusel, ale otvorí produkt pod
     ňou; v paneli (Chrome, klik aj syntetický dotyk) šípka funguje, takže presnú
     príčinu sa nepodarilo zopakovať. Šípky sú preto mimo kariet: 40 px v riadku nadpisu
     „Profitez de l'offre spéciale :“ vpravo (ďalej úplne vpravo, späť vedľa nej), zvislo
     na strede textu nadpisu; nadpis má sprava miesto 96 px, aby pod ne nezatiekol.
     touch-action:manipulation ruší čakanie na dvojité ťuknutie. Namerané na 375 px:
     nadpis 626–647, šípky 617–657 (x 319–359 a 271–311), prvá karta od 663. */
  body.ordering-process .up-cart-offers-slot .up-swiper-container .up-swiper-button{ width:40px; height:40px; top:auto; bottom:calc(100% - 2px); margin:0; touch-action:manipulation; }
  body.ordering-process .up-cart-offers-slot .up-swiper-container .up-swiper-button-next{ right:0; }
  body.ordering-process .up-cart-offers-slot .up-swiper-container .up-swiper-button-prev{ left:auto; right:48px; }
  body.ordering-process .up-cart-offers-slot .up-after-cart-container>h4{ padding-right:96px; }
  body.ordering-process .cart-table .p-quantity .quantity{ height:40px; padding:0 36px; }
  body.ordering-process .cart-table .p-quantity .quantity input{ height:38px; width:36px; }
  body.ordering-process .cart-table .quantity .decrease,
  body.ordering-process .cart-table .quantity .increase{ width:36px; height:38px; }
  body.ordering-process .cart-table .quantity .decrease:before,
  body.ordering-process .cart-table .quantity .increase:before{ line-height:38px; }
  body.ordering-process .cart-table tr.related.visible{
    border:0; background:transparent; padding:0; margin:-4px 0 12px; box-shadow:none;
  }
  body.ordering-process .cart-table tr.related>td{ padding:0; background:transparent; }
  body.ordering-process .cart-table .cart-related-product{ flex-wrap:wrap; }
  body.ordering-process .cart-table .cart-related-button{ width:100%; justify-content:space-between; }
  body.ordering-process .cart-inner .row.summary>.col-md-8,
  body.ordering-process .cart-inner .row.summary>.col-md-4{ padding:0; width:100%; max-width:none; margin-top:0; }
}

/* ===== 5) KROK 2 – DOPRAVA A PLATBA (karty ako na Kondele) ============== */
/* obal sekcie je priehľadný, kartou je každá možnosť */
body.ordering-process #checkoutContent .box.box-sm.co-delivery-method,
body.ordering-process #checkoutContent .box.box-sm.co-payment-method{
  background:transparent;
  border:0;
  border-radius:0;
  padding:0;
  margin:0 0 26px;
}
body.ordering-process .shipping-billing-table{ margin:0; }
body.ordering-process .shipping-billing-table .radio-wrapper,
body.desktop.ordering-process .shipping-billing-table .radio-wrapper:hover{
  border:1px solid var(--dk-border);
  border-radius:10px;
  padding:2px 16px;
  margin-bottom:10px;
  background:#fff;
  box-shadow:var(--dk-shadow);
  transition:border-color .15s, box-shadow .15s;
}
/* hover = rovnaký glow ako .drevko-tile:not(.is-active):hover na detaile */
body.desktop.ordering-process .shipping-billing-table .radio-wrapper:not(.active):not(.inactive-child):hover{
  border-color:var(--dk-green);
  box-shadow:var(--dk-glow);
}
/* vybraná možnosť – zelený rámik a svetlozelené pozadie */
body.ordering-process .shipping-billing-table .radio-wrapper.active,
body.desktop.ordering-process .shipping-billing-table .radio-wrapper.active:hover{
  border-color:var(--dk-green);
  background:var(--dk-green-soft);
  box-shadow:0 0 0 1px var(--dk-green);
}
/* Karta má rovnakú výšku bez ohľadu na to, aké vysoké je logo: najvyššie logo
   má 30 px, s odsadením 2x12 px je to 54 px, takže výšku určuje min-height. */
body.ordering-process .shipping-billing-table .radio-wrapper input[type=radio]+label{
  padding:12px 0 12px 34px;
  align-items:center;
  line-height:22px;
  cursor:pointer;
  min-height:58px;
}
/* prepínač, názov, logo aj cena sedia na jednej vodorovnej osi */
body.ordering-process .shipping-billing-table .radio-wrapper input[type=radio]+label:before{
  top:50%;
  transform:translateY(-50%);
  width:20px;
  height:20px;
  border-width:1.5px;
  border-color:var(--dk-border-strong);
  background:#fff;
  box-sizing:border-box;
}
/* vnútorná bodka má rozmer len v zaškrtnutom stave (Disco ju inak necháva 0×0) */
body.ordering-process .shipping-billing-table .radio-wrapper input[type=radio]+label:after{
  top:50%;
  left:5px;
  transform:translateY(-50%);
  width:0;
  height:0;
  border:0;
}
/* Zaškrtnutý prepínač je čierny. Značková zelená #93ba40 má na bielej 2,25:1,
   čo je pod 3:1 pre stav ovládacieho prvku (WCAG 1.4.11); --dk-text má 16:1.
   Zelená ostáva na rámiku a pozadí vybranej karty. */
body.ordering-process .shipping-billing-table .radio-wrapper input[type=radio]:checked+label:before{
  border-color:var(--dk-text);
}
body.ordering-process .shipping-billing-table .radio-wrapper input[type=radio]:checked+label:after{
  width:10px;
  height:10px;
  background-color:var(--dk-text);
}
body.ordering-process .shipping-billing-table .radio-wrapper input[type=radio]:focus-visible+label:before{
  box-shadow:var(--dk-focus);
}
body.ordering-process .shipping-billing-table .payment-info b{
  font-size:15px;
  font-weight:700;
  color:var(--dk-text);
}
body.ordering-process .shipping-billing-table .radio-wrapper input[type=radio]:checked+label>span b{ color:var(--dk-text); }
body.ordering-process .shipping-billing-table .payment-info .sublabel,
body.ordering-process .shipping-billing-table .payment-info>span:not(.shipping-billing-name){
  color:var(--dk-muted);
  font-size:13px;
}
/* názov sa môže zalomiť, logo a cena ostávajú v jednom riadku (bez container query Disca) */
body.ordering-process .shipping-billing-table .payment-info{ flex:1 1 0%; min-width:0; max-width:none; align-self:center; }
body.ordering-process .shipping-billing-table .payment-logo{ order:0; flex:0 0 80px; text-align:right; }
/* Logá majú rôzny tvar: GLS, DPD a PayPal sú široké nápisy (3:1 aj 3,8:1),
   Google Pay a Apple Pay sú štvorcové odznaky 40×40. Rovnaká výška by tie
   štvorcové nechala opticky drobné, preto dostávajú celú výšku rámčeka a široké
   nápisy sa opierajú o jeho šírku. 34×76 px je maximum, pri ktorom všetky
   kartičky dopravy a platby ostávajú rovnako vysoké (68 px) – overené meraním.
   Ak majú byť Google Pay a Apple Pay ešte výraznejšie, treba v administrácii
   nahrať širokú (landscape) podobu ich odznaku; CSS vie zväčšiť len celý
   štvorec aj s jeho bielym okrajom. */
body.ordering-process .shipping-billing-table .payment-logo img{ max-height:34px; max-width:76px; }
body.ordering-process .shipping-billing-table .payment-shipping-price{
  flex:0 0 auto;
  font-size:15px;
  font-weight:700;
  color:var(--dk-text);
}
body.ordering-process .shipping-billing-table .payment-shipping-price.for-free,
body.ordering-process .radio-wrapper.active .for-free{ color:var(--dk-green-text); }
/* Nemožná kombinácia dopravy a platby. Shoptet (checkoutShared.js) dáva obalu
   .radio-wrapper triedu inactive-child, triedu inactive až štítku vnútri a rádiu
   disabled; hlášku .not-possible-info zobrazuje/skrýva sám. Pôvodný selektor
   .radio-wrapper.inactive nikdy nič nechytil. Text tlmíme farbou, nie opacitou –
   --dk-muted má na bielej 5,3:1, opacity .55 by dala 3,7:1. Selektor s
   .inactive-child je špecifickejší než naše bežné farby názvu a ceny, takže ich
   prebije; hover nedostupnej karty vylučuje pravidlo vyššie. */
body.ordering-process .shipping-billing-table .radio-wrapper.inactive-child{ background:#fafbfb; }
body.ordering-process .shipping-billing-table .radio-wrapper.inactive-child .payment-info b,
body.ordering-process .shipping-billing-table .radio-wrapper.inactive-child .payment-shipping-price{ color:var(--dk-muted); }
body.ordering-process .shipping-billing-table .radio-wrapper.inactive-child .payment-logo{ opacity:.55; }
body.ordering-process .shipping-billing-table .not-possible-info{
  font-size:12px; color:var(--dk-danger); font-style:normal;
}
/* nastavenie Shoptetu „zobraziť len vybranú dopravu/platbu“: nevybrané karty
   Disco zbalí (max-height:0) – naše rámiky a odsadenia ich nesmú nechať viditeľné */
body.ordering-process .cart-hide-unselected-options .radio-wrapper{
  transition:max-height .2s ease, padding .2s ease, margin .2s ease, border-color .15s, box-shadow .15s;
}
body.ordering-process .cart-hide-unselected-options .radio-wrapper.unselected-option,
body.desktop.ordering-process .cart-hide-unselected-options .radio-wrapper.unselected-option:hover{
  max-height:0; overflow:hidden;
  padding-top:0; padding-bottom:0; margin-bottom:0;
  border-top-width:0; border-bottom-width:0; box-shadow:none;
}
body.ordering-process .cart-toggle-unselected-options{
  display:inline-block; margin:2px 0 8px; font-size:14px; color:var(--dk-green-text);
}
/* Otáznik s nápovedou. Disco mu dáva border-color:var(--color-primary), čo je na
   drevku čierna – vedľa tenkých sivých ikon (dodávka, peňaženka) pôsobil ťažko.
   Teraz je to tenký sivý krúžok v tej istej farbe a hrúbke kresby ako ikony,
   pri prejdení myšou stmavne. Znak „?“ je text zo Shoptetu, čítačka ho prečíta. */
body.ordering-process .shipping-billing-table .question-tooltip,
body.ordering-process #checkoutContent .question-tooltip{
  display:inline-flex; align-items:center; justify-content:center;
  box-sizing:border-box;
  width:16px; height:16px; border-radius:50%;
  border:1.5px solid var(--dk-muted);
  background:transparent; color:var(--dk-muted);
  font-size:11px; font-weight:700; line-height:1; cursor:help;
  vertical-align:middle;
  transition:color .15s, border-color .15s;
}
body.ordering-process .shipping-billing-table .question-tooltip:hover,
body.ordering-process #checkoutContent .question-tooltip:hover{
  border-color:var(--dk-text); color:var(--dk-text);
}
@media (max-width:767px){
  body.ordering-process .shipping-billing-table .radio-wrapper{ padding:0 14px; }
}
@media (max-width:479px){
  /* na úzkom displeji logo pod názvom, zarovnané s textom */
  body.ordering-process .shipping-billing-table .payment-logo{
    order:1; flex:0 0 100%; text-align:left; padding-left:0; margin-top:-6px;
  }
  body.ordering-process .shipping-billing-table .payment-logo img{ max-height:28px; max-width:76px; }
  /* riadok s logom má rovnakú výšku aj pri nižšom logu, aby boli karty rovnaké */
  body.ordering-process .shipping-billing-table .payment-logo{ min-height:28px; }
  /* karta je tu vyššia než jeden riadok, prepínač preto sedí na osi prvého
     riadka s názvom, nie v zvislom strede karty */
  body.ordering-process .shipping-billing-table .radio-wrapper input[type=radio]+label:before,
  body.ordering-process .shipping-billing-table .radio-wrapper input[type=radio]+label:after{ top:24px; }
}

/* ===== 6) KROK 3 – ÚDAJE ZÁKAZNÍKA (jeden súvislý formulár) ============= */
/* Veta o prihlásení nad formulárom je skrytá (rozhodnutie 6. 9. 2026).
   Odkaz „Connexion“ ostáva v hlavičke, takže registrovaný zákazník sa vie
   prihlásiť aj tak. Selektor je uviazaný na priameho potomka obsahového
   stĺpca, aby sa netrafil riadok „Total pour les marchandises“ v súhrne –
   ten má tiež triedu .helper. */
body.ordering-process #checkoutContent .cart-content > .helper{ display:none; }

/* --- jedna karta: osobné údaje → fakturačná adresa → dodacia adresa →
       poznámka → newsletter. Shoptet ich má v samostatných fieldsetoch,
       spojíme ich rámikmi (horná/dolná časť) a bielym pozadím medzi nimi. --- */
body.ordering-process #checkoutContent .box.box-sm.co-contact-information{
  border-radius:var(--dk-radius) var(--dk-radius) 0 0;
  border-bottom:0;
  margin:0;
  padding:22px 24px 6px;
}
body.ordering-process #checkoutContent .co-billing-address fieldset.box.box-sm,
body.ordering-process #checkoutContent #shipping-address fieldset.box.box-sm,
body.ordering-process #checkoutContent #note fieldset.box.box-sm{
  border-radius:0;
  border-top:0;
  border-bottom:0;
  margin:0;
  padding:18px 24px 4px;
}
/* voľné zaškrtávacie políčka medzi fieldsetmi (iná adresa, poznámka) */
body.ordering-process #checkoutContent .co-billing-address>.form-group,
body.ordering-process #checkoutContent .co-box-additional>.form-group{
  margin:0;
  padding:12px 24px 12px;
  background:#fff;
  border-left:1px solid var(--dk-border);
  border-right:1px solid var(--dk-border);
}
/* Disco: .co-box-additional má margin-top 12 px a #note margin-bottom 11 px –
   v jednom paneli by robili medzery */
body.ordering-process #checkoutContent .co-box-additional{ margin-top:0; }
body.ordering-process #checkoutContent #note{ margin-bottom:0; }
/* nadpis bez ikony zarovnaný s tými, ktoré ikonu majú (20 px ikona + 10 px medzera) */
body.ordering-process.ordering-process #checkoutContent .co-box .stay-in-touch h2{ padding-left:30px; }
body.ordering-process #checkoutContent .co-box-additional .stay-in-touch{
  background:#fff;
  border:1px solid var(--dk-border);
  border-top:1px solid var(--dk-border);
  border-radius:0 0 var(--dk-radius) var(--dk-radius);
  padding:18px 24px 12px;
  margin:0 0 16px;
}
/* podnadpisy vnútri jedného panela (krok 3) sú menšie ako nadpisy sekcií (krok 2) */
body.ordering-process.ordering-process #checkoutContent .co-box.co-contact-information h2,
body.ordering-process.ordering-process #checkoutContent .co-box.co-billing-address h2,
body.ordering-process.ordering-process #checkoutContent .co-box.co-shipping-address h2,
body.ordering-process.ordering-process #checkoutContent .co-box.co-box-additional h2{
  font-size:17px;
  line-height:24px;
  margin:0 0 14px;
}
body.ordering-process #checkoutContent .co-billing-address fieldset.box.box-sm h2,
body.ordering-process #checkoutContent #shipping-address fieldset.box.box-sm h2{
  padding-top:18px;
  border-top:1px solid var(--dk-border);
}
body.ordering-process.ordering-process #checkoutContent .co-box .stay-in-touch h2{ margin:0 0 12px; }
/* Nadpis „Restez en contact“ je skrytý aj s linkou nad ním; zaškrtávacie
   políčka pod ním ostávajú. */
body.ordering-process.ordering-process #checkoutContent .co-box .stay-in-touch h2{ display:none; }
body.ordering-process #checkoutContent .co-box-additional .stay-in-touch{
  border-top:0;
  padding-top:8px;
}
/* povinné polia – poznámka */
body.ordering-process .form-legend{
  margin:-6px 0 12px;
  font-size:12px;
  color:var(--dk-muted);
  text-align:right;
}

/* --- štítky NAD poľami namiesto plávajúcich (Disco: position:absolute) --- */
body.ordering-process #checkoutContent .form-group{ margin-bottom:14px; }
body.ordering-process #checkoutContent .smart-label-wrapper label{
  position:static !important;
  display:block;
  transform:none !important;
  padding:0 !important;
  margin:0 0 6px;
  font-size:14px;
  line-height:1.3;
  font-weight:600;
  color:#3a3a3a;
  transition:none;
}
/* Štítok nad poľom drží farbu aj pri písaní do poľa – pôvodne pri fokuse zelenal
   (--dk-green-text), čo pôsobilo ako zmena stavu, hoci sa nič nemení. Fokus nesie
   samotné pole (zelený rámik a glow). */
body.ordering-process #checkoutContent .required-asterisk:after{ color:var(--dk-danger); }
body.ordering-process #checkoutContent .form-control{
  border:1px solid var(--dk-border-strong);
  border-radius:var(--dk-radius-sm);
  max-width:none;
  height:48px;
  padding:0 14px;
  font-size:16px;
  color:var(--dk-text);
  background:#fff;
  transition:border-color .15s, box-shadow .15s;
}
body.ordering-process #checkoutContent textarea.form-control{
  height:104px; min-height:78px; padding:12px 14px; resize:vertical;
}
/* Disco rezervuje miesto pre otáznik a pre šípku selectu cez padding-right –
   náš padding by ho zrušil a text by šiel pod ne (IČ DPH, výber krajiny na firmu) */
body.ordering-process #checkoutContent .form-group:has(.form-group-tooltip) .form-control{ padding-right:46px; }
body.ordering-process #checkoutContent select.form-control{ padding-right:46px; background-size:46px 46px; }
body.ordering-process #checkoutContent .form-control::placeholder{ color:var(--dk-muted); opacity:1; }
/* rámik je nositeľom kontrastu (5,4:1), glow je ozdoba ako na detaile produktu */
/* Disco má :where(.ums_forms_redesign--on) .form-control:focus{color:#1f1f1f},
   čiže pri kliknutí do poľa mení farbu textu. Držíme ju rovnakú ako mimo fokusu. */
body.ordering-process #checkoutContent .form-control:focus{
  border-color:var(--dk-green-text);
  box-shadow:var(--dk-glow);
  outline:0;
  color:var(--dk-text);
}
/* Automatické dopĺňanie prehliadača prekresľuje pole vlastným pozadím aj farbou
   textu. Necháme pole biele a text v našej farbe. */
body.ordering-process #checkoutContent .form-control:-webkit-autofill,
body.ordering-process #checkoutContent .form-control:-webkit-autofill:hover,
body.ordering-process #checkoutContent .form-control:-webkit-autofill:focus{
  -webkit-text-fill-color:var(--dk-text);
  -webkit-box-shadow:0 0 0 1000px #fff inset;
  box-shadow:0 0 0 1000px #fff inset;
  caret-color:var(--dk-text);
}
body.ordering-process #checkoutContent .form-control:-webkit-autofill:focus{
  -webkit-box-shadow:0 0 0 1000px #fff inset, var(--dk-glow);
  box-shadow:0 0 0 1000px #fff inset, var(--dk-glow);
}
/* Disco obmedzuje obal poľa na 440 px – v paneli chceme plnú šírku bunky */
body.ordering-process #checkoutContent .form-control-wrapper{ width:100%; max-width:none; }
/* polia .small/.short (telefón, PSČ) na plnú šírku svojej bunky */
body.ordering-process #checkoutContent .form-control.small,
body.ordering-process #checkoutContent .form-control.short,
body.ordering-process #checkoutContent .phone-combined-input{ width:100%; max-width:none; }
/* telefón s vlajkou */
body.ordering-process #checkoutContent .phone-combined-input{ border-radius:var(--dk-radius-sm); }
body.ordering-process #checkoutContent .country-flags{
  border:1px solid var(--dk-border-strong);
  border-right:0;
  border-radius:var(--dk-radius-sm) 0 0 var(--dk-radius-sm);
  height:48px;
}
body.ordering-process #checkoutContent .phone-combined-input .form-control{
  border-radius:0 var(--dk-radius-sm) var(--dk-radius-sm) 0;
}
/* otáznik pri IČ DPH – k poľu, nie k štítku */
body.ordering-process #checkoutContent .form-group-tooltip{ top:24px; transform:translateY(-50%); }

/* --- dva stĺpce na desktope (Kondela): e-mail | telefón, mesto | PSČ, IČO | IČ DPH --- */
@media (min-width:600px){
  body.ordering-process #checkoutContent .co-contact-information,
  body.ordering-process #checkoutContent #company-info,
  body.ordering-process #checkoutContent .co-billing-address fieldset.box,
  body.ordering-process #checkoutContent #shipping-address .form-option-block{
    display:grid;
    grid-template-columns:1fr 1fr;
    column-gap:14px;
  }
  body.ordering-process #checkoutContent .co-contact-information>*,
  body.ordering-process #checkoutContent #company-info>*,
  body.ordering-process #checkoutContent .co-billing-address fieldset.box>*,
  body.ordering-process #checkoutContent #shipping-address .form-option-block>*{ grid-column:1 / -1; min-width:0; }
  body.ordering-process #checkoutContent .co-contact-information>.form-group:has(#email),
  body.ordering-process #checkoutContent .co-contact-information>.form-group:has(#phone),
  body.ordering-process #checkoutContent #company-info>.form-group:has(#companyId),
  body.ordering-process #checkoutContent #company-info>.form-group:has(#vatId),
  body.ordering-process #checkoutContent .co-billing-address fieldset.box>.form-group:has(#billCity),
  body.ordering-process #checkoutContent .co-billing-address fieldset.box>.form-group:has(#billZip),
  body.ordering-process #checkoutContent #shipping-address .form-option-block>.form-group:has(#deliveryCity),
  body.ordering-process #checkoutContent #shipping-address .form-option-block>.form-group:has(#deliveryZip){
    grid-column:auto;
  }
}
/* pod 600 px sú všetky polia na plnú šírku (mobile first) */
/* krajina (nemenná, nastavená v kroku 2) – ako neaktívne pole (Kondela) */
/* Disco má na .smart-label-wrapper .label margin-bottom:0 !important – medzeru
   preto robíme paddingom */
body.ordering-process #checkoutContent p.label.js-location{
  margin:0; padding-bottom:6px; font-size:14px; font-weight:600; color:#3a3a3a;
}
/* Shoptet tento blok skrýva triedou .js-location--hidden (napr. pri nákupe
   na firmu ukáže namiesto neho select) – display nastavujeme len viditeľnému */
/* prvky so triedou .js-location--hidden (skrytý select/štítok krajiny) musia
   ostať skryté aj napriek našim statickým štítkom */
body.ordering-process #checkoutContent .js-location--hidden{ display:none !important; }
body.ordering-process #checkoutContent .form-control-wrapper--with-note{
  display:flex; flex-direction:row; flex-wrap:wrap; align-items:center; justify-content:flex-start; gap:2px 12px;
  text-align:left;
  min-height:48px;
  padding:8px 14px;
  border:1px solid var(--dk-border);
  border-radius:var(--dk-radius-sm);
  background:var(--dk-bg-soft);
}
body.ordering-process #checkoutContent .form-control-wrapper--with-note strong{ font-size:16px; }
body.ordering-process #checkoutContent .form-control-wrapper--with-note .helpNote{
  font-size:12px; font-style:normal; color:var(--dk-muted);
}
body.ordering-process #checkoutContent .form-control-wrapper--with-note .helpNote a{ color:var(--dk-green-text); }
/* zaškrtávacie políčka (aj súhlasy v bočnom paneli) */
body.ordering-process .cart-inner input[type=checkbox]+label{
  cursor:pointer;
  font-size:15px;
  line-height:1.4;
}
body.ordering-process .cart-inner input[type=checkbox]+label:before{
  border-radius:5px;
  border-color:var(--dk-border-strong);
  background:#fff;
  transition:background-color .15s, border-color .15s;
}
/* Fajka v zaškrtnutom políčku sa kreslí priamo do štvorčeka ako jeho pozadie.
   Disco aj CSS obchodu ju kreslia zvlášť (glyf z ikonového fontu plus obrázok na
   pozadí, celé posunuté cez transform) a nedá sa to spoľahlivo zosúladiť –
   takto je fajka v strede z definície, lebo je to ten istý prvok. */
/* Zaškrtnuté políčko je čierne s bielou fajkou (16:1) – zelená #93ba40 dávala
   2,25:1, čo pri povinnom súhlase s podmienkami nestačilo (WCAG 1.4.11). */
body.ordering-process .cart-inner input[type=checkbox]:checked+label:before{
  background:var(--dk-text) no-repeat center / 11px 9px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 9'%3E%3Cpath d='M1.4 4.6 4.2 7.4 9.6 1.6' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  border-color:var(--dk-text);
}
body.ordering-process .cart-inner input[type=checkbox]:checked+label:after{ display:none; }
body.ordering-process .cart-inner input[type=checkbox]:focus-visible+label:before{ box-shadow:var(--dk-focus); }
/* vypnuté políčko (doplnok dklab „Poznámka“ dáva #add-note disabled) */
body.ordering-process .cart-inner input[type=checkbox]:disabled+label{ cursor:not-allowed; color:var(--dk-muted); }
body.ordering-process .cart-inner input[type=checkbox]:disabled+label:before{ border-color:var(--dk-border); background:var(--dk-bg-soft); }
body.ordering-process #checkoutContent .stay-in-touch .form-group{ margin-bottom:10px; }
body.ordering-process #checkoutContent .additional-information{ color:var(--dk-muted); font-size:13px; }
/* súhlas s podmienkami */
body.ordering-process #checkoutSidebar .consents{ margin:14px 0 0; }
body.ordering-process #checkoutSidebar .consents p.label{
  margin:0;
  font-size:13px;
  line-height:1.5;
  color:var(--dk-muted);
  font-weight:400;
}
body.ordering-process #checkoutSidebar .consents a{ color:var(--dk-text); text-decoration:underline; }

/* ===== 7) BOČNÝ SÚHRN OBJEDNÁVKY (kroky 2 a 3) =========================== */
/* Disco má stĺpce ako float – sticky vnútri floatu nemá kam „cestovať“.
   Riadok prepneme na flex (šírky col-md-8/4 ostávajú) a prilepíme celý stĺpec. */
@media (min-width:992px){
  body.ordering-process .cart-row{ display:flex; align-items:flex-start; }
  body.ordering-process .cart-row:before,
  body.ordering-process .cart-row:after{ display:none; }
  /* Súhrn objednávky ide so stránkou, nikde sa neprilepuje.

     Prečo: prilepený prvok sa vie posúvať len v rámci svojho riadka, takže mu
     na cestu ostane presne toľko, o koľko je formulár vyšší než súhrn. Keď je
     súhrn rozbalený celý, je to málo – odmerané v poslednom kroku pri šiestich
     položkách (okno 900 px): formulár 1003 px, súhrn 920 px, čiže priestor na
     cestu 83 px, kým odscrollovať sa dá 385 px. Súhrn sa teda po 83 pixeloch
     odlepil a zvyšok cesty šiel so stránkou. To vyzeralo, akoby sa najprv
     posunul nižšie a potom odskočil.

     Buď je súhrn orezaný na výšku okna a posúva sa vnútri (vtedy stojí), alebo
     je rozbalený celý a ide so stránkou. Oboje naraz nejde. Vybrané je druhé,
     rovnako ako to má pôvodný Shoptet.

     Karta, súhlasy a tlačidlo sú tri samostatné kusy s rovnakým odstupom. */
  body.ordering-process #checkoutSidebar{
    display:flex;
    flex-direction:column;
    padding-bottom:8px;
  }
  body.ordering-process #checkoutSidebar>.cart-content{
    display:flex;
    flex-direction:column;
    row-gap:18px;
  }
  body.ordering-process #checkoutSidebar .consents,
  body.ordering-process #checkoutSidebar .next-step{ margin-top:0; }
}
body.ordering-process #checkoutSidebar .order-summary{ margin-bottom:0; }
/* „Potrebujete pomôcť?“ – skryté (kontakt je v hlavičke a pätičke) */
body.ordering-process #checkoutSidebar .checkout-box{ display:none; }
/* karta súhrnu */
body.ordering-process #checkoutSidebar .order-summary-inner{
  border:1px solid var(--dk-border);
  border-radius:var(--dk-radius);
  background:#fff;
  padding:20px 22px 6px;
  box-shadow:var(--dk-shadow);
}
body.ordering-process #checkoutSidebar .order-summary h2{
  padding:0 0 12px;
  font-size:18px;
  font-weight:700;
}
body.ordering-process #checkoutSidebar .order-summary-item{
  padding:12px 0;
  border-top:1px solid var(--dk-border);
  font-size:14px;
  line-height:1.4;
  gap:0 8px;
}
body.ordering-process #checkoutSidebar .order-summary-item .cart-item-name{ color:var(--dk-muted); font-size:13px; }
body.ordering-process #checkoutSidebar .order-summary-item .cart-item-name a{
  display:block;
  font-size:14px;
  font-weight:700;
  color:var(--dk-text);
  text-decoration:none;
  margin-bottom:2px;
}
body.ordering-process #checkoutSidebar .order-summary-item .cart-item-name a:hover{ color:var(--dk-brown); }
body.ordering-process #checkoutSidebar .order-summary-item .cart-item-name strong{ color:var(--dk-text); font-size:14px; }
body.ordering-process #checkoutSidebar .order-summary-item .cart-item-amount{
  flex:0 0 52px; color:var(--dk-muted); font-size:13px; text-align:center;
}
body.ordering-process #checkoutSidebar .order-summary-item .cart-item-price{
  flex:0 0 auto; margin-left:auto; font-weight:700; white-space:nowrap;
}
body.ordering-process #checkoutSidebar .order-summary-item.helper>div:last-child{ flex:0 0 auto; }
/* rekapitulácia dopravy/platby v kroku 2 – Disco kreslí čiary zdola aj na obale */
body.ordering-process #checkoutSidebar .order-recapitulation{ border:0; }
body.ordering-process #checkoutSidebar .recapitulation-single{
  display:flex; justify-content:space-between; gap:0;
  padding:12px 0; border-width:1px 0 0; border-color:var(--dk-border); font-size:14px;
}
/* v HTML je najprv cena (span) a potom názov (textový uzol) – otočíme */
/* width:100% by pri ikone pred riadkom zalomilo ikonu na vlastný riadok */
body.ordering-process #checkoutSidebar .recapitulation-shipping-billing-info{
  display:flex; flex-direction:row-reverse; justify-content:space-between; gap:12px;
  flex:1 1 0%; min-width:0;
  /* Krok 3 vypisuje dopravu a platbu úplne iným HTML (.order-summary-item
     s .cart-item-name>strong) a názov tam vychádza čierny. Aby súhrn vyzeral
     v oboch krokoch rovnako, držíme tú istú farbu aj tu. */
  font-weight:400; color:var(--dk-text);
}
body.ordering-process #checkoutSidebar .recapitulation-shipping-billing-info>span:first-child{
  flex:0 0 auto; font-weight:700; color:var(--dk-text);
}
/* Tie isté ikony ako pri nadpisoch, len menšie: v poslednom kroku pri riadkoch
   dopravy a platby, v druhom kroku pri rekapitulácii. Shoptet skrýva popisky
   „Expédition:“ a „Paiement:“, takže ikona je jediné rozlíšenie riadkov. */
body.ordering-process #checkoutSidebar .order-summary-item.helper~.order-summary-item .cart-item-name>strong[data-testid="recapDeliveryMethod"]:before,
body.ordering-process #checkoutSidebar .order-summary-item.helper~.order-summary-item .cart-item-name>strong[data-testid="recapPaymentMethod"]:before,
body.ordering-process #checkoutSidebar .order-summary-item:has(~.order-summary-item.helper) .cart-item-name>strong:before,
body.ordering-process #checkoutSidebar .recapitulation-single.recapitulation-shipping-billing:before{
  font-family:shoptet;
  font-weight:400;
  font-size:15px;
  line-height:1;
  display:inline-block;
  flex:0 0 auto;
  align-self:center;
  /* jediný zdroj medzery medzi ikonou a textom v súhrne – rovnaká pre dopravu,
     platbu aj kupón, v 2. aj v 3. kroku */
  margin-right:20px;
  vertical-align:-2px;
  color:var(--dk-muted);
}
body.ordering-process #checkoutSidebar .order-summary-item.helper~.order-summary-item .cart-item-name>strong[data-testid="recapDeliveryMethod"]:before,
body.ordering-process #checkoutSidebar .recapitulation-single.recapitulation-shipping-billing:first-child:before{
  content:"\e92e";
  content:"\e92e" / "";
}
body.ordering-process #checkoutSidebar .order-summary-item.helper~.order-summary-item .cart-item-name>strong[data-testid="recapPaymentMethod"]:before,
body.ordering-process #checkoutSidebar .recapitulation-single.recapitulation-shipping-billing.last:not(:first-child):before{
  content:"\e926";
  content:"\e926" / "";
}
/* Uplatnený kupón. Shoptet mu dáva data-testid="recapPaymentMethod", teda to isté
   ako skutočnému riadku platby, takže sa dajú rozlíšiť len polohou: kupón stojí
   PRED medzisúčtom (.order-summary-item.helper), doprava a platba za ním. Riadky
   produktov majú v názve odkaz, nie <strong>, takže ich to nechytí.
   Ikona je Shoptetova vlastná značka zľavy – tú istú má v košíku na .extra.discount. */
body.ordering-process #checkoutSidebar .order-summary-item:has(~.order-summary-item.helper) .cart-item-name>strong:before{
  content:"\e934";
  content:"\e934" / "";
}
/* Názov je flex, aby sa dlhý text kupónu („Coupon de réduction no. … - Remise 5 €“)
   zalomil pod prvý riadok textu a nie pod ikonu. Jednoriadkové názvy dopravy
   a platby to nijako nemení. */
body.ordering-process #checkoutSidebar .order-summary-item .cart-item-name>strong{
  display:flex;
  align-items:flex-start;
}
body.ordering-process #checkoutSidebar .order-summary-item .cart-item-name>strong:before{
  align-self:flex-start;
  /* text má 14px/1,4 = 19,6px riadok, ikona 15px – 2px ju opticky vycentrujú */
  margin-top:2px;
  vertical-align:baseline;
}
/* celková cena */
/* Doplnok „Náhľadové obrázky v rekapitulácii objednávky“ vkladá do riadkov
   súhrnu miniatúry produktov (2. a 3. krok). Dávame im pevnú veľkosť a odstup,
   aby nerozhodili stĺpce názov / množstvo / cena. Pravidlo je neškodné aj keď
   doplnok vypnutý – vtedy v riadkoch žiadny obrázok nie je.

   Doplnok vkladá <img> dovnútra .cart-item-name a dáva mu float:left, takže
   dlhý názov aj variant podtekajú pod obrázok. Skúšali sme obrázok vybrať
   z toku (position:absolute + padding-left na názve), aby text stál celý
   vedľa neho – vizuálne sa to nepozdávalo, takže obtekanie od doplnku
   necháme tak. */
body.ordering-process #checkoutSidebar .order-summary-item img{
  flex:0 0 auto;
  width:40px;
  height:40px;
  object-fit:contain;
  margin-right:10px;
  border-radius:6px;
  background:transparent;
}

body.ordering-process #checkoutSidebar .order-summary-item.price{
  border-top:2px solid var(--dk-text);
  margin-top:4px;
  padding:14px 0 8px;
}
body.ordering-process #checkoutSidebar .price-wrapper{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:baseline;
  gap:0 12px;
  padding:0;
  text-align:left;
}
body.ordering-process #checkoutSidebar .price-wrapper .price-label.price-primary{
  font-size:15px; font-weight:700; text-align:left; color:var(--dk-text);
}
body.ordering-process #checkoutSidebar .price-wrapper .price.price-primary{
  padding:0; font-size:28px; line-height:1.1; font-weight:800; text-align:right; color:var(--dk-text);
}
body.ordering-process #checkoutSidebar .price-wrapper .price-label.price-secondary{
  font-size:12px; color:var(--dk-muted); text-align:left;
}
/* Krok 2 (doprava a platba): v súhrne sa skrýva zoznam produktov, a to na
   desktope aj na mobile. Zákazník ho videl v kroku 1 a uvidí znova v poslednom
   kroku; tu sa rozhoduje o cene dopravy a platby, takže stačia sumy. Ostáva
   medzisúčet za tovar, prípadná zľava z kupónu, doprava, platba a celková cena.
   Riadky produktov spoznáme podľa odkazu na produkt – medzisúčet ani kupón
   odkaz nemajú. Trieda .id--16 je Shoptetom pridelené id kroku 2, teda jazykovo
   nezávislé. Ak by mal byť súhrn celý, stačí toto pravidlo zmazať. */
body.ordering-process.id--16 #checkoutSidebar .order-summary-item:has(.cart-item-name a){
  display:none;
}
body.ordering-process #checkoutSidebar .price-wrapper .price.price-secondary{
  padding:0; font-size:12px; color:var(--dk-muted); text-align:right;
}
@media (max-width:991px){
  body.ordering-process #checkoutSidebar .order-summary-inner{ margin-top:8px; padding:18px 18px 4px; }
}

/* Krajina v kroku 3: e-shop má pre každú krajinu vlastnú mutáciu, takže sa tu
   nedá nič prepnúť a riadok „Pays / France / Peut être modifié à l'étape
   précédente“ je len šum. Skrývame poznámkovú podobu aj jej štítok; výberové
   pole (label a wrapper s triedou .js-location--hidden) rieši Shoptet sám. */
body.ordering-process #checkoutContent p.label.js-location,
body.ordering-process #checkoutContent .form-control-wrapper--with-note.js-location{
  display:none;
}
body.ordering-process #checkoutContent .form-group:has(>.form-control-wrapper--with-note.js-location){
  margin:0;
  padding:0;
}

@media (min-width:992px){
  /* V kroku 2 začína ľavý stĺpec nadpisom „Choisir un mode de livraison“ a až
     pod ním je prvá kartička dopravy. Súhrn posunieme o výšku toho nadpisu
     (28 px + 16 px odsadenia), aby obe karty začínali na jednej linke. */
  body.ordering-process.id--16 #checkoutSidebar{ margin-top:44px; }
}

/* ===== 8) VALIDÁCIA A DROBNOSTI ========================================= */
/* Shoptet dáva poľu triedu .error-field (server) / .js-error-field (JS);
   hlásenia .js-validator-msg majú vlastné farby pre .msg-warning/.msg-info, meníme len chybu */
body.ordering-process #checkoutContent .js-validator-msg,
body.ordering-process #checkoutContent .validator-msg{ font-size:13px; }
body.ordering-process #checkoutContent .form-group .msg-error,
body.ordering-process #checkoutContent .js-validator-msg.msg-error,
body.ordering-process #checkoutContent .validator-msg.msg-error{ color:var(--dk-danger); }
body.ordering-process #checkoutContent .form-control.error-field,
body.ordering-process #checkoutContent .form-control.js-error-field,
body.ordering-process #checkoutContent .form-control.error-field:focus,
body.ordering-process #checkoutContent .form-control.js-error-field:focus{
  border-color:var(--dk-danger);
  box-shadow:0 0 0 3px rgba(214,53,0,.18);
}
body.ordering-process .cart-inner input[type=checkbox].error-field+label:before,
body.ordering-process .cart-inner input[type=checkbox].js-error-field+label:before{
  border-color:var(--dk-danger);
}
/* menej pohybu pre používateľov s obmedzením animácií */
@media (prefers-reduced-motion:reduce){
  body.ordering-process ol.cart-header li a:before,
  body.ordering-process ol.cart-header li strong:before,
  body.ordering-process .next-step .btn,
  body.ordering-process .cart-table .quantity,
  body.ordering-process .cart-table .quantity button,
  body.ordering-process .cart-table .remove-item,
  body.ordering-process .shipping-billing-table .radio-wrapper,
  body.ordering-process #checkoutContent .form-control,
  body.ordering-process .cart-inner input[type=checkbox]+label:before{ transition:none; }
  body.ordering-process .next-step .btn.btn-lg.btn-conversion:active{ transform:none; }
}
/* žiadne vodorovné posúvanie na mobile */
@media (max-width:767px){
  body.ordering-process .content-wrapper{ overflow-x:clip; }
}

/* ===== 9) MINI-KOŠÍK V HLAVIČKE ========================================= */
/* Rozbalí sa po prejdení myšou po ikone košíka a je na každej stránke e-shopu,
   nie iba v objednávke – preto je to jediná sekcia mimo body.ordering-process.

   Na mobile ho Shoptet vôbec nevykresľuje: na body.mobile má .cart-widget
   display:none a ikona košíka je obyčajný odkaz na /panier/. Klik na mobile
   teda otvorí rovno stránku košíka, ktorú rieši sekcia 4. */

/* Karta s rovnakým rámikom a zaoblením ako súhrn objednávky. Tieň je výraznejší
   než --dk-shadow, lebo widget visí nad obsahom stránky a musí sa od neho
   odlepiť. overflow:hidden drží zaoblenie aj pri posúvanom zozname. */
.cart-widget .cart-widget-inner{
  border:1px solid var(--dk-border);
  border-radius:var(--dk-radius);
  box-shadow:0 10px 28px rgba(20,30,30,.12), 0 1px 2px rgba(20,30,30,.06);
  overflow:hidden;
  background:#fff;
}
/* Disco kreslí od 992 px rámik (#dadada) a tieň na VONKAJŠÍ .popup-widget.cart-widget.
   Kartu štýlujeme na vnútornom prvku, takže vonkajšie zhasíname – inak boli dva rámiky
   a dva tiene nad sebou a zaoblenie obopínal hranatý rám (namerané 500×180 cez 498×178).
   Rovnaká špecificita ako v Discu, náš súbor sa načítava neskôr. Šípka nad widgetom
   (.popup-widget:before) má od Disca rámik v tej istej sivej – ladíme ju s našou. */
.popup-widget.cart-widget{ border:0; box-shadow:none; }
.popup-widget.cart-widget:before{ border-color:var(--dk-border); }
/* pri viacerých položkách sa posúva zoznam, nie celá stránka */
.cart-widget .cart-widget-products{ max-height:340px; overflow-y:auto; }

/* Riadok produktu. Disco ho kreslí ako tabuľku (display:table), čo nedovolí
   medzery cez gap ani zvislé zarovnanie na stred; prepíname na flex. */
.cart-widget .cart-widget-product{
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px;
  border-bottom:1px solid var(--dk-border);
}
.cart-widget .cart-widget-products-inner .cart-widget-product:last-child{ border-bottom:0; }
.cart-widget .cart-widget-product-image,
.cart-widget .cart-widget-product-amount,
.cart-widget .cart-widget-product-price,
.cart-widget .cart-widget-product-delete{ display:block; flex:0 0 auto; width:auto; }
/* Disco dáva bunkám vlastné odsadenie (obrázok +10, množstvo +20, kôš +5 px);
   vo flexe medzery drží gap, takže ho nulujeme. */
.cart-widget .cart-widget-product-image,
.cart-widget .cart-widget-product-image a,
.cart-widget .cart-widget-product-name,
.cart-widget .cart-widget-product-amount,
.cart-widget .cart-widget-product-price,
.cart-widget .cart-widget-product-delete{ padding:0; margin:0; }
/* Cena bola široká podľa dĺžky sumy, takže stepper začínal v každom riadku
   inde. Pevná minimálna šírka (zmestí sa aj „1 234,50 €“) ich zrovná pod seba. */
.cart-widget .cart-widget-product-price{ min-width:80px; text-align:right; }
.cart-widget .cart-widget-product-name{ display:block; flex:1 1 auto; min-width:0; width:auto; }
/* Jednotka („pc“) je v tabuľkovom rozložení neviditeľná; vo flexe by sa zjavila
   a ubrala miesto názvu, takže ju držíme skrytú. */
.cart-widget .cart-widget-product-unit{ display:none; }

/* obrázok bez rámika a nedeformovaný – Disco má object-fit:fill */
.cart-widget .cart-widget-product-image a{ display:block; height:auto; }
.cart-widget .cart-widget-product-image img{
  display:block;
  margin:0;
  width:56px;
  height:56px;
  object-fit:contain;
  border:0;
  background:transparent;
}
/* názov a variant ako v košíku */
.cart-widget .cart-widget-product-name strong a{
  display:block;
  font-size:14px;
  font-weight:700;
  color:var(--dk-text);
  text-decoration:none;
}
.cart-widget .cart-widget-product-name strong a:hover{ color:var(--dk-brown); }
/* Variant býva dlhý („Choisir la dimension … Couleur de la décoration …“) a na
   ~160 px širokom stĺpci by zabral tri riadky a rozhádzal výšky položiek.
   Dva riadky s výpustkou stačia, celý text je na klik v košíku. */
.cart-widget .cart-widget-product-variant{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  margin-top:3px;
  font-size:12px;
  font-weight:400;
  color:var(--dk-muted);
}
.cart-widget .cart-widget-product-price strong{
  font-size:15px; font-weight:700; color:var(--dk-text); white-space:nowrap;
}

/* Stepper množstva – ten istý ako v košíku, len o kúsok nižší (36 px),
   aby sa riadok widgetu nenafúkol. */
.cart-widget .quantity{
  display:inline-flex;
  align-items:center;
  height:36px;
  padding:0 30px;
  border:1px solid var(--dk-border-strong);
  border-radius:var(--dk-radius-sm);
  background:#fff;
  font-size:14px;
  transition:border-color .2s, box-shadow .2s;
}
/* Disco aj tu dáva pri prejdení myšou čierny tieň 0 0 10px rgba(0,0,0,.16) */
.cart-widget .quantity:hover{ box-shadow:none; border-color:var(--dk-text); }
.cart-widget .quantity:focus-within{ border-color:var(--dk-green-text); box-shadow:var(--dk-glow-soft); }
.cart-widget .quantity label{ margin:0; display:block; }
.cart-widget .quantity input{
  width:30px; height:34px;
  font-family:inherit; font-size:14px; font-weight:700; color:var(--dk-text);
}
.cart-widget .quantity .decrease,
.cart-widget .quantity .increase{
  width:30px; height:34px; top:0;
  border:0; background:transparent; color:var(--dk-text);
  transition:background-color .15s, color .15s;
}
.cart-widget .quantity .decrease{ border-radius:7px 0 0 7px; color:var(--dk-minus); }
.cart-widget .quantity .increase{ border-radius:0 7px 7px 0; }
.cart-widget .quantity .decrease:before,
.cart-widget .quantity .increase:before{ line-height:34px; font-size:8px; color:inherit; }
.cart-widget .quantity .increase:hover{ background:var(--dk-green-soft); color:var(--dk-green-text); }
.cart-widget .quantity .decrease:hover{ background:var(--dk-danger-soft); color:var(--dk-danger); }
.cart-widget .quantity .decrease:hover:before,
.cart-widget .quantity .increase:hover:before{ color:inherit; }

/* Odstránenie položky – rovnaký kôš ako v košíku. Disco ho drží skrytý
   (visibility:hidden) a ukáže až pri prejdení myšou po riadku; v košíku sme sa
   rozhodli pre stále viditeľný, nech je to rovnaké aj tu.
   Popis pre čítačky nesie Shoptetov <span class="sr-only">, preto alt text "". */
.cart-widget .cart-widget-product-delete .remove-item{
  visibility:visible;
  width:32px;
  height:32px;
  padding:0;
  border:0;
  border-radius:50%;
  line-height:32px;
  text-align:center;
  background:transparent;
  color:var(--dk-muted);
  opacity:1;
  transition:background-color .15s, color .15s;
}
.cart-widget .cart-widget-product-delete .remove-item:before{
  content:"\e944";
  content:"\e944" / "";
  font-family:shoptet;
  font-size:14px;
  line-height:32px;
  color:inherit;
}
.cart-widget .cart-widget-product-delete .remove-item:hover,
.cart-widget .cart-widget-product-delete .remove-item:focus-visible{
  background:var(--dk-danger-soft);
  color:var(--dk-danger);
}

/* Spodok s tlačidlom. Disco dáva .cart-widget-button padding:22px 0, čo spolu
   s odsadením obalu robilo nad tlačidlom aj pod ním 36 px. */
.cart-widget .cart-widget-bottom{
  padding:14px;
  border-top:1px solid var(--dk-border);
  background:#fff;
}
.cart-widget .cart-widget-button{ padding:0; margin:0; }
.cart-widget .cart-widget-bottom .btn.btn-conversion{
  display:block;
  width:100%;
  height:48px;
  line-height:46px;
  padding:0 20px;
  border-radius:var(--dk-radius-sm);
  font-size:16px;
  font-weight:700;
}
/* tá istá šípka ako v hlavnom tlačidle objednávky */
.cart-widget .cart-widget-bottom .btn.btn-conversion:after{
  content:"\e90c";
  content:"\e90c" / "";
  font-family:shoptet;
  font-weight:400;
  font-size:16px;
  margin-left:8px;
  vertical-align:-1px;
}

/* Mini-košík na mobile. Shoptet ho tam nezobrazuje pri prejdení myšou, ale až
   po prvom klepnutí na ikonu košíka – vtedy pridá triedu cart-window-visible
   a widget sa roztiahne na celú obrazovku; druhé klepnutie už ide do košíka.

   Disco pod 480 px prepína riadok na display:flex s flex-wrap:wrap a názvu dáva
   width:calc(100% - 76px), takže obrázok ostane na prvom riadku sám a text
   spadne pod neho. Namiesto zalamovania dávame mriežku: obrázok je samostatný
   stĺpec cez oba riadky, vpravo hore názov a cena, pod nimi množstvo a kôš.
   Poradie pri tabulátore ostáva rovnaké ako vizuálne (názov, množstvo, kôš).

   Hranica je 991 px, nie 767: Disco robí z widgetu celoobrazovkový panel
   (position:fixed, od y=134 po spodok) už pod 992 px. Medzi 768 a 991 px mal
   panel cez celú šírku ešte zaoblenie, bočné rámiky a zoznam orezaný na 340 px. */
@media (max-width:991px){
  /* celoobrazovkový panel, nie plávajúca karta */
  .cart-widget .cart-widget-inner{
    border-radius:0;
    border-left:0;
    border-right:0;
    box-shadow:none;
  }
  /* panel má celú výšku okna, zoznam sa nemá prečo obmedzovať a posúvať vnútri */
  .cart-widget .cart-widget-products{ max-height:none; overflow-y:visible; }
  .cart-widget .cart-widget-product{
    display:grid;
    grid-template-columns:64px minmax(0,1fr) auto;
    grid-template-areas:
      "img name price"
      "img amount delete";
    align-items:center;
    column-gap:10px;
    row-gap:10px;
    padding:14px;
  }
  .cart-widget .cart-widget-product-image{ grid-area:img; align-self:start; margin:0; }
  .cart-widget .cart-widget-product-image img{ width:64px; height:64px; }
  /* Disco tu názvu vnucuje width:calc(100% - 76px) a spodný odstup */
  .cart-widget .cart-widget-product-name{ grid-area:name; width:auto; margin:0; }
  .cart-widget .cart-widget-product-price{ grid-area:price; min-width:0; }
  .cart-widget .cart-widget-product-amount{ grid-area:amount; }
  .cart-widget .cart-widget-product-delete{ grid-area:delete; margin:0; justify-self:end; }
  /* jednotku („pc“) Shoptet nad 480 px skrýva, pod ňou ukazuje – zjednocujeme
     na skrytú; selektor musí byť rovnako špecifický ako jeho */
  .cart-widget .cart-widget-product>div.cart-widget-product-unit{ display:none; }
}