/* ═══════════════════════════════════════════════════════════════
   SABLONA2 — webuni.css  (AINT Watch Shop — modern layer)
   Verzia: 20260516_001
   ═══════════════════════════════════════════════════════════════ */

/* ── 0. Fonty & import ───────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Inter:wght@300;400;500;600;700&display=swap');

/* CSS premenné */
:root {
  --rose:       #c47b68;
  --rose-dark:  #a5614f;
  --rose-light: #f5ebe7;
  --charcoal:   #1a1a1a;
  --dark:       #2d2d2d;
  --mid:        #6b7280;
  --light-bg:   #faf7f5;
  --border:     #e8ddd8;
  --white:      #ffffff;
  --shadow-sm:  0 2px 8px rgba(0,0,0,.07);
  --shadow-md:  0 4px 24px rgba(0,0,0,.11);
  --shadow-lg:  0 8px 40px rgba(0,0,0,.16);
  --radius:     12px;
  --radius-sm:  8px;
  /* Typografia: Cormorant Garamond na nadpisy (luxusna hodinarska
     antikva), Inter na text, UI a cisla (lepsia citatelnost). */
  --font-head:  'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --font-body:  'Inter', Roboto, Arial, sans-serif;
  --transition: all .22s cubic-bezier(.4,0,.2,1);
}

/* ── 1. Globál — font ────────────────────────────────────────── */
body, #bg, .container {
  font-family: 'Inter', Roboto, sans-serif !important;
}

/* ── 2. HEADER ───────────────────────────────────────────────── */
#container-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 900 !important;
  background: var(--white) !important;
  box-shadow: 0 2px 16px rgba(0,0,0,.08) !important;
  transition: box-shadow .3s ease !important;
}

/* Flex layout na wrapper — čisté rozloženie prvkov */
#header-opacity {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  padding: 8px 16px !important;
  box-sizing: border-box !important;
  gap: 12px !important;
}

#header {
  height: auto !important;
  min-height: 60px !important;
  text-align: left !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  gap: 8px !important;
}

/* Logo — nesmie sa scvrknúť */
#top-home {
  flex-shrink: 0 !important;
}

/* Nav — zaberie zostatok priestoru, centrovaný */
#articles-menu {
  flex: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Pravá časť (login + košík) */
.top-menu-wrap {
  flex-shrink: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Vyhľadávací formulár v headeri — skrytý (banner má veľký search) */
.top-menu-wrap #search {
  display: none !important;
}

/* Nav linky — kompaktné (odstránené — definícia nižšie) */

/* ── 3. LOGO ─────────────────────────────────────────────────── */
#top-home .brand img {
  max-height: 56px !important;
  max-width: 180px !important;
  width: auto !important;
  transition: opacity .2s ease !important;
}
#top-home:hover .brand img {
  opacity: 0.82 !important;
}

/* ── 4. NAVIGÁCIA ────────────────────────────────────────────── */

#articles-menu > ul {
  display: flex !important;
  align-items: center !important;
  gap: 0 !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* li musí byť flex aby sa a vycentrovalo vertikálne */
#articles-menu > ul > li {
  display: flex !important;
  align-items: center !important;
  list-style: none !important;
  position: relative !important;
}

#articles-menu > ul > li > a,
#articles-menu > ul > li > span {
  display: block !important;
  padding: 8px 12px !important;
  font-size: 14.5px !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  letter-spacing: .03em !important;
  text-transform: uppercase !important;
  color: var(--charcoal) !important;
  text-decoration: none !important;
  border-radius: var(--radius-sm) !important;
  transition: var(--transition) !important;
  white-space: nowrap !important;
  height: auto !important;
}

#articles-menu > ul > li > a:hover,
#articles-menu > ul > li:hover > a,
#articles-menu > ul > li.active > a {
  color: var(--rose) !important;
  background: var(--rose-light) !important;
}

/* Dropdown submenu */
#articles-menu ul.submenu,
#articles-menu ul ul {
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow-md) !important;
  padding: 6px !important;
  min-width: 180px !important;
  /* Explicitné poziciovanie — li má display:flex, top musí byť 100% aby submenu vyšlo pod položku */
  top: 100% !important;
  left: 0 !important;
  margin-top: 2px !important;
}

#articles-menu ul.submenu li a,
#articles-menu ul ul li a {
  padding: 9px 12px !important;
  border-radius: var(--radius-sm) !important;
  font-size: 14px !important;
  color: var(--charcoal) !important;
  display: block !important;
  text-decoration: none !important;
  transition: var(--transition) !important;
}

#articles-menu ul.submenu li a:hover,
#articles-menu ul ul li a:hover {
  background: var(--rose-light) !important;
  color: var(--rose) !important;
}

/* Prihlásenie | Registrácia — reset absolútneho poziciovania */
#head-login {
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  float: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  font-size: 13.5px !important;
  color: var(--mid) !important;
  white-space: nowrap !important;
}

#head-login > a,
#head-login a {
  font-size: 13.5px !important;
  color: var(--mid) !important;
  text-decoration: none !important;
  transition: color .2s !important;
  white-space: nowrap !important;
  letter-spacing: .01em !important;
}

#head-login a:hover {
  color: var(--rose) !important;
}

/* Cart container v headeri — reset floatov */
#header #public-cart {
  margin: 0 !important;
  float: none !important;
  display: flex !important;
  align-items: center !important;
}

/* ── 5. KOŠÍK V HLAVIČKE ─────────────────────────────────────── */

#public-cart-small-type-2 {
  margin: 0 !important;
  float: none !important;
  width: auto !important;
}

#public-cart-small-type-2 a.icon-cart-big {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  background: var(--rose-light) !important;
  border: 1.5px solid var(--border) !important;
  color: var(--rose) !important;
  text-decoration: none !important;
  transition: var(--transition) !important;
  position: relative !important;
}

#public-cart-small-type-2 a.icon-cart-big:hover {
  background: var(--rose) !important;
  border-color: var(--rose) !important;
  box-shadow: 0 4px 16px rgba(196,123,104,.35) !important;
}

#public-cart-small-type-2 a.icon-cart-big .material-icons {
  font-size: 22px !important;
  color: var(--rose) !important;
  transition: color .2s !important;
}

#public-cart-small-type-2 a.icon-cart-big:hover .material-icons {
  color: var(--white) !important;
}

/* Počítadlo produktov */
#public-cart-small-type-2 a span:not(.material-icons) {
  position: absolute !important;
  top: -4px !important;
  right: -4px !important;
  min-width: 18px !important;
  height: 18px !important;
  background: var(--rose) !important;
  color: var(--white) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
  text-align: center !important;
  border-radius: 20px !important;
  padding: 0 4px !important;
  box-shadow: 0 1px 4px rgba(0,0,0,.2) !important;
  bottom: auto !important;
  left: auto !important;
}

/* ── 6. BREADCRUMBS ──────────────────────────────────────────── */
#container-navigation-top {
  padding: 10px 24px 0 !important;
  box-sizing: border-box !important;
}

.top-navigation,
.top-navigation-catalog {
  font-size: 12px !important;
  color: var(--mid) !important;
}

.top-navigation a,
.top-navigation-catalog a {
  color: var(--mid) !important;
  text-decoration: none !important;
  transition: color .2s !important;
}

.top-navigation a:hover,
.top-navigation-catalog a:hover {
  color: var(--rose) !important;
}

.top-navigation .navigation-separator,
.top-navigation span.sep {
  margin: 0 5px !important;
  color: var(--border) !important;
}

/* ── 7. PRODUKTOVÉ KARTY (katalóg — všetky typy) ─────────────── */
.product-first,
.product-second,
.product-third {
  border-radius: var(--radius) !important;
  box-shadow: 0 2px 12px rgba(0,0,0,.08) !important;
  transition: transform .22s ease, box-shadow .22s ease !important;
  overflow: hidden !important;
  background: var(--white) !important;
  box-sizing: border-box !important;
}
/* product-first / product-second: len horný margin (pôvodné správanie — horizontálne margins by narušili 3-stĺpcový grid) */
.product-first,
.product-second {
  margin: 8px 0 0 0 !important;
}
/* product-third v gridu: kompenzovaná šírka s malým horizontálnym marginom */
.product-third:not(.slick-slide) {
  margin: 8px 4px !important;
  width: calc(33.33% - 8px) !important;
}
/* product-third v slick slideri: len horný margin, šírku riadi slick */
.product-third.slick-slide {
  margin-top: 8px !important;
}

.product-first:hover,
.product-second:hover,
.product-third:hover {
  transform: scale(1.02) !important;
  box-shadow: 0 12px 36px rgba(0,0,0,.15) !important;
}

/* Odstrání starý čiarový border */
.product-third-border,
.product-second-border,
.product-first-border {
  border: none !important;
}

/* Obrázok */
.product-first .product-images,
.product-second .product-images,
.product-third .product-images {
  overflow: hidden !important;
  background: var(--light-bg) !important;
  padding: 12px !important;
}

.product-first .product-images a,
.product-second .product-images a,
.product-third .product-images a {
  display: block !important;
}

.product-first .product-images img,
.product-second .product-images img,
.product-third .product-images img {
  transition: transform .4s ease, opacity .3s ease !important;
  opacity: 1 !important;
}

.product-first:hover .product-images img,
.product-second:hover .product-images img,
.product-third:hover .product-images img {
  transform: scale(1.05) !important;
}

/* Náhľad produktu overlay */
/* Tlačidlo centrujeme do OBRÁZKOVEJ OBLASTI (nie celej karty),
   aby bolo vždy vo viditeľnej časti viewportu.
   Obrázok = ~56% výšky karty → stred = ~28% karty.
   Použijeme top: calc(28% - 20px) pre presné umiestnenie. */
.product-catalog-insight-hover {
  background: rgba(196,123,104,.90) !important;
  border-radius: 0 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  color: var(--white) !important;
  z-index: 10 !important;
  transition: background .2s ease !important;
  width: 160px !important;
  height: 40px !important;
  line-height: 40px !important;
  /* Presunutie do obrázkovej oblasti */
  top: calc(48% - 20px) !important;
  bottom: auto !important;
  margin: 0 auto !important;
}

.product-catalog-insight-hover:hover {
  background: rgba(165,97,79,.98) !important;
}

/* Obsah karty */
.product-first .product-content,
.product-second .product-content,
.product-third .product-content {
  padding: 12px 14px 14px !important;
}

.product-first .product-content-title,
.product-second .product-content-title,
.product-third .product-content-title,
.product-first .product-content h4,
.product-second .product-content h4,
.product-third .product-content h4 {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--charcoal) !important;
  line-height: 1.4 !important;
  margin: 8px 4px 6px !important;
  height: auto !important;
  min-height: 40px !important;
}

.product-first .product-content-title a,
.product-second .product-content-title a,
.product-third .product-content-title a,
.product-first .product-content h4 a,
.product-second .product-content h4 a,
.product-third .product-content h4 a {
  color: var(--charcoal) !important;
  text-decoration: none !important;
  transition: color .2s !important;
}

.product-first .product-content-title a:hover,
.product-second .product-content-title a:hover,
.product-third .product-content-title a:hover,
.product-first .product-content h4 a:hover,
.product-second .product-content h4 a:hover,
.product-third .product-content h4 a:hover {
  color: var(--rose) !important;
}

/* Popis */
.product-content-description,
.product-content-description p {
  font-size: 12px !important;
  color: var(--mid) !important;
  line-height: 1.5 !important;
}

/* ── 7b. NÁHĽAD PRODUKTU — jQuery UI dialog ─────────────────── */

/* Overlay za dialogom — musí byť nad sticky headerom (z-index: 900) */
.ui-widget-overlay {
  background: rgba(0,0,0,.55) !important;
  opacity: 1 !important;
  z-index: 950 !important;
}

/* Samotný dialog — nad overlay */
.ui-dialog {
  z-index: 960 !important;
}

/* Samotný dialog */
.ui-dialog-product-catalog-insight {
  border: none !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow-lg) !important;
  padding: 0 !important;
  overflow: hidden !important;
  font-family: 'Inter', sans-serif !important;
  background: var(--white) !important;
}

/* Titulkový bar */
.ui-dialog-product-catalog-insight .ui-dialog-titlebar {
  background: var(--charcoal) !important;
  color: var(--white) !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 14px 18px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: .04em !important;
}

/* Tlačidlo X na zatvorenie */
.ui-dialog-product-catalog-insight .ui-dialog-titlebar-close,
.ui-dialog-product-catalog-insight .ui-dialog-titlebar-close.ui-button {
  background: rgba(255,255,255,.12) !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  border-radius: 50% !important;
  width: 30px !important;
  height: 30px !important;
  position: absolute !important;
  right: 14px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: background .2s ease !important;
}
.ui-dialog-product-catalog-insight .ui-dialog-titlebar-close:hover,
.ui-dialog-product-catalog-insight .ui-dialog-titlebar-close.ui-button:hover {
  background: rgba(255,255,255,.28) !important;
}
.ui-dialog-product-catalog-insight .ui-dialog-titlebar-close .ui-button-icon,
.ui-dialog-product-catalog-insight .ui-dialog-titlebar-close .ui-icon {
  background-image: none !important;
  background: none !important;
  text-indent: 0 !important;
  overflow: visible !important;
  width: 18px !important;
  height: 18px !important;
  font-size: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.ui-dialog-product-catalog-insight .ui-dialog-titlebar-close .ui-button-icon::before,
.ui-dialog-product-catalog-insight .ui-dialog-titlebar-close .ui-icon::before {
  content: '×' !important;
  font-size: 22px !important;
  font-weight: 300 !important;
  line-height: 1 !important;
  color: var(--white) !important;
}
/* Skryť textový label "Close" */
.ui-dialog-product-catalog-insight .ui-dialog-titlebar-close .ui-button-icon-space {
  display: none !important;
}

/* Obsah dialógu — bez paddingu, layout rieši insight-layout */
.ui-dialog-product-catalog-insight .ui-dialog-content {
  padding: 0 !important;
  background: var(--white) !important;
  overflow: hidden !important;
}

/* ── 2-stĺpcový layout dialógu ── */
.insight-layout {
  display: flex !important;
  min-height: 280px !important;
}

/* Ľavý stĺpec — obrázok */
.insight-col-left {
  flex: 0 0 42% !important;
  background: var(--light-bg) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 28px !important;
  border-right: 1px solid var(--border) !important;
}

#product-catalog-insight-img {
  text-align: center !important;
  margin: 0 !important;
  width: 100% !important;
  float: none !important;
}

#product-catalog-insight-img img {
  max-width: 100% !important;
  max-height: 240px !important;
  object-fit: contain !important;
  border-radius: 6px !important;
  background: none !important;
  padding: 0 !important;
}

/* Pravý stĺpec — info */
.insight-col-right {
  flex: 1 !important;
  padding: 24px 26px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 8px !important;
}

/* Názov produktu */
#product-catalog-insight-title {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: var(--charcoal) !important;
  line-height: 1.4 !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  border-bottom: none !important;
  width: auto !important;
  float: none !important;
}

/* Cena v dialógu */
.ui-dialog-product-catalog-insight .price {
  font-size: 24px !important;
  font-weight: 700 !important;
  color: var(--rose) !important;
  margin: 4px 0 !important;
  width: auto !important;
  float: none !important;
}
.ui-dialog-product-catalog-insight .old_price,
.ui-dialog-product-catalog-insight .action_price {
  font-size: 14px !important;
  color: var(--mid) !important;
  text-decoration: line-through !important;
}

/* Tlačidlo "Prejsť do detailu" */
#product-catalog-insight-button {
  margin-top: 16px !important;
  width: auto !important;
  float: none !important;
}
#product-catalog-insight-button .button-type-1 {
  background: var(--rose) !important;
  border-radius: 50px !important;
  display: block !important;
  height: auto !important;
  float: none !important;
  margin: 0 !important;
  box-shadow: 0 4px 18px rgba(196,123,104,.35) !important;
  transition: background .2s ease, box-shadow .2s ease, transform .15s ease !important;
}
#product-catalog-insight-button .button-type-1 a {
  color: var(--white) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  padding: 13px 28px !important;
  height: auto !important;
  line-height: 1.2 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  float: none !important;
  text-decoration: none !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
}
#product-catalog-insight-button .button-type-1 a::after {
  content: '→' !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  transition: transform .2s ease !important;
}
#product-catalog-insight-button .button-type-1:hover {
  background: var(--rose-dark) !important;
  box-shadow: 0 6px 22px rgba(196,123,104,.45) !important;
  transform: translateY(-1px) !important;
}
#product-catalog-insight-button .button-type-1:hover a::after {
  transform: translateX(3px) !important;
}

/* Spodná časť — popis a parametre */
.insight-extras {
  border-top: 1px solid var(--border) !important;
  padding: 16px 26px !important;
  max-height: 180px !important;
  overflow-y: auto !important;
}

.ui-dialog-product-catalog-insight #description,
.ui-dialog-product-catalog-insight .product-content-description {
  font-size: 13px !important;
  color: var(--mid) !important;
  line-height: 1.6 !important;
  margin: 0 !important;
}

.ui-dialog-product-catalog-insight .catalog-appurtenances-title {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--charcoal) !important;
  margin: 12px 0 4px !important;
}

.ui-dialog-product-catalog-insight table {
  font-size: 12px !important;
  width: 100% !important;
}

.ui-dialog-product-catalog-insight table td {
  padding: 4px 8px !important;
  border-bottom: 1px solid var(--border) !important;
}

/* ── 8. CENA V KATALÓGU ──────────────────────────────────────── */
.product-first .price,
.product-second .price,
.product-third .price {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--charcoal) !important;
}

.product-first .action_price,
.product-second .action_price,
.product-third .action_price,
.product-first .old_price,
.product-second .old_price,
.product-third .old_price {
  font-size: 13px !important;
  color: var(--mid) !important;
  text-decoration: line-through !important;
}

/* ── 9. AKCIOVÉ ŠTÍTKY / BADGES ──────────────────────────────── */
.container-product-actions > div {
  margin: 0 0 4px 0 !important;
  border-radius: 20px !important;
  overflow: hidden !important;
}

.container-product-actions > div span {
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  padding: 4px 10px !important;
  display: block !important;
}

/* Farby badges */
.action {
  background: var(--charcoal) !important;
  border-radius: 20px !important;
}

.discount {
  background: var(--rose) !important;
  border-radius: 20px !important;
}

.hot_tip {
  background: #d97706 !important;
  border-radius: 20px !important;
}

.last_items {
  background: #7c3aed !important;
  border-radius: 20px !important;
}

.startup {
  background: #0891b2 !important;
  border-radius: 20px !important;
}

.top_bestseller, .top_product {
  background: #059669 !important;
  border-radius: 20px !important;
}

.new {
  background: #2563eb !important;
  border-radius: 20px !important;
}

.clearance_sale, .sale, .sale_collection {
  background: #dc2626 !important;
  border-radius: 20px !important;
}

/* Percentuálna zľava */
.container-product-actions .clear span {
  background: var(--rose) !important;
  color: var(--white) !important;
  border-radius: 20px !important;
  font-weight: 700 !important;
  font-size: 11px !important;
  padding: 4px 10px !important;
}

/* ── 10. TLAČIDLO "DO KOŠÍKA" (katalóg) ─────────────────────── */
.add-cart-catalog {
  width: 100% !important;
  padding: 0 !important;
  float: none !important;
  margin-top: 10px !important;
  text-align: center !important;
}

.button-add-cart-button,
.button-type-1.button-add-cart-button {
  float: none !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  margin-bottom: 0 !important;
}

/* Wrapper button-type-1 — zrušiť červené pozadie */
.button-type-1.button-add-cart-button,
[id^="button-add-cart-button"] {
  background: var(--charcoal) !important;
  border-radius: var(--radius-sm) !important;
  height: auto !important;
  overflow: hidden !important;
  margin-bottom: 0 !important;
}

/* Sprite override — prepisuje background image na solidný button */
input.add-cart-button,
.button-type-1.button-add-cart-button input[type="submit"],
.button-add-cart-button input[type="submit"],
.add-cart-catalog input[type="submit"] {
  width: 100% !important;
  height: 44px !important;
  line-height: 44px !important;
  padding: 0 16px !important;
  background: var(--charcoal) !important;
  background-image: none !important;
  color: var(--white) !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .04em !important;
  cursor: pointer !important;
  transition: var(--transition) !important;
  font-family: 'Inter', Roboto, sans-serif !important;
  box-sizing: border-box !important;
  float: none !important;
  display: block !important;
  margin: 0 !important;
}

input.add-cart-button:hover,
.button-type-1.button-add-cart-button input[type="submit"]:hover,
.button-add-cart-button input[type="submit"]:hover,
.add-cart-catalog input[type="submit"]:hover {
  background: var(--rose) !important;
  background-image: none !important;
  box-shadow: 0 4px 16px rgba(196,123,104,.4) !important;
  transform: translateY(-1px) !important;
}

/* ── 11. DETAIL PRODUKTU ─────────────────────────────────────── */
#detail {
  padding: 20px 0 !important;
}

#detail h1 {
  font-size: 26px !important;
  font-weight: 700 !important;
  color: var(--charcoal) !important;
  line-height: 1.3 !important;
  margin-bottom: 8px !important;
  letter-spacing: -.02em !important;
}

/* Cena na detaile */
#detail .price,
#detail .normal_price {
  font-size: 28px !important;
  font-weight: 800 !important;
  color: var(--charcoal) !important;
  letter-spacing: -.02em !important;
}

#detail .action_price,
#detail .old_price {
  font-size: 16px !important;
  color: var(--mid) !important;
  text-decoration: line-through !important;
}

/* "Pridaj do košíka" na detaile */
.add-cart-detail,
#add-to-cart,
#detail .button-type-2,
#detail .add-cart {
  margin-top: 16px !important;
}

/* Wrapper pre detail button — reset červeného bg */
#detail .button-type-1,
#detail [id^="button-add-cart-button"],
#detail .button-add-cart-button {
  background: var(--charcoal) !important;
  border-radius: var(--radius-sm) !important;
  height: auto !important;
  overflow: hidden !important;
  width: auto !important;
  display: inline-block !important;
  float: none !important;
}

.add-cart-detail input[type="submit"],
.add-cart-detail button[type="submit"],
#detail .button-type-2 input[type="submit"],
#detail form input[type="submit"],
#detail form button[type="submit"],
#detail input.add-cart-button {
  background: var(--charcoal) !important;
  background-image: none !important;
  color: var(--white) !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
  padding: 14px 32px !important;
  height: auto !important;
  line-height: 1.4 !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  letter-spacing: .04em !important;
  cursor: pointer !important;
  transition: var(--transition) !important;
  font-family: 'Inter', Roboto, sans-serif !important;
  min-width: 200px !important;
}

.add-cart-detail input[type="submit"]:hover,
.add-cart-detail button[type="submit"]:hover,
#detail .button-type-2 input[type="submit"]:hover,
#detail form input[type="submit"]:hover,
#detail form button[type="submit"]:hover,
#detail input.add-cart-button:hover {
  background: var(--rose) !important;
  background-image: none !important;
  box-shadow: 0 6px 20px rgba(196,123,104,.4) !important;
  transform: translateY(-2px) !important;
}

/* Počet kusov na detaile */
#detail .count-input input,
#detail input.count {
  border: 1.5px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  padding: 10px 14px !important;
  font-size: 15px !important;
  text-align: center !important;
  width: 70px !important;
}

/* Hodnotenie */
.evalution .stars span,
.evalution .star {
  color: var(--rose) !important;
}

/* ── 12. FILTER LIŠTA (katalóg) ──────────────────────────────── */

/* Sort/filter panel — top-category-panel */
#top-category-panel {
  background: var(--light-bg) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  padding: 10px 16px !important;
  margin-bottom: 16px !important;
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  box-sizing: border-box !important;
}

/* Sort/filter text labels */
.appurtenances-filter-text,
#top-category-panel span,
#top-category-panel label {
  font-size: 12px !important;
  color: var(--mid) !important;
  font-weight: 400 !important;
}

/* "Zobraziť iba produkty skladom" — rose color namiesto červenej */
#top-category-panel a,
#category-products a.only-in-stock,
.appurtenances-filter-stock-link,
#top-category-panel .in-stock-label {
  color: var(--rose) !important;
  font-size: 12px !important;
  text-decoration: none !important;
  transition: color .2s !important;
}

#top-category-panel a:hover {
  color: var(--rose-dark) !important;
  text-decoration: underline !important;
}

/* Select/dropdown v sort bare */
#top-category-panel select {
  border: 1.5px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  padding: 6px 10px !important;
  font-size: 12px !important;
  font-family: 'Inter', Roboto, sans-serif !important;
  background: var(--white) !important;
  color: var(--charcoal) !important;
  cursor: pointer !important;
}

/* Fallback pre staré selektory */
#catalog-filter-bar,
.catalog-filter-bar,
#catalog-sort-container,
.catalog-sort-row {
  background: var(--light-bg) !important;
  border-radius: var(--radius-sm) !important;
  padding: 8px 14px !important;
  border: 1px solid var(--border) !important;
  margin-bottom: 12px !important;
}

/* ── 13. STRÁNKOVANIE ────────────────────────────────────────── */
.pagination a,
.pagination span,
#pagination a,
#pagination span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 36px !important;
  height: 36px !important;
  border-radius: var(--radius-sm) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--charcoal) !important;
  text-decoration: none !important;
  border: 1.5px solid var(--border) !important;
  background: var(--white) !important;
  margin: 0 2px !important;
  transition: var(--transition) !important;
}

.pagination a:hover,
#pagination a:hover {
  background: var(--rose-light) !important;
  border-color: var(--rose) !important;
  color: var(--rose) !important;
}

.pagination .current,
.pagination span.active,
#pagination .current {
  background: var(--rose) !important;
  color: var(--white) !important;
  border-color: var(--rose) !important;
}

/* ── 14. FOOTER ──────────────────────────────────────────────── */
/* ── 14. PÄTIČKA ──────────────────────────────────────────────── */
#container-footer {
  margin-top: 48px !important;
  background: var(--charcoal) !important;
  border-top: 3px solid var(--rose) !important;
}

/* Oddeľovacia čiara nad pätičkou — skryjeme pôvodnú */
hr.footerLine {
  display: none !important;
}

#footer {
  margin-top: 0 !important;
  padding: 0 !important;
  min-height: unset !important;
}

/* Hlavná mriežka pätičky */
#info-articles {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0 !important;
  text-align: left !important;
  padding: 40px 32px 28px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Každý stĺpec */
#info-articles .span-6,
#info-articles #mediahelp {
  display: inline-flex !important;
  flex-direction: column !important;
  float: none !important;
  width: calc(25% - 24px) !important;
  min-width: 180px !important;
  margin: 0 12px 24px !important;
  box-sizing: border-box !important;
  vertical-align: top !important;
}

/* Logo stĺpec (#mediahelp) */
#mediahelp {
  gap: 0 !important;
}

#mediahelp img {
  margin: 0 0 14px 0 !important;
  max-width: 140px !important;
  height: auto !important;
  filter: brightness(0) invert(1) !important;
  opacity: 0.85 !important;
}

/* Kontaktné údaje */
#mediahelp .text-1-phone,
#mediahelp .text-1-email,
#mediahelp .text-1-google-plus {
  color: rgba(255,255,255,.75) !important;
  font-size: 13px !important;
  margin: 4px 0 !important;
  margin-left: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
}

#mediahelp .text-1-phone a,
#mediahelp .text-1-email a {
  color: rgba(255,255,255,.75) !important;
  text-decoration: none !important;
  transition: color .2s !important;
}

#mediahelp .text-1-phone a:hover,
#mediahelp .text-1-email a:hover {
  color: var(--rose) !important;
}

#mediahelp .text-margin {
  margin-left: 0 !important;
}

/* Copyright */
#mediahelp .text-2-copyright {
  color: rgba(255,255,255,.45) !important;
  font-size: 12px !important;
  margin: 14px 0 0 0 !important;
  line-height: 1.6 !important;
}

/* Nadpisy skupín */
.group-title {
  color: var(--white) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  margin-bottom: 12px !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid rgba(255,255,255,.12) !important;
}

/* Zoznamy odkazov v pätičke */
#footer ul {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

#footer ul li {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

#footer ul li a {
  color: rgba(255,255,255,.65) !important;
  font-size: 13px !important;
  text-decoration: none !important;
  line-height: 2 !important;
  display: block !important;
  transition: color .2s, padding-left .2s !important;
}

#footer ul li a:hover {
  color: var(--rose) !important;
  padding-left: 4px !important;
}

/* Spodná lišta — "Vytvorené systémom" */
#container-royal-media-text {
  display: block !important;
  text-align: center !important;
  padding: 12px 16px !important;
  font-size: 11px !important;
  color: rgba(255,255,255,.3) !important;
  text-decoration: none !important;
  border-top: 1px solid rgba(255,255,255,.08) !important;
  transition: color .2s !important;
  margin: 0 !important;
}

#container-royal-media-text:hover {
  color: rgba(255,255,255,.55) !important;
}

/* Ikony platby/dopravy
   Mriezka: vlavo platba (zamok + loga), vpravo doprava — obe
   skupiny vedla seba v jednom riadku, kazda s vlastnym nadpisom
   nad sebou. Poradie v HTML je:
   1 nadpis platby | 2 zamok | 3 loga platieb | 4 nadpis dopravy |
   5 loga dopravy — preto poziciujeme cez nth-child. */
.pay-delivery-footer-container {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) minmax(0, 1fr) !important;
  align-items: center !important;
  column-gap: 26px !important;
  row-gap: 6px !important;
  width: 100% !important;
  padding: 0 12px 8px !important;
  box-sizing: border-box !important;
}

.pay-delivery-footer-container .group-title {
  margin-top: 8px !important;
}

.pay-delivery-footer-container > .group-title:nth-child(1) {
  grid-column: 1 / 3 !important;
  grid-row: 1 !important;
}

.pay-delivery-footer-container > #pay-delivery-footer-lock {
  grid-column: 1 !important;
  grid-row: 2 !important;
  flex: 0 0 auto !important;
  float: none !important;
}

.pay-delivery-footer-container > #pay-delivery-footer-small {
  grid-column: 2 !important;
  grid-row: 2 !important;
}

.pay-delivery-footer-container > .group-title:nth-child(4) {
  grid-column: 3 !important;
  grid-row: 1 !important;
}

.pay-delivery-footer-container > #pay-delivery-footer-big {
  grid-column: 3 !important;
  grid-row: 2 !important;
}

@media screen and (max-width: 760px) {

  .pay-delivery-footer-container {
    grid-template-columns: auto minmax(0, 1fr) !important;
  }

  .pay-delivery-footer-container > .group-title:nth-child(4) {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
  }

  .pay-delivery-footer-container > #pay-delivery-footer-big {
    grid-column: 1 / -1 !important;
    grid-row: 4 !important;
  }
}

/* Base ma `#pay-delivery-footer-small { overflow:hidden; width:123px;
   height:58px }` — v povodnom dizajne to bolo okienko, v ktorom sa
   loga posuvali. Preto sa do riadku zmestili len dve ikony a zvysok
   "utekal" na dalsi riadok, hoci v paticke je miesta dost.
   Rusime pevnu sirku aj vysku a necháme ich tiect za sebou. */
#pay-delivery-footer-small,
#pay-delivery-footer-big {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
  width: auto !important;
  max-width: none !important;
  height: auto !important;
  overflow: visible !important;
}

/* Polozky su floaty — vo flexe ich float netreba, ale
   `position: relative` MUSI zostat: `.pay-delivery-footer-button`
   je `position:absolute` s top/left/right/bottom 0 a kotvi sa
   prave o tento obal. Bez neho loga odletia mimo paticky. */
#pay-delivery-footer-small .pay-delivery-footer-outer,
#pay-delivery-footer-big .pay-delivery-footer-outer {
  float: none !important;
}

.pay-delivery-footer-button img {
  border-radius: 4px !important;
  opacity: .75 !important;
  transition: opacity .2s !important;
}

.pay-delivery-footer-button img:hover {
  opacity: 1 !important;
}

/* ── 15. FLASH SPRÁVY ──────────────────────────────────────────
   Hlaska typu "Boli ste uspesne prihlaseny." Base CSS z nej robil
   cierny pas cez celu sirku (background:#333, font 20-21px,
   min-height 60px, line-height 55px) s obrovskou sprite ikonou
   70x53px. Robime z toho decentny panel s vektorovou ikonou.
   Struktura: #messages > #flash-message > p.success|p.error > span
   ------------------------------------------------------------ */
#messages {
  float: none !important;
  width: auto !important;
  margin: 16px 0 !important;
  border-radius: 0 !important;
  overflow: visible !important;
}

#messages #flash-message {
  max-width: 1200px !important;
  margin: 0 auto !important;
}

#messages #flash-message p.success,
#messages #flash-message p.error {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  float: none !important;
  width: auto !important;
  min-height: 0 !important;
  margin: 0 0 10px !important;
  padding: 14px 18px !important;
  border: none !important;
  border-left: 3px solid transparent !important;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0 !important;
  font-family: var(--font-body) !important;
  font-size: 14.5px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  text-align: left !important;
}

#messages #flash-message p:last-child {
  margin-bottom: 0 !important;
}

/* povodna sprite ikonka 70x53px */
#messages #flash-message p.success span,
#messages #flash-message p.error span {
  flex: 0 0 auto !important;
  position: static !important;
  float: none !important;
  left: auto !important;
  top: auto !important;
  width: 20px !important;
  height: 20px !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 20px 20px !important;
}

/* ── Uspech ── */
#messages #flash-message p.success {
  background-color: #eaf5ec !important;
  border-left-color: #2e7d4f !important;
  color: #1f5c39 !important;
}

#messages #flash-message p.success span {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232e7d4f' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='m8.5 12.5 2.5 2.5 4.5-5'/%3E%3C/svg%3E") !important;
}

/* ── Chyba ── */
#messages #flash-message p.error {
  padding: 14px 18px !important;
  background-color: #fdecec !important;
  border-left-color: #c0392b !important;
  color: #8f2b20 !important;
  font-weight: 500 !important;
}

#messages #flash-message p.error span {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c0392b' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7.5v5.5M12 16.2v.1'/%3E%3C/svg%3E") !important;
}

#messages + hr.space,
#messages #flash-message + hr.space {
  display: none !important;
}

/* ── 16. VŠEOBECNÉ TLAČIDLÁ (.button-type-1) ─────────────────── */
.button-type-1 {
  border-radius: var(--radius-sm) !important;
  overflow: hidden !important;
}

.button-type-1 a,
.button-type-1 input {
  font-size: 13px !important;
  font-weight: 500 !important;
  transition: var(--transition) !important;
  font-family: 'Inter', Roboto, sans-serif !important;
}

/* ── 17. PRODUKTOVÝ DETAIL — SEKCIA CENY + AKCIE ─────────────── */
.detail-old-and-actual-price {
  display: flex !important;
  align-items: baseline !important;
  gap: 12px !important;
  margin: 10px 0 !important;
}

/* ── 18. KATEGÓRIA — TITULOK STRÁNKY ─────────────────────────── */
#catalog-header h1,
.catalog-h1,
.category-page-title {
  font-size: 22px !important;
  font-weight: 700 !important;
  color: var(--charcoal) !important;
  letter-spacing: -.02em !important;
}

/* Počet produktov */
.product-count-text {
  font-size: 14px !important;
  color: var(--mid) !important;
}

/* ── 19. SCROLL — plynulý ────────────────────────────────────── */
html {
  scroll-behavior: smooth !important;
}

/* ── 20. INLINE SEARCH ───────────────────────────────────────── */
#search input[type="text"],
#search .row #text {
  border: 1.5px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  padding: 10px 14px !important;
  font-size: 14px !important;
  font-family: 'Inter', Roboto, sans-serif !important;
  transition: border-color .2s !important;
  background: var(--white) !important;
}

#search input[type="text"]:focus,
#search .row #text:focus {
  outline: none !important;
  border-color: var(--rose) !important;
  box-shadow: 0 0 0 3px rgba(196,123,104,.15) !important;
}

/* ── 21. OPRAVA FARBY A VÁHY TEXTU V KARTÁCH ─────────────────── */
.product-content-description,
.product-content-description p,
.product-content-description a,
.product-second .product-content p,
.product-second .product-content a,
.product-first .product-content p,
.product-first .product-content a,
.product-third .product-content p,
.product-third .product-content a {
  color: var(--mid) !important;
  font-weight: 400 !important;
  text-decoration: none !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
}

/* Availability text "skladom" */
.product-second .product-content .availabilty,
.product-second .product-content .availability,
.product-second .availabilty,
.product-third .availabilty,
.product-first .availabilty {
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #059669 !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
}

/* ── 22. FILTER ACCORDION V KATALÓGU ─────────────────────────── */
/* Skutočná štruktúra: #catalog-appurtenances > .appurtenances-filter-show > p + div */

/* Kontajner všetkých filtrov — flex row */
#catalog-appurtenances {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  padding: 12px 16px !important;
  background: var(--light-bg) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  margin: 10px 0 16px !important;
}

/* Každá filter skupina */
.appurtenances-filter-show {
  position: relative !important;
  display: inline-block !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Názov filtra — pill button */
.appurtenances-filter-show > p {
  display: inline-flex !important;
  align-items: center !important;
  padding: 7px 16px !important;
  border: 1.5px solid var(--border) !important;
  border-radius: 24px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--charcoal) !important;
  background: var(--white) !important;
  cursor: pointer !important;
  margin: 0 !important;
  transition: var(--transition) !important;
  white-space: nowrap !important;
  user-select: none !important;
}

.appurtenances-filter-show > p:hover {
  background: var(--rose-light) !important;
  border-color: var(--rose) !important;
  color: var(--rose) !important;
}

/* Rozbalený panel s checkboxmi — dropdown panel, JS riadi display */
.appurtenances-filter-show > div {
  position: absolute !important;
  top: calc(100% + 6px) !important;
  left: 0 !important;
  z-index: 200 !important;
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow-md) !important;
  padding: 10px !important;
  min-width: 160px !important;
  /* display: neriadime my — JS toggle (none/block) musí fungovať */
  flex-direction: column !important;
  gap: 4px !important;
}

/* Keď JS zobrazí panel, styling ho ako flex */
.appurtenances-filter-show > div[style*="display: block"],
.appurtenances-filter-show > div[style*="display:block"] {
  display: flex !important;
  flex-direction: column !important;
}

/* Checkbox + label */
.appurtenances-filter-show > div label {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 6px 10px !important;
  border-radius: var(--radius-sm) !important;
  font-size: 12px !important;
  color: var(--charcoal) !important;
  cursor: pointer !important;
  transition: background .15s !important;
  white-space: nowrap !important;
}

.appurtenances-filter-show > div label:hover {
  background: var(--rose-light) !important;
}

.appurtenances-filter-show > div label input[type="checkbox"] {
  accent-color: var(--rose) !important;
  flex-shrink: 0 !important;
}

/* ── 23. HOMEPAGE SEKCIE NADPISY ─────────────────────────────── */
/* Červený banner p.products-title-with-line → moderný tmavý */
p.products-title-with-line {
  background: var(--charcoal) !important;
  color: var(--white) !important;
  border-radius: var(--radius-sm) !important;
  padding: 14px 24px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: .08em !important;
  text-align: center !important;
  text-transform: uppercase !important;
  margin-bottom: 20px !important;
}

/* Generický fallback pre iné červené section headery */
.products-slider-title,
.homepage-section-title,
.index-products-title,
.products-of-day-title {
  background: var(--charcoal) !important;
  color: var(--white) !important;
  border-radius: var(--radius-sm) !important;
  padding: 12px 24px !important;
}

/* ── 24. DETAIL PRODUKTU — CENA LAYOUT ───────────────────────── */
/* Cena a mena na jednom riadku */
#detail .price-wrap,
#detail .product-price-block,
.detail-price-row {
  display: flex !important;
  align-items: baseline !important;
  gap: 6px !important;
  flex-wrap: wrap !important;
}

/* ── 25. NAVIGAČNÉ ŠIPKY PRODUKTOVÉHO SLIDERA ────────────────── */
.product-slider-prev,
.product-slider-next,
.slick-prev,
.slick-next {
  background: var(--white) !important;
  border: 1.5px solid var(--border) !important;
  border-radius: 50% !important;
  width: 40px !important;
  height: 40px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: var(--transition) !important;
  box-shadow: var(--shadow-sm) !important;
  color: var(--charcoal) !important;
}

.product-slider-prev:hover,
.product-slider-next:hover,
.slick-prev:hover,
.slick-next:hover {
  background: var(--rose) !important;
  border-color: var(--rose) !important;
  color: var(--white) !important;
}

/* ── 26. DISPONIBILITA — "skladom" badge ─────────────────────── */
.product-availability,
.availability,
span.stock-status {
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #059669 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
}

/* ── 27. NEWSLETTER PÄTIČKA ──────────────────────────────────── */
#show-newsletter-in-footer {
  background: var(--light-bg) !important;
  border-top: 1px solid var(--border) !important;
  padding: 32px 0 !important;
}

#show-newsletter-in-footer h3,
#show-newsletter-in-footer h2 {
  font-size: 18px !important;
  font-weight: 600 !important;
  color: var(--charcoal) !important;
}

/* Newsletter input */
#show-newsletter-in-footer input[type="text"],
#show-newsletter-in-footer input[type="email"] {
  border: 1.5px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  padding: 10px 14px !important;
  font-size: 14px !important;
  font-family: 'Inter', Roboto, sans-serif !important;
  transition: border-color .2s !important;
  background: var(--white) !important;
}

#show-newsletter-in-footer input[type="text"]:focus,
#show-newsletter-in-footer input[type="email"]:focus {
  border-color: var(--rose) !important;
  box-shadow: 0 0 0 3px rgba(196,123,104,.15) !important;
  outline: none !important;
}

/* ── 28. TLAČIDLO "Späť do obchodu" a iné sekundárne ─────────── */
.button-type-2 a,
.button-back a,
.btn-back {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 10px 20px !important;
  border: 1.5px solid var(--charcoal) !important;
  border-radius: var(--radius-sm) !important;
  color: var(--charcoal) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: var(--transition) !important;
  background: transparent !important;
}

.button-type-2 a:hover,
.button-back a:hover {
  background: var(--charcoal) !important;
  color: var(--white) !important;
}

/* ── 29. FORMULÁRE — všeobecné ───────────────────────────────── */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
input[type="number"],
textarea,
select {
  font-family: 'Inter', Roboto, sans-serif !important;
}

/* ── 30. KATEGÓRIA — aktívna položka v navigácii ─────────────── */
#articles-menu > ul > li.active > a,
#articles-menu > ul > li.current > a {
  color: var(--rose) !important;
  background: var(--rose-light) !important;
}

/* ── 31. BODY BACKGROUND ─────────────────────────────────────── */
body, #bg {
  background: var(--white) !important;
}

/* ── 32. CONTENT AREA ────────────────────────────────────────── */
.content {
  padding-bottom: 24px !important;
}

/* ── 33. GLOBÁLNE LINKY V OBSAHU ─────────────────────────────── */
/* Články, info stránky — linky v rose namiesto modrej */
.content a:not([class]),
.article-content a,
.infoarticle-content a {
  color: var(--rose) !important;
  text-decoration: none !important;
  transition: color .2s !important;
}

.content a:not([class]):hover {
  color: var(--rose-dark) !important;
  text-decoration: underline !important;
}

/* ── 34. "ZOBRAZIŤ IBA PRODUKTY SKLADOM" — RESET ČERVENEJ ───── */
/* Override červeného linku v sort bare */
a[href*="in-stock"],
.show-in-stock-link,
#category-products div > a:first-child {
  color: var(--rose) !important;
}

/* ── 35. NOVINKY SIDEBAR BUTTON ──────────────────────────────── */
#show-in-slide {
  right: 0 !important;
}

#show-in-slide .slide-toggle-button,
#show-in-slide > div > a,
.news-slide-button {
  background: var(--charcoal) !important;
  color: var(--white) !important;
  border-radius: var(--radius-sm) 0 0 var(--radius-sm) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .08em !important;
}

/* ── 36. H1/H2/H3 TITULKY V OBSAHU ──────────────────────────── */
/* font-family tu uz nenastavujeme — o typografiu sa stara sekcia
   "TYPOGRAFIA — Cormorant Garamond + Inter" na konci suboru.
   Toto pravidlo (0,2,1) inak prebilo globalne h1..h6 (0,0,1). */
.content h1,
.content h2,
.content h3 {
  color: var(--charcoal) !important;
  letter-spacing: -.01em !important;
}

/* ── KONIEC PREDCHÁDZAJÚCEHO PRAVIDLA (doplnenie skráteného súboru) ── */
.content input[type="text"]:focus,
.content input[type="email"]:focus,
.content input[type="tel"]:focus,
.content textarea:focus {
  border-color: var(--rose) !important;
  box-shadow: 0 0 0 3px rgba(196,123,104,.12) !important;
  outline: none !important;
}

/* ══════════════════════════════════════════════════════════════════
   DARČEKOVÉ BALENIE — payoff-param-product-select-row
   ══════════════════════════════════════════════════════════════════ */

/* Sekcia wrapper */
.payoff-param-product-select-row {
  width: 100% !important;
  float: left !important;
  margin-top: 6px !important;
}

/* Nadpis sekcie */
.param-product-select-row-1 {
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .1em !important;
  color: var(--text-muted) !important;
  font-family: 'Inter', Roboto, sans-serif !important;
  margin-bottom: 10px !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid var(--border) !important;
  width: 100% !important;
  float: left !important;
}

/* Kontajner kariet */
.param-product-select-row-2 {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  float: none !important;
  width: 100% !important;
  margin-top: 4px !important;
}

/* Jednotlivá karta */
.param-product-select-row-2 > div {
  flex: 0 0 calc(50% - 5px) !important;
  box-sizing: border-box !important;
  border: 1.5px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  padding: 10px 8px !important;
  cursor: pointer !important;
  background: var(--white) !important;
  color: var(--text) !important;
  float: none !important;
  margin: 0 !important;
  text-align: center !important;
  transition: border-color .2s ease, box-shadow .2s ease, transform .15s ease !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 8px !important;
}

/* Hover efekt */
.param-product-select-row-2 > div:hover {
  border-color: var(--rose) !important;
  box-shadow: 0 3px 12px rgba(196,123,104,.15) !important;
  transform: translateY(-2px) !important;
}

/* Obrázok v karte */
.param-product-select-row-2 > div > img {
  display: block !important;
  margin: 0 auto !important;
  max-width: 100% !important;
  height: 70px !important;
  width: auto !important;
  object-fit: contain !important;
  border-radius: 4px !important;
}

/* Text / cena v karte */
.param-product-select-row-2 > div > p {
  font-size: 11.5px !important;
  font-weight: 500 !important;
  color: var(--text-muted) !important;
  font-family: 'Inter', Roboto, sans-serif !important;
  line-height: 1.3 !important;
  margin: 0 !important;
}

/* Aktívna (vybraná) karta */
.param-product-select-row-2 > div.param-product-select-row-active {
  border-color: var(--rose) !important;
  background: rgba(196,123,104,.08) !important;
  box-shadow: 0 0 0 2px rgba(196,123,104,.25) !important;
}

.param-product-select-row-2 > div.param-product-select-row-active > p {
  color: var(--rose) !important;
  font-weight: 600 !important;
}

/* Ak sú 3 karty — všetky na rovnaký riadok (calc pre 3 stĺpce) */
.param-product-select-row-2 > div:first-child:nth-last-child(3),
.param-product-select-row-2 > div:first-child:nth-last-child(3) ~ div {
  flex: 0 0 calc(33.33% - 7px) !important;
}

/* ══════════════════════════════════════════════════════════════════
   DETAIL PRODUKTU — KOMPLEXNÁ MODERNIZÁCIA
   ══════════════════════════════════════════════════════════════════ */

/* ── 1. PRICE-BLOCK — karta s cenou a košíkom ─────────────────── */
#price-block {
  background: var(--white) !important;
  border: 1.5px solid var(--border) !important;
  border-radius: var(--radius) !important;
  padding: 20px 22px !important;
  box-shadow: 0 2px 16px rgba(0,0,0,.06) !important;
  margin-bottom: 0 !important;
}

/* "Pridaj do košíka" — zmeniť na rose (primárna akcia) */
#detail .button-type-1,
#detail [id^="button-add-cart-button"],
#detail .button-add-cart-button {
  background: var(--rose) !important;
  border-radius: var(--radius-sm) !important;
  box-shadow: 0 4px 18px rgba(196,123,104,.30) !important;
  transition: background .2s ease, box-shadow .2s ease, transform .15s ease !important;
}

.add-cart-detail input[type="submit"],
.add-cart-detail button[type="submit"],
#detail .button-type-2 input[type="submit"],
#detail form input[type="submit"],
#detail form button[type="submit"],
#detail input.add-cart-button {
  background: var(--rose) !important;
  border-radius: var(--radius-sm) !important;
}

.add-cart-detail input[type="submit"]:hover,
.add-cart-detail button[type="submit"]:hover,
#detail .button-type-2 input[type="submit"]:hover,
#detail form input[type="submit"]:hover,
#detail form button[type="submit"]:hover,
#detail input.add-cart-button:hover {
  background: var(--rose-dark) !important;
  box-shadow: 0 6px 24px rgba(196,123,104,.45) !important;
  transform: translateY(-2px) !important;
}

/* ── 2. NA SKLADE — moderný zelený badge ──────────────────────── */
.appurtenancesGraphicStorageTable {
  width: 100% !important;
  border-collapse: separate !important;
  margin: 14px 0 8px !important;
}

.appurtenancesGraphicStorageTable .appurtenancesGraphicStorageTableHeader td {
  background: #edf7f0 !important;
  color: #2d7a4f !important;
  border: 1.5px solid #b8dfc8 !important;
  border-radius: var(--radius-sm) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  padding: 7px 16px !important;
  text-align: center !important;
  font-family: 'Inter', Roboto, sans-serif !important;
}

/* ── 3. PARAMETRE PRODUKTU — clean tabuľka ────────────────────── */
.param-product {
  margin: 14px 0 !important;
  border: 1.5px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  overflow: hidden !important;
}

.param-product-row {
  display: flex !important;
  align-items: center !important;
  padding: 0 !important;
  border-bottom: 1px solid var(--border) !important;
}

.param-product-row:last-child {
  border-bottom: none !important;
}

.param-product-row p {
  display: flex !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 9px 14px !important;
  align-items: center !important;
  gap: 8px !important;
}

.param-product-row.odd {
  background: var(--light-bg) !important;
}

.param-product-row.first {
  background: var(--white) !important;
}

.param-product-row .title {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--text-muted) !important;
  font-family: 'Inter', Roboto, sans-serif !important;
  flex: 0 0 48% !important;
  text-transform: none !important;
}

.param-product-row .text {
  font-size: 12.5px !important;
  font-weight: 500 !important;
  color: var(--text) !important;
  font-family: 'Inter', Roboto, sans-serif !important;
  flex: 1 !important;
}

/* ── 4. INFO-LINKS — akčné linky (Upozorniť, Pridať, ...) ─────── */
.info-links {
  margin: 14px 0 !important;
}

.info-links ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

.info-links ul li {
  float: none !important;
}

.info-links ul li a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  font-size: 11.5px !important;
  font-weight: 500 !important;
  color: var(--text-muted) !important;
  font-family: 'Inter', Roboto, sans-serif !important;
  background: var(--light-bg) !important;
  border: 1px solid var(--border) !important;
  border-radius: 20px !important;
  padding: 5px 12px !important;
  text-decoration: none !important;
  transition: color .2s ease, border-color .2s ease, background .2s ease !important;
  white-space: nowrap !important;
}

.info-links ul li a:hover {
  color: var(--rose) !important;
  border-color: var(--rose) !important;
  background: rgba(196,123,104,.06) !important;
}

/* ── 5. POSLEDNÉ PREZERANÉ — moderný header ───────────────────── */
p.products-title-with-line {
  display: block !important;
  width: 100% !important;
  background: transparent !important;
  color: var(--charcoal) !important;
  border-radius: 0 !important;
  border-left: 3px solid var(--rose) !important;
  border-bottom: 1px solid var(--border) !important;
  border-top: none !important;
  border-right: none !important;
  padding: 10px 0 10px 14px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  text-align: left !important;
  text-transform: uppercase !important;
  margin-bottom: 20px !important;
  box-shadow: none !important;
}

/* Text v span elemente nadpisu sekcie */
p.products-title-with-line span {
  color: var(--charcoal) !important;
  background: transparent !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  padding: 0 !important;
}

/* ── 6. CONTAINER-PRODUCT-ACTIONS — badge -56% a AKCIA ─────────── */
.container-product-actions {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}

.container-product-actions .clear {
  background: var(--rose) !important;
  color: var(--white) !important;
  border-radius: var(--radius-sm) !important;
  padding: 3px 10px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  display: inline-block !important;
  width: auto !important;
  float: none !important;
}

.container-product-actions .clear span {
  color: var(--white) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

.container-product-actions .action {
  background: var(--charcoal) !important;
  border-radius: var(--radius-sm) !important;
  padding: 3px 10px !important;
  display: inline-block !important;
  width: auto !important;
  float: none !important;
}

.container-product-actions .action span {
  color: var(--white) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
}

/* ── 7. GALÉRIA THUMBNAILOV ───────────────────────────────────── */
#gallery img {
  border-radius: var(--radius-sm) !important;
  transition: opacity .2s ease !important;
}

#gallery .gallery-thumbnails img,
#gallery .thumb img,
#gallery ul li img {
  border: 2px solid transparent !important;
  border-radius: var(--radius-sm) !important;
  cursor: pointer !important;
  transition: border-color .2s ease, opacity .2s ease !important;
}

#gallery .gallery-thumbnails img:hover,
#gallery .thumb img:hover,
#gallery ul li img:hover {
  border-color: var(--rose) !important;
  opacity: .88 !important;
}

/* ── 8. ODOSLAŤ BUTTON v "Otázka na predajcu" ─────────────────── */
.no-block input[type="submit"],
.no-block button[type="submit"] {
  background: var(--charcoal) !important;
  color: var(--white) !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
  padding: 12px 28px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: background .2s ease, transform .15s ease !important;
  font-family: 'Inter', Roboto, sans-serif !important;
}

.no-block input[type="submit"]:hover,
.no-block button[type="submit"]:hover {
  background: var(--rose) !important;
  transform: translateY(-1px) !important;
}

/* ── 9. DETAIL HODNOTENIE (evalution) ─────────────────────────── */
.evalution {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  margin-bottom: 4px !important;
}

/* ── 10. KÓD PRODUKTU ─────────────────────────────────────────── */
.product-code,
#detail .product-code,
[class*="product-code"] {
  font-size: 12px !important;
  color: var(--text-muted) !important;
  font-family: 'Inter', Roboto, sans-serif !important;
}


/* ── 11. OTÁZKA NA PREDAJCU – overlay + formulár ─────────────── */

/* === OVERLAY BACKDROP === */
.show-box-ajax,
.show-box-ajax-right {
  background: rgba(30,30,30,.55) !important;
  backdrop-filter: blur(3px) !important;
  -webkit-backdrop-filter: blur(3px) !important;
  opacity: 1 !important;
  position: fixed !important;
}

/* === CONTENT PANEL === */
.show-box-ajax-content,
.show-box-ajax-content-right {
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  margin: 0 !important;
  width: 520px !important;
  max-width: calc(100vw - 32px) !important;
  max-height: 90vh !important;
  overflow-y: auto !important;
  z-index: 200 !important;
  border-radius: 24px !important;
  box-shadow: 0 8px 40px rgba(0,0,0,.22) !important;
  background: var(--rose-light) !important;
}

/* Kľúčová oprava: base CSS dáva #form-question-seller position:fixed,
   čo spôsobuje, že vymkne z flow a panel má height:0 */
.show-box-ajax-content #form-question-seller,
.show-box-ajax-content-right #form-question-seller {
  position: static !important;
  width: 100% !important;
  top: auto !important;
}

/* === #alert-window vo vnútri panela === */
.show-box-ajax-content #alert-window,
.show-box-ajax-content-right #alert-window,
#form-question-seller #alert-window {
  width: 100% !important;
  background: transparent !important;
  border-radius: 24px !important;
  overflow: hidden !important;
  box-shadow: none !important;
}

/* === HEADER pruh === */
.show-box-ajax-content #alert-window .title-box,
.show-box-ajax-content-right #alert-window .title-box,
#form-question-seller #alert-window .title-box {
  background: transparent !important;
  height: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 18px 22px 14px !important;
  border-bottom: 1px solid var(--border) !important;
  border-left: none !important;
}

/* === Ikona (skrytá) === */
.show-box-ajax-content #alert-window .icon-box,
.show-box-ajax-content-right #alert-window .icon-box,
#form-question-seller #alert-window .icon-box {
  display: none !important;
}

/* === Title-box-position === */
.show-box-ajax-content #alert-window .title-box-position,
.show-box-ajax-content-right #alert-window .title-box-position,
#form-question-seller #alert-window .title-box-position {
  margin: 0 !important;
  float: none !important;
}

/* === Nadpis === */
.show-box-ajax-content #alert-window .title-box .title,
.show-box-ajax-content-right #alert-window .title-box .title,
#form-question-seller #alert-window .title-box .title {
  font-size: 13px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  color: var(--charcoal) !important;
  line-height: 1 !important;
  margin: 0 !important;
  font-family: 'Inter', Roboto, sans-serif !important;
}

/* === X (zavrieť) tlačidlo === */
.show-box-ajax-content #alert-window .close-window,
.show-box-ajax-content-right #alert-window .close-window,
#form-question-seller #alert-window .close-window {
  float: none !important;
}
.show-box-ajax-content #alert-window #a-close-window,
.show-box-ajax-content-right #alert-window #a-close-window,
#form-question-seller #alert-window #a-close-window {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  background: transparent !important;
  border: 1.5px solid var(--border) !important;
  border-radius: 50% !important;
  float: none !important;
  position: relative !important;
  transition: border-color .2s !important;
}
#a-close-window::before,
#a-close-window::after {
  content: '' !important;
  position: absolute !important;
  width: 12px !important;
  height: 1.5px !important;
  background: var(--text-muted) !important;
  border-radius: 2px !important;
  transition: background .2s !important;
}
#a-close-window::before { transform: rotate(45deg) !important; }
#a-close-window::after  { transform: rotate(-45deg) !important; }
#a-close-window:hover { border-color: var(--rose) !important; }
#a-close-window:hover::before,
#a-close-window:hover::after { background: var(--rose) !important; }

/* === Obsah formulára === */
.show-box-ajax-content #alert-window .content,
.show-box-ajax-content-right #alert-window .content,
#form-question-seller #alert-window .content {
  padding: 0 22px 22px !important;
  color: var(--text) !important;
  min-height: unset !important;
  background: transparent !important;
}

/* === Povinný údaj === */
#form-question-seller .info-required,
.show-box-ajax-content .info-required,
.show-box-ajax-content-right .info-required {
  font-size: 11px !important;
  color: var(--text-muted) !important;
  margin-bottom: 14px !important;
}

/* === Fieldset reset === */
#form-question-seller fieldset,
.show-box-ajax-content fieldset,
.show-box-ajax-content-right fieldset {
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* === Riadky === */
#form-question-seller .row,
#form-question-seller .row-captcha,
.show-box-ajax-content .row,
.show-box-ajax-content .row-captcha,
.show-box-ajax-content-right .row,
.show-box-ajax-content-right .row-captcha {
  margin-bottom: 12px !important;
}

/* === Labely === */
#form-question-seller label,
.show-box-ajax-content label,
.show-box-ajax-content-right label {
  font-size: 11px !important;
  font-weight: 600 !important;
  color: var(--text-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  display: block !important;
  margin-bottom: 5px !important;
  float: none !important;
  width: auto !important;
}

/* === Inputy === */
#form-question-seller .element input[type="text"],
#form-question-seller .element input[type="email"],
#form-question-seller .element input[type="tel"],
.show-box-ajax-content .element input[type="text"],
.show-box-ajax-content .element input[type="email"],
.show-box-ajax-content .element input[type="tel"],
.show-box-ajax-content-right .element input[type="text"],
.show-box-ajax-content-right .element input[type="email"],
.show-box-ajax-content-right .element input[type="tel"] {
  width: 100% !important;
  box-sizing: border-box !important;
  border: 1.5px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  padding: 10px 13px !important;
  font-size: 13px !important;
  font-family: 'Inter', Roboto, sans-serif !important;
  color: var(--text) !important;
  background: var(--light-bg) !important;
  transition: border-color .2s, box-shadow .2s !important;
  outline: none !important;
}

/* === Textarea === */
#form-question-seller .element textarea,
.show-box-ajax-content .element textarea,
.show-box-ajax-content-right .element textarea {
  width: 100% !important;
  box-sizing: border-box !important;
  border: 1.5px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  padding: 10px 13px !important;
  font-size: 13px !important;
  font-family: 'Inter', Roboto, sans-serif !important;
  color: var(--text) !important;
  background: var(--light-bg) !important;
  min-height: 90px !important;
  resize: vertical !important;
  transition: border-color .2s, box-shadow .2s !important;
  outline: none !important;
}

/* === Focus === */
#form-question-seller .element input:focus,
#form-question-seller .element textarea:focus,
.show-box-ajax-content .element input:focus,
.show-box-ajax-content .element textarea:focus,
.show-box-ajax-content-right .element input:focus,
.show-box-ajax-content-right .element textarea:focus {
  border-color: var(--rose) !important;
  box-shadow: 0 0 0 3px rgba(196,123,104,.15) !important;
  background: var(--white) !important;
}

/* === Odoslať – button-type-3 sprite override → solid rose === */
#question-button.button-type-3,
.show-box-ajax-content .button-type-3,
.show-box-ajax-content-right .button-type-3 {
  display: inline-flex !important;
  float: none !important;
  margin: 14px 0 4px !important;
  background: none !important;
}
#question-button .button-type-3-left,
#question-button .button-type-3-right,
.show-box-ajax-content .button-type-3-left,
.show-box-ajax-content .button-type-3-right,
.show-box-ajax-content-right .button-type-3-left,
.show-box-ajax-content-right .button-type-3-right {
  display: none !important;
}
#question-button .button-type-3-center,
.show-box-ajax-content .button-type-3-center,
.show-box-ajax-content-right .button-type-3-center {
  background: var(--rose) !important;
  border-radius: var(--radius-sm) !important;
  padding: 12px 28px !important;
  height: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  cursor: pointer !important;
  transition: background .2s, transform .15s !important;
}
#question-button .button-type-3-center:hover,
.show-box-ajax-content .button-type-3-center:hover,
.show-box-ajax-content-right .button-type-3-center:hover {
  background: var(--rose-dark) !important;
  transform: translateY(-1px) !important;
}
.button-type-3-center .icon-type-white-arrow { display: none !important; }
#question-button .button-type-3-center input[type="button"],
.show-box-ajax-content .button-type-3-center input[type="button"],
.show-box-ajax-content-right .button-type-3-center input[type="button"] {
  background: none !important;
  border: none !important;
  color: var(--white) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  font-family: 'Inter', Roboto, sans-serif !important;
  cursor: pointer !important;
  padding: 0 !important;
  letter-spacing: .04em !important;
}

/* ── 12. PRODUKT PRIDANÝ DO KOŠÍKA (add-product-success) ────────── */

/* Wrapper */
#cart-add-product-success.bg-cart-block,
#cart-add-product-success {
  background: var(--white) !important;
  border: 1.5px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: 0 2px 16px rgba(0,0,0,.06) !important;
  padding: 28px 28px 24px !important;
  margin: 20px 0 !important;
  min-height: unset !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 22px !important;
}

/* Ikona úspechu — nahradíme sprite moderným CSS kruhom s fajkou */
#cart-add-product-success .icon-success {
  background-image: none !important;
  background-color: var(--rose-light) !important;
  width: 52px !important;
  height: 52px !important;
  border-radius: 50% !important;
  float: none !important;
  flex-shrink: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
}
#cart-add-product-success .icon-success::before {
  content: '' !important;
  display: block !important;
  width: 11px !important;
  height: 20px !important;
  border-right: 3px solid var(--rose) !important;
  border-bottom: 3px solid var(--rose) !important;
  transform: rotate(45deg) translateY(-2px) !important;
  position: absolute !important;
}

/* Text blok */
#cart-add-product-success-text {
  flex: 1 !important;
}
#cart-add-product-success-text hr.space {
  display: none !important;
}

/* Nadpis */
#cart-add-product-success .title {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--charcoal) !important;
  font-family: 'Inter', Roboto, sans-serif !important;
  margin: 0 0 8px 0 !important;
}

/* Popis */
#cart-add-product-success .text {
  font-size: 13px !important;
  color: var(--text-muted) !important;
  font-family: 'Inter', Roboto, sans-serif !important;
  margin: 0 0 18px 0 !important;
  line-height: 1.5 !important;
}

/* ── Tlačidlá (sprite override) — scoped len na add-product-success ── */
/* Pokračovať v nákupe */
#cart-add-product-success .button-type-back {
  background: none !important;
  background-image: none !important;
  float: none !important;
  display: inline-flex !important;
  height: auto !important;
  width: auto !important;
}
#cart-add-product-success .button-type-back .buttons-text,
#cart-add-product-success .button-type-back a {
  display: inline-flex !important;
  align-items: center !important;
  background: var(--charcoal) !important;
  color: var(--white) !important;
  border-radius: var(--radius-sm) !important;
  padding: 11px 22px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  font-family: 'Inter', Roboto, sans-serif !important;
  text-decoration: none !important;
  transition: background .2s, transform .15s !important;
  letter-spacing: .03em !important;
}
#cart-add-product-success .button-type-back .buttons-text:hover,
#cart-add-product-success .button-type-back a:hover {
  background: var(--rose) !important;
  transform: translateY(-1px) !important;
}

/* Prejsť do košíka */
#cart-add-product-success .button-type-next {
  background: none !important;
  background-image: none !important;
  float: none !important;
  display: inline-flex !important;
  height: auto !important;
  width: auto !important;
  margin-right: 0 !important;
}
#cart-add-product-success .button-type-next .buttons-text,
#cart-add-product-success .button-type-next a {
  display: inline-flex !important;
  align-items: center !important;
  background: var(--rose) !important;
  color: var(--white) !important;
  border-radius: var(--radius-sm) !important;
  padding: 11px 22px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  font-family: 'Inter', Roboto, sans-serif !important;
  text-decoration: none !important;
  transition: background .2s, transform .15s !important;
  letter-spacing: .03em !important;
}
#cart-add-product-success .button-type-next .buttons-text:hover,
#cart-add-product-success .button-type-next a:hover {
  background: var(--rose-dark) !important;
  transform: translateY(-1px) !important;
}

/* Oba buttony v jednom riadku */
#cart-add-product-success-text .button-type-1 {
  display: inline-flex !important;
  margin-right: 10px !important;
}

/* ============================================================
   TYPOGRAFIA — Cormorant Garamond + Inter
   ------------------------------------------------------------
   Stav pred zmenou: telo a nadpisy mali Inter, ALE horne menu,
   podmenu a odkazy prihlasenia dedili z style.min.css font
   "Lemonada" (zaobleny display font povodne pre arabcinu).
   Do e-shopu s hodinkami nesedel a rozbijal hlavicku.
   Teraz: nadpisy = Cormorant Garamond (vysokokontrastna antikva,
   hodinarsky/luxusny vyraz), text + UI + cisla = Inter.
   Ceny nechavame v Inter — antikva ma stare stylove cislice
   a v tabulkach/kosiku by sa horsie citala.
   ============================================================ */

/* ── 1. Zakladny text ── */
body,
#bg,
.container,
p, li, td, th, label, input, select, textarea, button {
  font-family: var(--font-body) !important;
}

/* ── 2. Nadpisy ── */
h1, h2, h3, h4, h5, h6,
.index-catalog-header,
.product-content-title,
.product-content-title a,
.info-articles h1,
.info-articles h2,
.info-articles h3,
#detail h1,
#product-detail h1,
.detail-title,
.article-title,
.news-title {
  font-family: var(--font-head) !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}

/* antikva ma mensiu x-vysku — nadpisy potrebuju o nieco vacsi stupen */
h1, #detail h1, #product-detail h1, #catalog-header h1 {
  font-size: 30px !important;
  line-height: 1.2 !important;
  /* stare pravidla mali zaporny prestrk (-.02em) — pri antikve
     to lepi pismena k sebe, preto ho rusime */
  letter-spacing: 0 !important;
}

h2 { font-size: 24px !important; line-height: 1.25 !important; }
h3 { font-size: 20px !important; line-height: 1.3 !important; }

/* sekcny nadpis kategorie */
.index-catalog-header {
  font-size: 22px !important;
  font-weight: 600 !important;
  letter-spacing: .06em !important;
  text-transform: none !important;
}

/* `p.products-title-with-line` je zamerne maly verzalkovy eyebrow
   popisok (13px) — antikva vo verzalkach v takom stupni posobi slabo,
   preto ho vedome nechavame v Inter. */
p.products-title-with-line,
p.products-title-with-line span {
  font-family: var(--font-body) !important;
}

/* ── 3. Horne menu — nahradzame Lemonada ──
   base: #articles-menu>ul>li>a  (1 ID + 3 elementy) */
#articles-menu > ul > li > a,
#articles-menu .submenu > li > a,
#articles-menu .submenu-1 > li > a,
#articles-menu .submenu-2 > li > a,
#articles-menu .submenu-3 > li > a,
#articlesInButton li ul li a,
#articles-menu-top > ul > li > a,
#head-login > a,
#head-login a,
#mobile-hamburger-menu a {
  font-family: var(--font-body) !important;
  font-weight: 500 !important;
  letter-spacing: .04em !important;
}

/* ── 4. Tlacidla a UI ── */
.button-type-1 a,
.button-type-1 input,
.button-type-1 button,
input[type="submit"],
input[type="button"],
button {
  font-family: var(--font-body) !important;
}

/* ── 5. Ceny a cisla — zamerne Inter ── */
.price,
.normal_price,
.old_price,
.save-price,
.price-info,
.percet,
#fullPrice,
.count,
.mini-imput-text {
  font-family: var(--font-body) !important;
  font-variant-numeric: tabular-nums !important;
}

/* ── 6. Logo / nazov obchodu ── */
#logo a,
#logo span,
.logo-text {
  font-family: var(--font-head) !important;
  font-weight: 600 !important;
  letter-spacing: .04em !important;
}

/* ── 7. Drobne popisky ostavaju v Inter ── */
.breadcrumbs,
.breadcrumbs a,
.pagination,
.pagination a,
small,
.note,
.info-text {
  font-family: var(--font-body) !important;
}

@media screen and (max-width: 700px) {

  h1, #detail h1, #product-detail h1 { font-size: 25px !important; }
  h2 { font-size: 21px !important; }
  .index-catalog-header { font-size: 19px !important; }
}

/* ── 8. Odkazy vnutri nadpisov ──────────────────────────────────
   Nazvy produktov su `h4 > a`. Odkaz nededi font po nadpise,
   lebo base CSS mu nastavuje vlastnu rodinu — musime ho uviest
   samostatne. */
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a,
.product-second h4 a,
.product-third h4 a,
.product-content-title a {
  font-family: var(--font-head) !important;
}

/* nazov produktu v dlazdici — antikva ma mensiu x-vysku,
   povodnych 12px by bolo necitatelnych */
.product-second h4,
.product-second h4 a,
.product-third h4,
.product-third h4 a {
  font-size: 15.5px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  letter-spacing: 0 !important;
}

/* ============================================================
   VYHLADAVANIE V BANNERI (.search-banner)
   ------------------------------------------------------------
   Stav pred zmenou:
   - #fieldset-search bol sirsi (281px) ako obal .search-banner-wrap
     (225px), takze pole vytrcalo z obalu
   - .buttons plavalo doprava a input#indexSearch (56x50) preteka
     zo svojho 29x41 wrappera → cierny stvorec vytrcajuci z pilulky
   - tlacidlo nemalo ziadnu ikonu ani popis (label je v Search.php
     prazdny a formular je zdielany s hlavickou, tak ho nemenime)
   Teraz: jedna biela pilulka, vnutri pole a vpravo kruhove
   tlacidlo s lupou.
   .search-banner-box ma display:flex + justify-content:center,
   takze absolutne poziciovany .search-banner-wrap sa centruje sam
   podla svojej statickej pozicie — staci mu dat sirku.
   ============================================================ */

.search-banner-wrap {
  /* sirsie by uz zasahovalo do napisu v pravej casti banneru */
  width: 420px !important;
  max-width: calc(100% - 40px) !important;
}

.search-banner,
.search-banner #search,
.search-banner #searchform,
.search-banner #search .myform {
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* pilulka */
.search-banner #search .myform #fieldset-search {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 6px 6px 6px 0 !important;
  background: var(--white) !important;
  border: none !important;
  border-radius: 100px !important;
  box-shadow: 0 12px 36px rgba(0,0,0,.18) !important;
  box-sizing: border-box !important;
  transition: box-shadow .22s ease !important;
}

.search-banner #search:hover .myform #fieldset-search,
.search-banner #search .myform #fieldset-search:focus-within {
  box-shadow: 0 16px 44px rgba(0,0,0,.26) !important;
}

.search-banner #search .myform #fieldset-search > .row,
.search-banner #search .myform #fieldset-search > .row > .element {
  flex: 1 1 auto !important;
  float: none !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* pole — biele pozadie a tien uz nesie pilulka */
.search-banner #search .row #text {
  display: block !important;
  float: none !important;
  width: 100% !important;
  height: 48px !important;
  margin: 0 !important;
  padding: 0 12px 0 26px !important;
  border: none !important;
  border-radius: 100px !important;
  background: transparent !important;
  box-shadow: none !important;
  font-family: var(--font-body) !important;
  font-size: 15px !important;
  color: var(--charcoal) !important;
  box-sizing: border-box !important;
}

.search-banner #search .row #text:focus {
  outline: none !important;
}

.search-banner #search .row #text::placeholder {
  color: #9b9b9b !important;
  opacity: 1 !important;
}

/* obal tlacidla — base mu dava float:right, pevnych 29x41 a margin */
.search-banner #search .myform .buttons,
.search-banner #search .myform #button-indexSearch {
  flex: 0 0 auto !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* kruhove tlacidlo s lupou (popis je prazdny, preto ikona v pozadi) */
.search-banner #search .myform #indexSearch {
  display: block !important;
  float: none !important;
  width: 48px !important;
  height: 48px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  border-radius: 50% !important;
  background-color: var(--charcoal) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.6-3.6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 19px 19px !important;
  font-size: 0 !important;
  text-indent: 0 !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: background-color .2s ease, transform .15s ease !important;
  -webkit-appearance: none !important;
          appearance: none !important;
}

.search-banner #search .myform #indexSearch:hover {
  background-color: var(--rose) !important;
  transform: scale(1.06) !important;
}

.search-banner #search .myform #indexSearch:active {
  transform: scale(.98) !important;
}

@media screen and (max-width: 640px) {

  .search-banner-wrap {
    width: 340px !important;
  }

  .search-banner #search .row #text {
    height: 44px !important;
    font-size: 14px !important;
    padding-left: 20px !important;
  }

  .search-banner #search .myform #indexSearch {
    width: 44px !important;
    height: 44px !important;
    background-size: 17px 17px !important;
  }
}

/* ============================================================
   NOVINKY — vysuvaci panel vpravo (#news-slide)
   ------------------------------------------------------------
   Povodne: bledomodra zalozka (#059FDD), ktora nesedela s temou,
   a biely panel bez zaoblenia, hlavicky a hover stavov.
   JS animuje `margin-right` na #news-slide-content medzi 0 a
   -sirkou panela — preto mu NESMIEME prepisat margin-right ani
   display, inak sa panel nebude otvarat.
   Sirku panela nechavame 300px, aby sedela s -300px v base CSS.
   ============================================================ */

#news-slide {
  background: transparent !important;
  filter: drop-shadow(0 8px 26px rgba(26,26,26,.22)) !important;
}

/* ── Zalozka ── */
#news-slide-icon {
  width: 44px !important;
  background: var(--rose) !important;
  border-radius: var(--radius) 0 0 var(--radius) !important;
  cursor: pointer !important;
  transition: background-color .22s ease !important;
}

/* opacne ako predtym — zalozka je rose, na hover stmavne na charcoal */
#news-slide-icon:hover {
  background: var(--charcoal) !important;
}

/* ikonka zvoncека nad textom */
#news-slide-icon::before {
  content: '' !important;
  position: absolute !important;
  top: 15px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 17px !important;
  height: 17px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9'/%3E%3Cpath d='M13.73 21a2 2 0 0 1-3.46 0'/%3E%3C/svg%3E") !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  pointer-events: none !important;
}

#news-slide-icon p {
  top: 62px !important;
  font-family: var(--font-body) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  color: var(--white) !important;
  margin: 0 !important;
}

/* ── Panel ── */
#news-slide-content {
  width: 300px !important;
  padding: 0 !important;
  background: var(--white) !important;
  border-radius: 0 0 0 var(--radius) !important;
  overflow: hidden !important;
}

/* hlavicka panela — sablona ju nema, doplname cez CSS */
#news-slide-content::before {
  content: 'Novinky';
  display: block;
  padding: 14px 18px;
  background: var(--charcoal);
  color: var(--white);
  font-family: var(--font-body);
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
}

#news-slide-content .news-slide-single {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 13px 18px !important;
  border-bottom: 1px solid var(--border) !important;
  transition: background-color .18s ease !important;
}

#news-slide-content .news-slide-single:last-child {
  border-bottom: none !important;
}

#news-slide-content .news-slide-single:hover {
  background: var(--rose-light) !important;
}

/* datum */
#news-slide-content .news-slide-single > p {
  float: none !important;
  width: auto !important;
  margin: 0 0 4px !important;
  font-family: var(--font-body) !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
  letter-spacing: .07em !important;
  text-transform: uppercase !important;
  color: var(--mid) !important;
}

/* titulok novinky — antikva, rovnako ako ostatne nadpisy */
#news-slide-content .news-slide-single > a {
  display: block !important;
  float: none !important;
  width: auto !important;
  font-family: var(--font-head) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  letter-spacing: 0 !important;
  color: var(--charcoal) !important;
  text-decoration: none !important;
  transition: color .18s ease !important;
}

#news-slide-content .news-slide-single:hover > a {
  color: var(--rose) !important;
}

@media screen and (max-width: 600px) {

  #news-slide-content {
    width: 260px !important;
  }

  /* base ma natvrdo margin-right:-300px — pri uzsom paneli by
     zostal 40px pruh vykukajuci cez pravy okraj.
     Bez !important, aby jQuery .animate() mohol inline prepisat. */
  #news-slide #news-slide-content {
    margin-right: -260px;
  }
}

/* ============================================================
   KOSIK — 1. KROK (body.cart-first)
   ------------------------------------------------------------
   Rozlozenie: dva stlpce + lepiva karta so suhrnom vpravo.
   .cart-steps je mriezka; formular ma `display: contents`,
   takze jeho deti sa radia priamo do mriezky. Formular MUSI
   ostat priamym potomkom .cart-steps — cart-first-step-functions.js
   pocuva na `$('.cart-steps > form').submit(...)`.
   ============================================================ */

body.cart-first .content {
  max-width: 1200px !important;
  margin: 0 auto !important;
}

body.cart-first .cart-steps {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 340px !important;
  align-items: start !important;
  gap: 22px 26px !important;
  width: 100% !important;
  float: none !important;
}

body.cart-first .cart-steps > form {
  display: contents !important;
}

/* co patri do laveho stlpca */
body.cart-first #cart-big-navigation,
body.cart-first #products-to-break-price-level,
body.cart-first .cart-steps > .bg-cart-block {
  grid-column: 1 / -1 !important;
}

body.cart-first #cart-products,
body.cart-first #cart-coutry-pay-delivery-selections,
body.cart-first #three_emails_in_cart,
body.cart-first #gifts_in_cart,
body.cart-first #cart_description,
body.cart-first #cart-first-step-bottom-buttons {
  grid-column: 1 !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
}

/* suhrn zacina hned vedla poloziek (2. riadok mriezky) a siaha nadol */
body.cart-first .cart-summary {
  grid-column: 2 !important;
  grid-row: 2 / span 20 !important;
}

/* upsell az uplne na koniec — inak by rozdelil lavy stlpec */
body.cart-first #products-to-break-price-level {
  order: 9 !important;
}

/* ── Kroky objednavky ── */
body.cart-first #cart-big-navigation {
  margin: 0 0 6px !important;
  padding: 0 0 20px !important;
  border-bottom: 1px solid var(--border) !important;
  text-align: center !important;
}

/* ── Polozky kosika ── */
body.cart-first #cart-products {
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  padding: 6px 20px !important;
  box-sizing: border-box !important;
}

body.cart-first #cart-info-table {
  width: 100% !important;
  border-collapse: collapse !important;
  table-layout: auto !important;
}

body.cart-first #cart-info-table tr.normal > td {
  padding: 16px 8px !important;
  border-bottom: 1px solid var(--border) !important;
  vertical-align: middle !important;
  background: transparent !important;
}

body.cart-first #cart-info-table tr.normal:last-of-type > td,
body.cart-first #cart-info-table tr#return-coupons > td {
  border-bottom: none !important;
}

/* foto */
body.cart-first #cart-info-table tr.normal > td:first-child {
  width: 92px !important;
  padding-left: 0 !important;
}

body.cart-first #cart-info-table tr.normal > td:first-child img {
  display: block !important;
  width: 72px !important;
  height: auto !important;
  border-radius: var(--radius-sm) !important;
  background: var(--light-bg) !important;
}

/* nazov */
body.cart-first #cart-info-table tr.normal > td:nth-child(2) p {
  margin: 0 !important;
}

body.cart-first #cart-info-table tr.normal > td:nth-child(2) p:empty {
  display: none !important;
}

body.cart-first #cart-info-table tr.normal > td:nth-child(2) a {
  font-family: var(--font-head) !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  color: var(--charcoal) !important;
  text-decoration: none !important;
  transition: color .18s !important;
}

body.cart-first #cart-info-table tr.normal > td:nth-child(2) a:hover {
  color: var(--rose) !important;
}

body.cart-first .cart-delivery-time-info {
  margin: 4px 0 0 !important;
  font-family: var(--font-body) !important;
  font-size: 12.5px !important;
  color: var(--mid) !important;
}

/* jednotkova cena */
body.cart-first #cart-info-table td.price {
  font-family: var(--font-body) !important;
  font-size: 13.5px !important;
  color: var(--mid) !important;
  white-space: nowrap !important;
  text-align: right !important;
  font-variant-numeric: tabular-nums !important;
}

/* cena spolu za riadok */
body.cart-first #cart-info-table td.price-all {
  font-family: var(--font-body) !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  color: var(--charcoal) !important;
  white-space: nowrap !important;
  text-align: right !important;
  font-variant-numeric: tabular-nums !important;
}

/* ── Pocitadlo kusov ──
   Tlacidla su input[type=submit], ktorych `value` je ID produktu
   (napr. 3849) — text preto musime skryt (font-size:0) a ikonu
   vykreslit cez background-image. Povodne to bola sprite ikonka,
   ktoru neskorsia uprava prekryla ciernym pozadim → cierne skvrny. */
body.cart-first .counter {
  display: flex !important;
  justify-content: center !important;
  height: auto !important;
}

body.cart-first .counter > p {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0 !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--border) !important;
  border-radius: 100px !important;
  background: var(--white) !important;
  overflow: hidden !important;
}

body.cart-first .counter > p > span.inputCount {
  order: 2 !important;
  float: none !important;
  width: 40px !important;
  height: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  font-family: var(--font-body) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 34px !important;
  text-align: center !important;
  color: var(--charcoal) !important;
  font-variant-numeric: tabular-nums !important;
}

/* prazdny span na konci — v base niesol sprite, uz netreba */
body.cart-first .counter > p > span:not(.inputCount) {
  display: none !important;
}

body.cart-first .counter > p > input#input-remove,
body.cart-first .counter > p > input#input-add {
  float: none !important;
  width: 34px !important;
  height: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 13px 13px !important;
  font-size: 0 !important;      /* skryje ID produktu vo `value` */
  color: transparent !important;
  text-indent: 0 !important;
  cursor: pointer !important;
  transition: background-color .16s !important;
  -webkit-appearance: none !important;
          appearance: none !important;
}

body.cart-first .counter > p > input#input-remove {
  order: 1 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' stroke='%231a1a1a' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E") !important;
}

body.cart-first .counter > p > input#input-add {
  order: 3 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' stroke='%231a1a1a' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") !important;
}

body.cart-first .counter > p > input#input-remove:hover,
body.cart-first .counter > p > input#input-add:hover {
  background-color: var(--rose-light) !important;
}

/* ── Odstranenie polozky ── */
body.cart-first #cart-info-table tr.normal > td:last-child {
  width: 56px !important;
  padding-right: 0 !important;
  text-align: right !important;
}

body.cart-first #cart-info-table td .button-type-1 {
  float: none !important;
  display: inline-block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

body.cart-first #cart-info-table td .button-type-1 a.buttons-text {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  padding: 0 !important;
  border: 1px solid var(--border) !important;
  border-radius: 50% !important;
  background-color: var(--white) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 13px 13px !important;
  font-size: 0 !important;
  transition: var(--transition) !important;
}

body.cart-first #cart-info-table td .button-type-1 a.buttons-text:hover {
  border-color: var(--rose) !important;
  background-color: var(--rose-light) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c47b68' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E") !important;
}

body.cart-first #cart-info-table td .button-type-1 a.buttons-text span {
  display: none !important;
}

/* ── Zlavovy kupon ── */
body.cart-first #return-coupons > td {
  padding: 18px 0 8px !important;
  border-top: 1px solid var(--border) !important;
}

body.cart-first #coupons-bg {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 10px !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

body.cart-first #coupons-bg .coupons-text {
  flex: 0 0 auto !important;
  margin: 0 !important;
}

body.cart-first #coupons-bg .coupons-text p {
  margin: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 13px !important;
  color: var(--mid) !important;
}

body.cart-first #coupons-bg .coupons-text b {
  font-weight: 600 !important;
  color: var(--charcoal) !important;
}

body.cart-first input#coupons {
  flex: 1 1 160px !important;
  min-width: 0 !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  background: var(--white) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  box-sizing: border-box !important;
  transition: var(--transition) !important;
}

body.cart-first input#coupons:focus {
  outline: none !important;
  border-color: var(--rose) !important;
  box-shadow: 0 0 0 3px rgba(196,123,104,.12) !important;
}

/* ── Krajina / platba / doprava ── */
body.cart-first #cart-coutry-pay-delivery-selections {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: start !important;
  gap: 12px !important;
  width: 100% !important;
  float: none !important;
}

/* Prihlaseny zakaznik uz krajinu nevybera — sablona vtedy vykresli
   len dva boxy s triedou .cart-cols-2 (namiesto troch .cart-cols-3).
   V takom pripade prepneme mriezku na dva stlpce, aby platba
   a doprava vyplnili celu sirku a nezostal prazdny treti stlpec. */
body.cart-first #cart-coutry-pay-delivery-selections:has(.cart-cols-2) {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

body.cart-first .cart-cols-2,
body.cart-first .cart-cols-3 {
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  overflow: hidden !important;
}

body.cart-first #cart-coutry-pay-delivery-selections #del-title {
  margin: 0 !important;
  padding: 13px 16px !important;
  background: var(--light-bg) !important;
  border-bottom: 1px solid var(--border) !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
}

body.cart-first #cart-coutry-pay-delivery-selections #del-title p {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  height: auto !important;   /* base mal pevnu vysku kvoli sprite ikone */
  line-height: 1.3 !important;
  margin: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: var(--charcoal) !important;
}

body.cart-first #cart-coutry-pay-delivery-selections #del-title p span {
  flex: 0 0 auto !important;
}

/* base ma content-box → sirka 100% + 28px paddingu pretekala z karty */
body.cart-first .cart-first-radio-container {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 10px 14px 14px !important;
  overflow: hidden !important;
}

body.cart-first .cart-first-radio-container * {
  box-sizing: border-box !important;
  max-width: 100% !important;
}

body.cart-first .cart-first-radio-container hr.space {
  width: auto !important;
  margin: 10px 0 !important;
  border: none !important;
  border-top: 1px solid var(--border) !important;
}

body.cart-first .cart-first-radio-container hr.space:last-child {
  display: none !important;
}

/* jednotlive moznosti — riadok s obrazkom + radiom */
body.cart-first .cart-first-radio-container > img,
body.cart-first .cart-first-radio-container > .thumb-image {
  float: left !important;
  clear: left !important;
  width: 34px !important;
  height: auto !important;
  margin: 4px 10px 0 0 !important;
}

body.cart-first .cart-first-radio-container label {
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  color: var(--charcoal) !important;
  cursor: pointer !important;
}

body.cart-first .cart-first-radio-container .payWithPicture,
body.cart-first .cart-first-radio-container > div:not([id]) {
  clear: both !important;
  margin: 2px 0 0 !important;
  font-size: 12.5px !important;
  line-height: 1.5 !important;
  color: var(--mid) !important;
}

body.cart-first .cart-first-radio-container select {
  width: 100% !important;
  height: 42px !important;
  margin: 8px 0 !important;
  padding: 0 10px !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  background: var(--white) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  box-sizing: border-box !important;
}

/* ── Poznamka k objednavke ── */
body.cart-first #cart_description {
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  padding: 16px 18px !important;
  box-sizing: border-box !important;
}

body.cart-first #cart_description label {
  display: block !important;
  margin: 0 0 8px !important;
  font-family: var(--font-body) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  color: var(--mid) !important;
}

body.cart-first #cart_description textarea {
  width: 100% !important;
  min-height: 90px !important;
  margin: 0 !important;
  padding: 12px 14px !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  background: var(--white) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  box-sizing: border-box !important;
  resize: vertical !important;
  transition: var(--transition) !important;
}

body.cart-first #cart_description textarea:focus {
  outline: none !important;
  border-color: var(--rose) !important;
  box-shadow: 0 0 0 3px rgba(196,123,104,.12) !important;
}

/* ── Spatne tlacidlo ── */
body.cart-first #cart-first-step-bottom-buttons {
  display: flex !important;
  justify-content: flex-start !important;
}

body.cart-first #cart-first-step-bottom-buttons .button-type-back {
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

body.cart-first #cart-first-step-bottom-buttons .button-type-back a.buttons-text {
  display: inline-block !important;
  padding: 13px 22px !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  background: var(--white) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--charcoal) !important;
  text-decoration: none !important;
  transition: var(--transition) !important;
}

body.cart-first #cart-first-step-bottom-buttons .button-type-back a.buttons-text:hover {
  border-color: var(--rose) !important;
  color: var(--rose) !important;
  background: var(--rose-light) !important;
}

/* ── Suhrn objednavky (lepiva karta vpravo) ── */
body.cart-first .cart-summary {
  position: sticky !important;
  top: 96px !important;   /* hlavicka je sticky, 72px + odsadenie */
  align-self: start !important;
}

body.cart-first .cart-summary-card {
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow-md) !important;
  padding: 20px 20px 18px !important;
  box-sizing: border-box !important;
}

body.cart-first .cart-summary-title {
  margin: 0 0 14px !important;
  padding: 0 0 12px !important;
  border-bottom: 1px solid var(--border) !important;
  font-family: var(--font-body) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: var(--charcoal) !important;
}

/* nudge do dopravy zadarmo — bol siroky tyrkysovy pruh */
body.cart-first .cart-summary #renderFreeDelivery {
  display: flow-root !important;   /* dieta je float:left → obal mal vysku 0 */
  float: none !important;
  width: auto !important;
  margin: 0 !important;
}

body.cart-first .cart-summary #renderFreeDelivery .info-price,
body.cart-first .cart-summary #renderFreeDelivery > div {
  box-sizing: border-box !important;   /* base ma content-box → pretekalo */
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 14px !important;
  padding: 11px 13px !important;
  background: var(--rose-light) !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
  color: var(--charcoal) !important;
  font-family: var(--font-body) !important;
  font-size: 12.5px !important;
  line-height: 1.5 !important;
}

body.cart-first .cart-summary #renderFreeDelivery .info-price p {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  color: var(--charcoal) !important;
}

body.cart-first .cart-summary #renderFreeDelivery .info-price b {
  color: var(--rose-dark) !important;
}

body.cart-first .cart-summary #renderFreeDelivery .icon-type-info-price {
  display: none !important;
}

body.cart-first .cart-summary #renderFreeDelivery hr.space {
  display: none !important;
}

/* celkova suma — bol cierny pruh cez celu sirku */
body.cart-first .cart-summary #fullPrice {
  float: none !important;
  width: auto !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  color: var(--charcoal) !important;
}

body.cart-first .cart-summary #fullPrice p {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  color: var(--charcoal) !important;
}

body.cart-first .cart-summary #fullPrice .text {
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--charcoal) !important;
}

body.cart-first .cart-summary #fullPrice .price {
  font-family: var(--font-body) !important;
  font-size: 26px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  color: var(--charcoal) !important;
  white-space: nowrap !important;
  font-variant-numeric: tabular-nums !important;
}

/* CTA — wrapper .button-type-1 ma z base vlastne pozadie a vysku */
body.cart-first .cart-summary #button-payDel-button {
  display: block !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cart-first .cart-summary #payDel-button {
  display: block !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 16px 20px !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
  background: var(--charcoal) !important;
  color: var(--white) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: .04em !important;
  line-height: 1.2 !important;
  white-space: normal !important;
  cursor: pointer !important;
  box-shadow: 0 6px 20px rgba(26,26,26,.22) !important;
  transition: var(--transition) !important;
  -webkit-appearance: none !important;
          appearance: none !important;
}

body.cart-first .cart-summary #payDel-button:hover {
  background: var(--rose) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 26px rgba(196,123,104,.36) !important;
}

body.cart-first .cart-summary #payDel-button:active {
  transform: translateY(0) !important;
}

/* dovera pod tlacidlom */
body.cart-first .cart-summary-trust {
  list-style: none !important;
  margin: 16px 0 0 !important;
  padding: 14px 0 0 !important;
  border-top: 1px solid var(--border) !important;
}

body.cart-first .cart-summary-trust li {
  position: relative !important;
  margin: 0 0 8px !important;
  padding: 0 0 0 26px !important;
  font-family: var(--font-body) !important;
  font-size: 12.5px !important;
  line-height: 1.45 !important;
  color: var(--mid) !important;
  list-style: none !important;
}

body.cart-first .cart-summary-trust li:last-child {
  margin-bottom: 0 !important;
}

body.cart-first .cart-summary-trust li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 1px;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

body.cart-first .cart-summary-trust .cart-trust-secure::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c47b68' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='11' width='18' height='11' rx='2'/%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'/%3E%3C/svg%3E");
}

body.cart-first .cart-summary-trust .cart-trust-stock::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c47b68' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21 16-9 5-9-5V8l9-5 9 5z'/%3E%3Cpath d='m3.3 7.3 8.7 4.9 8.7-4.9M12 21v-8.8'/%3E%3C/svg%3E");
}

body.cart-first .cart-summary-trust .cart-trust-return::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c47b68' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12a9 9 0 1 0 3-6.7L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3C/svg%3E");
}

/* ── Upsell blok pod kosikom ── */
body.cart-first #products-to-break-price-level {
  float: none !important;
  width: auto !important;
  margin: 6px 0 0 !important;
}

body.cart-first #products-to-break-price-level .info-price,
body.cart-first #products-to-break-price-level > div:first-child {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  margin: 0 0 16px !important;
  padding: 13px 16px !important;
  background: var(--rose-light) !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
  color: var(--charcoal) !important;
  font-family: var(--font-body) !important;
  font-size: 13.5px !important;
}

body.cart-first #products-to-break-price-level .info-price p {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  color: var(--charcoal) !important;
}

body.cart-first #products-to-break-price-level .icon-type-info-price {
  display: none !important;
}

/* ── Mobil ── */
@media screen and (max-width: 900px) {

  body.cart-first .cart-steps {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.cart-first .cart-summary {
    position: static !important;
    grid-column: 1 !important;
    grid-row: auto !important;
    order: 99 !important;
  }

  body.cart-first #cart-coutry-pay-delivery-selections {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

@media screen and (max-width: 600px) {

  body.cart-first #cart-products {
    padding: 6px 12px !important;
  }

  body.cart-first #cart-info-table tr.normal > td {
    padding: 12px 4px !important;
  }

  body.cart-first #cart-info-table tr.normal > td:first-child {
    width: 68px !important;
  }

  body.cart-first #cart-info-table tr.normal > td:first-child img {
    width: 56px !important;
  }

  body.cart-first #cart-info-table td.price {
    display: none !important;   /* jednotkova cena na mobile ustupi */
  }
}

/* ── Ikony v hlavickach kariet krajina/platba/doprava ──
   Su to sprite spany bez rozmerov (67-99 x 69 px) — v hlavicke
   preto tlacili nadpis do zalomenia. Nahradzame ich malymi
   vektorovymi ikonami. */
body.cart-first #cart-coutry-pay-delivery-selections #del-title p span {
  flex: 0 0 auto !important;
  width: 18px !important;
  height: 18px !important;
  background-image: none !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 18px 18px !important;
}

body.cart-first #cart-coutry-pay-delivery-selections #del-title p span.icon-cart-cols-country {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c47b68' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3a15 15 0 0 1 0 18 15 15 0 0 1 0-18'/%3E%3C/svg%3E") !important;
}

body.cart-first #cart-coutry-pay-delivery-selections #del-title p span.icon-cart-cols-payment {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c47b68' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='5' width='20' height='14' rx='2'/%3E%3Cpath d='M2 10h20'/%3E%3C/svg%3E") !important;
}

body.cart-first #cart-coutry-pay-delivery-selections #del-title p span.icon-cart-cols-delivery {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c47b68' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 3h13v13H1zM14 8h4l3 3v5h-7z'/%3E%3Ccircle cx='6' cy='19' r='2'/%3E%3Ccircle cx='17.5' cy='19' r='2'/%3E%3C/svg%3E") !important;
}

/* ── Tlacidlo "Uplatnit zlavovy kupon" ── */
body.cart-first #cart-confirm-coupon-button {
  flex: 0 0 auto !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

body.cart-first #cart-confirm-coupon-button a {
  display: inline-block !important;
  padding: 13px 20px !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
  background: var(--charcoal) !important;
  color: var(--white) !important;
  font-family: var(--font-body) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  transition: var(--transition) !important;
}

body.cart-first #cart-confirm-coupon-button a:hover {
  background: var(--rose) !important;
}

/* ── Darceky k nakupu (zobrazi sa az po prekroceni hladiny) ── */
body.cart-first #gifts_in_cart:not(:empty) {
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  padding: 18px 20px !important;
  box-sizing: border-box !important;
}

body.cart-first #gifts_in_cart h1,
body.cart-first #gifts_in_cart h2,
body.cart-first #gifts_in_cart h3 {
  margin: 0 0 4px !important;
  font-size: 20px !important;
}

body.cart-first #gifts_in_cart p {
  margin: 0 0 4px !important;
  font-family: var(--font-body) !important;
  font-size: 13px !important;
  color: var(--mid) !important;
}

/* ============================================================
   KOSIK — 2. KROK (body.cart-second) — dodacie udaje
   ------------------------------------------------------------
   Stav pred zmenou:
   - formular sa tiahol cez celych 1200px, takze pole "meno" malo
     588px a "ulica" 1200px — oko nema kde zakotvit
   - riadky (.row-full/.row-big/.row-small/.row-medium) su floaty
     bez medzier
   - suhlasy: `label` ma float:right a sirku 1185px, checkbox
     float:left → text a policko sa lamali a nesedeli na linke
   - nadpisy sekcii boli len obycajny odstavec
   Teraz: sustredena karta so sirkou 760px, mriezka poli, jasne
   sekcie, vlastne checkboxy a lista s tlacidlami.
   ============================================================ */

body.cart-second .content {
  max-width: 1200px !important;
  margin: 0 auto !important;
}

body.cart-second #cart-big-navigation {
  margin: 0 0 26px !important;
  padding: 0 0 22px !important;
  border-bottom: 1px solid var(--border) !important;
  float: none !important;
  text-align: center !important;
}

/* ── Vyber sposobu nakupu (prihlasenie / bez registracie) ── */
body.cart-second #login-cart-block,
body.cart-second #registration-cart-block {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 26px 28px !important;
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow-sm) !important;
}

/* dva vedla seba cez wrapper .content — grid na .content by rozbil
   ostatne stavy, preto pouzivame plavajuci grid len ked su oba bloky */
body.cart-second .content:has(#login-cart-block):has(#registration-cart-block) {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: start !important;
  gap: 20px !important;
  max-width: 940px !important;
}

body.cart-second .content:has(#login-cart-block) #cart-big-navigation {
  grid-column: 1 / -1 !important;
}

body.cart-second #login-cart-block .title,
body.cart-second #registration-cart-block .title {
  margin: 0 0 6px !important;
  font-family: var(--font-head) !important;
  font-size: 24px !important;
  font-weight: 600 !important;
  text-align: center !important;
  color: var(--charcoal) !important;
}

body.cart-second #registration-cart-block .order-type {
  margin: 0 0 18px !important;
  font-family: var(--font-body) !important;
  font-size: 13.5px !important;
  text-align: center !important;
  color: var(--mid) !important;
}

body.cart-second #login-cart-block .info {
  float: none !important;
  width: auto !important;
  margin: 16px 0 0 !important;
  padding: 14px 16px !important;
  background: var(--light-bg) !important;
  border-radius: var(--radius-sm) !important;
}

body.cart-second #login-cart-block .info p {
  margin: 0 !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  color: var(--mid) !important;
}

/* stara sprite ikonka zamku */
body.cart-second #login-cart-block .info span.info {
  display: none !important;
}

/* ── Formular dodacich udajov ── */
body.cart-second .no-reg-form {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  max-width: 760px !important;
  margin: 0 auto !important;
  padding: 28px 30px 24px !important;
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow-md) !important;
}

body.cart-second .no-reg-form .myform,
body.cart-second .no-reg-form fieldset,
body.cart-second .no-reg-form dl {
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

/* skryte popisky fieldsetov (dt) */
body.cart-second .no-reg-form dt {
  display: none !important;
}

/* riadky poli — mriezka namiesto floatov */
body.cart-second .no-reg-form fieldset > dl {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
}

body.cart-second .no-reg-form fieldset > dl > div {
  box-sizing: border-box !important;
  float: none !important;
  margin: 0 !important;
  min-width: 0 !important;
}

body.cart-second .no-reg-form .no-reg-info {
  flex: 1 1 100% !important;
  margin: 6px 0 2px !important;
}

body.cart-second .no-reg-form .row-full,
body.cart-second .no-reg-form .row {
  flex: 1 1 100% !important;
  width: auto !important;
}

body.cart-second .no-reg-form .row-medium-margin,
body.cart-second .no-reg-form .row-medium {
  flex: 1 1 calc(50% - 6px) !important;
  width: auto !important;
}

body.cart-second .no-reg-form .row-big {
  flex: 1 1 calc(62% - 6px) !important;
  width: auto !important;
}

body.cart-second .no-reg-form .row-small {
  flex: 1 1 calc(38% - 6px) !important;
  width: auto !important;
}

body.cart-second .no-reg-form .element {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
}

/* nadpisy sekcii */
body.cart-second .no-reg-form .no-reg-info > p#address1,
body.cart-second .no-reg-form .no-reg-info > p#address2,
body.cart-second .no-reg-form .no-reg-info > p:first-child {
  margin: 0 !important;
  padding: 0 0 10px !important;
  border-bottom: 1px solid var(--border) !important;
  font-family: var(--font-body) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: var(--charcoal) !important;
}

body.cart-second .no-reg-form .no-reg-info p.info {
  margin: 8px 0 0 !important;
  padding: 0 !important;
  border: none !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--mid) !important;
}

body.cart-second .no-reg-form .no-reg-info a.universal-link {
  color: var(--rose) !important;
  text-decoration: underline !important;
}

/* ── Polia ── */
body.cart-second .no-reg-form input[type="text"],
body.cart-second .no-reg-form input[type="email"],
body.cart-second .no-reg-form input[type="tel"],
body.cart-second .no-reg-form input[type="password"],
body.cart-second .no-reg-form select,
body.cart-second .no-reg-form textarea {
  box-sizing: border-box !important;
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  height: 48px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  background: var(--white) !important;
  font-family: var(--font-body) !important;
  font-size: 14.5px !important;
  color: var(--charcoal) !important;
  transition: var(--transition) !important;
}

body.cart-second .no-reg-form textarea {
  height: auto !important;
  min-height: 90px !important;
  padding: 12px 14px !important;
  resize: vertical !important;
}

body.cart-second .no-reg-form input:focus,
body.cart-second .no-reg-form select:focus,
body.cart-second .no-reg-form textarea:focus {
  outline: none !important;
  border-color: var(--rose) !important;
  box-shadow: 0 0 0 3px rgba(196,123,104,.12) !important;
}

body.cart-second .no-reg-form input::placeholder {
  color: #a8a8a8 !important;
  opacity: 1 !important;
}

/* povinne pole — jemny akcent na lavej hrane */
body.cart-second .no-reg-form input.required:placeholder-shown {
  border-left: 2px solid #e6d2cc !important;
}

/* ── Suhlasy ──
   label ma z base float:right a sirku 1185px, checkbox float:left
   → text sa lamal mimo policka. Riadok robime flexom. */
body.cart-second #fieldset-data > dl {
  flex-direction: column !important;
  gap: 10px !important;
  margin-top: 6px !important;
  padding-top: 16px !important;
  border-top: 1px solid var(--border) !important;
}

/* POZOR: .row-categories-for-newsletter zobrazuje/skryva JS podla
   zaskrtnutia suhlasu — nesmieme mu prepisat `display`, inak by bol
   vyber kategorii viditelny stale. */
body.cart-second #fieldset-data > dl > .row:not(.row-categories-for-newsletter) {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
}

body.cart-second #fieldset-data > dl > .row.row-categories-for-newsletter {
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 4px 0 0 29px !important;
}

body.cart-second #fieldset-data .row-categories-for-newsletter label {
  display: block !important;
  float: none !important;
  width: auto !important;
  margin: 0 0 6px !important;
  font-family: var(--font-body) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  text-align: left !important;
  color: var(--mid) !important;
}

body.cart-second #fieldset-data .row-categories-for-newsletter .element {
  float: none !important;
  width: auto !important;
  max-width: none !important;
}

body.cart-second #fieldset-data .row-categories-for-newsletter select {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
}

body.cart-second #fieldset-data > dl > .row > .element {
  order: 1 !important;
  flex: 0 0 auto !important;
  width: auto !important;
  height: auto !important;
  float: none !important;
}

body.cart-second #fieldset-data > dl > .row > label {
  order: 2 !important;
  flex: 1 1 auto !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 13.5px !important;
  line-height: 1.5 !important;
  color: var(--charcoal) !important;
  text-align: left !important;
  cursor: pointer !important;
}

body.cart-second #fieldset-data input[type="checkbox"] {
  width: 19px !important;
  height: 19px !important;
  margin: 1px 0 0 !important;
  float: none !important;
  accent-color: var(--rose) !important;
  cursor: pointer !important;
}

body.cart-second #fieldset-data .red-text {
  color: var(--rose-dark) !important;
}

/* vyber kategorii pre newsletter — zobrazuje ho JS, nesmieme
   prepisat `display` na samotnom riadku */
body.cart-second #fieldset-data .row-categories-for-newsletter select {
  height: 120px !important;
  padding: 6px !important;
}

/* ── Lista s tlacidlami ── */
body.cart-second #fieldset-second_step_buttons > dl {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  margin-top: 22px !important;
  padding-top: 20px !important;
  border-top: 1px solid var(--border) !important;
}

body.cart-second .button-back-to-first-step,
body.cart-second #fieldset-second_step_buttons .buttons {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
}

/* wrappery .button-type-1 maju z base vlastne pozadie a pevnu vysku */
body.cart-second #fieldset-second_step_buttons .button-type-1 {
  float: none !important;
  display: inline-block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cart-second #fieldset-second_step_buttons .button-type-back a.buttons-text {
  display: inline-block !important;
  padding: 13px 22px !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  background: var(--white) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--charcoal) !important;
  text-decoration: none !important;
  transition: var(--transition) !important;
}

body.cart-second #fieldset-second_step_buttons .button-type-back a.buttons-text:hover {
  border-color: var(--rose) !important;
  background: var(--rose-light) !important;
  color: var(--rose) !important;
}

body.cart-second #fieldset-second_step_buttons #next,
body.cart-second #fieldset-second_step_buttons input[type="submit"] {
  display: block !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 15px 34px !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
  background: var(--charcoal) !important;
  color: var(--white) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: .03em !important;
  line-height: 1.2 !important;
  cursor: pointer !important;
  box-shadow: 0 6px 20px rgba(26,26,26,.22) !important;
  transition: var(--transition) !important;
  -webkit-appearance: none !important;
          appearance: none !important;
}

body.cart-second #fieldset-second_step_buttons #next:hover,
body.cart-second #fieldset-second_step_buttons input[type="submit"]:hover {
  background: var(--rose) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 26px rgba(196,123,104,.36) !important;
}

/* ── Prihlasovaci formular v lavom bloku ── */
body.cart-second #login-cart-block input[type="text"],
body.cart-second #login-cart-block input[type="password"] {
  box-sizing: border-box !important;
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  height: 48px !important;
  margin: 0 0 12px !important;
  padding: 0 14px !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  background: var(--white) !important;
  font-family: var(--font-body) !important;
  font-size: 14.5px !important;
  transition: var(--transition) !important;
}

body.cart-second #login-cart-block input:focus {
  outline: none !important;
  border-color: var(--rose) !important;
  box-shadow: 0 0 0 3px rgba(196,123,104,.12) !important;
}

body.cart-second #login-cart-block dd,
body.cart-second #login-cart-block dt {
  margin: 0 !important;
  padding: 0 !important;
}

body.cart-second #login-cart-block dt {
  display: none !important;
}

body.cart-second #login-cart-block .button-type-1 {
  float: none !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  margin: 4px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

body.cart-second #login-cart-block input[type="submit"] {
  display: block !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 15px 24px !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
  background: var(--charcoal) !important;
  color: var(--white) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: var(--transition) !important;
  -webkit-appearance: none !important;
          appearance: none !important;
}

body.cart-second #login-cart-block input[type="submit"]:hover {
  background: var(--rose) !important;
}

/* ── Tlacidla vyberu typu nakupu ── */
body.cart-second #registration-cart-block form {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

body.cart-second #registration-cart-block .button-type-1 {
  flex: 1 1 calc(50% - 5px) !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

body.cart-second #registration-cart-block input[type="submit"] {
  display: block !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 16px 18px !important;
  border: 1px solid var(--charcoal) !important;
  border-radius: var(--radius-sm) !important;
  background: var(--white) !important;
  color: var(--charcoal) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: var(--transition) !important;
  -webkit-appearance: none !important;
          appearance: none !important;
}

body.cart-second #registration-cart-block input[type="submit"]:hover {
  background: var(--charcoal) !important;
  color: var(--white) !important;
  transform: translateY(-2px) !important;
}

@media screen and (max-width: 760px) {

  body.cart-second .content:has(#login-cart-block):has(#registration-cart-block) {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.cart-second .no-reg-form {
    padding: 22px 18px 20px !important;
  }

  body.cart-second .no-reg-form .row-medium-margin,
  body.cart-second .no-reg-form .row-medium,
  body.cart-second .no-reg-form .row-big,
  body.cart-second .no-reg-form .row-small {
    flex: 1 1 100% !important;
  }

  body.cart-second #fieldset-second_step_buttons > dl {
    flex-direction: column-reverse !important;
    align-items: stretch !important;
  }

  body.cart-second #fieldset-second_step_buttons .button-type-back a.buttons-text,
  body.cart-second #fieldset-second_step_buttons input[type="submit"] {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
  }
}

/* riadky prihlasovacieho formulara — v base su to floaty, preto
   boli obe polia vedla seba a siroke len 188px */
body.cart-second #login-cart-block #fieldset-users > dl {
  display: block !important;
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cart-second #login-cart-block #fieldset-users .row,
body.cart-second #login-cart-block #fieldset-users .element,
body.cart-second #login-cart-block #fieldset-users .buttons {
  display: block !important;
  float: none !important;
  width: auto !important;
  /* base ma `#fieldset-users .element { max-width: 188px }` — bez
     zrusenia by polia ostali uzke bez ohladu na width */
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.cart-second #login-cart-block #fieldset-users label {
  display: block !important;
  float: none !important;
  width: auto !important;
  margin: 0 0 6px !important;
  font-family: var(--font-body) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  text-align: left !important;
  color: var(--mid) !important;
}

/* ============================================================
   KOSIK — 3. KROK (body.cart-third) — rekapitulacia
   ------------------------------------------------------------
   Stav pred zmenou: vsetko pod sebou cez celu sirku, potvrdzovacie
   tlacidlo hore nad zoznamom (takze zakaznik odosielal skor, nez
   si obsah precital), info blok bez ohranicenia, tabulka bez kariet
   a "Informacie o objednavke" ako holy zoznam.
   Teraz: vlavo obsah objednavky a udaje, vpravo lepiva karta so
   sumou a potvrdenim.
   ============================================================ */

body.cart-third .content {
  max-width: 1200px !important;
  margin: 0 auto !important;
}

body.cart-third .cart-steps {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 340px !important;
  align-items: start !important;
  gap: 20px 26px !important;
  width: 100% !important;
  float: none !important;
}

body.cart-third #cart-big-navigation {
  grid-column: 1 / -1 !important;
  margin: 0 0 4px !important;
  padding: 0 0 20px !important;
  border-bottom: 1px solid var(--border) !important;
  float: none !important;
  text-align: center !important;
}

body.cart-third #info-block,
body.cart-third #cart-info-table,
body.cart-third .third-cart-order-info {
  grid-column: 1 !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
}

body.cart-third #third-cart-submit {
  grid-column: 2 !important;
  grid-row: 2 / span 20 !important;
}

body.cart-third .cart-steps > hr.space {
  display: none !important;
}

/* ── Uvodna informacia ── */
body.cart-third #info-block.bg-cart-block {
  box-sizing: border-box !important;
  padding: 14px 18px !important;
  background: var(--rose-light) !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
}

body.cart-third #info-block p {
  display: block !important;
  margin: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 13.5px !important;
  line-height: 1.6 !important;
  color: var(--charcoal) !important;
}

/* stara sprite ikonka "i" */
body.cart-third #info-block span.info {
  display: none !important;
}

/* ── Produkty v objednavke ── */
body.cart-third #cart-info-table {
  box-sizing: border-box !important;
  width: 100% !important;
  border-collapse: collapse !important;
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  overflow: hidden !important;
}

body.cart-third #cart-info-table tr.title td {
  padding: 14px 20px !important;
  background: var(--light-bg) !important;
  border-bottom: 1px solid var(--border) !important;
  font-family: var(--font-body) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: var(--charcoal) !important;
}

body.cart-third #cart-info-table tr.normal > td {
  padding: 14px 10px !important;
  border-bottom: 1px solid var(--border) !important;
  vertical-align: middle !important;
  background: transparent !important;
}

body.cart-third #cart-info-table tr.normal:last-child > td {
  border-bottom: none !important;
}

body.cart-third #cart-info-table td.third-step-img {
  width: 96px !important;
  padding-left: 20px !important;
}

body.cart-third #cart-info-table td.third-step-img img {
  display: block !important;
  width: 64px !important;
  height: auto !important;
  border-radius: var(--radius-sm) !important;
  background: var(--light-bg) !important;
}

body.cart-third #cart-info-table tr.normal > td:nth-child(2) p {
  margin: 0 !important;
}

body.cart-third #cart-info-table tr.normal > td:nth-child(2) p:empty {
  display: none !important;
}

body.cart-third #cart-info-table tr.normal > td:nth-child(2) a {
  font-family: var(--font-head) !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  color: var(--charcoal) !important;
  text-decoration: none !important;
  transition: color .18s !important;
}

body.cart-third #cart-info-table tr.normal > td:nth-child(2) a:hover {
  color: var(--rose) !important;
}

body.cart-third #cart-info-table td.third-step-product-count {
  width: 90px !important;
  font-family: var(--font-body) !important;
  font-size: 13.5px !important;
  color: var(--mid) !important;
  text-align: center !important;
  white-space: nowrap !important;
  font-variant-numeric: tabular-nums !important;
}

body.cart-third #cart-info-table td.price-all {
  width: 130px !important;
  padding-right: 20px !important;
  font-family: var(--font-body) !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  color: var(--charcoal) !important;
  text-align: right !important;
  white-space: nowrap !important;
  font-variant-numeric: tabular-nums !important;
}

/* ── Informacie o objednavke ── */
body.cart-third .third-cart-order-info {
  box-sizing: border-box !important;
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  overflow: hidden !important;
}

body.cart-third .third-cart-order-info #del-title {
  margin: 0 !important;
  padding: 14px 20px !important;
  background: var(--light-bg) !important;
  border: none !important;
  border-bottom: 1px solid var(--border) !important;
  border-radius: 0 !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
}

body.cart-third .third-cart-order-info #del-title p {
  margin: 0 !important;
}

body.cart-third .third-cart-order-info #del-title span.delivery {
  font-family: var(--font-body) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: var(--charcoal) !important;
}

body.cart-third .third-step-info-catr {
  padding: 6px 20px 14px !important;
  float: none !important;
  width: auto !important;
}

body.cart-third .third-step-info-catr > p {
  display: grid !important;
  grid-template-columns: 200px minmax(0, 1fr) !important;
  align-items: baseline !important;
  gap: 6px 16px !important;
  margin: 0 !important;
  padding: 10px 0 !important;
  border-bottom: 1px solid var(--border) !important;
  float: none !important;
  width: auto !important;
}

body.cart-third .third-step-info-catr > p:last-child {
  border-bottom: none !important;
}

body.cart-third .third-step-info-catr .title {
  float: none !important;
  width: auto !important;
  font-family: var(--font-body) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  color: var(--mid) !important;
}

body.cart-third .third-step-info-catr .prepend-2 {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
  color: var(--charcoal) !important;
}

/* ── Lepiva karta s potvrdenim ── */
body.cart-third #third-cart-submit {
  position: sticky !important;
  top: 96px !important;
  align-self: start !important;
  box-sizing: border-box !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 20px 20px 18px !important;
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow-md) !important;
}

body.cart-third .third-submit-title {
  margin: 0 0 14px !important;
  padding: 0 0 12px !important;
  border-bottom: 1px solid var(--border) !important;
  font-family: var(--font-body) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: var(--charcoal) !important;
}

body.cart-third .third-submit-sum {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin: 0 0 16px !important;
}

body.cart-third .third-submit-sum-label {
  font-family: var(--font-body) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: var(--charcoal) !important;
}

body.cart-third .third-submit-sum-value {
  font-family: var(--font-body) !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  color: var(--charcoal) !important;
  white-space: nowrap !important;
  font-variant-numeric: tabular-nums !important;
}

/* wrapper .button-type-1 ma z base vlastne pozadie a pevnu vysku */
body.cart-third #button-corfimation-button {
  display: block !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.cart-third #corfimation-button {
  display: block !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 16px 18px !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
  background: var(--charcoal) !important;
  color: var(--white) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: .02em !important;
  line-height: 1.3 !important;
  white-space: normal !important;   /* text sa musi vediet zalomit */
  cursor: pointer !important;
  box-shadow: 0 6px 20px rgba(26,26,26,.22) !important;
  transition: var(--transition) !important;
  -webkit-appearance: none !important;
          appearance: none !important;
}

body.cart-third #corfimation-button:hover {
  background: var(--rose) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 26px rgba(196,123,104,.36) !important;
}

/* spat a upravit udaje — pod tlacidlom, decentne */
body.cart-third #third-cart-submit .button-type-back {
  display: block !important;
  float: none !important;
  order: 9 !important;
  width: 100% !important;
  height: auto !important;
  margin: 12px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

body.cart-third #third-cart-submit .button-type-back a.buttons-text {
  display: block !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  padding: 12px 16px !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  background: var(--white) !important;
  font-family: var(--font-body) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: var(--charcoal) !important;
  text-align: center !important;
  text-decoration: none !important;
  transition: var(--transition) !important;
}

body.cart-third #third-cart-submit .button-type-back a.buttons-text:hover {
  border-color: var(--rose) !important;
  background: var(--rose-light) !important;
  color: var(--rose) !important;
}

/* poradie v karte: nadpis, suma, CTA, spatny odkaz */
body.cart-third #third-cart-submit {
  display: flex !important;
  flex-direction: column !important;
}

body.cart-third .third-submit-title { order: 1 !important; }
body.cart-third .third-submit-sum { order: 2 !important; }
body.cart-third #third-cart-heureka-check-customer { order: 3 !important; }
body.cart-third #button-corfimation-button { order: 4 !important; }
body.cart-third #third-cart-submit .button-type-back { order: 5 !important; }

/* blikajuca sipka pri tlacidle uz nema v karte zmysel */
body.cart-third #cart-third-blinking-arrow {
  display: none !important;
}

body.cart-third #third-cart-heureka-check-customer {
  margin: 0 0 12px !important;
  font-family: var(--font-body) !important;
  font-size: 12.5px !important;
  line-height: 1.5 !important;
  color: var(--mid) !important;
}

@media screen and (max-width: 900px) {

  body.cart-third .cart-steps {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.cart-third #third-cart-submit {
    position: static !important;
    grid-column: 1 !important;
    grid-row: auto !important;
    order: 99 !important;
  }

  body.cart-third .third-step-info-catr > p {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 2px !important;
  }
}

/* ============================================================
   KOSIK — PODAKOVANIE (body.cart-success)
   ------------------------------------------------------------
   Stav pred zmenou: obsah na plnu sirku 1200px, stara lesklá
   zelena PNG fajka vlavo, nikde cislo objednavky, obrazok
   produktu 200x284 nad textom a modre FB tlacidlo s oranzovym
   textom (necitatelne).
   Teraz: sustredena karta s vektorovou fajkou, cislom objednavky
   a decentnym zdielanim.
   ============================================================ */

body.cart-success .content {
  max-width: 1200px !important;
  margin: 0 auto !important;
}

body.cart-success #cart-success.bg-cart-block {
  box-sizing: border-box !important;
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: 720px !important;
  margin: 20px auto 46px !important;
  padding: 40px 40px 34px !important;
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow-md) !important;
  text-align: center !important;
}

/* ── Ikona ── */
body.cart-success #cart-success .icon-success {
  float: none !important;
  /* base ma position:relative s posunom `top` — ikona sa opticky
     presunula nadol a prekryvala nadpis */
  position: static !important;
  top: auto !important;
  left: auto !important;
  width: 76px !important;
  height: 76px !important;
  margin: 0 auto 20px !important;
  border-radius: 50% !important;
  background-color: #eaf5ec !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232e7d4f' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m20 6-11 11-5-5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 34px 34px !important;
}

body.cart-success #cart-success-text {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
}

body.cart-success #cart-success-text hr.space {
  display: none !important;
}

/* ── Nadpis a texty ── */
body.cart-success #cart-success-text .title {
  margin: 0 0 10px !important;
  font-family: var(--font-head) !important;
  font-size: 32px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  color: var(--charcoal) !important;
}

body.cart-success #cart-success-text .text {
  margin: 0 auto 12px !important;
  max-width: 520px !important;
  font-family: var(--font-body) !important;
  font-size: 14.5px !important;
  line-height: 1.65 !important;
  color: var(--mid) !important;
}

body.cart-success #cart-success-text .text:last-of-type {
  margin-bottom: 0 !important;
}

/* ── Cislo objednavky ── */
body.cart-success .cart-success-order-number {
  display: inline-flex !important;
  align-items: baseline !important;
  gap: 10px !important;
  margin: 0 0 20px !important;
  padding: 10px 20px !important;
  background: var(--rose-light) !important;
  border-radius: 100px !important;
}

body.cart-success .cart-success-order-label {
  font-family: var(--font-body) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: var(--rose-dark) !important;
}

body.cart-success .cart-success-order-value {
  font-family: var(--font-body) !important;
  font-size: 19px !important;
  font-weight: 700 !important;
  color: var(--charcoal) !important;
  font-variant-numeric: tabular-nums !important;
}

body.cart-success .cart-success-order-value::before {
  content: '#';
  opacity: .45;
  margin-right: 1px;
}

/* ── Zdielanie na Facebooku ── */
body.cart-success #cart-fb-share-container {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px 16px !important;
  float: none !important;
  width: auto !important;
  margin: 26px 0 0 !important;
  padding: 22px 0 0 !important;
  border-top: 1px solid var(--border) !important;
}

body.cart-success #cart-fb-share-container img {
  flex: 0 0 auto !important;
  width: 72px !important;
  height: 72px !important;
  object-fit: contain !important;
  padding: 6px !important;
  background: var(--light-bg) !important;
  border-radius: var(--radius-sm) !important;
}

body.cart-success #cart-fb-share-container .text {
  flex: 1 1 200px !important;
  margin: 0 !important;
  font-size: 13.5px !important;
  text-align: left !important;
}

body.cart-success #cart-fb-share-container a {
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 12px 20px 12px 42px !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
  background-color: #1877F2 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M13.5 21v-8h2.7l.4-3h-3.1V8.1c0-.87.24-1.46 1.5-1.46h1.6V3.96c-.28-.04-1.24-.13-2.36-.13-2.34 0-3.94 1.43-3.94 4.05V10H7.67v3h2.63v8h3.2z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 18px center !important;
  background-size: 16px 16px !important;
  color: var(--white) !important;   /* bol oranzovy text na modrom */
  font-family: var(--font-body) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  letter-spacing: .04em !important;
  text-decoration: none !important;
  text-transform: none !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: var(--transition) !important;
}

body.cart-success #cart-fb-share-container a:hover {
  background-color: #145dbf !important;
  transform: translateY(-2px) !important;
}

body.cart-success #cart-fb-share-container hr.space {
  display: none !important;
}

/* ── Navrat na uvod ── */
body.cart-success #cart-success-text .button-type-back {
  display: block !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 26px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

body.cart-success #cart-success-text .button-type-back a.buttons-text {
  display: inline-block !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  padding: 15px 32px !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
  background: var(--charcoal) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--white) !important;
  text-decoration: none !important;
  transition: var(--transition) !important;
}

body.cart-success #cart-success-text .button-type-back a.buttons-text:hover {
  background: var(--rose) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 26px rgba(196,123,104,.36) !important;
}

@media screen and (max-width: 600px) {

  body.cart-success #cart-success.bg-cart-block {
    padding: 30px 20px 26px !important;
  }

  body.cart-success #cart-success-text .title {
    font-size: 25px !important;
  }

  body.cart-success #cart-fb-share-container {
    justify-content: center !important;
  }

  body.cart-success #cart-fb-share-container .text {
    text-align: center !important;
    flex: 1 1 100% !important;
  }
}

/* ============================================================
   REGISTRACIA NOVEHO POUZIVATELA (body.users-registration)
   ------------------------------------------------------------
   Stav pred zmenou: formular cez celych 960px (pole "e-mail"
   malo 960px), sekcie bez ohranicenia, suhlasy s rozhodenym
   textom (label ma float:right a sirku 945px), tlacidlo
   "Zaregistrovat" schovane medzi suhlasmi.
   Struktura je takmer zhodna s 2. krokom kosika:
   .row-full / .row-medium-margin / .row-medium / .row-big /
   .row-small su floaty vnutri <dl>.
   ============================================================ */

body.users-registration .content {
  max-width: 1200px !important;
  margin: 0 auto !important;
}

body.users-registration h1.new-reg-info {
  margin: 12px 0 6px !important;
  font-family: var(--font-head) !important;
  font-size: 34px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  color: var(--charcoal) !important;
}

/* ── Uvodna informacia ── */
body.users-registration #info-block {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  max-width: 760px !important;
  margin: 0 auto 20px !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
}

body.users-registration #info-block p {
  display: block !important;
  margin: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 14.5px !important;
  line-height: 1.65 !important;
  text-align: center !important;
  color: var(--mid) !important;
}

/* stara sprite ikonka "i" */
body.users-registration #info-block span.info {
  display: none !important;
}

/* ── Karta formulara ── */
body.users-registration #show-registration-form {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 760px !important;
  margin: 0 auto 40px !important;
  padding: 28px 30px 24px !important;
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow-md) !important;
}

body.users-registration #show-registration-form .myform,
body.users-registration #show-registration-form fieldset,
body.users-registration #show-registration-form dl,
body.users-registration #show-registration-form dd {
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

/* prazdne dt oddelovace */
body.users-registration #show-registration-form dt {
  display: none !important;
}

/* medzera medzi sekciami */
body.users-registration #show-registration-form #person_address-element,
body.users-registration #show-registration-form #deliver_address-element,
body.users-registration #show-registration-form #data-element {
  margin-top: 18px !important;
}

/* riadky poli — mriezka namiesto floatov */
body.users-registration #show-registration-form fieldset > dl {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
}

body.users-registration #show-registration-form fieldset > dl > div {
  box-sizing: border-box !important;
  float: none !important;
  margin: 0 !important;
  min-width: 0 !important;
}

body.users-registration #show-registration-form .no-reg-info {
  flex: 1 1 100% !important;
  margin: 6px 0 2px !important;
}

body.users-registration #show-registration-form .row-full,
body.users-registration #show-registration-form .row {
  flex: 1 1 100% !important;
  width: auto !important;
}

body.users-registration #show-registration-form .row-medium-margin,
body.users-registration #show-registration-form .row-medium {
  flex: 1 1 calc(50% - 6px) !important;
  width: auto !important;
}

body.users-registration #show-registration-form .row-big {
  flex: 1 1 calc(62% - 6px) !important;
  width: auto !important;
}

body.users-registration #show-registration-form .row-small {
  flex: 1 1 calc(38% - 6px) !important;
  width: auto !important;
}

body.users-registration #show-registration-form .element {
  float: none !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
}

/* nadpisy sekcii */
body.users-registration #show-registration-form .no-reg-info > p:first-child {
  margin: 0 !important;
  padding: 0 0 10px !important;
  border-bottom: 1px solid var(--border) !important;
  font-family: var(--font-body) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: var(--charcoal) !important;
}

body.users-registration #show-registration-form .no-reg-info p.info {
  margin: 8px 0 0 !important;
  padding: 0 !important;
  border: none !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--mid) !important;
}

body.users-registration #show-registration-form a.universal-link {
  color: var(--rose) !important;
  text-decoration: underline !important;
}

/* ── Polia ── */
body.users-registration #show-registration-form input[type="text"],
body.users-registration #show-registration-form input[type="email"],
body.users-registration #show-registration-form input[type="tel"],
body.users-registration #show-registration-form input[type="password"],
body.users-registration #show-registration-form select,
body.users-registration #show-registration-form textarea {
  box-sizing: border-box !important;
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  height: 48px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  background: var(--white) !important;
  font-family: var(--font-body) !important;
  font-size: 14.5px !important;
  color: var(--charcoal) !important;
  transition: var(--transition) !important;
}

body.users-registration #show-registration-form input:focus,
body.users-registration #show-registration-form select:focus,
body.users-registration #show-registration-form textarea:focus {
  outline: none !important;
  border-color: var(--rose) !important;
  box-shadow: 0 0 0 3px rgba(196,123,104,.12) !important;
}

body.users-registration #show-registration-form input::placeholder {
  color: #a8a8a8 !important;
  opacity: 1 !important;
}

body.users-registration #show-registration-form input.required:placeholder-shown {
  border-left: 2px solid #e6d2cc !important;
}

/* ── Suhlasy + tlacidlo ──
   label ma z base float:right a sirku 945px, checkbox float:left */
body.users-registration #fieldset-data > dl {
  flex-direction: column !important;
  gap: 10px !important;
  margin-top: 6px !important;
  padding-top: 16px !important;
  border-top: 1px solid var(--border) !important;
}

/* .row-categories-for-newsletter zobrazuje/skryva JS — nesmieme
   mu prepisat `display` */
body.users-registration #fieldset-data > dl > .row:not(.row-categories-for-newsletter) {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
}

body.users-registration #fieldset-data > dl > .row > .element {
  order: 1 !important;
  flex: 0 0 auto !important;
  width: auto !important;
  height: auto !important;
  float: none !important;
}

body.users-registration #fieldset-data > dl > .row > label {
  order: 2 !important;
  flex: 1 1 auto !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 13.5px !important;
  line-height: 1.5 !important;
  color: var(--charcoal) !important;
  text-align: left !important;
  cursor: pointer !important;
}

body.users-registration #fieldset-data input[type="checkbox"] {
  width: 19px !important;
  height: 19px !important;
  margin: 1px 0 0 !important;
  float: none !important;
  accent-color: var(--rose) !important;
  cursor: pointer !important;
}

body.users-registration #fieldset-data .red-text {
  color: var(--rose-dark) !important;
}

body.users-registration #fieldset-data .row-categories-for-newsletter {
  margin: 4px 0 0 29px !important;
}

body.users-registration #fieldset-data .row-categories-for-newsletter label {
  display: block !important;
  float: none !important;
  width: auto !important;
  margin: 0 0 6px !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  text-align: left !important;
  color: var(--mid) !important;
}

body.users-registration #fieldset-data .row-categories-for-newsletter select {
  height: 120px !important;
  padding: 6px !important;
}

/* odosielacie tlacidlo — wrapper .button-type-1 ma z base pozadie */
body.users-registration #fieldset-data .buttons,
body.users-registration #button-login {
  display: block !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.users-registration #fieldset-data .buttons {
  margin-top: 18px !important;
  padding-top: 18px !important;
  border-top: 1px solid var(--border) !important;
}

body.users-registration #show-registration-form input#login[type="submit"] {
  display: block !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 16px 24px !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
  background: var(--charcoal) !important;
  color: var(--white) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: .03em !important;
  cursor: pointer !important;
  box-shadow: 0 6px 20px rgba(26,26,26,.22) !important;
  transition: var(--transition) !important;
  -webkit-appearance: none !important;
          appearance: none !important;
}

body.users-registration #show-registration-form input#login[type="submit"]:hover {
  background: var(--rose) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 26px rgba(196,123,104,.36) !important;
}

@media screen and (max-width: 760px) {

  body.users-registration h1.new-reg-info {
    font-size: 26px !important;
  }

  body.users-registration #show-registration-form {
    padding: 22px 18px 20px !important;
  }

  body.users-registration #show-registration-form .row-medium-margin,
  body.users-registration #show-registration-form .row-medium,
  body.users-registration #show-registration-form .row-big,
  body.users-registration #show-registration-form .row-small {
    flex: 1 1 100% !important;
  }
}

/* ============================================================
   PRIHLASENIE (body.users-login)
   ------------------------------------------------------------
   Stav pred zmenou: polia mali natvrdo `#fieldset-users .element
   { max-width: 188px }`, takze e-mail aj heslo boli uzke a stali
   vedla tlacidla v jednom rade cez celu sirku 960px; nad nimi
   sivy sprite "i" a marketingovy text vacsi ako samotny formular;
   napovedy dole boli bez odsadenia.
   Teraz: sustredena karta 440px s polami pod sebou.
   ============================================================ */

body.users-login .content {
  max-width: 1200px !important;
  margin: 0 auto !important;
}

body.users-login h1.new-reg-info {
  margin: 12px 0 18px !important;
  font-family: var(--font-head) !important;
  font-size: 34px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  color: var(--charcoal) !important;
}

/* ── Karta ── */
body.users-login .new-reg {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  max-width: 440px !important;
  margin: 0 auto 40px !important;
  padding: 28px 30px 24px !important;
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow-md) !important;
}

/* ── Formular ── */
body.users-login #registration-form,
body.users-login #registration-form form,
body.users-login #registration-form .myform,
body.users-login #fieldset-users,
body.users-login #fieldset-users > dl,
body.users-login #users-element {
  box-sizing: border-box !important;
  float: none !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

body.users-login #users-label {
  display: none !important;
}

/* riadky pod seba — base ma display:inline-block */
body.users-login #fieldset-users .row,
body.users-login #fieldset-users .element,
body.users-login #fieldset-users .buttons,
body.users-login #button-login {
  display: block !important;
  float: none !important;
  width: auto !important;
  /* base: `#fieldset-users .element { max-width: 188px }` */
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

body.users-login #fieldset-users .row {
  margin-bottom: 14px !important;
}

/* popisky su v base zmensene na 1x1px — vratime ich */
body.users-login #fieldset-users label.left {
  display: block !important;
  float: none !important;
  /* base ich schovava cez `position:absolute; clip: rect(0,0,0,0)`
     (screen-reader only) — pri jednostlpcovom rozlozeni ich chceme
     vidiet, preto vraciame do toku a rusime orez */
  position: static !important;
  clip: auto !important;
  clip-path: none !important;
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
  margin: 0 0 6px !important;
  padding: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  text-align: left !important;
  color: var(--mid) !important;
  text-indent: 0 !important;
}

body.users-login #fieldset-users input[type="text"],
body.users-login #fieldset-users input[type="email"],
body.users-login #fieldset-users input[type="password"] {
  box-sizing: border-box !important;
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  height: 48px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  background: var(--white) !important;
  font-family: var(--font-body) !important;
  font-size: 14.5px !important;
  color: var(--charcoal) !important;
  transition: var(--transition) !important;
}

body.users-login #fieldset-users input:focus {
  outline: none !important;
  border-color: var(--rose) !important;
  box-shadow: 0 0 0 3px rgba(196,123,104,.12) !important;
}

body.users-login #fieldset-users .buttons {
  margin-top: 4px !important;
}

body.users-login #login[type="submit"] {
  display: block !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 16px 24px !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
  background: var(--charcoal) !important;
  color: var(--white) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: .03em !important;
  cursor: pointer !important;
  box-shadow: 0 6px 20px rgba(26,26,26,.22) !important;
  transition: var(--transition) !important;
  -webkit-appearance: none !important;
          appearance: none !important;
}

body.users-login #login[type="submit"]:hover {
  background: var(--rose) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 26px rgba(196,123,104,.36) !important;
}

/* ── Napovedy pod formularom ── */
body.users-login #registration-form hr.space {
  display: block !important;
  height: 1px !important;
  margin: 20px 0 16px !important;
  border: none !important;
  border-top: 1px solid var(--border) !important;
  background: transparent !important;
}

body.users-login p.login-tip {
  margin: 0 0 8px !important;
  font-family: var(--font-body) !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
  color: var(--mid) !important;
}

body.users-login p.login-tip:last-child {
  margin-bottom: 0 !important;
}

body.users-login p.login-tip span {
  font-weight: 700 !important;
  color: var(--charcoal) !important;
}

body.users-login p.login-tip a {
  color: var(--rose) !important;
  text-decoration: underline !important;
}

body.users-login p.login-tip a:hover {
  color: var(--rose-dark) !important;
}

/* ── Vyhody registracie — pod kartu, decentne ── */
body.users-login #info-block {
  box-sizing: border-box !important;
  float: none !important;
  width: auto !important;
  margin: 0 0 22px !important;
  padding: 14px 16px !important;
  background: var(--light-bg) !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
}

body.users-login #info-block p {
  display: block !important;
  margin: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
  text-align: left !important;
  color: var(--mid) !important;
}

body.users-login #info-block b {
  display: inline !important;
  font-weight: 600 !important;
  color: var(--charcoal) !important;
}

/* sprite ikonka "i" */
body.users-login #info-block span.info {
  display: none !important;
}

@media screen and (max-width: 520px) {

  body.users-login h1.new-reg-info {
    font-size: 26px !important;
  }

  body.users-login .new-reg {
    padding: 22px 18px 20px !important;
  }
}

/* ============================================================
   HLAVICKA — prihlaseny pouzivatel ("Môj profil")
   ------------------------------------------------------------
   Text "Môj profil" v sablone JE (span#user-name-button), ale base
   CSS ho skryva pravidlom `#user_menu .button-type-1 { display:none }`
   — povodna tema bola len ikonkova. Zobrazujeme ho a skladame
   ikonu + text do jedneho riadku.
   ============================================================ */

#head-login ul#user_menu {
  width: auto !important;
  margin: 0 !important;
  float: none !important;
  list-style: none !important;
}

#head-login ul#user_menu li.title {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  float: none !important;
  margin: 0 !important;
  cursor: pointer !important;
}

/* ikonka pouzivatela (material-icons "account_circle") — na ziadost
   skryta, v hlavicke ostava len text "Môj profil" */
#head-login ul#user_menu li.title > span.material-icons {
  display: none !important;
}

/* obal s textom — base ho ma display:none */
#head-login ul#user_menu li.title > .button-type-1 {
  display: block !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

/* stara sprite ikonka vnutri tlacidla — uz mame material-icons */
#head-login ul#user_menu li.title .icon-type-user {
  display: none !important;
}

#head-login ul#user_menu #user-name-button {
  display: block !important;
  float: none !important;
  width: auto !important;
  max-width: none !important;
  padding: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  letter-spacing: .01em !important;
  white-space: nowrap !important;
  color: var(--mid) !important;
  text-align: left !important;
  transition: color .2s !important;
}

#head-login ul#user_menu li.title:hover #user-name-button {
  color: var(--rose) !important;
}

/* Rozbalovacie menu.
   POZOR: JS neprepina samotny <ul>, ale jednotlive <li class="menu">
   (inline `display: list-item` / `display: none`). Zatvorene menu je
   teda prazdny <ul>, ktory by s bielym pozadim svietil ako pasik pod
   hlavickou — chrome (pozadie, ramcek, tien, padding) preto zapiname
   az ked je aspon jedna polozka rozbalena. */
#head-login ul#user_menu ul.profile-menu-window {
  right: 0 !important;
  left: auto !important;
  width: 262px !important;
  margin-top: 34px !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
  box-shadow: none !important;
}

#head-login ul#user_menu ul.profile-menu-window:has(li.menu[style*="list-item"]) {
  padding: 8px !important;
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  box-shadow: var(--shadow-md) !important;
}

#head-login ul#user_menu ul.profile-menu-window li.menu {
  margin: 0 !important;
  line-height: 1.3 !important;
}

#head-login ul#user_menu ul.profile-menu-window li.menu a {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 9px 12px !important;
  border-radius: var(--radius-sm) !important;
  font-family: var(--font-body) !important;
  font-size: 13px !important;
  color: var(--charcoal) !important;
  text-decoration: none !important;
  transition: var(--transition) !important;
}

/* ikony poloziek — priradujeme podla cielovej adresy odkazu,
   aby sme nemuseli zasahovat do sablony user-menu.phtml */
#head-login ul#user_menu ul.profile-menu-window li.menu a::before {
  content: '';
  flex: 0 0 auto;
  width: 17px;
  height: 17px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  opacity: .75;
  transition: opacity .18s;
}

#head-login ul#user_menu ul.profile-menu-window li.menu a:hover::before {
  opacity: 1;
}

/* Zmenit prihlasovacie udaje — zamok */
#head-login ul#user_menu .profile-menu-window li.menu a[href*="update-login"]::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a1a1a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='10' width='16' height='11' rx='2'/%3E%3Cpath d='M8 10V7a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E");
}

/* Zmenit moj profil — pouzivatel */
#head-login ul#user_menu .profile-menu-window li.menu a[href*="public_index/update/"]::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a1a1a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21v-1a6 6 0 0 1 6-6h4a6 6 0 0 1 6 6v1'/%3E%3C/svg%3E");
}

/* Moje oblubene — srdce */
#head-login ul#user_menu .profile-menu-window li.menu a[href*="show-favorites"]::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a1a1a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.4 5.6a5 5 0 0 0-7.1 0L12 6.9l-1.3-1.3a5 5 0 1 0-7.1 7.1L12 21l8.4-8.3a5 5 0 0 0 0-7.1z'/%3E%3C/svg%3E");
}

/* Moje zlavy — cenovka s percentom */
#head-login ul#user_menu .profile-menu-window li.menu a[href$="orders/public_index/"]::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a1a1a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.6 13.4 12 22l-9-9V3h10l7.6 7.6a2 2 0 0 1 0 2.8z'/%3E%3Ccircle cx='7.5' cy='7.5' r='1.2'/%3E%3C/svg%3E");
}

/* Moje objednavky — krabica.
   POZOR: musi to byt presna koncovka `$=`, nie `*=` — zlavy vedu na
   /orders/public_index/ (rovnaky modul) a chytila by ich tiez. */
#head-login ul#user_menu .profile-menu-window li.menu a[href$="/orders"]::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a1a1a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21 16-9 5-9-5V8l9-5 9 5z'/%3E%3Cpath d='m3.3 7.3 8.7 4.9 8.7-4.9M12 21v-8.8'/%3E%3C/svg%3E");
}

/* Odhlasit — sipka von */
#head-login ul#user_menu .profile-menu-window li.menu a[href*="logout"]::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c47b68' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpath d='m16 17 5-5-5-5M21 12H9'/%3E%3C/svg%3E");
  opacity: 1;
}

/* odhlasenie oddelime a odlisime farbou */
#head-login ul#user_menu .profile-menu-window li.menu:has(a[href*="logout"]) {
  margin-top: 4px !important;
  padding-top: 4px !important;
  border-top: 1px solid var(--border) !important;
}

#head-login ul#user_menu .profile-menu-window li.menu a[href*="logout"] {
  color: var(--rose-dark) !important;
}

#head-login ul#user_menu ul.profile-menu-window li.menu a:hover {
  background: var(--rose-light) !important;
  color: var(--rose-dark) !important;
  text-decoration: none !important;
}

@media screen and (max-width: 900px) {

  /* na uzkych displejoch necháme len ikonu */
  #head-login ul#user_menu #user-name-button {
    display: none !important;
  }
}

/* ============================================================
   ZMENA PRIHLASOVACICH UDAJOV (body.users-update-login)
   ------------------------------------------------------------
   Stav pred zmenou: styri polia vedla seba v jednom rade (base ma
   `#fieldset-updateLogin .element { max-width: 188px }` a
   `.row { display: inline-block }`), popisky su iba placeholdery,
   takze po vyplneni uz pouzivatel nevie, ktore pole je ktore.
   Nad formularom sivy sprite "i".
   Teraz: karta 460px, polia pod sebou s trvalymi popiskami.
   ============================================================ */

body.users-update-login .content {
  display: block !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
}

body.users-update-login .new-reg-info {
  width: auto !important;
  margin: 12px 0 8px !important;
  font-family: var(--font-head) !important;
  font-size: 32px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  color: var(--charcoal) !important;
}

/* ── Uvodna informacia ── */
body.users-update-login #info-block {
  box-sizing: border-box !important;
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: 460px !important;
  margin: 0 auto 18px !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
}

body.users-update-login #info-block p {
  display: block !important;
  margin: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  text-align: center !important;
  color: var(--mid) !important;
}

body.users-update-login #info-block span.info {
  display: none !important;
}

/* ── Karta s formularom ── */
body.users-update-login #dd,
body.users-update-login #update-login-form {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  max-width: 460px !important;
  margin: 0 auto 40px !important;
}

body.users-update-login #update-login-form {
  padding: 26px 28px 24px !important;
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow-md) !important;
}

body.users-update-login #update-login-form .myform,
body.users-update-login #update-login-form fieldset,
body.users-update-login #update-login-form dl,
body.users-update-login #update-login-form dd {
  width: auto !important;
  max-width: none !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

body.users-update-login #updateLogin-label {
  display: none !important;
}

/* riadky pod seba — base ma display:inline-block a max-width 188px */
body.users-update-login #fieldset-updateLogin .row,
body.users-update-login #fieldset-updateLogin .element,
body.users-update-login #fieldset-updateLogin .buttons,
body.users-update-login #button-savedatauser {
  display: block !important;
  float: none !important;
  width: auto !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

body.users-update-login #fieldset-updateLogin .row {
  margin-bottom: 14px !important;
  text-align: left !important;   /* base centruje obsah formulara */
}

/* polia maju popis len v placeholderi — doplname trvaly popisok,
   aby bolo po vyplneni jasne, ktore pole je ktore */
body.users-update-login #fieldset-updateLogin .row::before {
  display: block;
  margin: 0 0 6px;
  text-align: left;
  font-family: var(--font-body);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--mid);
}

body.users-update-login #fieldset-updateLogin .row:has(#user_email)::before { content: 'E-mail'; }
body.users-update-login #fieldset-updateLogin .row:has(#old_password)::before { content: 'Staré heslo'; }
body.users-update-login #fieldset-updateLogin .row:has(#password)::before { content: 'Nové heslo'; }
body.users-update-login #fieldset-updateLogin .row:has(#user_password_again)::before { content: 'Nové heslo znova'; }

body.users-update-login #fieldset-updateLogin input[type="text"],
body.users-update-login #fieldset-updateLogin input[type="email"],
body.users-update-login #fieldset-updateLogin input[type="password"] {
  box-sizing: border-box !important;
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  height: 48px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  background: var(--white) !important;
  font-family: var(--font-body) !important;
  font-size: 14.5px !important;
  color: var(--charcoal) !important;
  transition: var(--transition) !important;
}

body.users-update-login #fieldset-updateLogin input:focus {
  outline: none !important;
  border-color: var(--rose) !important;
  box-shadow: 0 0 0 3px rgba(196,123,104,.12) !important;
}

body.users-update-login #fieldset-updateLogin input::placeholder {
  color: #a8a8a8 !important;
  opacity: 1 !important;
}

/* ── Tlacidlo ── */
body.users-update-login #fieldset-updateLogin .buttons {
  margin-top: 18px !important;
  padding-top: 18px !important;
  border-top: 1px solid var(--border) !important;
}

body.users-update-login #savedatauser {
  display: block !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 16px 24px !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
  background: var(--charcoal) !important;
  color: var(--white) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: .03em !important;
  cursor: pointer !important;
  box-shadow: 0 6px 20px rgba(26,26,26,.22) !important;
  transition: var(--transition) !important;
  -webkit-appearance: none !important;
          appearance: none !important;
}

body.users-update-login #savedatauser:hover {
  background: var(--rose) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 26px rgba(196,123,104,.36) !important;
}

@media screen and (max-width: 520px) {

  body.users-update-login .new-reg-info {
    font-size: 25px !important;
  }

  body.users-update-login #update-login-form {
    padding: 22px 18px 20px !important;
  }
}

/* ============================================================
   ZMENA FAKTURACNYCH UDAJOV (body.users-update)
   ------------------------------------------------------------
   Rovnaka struktura ako registracia (.row-medium / .row-big /
   .row-small ako floaty v <dl>), len sirsi kontajner 1120px —
   pole "meno" malo 549px. Sekcia s fakturacnymi udajmi navyse
   nema ziadny nadpis (na rozdiel od dodacej adresy), takze
   formular zacinal rovno polami.
   ============================================================ */

body.users-update .content {
  display: block !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
}

body.users-update .new-reg-info {
  width: auto !important;
  margin: 12px 0 8px !important;
  font-family: var(--font-head) !important;
  font-size: 32px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  color: var(--charcoal) !important;
}

/* ── Uvodna informacia ── */
body.users-update #info-block {
  box-sizing: border-box !important;
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: 760px !important;
  margin: 0 auto 20px !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
}

body.users-update #info-block p {
  display: block !important;
  margin: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  text-align: center !important;
  color: var(--mid) !important;
}

body.users-update #info-block b {
  display: block !important;
  margin-top: 4px !important;
  font-weight: 600 !important;
  color: var(--charcoal) !important;
}

body.users-update #info-block span.info {
  display: none !important;
}

/* ── Karta formulara ── */
body.users-update #update-profile-form {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  max-width: 760px !important;
  margin: 0 auto 40px !important;
  padding: 28px 30px 24px !important;
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow-md) !important;
}

body.users-update #update-profile-form form,
body.users-update #update-profile-form .myform,
body.users-update #update-profile-form fieldset,
body.users-update #update-profile-form dl,
body.users-update #update-profile-form dd {
  width: auto !important;
  max-width: none !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

body.users-update #update-profile-form dt {
  display: none !important;
}

/* nadpis prvej sekcie — v sablone chyba */
body.users-update #fieldset-company_address::before {
  content: 'Fakturačné údaje';
  display: block;
  margin: 0 0 12px;
  padding: 0 0 10px;
  border-bottom: 1px solid var(--border);
  font-family: var(--font-body);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--charcoal);
}

body.users-update #deliver_address-element,
body.users-update #updatelog-element {
  margin-top: 18px !important;
}

/* riadky poli — mriezka namiesto floatov */
body.users-update #update-profile-form fieldset > dl {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
}

body.users-update #update-profile-form fieldset > dl > div {
  box-sizing: border-box !important;
  float: none !important;
  margin: 0 !important;
  min-width: 0 !important;
}

body.users-update #update-profile-form .no-reg-info {
  flex: 1 1 100% !important;
  margin: 6px 0 2px !important;
}

body.users-update #update-profile-form .row-full,
body.users-update #update-profile-form .row {
  flex: 1 1 100% !important;
  width: auto !important;
}

body.users-update #update-profile-form .row-medium-margin,
body.users-update #update-profile-form .row-medium {
  flex: 1 1 calc(50% - 6px) !important;
  width: auto !important;
}

body.users-update #update-profile-form .row-big {
  flex: 1 1 calc(62% - 6px) !important;
  width: auto !important;
}

body.users-update #update-profile-form .row-small {
  flex: 1 1 calc(38% - 6px) !important;
  width: auto !important;
}

body.users-update #update-profile-form .element {
  float: none !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
}

/* nadpis sekcie dodacej adresy */
body.users-update #update-profile-form .no-reg-info > p:first-child {
  margin: 0 !important;
  padding: 0 0 10px !important;
  border-bottom: 1px solid var(--border) !important;
  font-family: var(--font-body) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: var(--charcoal) !important;
}

body.users-update #update-profile-form .no-reg-info p.info {
  margin: 8px 0 0 !important;
  padding: 0 !important;
  border: none !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--mid) !important;
}

body.users-update #update-profile-form a.universal-link {
  color: var(--rose) !important;
  text-decoration: underline !important;
}

/* ── Polia ── */
body.users-update #update-profile-form input[type="text"],
body.users-update #update-profile-form input[type="email"],
body.users-update #update-profile-form input[type="tel"],
body.users-update #update-profile-form input[type="password"],
body.users-update #update-profile-form select {
  box-sizing: border-box !important;
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  height: 48px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  background: var(--white) !important;
  font-family: var(--font-body) !important;
  font-size: 14.5px !important;
  color: var(--charcoal) !important;
  transition: var(--transition) !important;
}

body.users-update #update-profile-form input:focus,
body.users-update #update-profile-form select:focus {
  outline: none !important;
  border-color: var(--rose) !important;
  box-shadow: 0 0 0 3px rgba(196,123,104,.12) !important;
}

body.users-update #update-profile-form input::placeholder {
  color: #a8a8a8 !important;
  opacity: 1 !important;
}

/* ── Tlacidlo ── */
body.users-update #fieldset-updatelog > dl {
  display: block !important;
  margin-top: 6px !important;
  padding-top: 18px !important;
  border-top: 1px solid var(--border) !important;
}

body.users-update #fieldset-updatelog .buttons,
body.users-update #button-update {
  display: block !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.users-update #update[type="submit"] {
  display: block !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 16px 24px !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
  background: var(--charcoal) !important;
  color: var(--white) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: .03em !important;
  cursor: pointer !important;
  box-shadow: 0 6px 20px rgba(26,26,26,.22) !important;
  transition: var(--transition) !important;
  -webkit-appearance: none !important;
          appearance: none !important;
}

body.users-update #update[type="submit"]:hover {
  background: var(--rose) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 26px rgba(196,123,104,.36) !important;
}

@media screen and (max-width: 760px) {

  body.users-update .new-reg-info {
    font-size: 25px !important;
  }

  body.users-update #update-profile-form {
    padding: 22px 18px 20px !important;
  }

  body.users-update #update-profile-form .row-medium-margin,
  body.users-update #update-profile-form .row-medium,
  body.users-update #update-profile-form .row-big,
  body.users-update #update-profile-form .row-small {
    flex: 1 1 100% !important;
  }
}

/* ============================================================
   MOJE OBJEDNAVKY (body.orders-orders)
   ------------------------------------------------------------
   Stav pred zmenou: hola tabulka bez ohranicenia, riadky vysoke
   21px bez oddelovacov, nadpis stranky ziadny, hlavicka stlpca
   "Akcie" mala cierne pozadie s temer ciernym textom (dedene
   z .button-type-1), stav objednavky len ako obycajny text.
   ============================================================ */

body.orders-orders .content {
  max-width: 1200px !important;
  margin: 0 auto !important;
}

/* nadpis stranky — v sablone chyba */
body.orders-orders #user-order::before {
  content: 'Moje objednávky';
  flex: 1 1 100%;
  margin: 8px 0 18px;
  font-family: var(--font-head);
  font-size: 32px;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
  color: var(--charcoal);
}

body.orders-orders #user-order {
  display: flex !important;
  flex-wrap: wrap !important;
  max-width: 1000px !important;
  margin: 0 auto 40px !important;
}

/* ── Karta s tabulkou ── */
body.orders-orders #user-order .table-public {
  box-sizing: border-box !important;
  width: 100% !important;
  margin: 0 !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  overflow: hidden !important;
}

/* ── Hlavicka ── */
body.orders-orders #user-order tr.title th {
  padding: 14px 16px !important;
  background: var(--light-bg) !important;
  border: none !important;
  border-bottom: 1px solid var(--border) !important;
  border-radius: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  color: var(--charcoal) !important;
  text-align: left !important;
}

body.orders-orders #user-order tr.title th.action {
  text-align: right !important;
}

/* ── Riadky ── */
body.orders-orders #user-order tbody.content td {
  padding: 15px 16px !important;
  border: none !important;
  border-bottom: 1px solid var(--border) !important;
  background: transparent !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  color: var(--charcoal) !important;
  text-align: left !important;
  vertical-align: middle !important;
}

body.orders-orders #user-order tbody.content tr:last-child td {
  border-bottom: none !important;
}

body.orders-orders #user-order tbody.content tr:hover td {
  background: var(--light-bg) !important;
}

/* variabilny symbol */
body.orders-orders #user-order tbody.content td:nth-child(1) {
  font-weight: 700 !important;
  font-variant-numeric: tabular-nums !important;
}

body.orders-orders #user-order tbody.content td:nth-child(1)::before {
  content: '#';
  opacity: .4;
  margin-right: 1px;
}

/* datum */
body.orders-orders #user-order tbody.content td:nth-child(2) {
  color: var(--mid) !important;
  white-space: nowrap !important;
  font-variant-numeric: tabular-nums !important;
}

/* stav objednavky — je to holy text v <td> bez obalu, takze z neho
   nevieme spravit pilulku; riesime typografiou */
body.orders-orders #user-order tbody.content td:nth-child(3) {
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  color: var(--rose-dark) !important;
  white-space: nowrap !important;
}

/* cena */
body.orders-orders #user-order tbody.content td:nth-child(4) {
  font-size: 15px !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
  font-variant-numeric: tabular-nums !important;
}

/* ── Akcie ── */
body.orders-orders #user-order tbody.content td:nth-child(5) {
  text-align: right !important;
  white-space: nowrap !important;
}

body.orders-orders #user-order td .update-a,
body.orders-orders #user-order td .pdf-a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  margin-left: 6px !important;
  border: 1px solid var(--border) !important;
  border-radius: 50% !important;
  background: var(--white) !important;
  color: var(--mid) !important;
  font-size: 13px !important;
  text-decoration: none !important;
  transition: var(--transition) !important;
}

body.orders-orders #user-order td .update-a:hover,
body.orders-orders #user-order td .pdf-a:hover {
  border-color: var(--rose) !important;
  background: var(--rose-light) !important;
  color: var(--rose-dark) !important;
  transform: translateY(-1px) !important;
}

/* ── Strankovanie ── */
body.orders-orders #user-order .paginationControl {
  flex: 1 1 100% !important;
  margin-top: 18px !important;
  text-align: center !important;
}

@media screen and (max-width: 600px) {

  body.orders-orders #user-order::before {
    font-size: 25px;
  }

  body.orders-orders #user-order tr.title th,
  body.orders-orders #user-order tbody.content td {
    padding: 12px 10px !important;
  }
}

/* ============================================================
   DETAIL OBJEDNAVKY (body.orders-update)
   ------------------------------------------------------------
   Stav pred zmenou: sekcne nadpisy boli jasnocervene pasy cez celu
   sirku 1200px (dedene z base), riadky vysoke 23px bez oddelovacov
   a bez ohranicenia, obsah roztiahnuty cez celu sirku stranky.
   Struktura: .order-detail-title | .order-detail-cell-first /
   -second (kazdy s .left / .center / .right) | .order-detail-cell-title
   ============================================================ */

body.orders-update .content {
  box-sizing: border-box !important;
  max-width: 860px !important;
  margin: 0 auto 40px !important;
}

/* ── Nadpis stranky ── */
body.orders-update .order-detail-title {
  margin: 12px 0 20px !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
}

body.orders-update .order-detail-title p {
  margin: 0 !important;
  font-family: var(--font-head) !important;
  font-size: 30px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  text-align: center !important;
  color: var(--charcoal) !important;
}

/* ── Sekcne nadpisy — boli cervene pasy ── */
body.orders-update .order-detail-cell-title {
  box-sizing: border-box !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 22px 0 0 !important;
  padding: 13px 18px !important;
  background: var(--light-bg) !important;
  border: 1px solid var(--border) !important;
  border-bottom: none !important;
  border-radius: var(--radius) var(--radius) 0 0 !important;
  color: var(--charcoal) !important;
  font-family: var(--font-body) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
}

body.orders-update .order-detail-cell-title p,
body.orders-update .order-detail-cell-title b {
  margin: 0 !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  letter-spacing: inherit !important;
  color: inherit !important;
}

/* ── Riadky s udajmi ── */
body.orders-update .order-detail-cell-first,
body.orders-update .order-detail-cell-second {
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto !important;
  align-items: baseline !important;
  gap: 6px 18px !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 12px 18px !important;
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-top: none !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  color: var(--charcoal) !important;
}

/* prvy riadok sekcie dostane hornu hranu, ak nema nadpis nad sebou */
body.orders-update .order-detail-title + .order-detail-cell-first {
  border-top: 1px solid var(--border) !important;
  border-radius: var(--radius) var(--radius) 0 0 !important;
}

/* posledny riadok pred tlacidlom */
body.orders-update .order-detail-cell-first:has(+ hr.space),
body.orders-update .order-detail-cell-second:has(+ hr.space) {
  border-radius: 0 0 var(--radius) var(--radius) !important;
}

/* riadok tesne pred sekcnym nadpisom uzatvara predchadzajuci blok */
body.orders-update .order-detail-cell-first:has(+ .order-detail-cell-title),
body.orders-update .order-detail-cell-second:has(+ .order-detail-cell-title) {
  border-radius: 0 0 var(--radius) var(--radius) !important;
}

body.orders-update .order-detail-cell-first > div,
body.orders-update .order-detail-cell-second > div {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.orders-update .order-detail-cell-first p,
body.orders-update .order-detail-cell-second p {
  margin: 0 !important;
  line-height: 1.55 !important;
}

/* lavy stlpec = popisok */
body.orders-update .order-detail-cell-first > .left p,
body.orders-update .order-detail-cell-second > .left p {
  color: var(--mid) !important;
}

/* stredny stlpec = hodnota */
body.orders-update .order-detail-cell-first > .center b,
body.orders-update .order-detail-cell-second > .center b {
  font-weight: 600 !important;
  color: var(--charcoal) !important;
}

/* pravy stlpec = cena */
body.orders-update .order-detail-cell-first > .right,
body.orders-update .order-detail-cell-second > .right {
  text-align: right !important;
  white-space: nowrap !important;
  font-variant-numeric: tabular-nums !important;
}

/* ── Celkova suma ── */
body.orders-update .total-order-price {
  background: var(--light-bg) !important;
  font-weight: 700 !important;
}

body.orders-update .total-order-price > .left p {
  font-weight: 700 !important;
  color: var(--charcoal) !important;
}

body.orders-update .total-order-price > .right {
  font-size: 18px !important;
  font-weight: 700 !important;
}

/* ── Adresy — jeden stlpec pod sebou ── */
body.orders-update .order-detail-cell-title + .order-detail-cell-first:not(:has(.center p:not(:empty))) {
  grid-template-columns: minmax(0, 1fr) !important;
}

/* ── Tlacidlo spat ── */
body.orders-update .content > hr.space {
  display: none !important;
}

body.orders-update .content > .button-type-1 {
  display: inline-block !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 22px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.orders-update .content > .button-type-1 a {
  display: inline-block !important;
  float: none !important;
  padding: 13px 22px !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  background: var(--white) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--charcoal) !important;
  text-decoration: none !important;
  transition: var(--transition) !important;
}

body.orders-update .content > .button-type-1 a:hover {
  border-color: var(--rose) !important;
  background: var(--rose-light) !important;
  color: var(--rose) !important;
}

@media screen and (max-width: 640px) {

  body.orders-update .order-detail-title p {
    font-size: 24px !important;
  }

  body.orders-update .order-detail-cell-first,
  body.orders-update .order-detail-cell-second {
    grid-template-columns: minmax(0, 1fr) auto !important;
    padding: 12px 14px !important;
  }
}

/* ============================================================
   KOŠÍK KROK 1 — najširšia verzia
   Obsah bol tvrdo obmedzený na 1200px, takže na širokých
   monitoroch pôsobil košík stratene uprostred stránky.
   Od 1500px sa postupne rozťahuje a súhrn objednávky rastie.
   ============================================================ */

@media screen and (min-width: 1500px) {

  body.cart-first .content {
    max-width: 1500px !important;
  }

  /* style.min.css ma .cart-steps { max-width:1200px } */
  body.cart-first .cart-steps {
    max-width: 100% !important;
  }

  body.cart-first .cart-steps {
    grid-template-columns: minmax(0, 1fr) 380px !important;
    gap: 26px 32px !important;
    padding: 24px !important;
  }
}

@media screen and (min-width: 1800px) {

  body.cart-first .content {
    max-width: 1720px !important;
  }

  body.cart-first .cart-steps {
    max-width: 100% !important;
  }

  body.cart-first .cart-steps {
    grid-template-columns: minmax(0, 1fr) 420px !important;
    gap: 28px 36px !important;
    padding: 28px !important;
  }
}

/* ============================================================
   KOŠÍK KROK 1 — umiestnenie bloku "Dokúpte si niektorý z…"
   Súhrn objednávky mal grid-row: 2 / span 20, takže blok
   s dokupovanými produktmi (grid-column: 1 / -1) sa umiestnil
   až za 21. riadok — vznikla obrovská medzera pod tlačidlom
   "Späť na nákup" a súhrn cez neho zároveň prekrýval.
   Blok teraz patrí do ľavého stĺpca a nadväzuje priamo naň.
   ============================================================ */

body.cart-first #products-to-break-price-level {
  grid-column: 1 !important;
  margin-top: 18px !important;
}

/* ============================================================
   KOŠÍK KROK 2 — najširšia verzia
   Voľba spôsobu nákupu bola natvrdo 940px, na širokom monitore
   pôsobili karty malé a stratené. Od 1500px sa rozťahujú.
   ============================================================ */

@media screen and (min-width: 1500px) {

  body.cart-second .content:has(#login-cart-block):has(#registration-cart-block) {
    max-width: 1200px !important;
    gap: 28px !important;
  }

  body.cart-second #login-cart-block,
  body.cart-second #registration-cart-block {
    padding: 36px 40px !important;
  }

  body.cart-second #login-cart-block .title,
  body.cart-second #registration-cart-block .title {
    font-size: 27px !important;
  }
}

@media screen and (min-width: 1800px) {

  body.cart-second .content:has(#login-cart-block):has(#registration-cart-block) {
    max-width: 1400px !important;
    gap: 32px !important;
  }

  body.cart-second #login-cart-block,
  body.cart-second #registration-cart-block {
    padding: 42px 48px !important;
  }
}

/* obsah kariet drž v čitateľnej šírke, nech polia nie sú prehnane široké */
@media screen and (min-width: 1500px) {

  body.cart-second #login-cart-block > form,
  body.cart-second #login-cart-block > .info,
  body.cart-second #registration-cart-block > .order-type,
  body.cart-second #registration-cart-block > form {
    width: 100% !important;
    max-width: 460px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }
}

/* Krok 2 — obe karty rovnako vysoké (predtým align-items:start) */
body.cart-second .content:has(#login-cart-block):has(#registration-cart-block) {
  align-items: stretch !important;
}

body.cart-second #login-cart-block,
body.cart-second #registration-cart-block {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}

/* poznámka pod prihlásením sa prilepí na spodok karty */
body.cart-second #login-cart-block .info {
  margin-top: auto !important;
}

/* Krok 2 — popis a voľby v karte "Nákup bez registrácie" trochu nižšie */
body.cart-second #registration-cart-block .order-type {
  margin-top: 22px !important;
  margin-bottom: 22px !important;
}

/* ============================================================
   KOŠÍK KROK 3 — najširšia verzia
   Rovnaké rozťahovanie ako v prvom kroku; .cart-steps má zo
   style.min.css max-width:1200px, ktorý treba zrušiť.
   ============================================================ */

@media screen and (min-width: 1500px) {

  body.cart-third .content {
    max-width: 1500px !important;
  }

  body.cart-third .cart-steps {
    max-width: 100% !important;
    grid-template-columns: minmax(0, 1fr) 380px !important;
    gap: 24px 32px !important;
    padding: 24px !important;
  }
}

@media screen and (min-width: 1800px) {

  body.cart-third .content {
    max-width: 1720px !important;
  }

  body.cart-third .cart-steps {
    max-width: 100% !important;
    grid-template-columns: minmax(0, 1fr) 420px !important;
    gap: 26px 36px !important;
    padding: 28px !important;
  }
}

/* ============================================================
   KOŠÍK — POĎAKOVANIE, najširšia verzia
   Karta bola natvrdo 720px; na veľkom monitore pôsobila drobná.
   ============================================================ */

@media screen and (min-width: 1500px) {

  body.cart-success .content {
    max-width: 1500px !important;
  }

  body.cart-success #cart-success.bg-cart-block {
    max-width: 900px !important;
    padding: 52px 56px 44px !important;
  }

  body.cart-success #cart-success .icon-success {
    width: 88px !important;
    height: 88px !important;
    background-size: 40px 40px !important;
    margin-bottom: 24px !important;
  }

  body.cart-success #cart-success-text .title {
    font-size: 36px !important;
  }

  body.cart-success #cart-success-text .text {
    max-width: 620px !important;
    font-size: 15.5px !important;
  }
}

@media screen and (min-width: 1800px) {

  body.cart-success #cart-success.bg-cart-block {
    max-width: 1020px !important;
    padding: 60px 64px 50px !important;
  }

  body.cart-success #cart-success-text .title {
    font-size: 40px !important;
  }

  body.cart-success #cart-success-text .text {
    max-width: 680px !important;
    font-size: 16px !important;
  }
}

/* ============================================================
   KATALÓG — karta produktu a tlačidlo "Do košíka"
   .product-images a .product-content mali content-box + width:100%
   + padding, takže boli o 24–28px širšie ako karta a tlačidlo
   prečnievalo cez pravý okraj do vedľajšej karty.
   ============================================================ */

.product-third,
.product-second,
.product-third .product-images,
.product-second .product-images,
.product-third .product-content,
.product-second .product-content,
.product-third .product-content > *,
.product-second .product-content > * {
  box-sizing: border-box !important;
  max-width: 100% !important;
}

/* cena + tlačidlo na jednom riadku, bez pretekania */
.product-third .product-content .price,
.product-second .product-content .price {
  box-sizing: border-box !important;
}

.product-third fieldset,
.product-second fieldset,
.product-third .add-cart-catalog,
.product-second .add-cart-catalog {
  box-sizing: border-box !important;
  max-width: 100% !important;
}

/* samotné tlačidlo — nech nikdy neprerastie kartu */
.button-add-cart-button,
.button-type-1.button-add-cart-button,
[id^="button-add-cart-button"] {
  box-sizing: border-box !important;
  max-width: 100% !important;
  border-radius: var(--radius-sm) !important;
  margin-left: 0 !important;
  transition: var(--transition) !important;
}

input.add-cart-button,
.button-type-1.button-add-cart-button input[type="submit"],
.button-add-cart-button input[type="submit"],
.add-cart-catalog input[type="submit"] {
  max-width: 100% !important;
  letter-spacing: .05em !important;
}

/* hover na celý obal, nielen na input */
[id^="button-add-cart-button"]:hover {
  background: var(--rose) !important;
  box-shadow: 0 4px 16px rgba(196,123,104,.35) !important;
}

/* ── Spodný riadok karty: cena vľavo, tlačidlo vpravo ── */
.product-third .product-content p.price,
.product-second .product-content p.price {
  float: left !important;
  margin: 10px 0 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  min-height: 44px !important;
}

.product-third .add-cart-catalog,
.product-second .add-cart-catalog {
  display: flex !important;
  justify-content: flex-end !important;
  margin: 10px 0 0 !important;
}

.product-third .add-cart-catalog > form,
.product-second .add-cart-catalog > form {
  width: auto !important;
  max-width: 100% !important;
}

.product-third .add-cart-catalog fieldset,
.product-second .add-cart-catalog fieldset {
  width: auto !important;
}

/* tlačidlo: pevná pohodlná šírka namiesto natiahnutia cez pol karty */
.product-third [id^="button-add-cart-button"],
.product-second [id^="button-add-cart-button"] {
  position: relative !important;
  display: block !important;
  width: 220px !important;
  max-width: 100% !important;
}

.product-third [id^="button-add-cart-button"] input[type="submit"],
.product-second [id^="button-add-cart-button"] input[type="submit"] {
  padding-left: 40px !important;
  padding-right: 18px !important;
  text-align: center !important;
}

/* ikonka košíka */
.product-third [id^="button-add-cart-button"]::before,
.product-second [id^="button-add-cart-button"]::before {
  content: "";
  position: absolute;
  left: 18px;
  top: 50%;
  width: 17px;
  height: 17px;
  margin-top: -8.5px;
  pointer-events: none;
  z-index: 2;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9.5' cy='20' r='1.4'/%3E%3Ccircle cx='18' cy='20' r='1.4'/%3E%3Cpath d='M2.5 3.5h2.6l2.3 11.2a1.6 1.6 0 0 0 1.6 1.3h8.4a1.6 1.6 0 0 0 1.6-1.3l1.5-7.6H6'/%3E%3C/svg%3E") center / 17px 17px no-repeat;
}

@media screen and (max-width: 700px) {

  .product-third .add-cart-catalog,
  .product-second .add-cart-catalog {
    justify-content: stretch !important;
  }

  .product-third [id^="button-add-cart-button"],
  .product-second [id^="button-add-cart-button"] {
    width: 100% !important;
  }
}

/* ============================================================
   KATALÓG — karty ako grid, tlačidlo neprilepené na spodok
   script.min.js (adjustProductContentSize) nastavuje .product-content
   pevnú inline výšku, takže blok s tlačidlom z nej pretekal a
   dosadal na okraj karty. Výšku vyrovnáva namiesto toho grid.
   ============================================================ */

.catalog-block {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(max(240px, calc((100% - 32px) / 3)), 1fr)) !important;
  gap: 16px !important;
  align-items: stretch !important;
}

.catalog-block > .product-second,
.catalog-block > .product-third {
  display: flex !important;
  flex-direction: column !important;
  width: auto !important;
  margin: 0 !important;
  float: none !important;
}

/* JS-om nastavená pevná výška už nie je potrebná */
.catalog-block .product-content,
.catalog-block .product-content-description,
.catalog-block .show-appurtenances,
.catalog-block .catalog-delivery_name,
.catalog-block p.price {
  height: auto !important;
}

.catalog-block .product-content {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  padding-bottom: 16px !important;
}

/* cena + tlačidlo sa držia pri spodku karty, ale s odstupom od okraja */
.catalog-block .product-content p.price {
  margin-top: auto !important;
}

.catalog-block .add-cart-catalog {
  margin: 12px 0 0 !important;
}

@media screen and (max-width: 1100px) {

  .catalog-block {
    grid-template-columns: repeat(auto-fill, minmax(max(220px, calc((100% - 16px) / 2)), 1fr)) !important;
  }
}

@media screen and (max-width: 640px) {

  .catalog-block {
    grid-template-columns: 1fr !important;
  }
}

/* ============================================================
   VALIDAČNÉ IKONKY V POLIACH (.success-element / .error-element)
   Boli to plávajúce 25px sprite obrázky pod poľom. Teraz sú to
   vektorové ikonky vnútri pravého okraja daného inputu.
   ============================================================ */

.element,
.row .element,
.row-medium-margin .element {
  position: relative !important;
}

.element > .success-element,
.element > .error-element {
  position: absolute !important;
  top: 24px !important;
  /* .myform .error-element ma zo zakladu left:0 — treba ho zrusit */
  left: auto !important;
  right: 14px !important;
  width: 18px !important;
  height: 18px !important;
  margin: -9px 0 0 !important;
  padding: 0 !important;
  float: none !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 18px 18px !important;
  pointer-events: none !important;
  z-index: 3 !important;
}

.element > .success-element {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232e7d4f' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m20 6-11 11-5-5'/%3E%3C/svg%3E") !important;
}

.element > .error-element {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c0392b' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cline x1='12' y1='7.5' x2='12' y2='13'/%3E%3Cline x1='12' y1='16.5' x2='12.01' y2='16.5'/%3E%3C/svg%3E") !important;
}

/* miesto pre ikonku, nech ju text nepodlieza */
.element:has(> .success-element) > input[type="text"],
.element:has(> .success-element) > input[type="password"],
.element:has(> .error-element) > input[type="text"],
.element:has(> .error-element) > input[type="password"] {
  padding-right: 40px !important;
}

/* zoznam chýb pod polom — bez plávania a bez sprite odrážky */
.element > ul.errors {
  clear: both !important;
  float: none !important;
  margin: 6px 0 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.element > ul.errors li {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
  color: #c0392b !important;
}

/* vyššia špecificita — body.cart-second .no-reg-form input má tiež !important */
body.cart-second .no-reg-form .element:has(> .success-element) > input[type="text"],
body.cart-second .no-reg-form .element:has(> .success-element) > input[type="password"],
body.cart-second .no-reg-form .element:has(> .error-element) > input[type="text"],
body.cart-second .no-reg-form .element:has(> .error-element) > input[type="password"],
body.users-registration .element:has(> .success-element) > input[type="text"],
body.users-registration .element:has(> .error-element) > input[type="text"] {
  padding-right: 40px !important;
}

/* ============================================================
   DETAIL — cenový box (#price-block) na širokej verzii
   Cena aj košík boli plávajúce, končili 110px pred pravým
   okrajom karty a mali rôznu výšku (70 vs 90px).
   ============================================================ */

#price-block {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 18px 24px !important;
  padding: 22px 26px !important;
}

#price-block .detail-old-and-actual-price {
  float: none !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  align-items: baseline !important;
  flex-wrap: wrap !important;
  gap: 6px 12px !important;
}

#price-block .detail-add-to-cart-all {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex: 0 0 auto !important;
  float: none !important;
  margin: 0 !important;
}

#price-block .detail-add-to-cart-all .mini-imput-text,
#price-block .detail-add-to-cart-all input#count {
  margin: 0 !important;
  text-align: center !important;
}

#price-block .detail-add-to-cart-all .add-cart,
#price-block .detail-add-to-cart-all form,
#price-block .detail-add-to-cart-all fieldset {
  margin: 0 !important;
}

@media screen and (max-width: 640px) {

  #price-block {
    justify-content: flex-start !important;
  }

  #price-block .detail-add-to-cart-all {
    width: 100% !important;
  }
}

/* "Ušetríte …" patrí pod cenu, nie vedľa nej */
#price-block .detail-old-and-actual-price {
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 4px !important;
}

#price-block .detail-old-and-actual-price p.price {
  margin: 0 !important;
}

#price-block .detail-old-and-actual-price p.save-price {
  margin: 0 !important;
}

/* ============================================================
   DETAIL — formulár "Otázka na predajcu" (#contact-left-detail)
   Povodne: sivy blok #ededed bez ramu, uzke 185px polia s float,
   nadpis ako obycajny text, tlacidlo a captcha vedla seba.
   ============================================================ */

#detail #contact-left-detail,
#contact-left-detail {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  margin: 22px 0 0 !important;
  padding: 24px 26px 26px !important;
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow-sm) !important;
}

/* nadpis */
#contact-left-detail > p:first-of-type {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 0 18px !important;
  padding: 0 0 14px !important;
  border-bottom: 1px solid var(--border) !important;
  font-family: var(--font-head) !important;
  font-size: 22px !important;
  font-weight: 600 !important;
  color: var(--charcoal) !important;
  line-height: 1.25 !important;
}

#contact-left-detail > p:first-of-type::before {
  content: "";
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c47b68' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 11.5a8.4 8.4 0 0 1-9 8.4c-1.3 0-2.5-.2-3.6-.7L3 21l1.8-5.1A8.2 8.2 0 0 1 4 11.5 8.4 8.4 0 0 1 12.5 3 8.4 8.4 0 0 1 21 11.5z'/%3E%3C/svg%3E") center / 20px 20px no-repeat;
}

/* mriežka polí */
#contact-left-detail .myform,
#contact-left-detail form {
  width: 100% !important;
}

#contact-left-detail fieldset {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px 16px !important;
  float: none !important;
  width: 100% !important;
  border: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

#contact-left-detail .row {
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
}

#contact-left-detail .element {
  float: none !important;
  width: 100% !important;
  height: auto !important;
}

/* telefón a otázka cez celú šírku */
#contact-left-detail .row:has(#tel),
#contact-left-detail .row:has(textarea),
#contact-left-detail .row:has(.buttons),
#contact-left-detail .buttons {
  grid-column: 1 / -1 !important;
}

#contact-left-detail input[type="text"],
#contact-left-detail input[type="email"],
#contact-left-detail textarea {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 12px 14px !important;
  background: var(--light-bg) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  color: var(--charcoal) !important;
  transition: border-color .18s ease, background-color .18s ease !important;
}

#contact-left-detail textarea {
  height: 120px !important;
  resize: vertical !important;
  line-height: 1.55 !important;
}

#contact-left-detail input[type="text"]:focus,
#contact-left-detail textarea:focus {
  outline: none !important;
  background: var(--white) !important;
  border-color: var(--rose) !important;
  box-shadow: 0 0 0 3px rgba(196,123,104,.14) !important;
}

/* spodný riadok: captcha vľavo, tlačidlo vpravo */
#contact-left-detail .buttons {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 14px !important;
  float: none !important;
  width: 100% !important;
  margin: 4px 0 0 !important;
  position: static !important;
}

#contact-left-detail .g-recaptcha,
#contact-left-detail [class*="captcha"] {
  flex: 0 0 auto !important;
}

#contact-left-detail .button-type-1 {
  float: none !important;
  margin: 0 0 0 auto !important;
  background: var(--rose) !important;
  border-radius: var(--radius-sm) !important;
  box-shadow: 0 4px 16px rgba(196,123,104,.28) !important;
  transition: var(--transition) !important;
}

#contact-left-detail .button-type-1:hover {
  background: var(--rose-dark) !important;
}

#contact-left-detail .button-type-1 input[type="submit"] {
  height: 46px !important;
  padding: 0 30px !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  color: var(--white) !important;
  font-family: var(--font-body) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  letter-spacing: .04em !important;
  cursor: pointer !important;
}

@media screen and (max-width: 640px) {

  #contact-left-detail fieldset {
    grid-template-columns: 1fr !important;
  }

  #contact-left-detail .buttons {
    justify-content: stretch !important;
  }
}

/* polia v otázke na predajcu mali zo základu sprite obrázky ako pozadie
   (.webp #fieldset-send_for_seller #phone { background:… !important }) */
.webp #contact-left-detail #phone,
.no-webp #contact-left-detail #phone,
.webp #contact-left-detail .row .element input,
.no-webp #contact-left-detail .row .element input,
.webp #contact-left-detail textarea,
.no-webp #contact-left-detail textarea {
  background-image: none !important;
}

/* ============================================================
   DETAIL — info-links (Upozorniť na zníženie ceny, Otázka na
   predajcu, Poslať známemu na e-mail, porovnávač, obľúbené)
   Zakladne CSS: <li> so sirkou 248px a vyskou 30px + float,
   ikonka mimo pillu a odkaz posunuty o -5px hore. Riadky sa
   prekryvali. Teraz je pillom samotne <li>.
   ============================================================ */

#detail .info-links,
.info-links {
  float: none !important;
  width: 100% !important;
  margin: 22px 0 0 !important;
  padding: 18px 0 0 !important;
  border-top: 1px solid var(--border) !important;
}

.info-links ul {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  align-items: stretch !important;
  /* základné CSS necháva ul so šírkou 0 — položky potom vypadli mimo stĺpca */
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.info-links ul li {
  display: inline-flex !important;
  align-items: center !important;
  gap: 9px !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 9px 16px !important;
  background: var(--light-bg) !important;
  border: 1px solid var(--border) !important;
  border-radius: 100px !important;
  line-height: 1.2 !important;
  transition: background-color .16s ease, border-color .16s ease !important;
}

.info-links ul li:hover {
  background: #fbf2ee !important;
  border-color: rgba(196,123,104,.45) !important;
}

/* ikonka je súrodenec odkazu — necháme ju vnútri pillu */
.info-links ul li > span[class^="icon-"],
.info-links ul li > span[class*=" icon-"] {
  display: inline-block !important;
  flex: 0 0 17px !important;
  width: 17px !important;
  height: 17px !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  position: static !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 17px 17px !important;
}

/* odkaz je len text */
.info-links ul li a,
.info-links ul li a#low-price,
.info-links ul li a#question-seller,
.info-links ul li a#send-frend {
  display: inline !important;
  position: static !important;
  top: auto !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  color: var(--charcoal) !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
}

.info-links ul li:hover a {
  color: var(--rose-dark) !important;
}

/* sprite ikonky → vektorové v ružovej */
.info-links .icon-cart-low-price {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c47b68' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9'/%3E%3Cpath d='M13.7 21a2 2 0 0 1-3.4 0'/%3E%3C/svg%3E") !important;
}

.info-links .icon-cart-question {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c47b68' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M9.1 9a3 3 0 0 1 5.8 1c0 2-3 3-3 3'/%3E%3Cline x1='12' y1='17' x2='12.01' y2='17'/%3E%3C/svg%3E") !important;
}

.info-links .icon-cart-send {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c47b68' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpolyline points='22,6 12,13 2,6'/%3E%3C/svg%3E") !important;
}

.info-links .icon-cart-add-favorit {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c47b68' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.8 4.6a5.5 5.5 0 0 0-7.8 0L12 5.7l-1.1-1.1a5.5 5.5 0 0 0-7.8 7.8l1.1 1.1L12 21.2l7.8-7.8 1-1.1a5.5 5.5 0 0 0 0-7.7z'/%3E%3C/svg%3E") !important;
}

.info-links .icon-compare {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c47b68' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='20' x2='18' y2='10'/%3E%3Cline x1='12' y1='20' x2='12' y2='4'/%3E%3Cline x1='6' y1='20' x2='6' y2='14'/%3E%3C/svg%3E") !important;
}

@media screen and (max-width: 700px) {

  .info-links ul li {
    padding: 8px 13px !important;
  }

  .info-links ul li a {
    font-size: 12px !important;
    white-space: normal !important;
  }
}

/* ============================================================
   MODÁLNE OKNÁ (upozornenie na cenu, poslať známemu, záujem)
   Rovnaká pasca ako pri #form-question-seller: základné CSS dáva
   #form-customer-interest a #form-question-for-frend
   position:fixed, panel potom mal výšku 0 a formulár sa nezobrazil.
   ============================================================ */

.show-box-ajax-content > div,
.show-box-ajax-content-right > div,
.show-box-ajax-content #form-question-for-frend,
.show-box-ajax-content #form-customer-interest,
.show-box-ajax-content-right #form-question-for-frend,
.show-box-ajax-content-right #form-customer-interest {
  position: static !important;
  top: auto !important;
  left: auto !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.show-box-ajax-content,
.show-box-ajax-content-right {
  height: auto !important;
  padding: 26px 28px !important;
}

/* #slow-price-content má zo základu margin-left:-110px a float:left —
   obsah modálu potom vytekal cez ľavý okraj panela */
.show-box-ajax-content #slow-price-content,
.show-box-ajax-content-right #slow-price-content {
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

.show-box-ajax-content #slow-price-content p,
.show-box-ajax-content #slow-price-content form,
.show-box-ajax-content-right #slow-price-content p,
.show-box-ajax-content-right #slow-price-content form {
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: auto !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.show-box-ajax-content #slow-price-content input[type="text"],
.show-box-ajax-content-right #slow-price-content input[type="text"] {
  box-sizing: border-box !important;
  height: 42px !important;
  padding: 10px 14px !important;
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
}

.show-box-ajax-content .slow-price-content-button,
.show-box-ajax-content-right .slow-price-content-button {
  margin: 18px 0 0 !important;
  text-align: right !important;
}

.show-box-ajax-content .slow-price-content-button .button-type-1,
.show-box-ajax-content-right .slow-price-content-button .button-type-1 {
  float: none !important;
  display: inline-block !important;
  margin: 0 !important;
  background: var(--rose) !important;
  border-radius: var(--radius-sm) !important;
}

/* Panel modálu sa smie zobraziť len keď je otvorený prekryv.
   Po zatvorení ho JS len vyprázdni (.html("")) a pri načítaní stránky
   obsahuje biely znak — v oboch prípadoch zostával na obrazovke ako
   farebný obdĺžnik (odkedy má vlastný padding). */
.show-box-ajax-content,
.show-box-ajax-content-right {
  display: none !important;
}

.show-box-ajax[style*="display: block"] + .show-box-ajax-content,
.show-box-ajax-right[style*="display: block"] + .show-box-ajax-content-right {
  display: block !important;
}

.show-box-ajax[style*="display: block"] + .show-box-ajax-content:empty,
.show-box-ajax-right[style*="display: block"] + .show-box-ajax-content-right:empty {
  display: none !important;
}

/* Krížik na zatvorenie modálu bol neviditeľný — pravidlo používalo
   premennú --text-muted, ktorá v tejto šablóne neexistuje. */
#a-close-window::before,
#a-close-window::after {
  background: var(--mid, #6b7280) !important;
  width: 13px !important;
  height: 1.6px !important;
}

#a-close-window {
  border-color: rgba(26,26,26,.22) !important;
}

#a-close-window:hover::before,
#a-close-window:hover::after {
  background: var(--rose) !important;
}

/* Polia v modálnom formulári "Otázka na predajcu" */
.show-box-ajax-content #form-question-seller .row,
.show-box-ajax-content-right #form-question-seller .row,
.show-box-ajax-content #form-question-seller .element,
.show-box-ajax-content-right #form-question-seller .element {
  float: none !important;
  width: 100% !important;
  margin: 0 0 10px !important;
  box-sizing: border-box !important;
}

.show-box-ajax-content #form-question-seller input[type="text"],
.show-box-ajax-content #form-question-seller textarea,
.show-box-ajax-content-right #form-question-seller input[type="text"],
.show-box-ajax-content-right #form-question-seller textarea {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 11px 14px !important;
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  color: var(--charcoal) !important;
}

.show-box-ajax-content #form-question-seller textarea,
.show-box-ajax-content-right #form-question-seller textarea {
  height: 110px !important;
  resize: vertical !important;
  line-height: 1.55 !important;
}

.show-box-ajax-content #form-question-seller input[type="text"]:focus,
.show-box-ajax-content #form-question-seller textarea:focus,
.show-box-ajax-content-right #form-question-seller input[type="text"]:focus,
.show-box-ajax-content-right #form-question-seller textarea:focus {
  outline: none !important;
  border-color: var(--rose) !important;
  box-shadow: 0 0 0 3px rgba(196,123,104,.14) !important;
}

.show-box-ajax-content #form-question-seller .info-required,
.show-box-ajax-content-right #form-question-seller .info-required {
  margin: 0 0 12px !important;
  font-size: 12px !important;
  color: var(--mid) !important;
}

/* textarea v modáli mala zo základu position:relative; left:400px */
.show-box-ajax-content #form-question-seller textarea,
.show-box-ajax-content-right #form-question-seller textarea,
.show-box-ajax-content textarea,
.show-box-ajax-content-right textarea {
  position: static !important;
  left: auto !important;
  top: auto !important;
}

/* Tlačidlo "Odoslať otázku" malo zo základu position:relative;
   top:-134px; left:48px — prekrývalo pole Telefón. */
.show-box-ajax-content #question-button,
.show-box-ajax-content-right #question-button,
#form-question-seller #question-button {
  position: static !important;
  top: auto !important;
  left: auto !important;
  margin: 16px 0 0 auto !important;
  float: none !important;
}

#form-question-seller {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
}

#form-question-seller > hr.space {
  display: none !important;
}

/* obálkový sprite aj v modálnom poli Telefón */
.webp .show-box-ajax-content #phone1,
.no-webp .show-box-ajax-content #phone1,
.webp .show-box-ajax-content-right #phone1,
.no-webp .show-box-ajax-content-right #phone1 {
  background-image: none !important;
}

/* vyššia špecificita než ".webp #fieldset-send_for_seller .row .element #phone1" */
.webp .show-box-ajax-content #fieldset-send_for_seller .row .element #phone1,
.no-webp .show-box-ajax-content #fieldset-send_for_seller .row .element #phone1,
.webp .show-box-ajax-content-right #fieldset-send_for_seller .row .element #phone1,
.no-webp .show-box-ajax-content-right #fieldset-send_for_seller .row .element #phone1,
.webp #contact-left-detail #fieldset-send_for_seller_detail .row .element #phone,
.no-webp #contact-left-detail #fieldset-send_for_seller_detail .row .element #phone {
  background-image: none !important;
  background-color: var(--white) !important;
  width: 100% !important;
}

/* ============================================================
   Spoločné štýly pre formuláre v modálnych oknách
   (Otázka na predajcu, Poslať známemu na e-mail, …)
   ============================================================ */

.show-box-ajax-content .row,
.show-box-ajax-content-right .row,
.show-box-ajax-content .element,
.show-box-ajax-content-right .element {
  float: none !important;
  width: 100% !important;
  margin: 0 0 10px !important;
  box-sizing: border-box !important;
}

.show-box-ajax-content input[type="text"],
.show-box-ajax-content textarea,
.show-box-ajax-content-right input[type="text"],
.show-box-ajax-content-right textarea {
  box-sizing: border-box !important;
  position: static !important;
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 11px 14px !important;
  background-color: var(--white) !important;
  background-image: none !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  color: var(--charcoal) !important;
}

.show-box-ajax-content textarea,
.show-box-ajax-content-right textarea {
  height: 110px !important;
  resize: vertical !important;
  line-height: 1.55 !important;
}

.show-box-ajax-content input[type="text"]:focus,
.show-box-ajax-content textarea:focus,
.show-box-ajax-content-right input[type="text"]:focus,
.show-box-ajax-content-right textarea:focus {
  outline: none !important;
  border-color: var(--rose) !important;
  box-shadow: 0 0 0 3px rgba(196,123,104,.14) !important;
}

/* tlačidlo vždy vpravo dole a bez posunov zo základu */
#form-question-for-frend,
#form-customer-interest {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
}

#form-question-for-frend > hr.space,
#form-customer-interest > hr.space {
  display: none !important;
}

#form-question-for-frend #question-button,
#form-customer-interest #question-button,
.show-box-ajax-content #question-button,
.show-box-ajax-content-right #question-button {
  position: static !important;
  top: auto !important;
  left: auto !important;
  float: none !important;
  margin: 16px 0 0 auto !important;
}

/* =====================================================
   PRIHLÁSENIE DO NEWSLETTRA — overenie e-mailu
   (body.newsletter-validate-and-add-newsletter)
   ===================================================== */
body.newsletter-validate-and-add-newsletter div.content {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  max-width: 640px !important;
  height: auto !important;
  margin: 0 auto !important;
  padding: 10px 0 64px !important;
  background: none !important;
}
/* nadpis stránky */
body.newsletter-validate-and-add-newsletter div.content::before {
  content: 'Odber noviniek' !important;
  display: block !important;
  margin: 0 0 22px !important;
  font-family: var(--font-head) !important;
  font-size: 34px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  color: var(--charcoal) !important;
  text-align: center !important;
}

/* ── informačný riadok ── */
body.newsletter-validate-and-add-newsletter #info-block {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 0 18px !important;
  padding: 14px 18px !important;
  background: var(--rose-light) !important;
  border: 1px solid rgba(196,123,104,.35) !important;
  border-radius: var(--radius-sm) !important;
}
body.newsletter-validate-and-add-newsletter #info-block p {
  box-sizing: border-box !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 13.5px !important;
  line-height: 1.55 !important;
  color: var(--dark) !important;
  -webkit-text-fill-color: currentColor !important;
  text-align: left !important;
}
body.newsletter-validate-and-add-newsletter #info-block .info {
  flex: 0 0 auto !important;
  display: block !important;
  float: none !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  background-color: var(--rose) !important;
  background-image: none !important;
  -webkit-mask: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm1 15h-2v-6h2v6Zm0-8h-2V7h2v2Z'/%3E%3C/svg%3E") no-repeat center / contain !important;
          mask: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm1 15h-2v-6h2v6Zm0-8h-2V7h2v2Z'/%3E%3C/svg%3E") no-repeat center / contain !important;
}

/* ── karta s formulárom ── */
body.newsletter-validate-and-add-newsletter form,
body.newsletter-validate-and-add-newsletter .myform {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
}
body.newsletter-validate-and-add-newsletter #fieldset-validateNewsletterForm {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 30px 32px 32px !important;
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: 0 2px 16px rgba(0,0,0,.06) !important;
}
body.newsletter-validate-and-add-newsletter #fieldset-validateNewsletterForm legend { display: none !important; }
body.newsletter-validate-and-add-newsletter .row {
  display: block !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 0 20px !important;
  padding: 0 !important;
  background: none !important;
}
body.newsletter-validate-and-add-newsletter .element {
  display: block !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.newsletter-validate-and-add-newsletter label.left {
  display: block !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .12em !important;
  line-height: 1.4 !important;
  text-transform: uppercase !important;
  color: var(--mid) !important;
  -webkit-text-fill-color: currentColor !important;
  text-align: left !important;
}
body.newsletter-validate-and-add-newsletter label.required::after {
  content: ' *' !important;
  color: var(--rose) !important;
}

/* ── polia ── */
body.newsletter-validate-and-add-newsletter select#categoryForNewsletter {
  box-sizing: border-box !important;
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  height: 148px !important;
  margin: 0 !important;
  padding: 8px !important;
  background: var(--light-bg) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  font-family: var(--font-body) !important;
  font-size: 13.5px !important;
  color: var(--dark) !important;
  outline: none !important;
}
body.newsletter-validate-and-add-newsletter select#categoryForNewsletter option {
  padding: 7px 10px !important;
  border-radius: 4px !important;
  font-size: 13.5px !important;
  color: var(--dark) !important;
}
body.newsletter-validate-and-add-newsletter select#categoryForNewsletter option:checked {
  background: var(--rose) linear-gradient(0deg, var(--rose), var(--rose)) !important;
  color: var(--white) !important;
}
body.newsletter-validate-and-add-newsletter input#emailValidated {
  box-sizing: border-box !important;
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  height: 50px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  background: var(--light-bg) !important;
  background-image: none !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  font-family: var(--font-body) !important;
  font-size: 14.5px !important;
  line-height: 48px !important;
  color: var(--dark) !important;
  text-align: left !important;
  outline: none !important;
  transition: border-color .2s ease, box-shadow .2s ease !important;
}
body.newsletter-validate-and-add-newsletter select#categoryForNewsletter:focus,
body.newsletter-validate-and-add-newsletter input#emailValidated:focus {
  background: var(--white) !important;
  border-color: var(--rose) !important;
  box-shadow: 0 0 0 3px rgba(196,123,104,.16) !important;
}
/* pseudo-popis nad e-mailom (pole nemá vlastný label) */
body.newsletter-validate-and-add-newsletter .row:has(> .element > #emailValidated)::before {
  content: 'E-mailová adresa *' !important;
  display: block !important;
  margin: 0 0 8px !important;
  font-family: var(--font-body) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: var(--mid) !important;
}

/* ── captcha ── */
body.newsletter-validate-and-add-newsletter dt[id$="-label"] { display: none !important; }
body.newsletter-validate-and-add-newsletter dd[id$="-element"],
body.newsletter-validate-and-add-newsletter .g-recaptcha {
  display: block !important;
  box-sizing: border-box !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 0 22px !important;
  padding: 0 !important;
}
body.newsletter-validate-and-add-newsletter .row-captcha .element {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 7px !important;
  background: var(--light-bg) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
}
body.newsletter-validate-and-add-newsletter .row-captcha img {
  flex: 0 0 auto !important;
  display: block !important;
  width: auto !important;
  height: 46px !important;
  margin: 0 !important;
  border: 1px solid var(--border) !important;
  border-radius: 4px !important;
  background: var(--white) !important;
}

/* ── tlačidlo ── */
body.newsletter-validate-and-add-newsletter .buttons {
  display: block !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 4px 0 0 !important;
  padding: 0 !important;
  text-align: left !important;
}
body.newsletter-validate-and-add-newsletter #button-addValidatedNewsletter,
body.newsletter-validate-and-add-newsletter #button-addValidatedNewsletter.button-type-1 {
  display: block !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: var(--rose) !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: var(--radius-sm) !important;
  overflow: hidden !important;
  transition: background-color .2s ease !important;
}
body.newsletter-validate-and-add-newsletter #button-addValidatedNewsletter:hover { background: var(--rose-dark) !important; }
body.newsletter-validate-and-add-newsletter input#addValidatedNewsletter {
  display: block !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: var(--white) !important;
  -webkit-text-fill-color: var(--white) !important;
  cursor: pointer !important;
}

/* ── chyby ── */
body.newsletter-validate-and-add-newsletter ul.errors {
  margin: 8px 0 0 !important;
  padding: 0 !important;
  list-style: none !important;
  font-family: var(--font-body) !important;
  font-size: 12px !important;
  color: #C0392B !important;
}

@media screen and (min-width: 2000px) {
  body.newsletter-validate-and-add-newsletter div.content { max-width: 720px !important; }
  body.newsletter-validate-and-add-newsletter div.content::before { font-size: 38px !important; }
  body.newsletter-validate-and-add-newsletter input#emailValidated { height: 54px !important; line-height: 52px !important; }
  body.newsletter-validate-and-add-newsletter #button-addValidatedNewsletter,
  body.newsletter-validate-and-add-newsletter input#addValidatedNewsletter { height: 56px !important; }
}
@media screen and (max-width: 640px) {
  body.newsletter-validate-and-add-newsletter div.content { max-width: none !important; padding: 0 14px 44px !important; }
  body.newsletter-validate-and-add-newsletter #fieldset-validateNewsletterForm { padding: 22px 18px 24px !important; }
}
/* informačná hláška: ikona a text vedľa seba */
body.newsletter-validate-and-add-newsletter #info-block { display: block !important; }
body.newsletter-validate-and-add-newsletter #info-block p {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 11px !important;
  text-align: left !important;
}
body.newsletter-validate-and-add-newsletter .row:has(> .element > #emailValidated)::before {
  text-align: left !important;
}

/* =====================================================
   NEWSLETTER PÁS NAD PÄTIČKOU
   (pole aj tlačidlo pretekali cez celú šírku obrazovky)
   ===================================================== */
body #container-newsletter {
  box-sizing: border-box !important;
  text-align: center !important;
}
body #container-newsletter > p {
  display: block !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 20px !important;
  padding: 0 20px !important;
  font-family: var(--font-head) !important;
  font-size: 27px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  color: var(--white) !important;
  -webkit-text-fill-color: currentColor !important;
  text-align: center !important;
  text-shadow: 0 2px 12px rgba(0,0,0,.35) !important;
}
body #container-newsletter form,
body #container-newsletter .myform,
body #container-newsletter #fieldset-customerToNewsletter {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  max-width: 620px !important;
  height: auto !important;
  margin: 0 auto !important;
  padding: 0 20px !important;
  background: none !important;
  border: 0 !important;
}
body #container-newsletter #fieldset-customerToNewsletter .row,
body #container-newsletter #fieldset-customerToNewsletter .element {
  flex: 1 1 auto !important;
  display: block !important;
  box-sizing: border-box !important;
  float: none !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  position: static !important;
}
body #container-newsletter input#email {
  box-sizing: border-box !important;
  display: block !important;
  float: none !important;
  width: 100% !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  background: rgba(255,255,255,.95) !important;
  border: 1px solid rgba(255,255,255,.6) !important;
  border-radius: var(--radius-sm) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  line-height: 50px !important;
  color: var(--dark) !important;
  outline: none !important;
  transition: box-shadow .2s ease !important;
}
body #container-newsletter input#email:focus {
  background: var(--white) !important;
  box-shadow: 0 0 0 4px rgba(196,123,104,.35) !important;
}
body #container-newsletter #fieldset-customerToNewsletter .buttons {
  flex: 0 0 auto !important;
  display: block !important;
  box-sizing: border-box !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}
body #container-newsletter #button-addNewsletter,
body #container-newsletter #button-addNewsletter.button-type-1 {
  display: block !important;
  box-sizing: border-box !important;
  float: none !important;
  width: auto !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: var(--rose) !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: var(--radius-sm) !important;
  overflow: hidden !important;
  transition: background-color .2s ease !important;
}
body #container-newsletter #button-addNewsletter:hover { background: var(--rose-dark) !important; }
body #container-newsletter input#addNewsletter {
  display: block !important;
  box-sizing: border-box !important;
  float: none !important;
  width: auto !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 30px !important;
  background: none !important;
  border: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  color: var(--white) !important;
  -webkit-text-fill-color: var(--white) !important;
  cursor: pointer !important;
}

@media screen and (min-width: 2000px) {
  body #container-newsletter > p { font-size: 31px !important; }
}
@media screen and (max-width: 640px) {
  body #container-newsletter #fieldset-customerToNewsletter { flex-wrap: wrap !important; }
  body #container-newsletter #fieldset-customerToNewsletter .buttons,
  body #container-newsletter #button-addNewsletter,
  body #container-newsletter input#addNewsletter { width: 100% !important; }
}

/* =====================================================
   MARKETINGOVÉ BOXY NA ÚVODNEJ (#image-and-text-grid)
   Masonry ich ukladal absolútne a nerovnako vysoko;
   prázdne obrázkové boxy zaberali miesto.
   ===================================================== */
body #image-and-text-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-auto-rows: 1fr !important;
  gap: 24px !important;
  box-sizing: border-box !important;
  position: static !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 10px 0 40px !important;
  padding: 0 !important;
  counter-reset: mkbox;
}
/* prázdne (obrázkové) boxy bez obsahu preč */
body #image-and-text-grid .image-and-text-grid-item-with-image:not(:has(img)) {
  display: none !important;
}
body #image-and-text-grid .image-and-text-grid-item {
  display: flex !important;
  position: relative !important;
  top: auto !important;
  left: auto !important;
  box-sizing: border-box !important;
  float: none !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 210px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow-sm) !important;
  overflow: hidden !important;
  counter-increment: mkbox;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease !important;
}
body #image-and-text-grid .image-and-text-grid-item:hover {
  transform: translateY(-4px) !important;
  border-color: var(--rose) !important;
  box-shadow: var(--shadow-md) !important;
}
/* jemný ružový prúžok navrchu */
body #image-and-text-grid .image-and-text-grid-item::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 3px !important;
  background: var(--rose) !important;
  transform: scaleX(0) !important;
  transform-origin: left center !important;
  transition: transform .3s cubic-bezier(.4,0,.2,1) !important;
  z-index: 2 !important;
}
body #image-and-text-grid .image-and-text-grid-item:hover::before { transform: scaleX(1) !important; }

/* odkaz = celá karta */
body #image-and-text-grid .image-and-text-grid-item > a {
  display: flex !important;
  flex-direction: column !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 30px 26px 26px !important;
  text-decoration: none !important;
  position: static !important;
}
/* číslo boxu */
body #image-and-text-grid .image-and-text-grid-item > a::before {
  content: counter(mkbox, decimal-leading-zero) !important;
  display: inline-block !important;
  align-self: center !important;
  margin: 0 0 14px !important;
  padding: 3px 10px !important;
  background: var(--rose-light) !important;
  border-radius: 100px !important;
  font-family: var(--font-body) !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  color: var(--rose-dark) !important;
  transition: background-color .2s ease, color .2s ease !important;
}
body #image-and-text-grid .image-and-text-grid-item:hover > a::before {
  background: var(--rose) !important;
  color: #fff !important;
}
/* "Viac" dole */
body #image-and-text-grid .image-and-text-grid-item > a::after {
  content: 'Viac →' !important;
  display: block !important;
  margin: auto 0 0 !important;
  padding-top: 18px !important;
  font-family: var(--font-body) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: .04em !important;
  color: var(--rose-dark) !important;
  text-align: center !important;
  opacity: 0 !important;
  transform: translateY(4px) !important;
  transition: opacity .22s ease, transform .22s ease !important;
}
body #image-and-text-grid .image-and-text-grid-item:hover > a::after {
  opacity: 1 !important;
  transform: translateY(0) !important;
}
/* text */
body #image-and-text-grid .image-and-text-grid-item p {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}
body #image-and-text-grid .image-and-text-grid-item p span:first-child {
  display: block !important;
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: var(--font-head) !important;
  font-size: 22px !important;
  font-weight: 600 !important;
  letter-spacing: .01em !important;
  line-height: 1.25 !important;
  color: var(--charcoal) !important;
  -webkit-text-fill-color: currentColor !important;
  text-align: center !important;
  text-transform: none !important;
}
body #image-and-text-grid .image-and-text-grid-item p span:nth-child(2) {
  display: block !important;
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 13.5px !important;
  line-height: 1.65 !important;
  color: var(--mid) !important;
  -webkit-text-fill-color: currentColor !important;
  text-align: center !important;
}

@media screen and (max-width: 1000px) {
  body #image-and-text-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media screen and (max-width: 680px) {
  body #image-and-text-grid { grid-template-columns: 1fr !important; gap: 16px !important; }
  body #image-and-text-grid .image-and-text-grid-item { min-height: 0 !important; }
}
/* Masonry posúva boxy cez transform — v mriežke to nechceme */
body #image-and-text-grid .image-and-text-grid-item {
  transform: none !important;
}
body #image-and-text-grid .image-and-text-grid-item:hover {
  transform: translateY(-4px) !important;
}

/* =====================================================
   ÚVODNÁ STRÁNKA — slidery produktov
   (Produkty odporúčané priamo pre Vás, Akcia)
   ===================================================== */
body #products-recommended-just-for-customer,
body .products-on-index-in-slider {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  margin: 0 0 38px !important;
  padding: 0 !important;
}
body #products-recommended-just-for-customer .slick-list,
body .products-on-index-in-slider .slick-list {
  padding: 10px 0 16px !important;
  margin: 0 !important;
  overflow: hidden !important;
}
body #products-recommended-just-for-customer .slick-track,
body .products-on-index-in-slider .slick-track {
  display: flex !important;
  align-items: stretch !important;
  margin: 0 auto !important;
}
body #products-recommended-just-for-customer .slick-slide,
body .products-on-index-in-slider .slick-slide {
  height: auto !important;
  float: none !important;
  flex: 0 0 auto !important;
}

/* ── karta je zároveň slide → vizuál do ::before kvôli medzerám ── */
body #products-recommended-just-for-customer .product-third,
body .products-on-index-in-slider .product-third {
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
  box-sizing: border-box !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 10px !important;
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
  transition: transform .25s ease !important;
}
body #products-recommended-just-for-customer .product-third::before,
body .products-on-index-in-slider .product-third::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 10px !important;
  right: 10px !important;
  z-index: 0 !important;
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: 0 2px 12px rgba(0,0,0,.06) !important;
  transition: border-color .25s ease, box-shadow .25s ease !important;
}
body #products-recommended-just-for-customer .product-third > *,
body .products-on-index-in-slider .product-third > * {
  position: relative !important;
  z-index: 1 !important;
}
body #products-recommended-just-for-customer .product-third:hover,
body .products-on-index-in-slider .product-third:hover {
  transform: translateY(-4px) !important;
}
body #products-recommended-just-for-customer .product-third:hover::before,
body .products-on-index-in-slider .product-third:hover::before {
  border-color: var(--rose) !important;
  box-shadow: 0 14px 32px rgba(196,123,104,.20) !important;
}

/* ── obrázok ── */
body #products-recommended-just-for-customer .product-third .product-images,
body .products-on-index-in-slider .product-third .product-images {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: 240px !important;
  margin: 0 !important;
  padding: 16px !important;
  background: var(--light-bg) !important;
  border-radius: var(--radius) var(--radius) 0 0 !important;
  overflow: hidden !important;
}
body #products-recommended-just-for-customer .product-third .product-images > a,
body .products-on-index-in-slider .product-third .product-images > a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  float: none !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
body #products-recommended-just-for-customer .product-third .product-images picture,
body .products-on-index-in-slider .product-third .product-images picture {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
}
body #products-recommended-just-for-customer .product-third .product-images img,
body .products-on-index-in-slider .product-third .product-images img {
  display: block !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 206px !important;
  margin: 0 auto !important;
  object-fit: contain !important;
  mix-blend-mode: multiply !important;
}

/* ── štítky ── */
body #products-recommended-just-for-customer .container-product-actions,
body .products-on-index-in-slider .container-product-actions {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 6px !important;
  position: absolute !important;
  top: 12px !important;
  left: 22px !important;
  right: auto !important;
  z-index: 3 !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
}
body #products-recommended-just-for-customer .container-product-actions > div,
body .products-on-index-in-slider .container-product-actions > div {
  display: inline-flex !important;
  align-items: center !important;
  box-sizing: border-box !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 5px 11px !important;
  background: var(--charcoal) !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 100px !important;
  box-shadow: 0 3px 10px rgba(0,0,0,.18) !important;
  font-family: var(--font-body) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  line-height: 1.3 !important;
  text-transform: uppercase !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  white-space: nowrap !important;
}
body #products-recommended-just-for-customer .container-product-actions > div span,
body .products-on-index-in-slider .container-product-actions > div span {
  display: inline !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  font: inherit !important;
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
  letter-spacing: inherit !important;
  text-transform: inherit !important;
}
body #products-recommended-just-for-customer .container-product-actions > div.action,
body .products-on-index-in-slider .container-product-actions > div.action { background: var(--rose) !important; }
body #products-recommended-just-for-customer .container-product-actions > div.clear,
body .products-on-index-in-slider .container-product-actions > div.clear {
  background: var(--rose-dark) !important;
  font-size: 12px !important;
}
body #products-recommended-just-for-customer .container-product-actions > div.empty,
body .products-on-index-in-slider .container-product-actions > div.empty { display: none !important; }

/* ── obsah karty ── */
body #products-recommended-just-for-customer .product-third .product-content,
body .products-on-index-in-slider .product-third .product-content {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 18px 18px 20px !important;
  background: none !important;
}
body #products-recommended-just-for-customer .product-third .product-content h4,
body .products-on-index-in-slider .product-third .product-content h4 {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
}
body #products-recommended-just-for-customer .product-third .product-content h4 a,
body .products-on-index-in-slider .product-third .product-content h4 a {
  display: -webkit-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: var(--font-head) !important;
  font-size: 19px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  color: var(--charcoal) !important;
  -webkit-text-fill-color: currentColor !important;
  text-align: center !important;
  text-decoration: none !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  transition: color .2s ease !important;
}
body #products-recommended-just-for-customer .product-third .product-content h4 a:hover,
body .products-on-index-in-slider .product-third .product-content h4 a:hover { color: var(--rose-dark) !important; }

body #products-recommended-just-for-customer .product-third .catalog-delivery_name,
body .products-on-index-in-slider .product-third .catalog-delivery_name {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  color: #2f7d4f !important;
  -webkit-text-fill-color: currentColor !important;
  text-align: center !important;
}
body #products-recommended-just-for-customer .product-third .catalog-delivery_name:empty,
body .products-on-index-in-slider .product-third .catalog-delivery_name:empty { display: none !important; }

body #products-recommended-just-for-customer .product-third .product-content-description,
body .products-on-index-in-slider .product-third .product-content-description {
  display: -webkit-box !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 12.5px !important;
  line-height: 1.6 !important;
  color: var(--mid) !important;
  -webkit-text-fill-color: currentColor !important;
  text-align: center !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
body #products-recommended-just-for-customer .product-third .show-appurtenances:empty,
body #products-recommended-just-for-customer .product-third p.catalog-free-delivery-info:empty,
body .products-on-index-in-slider .product-third .show-appurtenances:empty,
body .products-on-index-in-slider .product-third p.catalog-free-delivery-info:empty { display: none !important; }

/* ── cena ── */
body #products-recommended-just-for-customer .product-third p.price,
body .products-on-index-in-slider .product-third p.price {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 1px !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: auto 0 0 !important;
  padding: 12px 0 0 !important;
  border-top: 1px solid var(--border) !important;
  text-align: center !important;
}
body #products-recommended-just-for-customer .product-third p.price .old_price,
body .products-on-index-in-slider .product-third p.price .old_price {
  display: block !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  color: var(--text-light, #a0aec0) !important;
  -webkit-text-fill-color: currentColor !important;
  text-decoration: line-through !important;
}
body #products-recommended-just-for-customer .product-third p.price .normal_price,
body .products-on-index-in-slider .product-third p.price .normal_price {
  display: block !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 19px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  font-variant-numeric: tabular-nums !important;
  color: var(--charcoal) !important;
  -webkit-text-fill-color: currentColor !important;
  white-space: nowrap !important;
}
body #products-recommended-just-for-customer .product-third p.price .s-dph,
body .products-on-index-in-slider .product-third p.price .s-dph {
  font-size: 10.5px !important;
  font-weight: 500 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  color: var(--mid) !important;
  -webkit-text-fill-color: currentColor !important;
  margin-left: 5px !important;
}

/* ── tlačidlo do košíka ── */
body #products-recommended-just-for-customer .product-third .add-cart-catalog,
body .products-on-index-in-slider .product-third .add-cart-catalog {
  display: block !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 12px 0 0 !important;
  padding: 0 !important;
}
body #products-recommended-just-for-customer .product-third .add-cart-catalog form,
body #products-recommended-just-for-customer .product-third .add-cart-catalog fieldset,
body .products-on-index-in-slider .product-third .add-cart-catalog form,
body .products-on-index-in-slider .product-third .add-cart-catalog fieldset {
  display: block !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
}
body #products-recommended-just-for-customer .product-third .button-add-cart-button,
body .products-on-index-in-slider .product-third .button-add-cart-button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: var(--charcoal) !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: var(--radius-sm) !important;
  overflow: hidden !important;
  transition: background-color .2s ease !important;
}
body #products-recommended-just-for-customer .product-third .button-add-cart-button:hover,
body .products-on-index-in-slider .product-third .button-add-cart-button:hover { background: var(--rose) !important; }
body #products-recommended-just-for-customer .product-third .add-cart-button,
body .products-on-index-in-slider .product-third .add-cart-button {
  display: block !important;
  box-sizing: border-box !important;
  float: none !important;
  width: auto !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .02em !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  cursor: pointer !important;
}

@media screen and (min-width: 2000px) {
  body #products-recommended-just-for-customer .product-third .product-images,
  body .products-on-index-in-slider .product-third .product-images { height: 265px !important; }
  body #products-recommended-just-for-customer .product-third .product-images img,
  body .products-on-index-in-slider .product-third .product-images img { max-height: 230px !important; }
}
@media screen and (max-width: 640px) {
  body #products-recommended-just-for-customer .product-third,
  body .products-on-index-in-slider .product-third { padding: 0 6px !important; }
  body #products-recommended-just-for-customer .product-third::before,
  body .products-on-index-in-slider .product-third::before { left: 6px !important; right: 6px !important; }
}

/* =====================================================
   ÚVODNÁ STRÁNKA — slidery produktov (varianta .product-second)
   (Produkty odporúčané priamo pre Vás, Akcia)
   ===================================================== */
body #products-recommended-just-for-customer,
body .products-on-index-in-slider {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  margin: 0 0 38px !important;
  padding: 0 !important;
}
body #products-recommended-just-for-customer .slick-list,
body .products-on-index-in-slider .slick-list {
  padding: 10px 0 16px !important;
  margin: 0 !important;
  overflow: hidden !important;
}
body #products-recommended-just-for-customer .slick-track,
body .products-on-index-in-slider .slick-track {
  display: flex !important;
  align-items: stretch !important;
  margin: 0 auto !important;
}
body #products-recommended-just-for-customer .slick-slide,
body .products-on-index-in-slider .slick-slide {
  height: auto !important;
  float: none !important;
  flex: 0 0 auto !important;
}

/* ── karta je zároveň slide → vizuál do ::before kvôli medzerám ── */
body #products-recommended-just-for-customer .product-second,
body .products-on-index-in-slider .product-second {
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
  box-sizing: border-box !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 10px !important;
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
  transition: transform .25s ease !important;
}
body #products-recommended-just-for-customer .product-second::before,
body .products-on-index-in-slider .product-second::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 10px !important;
  right: 10px !important;
  z-index: 0 !important;
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: 0 2px 12px rgba(0,0,0,.06) !important;
  transition: border-color .25s ease, box-shadow .25s ease !important;
}
body #products-recommended-just-for-customer .product-second > *,
body .products-on-index-in-slider .product-second > * {
  position: relative !important;
  z-index: 1 !important;
}
body #products-recommended-just-for-customer .product-second:hover,
body .products-on-index-in-slider .product-second:hover {
  transform: translateY(-4px) !important;
}
body #products-recommended-just-for-customer .product-second:hover::before,
body .products-on-index-in-slider .product-second:hover::before {
  border-color: var(--rose) !important;
  box-shadow: 0 14px 32px rgba(196,123,104,.20) !important;
}

/* ── obrázok ── */
body #products-recommended-just-for-customer .product-second .product-images,
body .products-on-index-in-slider .product-second .product-images {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: 240px !important;
  margin: 0 !important;
  padding: 16px !important;
  background: var(--light-bg) !important;
  border-radius: var(--radius) var(--radius) 0 0 !important;
  overflow: hidden !important;
}
body #products-recommended-just-for-customer .product-second .product-images > a,
body .products-on-index-in-slider .product-second .product-images > a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  float: none !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
body #products-recommended-just-for-customer .product-second .product-images picture,
body .products-on-index-in-slider .product-second .product-images picture {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
}
body #products-recommended-just-for-customer .product-second .product-images img,
body .products-on-index-in-slider .product-second .product-images img {
  display: block !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 206px !important;
  margin: 0 auto !important;
  object-fit: contain !important;
  mix-blend-mode: multiply !important;
}

/* ── štítky ── */
body #products-recommended-just-for-customer .container-product-actions,
body .products-on-index-in-slider .container-product-actions {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 6px !important;
  position: absolute !important;
  top: 12px !important;
  left: 22px !important;
  right: auto !important;
  z-index: 3 !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
}
body #products-recommended-just-for-customer .container-product-actions > div,
body .products-on-index-in-slider .container-product-actions > div {
  display: inline-flex !important;
  align-items: center !important;
  box-sizing: border-box !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 5px 11px !important;
  background: var(--charcoal) !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 100px !important;
  box-shadow: 0 3px 10px rgba(0,0,0,.18) !important;
  font-family: var(--font-body) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  line-height: 1.3 !important;
  text-transform: uppercase !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  white-space: nowrap !important;
}
body #products-recommended-just-for-customer .container-product-actions > div span,
body .products-on-index-in-slider .container-product-actions > div span {
  display: inline !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  font: inherit !important;
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
  letter-spacing: inherit !important;
  text-transform: inherit !important;
}
body #products-recommended-just-for-customer .container-product-actions > div.action,
body .products-on-index-in-slider .container-product-actions > div.action { background: var(--rose) !important; }
body #products-recommended-just-for-customer .container-product-actions > div.clear,
body .products-on-index-in-slider .container-product-actions > div.clear {
  background: var(--rose-dark) !important;
  font-size: 12px !important;
}
body #products-recommended-just-for-customer .container-product-actions > div.empty,
body .products-on-index-in-slider .container-product-actions > div.empty { display: none !important; }

/* ── obsah karty ── */
body #products-recommended-just-for-customer .product-second .product-content,
body .products-on-index-in-slider .product-second .product-content {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 18px 18px 20px !important;
  background: none !important;
}
body #products-recommended-just-for-customer .product-second .product-content h4,
body .products-on-index-in-slider .product-second .product-content h4 {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
}
body #products-recommended-just-for-customer .product-second .product-content h4 a,
body .products-on-index-in-slider .product-second .product-content h4 a {
  display: -webkit-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: var(--font-head) !important;
  font-size: 19px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  color: var(--charcoal) !important;
  -webkit-text-fill-color: currentColor !important;
  text-align: center !important;
  text-decoration: none !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  transition: color .2s ease !important;
}
body #products-recommended-just-for-customer .product-second .product-content h4 a:hover,
body .products-on-index-in-slider .product-second .product-content h4 a:hover { color: var(--rose-dark) !important; }

body #products-recommended-just-for-customer .product-second .catalog-delivery_name,
body .products-on-index-in-slider .product-second .catalog-delivery_name {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  color: #2f7d4f !important;
  -webkit-text-fill-color: currentColor !important;
  text-align: center !important;
}
body #products-recommended-just-for-customer .product-second .catalog-delivery_name:empty,
body .products-on-index-in-slider .product-second .catalog-delivery_name:empty { display: none !important; }

body #products-recommended-just-for-customer .product-second .product-content-description,
body .products-on-index-in-slider .product-second .product-content-description {
  display: -webkit-box !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 12.5px !important;
  line-height: 1.6 !important;
  color: var(--mid) !important;
  -webkit-text-fill-color: currentColor !important;
  text-align: center !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
body #products-recommended-just-for-customer .product-second .show-appurtenances:empty,
body #products-recommended-just-for-customer .product-second p.catalog-free-delivery-info:empty,
body .products-on-index-in-slider .product-second .show-appurtenances:empty,
body .products-on-index-in-slider .product-second p.catalog-free-delivery-info:empty { display: none !important; }

/* ── cena ── */
body #products-recommended-just-for-customer .product-second p.price,
body .products-on-index-in-slider .product-second p.price {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 1px !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: auto 0 0 !important;
  padding: 12px 0 0 !important;
  border-top: 1px solid var(--border) !important;
  text-align: center !important;
}
body #products-recommended-just-for-customer .product-second p.price .old_price,
body .products-on-index-in-slider .product-second p.price .old_price {
  display: block !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  color: var(--text-light, #a0aec0) !important;
  -webkit-text-fill-color: currentColor !important;
  text-decoration: line-through !important;
}
body #products-recommended-just-for-customer .product-second p.price .normal_price,
body .products-on-index-in-slider .product-second p.price .normal_price {
  display: block !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 19px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  font-variant-numeric: tabular-nums !important;
  color: var(--charcoal) !important;
  -webkit-text-fill-color: currentColor !important;
  white-space: nowrap !important;
}
body #products-recommended-just-for-customer .product-second p.price .s-dph,
body .products-on-index-in-slider .product-second p.price .s-dph {
  font-size: 10.5px !important;
  font-weight: 500 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  color: var(--mid) !important;
  -webkit-text-fill-color: currentColor !important;
  margin-left: 5px !important;
}

/* ── tlačidlo do košíka ── */
body #products-recommended-just-for-customer .product-second .add-cart-catalog,
body .products-on-index-in-slider .product-second .add-cart-catalog {
  display: block !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 12px 0 0 !important;
  padding: 0 !important;
}
body #products-recommended-just-for-customer .product-second .add-cart-catalog form,
body #products-recommended-just-for-customer .product-second .add-cart-catalog fieldset,
body .products-on-index-in-slider .product-second .add-cart-catalog form,
body .products-on-index-in-slider .product-second .add-cart-catalog fieldset {
  display: block !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
}
body #products-recommended-just-for-customer .product-second .button-add-cart-button,
body .products-on-index-in-slider .product-second .button-add-cart-button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: var(--charcoal) !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: var(--radius-sm) !important;
  overflow: hidden !important;
  transition: background-color .2s ease !important;
}
body #products-recommended-just-for-customer .product-second .button-add-cart-button:hover,
body .products-on-index-in-slider .product-second .button-add-cart-button:hover { background: var(--rose) !important; }
body #products-recommended-just-for-customer .product-second .add-cart-button,
body .products-on-index-in-slider .product-second .add-cart-button {
  display: block !important;
  box-sizing: border-box !important;
  float: none !important;
  width: auto !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .02em !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  cursor: pointer !important;
}

@media screen and (min-width: 2000px) {
  body #products-recommended-just-for-customer .product-second .product-images,
  body .products-on-index-in-slider .product-second .product-images { height: 265px !important; }
  body #products-recommended-just-for-customer .product-second .product-images img,
  body .products-on-index-in-slider .product-second .product-images img { max-height: 230px !important; }
}
@media screen and (max-width: 640px) {
  body #products-recommended-just-for-customer .product-second,
  body .products-on-index-in-slider .product-second { padding: 0 6px !important; }
  body #products-recommended-just-for-customer .product-second::before,
  body .products-on-index-in-slider .product-second::before { left: 6px !important; right: 6px !important; }
}
/* parametre (Rozmer a pod.) v kartách na úvodnej */
body #products-recommended-just-for-customer .show-appurtenances,
body #products-recommended-just-for-customer .appurtenances,
body #products-recommended-just-for-customer .appurtenances-value,
body .products-on-index-in-slider .show-appurtenances,
body .products-on-index-in-slider .appurtenances,
body .products-on-index-in-slider .appurtenances-value {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  color: var(--mid) !important;
  -webkit-text-fill-color: currentColor !important;
  text-align: center !important;
}
body #products-recommended-just-for-customer .show-appurtenances,
body .products-on-index-in-slider .show-appurtenances { margin-bottom: 6px !important; }

/* =====================================================
   "Náhľad produktu" pri hoveri posúval obsah kariet
   → z prvku v toku spravíme prekryv nad fotkou
   ===================================================== */
body #products-recommended-just-for-customer .product-catalog-insight-hover,
body .products-on-index-in-slider .product-catalog-insight-hover {
  position: absolute !important;
  top: 0 !important;
  left: 10px !important;
  right: 10px !important;
  bottom: auto !important;
  z-index: 4 !important;
  box-sizing: border-box !important;
  float: none !important;
  width: auto !important;
  height: 240px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: rgba(26,26,26,.45) !important;
  border-radius: var(--radius) var(--radius) 0 0 !important;
  font-family: var(--font-body) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: .1em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  text-align: center !important;
  cursor: pointer !important;
}
body #products-recommended-just-for-customer .product-second:hover .product-catalog-insight-hover,
body #products-recommended-just-for-customer .product-third:hover .product-catalog-insight-hover,
body .products-on-index-in-slider .product-second:hover .product-catalog-insight-hover,
body .products-on-index-in-slider .product-third:hover .product-catalog-insight-hover {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
body #products-recommended-just-for-customer .product-catalog-insight,
body .products-on-index-in-slider .product-catalog-insight {
  position: absolute !important;
  height: 0 !important;
  overflow: hidden !important;
}
@media screen and (min-width: 2000px) {
  body #products-recommended-just-for-customer .product-catalog-insight-hover,
  body .products-on-index-in-slider .product-catalog-insight-hover { height: 265px !important; }
}
/* ============================================================
   NASEPTAVAC VO VYHLADAVANI - polozky s fotkou a cenou
   ============================================================ */
body .ui-autocomplete.mh-search-suggest {
  padding: 8px !important;
}
body .ui-autocomplete.mh-search-suggest li.mh-suggest-item {
  margin: 0 !important;
  border: 0 !important;
  border-radius: var(--radius) !important;
  overflow: hidden !important;
}
body .ui-autocomplete.mh-search-suggest li.mh-suggest-item + li.mh-suggest-item {
  border-top: 1px solid var(--border) !important;
  border-radius: 0 !important;
}
body .ui-autocomplete.mh-search-suggest li.mh-suggest-item > .ui-menu-item-wrapper {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 9px 12px !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--charcoal) !important;
  -webkit-text-fill-color: currentColor !important;
  border-radius: var(--radius-sm) !important;
  transition: background .18s ease, color .18s ease !important;
}
body .ui-autocomplete.mh-search-suggest .mh-suggest-thumb {
  flex: 0 0 52px !important;
  width: 52px !important;
  height: 52px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: var(--light-bg) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  overflow: hidden !important;
  padding: 4px !important;
  box-sizing: border-box !important;
}
body .ui-autocomplete.mh-search-suggest .mh-suggest-thumb img {
  max-width: 100% !important;
  max-height: 100% !important;
  width: auto !important;
  height: auto !important;
  display: block !important;
  mix-blend-mode: multiply !important;
}
body .ui-autocomplete.mh-search-suggest .mh-suggest-info {
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
}
body .ui-autocomplete.mh-search-suggest .mh-suggest-name {
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  color: var(--charcoal) !important;
  -webkit-text-fill-color: currentColor !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
body .ui-autocomplete.mh-search-suggest .mh-suggest-price {
  font-family: var(--font-head) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  color: var(--rose) !important;
  -webkit-text-fill-color: currentColor !important;
  white-space: nowrap !important;
}
/* ceny vyrenderovane helperom - potlacime jeho vlastne rozlozenie */
body .ui-autocomplete.mh-search-suggest .mh-suggest-price * {
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
  background: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  float: none !important;
  display: inline !important;
  line-height: inherit !important;
  width: auto !important;
  height: auto !important;
}
body .ui-autocomplete.mh-search-suggest .mh-suggest-price br {
  display: none !important;
}
body .ui-autocomplete.mh-search-suggest .mh-suggest-price .old-price,
body .ui-autocomplete.mh-search-suggest .mh-suggest-price .price-old,
body .ui-autocomplete.mh-search-suggest .mh-suggest-price s {
  display: inline !important;
  margin-left: 6px !important;
  font-size: 12px !important;
  color: var(--text-light, #a0aec0) !important;
  text-decoration: line-through !important;
}
/* hover / focus */
body .ui-autocomplete.mh-search-suggest li.mh-suggest-item > .ui-menu-item-wrapper.ui-state-active,
body .ui-autocomplete.mh-search-suggest li.mh-suggest-item > .ui-menu-item-wrapper:hover {
  background: var(--rose) !important;
  color: #fff !important;
}
body .ui-autocomplete.mh-search-suggest li.mh-suggest-item > .ui-menu-item-wrapper.ui-state-active .mh-suggest-name,
body .ui-autocomplete.mh-search-suggest li.mh-suggest-item > .ui-menu-item-wrapper:hover .mh-suggest-name,
body .ui-autocomplete.mh-search-suggest li.mh-suggest-item > .ui-menu-item-wrapper.ui-state-active .mh-suggest-price,
body .ui-autocomplete.mh-search-suggest li.mh-suggest-item > .ui-menu-item-wrapper:hover .mh-suggest-price,
body .ui-autocomplete.mh-search-suggest li.mh-suggest-item > .ui-menu-item-wrapper.ui-state-active .mh-suggest-price *,
body .ui-autocomplete.mh-search-suggest li.mh-suggest-item > .ui-menu-item-wrapper:hover .mh-suggest-price * {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}
body .ui-autocomplete.mh-search-suggest li.mh-suggest-item > .ui-menu-item-wrapper.ui-state-active .mh-suggest-thumb,
body .ui-autocomplete.mh-search-suggest li.mh-suggest-item > .ui-menu-item-wrapper:hover .mh-suggest-thumb {
  background: #fff !important;
  border-color: rgba(255,255,255,.6) !important;
}
/* posledna polozka - Zobrazit vsetky vysledky */
body .ui-autocomplete.mh-search-suggest li.mh-suggest-all {
  margin-top: 6px !important;
  border-top: 1px solid var(--border) !important;
  border-radius: 0 0 var(--radius-sm) var(--radius-sm) !important;
}
body .ui-autocomplete.mh-search-suggest li.mh-suggest-all > .ui-menu-item-wrapper {
  display: block !important;
  text-align: center !important;
  padding: 11px 12px !important;
  font-family: var(--font-head) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: .2px !important;
  color: var(--rose) !important;
  -webkit-text-fill-color: currentColor !important;
}
body .ui-autocomplete.mh-search-suggest li.mh-suggest-all > .ui-menu-item-wrapper.ui-state-active,
body .ui-autocomplete.mh-search-suggest li.mh-suggest-all > .ui-menu-item-wrapper:hover {
  background: var(--rose-light) !important;
  color: var(--rose-dark) !important;
}
/* cena: pôvodná a akciová od seba */
body .ui-autocomplete.mh-search-suggest .mh-suggest-price .old_price {
  display: inline !important;
  margin-right: 8px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--text-light, #a0aec0) !important;
  -webkit-text-fill-color: currentColor !important;
  text-decoration: line-through !important;
}
body .ui-autocomplete.mh-search-suggest .mh-suggest-price .normal_price {
  color: var(--charcoal) !important;
  -webkit-text-fill-color: currentColor !important;
}
body .ui-autocomplete.mh-search-suggest .mh-suggest-price .s-dph {
  margin-left: 4px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  color: var(--mid) !important;
  -webkit-text-fill-color: currentColor !important;
}
body .ui-autocomplete.mh-search-suggest li.mh-suggest-item > .ui-menu-item-wrapper.ui-state-active .mh-suggest-price .old_price,
body .ui-autocomplete.mh-search-suggest li.mh-suggest-item > .ui-menu-item-wrapper:hover .mh-suggest-price .old_price,
body .ui-autocomplete.mh-search-suggest li.mh-suggest-item > .ui-menu-item-wrapper.ui-state-active .mh-suggest-price .s-dph,
body .ui-autocomplete.mh-search-suggest li.mh-suggest-item > .ui-menu-item-wrapper:hover .mh-suggest-price .s-dph {
  color: rgba(255,255,255,.78) !important;
  -webkit-text-fill-color: rgba(255,255,255,.78) !important;
}

/* =====================================================
   DARČEKOVÉ BALENIE / PRÍPLATKOVÉ PARAMETRE NA DETAILE
   (skript im nastavuje pevnú výšku, popis s cenou preto
    prečnieval cez spodný rám dlaždice)
   ===================================================== */
body .payoff-param-product-select-row,
body #product-detail .param-product-select-row,
body .param-product-select-row {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 0 18px !important;
}
body .payoff-param-product-select-row .param-product-select-row-1,
body .param-product-select-row .param-product-select-row-1 {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  line-height: 1.3 !important;
  text-transform: uppercase !important;
  color: var(--mid) !important;
  -webkit-text-fill-color: currentColor !important;
}
body .payoff-param-product-select-row .param-product-select-row-2,
body .param-product-select-row .param-product-select-row-2 {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  gap: 10px !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}
/* jedna dlaždica možnosti */
body .payoff-param-product-select-row .param-product-select-row-2 > div,
body .param-product-select-row .param-product-select-row-2 > div {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  box-sizing: border-box !important;
  position: relative !important;
  float: none !important;
  width: auto !important;
  min-width: 0 !important;
  flex: 1 1 130px !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 12px 10px !important;
  background: var(--white) !important;
  border: 1.5px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  cursor: pointer !important;
  overflow: visible !important;
  transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease !important;
}
body .payoff-param-product-select-row .param-product-select-row-2 > div:hover,
body .param-product-select-row .param-product-select-row-2 > div:hover {
  border-color: var(--rose) !important;
  box-shadow: 0 4px 14px rgba(196,123,104,.16) !important;
}
/* vybraná možnosť */
body .payoff-param-product-select-row .param-product-select-row-2 > div.param-product-select-row-active,
body .param-product-select-row .param-product-select-row-2 > div.param-product-select-row-active {
  border-color: var(--rose) !important;
  background: var(--rose-light) !important;
  box-shadow: 0 0 0 3px rgba(196,123,104,.18) !important;
}
body .payoff-param-product-select-row .param-product-select-row-2 > div img,
body .param-product-select-row .param-product-select-row-2 > div img {
  display: block !important;
  float: none !important;
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: 74px !important;
  margin: 0 !important;
  padding: 0 !important;
  mix-blend-mode: multiply !important;
}
body .payoff-param-product-select-row .param-product-select-row-2 > div p,
body .param-product-select-row .param-product-select-row-2 > div p {
  display: block !important;
  position: static !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 11.5px !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  color: var(--dark) !important;
  -webkit-text-fill-color: currentColor !important;
  text-align: center !important;
  word-break: break-word !important;
}
/* ikonka otáznika s popisom */
body .param-product-select-row-2 p.icon-cart-question {
  position: absolute !important;
  top: 6px !important;
  right: 6px !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
}

/* otázka na predajcu v detaile — textarea bola nalepená na pole Telefón */
body #fieldset-send_for_seller_detail_textarea {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  margin: 12px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
body #fieldset-send_for_seller_detail_textarea .row,
body #fieldset-send_for_seller_detail_textarea .element {
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
body #fieldset-send_for_seller_detail_textarea textarea {
  box-sizing: border-box !important;
  display: block !important;
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
}
body #fieldset-send_for_seller_detail_captcha {
  margin: 12px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* =====================================================
   Košík — hláška "Máte nárok na dopravu zadarmo."
   ===================================================== */
body #renderFreeDelivery { margin: 0 0 14px !important; padding: 0 !important; }
body #renderFreeDelivery .info-price,
body .cart-summary-card .info-price {
  display: flex !important;
  align-items: center !important;
  gap: 11px !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 13px 14px !important;
  background: #eaf6ee !important;
  background-image: none !important;
  border: 1px solid #cfe8d8 !important;
  border-radius: var(--radius-sm) !important;
}
body #renderFreeDelivery .info-price span[class^="icon-"],
body .cart-summary-card .info-price span[class^="icon-"] {
  flex: 0 0 auto !important;
  display: block !important;
  float: none !important;
  width: 22px !important;
  height: 22px !important;
  margin: 0 !important;
  padding: 0 !important;
  background-color: #2f8f52 !important;
  background-image: none !important;
  -webkit-mask: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm-1.2 14.6-4.2-4.2 1.4-1.4 2.8 2.8 5.8-5.8 1.4 1.4-7.2 7.2Z'/%3E%3C/svg%3E") no-repeat center / contain !important;
          mask: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm-1.2 14.6-4.2-4.2 1.4-1.4 2.8 2.8 5.8-5.8 1.4 1.4-7.2 7.2Z'/%3E%3C/svg%3E") no-repeat center / contain !important;
}
body #renderFreeDelivery .info-price p,
body .cart-summary-card .info-price p {
  flex: 1 1 auto !important;
  display: block !important;
  box-sizing: border-box !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  color: #1f6b3c !important;
  -webkit-text-fill-color: currentColor !important;
  text-align: left !important;
}
/* varianta "do dopravy zadarmo chýba …" (bez nároku) */
body #renderFreeDelivery .info-price:not(.free-price-bg) {
  background: var(--rose-light) !important;
  border-color: rgba(196,123,104,.35) !important;
}
body #renderFreeDelivery .info-price:not(.free-price-bg) span[class^="icon-"] {
  background-color: var(--rose-dark) !important;
  -webkit-mask: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 8h-3V6a2 2 0 0 0-2-2H3a2 2 0 0 0-2 2v11h2a3 3 0 0 0 6 0h6a3 3 0 0 0 6 0h2v-5l-3-4ZM6 18.5A1.5 1.5 0 1 1 7.5 17 1.5 1.5 0 0 1 6 18.5Zm12 0A1.5 1.5 0 1 1 19.5 17 1.5 1.5 0 0 1 18 18.5ZM17 12V9.5h2.2l1.8 2.5H17Z'/%3E%3C/svg%3E") no-repeat center / contain !important;
          mask: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 8h-3V6a2 2 0 0 0-2-2H3a2 2 0 0 0-2 2v11h2a3 3 0 0 0 6 0h6a3 3 0 0 0 6 0h2v-5l-3-4ZM6 18.5A1.5 1.5 0 1 1 7.5 17 1.5 1.5 0 0 1 6 18.5Zm12 0A1.5 1.5 0 1 1 19.5 17 1.5 1.5 0 0 1 18 18.5ZM17 12V9.5h2.2l1.8 2.5H17Z'/%3E%3C/svg%3E") no-repeat center / contain !important;
}
body #renderFreeDelivery .info-price:not(.free-price-bg) p { color: var(--dark) !important; }
/* zelená varianta má prednosť pred staršou ružovou */
body.cart-first .cart-summary-card #renderFreeDelivery .info-price.free-price-bg,
body.cart-first .cart-summary #renderFreeDelivery .info-price.free-price-bg,
body #renderFreeDelivery .info-price.free-price-bg {
  background: #eaf6ee !important;
  background-image: none !important;
  border: 1px solid #cfe8d8 !important;
}
body.cart-first .cart-summary-card #renderFreeDelivery .info-price.free-price-bg p,
body.cart-first .cart-summary #renderFreeDelivery .info-price.free-price-bg p,
body #renderFreeDelivery .info-price.free-price-bg p {
  color: #1f6b3c !important;
  -webkit-text-fill-color: currentColor !important;
}
/* ikona v hláške mala zo základného CSS posun (position:relative; top) */
body #renderFreeDelivery .info-price span[class^="icon-"],
body .cart-summary-card .info-price span[class^="icon-"],
body .cart-summary .info-price span[class^="icon-"] {
  position: static !important;
  top: auto !important;
  left: auto !important;
  align-self: center !important;
}

/* košík 1. krok — tlačidlo "Späť na nákup" (odkaz prerastal svoj obal) */
body #cart-first-step-bottom-buttons .button-type-1,
body #cart-first-step-bottom-buttons .button-type-back {
  display: inline-block !important;
  box-sizing: border-box !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}
body #cart-first-step-bottom-buttons .button-type-1 a.buttons-text,
body #cart-first-step-bottom-buttons a.buttons-text {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: 48px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 22px !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}

/* =====================================================
   Košík — "Zvoľte darček k nákupu" (prázdne miesto pod dlaždicou)
   ===================================================== */
body #gifts_in_cart_content {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 4px 0 0 !important;
  padding: 0 !important;
}
body #gifts_in_cart .gifts_in_cart_product {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  box-sizing: border-box !important;
  float: none !important;
  width: auto !important;
  min-width: 210px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 10px 14px 10px 10px !important;
  background: var(--white) !important;
  border: 1.5px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  cursor: pointer !important;
  transition: border-color .2s ease, box-shadow .2s ease !important;
}
body #gifts_in_cart .gifts_in_cart_product:hover {
  border-color: var(--rose) !important;
  box-shadow: 0 4px 14px rgba(196,123,104,.16) !important;
}
body #gifts_in_cart .gifts_in_cart_product input.product_gift {
  flex: 0 0 auto !important;
  float: none !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  accent-color: var(--rose) !important;
  cursor: pointer !important;
}
body #gifts_in_cart .gifts_in_cart_product .image-gift {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 54px !important;
  height: 54px !important;
  margin: 0 !important;
  padding: 4px !important;
  background: var(--light-bg) !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}
body #gifts_in_cart .gifts_in_cart_product .image-gift img {
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 100% !important;
  margin: 0 !important;
}
body #gifts_in_cart .gifts_in_cart_product label {
  flex: 1 1 auto !important;
  display: block !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  color: var(--dark) !important;
  -webkit-text-fill-color: currentColor !important;
  cursor: pointer !important;
}
body #gifts_in_cart .gifts_in_cart_product .gift-price {
  flex: 0 0 auto !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: var(--rose-dark) !important;
  -webkit-text-fill-color: currentColor !important;
  white-space: nowrap !important;
}
/* hlavička boxu */
body #gifts_in_cart_text { margin: 0 !important; height: auto !important; }
body #gifts_in_cart_text .icon-gift { margin: 0 14px 8px 0 !important; }
body #gifts_in_cart { padding: 18px 20px 20px !important; }

/* ══════════════════════════════════════════════════════════════
   EXTERNÁ PLATBA (Quatro a pod.) — karta s hláškou a akciami
   ══════════════════════════════════════════════════════════════ */
body .quatro-pay-box {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  position: relative !important;
  box-sizing: border-box !important;
  width: auto !important;
  max-width: 620px !important;
  margin: 44px auto 34px !important;
  padding: 146px 44px 40px !important;
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow-sm) !important;
  text-align: center !important;
}
body .quatro-pay-box p.qp-title {
  order: 2 !important;
  width: auto !important;
  margin: 0 0 12px !important;
  font-family: var(--font-head) !important;
  font-size: 32px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  color: var(--charcoal) !important;
  text-align: center !important;
}
body .quatro-pay-box #info-block.info-block-external-pay {
  order: 3 !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  border: none !important;
}
body .quatro-pay-box #info-block.info-block-external-pay p {
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 14.5px !important;
  font-weight: 400 !important;
  line-height: 1.7 !important;
  color: var(--mid) !important;
  text-align: center !important;
}
/* veľká ikonka nad nadpisom */
body .quatro-pay-box #info-block.info-block-external-pay span.info {
  display: block !important;
  position: absolute !important;
  top: 44px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  float: none !important;
  width: 78px !important;
  height: 78px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 50% !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: 36px 36px !important;
  font-size: 0 !important;
  line-height: 0 !important;
}
body .quatro-pay-error #info-block.info-block-external-pay span.info {
  background-color: #F8EAE6 !important;
  box-shadow: 0 0 0 9px rgba(178, 61, 43, .06) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B23D2B' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.3 3.9L1.9 18a2 2 0 0 0 1.7 3h16.8a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z'/%3E%3Cline x1='12' y1='9' x2='12' y2='13.5'/%3E%3Cline x1='12' y1='17.2' x2='12.01' y2='17.2'/%3E%3C/svg%3E") !important;
}
body .quatro-pay-ok #info-block.info-block-external-pay span.info {
  background-color: var(--rose-light) !important;
  box-shadow: 0 0 0 9px rgba(196, 123, 104, .08) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c47b68' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='5' width='20' height='14' rx='2.5'/%3E%3Cline x1='2' y1='10' x2='22' y2='10'/%3E%3Cline x1='6' y1='15' x2='9.5' y2='15'/%3E%3C/svg%3E") !important;
}
/* akcie */
body .quatro-pay-box .qp-actions,
body .quatro-pay-box .externalPayForm {
  order: 4 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  width: auto !important;
  margin: 30px 0 0 !important;
  float: none !important;
}
body .quatro-pay-box .qp-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  min-width: 190px !important;
  height: 50px !important;
  padding: 0 26px !important;
  border-radius: var(--radius-sm) !important;
  font-family: var(--font-body) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  transition: var(--transition) !important;
}
body .quatro-pay-box .qp-btn-primary {
  background: var(--rose) !important;
  border: 1px solid var(--rose) !important;
  color: #fff !important;
}
body .quatro-pay-box .qp-btn-primary:hover { background: var(--rose-dark) !important; border-color: var(--rose-dark) !important; }
body .quatro-pay-box .qp-btn-ghost {
  background: transparent !important;
  border: 1px solid var(--charcoal) !important;
  color: var(--charcoal) !important;
}
body .quatro-pay-box .qp-btn-ghost:hover { background: var(--charcoal) !important; color: #fff !important; }
/* tlačidlo "Prejsť na platbu" */
body .quatro-pay-box .externalPayForm .button-type-1 {
  display: inline-flex !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: var(--rose) !important;
  background-image: none !important;
  border: 1px solid var(--rose) !important;
  border-radius: var(--radius-sm) !important;
  transition: var(--transition) !important;
}
body .quatro-pay-box .externalPayForm .button-type-1:hover { background: var(--rose-dark) !important; border-color: var(--rose-dark) !important; }
body .quatro-pay-box .externalPayForm .button-type-1 a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  min-width: 220px !important;
  height: 50px !important;
  padding: 0 30px !important;
  background: none !important;
  font-family: var(--font-body) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: #fff !important;
  text-decoration: none !important;
}
body .quatro-pay-box .externalPayForm .button-type-1 span { display: none !important; }
@media (max-width: 640px) {
  body .quatro-pay-box { margin: 26px 16px !important; padding: 132px 22px 30px !important; }
  body .quatro-pay-box p.qp-title { font-size: 25px !important; }
  body .quatro-pay-box .qp-btn { width: 100% !important; }
}

/* ══════════════════════════════════════════════════════════════
   MOBILNÁ VERZIA (≤ 800px)
   ══════════════════════════════════════════════════════════════ */
@media screen and (max-width: 800px) {

  /* hlavička: logo na stred, duplicitné prihlásenie a košík
     (sú v hornej lište) skryjeme — pretekali mimo obrazovku */
  #header,
  #header.special-header0 {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 8px 12px !important;
  }
  #header .top-menu-wrap {
    display: none !important;
  }
  #header-opacity,
  #header-opacity > .span-25 {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* nič nesmie pretekať do strán */
  html, body {
    max-width: 100% !important;
    overflow-x: hidden !important;
  }
}

/* mobil — „Posledné prezerané produkty" v detaile (karty boli 162px
   široké a prekrývali sa) */
@media screen and (max-width: 800px) {
  body.catalog-detail #related-product {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    box-sizing: border-box !important;
    width: 100% !important;
    height: auto !important;
    padding: 0 12px !important;
    margin: 0 0 24px !important;
  }
  body.catalog-detail #related-product > p,
  body.catalog-detail #related-product > hr,
  body.catalog-detail #related-product > h2,
  body.catalog-detail #related-product > h3 {
    grid-column: 1 / -1 !important;
  }
  body.catalog-detail #related-product > .product-third,
  body.catalog-detail #related-product > .product-second {
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 !important;
    float: none !important;
    vertical-align: top !important;
  }
  body.catalog-detail #related-product .product-content {
    height: auto !important;
    min-height: 0 !important;
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
  }
  body.catalog-detail #related-product .add-cart-catalog {
    margin-top: auto !important;
  }
  body.catalog-detail #related-product .add-cart-catalog input[type="submit"] {
    font-size: 12.5px !important;
  }
}
@media screen and (max-width: 420px) {
  body.catalog-detail #related-product {
    grid-template-columns: 1fr !important;
  }
}

/* mobil — stránka po vložení produktu do košíka */
@media screen and (max-width: 800px) {
  body.cart-add-product-success #cart-add-product-success.bg-cart-block {
    flex-direction: column !important;
    align-items: center !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 16px 0 24px !important;
    padding: 24px 14px 22px !important;
    text-align: center !important;
  }
  body.cart-add-product-success #cart-add-product-success .icon-success {
    margin: 0 0 14px !important;
    flex: 0 0 auto !important;
  }
  body.cart-add-product-success #cart-add-product-success-text {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
  }
  body.cart-add-product-success #cart-add-product-success-text .button-type-1,
  body.cart-add-product-success #cart-add-product-success-text [class*="button-type"] {
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    margin: 10px 0 0 !important;
  }
  body.cart-add-product-success #cart-add-product-success-text .button-type-1 a,
  body.cart-add-product-success #cart-add-product-success-text .button-type-1 input {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    width: 100% !important;
  }
  /* tipy na ďalší nákup */
  body.cart-add-product-success #tips-after-add-to-cart {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    box-sizing: border-box !important;
    width: 100% !important;
    height: auto !important;
    padding: 0 12px !important;
    margin: 0 0 24px !important;
  }
  body.cart-add-product-success #tips-after-add-to-cart > p,
  body.cart-add-product-success #tips-after-add-to-cart > hr {
    grid-column: 1 / -1 !important;
  }
  body.cart-add-product-success #tips-after-add-to-cart > .product-third,
  body.cart-add-product-success #tips-after-add-to-cart > .product-second {
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 !important;
    float: none !important;
  }
  body.cart-add-product-success #tips-after-add-to-cart .product-content {
    height: auto !important;
    min-height: 0 !important;
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
  }
  body.cart-add-product-success #tips-after-add-to-cart .add-cart-catalog {
    margin-top: auto !important;
  }
}
@media screen and (max-width: 420px) {
  body.cart-add-product-success #tips-after-add-to-cart {
    grid-template-columns: 1fr !important;
  }
}

/* mobil — 2. krok košíka: tlačidlá cez celú šírku pod sebou */
@media screen and (max-width: 800px) {
  body.cart-second .no-reg-form .buttons,
  body.cart-second .no-reg-form .button-back-to-first-step {
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    text-align: center !important;
  }
  body.cart-second .no-reg-form .buttons .button-type-1,
  body.cart-second .no-reg-form .button-back-to-first-step .button-type-1 {
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    margin: 0 0 10px !important;
  }
  body.cart-second .no-reg-form .buttons .button-type-1 input,
  body.cart-second .no-reg-form .button-back-to-first-step .button-type-1 a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    width: 100% !important;
  }
  /* prihlásenie / nákup bez registrácie — tlačidlá cez celú šírku */
  body.cart-second #registration-cart-block form {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
  }
  body.cart-second #registration-cart-block .button-type-1,
  body.cart-second #registration-cart-block input[type="submit"] {
    box-sizing: border-box !important;
    width: 100% !important;
    margin: 0 !important;
  }
}
/* mobil — tlačidlá 2. kroku cez celú šírku (fieldset-second_step_buttons) */
@media screen and (max-width: 800px) {
  body.cart-second #fieldset-second_step_buttons .buttons,
  body.cart-second #fieldset-second_step_buttons .button-back-to-first-step,
  body.cart-second #fieldset-second_step_buttons dl > div {
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
  }
  body.cart-second #fieldset-second_step_buttons .button-type-1 {
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    margin: 0 0 10px !important;
  }
  body.cart-second #fieldset-second_step_buttons .button-type-1 > input,
  body.cart-second #fieldset-second_step_buttons .button-type-1 > a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    width: 100% !important;
  }
}
@media screen and (max-width: 800px) {
  body.cart-second #fieldset-second_step_buttons #button-next,
  body.cart-second #fieldset-second_step_buttons #button-next input {
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }
}
/* mobil — 3. krok: tlačidlá cez celú šírku karty */
@media screen and (max-width: 800px) {
  body.cart-third #third-cart-submit .button-type-1,
  body.cart-third #third-cart-submit .button-type-1 > a,
  body.cart-third #third-cart-submit .button-type-1 > input,
  body.cart-third .button-type-back,
  body.cart-third .button-type-back > a {
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}


/* ═══════════════════════════════════════════════════════════════
   MOBILNÉ MENU — vysúvací panel (modernizácia)
   Predtým: bledoružový blok, ktorý nesiahal cez celú výšku,
   hlavička stránky ním presvitala, chýbalo vyhľadávanie,
   oddeľovače aj zatváranie.
   ═══════════════════════════════════════════════════════════════ */
#header #mobile-hamburger-menu {
  z-index: 1200 !important;
}
#header #mobile-hamburger-menu:has(> input:checked) {
  z-index: 2020 !important;
}
#header #mobile-hamburger-menu > div {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: auto !important;
  bottom: 0 !important;
  z-index: 2000 !important;
  box-sizing: border-box !important;
  width: 312px !important;
  max-width: 86vw !important;
  height: 100vh !important;
  max-height: 100vh !important;
  margin: 0 !important;
  padding: 0 0 30px !important;
  background: var(--white) !important;
  border-right: 3px solid var(--rose) !important;
  box-shadow: 16px 0 46px rgba(26,26,26,.28) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  transform: translateX(-108%) !important;
  transition: transform .28s cubic-bezier(.4,0,.2,1) !important;
}
#header #mobile-hamburger-menu > input:checked ~ div {
  transform: translateX(0) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

/* hlavička panelu */
#header #mobile-hamburger-menu > div::before {
  content: 'MENU' !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  padding: 24px 58px 22px 22px !important;
  background: var(--charcoal) !important;
  font-family: var(--font-body) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  letter-spacing: .28em !important;
  line-height: 1 !important;
  color: var(--white) !important;
  text-align: left !important;
}
/* zatváracie tlačidlo */
#header #mobile-hamburger-menu > div > button.mhm-close {
  position: absolute !important;
  right: 12px !important;
  top: 12px !important;
  z-index: 2015 !important;
  width: 38px !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  background-color: transparent !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 16px 16px !important;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M5 5l14 14M19 5L5 19'/%3E%3C/svg%3E") !important;
  border: 0 !important;
  border-radius: var(--radius-sm) !important;
  outline: none !important;
  font-size: 0 !important;
  color: transparent !important;
  cursor: pointer !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}
#header #mobile-hamburger-menu > div > button.mhm-close:active {
  background-color: rgba(255,255,255,.18) !important;
}

/* tmavý podklad = samotný checkbox (klik zavrie menu) */
#header #mobile-hamburger-menu > input[type="checkbox"]:checked {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  z-index: 1990 !important;
  width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  opacity: 1 !important;
  background: rgba(26,26,26,.5) !important;
  border: 0 !important;
  cursor: pointer !important;
}
#header #mobile-hamburger-menu > span {
  z-index: 2010 !important;
  pointer-events: none !important;
}
#header #mobile-hamburger-menu > input:checked ~ span {
  opacity: 0 !important;
  visibility: hidden !important;
}

/* ── vyhľadávanie v paneli ── */
#header #mobile-hamburger-menu > div > #search {
  box-sizing: border-box !important;
  display: block !important;
  position: static !important;
  float: none !important;
  clear: both !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 16px 18px !important;
  background: var(--rose-light) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transform: none !important;
  overflow: visible !important;
}
#header #mobile-hamburger-menu #search form,
#header #mobile-hamburger-menu #search .myform,
#header #mobile-hamburger-menu #search fieldset,
#header #mobile-hamburger-menu #search .row,
#header #mobile-hamburger-menu #search .element {
  box-sizing: border-box !important;
  display: block !important;
  position: static !important;
  float: none !important;
  visibility: visible !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
}
#header #mobile-hamburger-menu #search input#text,
#header #mobile-hamburger-menu #search input[type="text"] {
  box-sizing: border-box !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 42px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  background-color: var(--white) !important;
  background-image: none !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  box-shadow: none !important;
  outline: none !important;
  font-family: var(--font-body) !important;
  font-size: 13.5px !important;
  color: var(--charcoal) !important;
}

/* ── zoznamy ── */
#header #mobile-hamburger-menu > div > ul {
  box-sizing: border-box !important;
  float: none !important;
  clear: both !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  background: none !important;
}
/* biele znaky a &nbsp; v <li> tvoria fantómové riadky */
#header #mobile-hamburger-menu > div > ul li {
  position: relative !important;
  box-sizing: border-box !important;
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  background: none !important;
  border: 0 !important;
  border-bottom: 1px solid var(--border) !important;
  font-size: 0 !important;
  line-height: 0 !important;
}
#header #mobile-hamburger-menu > div > ul li.category_delimiter { display: none !important; }
#header #mobile-hamburger-menu > div > ul > li > a {
  display: flex !important;
  align-items: center !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 16px 52px 16px 22px !important;
  background: none !important;
  color: var(--charcoal) !important;
  -webkit-text-fill-color: var(--charcoal) !important;
  font-family: var(--font-body) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  letter-spacing: .14em !important;
  line-height: 1.3 !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  text-align: left !important;
  transition: background-color .16s ease, color .16s ease !important;
}
#header #mobile-hamburger-menu > div > ul > li > a:hover,
#header #mobile-hamburger-menu > div > ul > li > a:active {
  background: var(--rose-light) !important;
  color: var(--rose-dark) !important;
  -webkit-text-fill-color: var(--rose-dark) !important;
}

/* ── podmenu ── */
#header #mobile-hamburger-menu > div > ul li ul {
  box-sizing: border-box !important;
  position: static !important;
  visibility: visible !important;
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 4px 0 8px !important;
  background: var(--light-bg) !important;
  border: 0 !important;
  box-shadow: none !important;
  list-style: none !important;
}
#header #mobile-hamburger-menu > div > ul li ul li { border-bottom: 0 !important; }
#header #mobile-hamburger-menu > div > ul li ul li a {
  display: flex !important;
  align-items: center !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: auto !important;
  padding: 9px 20px 9px 38px !important;
  background: none !important;
  color: var(--mid) !important;
  -webkit-text-fill-color: var(--mid) !important;
  font-family: var(--font-body) !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  letter-spacing: .03em !important;
  line-height: 1.35 !important;
  text-transform: none !important;
  text-decoration: none !important;
  text-align: left !important;
}
#header #mobile-hamburger-menu > div > ul li ul li a:hover {
  color: var(--rose-dark) !important;
  -webkit-text-fill-color: var(--rose-dark) !important;
}

/* ── rozbaľovacia šípka ── */
#header #mobile-hamburger-menu span.mobile-hamburger-menu-expand {
  position: absolute !important;
  right: 14px !important;
  top: 13px !important;
  z-index: 20 !important;
  display: block !important;
  width: 26px !important;
  height: 26px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: var(--rose-light) !important;
  border: 0 !important;
  border-radius: var(--radius-sm) !important;
  cursor: pointer !important;
  font-size: 0 !important;
}
#header #mobile-hamburger-menu span.mobile-hamburger-menu-expand::after {
  content: '' !important;
  position: absolute !important;
  left: 9px !important;
  top: 8px !important;
  width: 7px !important;
  height: 7px !important;
  border-right: 2px solid var(--rose-dark) !important;
  border-bottom: 2px solid var(--rose-dark) !important;
  transform: rotate(45deg) !important;
}
#header #mobile-hamburger-menu li.mobile-hamburger-menu-active > span.mobile-hamburger-menu-expand::after {
  transform: rotate(-135deg) !important;
  top: 11px !important;
}

/* #container-top-header-strip má z-index 99 → vytvára stacking context
   a panel (2000) v ňom nedokáže prekryť sticky hlavičku (z-index 900).
   Pri otvorenom menu celú lištu zdvihneme. */
#container-header:has(#mobile-hamburger-menu > input:checked) {
  z-index: 2100 !important;
}


/* ═══════════════════════════════════════════════════════════════
   ÚVODNÁ STRÁNKA — jednotné odstupy sekcií
   Predtým boli medzery 90 / 50+23 / 80 / 88 px a medzi blokmi
   sa navyše preplietali <hr class="space"> s vlastnými okrajmi.
   Teraz: jeden rytmus — 56 px medzi sekciami, 20 px pod nadpisom.
   ═══════════════════════════════════════════════════════════════ */
body.default-index div.content > hr.space,
body.default-index #catalog-products-index > hr.space {
  display: none !important;
}

body.default-index div.content > #image-and-text-grid {
  margin: 0 0 56px !important;
}
body.default-index div.content > #big-startup-products {
  margin: 0 0 56px !important;
  padding: 0 !important;
}
body.default-index div.content > #catalog-products-index {
  margin: 0 !important;
  padding: 0 !important;
}

/* sekcie vnútri katalógu */
body.default-index #catalog-products-index > * {
  margin-top: 0 !important;
  margin-bottom: 56px !important;
}
body.default-index #catalog-products-index > p.products-title-with-line {
  margin: 0 0 20px !important;
}
body.default-index #catalog-products-index > .info-articles {
  margin: 0 0 10px !important;
}
body.default-index #catalog-products-index > #seo-box-show-more-link {
  display: inline-block !important;
  margin: 0 0 56px !important;
}
body.default-index #catalog-products-index > *:last-child {
  margin-bottom: 0 !important;
}
/* odstup poslednej sekcie od newsletter pásu
   (div.content sa kvôli floatom/slideru nezväčšuje, preto margin
    dávame priamo newsletter kontajneru) */
body.default-index #container-newsletter {
  margin-top: 56px !important;
}

/* na väčších displejoch trochu vzdušnejšie */
@media screen and (min-width: 801px) {
  body.default-index div.content > #image-and-text-grid,
  body.default-index div.content > #big-startup-products,
  body.default-index #catalog-products-index > *,
  body.default-index #catalog-products-index > #seo-box-show-more-link {
    margin-bottom: 72px !important;
  }
  body.default-index #catalog-products-index > p.products-title-with-line {
    margin: 0 0 24px !important;
  }
  body.default-index #container-newsletter { margin-top: 72px !important; }
}


/* ═══════════════════════════════════════════════════════════════
   DETAIL PRODUKTU — jednotné odstupy sekcií
   Predtým: 32 / 8 / 20 / 10 / 20 / 30 / 10 / 0 px, plus prázdne
   <hr class="space"> s vlastnými okrajmi.
   Teraz: 28 px medzi sekciami, 24 px pod hlavičkou produktu.
   ═══════════════════════════════════════════════════════════════ */
body.catalog-detail #gallery > hr.space,
body.catalog-detail #detail > div > hr.space {
  display: none !important;
}

body.catalog-detail #gallery > h1 {
  margin: 0 0 8px !important;
}
body.catalog-detail #gallery > #container-detail-code-and-evaluation {
  margin: 0 0 24px !important;
}
body.catalog-detail #gallery .galleries {
  margin: 0 0 28px !important;
}
body.catalog-detail #gallery .space-line {
  margin: 0 0 28px !important;
}

body.catalog-detail #product-detail {
  margin: 0 !important;
}
body.catalog-detail #product-detail > #price-block {
  margin: 0 0 28px !important;
}
body.catalog-detail #product-detail > .param-product-select,
body.catalog-detail #product-detail > .payoff-param-product-select,
body.catalog-detail #product-detail > .color-schemes {
  margin: 0 0 28px !important;
}
body.catalog-detail #product-detail > .delivery {
  margin: 0 !important;
}

body.catalog-detail #related-product {
  margin: 48px 0 0 !important;
}
/* aby odstup pred newsletterom sedel s úvodnou stránkou (56 px) */
body.catalog-detail #detail { padding-bottom: 0 !important; }

/* na väčších displejoch vzdušnejšie */
@media screen and (min-width: 801px) {
  body.catalog-detail #gallery .galleries,
  body.catalog-detail #gallery .space-line,
  body.catalog-detail #product-detail > #price-block,
  body.catalog-detail #product-detail > .param-product-select,
  body.catalog-detail #product-detail > .payoff-param-product-select,
  body.catalog-detail #product-detail > .color-schemes {
    margin-bottom: 36px !important;
  }
  body.catalog-detail #related-product { margin-top: 64px !important; }
}

/* rovnaký odstup pred newsletterom ako na úvodnej stránke */
body.catalog-detail #container-newsletter { margin-top: 56px !important; }
@media screen and (min-width: 801px) {
  body.catalog-detail #container-newsletter { margin-top: 72px !important; }
}

/* ═══════════════════════════════════════════════════════════════
   MOBIL — hamburger presunutý do hlavičky vedľa loga (vpravo)
   + popisok „Kategórie"
   ═══════════════════════════════════════════════════════════════ */
@media screen and (max-width: 800px) {
  #header {
    align-items: center !important;
  }
  #header > #top-home {
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }
  #header > #mobile-hamburger-menu {
    flex: 0 0 auto !important;
    float: none !important;
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
    position: relative !important;
    box-sizing: border-box !important;
    width: auto !important;
    min-height: 40px !important;
    margin: 0 0 0 auto !important;
    padding: 7px 12px 7px 11px !important;
    background: var(--white) !important;
    border: 1px solid rgba(26,26,26,.14) !important;
    border-radius: 999px !important;
    cursor: pointer !important;
  }
  #header > #mobile-hamburger-menu:active {
    background: rgba(26,26,26,.05) !important;
  }
  /* prúžky hamburgeru — v základe sú to absolútne/statické spany;
     zabalíme ich do pevnej 20×14 zóny vľavo v tlačidle */
  #header > #mobile-hamburger-menu > span {
    position: absolute !important;
    left: 12px !important;
    width: 20px !important;
    height: 2px !important;
    margin: 0 !important;
    background: var(--charcoal) !important;
    border-radius: 2px !important;
    z-index: 2010 !important;
    pointer-events: none !important;
    transition: transform .22s ease, opacity .22s ease !important;
  }
  #header > #mobile-hamburger-menu > span:nth-of-type(1) { top: 13px !important; }
  #header > #mobile-hamburger-menu > span:nth-of-type(2) { top: 19px !important; }
  #header > #mobile-hamburger-menu > span:nth-of-type(3) { top: 25px !important; }
  #header > #mobile-hamburger-menu > input[type="checkbox"] {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    opacity: 0 !important;
    cursor: pointer !important;
    z-index: 10 !important;
  }
  /* popisok */
  #header > #mobile-hamburger-menu > b.mhm-label {
    display: block !important;
    margin: 0 0 0 27px !important;
    font-family: var(--font-body) !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    letter-spacing: .16em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    color: var(--charcoal) !important;
    white-space: nowrap !important;
    pointer-events: none !important;
  }
  /* pri otvorenom menu tlačidlo aj popisok skryjeme (panel má vlastné X) */
  #header > #mobile-hamburger-menu:has(> input:checked) {
    background: transparent !important;
    border-color: transparent !important;
  }
  #header > #mobile-hamburger-menu > input:checked ~ b.mhm-label {
    opacity: 0 !important;
    visibility: hidden !important;
  }
  /* hlavička je sticky so z-index 900 → pri otvorenom menu ju zdvihneme */
  #container-header:has(#mobile-hamburger-menu > input:checked) {
    z-index: 2100 !important;
  }
}

/* pod 800 px nahrádza kategórie hamburger — desktop navigáciu v hlavičke
   skryjeme, inak pretečie a odtlačí tlačidlo mimo obrazovku */
@media screen and (max-width: 800px) {
  #header > #articles-menu {
    display: none !important;
  }
}

/* ═══════════════════════════════════════════════════════════════
   MOBIL — PÄTIČKA
   Base CSS dáva pod 800 px `#info-articles { flex-direction: column }`,
   takže tri 180 px stĺpce išli pod seba a vpravo ostával prázdny pás.
   Teraz: značka + kontakt v jednom riadku hore, oba zoznamy odkazov
   vedľa seba (50/50), platba a doprava cez celú šírku.
   ═══════════════════════════════════════════════════════════════ */
@media screen and (max-width: 800px) {

  #info-articles {
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    justify-content: center !important;
    column-gap: 18px !important;
    row-gap: 24px !important;
    padding: 30px 18px 18px !important;
  }

  #info-articles > .span-6,
  #info-articles > #mediahelp,
  #info-articles > .pay-delivery-footer-container {
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  /* ── značka + kontakt: jeden riadok cez celú šírku ── */
  #info-articles > #mediahelp {
    flex: 1 1 100% !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px 22px !important;
    padding-bottom: 20px !important;
    border-bottom: 1px solid rgba(255,255,255,.1) !important;
    text-align: center !important;
  }
  #info-articles > #mediahelp > img {
    flex: 0 0 auto !important;
    margin: 0 !important;
    max-width: 118px !important;
  }
  #info-articles > #mediahelp > br { display: none !important; }
  #info-articles > #mediahelp .text-1-phone,
  #info-articles > #mediahelp .text-1-email {
    margin: 0 !important;
    font-size: 13px !important;
  }
  #info-articles > #mediahelp .text-2-copyright {
    flex: 1 1 100% !important;
    margin: 8px 0 0 !important;
    text-align: center !important;
  }

  /* ── dva zoznamy odkazov vedľa seba ── */
  #info-articles > .span-6:not(#mediahelp) {
    flex: 1 1 calc(50% - 9px) !important;
    max-width: calc(50% - 9px) !important;
    text-align: left !important;
  }
  #info-articles > .span-6:not(#mediahelp) .group-title {
    text-align: left !important;
    margin-bottom: 8px !important;
  }
  #info-articles > .span-6:not(#mediahelp) ul li a {
    font-size: 12.5px !important;
    line-height: 1.85 !important;
  }

  /* ── platba + doprava cez celú šírku, vycentrované ── */
  #info-articles > .pay-delivery-footer-container {
    flex: 1 1 100% !important;
    padding: 18px 0 4px !important;
    border-top: 1px solid rgba(255,255,255,.1) !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    justify-items: start !important;
    column-gap: 14px !important;
    row-gap: 8px !important;
  }
  #info-articles > .pay-delivery-footer-container > .group-title {
    text-align: left !important;
    width: 100% !important;
  }
  #info-articles > .pay-delivery-footer-container > #pay-delivery-footer-big {
    justify-content: flex-start !important;
  }

  #container-royal-media-text {
    padding: 12px 16px 14px !important;
  }
}

/* veľmi úzke displeje — odkazy pod seba, aby sa nelámali názvy */
@media screen and (max-width: 359px) {
  #info-articles > .span-6:not(#mediahelp) {
    flex: 1 1 100% !important;
    max-width: 100% !important;
  }
}

/* platba a doprava vedľa seba aj na mobile (zmestia sa) */
@media screen and (max-width: 800px) {
  #info-articles > .pay-delivery-footer-container {
    grid-template-columns: auto minmax(0, 1fr) minmax(0, 1fr) !important;
    column-gap: 14px !important;
    row-gap: 6px !important;
    align-items: start !important;
  }
  #info-articles > .pay-delivery-footer-container > .group-title:nth-child(1) {
    grid-column: 1 / 3 !important;
    grid-row: 1 !important;
    width: auto !important;
  }
  #info-articles > .pay-delivery-footer-container > #pay-delivery-footer-lock {
    grid-column: 1 !important;
    grid-row: 2 !important;
    align-self: start !important;
  }
  #info-articles > .pay-delivery-footer-container > #pay-delivery-footer-small {
    grid-column: 2 !important;
    grid-row: 2 !important;
  }
  #info-articles > .pay-delivery-footer-container > .group-title:nth-child(4) {
    grid-column: 3 !important;
    grid-row: 1 !important;
    width: auto !important;
  }
  #info-articles > .pay-delivery-footer-container > #pay-delivery-footer-big {
    grid-column: 3 !important;
    grid-row: 2 !important;
  }
}

/* pod 520 px sa už doprava vedľa platby nezmestí — pod seba */
@media screen and (max-width: 519px) {
  #info-articles > .pay-delivery-footer-container {
    grid-template-columns: auto minmax(0, 1fr) !important;
    row-gap: 8px !important;
  }
  #info-articles > .pay-delivery-footer-container > .group-title:nth-child(4) {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
    margin-top: 14px !important;
  }
  #info-articles > .pay-delivery-footer-container > #pay-delivery-footer-big {
    grid-column: 1 / -1 !important;
    grid-row: 4 !important;
  }
}

@media screen and (max-width: 800px) {
  /* zámok a logá platby na jednej optickej línii */
  #info-articles > .pay-delivery-footer-container > #pay-delivery-footer-lock {
    align-self: center !important;
  }
  #info-articles > .pay-delivery-footer-container > #pay-delivery-footer-small,
  #info-articles > .pay-delivery-footer-container > #pay-delivery-footer-big {
    align-self: center !important;
  }
}

/* ── najmenšia verzia: copyright do pravého dolného rohu,
      teda napravo od loga dopravy (tam je voľné miesto) ── */
@media screen and (max-width: 519px) {
  #info-articles {
    position: relative !important;
  }
  #info-articles > #mediahelp .text-2-copyright {
    position: absolute !important;
    right: 18px !important;
    bottom: 22px !important;
    z-index: 2 !important;
    width: auto !important;
    max-width: 52% !important;
    margin: 0 !important;
    flex: none !important;
    font-size: 11.5px !important;
    line-height: 1.5 !important;
    text-align: right !important;
  }
  /* logá dopravy nechávame v jednom riadku, vpravo ostane miesto */
  #info-articles > .pay-delivery-footer-container > #pay-delivery-footer-big {
    max-width: calc(100% - 150px) !important;
  }
}

/* prázdne dlaždice bez loga (šablóna ich generuje do zásoby)
   zaberali miesto a tlačili ostatné do ďalšieho riadku */
#pay-delivery-footer-small .pay-delivery-footer-outer:not(:has(img)),
#pay-delivery-footer-big .pay-delivery-footer-outer:not(:has(img)) {
  display: none !important;
}