/* ===========================================
   STUDIMO V4 — Header, Info bar, Mobile menu
   External file (Shoptet HEAD limit = 8192 chars)
   =========================================== */

/* ── Cream pozadí všude — žádné bílé pruhy ── */
html, body, .overall-wrapper {
  background-color: #FFF8F0 !important;
}

/* ── Info bar (pill) — desktop sticky, mobil fixed ── */
.site-msg.information {
  background: linear-gradient(135deg, #F3CDC4 0%, #DFD290 35%, #F1E0B2 65%, #E5D9E5 100%) !important;
  color: #9A7236 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  border: none !important;
  border-radius: 50px !important;
  position: sticky !important;
  top: 8px !important;
  max-width: 900px !important;
  width: fit-content !important;
  padding: 12px 40px !important;
  box-shadow: 0 4px 20px rgba(154, 114, 54, 0.2) !important;
  z-index: 9999 !important;
  text-align: center !important;
  white-space: nowrap !important;
  margin: 12px auto !important;
}
.site-msg.information a {
  color: #9A7236 !important;
  text-decoration: none !important;
  font-weight: 700 !important;
}
.site-msg.information a:hover { opacity: 0.7 !important; }
.site-msg.information .close-message,
.site-msg.information .close {
  color: #9A7236 !important;
  opacity: 0.5 !important;
  font-weight: 300 !important;
  cursor: pointer !important;
}
.site-msg.information .close-message:hover,
.site-msg.information .close:hover { opacity: 1 !important; }

/* ── Header — vzdušný, krémový ── */
#header {
  background-color: #FFF8F0 !important;
  background: #FFF8F0 !important;
  border-bottom: none !important;
  box-shadow: none !important;
}
#header .header-top {
  background-color: #FFF8F0 !important;
  background: #FFF8F0 !important;
}
#header .header-top-wrapper,
#header .container {
  background-color: #FFF8F0 !important;
  background: #FFF8F0 !important;
}
/* Desktop padding */
@media (min-width: 768px) {
  #header .header-top {
    padding: 40px 0 12px !important;
    transition: padding 0.4s ease !important;
  }
  #header.scrolled .header-top { padding: 16px 0 8px !important; }
}

/* Navigace — krémové pozadí */
#navigation,
#navigation .navigation-in,
#navigation .navigation-in > ul,
#navigation .navigation-in.menu {
  background-color: #FFF8F0 !important;
  background: #FFF8F0 !important;
}
#navigation {
  border-top: none !important;
  border-bottom: none !important;
  padding-bottom: 20px !important;
}
/* Logo */
#header .site-name a img,
#header .logo a img {
  max-height: 70px !important;
  transition: max-height 0.4s ease !important;
}
#header.scrolled .site-name a img,
#header.scrolled .logo a img { max-height: 44px !important; }

/* Navigace — Montserrat, zlatá */
#navigation .navigation-in > ul > li > a {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  color: #9A7236 !important;
  padding: 16px 22px !important;
  opacity: 0.85 !important;
  transition: opacity 0.3s ease !important;
}
#navigation .navigation-in > ul > li > a:hover,
#navigation .navigation-in > ul > li.active > a {
  color: #9A7236 !important;
  opacity: 1 !important;
}
#navigation .navigation-in > ul > li > a::after {
  background-color: #9A7236 !important;
}
/* Scrolled header */
#header.scrolled,
#header.scrolled .header-top,
#header.scrolled .header-top-wrapper,
#header.scrolled .container {
  background-color: rgba(255, 248, 240, 0.97) !important;
  background: rgba(255, 248, 240, 0.97) !important;
}
#header.scrolled {
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  box-shadow: 0 1px 0 rgba(154, 114, 54, 0.08) !important;
}
/* Ikony headeru — zlatá */
#header svg, #header path, #header circle, #header line, #header polyline {
  fill: #9A7236 !important;
  stroke: #9A7236 !important;
}
#header a { color: #9A7236 !important; }
/* Header-top children — transparent (cream z parenta prosvítá) */
/* NESMÍ být #header * — to rozbije dropdowny, cart popup, search overlay! */
#header .header-top > *,
#header .header-top-wrapper,
#header .logo,
#header .site-name,
#header .navigation-tools,
#header .navigation-tools > *,
#header .navigation-buttons,
#header .navigation-buttons > *,
#header .user-action,
#header .search-form,
#header .cart-count {
  background-color: transparent !important;
}
#header, #navigation {
  background-color: #FFF8F0 !important;
  background: #FFF8F0 !important;
}
/* Dropdowny/popupy/overlaye — cream pozadí + viditelné close tlačítko */
#header .login-form,
#header .cart-content,
#header .search-results,
#header .popup-window,
#header .dropdown-content,
#header [class*="dropdown"],
#header [class*="popup"],
#header [class*="login"],
.login-window,
.cart-layer,
.search-suggest,
.search-layer,
.search-layer-content,
.cart-layer-content,
#search,
#search-results,
.popup-window,
.popup-content {
  background-color: #FFF8F0 !important;
  background: #FFF8F0 !important;
}
/* Mobilní fullscreen overlaye — musí mít solid pozadí a viditelné zavírání */
.search-layer,
.cart-layer,
.login-layer,
.popup-window,
[class*="-layer"] {
  background-color: #FFF8F0 !important;
}
/* Close/zpět tlačítka v overlayích — MUSÍ být viditelná */
.search-layer .close,
.cart-layer .close,
.login-layer .close,
.popup-window .close,
[class*="-layer"] .close,
[class*="-layer"] .back,
.close-layer,
.close-popup,
a.close {
  color: #9A7236 !important;
  opacity: 1 !important;
  visibility: visible !important;
  display: block !important;
  z-index: 10000 !important;
  pointer-events: auto !important;
}
/* Text v overlayích — čitelný */
.search-layer a,
.cart-layer a,
.popup-window a {
  color: #9A7236 !important;
}
.search-layer input,
.cart-layer input,
.popup-window input {
  background-color: #fff !important;
  color: #333 !important;
}
/* Tlačítka v overlayích a košíku — bílý text na barevném pozadí */
.cart-layer .btn,
.cart-layer button,
.cart-layer input[type="submit"],
.cart-layer a.btn,
.cart-layer .cart-summary a,
.cart-layer .cart-action a,
#header .btn,
#header button:not(.close-message),
.popup-window .btn,
.popup-window button,
.login-window .btn,
.login-window button {
  color: #fff !important;
}
/* Info bar — gradient MUSI prezit i uvnitr #header (nez ho JS presune) */
#header .site-msg.information,
.overall-wrapper > .site-msg.information,
.site-msg.information {
  background: linear-gradient(135deg, #F3CDC4 0%, #DFD290 35%, #F1E0B2 65%, #E5D9E5 100%) !important;
  background-color: transparent !important;
}

/* ── Mobile menu — kompaktní, bez rámečků ── */
#navigation .navigation-in > ul > li,
#navigation .navigation-in > ul.menu-level-1 > li,
#navigation .navigation-in.menu > ul > li {
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}
#navigation .navigation-in > ul > li > a,
#navigation .navigation-in > ul.menu-level-1 > li > a {
  padding: 10px 20px !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: #9A7236 !important;
  border-bottom: 1px solid rgba(154,114,54,0.1) !important;
}
/* Podkategorie — Marcellus */
#navigation .menu-level-2 > li > div > a,
#navigation .menu-level-2 > li > div,
#navigation .menu-level-2 a,
#navigation .navigation-in .menu-level-2 a {
  font-family: 'Marcellus', serif !important;
  color: #9A7236 !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
  opacity: 0.7 !important;
}
#navigation .menu-level-2 > li {
  padding: 4px 20px 4px 36px !important;
  border: none !important;
  margin: 0 !important;
}
#navigation .menu-level-2 > li > a.menu-image { display: none !important; }
#navigation .menu-level-2 a:hover { opacity: 1 !important; }
#navigation .navigation-in ul ul,
#navigation .navigation-in .menu-level-2 {
  border: none !important;
  box-shadow: none !important;
  background: #FFF8F0 !important;
}

/* ── MOBIL ── */
@media (max-width: 767px) {
  /* Info bar — fixed pilulka nahoře */
  .site-msg.information {
    position: fixed !important;
    top: 8px !important;
    left: 12px !important;
    right: 12px !important;
    max-width: none !important;
    width: auto !important;
    white-space: normal !important;
    font-size: 10px !important;
    letter-spacing: 0.05em !important;
    padding: 10px 20px !important;
    border-radius: 50px !important;
    margin: 0 !important;
    box-shadow: 0 4px 16px rgba(154, 114, 54, 0.2) !important;
  }
  /* Header — NE sticky (info bar je fixed, logo nesmí vykukovat) */
  #header,
  #header .header-top,
  .header-top-wrapper {
    position: relative !important;
    top: auto !important;
  }
  /* Kompaktní header na mobilu — padding pouze zde, NE v JS */
  #header,
  body #header,
  body.mobile #header {
    padding: 0 !important;
    margin: 0 !important;
  }
  #header .header-top,
  body #header .header-top,
  body.mobile #header .header-top {
    padding: 6px 0 4px !important;
    margin: 0 !important;
    transition: none !important;
  }
  #header .site-name a img,
  #header .logo a img {
    max-height: 52px !important;
  }
}