/* Fix dropdown hover gap */
.main-navigation ul ul,
.nav-menu ul ul,
header nav ul ul,
.menu ul ul {
  margin-top: 0 !important;
  top: 100% !important;
  padding-top: 8px !important;
}

/* Extend hover zone with invisible bridge */
.main-navigation li:hover > ul,
.nav-menu li:hover > ul,
header nav li:hover > ul,
.menu li:hover > ul {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* Add pseudo-element bridge between trigger and dropdown */
.main-navigation ul li,
.nav-menu ul li,
header nav ul li,
.menu ul li {
  position: relative;
}

.main-navigation ul li::after,
.nav-menu ul li::after,
header nav ul li::after,
.menu ul li::after {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 0;
  width: 100%;
  height: 8px;
  background: transparent;
}

/* Keep dropdown open when hovering submenu */
.main-navigation ul li:hover > ul,
.main-navigation ul ul li:hover > ul,
.nav-menu ul li:hover > ul,
header nav ul li:hover > ul {
  pointer-events: auto;
}

/* Ensure account icon renders correctly */
.ast-header-account .ahfb-svg-iconset svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
}

/* Hide broken default placeholder icon */
.ast-header-account .ahfb-svg-iconset svg[viewBox="0 0 136 96"] {
  display: none !important;
}

/* ── MOBILE HEADER FIXES ── */

@media (max-width: 1024px) {

  /* Force logo on single line */
  .site-title,
  .site-title a,
  .custom-logo-link,
  .navbar-brand,
  .site-branding .site-title,
  a.custom-logo-link,
  [class*="logo"] {
    white-space: nowrap !important;
    font-size: 1.1rem !important;
    letter-spacing: 0.2em !important;
    line-height: 1 !important;
  }

  /* If logo is text-based */
  .site-title a,
  .site-branding a {
    display: inline-block !important;
    white-space: nowrap !important;
  }

  /* Header layout — flex, single row */
  #masthead,
  .site-header,
  .header-wrap,
  .ast-header-wrap,
  header.site-header {
    padding: 0 16px !important;
    height: 60px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    background: var(--lf-warm-white, #FAF7F2) !important;
  }

  /* Branding block */
  .site-branding,
  .ast-site-identity,
  .header-logo-area,
  [class*="branding"] {
    flex-shrink: 0 !important;
    max-width: 50% !important;
  }

  /* Icons row — right side */
  .ast-header-custom-item,
  .header-icons,
  .header-widget-area,
  [class*="header-icon"],
  [class*="header-action"] {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    flex-shrink: 0 !important;
  }

  /* Individual icons sizing */
  .ast-header-custom-item svg,
  .header-icons svg,
  [class*="header-icon"] svg,
  [class*="wc-block-mini-cart"] svg,
  [class*="cart-icon"] svg {
    width: 20px !important;
    height: 20px !important;
    stroke: #1C1A16 !important;
    fill: none !important;
  }

  /* Cart counter badge */
  .woocommerce-mini-cart__total,
  .ast-cart-menu-wrap .count,
  [class*="cart-count"],
  [class*="mini-cart"] .count {
    background: #1C1A16 !important;
    color: #FAF7F2 !important;
    font-size: 0.55rem !important;
    min-width: 16px !important;
    height: 16px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* Hide hamburger text if any */
  .menu-toggle-text,
  [class*="menu-toggle"] span:not([class*="icon"]) {
    display: none !important;
  }

  /* Hamburger icon — clean lines */
  .menu-toggle,
  .ast-mobile-header-wrap .menu-toggle,
  button.menu-toggle {
    background: transparent !important;
    border: none !important;
    padding: 4px !important;
    color: #1C1A16 !important;
  }

}

@media (max-width: 480px) {

  /* Even smaller screens — reduce logo size slightly */
  .site-title a,
  .ast-site-identity .site-title a {
    font-size: 0.95rem !important;
    letter-spacing: 0.18em !important;
  }

  #masthead,
  .site-header {
    padding: 0 14px !important;
  }

}
