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

/* ── 0. Fonty & import ───────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?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;
  --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: 6px 6px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  letter-spacing: .04em !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: 8px 12px !important;
  border-radius: var(--radius-sm) !important;
  font-size: 13px !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: 3px !important;
  font-size: 11px !important;
  color: var(--mid) !important;
  white-space: nowrap !important;
}

#head-login > a,
#head-login a {
  font-size: 11px !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 */
.pay-delivery-footer-container {
  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-small,
#pay-delivery-footer-big {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !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 ────────────────────────────────────────── */
#messages {
  border-radius: var(--radius) !important;
  overflow: hidden !important;
  margin: 12px 0 !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 ──────────────────────────── */
.content h1,
.content h2,
.content h3 {
  font-family: 'Inter', Roboto, sans-serif !important;
  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;
}