:root {
  --ss-bg: #f7f3ea;
  --ss-surface: #ffffff;
  --ss-surface-soft: #fbf8f2;
  --ss-ink: #1f2940;
  --ss-ink-soft: #4f5b73;
  --ss-brand: #24375f;
  --ss-brand-deep: #192846;
  --ss-accent: #c89b4a;
  --ss-accent-soft: #ead4a7;
  --ss-border: #e7dcc7;
  --ss-shadow: 0 16px 40px rgba(26, 40, 70, 0.08);
}

body {
  background: linear-gradient(180deg, #fcfaf6 0%, var(--ss-bg) 100%);
  color: var(--ss-ink);
}

#page {
  background: transparent;
}

#topbar {
  background: linear-gradient(90deg, var(--ss-brand-deep) 0%, var(--ss-brand) 100%);
  color: rgba(255, 255, 255, 0.88);
  line-height: 42px;
  min-height: 42px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

#topbar .container,
#header-main .container {
  background: transparent;
}

#topbar .links {
  padding: 0;
}

#topbar a,
#topbar .container a {
  color: rgba(255, 255, 255, 0.9);
  transition: color 0.25s ease;
}

#topbar a:hover,
#topbar a:focus {
  color: var(--ss-accent-soft);
}

#header-main {
  background: rgba(255, 255, 255, 0.96);
  border-bottom: 1px solid var(--ss-border);
  box-shadow: 0 12px 30px rgba(26, 40, 70, 0.06);
}

.top {
  position: sticky;
  top: 0;
  z-index: 50;
}

#header_logo {
  padding: 14px 0;
}

#header_logo img {
  max-height: 72px;
}

#leo-megamenu {
  background: linear-gradient(90deg, var(--ss-brand-deep) 0%, var(--ss-brand) 100%);
  color: #ffffff;
  border-radius: 20px;
  box-shadow: 0 14px 28px rgba(25, 40, 70, 0.14);
}

#leo-megamenu .navbar {
  min-height: 72px;
}

#cavas_menu.navbar {
  margin-bottom: 0;
}

#leo-top-menu {
  padding: 10px 14px;
}

#leo-megamenu .navbar-nav {
  float: right;
}

#leo-megamenu .navbar-nav > li {
  margin: 0 4px;
  position: relative;
}

#leo-megamenu .navbar-nav > li > a {
  color: rgba(255, 255, 255, 0.96);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.01em;
  padding: 14px 16px;
  border-radius: 999px;
  transition: color 0.25s ease, background-color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}

#leo-megamenu .navbar-nav > li > a:hover,
#leo-megamenu .navbar-nav > li > a:focus,
#leo-megamenu .navbar-nav > li.active > a,
#leo-megamenu .navbar-nav > li.active > a:hover,
#leo-megamenu .navbar-nav > li.active > a:focus,
#leo-megamenu .dropdown:hover > a {
  color: #ffffff !important;
  background: rgba(200, 155, 74, 0.24);
  box-shadow: inset 0 0 0 1px rgba(234, 212, 167, 0.22);
  transform: translateY(-1px);
}

#leo-megamenu .navbar-nav > li > a:after {
  display: none;
}

#leo-megamenu .navbar-nav > li > .caret,
#leo-megamenu .navbar-nav > li:hover > .caret,
#leo-megamenu .navbar-nav > li.active > .caret {
  color: var(--ss-accent-soft);
}

#leo-megamenu .dropdown-menu {
  margin-top: 0;
  min-width: 220px;
  padding: 18px 22px;
  background: rgba(255, 255, 255, 0.98);
  border: 1px solid rgba(231, 220, 199, 0.95);
  border-radius: 20px;
  box-shadow: var(--ss-shadow);
}

#leo-megamenu .dropdown:hover > .dropdown-menu {
  top: 100%;
}

#leo-megamenu .dropdown-menu li {
  padding: 4px 0;
}

#leo-megamenu .dropdown-menu li a {
  color: var(--ss-brand) !important;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.7;
}

#leo-megamenu .dropdown-menu li a:before {
  color: var(--ss-accent);
  padding-left: 8px;
}

#leo-megamenu .dropdown-menu li a:hover,
#leo-megamenu .dropdown-menu li a:focus {
  color: var(--ss-brand-deep) !important;
  background: transparent;
}

#leo-megamenu .dropdown-menu .menu-title {
  color: var(--ss-ink);
  border-bottom: 1px solid var(--ss-border);
  padding-bottom: 8px;
  margin-bottom: 12px;
}

#header .cart_block,
#header .shopping_cart > a,
#search_block_top .btn,
#search_block_top .button-search,
.button,
.btn,
.exclusive,
.exclusive-medium,
.exclusive-large {
  border-radius: 999px;
}

@media (max-width: 991px) {
  #header_logo {
    padding: 10px 0;
  }

  #leo-megamenu {
    border-radius: 16px;
  }

  #leo-megamenu .navbar {
    min-height: auto;
  }

  #leo-top-menu {
    padding: 0 10px 10px;
  }

  #cavas_menu .navbar-toggle {
    margin-top: 18px;
    border-color: var(--ss-border);
    background: var(--ss-surface-soft);
    border-radius: 14px;
    padding: 10px 12px;
  }

  #cavas_menu .navbar-toggle .icon-bar {
    background-color: var(--ss-brand);
  }

  #leo-megamenu .navbar-nav {
    float: none;
  }

  #leo-megamenu .navbar-nav > li {
    margin: 0;
  }

  #leo-megamenu .navbar-nav > li > a {
    border-radius: 14px;
    margin-bottom: 4px;
  }

  #leo-megamenu .dropdown-menu {
    margin-top: 6px;
    border-radius: 16px;
    box-shadow: none;
  }
}

#leo-megamenu .navbar-nav > li > a,
#leo-megamenu .navbar-nav > li > a .menu-title,
#leo-megamenu .navbar-nav > li > a .fa,
#leo-megamenu .navbar-nav > li > a span {
  color: rgba(255, 255, 255, 0.96) !important;
}

#leo-megamenu .navbar-nav > li > a:hover,
#leo-megamenu .navbar-nav > li > a:hover .menu-title,
#leo-megamenu .navbar-nav > li > a:hover .fa,
#leo-megamenu .navbar-nav > li.active > a,
#leo-megamenu .navbar-nav > li.active > a .menu-title,
#leo-megamenu .navbar-nav > li.active > a .fa,
#leo-megamenu .dropdown:hover > a,
#leo-megamenu .dropdown:hover > a .menu-title,
#leo-megamenu .dropdown:hover > a .fa {
  color: #ffffff !important;
}

#leo-megamenu .navbar-nav > li.dropdown {
  position: relative;
}

#leo-megamenu .navbar-nav > li.dropdown:after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  height: 18px;
}

#leo-megamenu .dropdown-menu {
  margin-top: -2px;
}

#leo-megamenu .dropdown:hover > .dropdown-menu,
#leo-megamenu .dropdown.open > .dropdown-menu {
  display: block;
  left: 0;
  top: 100%;
}

#leo-megamenu .dropdown:hover > .dropdown-menu,
#leo-megamenu .dropdown.open > .dropdown-menu {
  display: block;
  top: 100%;
}

#leo-megamenu .navbar-nav > li.aligned-fullwidth:hover > .dropdown-menu,
#leo-megamenu .navbar-nav > li.aligned-fullwidth.open > .dropdown-menu {
  left: 0;
  right: 0;
  width: 100% !important;
}

#leo-megamenu .navbar-nav > li.aligned-right:hover > .dropdown-menu,
#leo-megamenu .navbar-nav > li.aligned-right.open > .dropdown-menu {
  right: 0;
  left: auto;
}

#leo-megamenu .navbar-nav > li.aligned-left:hover > .dropdown-menu,
#leo-megamenu .navbar-nav > li.aligned-left.open > .dropdown-menu {
  left: 0;
  right: auto;
}

#leo-megamenu .navbar-nav > li.aligned-center:hover > .dropdown-menu,
#leo-megamenu .navbar-nav > li.aligned-center.open > .dropdown-menu {
  left: 50%;
  right: auto;
  transform: translate(-50%, 0);
}

/* Restore original megamenu layout behavior and remove pill backgrounds */
#leo-top-menu,
#leo-megamenu .navbar-nav {
  position: static;
}

#leo-megamenu .navbar-nav > li {
  position: static !important;
}

#leo-megamenu .navbar-nav > li > a {
  position: relative;
  background: transparent !important;
  box-shadow: none !important;
}

#leo-megamenu .navbar-nav > li > a:hover,
#leo-megamenu .navbar-nav > li > a:focus,
#leo-megamenu .navbar-nav > li.active > a,
#leo-megamenu .navbar-nav > li.active > a:hover,
#leo-megamenu .navbar-nav > li.active > a:focus,
#leo-megamenu .dropdown:hover > a {
  background: transparent !important;
  box-shadow: none !important;
}

/* Invisible bridge under the link so hover doesn't drop before the submenu */
#leo-megamenu .navbar-nav > li.dropdown > a:after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  height: 18px;
}

#leo-megamenu .dropdown-menu {
  margin-top: 0;
}

#leo-megamenu .dropdown:hover > .dropdown-menu,
#leo-megamenu .dropdown.open > .dropdown-menu {
  display: block;
  top: 100%;
}

#leo-megamenu .navbar-nav > li.aligned-fullwidth,
#leo-megamenu .navbar-nav > li.aligned-fullwidth:hover,
#leo-megamenu .navbar-nav > li.aligned-fullwidth.open {
  position: static !important;
}

#leo-megamenu .navbar-nav > li.aligned-fullwidth > .dropdown-menu,
#leo-megamenu .navbar-nav > li.aligned-fullwidth:hover > .dropdown-menu,
#leo-megamenu .navbar-nav > li.aligned-fullwidth.open > .dropdown-menu {
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
}

/* Remove the older wide hover bridge that can trigger the wrong submenu */
#leo-megamenu .navbar-nav > li.dropdown:after {
  content: none !important;
  display: none !important;
}

/* Keep top-level items transparent in all states */
#leo-megamenu .navbar-nav > li > a,
#leo-megamenu .navbar-nav > li > a:hover,
#leo-megamenu .navbar-nav > li > a:focus,
#leo-megamenu .navbar-nav > li.active > a,
#leo-megamenu .navbar-nav > li.active > a:hover,
#leo-megamenu .navbar-nav > li.active > a:focus,
#leo-megamenu .dropdown:hover > a,
#leo-megamenu .dropdown.open > a {
  background: transparent !important;
  box-shadow: none !important;
}

/* Narrow hover bridge under the current link only */
#leo-megamenu .navbar-nav > li.dropdown > a:after {
  content: '';
  position: absolute;
  left: 12px;
  right: 12px;
  top: 100%;
  height: 22px;
  display: block;
}

#leo-megamenu .dropdown-menu {
  margin-top: -2px;
}

/* Simplify top menu states */
#leo-megamenu .navbar-nav > li > a,
#leo-megamenu .navbar-nav > li > a:hover,
#leo-megamenu .navbar-nav > li > a:focus,
#leo-megamenu .navbar-nav > li.active > a,
#leo-megamenu .navbar-nav > li.active > a:hover,
#leo-megamenu .navbar-nav > li.active > a:focus,
#leo-megamenu .dropdown:hover > a,
#leo-megamenu .dropdown.open > a {
  background: transparent !important;
  box-shadow: none !important;
}

/* Remove all hover bridge pseudo elements */
#leo-megamenu .navbar-nav > li.dropdown:after,
#leo-megamenu .navbar-nav > li.dropdown > a:after {
  content: none !important;
  display: none !important;
}

/* Make submenu overlap the header slightly so the mouse never crosses a gap */
#leo-megamenu .dropdown-menu,
#leo-megamenu .dropdown:hover > .dropdown-menu,
#leo-megamenu .dropdown.open > .dropdown-menu,
#leo-megamenu .navbar-nav > li.aligned-fullwidth > .dropdown-menu,
#leo-megamenu .navbar-nav > li.aligned-fullwidth:hover > .dropdown-menu,
#leo-megamenu .navbar-nav > li.aligned-fullwidth.open > .dropdown-menu {
  margin-top: 0 !important;
  top: calc(100% - 12px) !important;
}

/* Keep top-level menu items the same color as the purple menu bar */
#leo-megamenu .navbar-nav > li > a,
#leo-megamenu .navbar-nav > li > a:hover,
#leo-megamenu .navbar-nav > li > a:focus,
#leo-megamenu .navbar-nav > li.active > a,
#leo-megamenu .navbar-nav > li.active > a:hover,
#leo-megamenu .navbar-nav > li.active > a:focus,
#leo-megamenu .dropdown:hover > a,
#leo-megamenu .dropdown.open > a {
  background-color: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

/* Make the whole menu container match the purple header background */
#leo-megamenu {
  background: transparent !important;
  box-shadow: none !important;
}

/* Yellow hover/active state for top menu items */
#leo-megamenu .navbar-nav > li > a:hover,
#leo-megamenu .navbar-nav > li > a:focus,
#leo-megamenu .navbar-nav > li.active > a,
#leo-megamenu .navbar-nav > li.active > a:hover,
#leo-megamenu .navbar-nav > li.active > a:focus,
#leo-megamenu .dropdown:hover > a,
#leo-megamenu .dropdown.open > a {
  background: #f0c24f !important;
  color: #1f2940 !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

#leo-megamenu .navbar-nav > li > a:hover .menu-title,
#leo-megamenu .navbar-nav > li > a:focus .menu-title,
#leo-megamenu .navbar-nav > li.active > a .menu-title,
#leo-megamenu .dropdown:hover > a .menu-title,
#leo-megamenu .dropdown.open > a .menu-title,
#leo-megamenu .navbar-nav > li > a:hover .fa,
#leo-megamenu .navbar-nav > li > a:focus .fa,
#leo-megamenu .navbar-nav > li.active > a .fa,
#leo-megamenu .dropdown:hover > a .fa,
#leo-megamenu .dropdown.open > a .fa,
#leo-megamenu .navbar-nav > li:hover > .caret,
#leo-megamenu .navbar-nav > li.active > .caret {
  color: #1f2940 !important;
}

/* Keep header utility icons white on the purple header */
#header .shopping_cart > a,
#header .shopping_cart > a .fa,
#header .shopping_cart > a:before,
#header .header_user_info a,
#header .header_user_info a .fa,
#header .header_user_info a:before,
#header #cart .fa,
#header #cart a,
#header #cart a:before {
  color: #ffffff !important;
}

/* User dropdown submenu text should stay dark */
#header .header_user_info .dropdown-menu a,
#header .header_user_info .dropdown-menu a .fa,
#header .header_user_info .dropdown-menu li a,
#header .header_user_info .dropdown-menu li a:before {
  color: #1f2940 !important;
}

/* Stronger override: user dropdown links should be dark inside the white submenu */
#topbar .header_user_info .dropdown-menu,
#topbar .header_user_info .dropdown-menu li,
#topbar .header_user_info .dropdown-menu li a,
#topbar .header_user_info .dropdown-menu li a:link,
#topbar .header_user_info .dropdown-menu li a:visited,
#topbar .header_user_info .dropdown-menu li a .fa,
#topbar .header_user_info .dropdown-menu li a span,
#topbar .header_user_info .dropdown-menu li a:before {
  color: #1f2940 !important;
}

#topbar .header_user_info .dropdown-menu li a:hover,
#topbar .header_user_info .dropdown-menu li a:focus,
#topbar .header_user_info .dropdown-menu li a:hover .fa,
#topbar .header_user_info .dropdown-menu li a:focus .fa,
#topbar .header_user_info .dropdown-menu li a:hover span,
#topbar .header_user_info .dropdown-menu li a:focus span {
  color: #0f172a !important;
}

/* Plain white page background */
body,
#page {
  background: #ffffff !important;
}

/* Exact fix for the login item inside header dropdowns */
#header .dropdown-menu a,
#header .dropdown-menu a span,
#header .dropdown-menu a i,
#header .dropdown-menu a .fa,
#header .dropdown-menu .fa-unlock-alt,
#header .dropdown-menu .fa-unlock-alt + span {
  color: #1f2940 !important;
}

/* Exact fix for popup account links */
ul.links.popup-content li a,
ul.links.popup-content li a span,
ul.links.popup-content li a i,
ul.links.popup-content li a .fa {
  color: #1f2940 !important;
}

ul.links.popup-content li a:hover,
ul.links.popup-content li a:hover span,
ul.links.popup-content li a:hover i,
ul.links.popup-content li a:hover .fa,
ul.links.popup-content li a:focus,
ul.links.popup-content li a:focus span,
ul.links.popup-content li a:focus i,
ul.links.popup-content li a:focus .fa {
  color: #0f172a !important;
}