/* ===== Announcement / top bar ===== */
#top-bar.header-top {
  background-color: var(--bsx-announce-bg);
  min-height: 0;
}
#top-bar .nav > li > a,
#top-bar .nav > li,
#top-bar .html {
  color: var(--bsx-announce-text);
  font-family: var(--bsx-font-body);
  font-size: 12px;
  letter-spacing: 0.06em;
  text-transform: none;
}
#top-bar .flex-row { padding-top: 4px; padding-bottom: 4px; }

@media (max-width: 849px) {
  #top-bar .nav > li.html,
  #top-bar .html { font-size: 10px; letter-spacing: 0.03em; }
}

/* ===== Header main ===== */
/* design 6B desktop: 72px edge padding, logo→nav 40px, 22px link gap, 20px icon gap */
.header-main { background-color: #fff; }
.header-main .header-inner { padding: 0 20px; }

@media (min-width: 850px) {
  .header-main .header-inner { padding: 0 72px; }
  .header-inner #logo { margin-right: 40px; }
  .header-nav-main.nav-left > li,
  .header-nav-main.nav-right > li { margin: 0 22px 0 0; }
  .header-main .flex-right .header-nav-main.nav > li { margin: 0 0 0 20px; }
}

/* hairline divider under header */
.header-main .top-divider { border-color: var(--bsx-border); }

/* logo size (parent sets max-height from header_height; .stuck adds !important) */
#logo img,
.stuck #logo img { max-height: 24px !important; width: auto; }

/* nav links */
.header-nav .nav-top-link,
.header-nav > li > a {
  color: var(--bsx-text);
  font-size: 12px;
  letter-spacing: 0.05em;
  font-weight: 400;
}
.header-nav > li > a:hover { color: var(--bsx-mauve); }

/* NEW / SALE accents (CSS class set on the menu items).
   Selector mirrors Flatsome's generated type_nav_color rule so it wins. */
.header:not(.transparent) .header-nav-main.nav > li.bsx-accent > a,
.header-nav > li.bsx-accent > a {
  color: var(--bsx-mauve);
  font-weight: 600;
}

/* cart count badge — Flatsome renders count as [data-icon-label]::after */
.header-main [data-icon-label]::after {
  background-color: var(--bsx-mauve);
  color: #fff;
  font-family: var(--bsx-font-body);
  font-weight: 700;
}

/* search + cart icons: design SVGs (assets/images), replacing the fl-icons
   glyph and the uploaded cart image. Badge ::after keeps working — it sits
   on the .header-cart-icon span, not the img. */
.header .icon-search {
  background: url(../images/bsx-search.svg) center / 17px 17px no-repeat;
  display: inline-block;
  width: 20px;
  height: 20px;
  vertical-align: middle;
}
.header .icon-search::before { content: none; }

.header .header-cart-icon {
  background: url(../images/bsx-bag.svg) center / 18px 18px no-repeat;
  display: inline-block;
  width: 22px;
  height: 22px;
}
.header .header-cart-icon img.cart-img-icon { display: none; }

/* rounded quiet search field */
.searchform .search-field {
  background-color: var(--bsx-search-bg);
  border: 1px solid var(--bsx-border-input);
  border-radius: 26px;
  font-family: var(--bsx-font-body);
  font-size: 14px;
  color: var(--bsx-ink);
  padding-left: 20px;
}
.searchform .search-field::placeholder { color: #8a8578; }
.searchform .submit-button { border-radius: 0 26px 26px 0; }

/* ===== Mobile header ===== */
@media (max-width: 849px) {
  #logo img { max-height: 20px !important; }
}

/* ===== Mobile menu drawer ===== */
.mobile-sidebar { background-color: #fff; }

.mobile-sidebar .nav-sidebar > li > a {
  font-family: var(--bsx-font-heading);
  font-size: 26px;
  font-weight: 500;
  color: var(--bsx-ink);
  text-transform: none;
  letter-spacing: 0;
  padding: 16px 0;
}
.mobile-sidebar .nav-sidebar > li {
  border-bottom: 1px solid #f1ece3;
}
.mobile-sidebar .nav-sidebar > li.bsx-accent > a {
  color: var(--bsx-mauve);
}