/* ============================================================
   STRMA VODA — Shoe Boutique | "Monochrome Luxe" Design
   Sidebar layout — vertical nav, editorial 2-col grid
   Farby: Black + Gold + Warm White
   Fonty: Cormorant Garamond (serif) + Montserrat (sans)
   ============================================================ */

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

/* ── DESIGN TOKENS ── */
:root {
  --black:       #0D0D0D;
  --charcoal:    #1C1C1C;
  --dark:        #2A2A2A;
  --gold:        #C9A84C;
  --gold-light:  #E2C47A;
  --gold-dark:   #9E7A2A;
  --warm-white:  #FAFAF8;
  --off-white:   #F3F0EB;
  --muted:       #888880;
  --rose-muted:  #B08080;
  --white:       #FFFFFF;
  --sidebar-w:   236px;
}

/* ── BASE ── */
body {
  font-family: 'Montserrat', sans-serif !important;
  background: var(--warm-white) !important;
  color: var(--charcoal) !important;
}

/* ── TOP STRIP (login/cart) ── */
#container-top-header-strip {
  background: var(--black) !important;
  border-bottom: 1px solid rgba(201,168,76,0.3) !important;
}
#container-top-header-strip a,
#container-top-header-strip span,
#container-top-header-strip div {
  color: rgba(255,255,255,0.7) !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 11px !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}
#container-top-header-strip a:hover {
  color: var(--gold) !important;
}

/* ── HEADER / SIDEBAR AREA ── */
#container-header {
  background: var(--white) !important;
  border-right: 1px solid var(--off-white) !important;
  box-shadow: 2px 0 20px rgba(0,0,0,0.04) !important;
}

/* Logo a brand */
#container-header #top-home,
#container-header .brand,
#container-header #header {
  font-family: 'Cormorant Garamond', serif !important;
}

/* Logo text */
#container-header .brand-name,
#top-home,
a#top-home {
  font-family: 'Cormorant Garamond', serif !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: var(--black) !important;
  font-size: 18px !important;
}

/* ── SIDEBAR NAVIGÁCIA (#category) ── */
#category {
  background: var(--white) !important;
  border-right: 1px solid var(--off-white) !important;
}

/* Nav položky — wrapper */
#category > div[id^="category-"] {
  background: transparent !important;
  border-bottom: 1px solid rgba(0,0,0,0.05) !important;
}

/* Nav linky */
#category a,
#category > div > a,
#category > div > div > a,
#category li a {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 500 !important;
  font-size: 11px !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  color: var(--charcoal) !important;
  padding: 14px 20px !important;
  display: block !important;
  transition: color 0.2s, border-left 0.2s !important;
  border-left: 2px solid transparent !important;
  text-decoration: none !important;
}
#category a:hover,
#category > div > a:hover {
  color: var(--gold) !important;
  border-left-color: var(--gold) !important;
}

/* Aktívna kategória */
#category .current > a,
#category .active > a,
#category > div.active > a {
  color: var(--gold) !important;
  border-left-color: var(--gold) !important;
  font-weight: 600 !important;
}

/* Sipka ► pred TOPÁNKY */
#category > div > a::before {
  content: '' !important;
}

/* Nadpis sekcie v sidebari */
.products-in-left-menu h3,
.products-in-left-menu h4 {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 13px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--muted) !important;
  padding: 16px 20px 6px !important;
  margin: 0 !important;
  font-weight: 400 !important;
}

/* ── BREADCRUMB ── */
.top-navigation,
#container-navigation-top {
  background: var(--off-white) !important;
  border-bottom: 1px solid rgba(0,0,0,0.06) !important;
}
.top-navigation a,
.top-navigation span {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 11px !important;
  letter-spacing: 0.06em !important;
  color: var(--muted) !important;
  text-transform: uppercase !important;
}

/* ── HLAVNÝ OBSAH ── */
.container.site-color {
  background: var(--warm-white) !important;
}

/* ── NADPISY SEKCIÍ ── */
.products-title-with-line,
h2.products-title,
h3.products-title {
  font-family: 'Cormorant Garamond', serif !important;
  font-weight: 300 !important;
  font-style: italic !important;
  font-size: 28px !important;
  letter-spacing: 0.06em !important;
  color: var(--charcoal) !important;
}

/* ── PRODUCT KARTY (.product-second) ── */
.product-second {
  background: var(--white) !important;
  overflow: hidden !important;
  transition: box-shadow 0.3s !important;
  position: relative !important;
}
.product-second:hover {
  box-shadow: 0 12px 40px rgba(0,0,0,0.10) !important;
}

/* Produkt obrázok overlay efekt */
.product-second .product-images {
  overflow: hidden !important;
}
.product-second .product-images img {
  transition: transform 0.5s ease !important;
}
.product-second:hover .product-images img {
  transform: scale(1.04) !important;
}

/* Produkt obsah */
.product-second .product-content {
  padding: 16px !important;
  border-top: 1px solid var(--off-white) !important;
}

/* Produkt názov */
.product-second .product-content-description,
.product-second [class*="name"],
.product-second [class*="title"] {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  color: var(--charcoal) !important;
  letter-spacing: 0.02em !important;
}

/* Produkt cena */
.product-second .price,
.product-second [class*="price"] {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  color: var(--charcoal) !important;
  letter-spacing: 0.04em !important;
}

/* ── BADGES ── */

/* Doporučujeme */
.startup {
  background: var(--charcoal) !important;
  color: var(--white) !important;
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 600 !important;
  font-size: 9px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  padding: 4px 8px !important;
}

/* TOP produkt */
.top_product {
  background: var(--gold) !important;
  color: var(--black) !important;
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 700 !important;
  font-size: 9px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
}

/* Posledné kusy */
.last_items,
div.last_items,
.container-product-actions .last_items,
.product-second .last_items {
  background: var(--rose-muted) !important;
  color: var(--white) !important;
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 600 !important;
  font-size: 9px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
}

/* Percent zľava */
.action,
.clear {
  background: var(--charcoal) !important;
  color: var(--white) !important;
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 700 !important;
  font-size: 10px !important;
  letter-spacing: 0.06em !important;
  border-radius: 0 !important;
}

/* ── TLAČIDLÁ ── */

/* PREZRIEŤ — hlavné tlačidlo */
.button-type-1,
div.button-type-1,
a.button-type-1 {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 600 !important;
  font-size: 10px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  transition: background 0.2s, color 0.2s !important;
}

/* PREZRIEŤ — filled black */
.detail-button-catalog .button-type-1,
.product-second .button-type-1 {
  background: var(--charcoal) !important;
  color: var(--white) !important;
  border: 1px solid var(--charcoal) !important;
}
.detail-button-catalog .button-type-1:hover,
.product-second .button-type-1:hover {
  background: var(--gold) !important;
  border-color: var(--gold) !important;
  color: var(--black) !important;
}

/* DO KOŠÍKA / PRIDAJ */
.button-add-cart-button,
.add-cart-catalog .button-type-1,
input.button-add-cart-button {
  background: var(--gold) !important;
  color: var(--black) !important;
  border: 1px solid var(--gold) !important;
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
}
.button-add-cart-button:hover {
  background: var(--gold-dark) !important;
  border-color: var(--gold-dark) !important;
}

/* Newsletter subscribe wrapper */
#container-newsletter #button-addNewsletter,
#container-newsletter .button-type-1 {
  background: var(--gold) !important;
  border-radius: 0 !important;
  color: var(--black) !important;
}

/* ── NEWSLETTER ── */
#container-newsletter {
  background: var(--charcoal) !important;
  position: relative !important;
  overflow: hidden !important;
}
#container-newsletter::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(135deg, rgba(13,13,13,0.95) 0%, rgba(44,44,44,0.88) 60%, rgba(201,168,76,0.25) 100%) !important;
  z-index: 1 !important;
  pointer-events: none !important;
}
#container-newsletter > * {
  position: relative !important;
  z-index: 2 !important;
}
#container-newsletter h2,
#container-newsletter h3,
#container-newsletter p,
#container-newsletter span {
  color: var(--white) !important;
  font-family: 'Cormorant Garamond', serif !important;
  font-weight: 300 !important;
  letter-spacing: 0.06em !important;
}
#container-newsletter input[type="text"],
#container-newsletter input[type="email"] {
  border: 1px solid rgba(201,168,76,0.4) !important;
  background: rgba(255,255,255,0.06) !important;
  color: var(--white) !important;
  font-family: 'Montserrat', sans-serif !important;
  border-radius: 0 !important;
  letter-spacing: 0.06em !important;
}
#container-newsletter input[type="submit"] {
  background: transparent !important;
  color: var(--black) !important;
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
}

/* ── FOOTER ── */
#container-footer {
  background: var(--black) !important;
  border-top: 2px solid var(--gold) !important;
  color: rgba(255,255,255,0.7) !important;
}
#container-footer,
#container-footer p,
#container-footer span,
#container-footer li,
#container-footer div {
  color: rgba(255,255,255,0.65) !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 12px !important;
  letter-spacing: 0.04em !important;
}
#container-footer a {
  color: rgba(255,255,255,0.65) !important;
  transition: color 0.2s !important;
  text-decoration: none !important;
}
#container-footer a:hover {
  color: var(--gold) !important;
}
#container-footer h3,
#container-footer h4,
#container-footer .group-title,
#container-footer strong {
  color: var(--gold) !important;
  font-family: 'Cormorant Garamond', serif !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}

/* Logo v footeri — biely filter */
#container-footer .brand img,
#container-footer #top-home img {
  filter: brightness(0) invert(1) !important;
}

/* ── NOVINKY SLIDE ── */
#news-slide {
  background: var(--charcoal) !important;
}
#news-slide a,
#news-slide span {
  color: var(--white) !important;
  font-family: 'Montserrat', sans-serif !important;
}

/* ── DETAILOVÁ STRÁNKA PRODUKTU ── */
.catalog-show-product h1,
.catalog-show-product h2 {
  font-family: 'Cormorant Garamond', serif !important;
  font-weight: 300 !important;
  font-size: 32px !important;
  letter-spacing: 0.04em !important;
  color: var(--charcoal) !important;
}

/* Cena na detail stránke */
.catalog-show-product .price-current,
.catalog-show-product [class*="price"] {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 700 !important;
  color: var(--charcoal) !important;
  letter-spacing: 0.06em !important;
}

/* ── STRÁNKOVANIE ── */
.pagination a,
.pagination span {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 600 !important;
  font-size: 12px !important;
  letter-spacing: 0.08em !important;
  border-radius: 0 !important;
}
.pagination .current,
.pagination a.active {
  background: var(--charcoal) !important;
  color: var(--white) !important;
  border-color: var(--charcoal) !important;
}

/* ── FORMULÁRE ── */
input[type="text"],
input[type="email"],
input[type="password"],
select,
textarea {
  font-family: 'Montserrat', sans-serif !important;
  border-radius: 0 !important;
  letter-spacing: 0.04em !important;
}

/* ── ŠPECIÁLNA PONUKA banner ── */
.big-product-hours-left-for-actual-price-countdown {
  font-family: 'Montserrat', sans-serif !important;
}

/* ── FLASH SPRÁVY ── */
#messages .message-ok {
  border-left: 3px solid var(--gold) !important;
  background: rgba(201,168,76,0.08) !important;
  color: var(--charcoal) !important;
  border-radius: 0 !important;
}
#messages .message-error {
  border-left: 3px solid var(--rose-muted) !important;
  border-radius: 0 !important;
}

/* ── SLICK slider ── */
.slick-slide,
.slick-cloned {
  /* nič — bez width !important */
}

/* ── SEARCH BOX ── */
.search-box input[type="text"] {
  border-radius: 0 !important;
  border: 1px solid rgba(0,0,0,0.15) !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 12px !important;
  letter-spacing: 0.06em !important;
}
.search-box input[type="submit"],
.search-box button {
  background: var(--charcoal) !important;
  border-radius: 0 !important;
  border: none !important;
}