/*  Rose Couture — header
    Strategy: CSS-only transform over Flatsome's default header markup.
    User-configured Flatsome customizer options remain authoritative;
    this file restyles the visual layer only.  */

/* ---- Atelier top bar (our injection) ------------------------------- */
.wml-topbar {
  background: var(--wml-ink);
  border-bottom: 1px solid rgba(255, 251, 245, 0.08);
  color: var(--wml-bg);
}
.wml-topbar__inner {
  max-width: var(--wml-page-max);
  margin: 0 auto;
  padding: 0.55rem var(--wml-gutter);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

/* Rotating ticker — CSS-only cycle through messages */
.wml-topbar__ticker {
  position: relative;
  flex: 1;
  height: 1.2rem;
  overflow: hidden;
}
.wml-topbar__msg {
  position: absolute;
  inset: 0;
  font-family: var(--wml-font-heading);
  text-transform: uppercase;
  letter-spacing: 0.22em;
  font-size: 0.74rem;
  font-weight: 500;
  color: rgba(255, 251, 245, 0.92);
  opacity: 0;
  transform: translateY(6px);
  transition: opacity 700ms var(--wml-ease), transform 700ms var(--wml-ease);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wml-topbar__msg:nth-child(1) { animation: wmlTopMsg 18s infinite both; animation-delay: 0s; }
.wml-topbar__msg:nth-child(2) { animation: wmlTopMsg 18s infinite both; animation-delay: 6s; }
.wml-topbar__msg:nth-child(3) { animation: wmlTopMsg 18s infinite both; animation-delay: 12s; }

@keyframes wmlTopMsg {
  0%           { opacity: 0; transform: translateY(8px); }
  3%           { opacity: 1; transform: translateY(0); }
  30%          { opacity: 1; transform: translateY(0); }
  33%          { opacity: 0; transform: translateY(-8px); }
  100%         { opacity: 0; transform: translateY(8px); }
}

.wml-topbar__right {
  font-family: var(--wml-font-heading);
  text-transform: uppercase;
  letter-spacing: 0.22em;
  font-size: 0.74rem;
  font-weight: 500;
  color: rgba(255, 251, 245, 0.85);
  white-space: nowrap;
}
.wml-topbar__right a {
  color: inherit;
  background-image: none;
}
.wml-topbar__right a:hover,
.wml-topbar__right a:focus-visible { color: var(--wml-gilt); }
.wml-topbar__sep { color: rgba(255, 251, 245, 0.35); margin: 0 0.5rem; }

@media (max-width: 48em) {
  .wml-topbar__inner { padding: 0.45rem 1rem; gap: 0.75rem; }
  .wml-topbar__ticker { display: none; }
  .wml-topbar__right { margin: 0 auto; font-size: 0.68rem; }
}

@media (prefers-reduced-motion: reduce) {
  .wml-topbar__msg { animation: none; opacity: 1; transform: none; }
  .wml-topbar__msg:nth-child(n+2) { display: none; }
}

/* ---- Hide Flatsome's default top bar (we provide our own) --------- */
#top-bar { display: none !important; }

/* ---- Flatsome header main — atelier treatment --------------------- */
.header-main,
.stuck .header-main {
  background: var(--wml-bg) !important;
  border-bottom: var(--wml-hairline-rule);
  transition: background var(--wml-dur-base) var(--wml-ease);
}
.stuck .header-main {
  background: rgba(247, 239, 232, 0.96) !important;
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
}

/* Soft remove Flatsome's default header divider line we're replacing */
.header .top-divider { background: var(--wml-hairline) !important; }

/* Logo spacing */
#logo a { background-image: none; }
#logo img {
  max-height: 44px;
  width: auto;
  transition: opacity var(--wml-dur-base) var(--wml-ease);
}
#logo a:hover img { opacity: 0.85; }

/* ---- Primary navigation — kerned small caps ----------------------- */
.header-nav-main > li > a,
.header-nav .nav-top-link,
.nav > li > a {
  font-family: var(--wml-font-heading) !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.20em !important;
  font-size: 0.9rem !important;
  color: var(--wml-ink) !important;
  padding: 10px 18px !important;
  background-image: none !important;
  text-shadow: none;
}
.header-nav-main > li > a:hover,
.nav > li > a:hover {
  color: var(--wml-accent) !important;
}

/* Transparent-header templates: nav over dark hero — use warm white,
   and add a soft top-to-transparent gradient behind the header so the
   nav always has a readable backdrop (Dior/LV-style). */

.has-transparent .header-wrapper::before,
body.page-template-page-transparent-header-light .header-wrapper::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 180px;
  background: linear-gradient(180deg,
                rgba(13, 13, 13, 0.55) 0%,
                rgba(13, 13, 13, 0.35) 40%,
                rgba(13, 13, 13, 0) 100%);
  pointer-events: none;
  z-index: 0;
  transition: opacity var(--wml-dur-base) var(--wml-ease);
}
.has-transparent.scrolled .header-wrapper::before,
.has-transparent.stuck .header-wrapper::before {
  opacity: 0;
}
.has-transparent .header-wrapper { position: relative; }
.has-transparent .header { position: relative; z-index: 1; }

.has-transparent:not(.scrolled):not(.stuck) .header-nav-main > li > a,
.has-transparent:not(.scrolled):not(.stuck) .nav > li > a,
.has-transparent:not(.scrolled):not(.stuck) .header-cart-link,
.has-transparent:not(.scrolled):not(.stuck) #logo a {
  color: var(--wml-white) !important;
  font-weight: 700 !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.55),
               0 0 18px rgba(0, 0, 0, 0.35);
}
.has-transparent:not(.scrolled):not(.stuck) .header-nav-main > li > a:hover,
.has-transparent:not(.scrolled):not(.stuck) .nav > li > a:hover {
  color: var(--wml-gilt) !important;
}

/* Hover hairline underline colour on transparent pages → gilt */
.has-transparent:not(.scrolled):not(.stuck) .header-nav-main > li > a::after,
.has-transparent:not(.scrolled):not(.stuck) .nav > li > a::after {
  background: var(--wml-gilt);
}

/* Cart icon + count badge on transparent header */
.has-transparent:not(.scrolled):not(.stuck) .cart-icon strong {
  color: var(--wml-white) !important;
  border-color: var(--wml-white) !important;
}

/* When stuck / scrolled, return to ink on blush */
.stuck .header-nav-main > li > a,
.stuck .nav > li > a,
.scrolled .header-nav-main > li > a,
.scrolled .nav > li > a {
  color: var(--wml-ink) !important;
  text-shadow: none;
}

/* Subtle hairline on hover (replaces Flatsome's bar) */
.header-nav-main > li > a::after,
.nav > li > a::after {
  content: "";
  display: block;
  height: 1px;
  width: 0;
  background: var(--wml-accent);
  margin: 4px auto -4px;
  transition: width var(--wml-dur-base) var(--wml-ease);
}
.header-nav-main > li:hover > a::after,
.header-nav-main > li.active > a::after,
.nav > li:hover > a::after,
.nav > li.active > a::after {
  width: 24px;
}

/* ---- Mega/dropdown menu styling ----------------------------------- */
.nav-dropdown,
.nav-dropdown.has-border,
.nav-dropdown-default {
  background: var(--wml-bg) !important;
  border: var(--wml-hairline-rule) !important;
  box-shadow: var(--wml-shadow-lift) !important;
  padding: 1.25rem 1.5rem !important;
  min-width: 240px;
  border-radius: 0 !important;
}
.nav-dropdown a,
.nav-dropdown li > a {
  font-family: var(--wml-font-body) !important;
  text-transform: none !important;
  letter-spacing: 0.01em !important;
  font-size: var(--wml-size-sm) !important;
  color: var(--wml-ink-soft) !important;
  padding: 8px 12px !important;
  background-image: none !important;
}
.nav-dropdown a:hover,
.nav-dropdown li > a:hover {
  color: var(--wml-accent) !important;
  background: var(--wml-bg-deep) !important;
}

/* ---- Cart icon refinement ----------------------------------------- */
.header-cart-link,
.cart-item a,
.header-cart-title {
  color: var(--wml-ink) !important;
  background-image: none !important;
}
.header-cart-link:hover { color: var(--wml-accent) !important; }

/* The cart count badge */
.cart-item .cart-icon-label {
  background: var(--wml-accent) !important;
  color: var(--wml-white) !important;
  font-family: var(--wml-font-heading) !important;
  letter-spacing: 0.08em !important;
  border-radius: 0 !important;
}
.cart-icon strong {
  background: transparent !important;
  color: var(--wml-ink) !important;
  border-color: var(--wml-ink) !important;
}

/* Mini-cart dropdown */
.cart-popup {
  background: var(--wml-bg) !important;
  color: var(--wml-ink) !important;
  border: var(--wml-hairline-rule);
  box-shadow: var(--wml-shadow-lift);
}

/* ---- Search -------------------------------------------------------- */
.header-search-form input[type="search"],
.searchform input[type="search"] {
  background: transparent;
  border: 0 !important;
  border-bottom: 1px solid var(--wml-hairline) !important;
  border-radius: 0 !important;
  color: var(--wml-ink);
  padding: 0.75rem 0 !important;
}
.header-search-form input[type="search"]:focus,
.searchform input[type="search"]:focus {
  border-bottom-color: var(--wml-accent) !important;
}
.searchform-wrapper button { background: transparent !important; color: var(--wml-ink) !important; }

/* ---- Mobile nav drawer -------------------------------------------- */
.sidebar-menu,
.mfp-container .mobile-sidebar {
  background: var(--wml-bg) !important;
  color: var(--wml-ink) !important;
}
.mobile-sidebar .nav-vertical > li > a,
.mobile-nav a {
  font-family: var(--wml-font-heading) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.2em !important;
  font-size: 0.85rem !important;
  color: var(--wml-ink) !important;
}
.mobile-sidebar .nav-vertical li + li { border-top: 1px solid var(--wml-hairline); }

/* ---- Language / currency switchers (if any) ----------------------- */
.header .header-nav a.text-lowercase,
.header .header-nav a[href*="lang"],
.header .header-nav a[href*="currency"] {
  letter-spacing: 0.2em !important;
  font-size: 0.7rem !important;
}

/* ---- Respect Flatsome's "transparent header" page template -------- */
.page-template-page-transparent-header-light .header-main {
  background: transparent !important;
  border-bottom: 0;
}
.page-template-page-transparent-header-light.scrolled .header-main {
  background: rgba(247, 239, 232, 0.96) !important;
  border-bottom: var(--wml-hairline-rule);
}