/* ============================================================
   SUZANE — Handbag Boutique | "Parisian Blush" Design
   Farby: Dusty Rose + Champagne Ivory + Soft Gold
   Fonty: Josefin Sans (nav/headings) + Lato (body)
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@300;400;600;700&family=Lato:wght@300;400;700&display=swap');

/* ── DESIGN TOKENS ── */
:root {
  --rose:         #C9667A;   /* dusty rose — hlavný akcentná farba */
  --rose-dark:    #9E4A5E;   /* tmavá ružová */
  --rose-light:   #E8B4BE;   /* svetlá ružová */
  --rose-pale:    #FAF0F2;   /* veľmi bledá ružová */
  --champagne:    #F8F2EC;   /* champagne — sidebar */
  --ivory:        #FDFAF7;   /* warm ivory — content bg */
  --dark:         #1A1617;   /* near black */
  --taupe:        #8C7B73;   /* warm taupe */
  --taupe-light:  #C2B0A8;   /* light taupe */
  --gold-soft:    #C4A882;   /* soft gold accent */
  --white:        #FFFFFF;
  --text:         #2E2426;   /* warm dark text */
}

/* ── BASE ── */
body {
  font-family: 'Lato', sans-serif !important;
  background: var(--ivory) !important;
  color: var(--text) !important;
}

/* ── TOP HEADER STRIP ── */
#container-top-header-strip {
  background: var(--rose-pale) !important;
  border-bottom: 1px solid var(--rose-light) !important;
}
#container-top-header-strip,
#container-top-header-strip a,
#container-top-header-strip span,
#container-top-header-strip div,
#container-top-header-strip li {
  color: var(--taupe) !important;
  font-family: 'Josefin Sans', sans-serif !important;
  font-size: 11px !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}
#container-top-header-strip a:hover {
  color: var(--rose) !important;
}

/* ── HEADER ── */
#container-header {
  background: var(--white) !important;
  border-bottom: 2px solid var(--rose-pale) !important;
  box-shadow: 0 2px 16px rgba(201, 102, 122, 0.07) !important;
}

/* Header left menu — logo area */
#header-left-menu {
  background: var(--champagne) !important;
  border-bottom: 2px solid var(--rose-light) !important;
  padding: 4px 0 !important;
}
#header-left-menu a {
  color: var(--rose) !important;
}

/* Icons area */
#icons-left-menu {
  background: var(--champagne) !important;
  border-bottom: 1px solid rgba(201, 102, 122, 0.15) !important;
}
#icons-left-menu a,
#icons-left-menu .material-icons {
  color: var(--taupe) !important;
  transition: color 0.2s !important;
}
#icons-left-menu a:hover,
#icons-left-menu a:hover .material-icons {
  color: var(--rose) !important;
}
#icons-left-menu input[type="text"] {
  background: var(--ivory) !important;
  border: 1px solid var(--rose-light) !important;
  color: var(--text) !important;
  font-family: 'Lato', sans-serif !important;
  border-radius: 20px !important;
}
#icons-left-menu input[type="text"]::placeholder {
  color: var(--taupe-light) !important;
}

/* Mobile hamburger */
#mobile-hamburger-menu span {
  background: var(--rose) !important;
}

/* ── SIDEBAR / CATEGORY ── */
.span-6 {
  background: var(--champagne) !important;
}

#category {
  background: var(--champagne) !important;
}

#category .category-tree,
#category ul {
  background: transparent !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

#category .category-tree li,
#category ul li {
  background: transparent !important;
  border-bottom: 1px solid rgba(201, 102, 122, 0.12) !important;
}

#category .category-tree li a,
#category ul li a,
#category a.menu-lines {
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 600 !important;
  font-size: 12px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--taupe) !important;
  display: block !important;
  padding: 13px 18px !important;
  transition: color 0.25s, padding-left 0.25s, letter-spacing 0.25s !important;
}

#category .category-tree li a:hover,
#category ul li a:hover,
#category a.menu-lines:hover {
  color: var(--rose) !important;
  padding-left: 24px !important;
  letter-spacing: 0.15em !important;
}

#category li.selected > a,
#category li.active > a,
#category li.current > a {
  color: var(--rose) !important;
  border-left: 3px solid var(--rose) !important;
  background: rgba(201, 102, 122, 0.06) !important;
}

/* Sub-kategórie */
#category .category-tree li li a,
#category ul li ul li a {
  font-size: 11px !important;
  font-weight: 400 !important;
  padding-left: 28px !important;
  color: var(--taupe-light) !important;
}
#category .category-tree li li a:hover,
#category ul li ul li a:hover {
  color: var(--rose-dark) !important;
  padding-left: 34px !important;
}

/* ── NAVIGÁCIA (articles-menu) ── */
#container-articles-menu {
  background: var(--white) !important;
  border-bottom: 2px solid var(--rose-light) !important;
}
#articles-menu {
  background: transparent !important;
}
#articles-menu ul li,
.articles-menu-long ul li {
  background: transparent !important;
}
#articles-menu ul li > a,
.articles-menu-long ul li > a {
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 600 !important;
  font-size: 12px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--taupe) !important;
  padding: 14px 18px !important;
  transition: color 0.2s !important;
}
#articles-menu ul li > a:hover {
  color: var(--rose) !important;
}
#articles-menu ul li.active > a,
#articles-menu ul li.selected > a {
  color: var(--rose) !important;
  border-bottom: 2px solid var(--rose) !important;
}

/* Dropdown */
#articles-menu ul li ul {
  background: var(--white) !important;
  border-top: 2px solid var(--rose-light) !important;
  border-radius: 0 0 8px 8px !important;
  box-shadow: 0 6px 24px rgba(201, 102, 122, 0.12) !important;
}
#articles-menu ul li ul li a {
  color: var(--taupe) !important;
  font-size: 11px !important;
}
#articles-menu ul li ul li a:hover {
  color: var(--rose) !important;
}

/* ── BREADCRUMB ── */
.top-navigation,
#container-navigation-top {
  background: var(--rose-pale) !important;
  border-bottom: 1px solid var(--rose-light) !important;
}
.top-navigation a,
.top-navigation span {
  color: var(--taupe) !important;
  font-family: 'Josefin Sans', sans-serif !important;
  font-size: 11px !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
}
.top-navigation a:hover {
  color: var(--rose) !important;
}

/* ── SLIDER / BANNER ── */
#container-banner {
  border-bottom: 3px solid var(--rose-light) !important;
}

/* ── CONTENT ── */
.container.site-color,
.container {
  background: var(--ivory) !important;
}

/* ── SECTION TITLES ── */
h1, .products-title, .catalog-title {
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 300 !important;
  color: var(--dark) !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
}

.span-25 > h2,
.span-25 > h3,
.products-index-title h2,
.products-index-title h3 {
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 300 !important;
  color: var(--dark) !important;
  font-size: 18px !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  border-bottom: 1px solid var(--rose-light) !important;
  padding-bottom: 10px !important;
  margin-bottom: 24px !important;
}

/* ── PRODUCT CARDS (.product-second) ── */
.product-second {
  border-radius: 4px !important;
  background: var(--white) !important;
  box-shadow: 0 2px 12px rgba(201, 102, 122, 0.06) !important;
  transition: box-shadow 0.3s, transform 0.3s !important;
  overflow: hidden !important;
  border: 1px solid rgba(201, 102, 122, 0.1) !important;
}
.product-second:hover {
  box-shadow: 0 10px 32px rgba(201, 102, 122, 0.16) !important;
  transform: translateY(-5px) !important;
  border-color: var(--rose-light) !important;
}

/* Product name */
.product-second .catalog-delivery_name,
.product-second [class*="delivery_name"],
.product-second h3,
.product-second h4,
.product-content-title,
.product-content-title a {
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 400 !important;
  color: var(--dark) !important;
  letter-spacing: 0.06em !important;
}

/* Product price */
.product-second .price,
.product-second [class*="price"] {
  color: var(--rose-dark) !important;
  font-weight: 700 !important;
  font-family: 'Josefin Sans', sans-serif !important;
  letter-spacing: 0.05em !important;
}

/* Old price */
.product-second .old-price,
.product-second [class*="old-price"] {
  color: var(--taupe-light) !important;
  font-family: 'Lato', sans-serif !important;
}

/* ── BADGES ── */
.action {
  background: var(--rose) !important;
  color: var(--white) !important;
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 600 !important;
  font-size: 10px !important;
  letter-spacing: 0.1em !important;
  border-radius: 2px !important;
  text-transform: uppercase !important;
}

.clear {
  background: var(--dark) !important;
  color: var(--white) !important;
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 600 !important;
  border-radius: 2px !important;
}

.startup {
  background: var(--gold-soft) !important;
  color: var(--white) !important;
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 600 !important;
  font-size: 10px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  border-radius: 2px !important;
}

.top_product {
  background: var(--rose-light) !important;
  color: var(--dark) !important;
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 600 !important;
  border-radius: 2px !important;
}

.last_items,
div.last_items,
.container-product-actions .last_items,
.product-second .last_items {
  background: var(--rose-dark) !important;
  color: var(--white) !important;
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 600 !important;
  font-size: 10px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  border-radius: 2px !important;
}

/* ── TLAČIDLÁ ── */
.button-add-cart-button,
.add-cart-catalog .button-type-1,
input.button-add-cart-button {
  background: var(--rose) !important;
  color: var(--white) !important;
  border: none !important;
  border-radius: 2px !important;
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
  transition: background 0.25s !important;
}
.button-add-cart-button:hover,
.add-cart-catalog .button-type-1:hover {
  background: var(--rose-dark) !important;
}

.detail-button-catalog .button-type-1:not(.button-add-cart-button) {
  background: transparent !important;
  color: var(--taupe) !important;
  border: 1px solid var(--taupe-light) !important;
  border-radius: 2px !important;
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 400 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
  transition: border-color 0.25s, color 0.25s !important;
}
.detail-button-catalog .button-type-1:not(.button-add-cart-button):hover {
  border-color: var(--rose) !important;
  color: var(--rose) !important;
}

.button-type-1,
a.button-type-1 {
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 600 !important;
  border-radius: 2px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
}

/* Cart */
#container-header .cart-header-container,
#container-header .small-cart,
#top-header-cart {
  background: var(--rose-pale) !important;
  border-radius: 20px !important;
  color: var(--rose) !important;
}
#container-header .cart-header-container a,
#container-header .small-cart a,
#top-header-cart a {
  color: var(--rose) !important;
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 600 !important;
}

/* ── NEWSLETTER ── */
#container-newsletter {
  background: var(--champagne) !important;
  border-top: 3px solid var(--rose-light) !important;
  position: relative !important;
}
#container-newsletter::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(135deg, rgba(201,102,122,0.08) 0%, rgba(196,168,130,0.12) 100%) !important;
  z-index: 0 !important;
  pointer-events: none !important;
}
#container-newsletter > * {
  position: relative !important;
  z-index: 1 !important;
}
#container-newsletter h2,
#container-newsletter h3,
#container-newsletter p,
#container-newsletter span {
  color: var(--dark) !important;
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 300 !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
}
#container-newsletter input[type="text"],
#container-newsletter input[type="email"] {
  border-radius: 2px 0 0 2px !important;
  border: 1px solid var(--rose-light) !important;
  background: var(--white) !important;
  color: var(--text) !important;
  font-family: 'Lato', sans-serif !important;
}
#container-newsletter input[type="text"]::placeholder,
#container-newsletter input[type="email"]::placeholder {
  color: var(--taupe-light) !important;
}
#container-newsletter input[type="submit"] {
  background: transparent !important;
  color: var(--white) !important;
  border: none !important;
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
}
#container-newsletter #button-addNewsletter,
#container-newsletter .button-type-1 {
  background: var(--rose) !important;
  border-radius: 0 2px 2px 0 !important;
  transition: background 0.25s !important;
}
#container-newsletter #button-addNewsletter:hover,
#container-newsletter .button-type-1:hover {
  background: var(--rose-dark) !important;
}

/* ── FOOTER ── */
#container-footer {
  background: var(--dark) !important;
  border-top: 3px solid var(--rose) !important;
  color: var(--taupe-light) !important;
}
#container-footer,
#container-footer p,
#container-footer span,
#container-footer li,
#container-footer div {
  color: var(--taupe-light) !important;
  font-family: 'Lato', sans-serif !important;
}
#container-footer a {
  color: var(--taupe-light) !important;
  transition: color 0.2s !important;
}
#container-footer a:hover {
  color: var(--rose-light) !important;
}
#container-footer h3,
#container-footer h4,
#container-footer .group-title,
#container-footer strong {
  color: var(--white) !important;
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  font-size: 12px !important;
}

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

/* ── STRÁNKOVANIE ── */
.pagination a,
.pagination span {
  font-family: 'Josefin Sans', sans-serif !important;
  border-radius: 2px !important;
  letter-spacing: 0.05em !important;
}
.pagination a.active,
.pagination .current {
  background: var(--rose) !important;
  color: var(--white) !important;
  border-color: var(--rose) !important;
}
.pagination a:hover {
  border-color: var(--rose) !important;
  color: var(--rose) !important;
}

/* ── FORMULÁRE ── */
input[type="text"],
input[type="email"],
input[type="password"],
select,
textarea {
  font-family: 'Lato', sans-serif !important;
  border-radius: 2px !important;
}

/* ── FLASH SPRÁVY ── */
#messages .message-ok {
  background: var(--rose-pale) !important;
  border-left: 3px solid var(--rose) !important;
  color: var(--dark) !important;
  border-radius: 2px !important;
}
#messages .message-error {
  border-left: 3px solid var(--rose-dark) !important;
  border-radius: 2px !important;
}

/* ── DETAIL PRODUKTU ── */
#container-product-detail h1,
#container-product-detail .product-title {
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 300 !important;
  color: var(--dark) !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}
#container-product-detail .price-detail,
#container-product-detail .price {
  color: var(--rose-dark) !important;
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 600 !important;
  font-size: 24px !important;
  letter-spacing: 0.05em !important;
}
