/* Best Collections — premium navigation, submenu and mega-menu styling. */
:root {
  --bc-nav-forest: #244b37;
  --bc-nav-forest-deep: #173729;
  --bc-nav-sage: #edf3e9;
  --bc-nav-sage-strong: #dce8d8;
  --bc-nav-cream: #fffdf8;
  --bc-nav-gold: #c9a05b;
  --bc-nav-line: #e1e8de;
  --bc-nav-muted: #627168;
  --bc-nav-shadow: 0 18px 42px rgba(28, 54, 39, .14);
}

/* Keep the existing logo and header structure; refine the surface only. */
#header .header-wrapper,
#header .header-main,
#header .header-bottom {
  background-color: var(--bc-nav-cream);
}

#header .header-wrapper {
  border-bottom: 1px solid rgba(36, 75, 55, .10);
}

#header .header-nav-main {
  align-items: center;
  gap: 3px;
}

#header .header-nav-main > li {
  margin: 0 2px;
}

#header .header-nav-main > li > a.nav-top-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 42px;
  padding: 10px 15px !important;
  border-radius: 999px;
  color: #344c3e !important;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .055em;
  line-height: 1.2;
  text-transform: uppercase;
  transition: background-color .2s ease, color .2s ease, box-shadow .2s ease, transform .2s ease;
}

#header .header-nav-main > li > a.nav-top-link::before {
  position: absolute;
  right: 16px;
  bottom: 5px;
  left: 16px;
  height: 2px;
  border-radius: 2px;
  background: var(--bc-nav-gold);
  content: "";
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .2s ease;
}

#header .header-nav-main > li:hover > a.nav-top-link,
#header .header-nav-main > li:focus-within > a.nav-top-link,
#header .header-nav-main > li.current-menu-item > a.nav-top-link,
#header .header-nav-main > li.current-menu-ancestor > a.nav-top-link,
#header .header-nav-main > li.active > a.nav-top-link {
  color: var(--bc-nav-forest-deep) !important;
  background: var(--bc-nav-sage);
  box-shadow: inset 0 0 0 1px rgba(36, 75, 55, .06);
}

#header .header-nav-main > li:hover > a.nav-top-link::before,
#header .header-nav-main > li:focus-within > a.nav-top-link::before,
#header .header-nav-main > li.current-menu-item > a.nav-top-link::before,
#header .header-nav-main > li.current-menu-ancestor > a.nav-top-link::before,
#header .header-nav-main > li.active > a.nav-top-link::before {
  transform: scaleX(1);
}

#header .header-nav-main > li > a.nav-top-link .icon-angle-down,
#header .header-nav-main > li > a.nav-top-link .icon-angle-up,
#header .header-nav-main > li > a.nav-top-link .ux-menu-icon {
  margin-left: 1px;
  color: #839384;
  font-size: 11px;
  transition: color .2s ease, transform .2s ease;
}

#header .header-nav-main > li:hover > a.nav-top-link .icon-angle-down,
#header .header-nav-main > li:focus-within > a.nav-top-link .icon-angle-down {
  color: var(--bc-nav-forest);
  transform: rotate(180deg);
}

/* All dropdowns share one polished panel style; menu items and URLs remain intact. */
#header .header-nav-main .nav-dropdown,
#header .header-nav-main .sub-menu {
  padding: 13px;
  border: 1px solid var(--bc-nav-line);
  border-top: 3px solid var(--bc-nav-gold);
  border-radius: 0 0 16px 16px;
  background: var(--bc-nav-cream);
  box-shadow: var(--bc-nav-shadow);
}

#header .header-nav-main .nav-dropdown li,
#header .header-nav-main .sub-menu li {
  position: relative;
  margin: 0;
}

#header .header-nav-main .nav-dropdown li > a,
#header .header-nav-main .sub-menu li > a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 38px;
  padding: 10px 12px;
  border: 0 !important;
  border-radius: 9px;
  color: #4c5d51;
  font-size: 13px;
  font-weight: 550;
  line-height: 1.45;
  text-transform: none;
  white-space: normal;
  transition: color .18s ease, background-color .18s ease, padding-left .18s ease;
}

#header .header-nav-main .nav-dropdown li > a:hover,
#header .header-nav-main .nav-dropdown li > a:focus-visible,
#header .header-nav-main .sub-menu li > a:hover,
#header .header-nav-main .sub-menu li > a:focus-visible {
  padding-left: 16px;
  color: var(--bc-nav-forest-deep) !important;
  background: var(--bc-nav-sage);
}

#header .header-nav-main .nav-dropdown li.current-menu-item > a,
#header .header-nav-main .nav-dropdown li.current-menu-ancestor > a,
#header .header-nav-main .sub-menu li.current-menu-item > a,
#header .header-nav-main .sub-menu li.current-menu-ancestor > a {
  color: var(--bc-nav-forest-deep) !important;
  background: #e6eee2;
  font-weight: 750;
}

/* Category/column headings inside the existing Templates mega menu. */
#header .header-nav-main .nav-dropdown .menu-item-has-children > a:not(.nav-top-link),
#header .header-nav-main .sub-menu .menu-item-has-children > a:not(.nav-top-link) {
  margin: 3px 0 5px;
  padding: 11px 12px;
  border-left: 3px solid var(--bc-nav-gold) !important;
  border-radius: 4px 9px 9px 4px;
  color: var(--bc-nav-forest-deep) !important;
  background: #f0f4ec;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 14px;
  font-weight: 700;
}

/* Mega menu: richer canvas and clearer separation between configured columns. */
#header .header-nav-main > li.menu-item-design-full-width > .nav-dropdown,
#header .header-nav-main > li.menu-item-design-container-width > .nav-dropdown,
#header .header-nav-main > li.menu-item-design-full-width > .sub-menu,
#header .header-nav-main > li.menu-item-design-container-width > .sub-menu {
  padding: 24px clamp(18px, 2.5vw, 38px);
  border-top-width: 4px;
  border-radius: 0 0 20px 20px;
  background: linear-gradient(145deg, #fffdf8 0%, #f7f8f2 100%);
  box-shadow: 0 22px 54px rgba(24, 52, 36, .16);
}

#header .header-nav-main .nav-dropdown .row,
#header .header-nav-main .sub-menu .row {
  align-items: flex-start;
}

#header .header-nav-main .nav-dropdown .col-inner,
#header .header-nav-main .sub-menu .col-inner {
  min-height: 100%;
}

#header .header-nav-main .nav-dropdown .nav-column > li,
#header .header-nav-main .nav-dropdown .menu-item,
#header .header-nav-main .sub-menu .menu-item {
  list-style: none;
}

#header .header-nav-main .nav-dropdown .nav-column > li > a {
  margin: 2px 0;
}

/* Nested submenus remain legible and visually connected to their parent item. */
#header .header-nav-main .nav-dropdown ul.nav-dropdown,
#header .header-nav-main .sub-menu ul.sub-menu {
  margin-top: -2px;
  border-top-width: 2px;
  border-radius: 12px;
  background: #fffefa;
  box-shadow: 0 12px 28px rgba(24, 52, 36, .13);
}

#header .header-nav-main .nav-dropdown .ux-menu-link__link,
#header .header-nav-main .nav-dropdown .ux-menu-link > a {
  border-radius: 9px;
}

#header a:focus-visible,
#header button:focus-visible {
  outline: 2px solid var(--bc-nav-gold);
  outline-offset: 3px;
}

/* Off-canvas/mobile navigation: keep the same palette without desktop pills. */
#main-menu .nav-vertical > li > a,
.mobile-sidebar .nav-vertical > li > a,
.off-canvas .nav-vertical > li > a {
  min-height: 46px;
  padding: 12px 14px;
  border-bottom: 1px solid rgba(36, 75, 55, .09);
  color: var(--bc-nav-forest-deep);
  font-size: 13px;
  font-weight: 750;
  letter-spacing: .035em;
  text-transform: uppercase;
}

#main-menu .nav-vertical .nav-dropdown,
.mobile-sidebar .nav-vertical .nav-dropdown,
.off-canvas .nav-vertical .nav-dropdown,
#main-menu .nav-vertical .sub-menu,
.mobile-sidebar .nav-vertical .sub-menu,
.off-canvas .nav-vertical .sub-menu {
  padding: 7px 9px;
  border: 1px solid var(--bc-nav-line);
  border-left: 3px solid var(--bc-nav-gold);
  border-radius: 0 0 12px 12px;
  background: #f8faf5;
  box-shadow: none;
}

#main-menu .nav-vertical .nav-dropdown li > a,
.mobile-sidebar .nav-vertical .nav-dropdown li > a,
.off-canvas .nav-vertical .nav-dropdown li > a,
#main-menu .nav-vertical .sub-menu li > a,
.mobile-sidebar .nav-vertical .sub-menu li > a,
.off-canvas .nav-vertical .sub-menu li > a {
  padding: 10px 12px;
  border-radius: 8px;
  color: #4c5d51;
  font-size: 13px;
  line-height: 1.45;
  white-space: normal;
}

#main-menu .nav-vertical .nav-dropdown li > a:hover,
.mobile-sidebar .nav-vertical .nav-dropdown li > a:hover,
.off-canvas .nav-vertical .nav-dropdown li > a:hover,
#main-menu .nav-vertical .sub-menu li > a:hover,
.mobile-sidebar .nav-vertical .sub-menu li > a:hover,
.off-canvas .nav-vertical .sub-menu li > a:hover {
  color: var(--bc-nav-forest-deep);
  background: var(--bc-nav-sage);
}

@media (max-width: 849px) {
  #header .header-nav-main > li > a.nav-top-link {
    min-height: 44px;
    padding: 10px 13px !important;
  }

  #header .header-nav-main > li.menu-item-design-full-width > .nav-dropdown,
  #header .header-nav-main > li.menu-item-design-container-width > .nav-dropdown,
  #header .header-nav-main > li.menu-item-design-full-width > .sub-menu,
  #header .header-nav-main > li.menu-item-design-container-width > .sub-menu {
    padding: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  #header .header-nav-main > li > a.nav-top-link,
  #header .header-nav-main > li > a.nav-top-link::before,
  #header .header-nav-main .nav-dropdown li > a,
  #header .header-nav-main .sub-menu li > a {
    transition: none !important;
  }
}