/**
 * ==========================================================================
 * HAPPYPIP HEADER & FOOTER — Astra Overrides (Warm Analogous v3)
 * ==========================================================================
 * Forces ALL Astra header elements into the Warm Analogous v3 theme,
 * overriding any colors set through the WordPress Customizer
 * (Appearance > Customize > Header Builder).
 *
 * Loaded at priority 99 with astra-theme-css dependency to ensure
 * this file always appears AFTER Astra's dynamic inline CSS.
 *
 * Covers: Customizer-generated inline styles, --ast-global-color-* vars,
 * Header Footer Builder (HFB), transparent header (Astra Pro),
 * sticky header, responsive prefixes, and compound selectors.
 * ==========================================================================
 */


/* ══════════════════════════════════════════════════
   ASTRA CUSTOMIZER COLOR VARIABLE OVERRIDES
   ══════════════════════════════════════════════════
   Astra's Customizer stores its palette as
   --ast-global-color-0 through --ast-global-color-8
   and references them in its inline CSS. We override
   the ones used in the header/footer context so even
   if Customizer values change, our theme wins.
   ══════════════════════════════════════════════════ */

body .site-header,
body #masthead,
body #ast-desktop-header,
body #ast-mobile-header {
    --ast-global-color-0: var(--sunset-mid);
    --ast-global-color-1: #1E3A2F;
    --ast-global-color-2: var(--color-text-primary);
    --ast-global-color-3: var(--color-text-secondary);
    --ast-global-color-4: var(--color-bg);
    --ast-global-color-5: var(--color-bg);
    --ast-global-color-6: var(--bg-surface);
    --ast-global-color-7: var(--color-border);
    --ast-global-color-8: var(--color-bg);
}


/* ══════════════════════════════════════════════════
   ABOVE HEADER (Announcement / Free Delivery Bar)
   ══════════════════════════════════════════════════ */

/* Outer bar + every inner container — desktop & mobile identical */
.ast-above-header-bar,
.ast-above-header,
.ast-above-header-wrap,
.ast-above-header-bar .ast-builder-grid-row,
.ast-above-header-bar .ast-builder-grid-row-container,
.ast-above-header-bar .site-above-header-inner-wrap,
.ast-above-header-bar .ast-builder-layout-element,
.ast-above-header-bar .ast-row,
.ast-above-header-bar .ast-container,
.ast-above-header-bar [data-section="above-header-builder"],
.ast-theme-transparent-header .ast-above-header-bar,
.ast-theme-transparent-header .ast-above-header,
.ast-theme-transparent-header .ast-above-header-bar .ast-builder-grid-row,
.ast-desktop .ast-above-header-bar,
.ast-desktop .ast-above-header-bar .ast-builder-grid-row,
.ast-desktop .ast-above-header-wrap,
.ast-header-break-point .ast-above-header-bar,
.ast-header-break-point .ast-above-header,
.ast-header-break-point .ast-above-header-wrap,
.ast-header-break-point .ast-above-header-bar .ast-builder-grid-row,
.ast-header-break-point .ast-above-header-bar .site-above-header-inner-wrap,
.ast-header-break-point .ast-above-header-bar .ast-container,
#ast-desktop-header .ast-above-header-bar,
#ast-desktop-header .ast-above-header-bar .ast-builder-grid-row,
#ast-desktop-header > .ast-above-header-wrap,
#ast-mobile-header .ast-above-header-bar,
#ast-mobile-header .ast-above-header,
#ast-mobile-header .ast-above-header-bar .ast-builder-grid-row,
#ast-mobile-header .ast-above-header-bar .site-above-header-inner-wrap,
#ast-mobile-header .ast-above-header-bar .ast-container,
#ast-mobile-header > .ast-above-header-wrap,
#masthead > .ast-above-header-wrap,
.site-header > .ast-above-header-wrap,
.ast-above-header-wrap [data-section="above-header-builder"],
.ast-hfb-header .ast-above-header-bar,
.ast-hfb-header .ast-above-header-bar .ast-builder-grid-row {
    background: var(--color-bg) !important;
    background-color: var(--color-bg) !important;
    color: var(--color-text-primary) !important;
}

/* Border only on the outer bar */
.ast-above-header-bar,
.ast-theme-transparent-header .ast-above-header-bar,
.ast-desktop .ast-above-header-bar,
.ast-header-break-point .ast-above-header-bar,
#ast-desktop-header .ast-above-header-bar,
#ast-mobile-header .ast-above-header-bar {
    border-bottom: 1px solid var(--border-default) !important;
}

/* Full-width on mobile — no gaps or color bleed */
.ast-above-header-bar,
.ast-above-header-wrap,
.ast-header-break-point .ast-above-header-bar,
.ast-header-break-point .ast-above-header-wrap,
#ast-mobile-header .ast-above-header-bar,
#ast-mobile-header .ast-above-header-wrap {
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.ast-above-header-bar .ast-builder-grid-row,
.ast-header-break-point .ast-above-header-bar .ast-builder-grid-row,
#ast-mobile-header .ast-above-header-bar .ast-builder-grid-row {
    margin: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
}

/* Announcement bar text */
.ast-above-header-bar .ast-builder-html-element,
.ast-above-header-bar .ast-builder-html-element p,
.ast-above-header-bar .ast-builder-html-element span,
.ast-above-header-bar .ast-custom-html,
.ast-above-header-bar [data-section] p,
.ast-above-header-bar [data-section] span {
    color: var(--color-text-primary) !important;
}

/* Announcement bar links */
.ast-above-header-bar a,
.ast-above-header a,
.ast-above-header-bar .ast-builder-html-element a,
.ast-theme-transparent-header .ast-above-header-bar a,
.ast-header-break-point .ast-above-header-bar a,
#ast-mobile-header .ast-above-header-bar a {
    color: var(--sunset-text) !important;
}

.ast-above-header-bar a:hover,
.ast-above-header a:hover,
.ast-above-header-bar .ast-builder-html-element a:hover,
.ast-theme-transparent-header .ast-above-header-bar a:hover,
.ast-header-break-point .ast-above-header-bar a:hover,
#ast-mobile-header .ast-above-header-bar a:hover {
    color: var(--sunset-deep) !important;
}


/* ══════════════════════════════════════════════════
   PRIMARY HEADER BAR — Background
   ══════════════════════════════════════════════════
   Every known Astra selector that controls the
   header background. Customizer generates selectors
   like .ast-primary-header-bar with inline
   background-color; we beat them all here.
   ══════════════════════════════════════════════════ */

/* Base + compound selectors */
.ast-primary-header-bar,
.ast-primary-header-bar.ast-primary-header,
.ast-primary-header-bar.main-header-bar,
.main-header-bar,
.main-header-bar-wrap,
.ast-primary-header-bar .main-header-bar-wrap,
.site-primary-header-wrap,

/* Desktop-prefixed */
.ast-desktop .ast-primary-header-bar,
.ast-desktop .ast-primary-header-bar.main-header-bar,
.ast-desktop .main-header-bar,
#ast-desktop-header .ast-primary-header-bar,
#ast-desktop-header .main-header-bar,

/* Mobile-prefixed */
.ast-header-break-point .ast-primary-header-bar,
.ast-header-break-point .ast-primary-header-bar.main-header-bar,
.ast-header-break-point .main-header-bar,
.ast-header-break-point #masthead .ast-primary-header-bar,
.ast-header-break-point #masthead .ast-primary-header-bar.main-header-bar,

/* Mobile header bar */
.ast-mobile-header-bar,
.ast-mobile-header-wrap,
.ast-mobile-header-wrap .ast-primary-header-bar,
.ast-mobile-header-wrap .ast-mobile-header-bar,
#ast-mobile-header,
#ast-mobile-header .ast-mobile-header-bar,
#ast-mobile-header .ast-primary-header-bar,
#ast-mobile-header .main-header-bar,

/* HFB body class context */
.ast-hfb-header .ast-primary-header-bar,
.ast-hfb-header .main-header-bar,
.ast-hfb-header .ast-mobile-header-bar,

/* Transparent header (Astra Pro) */
.ast-theme-transparent-header .main-header-bar,
.ast-theme-transparent-header .ast-primary-header-bar,
.ast-theme-transparent-header .ast-mobile-header-bar,
.ast-theme-transparent-header #ast-desktop-header > [CLASS*="-header-wrap"],
.ast-theme-transparent-header #ast-mobile-header > [CLASS*="-header-wrap"],
.ast-theme-transparent-header #ast-desktop-header > [CLASS*="-header-wrap"]:nth-last-child(2),
.ast-theme-transparent-header #ast-mobile-header > [CLASS*="-header-wrap"]:last-child {
    background-color: #1E3A2F !important;
    background: linear-gradient(180deg, #152C24 0%, #1E3A2F 100%) !important;
    border-bottom: none !important;
}

/* Outer wrappers — #masthead and .site-header get dark green bg, no border (sunset glow replaces it) */
#masthead,
.site-header {
    background-color: #1E3A2F !important;
    background: linear-gradient(180deg, #152C24 0%, #1E3A2F 100%) !important;
    border-bottom: none !important;
    position: relative !important;
    overflow: visible !important;
}

/* Position primary header and desktop header for non-sticky scroll behavior */
#ast-desktop-header,
.ast-primary-header-bar,
.ast-primary-header-bar.ast-primary-header,
.ast-primary-header-bar.main-header-bar,
.main-header-bar,
.main-header-bar-wrap,
.site-primary-header-wrap {
    position: relative !important;
    overflow: visible !important;
}

/* Sunset glow border — 2px gradient line below the primary header */
.ast-primary-header-bar::after,
.main-header-bar::after {
    content: '' !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 2px !important;
    background: linear-gradient(90deg, #F4C08A, #ECA96E, #E89858) !important;
    box-shadow: 0 2px 12px rgba(236,169,110,0.4), 0 4px 24px rgba(244,192,138,0.2) !important;
    z-index: 10 !important;
    pointer-events: none !important;
}

/* Sunset glow border — 2px gradient line above the primary header */
.ast-primary-header-bar::before,
.main-header-bar::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 2px !important;
    background: linear-gradient(90deg, #F4C08A, #ECA96E, #E89858) !important;
    box-shadow: 0 -2px 12px rgba(236,169,110,0.4), 0 -4px 24px rgba(244,192,138,0.2) !important;
    z-index: 10 !important;
    pointer-events: none !important;
}

/* Prevent double pseudo-borders — only the outermost bar needs them */
.ast-primary-header-bar .main-header-bar::after,
.ast-primary-header-bar .main-header-bar::before {
    display: none !important;
}

/* Builder grid rows inside ALL header bars */
.ast-primary-header-bar .ast-builder-grid-row,
.ast-primary-header-bar .ast-builder-grid-row-container,
.ast-mobile-header-bar .ast-builder-grid-row,
.ast-mobile-header-bar .ast-builder-grid-row-container,
.ast-mobile-header-wrap .ast-builder-grid-row,
#ast-mobile-header .ast-builder-grid-row,
#ast-desktop-header .ast-builder-grid-row,
.ast-hfb-header .ast-builder-grid-row,
.ast-theme-transparent-header .ast-primary-header-bar .ast-builder-grid-row,
.ast-theme-transparent-header .ast-mobile-header-bar .ast-builder-grid-row,
.ast-header-break-point .ast-primary-header-bar .ast-builder-grid-row,
.ast-header-break-point .ast-mobile-header-bar .ast-builder-grid-row {
    background: transparent !important;
}

/* Vertical-center header contents */
.ast-primary-header-bar .site-primary-header-wrap,
.main-header-bar .site-primary-header-wrap {
    align-items: center !important;
}


/* ══════════════════════════════════════════════════
   SITE IDENTITY (Logo & Title)
   ══════════════════════════════════════════════════ */

.ast-site-identity {
    flex-direction: column !important;
    align-items: center !important;
}

.site-title,
.site-title a,
.site-title a:visited,
.ast-site-identity .site-title a,
.ast-site-title-wrap a,
.ast-theme-transparent-header .site-title a,
.ast-theme-transparent-header .ast-site-identity .site-title a,
.ast-theme-transparent-header .ast-site-title-wrap a,
.ast-header-break-point .site-title a,
#ast-mobile-header .site-title a,
.ast-hfb-header .site-title a {
    color: #FAF6EF !important;
    font-family: var(--font-heading) !important;
}

.site-title a:hover,
.ast-site-title-wrap a:hover {
    color: #fff !important;
}

.site-description,
.ast-theme-transparent-header .site-header .site-description,
.ast-header-break-point .site-description,
#ast-mobile-header .site-description {
    font-size: 11px;
    letter-spacing: 3px;
    color: rgba(250,246,239,0.6) !important;
    margin-top: 1px !important;
}

.custom-logo-link img {
    filter: brightness(1.1);
}


/* ══════════════════════════════════════════════════
   NAVIGATION MENU — All text colors
   ══════════════════════════════════════════════════ */

.ast-primary-header-bar .ast-builder-menu .menu-item,
.ast-desktop .ast-primary-header-bar .ast-builder-menu-1 .menu-item {
    padding: 0 var(--space-sm) !important;
}

/* Menu links — all variants (cream on dark green) */
.ast-primary-header-bar .ast-builder-menu .menu-item > a,
.ast-primary-header-bar .menu-link,
.ast-header-navigation .menu-item > a,
.ast-desktop .ast-primary-header-bar .main-header-menu > .menu-item > .menu-link,
.ast-builder-menu-1 .menu-item > .menu-link,
.main-header-menu .menu-item > .menu-link,
.ast-builder-menu .main-header-menu .menu-item > .menu-link,
.ast-theme-transparent-header .ast-builder-menu .main-header-menu .menu-link,
.ast-theme-transparent-header .main-header-menu .menu-item > .menu-link,
.ast-theme-transparent-header .ast-primary-header-bar .menu-link,
.ast-hfb-header .menu-link,
.ast-hfb-header .main-header-menu .menu-item > .menu-link,
/* Customizer generates these with inline color */
.ast-builder-menu-1 .menu-item > .menu-link,
.ast-builder-menu-2 .menu-item > .menu-link,
[CLASS*="ast-builder-menu"] .menu-item > .menu-link,
[data-section="section-hb-menu-1"] .menu-item > .menu-link,
[data-section="section-hb-menu-2"] .menu-item > .menu-link {
    color: rgba(250,246,239,0.75) !important;
    font-family: var(--font-heading) !important;
    font-weight: 500 !important;
}

/* Menu link hover — white with subtle bg on dark green */
.ast-primary-header-bar .ast-builder-menu .menu-item > a:hover,
.ast-primary-header-bar .menu-link:hover,
.ast-header-navigation .menu-item > a:hover,
.ast-desktop .ast-primary-header-bar .main-header-menu > .menu-item > .menu-link:hover,
.ast-builder-menu-1 .menu-item > .menu-link:hover,
.ast-builder-menu-2 .menu-item > .menu-link:hover,
.main-header-menu .menu-item > .menu-link:hover,
[CLASS*="ast-builder-menu"] .menu-item > .menu-link:hover,
.ast-theme-transparent-header .main-header-menu .menu-link:hover,
.ast-hfb-header .menu-link:hover,
[data-section="section-hb-menu-1"] .menu-item > .menu-link:hover,
[data-section="section-hb-menu-2"] .menu-item > .menu-link:hover {
    color: #fff !important;
    background: rgba(250,246,239,0.08) !important;
}

/* Active/current menu item — full white on dark green */
.ast-primary-header-bar .menu-item.current-menu-item > a,
.ast-primary-header-bar .menu-item.current_page_item > a,
.main-header-menu .menu-item.current-menu-item > .menu-link,
.main-header-menu .menu-item.current_page_item > .menu-link,
.ast-builder-menu-1 .menu-item.current-menu-item > .menu-link,
[CLASS*="ast-builder-menu"] .menu-item.current-menu-item > .menu-link,
.ast-theme-transparent-header .main-header-menu .current-menu-item > .menu-link,
.ast-hfb-header .menu-item.current-menu-item > .menu-link {
    color: #fff !important;
}


/* ══════════════════════════════════════════════════
   SUBMENU / DROPDOWN
   ══════════════════════════════════════════════════ */

.ast-primary-header-bar .sub-menu,
.ast-builder-menu .sub-menu,
.ast-builder-menu-1 .sub-menu,
.ast-builder-menu-2 .sub-menu,
.main-header-menu .sub-menu,
.ast-desktop .ast-primary-header-bar .sub-menu,
[CLASS*="ast-builder-menu"] .sub-menu,
.ast-theme-transparent-header .main-header-menu .menu-item .sub-menu,
.ast-theme-transparent-header .ast-builder-menu .sub-menu,
.ast-hfb-header .sub-menu {
    background: var(--color-card) !important;
    border: 1px solid var(--color-border) !important;
}

.ast-primary-header-bar .sub-menu .menu-item > a,
.main-header-menu .sub-menu .menu-item > .menu-link,
[CLASS*="ast-builder-menu"] .sub-menu .menu-item > .menu-link,
.ast-theme-transparent-header .sub-menu .menu-item > .menu-link,
.ast-hfb-header .sub-menu .menu-item > .menu-link {
    color: var(--color-text-primary) !important;
}

.ast-primary-header-bar .sub-menu .menu-item > a:hover,
.main-header-menu .sub-menu .menu-item > .menu-link:hover,
[CLASS*="ast-builder-menu"] .sub-menu .menu-item > .menu-link:hover,
.ast-theme-transparent-header .sub-menu .menu-item > .menu-link:hover,
.ast-hfb-header .sub-menu .menu-item > .menu-link:hover {
    background: var(--color-card-hover) !important;
    color: var(--sunset-text) !important;
}


/* ══════════════════════════════════════════════════
   HEADER ICONS — Cart, Account, Search
   ══════════════════════════════════════════════════ */

/* Icon wrapper text colors + hover transition (cream on dark green) */
.ast-primary-header-bar .ast-header-woo-cart .ast-cart-menu-wrap,
.ast-primary-header-bar .ast-header-account-wrap,
.ast-primary-header-bar .ast-header-search,
.ast-primary-header-bar .astra-cart-drawer-title,
.ast-mobile-header-bar .ast-header-woo-cart .ast-cart-menu-wrap,
.ast-mobile-header-bar .ast-header-account-wrap,
.ast-mobile-header-bar .ast-header-search,
#ast-mobile-header .ast-header-woo-cart .ast-cart-menu-wrap,
#ast-mobile-header .ast-header-account-wrap,
#ast-mobile-header .ast-header-search,
.ast-theme-transparent-header .ast-header-woo-cart .ast-cart-menu-wrap,
.ast-theme-transparent-header .ast-header-account-wrap,
.ast-theme-transparent-header .ast-header-search,
.ast-header-break-point .ast-header-woo-cart .ast-cart-menu-wrap,
.ast-header-break-point .ast-header-account-wrap,
.ast-header-break-point .ast-header-search,
/* Customizer data-section selectors */
[data-section="section-header-woo-cart"],
[data-section="section-header-account"],
[data-section="section-header-search"] {
    color: rgba(250,246,239,0.75) !important;
    transition: color 0.25s ease, transform 0.25s ease !important;
}

/* ── Hover effect on ALL header icons — scale + color shift ── */
.ast-site-header-cart:hover,
.ast-header-woo-cart:hover,
.ast-header-account-wrap:hover,
.ast-header-search:hover,
[data-section="section-header-woo-cart"]:hover,
[data-section="section-header-account"]:hover,
[data-section="section-header-search"]:hover {
    transform: scale(1.1) !important;
}

.ast-site-header-cart,
.ast-header-woo-cart,
.ast-header-account-wrap,
.ast-header-search,
[data-section="section-header-woo-cart"],
[data-section="section-header-account"],
[data-section="section-header-search"] {
    transition: transform 0.25s ease !important;
}

.ast-site-header-cart:hover svg,
.ast-header-woo-cart:hover svg,
.ast-header-account-wrap:hover svg,
.ast-header-search:hover svg,
[data-section="section-header-woo-cart"]:hover svg,
[data-section="section-header-account"]:hover svg,
[data-section="section-header-search"]:hover svg {
    fill: #fff !important;
    color: #fff !important;
}

.ast-header-account-wrap:hover svg path,
.ast-header-account-wrap:hover svg circle,
.ast-header-account-wrap:hover svg line,
.ast-header-account-wrap:hover svg polyline,
.ast-header-search:hover svg path,
.ast-header-search:hover svg circle,
.ast-header-search:hover svg line,
.ast-site-header-cart:hover svg path,
.ast-site-header-cart:hover svg circle,
.ast-site-header-cart:hover svg line,
.ast-site-header-cart:hover svg polyline {
    fill: #fff !important;
    color: #fff !important;
    stroke: #fff !important;
}

/* SVG icons in header — all contexts (cream on dark green) */
.ast-primary-header-bar svg,
.ast-primary-header-bar .ast-icon,
.ast-mobile-header-bar svg,
.ast-mobile-header-bar .ast-icon,
#ast-desktop-header svg,
#ast-mobile-header svg,
#ast-mobile-header .ast-icon,
.ast-header-break-point .ast-primary-header-bar svg,
.ast-header-break-point .ast-mobile-header-bar svg,
.ast-theme-transparent-header .ast-primary-header-bar svg,
.ast-theme-transparent-header .ast-primary-header-bar .ast-icon,
.ast-theme-transparent-header .ast-mobile-header-bar svg,
.ast-hfb-header svg,
.ast-hfb-header .ast-icon,
/* Customizer sets fill via inline style on these */
.ast-header-woo-cart svg,
.ast-header-account-wrap svg,
.ast-header-search svg,
.ast-site-header-cart svg,
[data-section="section-header-woo-cart"] svg,
[data-section="section-header-account"] svg,
[data-section="section-header-search"] svg {
    fill: rgba(250,246,239,0.75) !important;
    color: rgba(250,246,239,0.75) !important;
    transition: fill 0.25s ease, color 0.25s ease, stroke 0.25s ease !important;
}

/* Cart count badge — sunset solid on dark green header */
.ast-primary-header-bar .ast-header-woo-cart .count,
.ast-primary-header-bar .ast-cart-menu-wrap .count,
.ast-mobile-header-bar .ast-header-woo-cart .count,
.ast-mobile-header-bar .ast-cart-menu-wrap .count,
#ast-mobile-header .ast-header-woo-cart .count,
#ast-mobile-header .ast-cart-menu-wrap .count,
.ast-header-break-point .ast-cart-menu-wrap .count,
.ast-theme-transparent-header .ast-header-woo-cart .count,
.ast-site-header-cart .count,
.ast-woo-header-cart .count {
    background: #ECA96E !important;
    color: #152C24 !important;
}


/* ══════════════════════════════════════════════════
   ACCOUNT ICON & DROPDOWN
   ══════════════════════════════════════════════════ */

.ast-header-account-wrap,
.ast-header-account-wrap .ast-header-account-link,
.ast-header-account-wrap .ast-header-account-text,
.ast-header-account-wrap a,
.ast-header-account-wrap a:visited,
.ast-theme-transparent-header .ast-header-account-wrap a,
.ast-header-break-point .ast-header-account-wrap a,
#ast-mobile-header .ast-header-account-wrap a,
[data-section="section-header-account"],
[data-section="section-header-account"] .ast-header-account-link {
    color: rgba(250,246,239,0.75) !important;
    text-decoration: none !important;
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Account SVG icon — target svg AND all inner elements (path, circle, line, etc.)
   Astra Customizer sets inline fill/stroke on child elements directly */
.ast-header-account-wrap svg,
.ast-header-account-wrap svg path,
.ast-header-account-wrap svg circle,
.ast-header-account-wrap svg line,
.ast-header-account-wrap svg polyline,
.ast-header-account-wrap svg rect,
.ast-header-account-wrap svg polygon,
.ast-header-account-wrap .ahfb-svg-iconset svg,
.ast-header-account-wrap .ahfb-svg-iconset svg path,
.ast-header-account-wrap .ahfb-svg-iconset svg circle,
.ast-header-account-wrap .ast-header-account-link svg,
.ast-header-account-wrap .ast-header-account-link svg path,
.ast-header-account-wrap .ast-header-account-link svg circle,
[data-section="section-header-account"] svg,
[data-section="section-header-account"] svg path,
[data-section="section-header-account"] svg circle,
#ast-desktop-header .ast-header-account-wrap svg,
#ast-desktop-header .ast-header-account-wrap svg path,
#ast-desktop-header .ast-header-account-wrap svg circle,
#ast-mobile-header .ast-header-account-wrap svg,
#ast-mobile-header .ast-header-account-wrap svg path,
#ast-mobile-header .ast-header-account-wrap svg circle,
.ast-header-break-point .ast-header-account-wrap svg,
.ast-header-break-point .ast-header-account-wrap svg path,
.ast-header-break-point .ast-header-account-wrap svg circle,
.ast-theme-transparent-header .ast-header-account-wrap svg,
.ast-theme-transparent-header .ast-header-account-wrap svg path,
.ast-theme-transparent-header .ast-header-account-wrap svg circle {
    fill: rgba(250,246,239,0.75) !important;
    color: rgba(250,246,239,0.75) !important;
    stroke: rgba(250,246,239,0.75) !important;
    width: 20px !important;
    height: 20px !important;
}

.ast-header-account-wrap:hover,
.ast-header-account-wrap a:hover,
.ast-header-account-wrap .ast-header-account-link:hover {
    color: #fff !important;
}

.ast-header-account-wrap:hover svg,
.ast-header-account-wrap:hover svg path,
.ast-header-account-wrap:hover svg circle,
.ast-header-account-wrap:hover svg line,
.ast-header-account-wrap:hover svg polyline,
.ast-header-account-wrap a:hover svg,
.ast-header-account-wrap a:hover svg path,
.ast-header-account-wrap a:hover svg circle,
.ast-header-account-wrap .ast-header-account-link:hover svg,
.ast-header-account-wrap .ast-header-account-link:hover svg path,
.ast-header-account-wrap .ast-header-account-link:hover svg circle {
    fill: #fff !important;
    color: #fff !important;
    stroke: #fff !important;
}

.ast-header-account-wrap .ast-account-nav,
.ast-header-account-wrap .sub-menu,
.ast-header-account-wrap .ast-hf-account-menu {
    background: var(--color-card) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-md) !important;
    box-shadow: var(--shadow-modal) !important;
}

.ast-header-account-wrap .ast-account-nav a,
.ast-header-account-wrap .sub-menu a,
.ast-header-account-wrap .ast-hf-account-menu a {
    color: var(--color-text-primary) !important;
    font-family: var(--font-heading) !important;
}

.ast-header-account-wrap .ast-account-nav a:hover,
.ast-header-account-wrap .sub-menu a:hover,
.ast-header-account-wrap .ast-hf-account-menu a:hover {
    background: var(--color-card-hover) !important;
    color: var(--sunset-text) !important;
}


/* ══════════════════════════════════════════════════
   MOBILE HEADER — Toggle, Icons & Drawer
   ══════════════════════════════════════════════════ */

/* Hamburger toggle button (cream on dark green) */
.ast-mobile-header-bar .ast-button-wrap .menu-toggle,
.ast-mobile-header-bar .ast-mobile-menu-trigger,
.ast-header-break-point .ast-button-wrap .menu-toggle,
#ast-mobile-header .ast-button-wrap .menu-toggle,
[data-section="menu"] .ast-button-wrap .menu-toggle,
[data-section="section-header-mobile-trigger"] .ast-button-wrap .menu-toggle {
    color: rgba(250,246,239,0.85) !important;
    background: transparent !important;
    border: none !important;
}

.ast-mobile-header-bar .ast-button-wrap .menu-toggle svg,
.ast-mobile-header-bar .ast-mobile-menu-trigger svg,
.ast-header-break-point .ast-button-wrap .menu-toggle svg,
#ast-mobile-header .ast-button-wrap .menu-toggle svg {
    fill: rgba(250,246,239,0.85) !important;
}

.ast-mobile-header-bar .ast-button-wrap .menu-toggle:hover,
.ast-mobile-header-bar .ast-mobile-menu-trigger:hover {
    color: #fff !important;
}

.ast-mobile-header-bar .ast-button-wrap .menu-toggle:hover svg,
.ast-mobile-header-bar .ast-mobile-menu-trigger:hover svg {
    fill: #fff !important;
}

/* Mobile popup drawer (off-canvas menu) */
.ast-mobile-popup-drawer,
.ast-mobile-popup-drawer .ast-mobile-popup-inner,
.ast-mobile-popup-drawer .ast-mobile-popup-content {
    background: var(--color-bg) !important;
}

.ast-mobile-popup-drawer .menu-item > .menu-link,
.ast-mobile-popup-drawer .menu-item > .ast-menu-toggle,
.ast-mobile-popup-drawer .ast-builder-menu .menu-item > .menu-link,
[CLASS*="ast-builder-menu"] .ast-mobile-popup-drawer .menu-item > .menu-link {
    color: var(--color-text-primary) !important;
    border-color: var(--color-border) !important;
}

.ast-mobile-popup-drawer .menu-item > .menu-link:hover,
.ast-mobile-popup-drawer .ast-builder-menu .menu-item > .menu-link:hover {
    color: var(--sunset-text) !important;
}

.ast-mobile-popup-drawer .close-icon,
.ast-mobile-popup-drawer .menu-toggle-close,
.ast-mobile-popup-drawer .ast-mobile-popup-close {
    color: var(--color-text-primary) !important;
}

.ast-mobile-popup-drawer .close-icon:hover,
.ast-mobile-popup-drawer .menu-toggle-close:hover {
    color: var(--sunset-text) !important;
}

/* Mobile drawer search */
.ast-mobile-popup-drawer .search-field,
.ast-mobile-popup-drawer .ast-search-menu-icon .search-field {
    background: var(--color-card) !important;
    color: var(--color-text-primary) !important;
    border: 1px solid var(--color-border) !important;
}

/* Mobile drawer widgets */
.ast-mobile-popup-drawer .widget,
.ast-mobile-popup-drawer .widget-title {
    color: var(--color-text-primary) !important;
}


/* ══════════════════════════════════════════════════
   BELOW HEADER
   ══════════════════════════════════════════════════ */

.ast-below-header-bar,
.ast-below-header,
.ast-below-header-wrap,
.ast-below-header-bar .ast-builder-grid-row,
.ast-theme-transparent-header .ast-below-header-bar,
.ast-theme-transparent-header .ast-below-header,
.ast-desktop .ast-below-header-bar,
.ast-header-break-point .ast-below-header-bar,
#ast-desktop-header .ast-below-header-bar,
#ast-mobile-header .ast-below-header-bar,
.ast-hfb-header .ast-below-header-bar {
    background: var(--color-bg) !important;
    border-top: 1px solid var(--color-border) !important;
}


/* ══════════════════════════════════════════════════
   STICKY HEADER (Astra Pro)
   ══════════════════════════════════════════════════ */

#ast-fixed-header,
#ast-fixed-header .ast-primary-header-bar,
#ast-fixed-header .main-header-bar,
#ast-fixed-header .ast-mobile-header-bar,
.ast-sticky-active .ast-primary-header-bar,
.ast-sticky-active .main-header-bar,
.ast-sticky-active .ast-mobile-header-bar,
.ast-sticky-shrunk .ast-primary-header-bar,
.ast-sticky-shrunk .main-header-bar {
    background: linear-gradient(180deg, #152C24 0%, #1E3A2F 100%) !important;
    border-bottom: none !important;
}

#ast-fixed-header .ast-builder-grid-row,
.ast-sticky-active .ast-builder-grid-row {
    background: transparent !important;
}

#ast-fixed-header svg,
#ast-fixed-header .ast-icon,
.ast-sticky-active svg,
.ast-sticky-active .ast-icon {
    fill: rgba(250,246,239,0.75) !important;
    color: rgba(250,246,239,0.75) !important;
}

#ast-fixed-header .menu-link,
.ast-sticky-active .menu-link {
    color: rgba(250,246,239,0.75) !important;
}

#ast-fixed-header .menu-link:hover,
.ast-sticky-active .menu-link:hover {
    color: #fff !important;
}

#ast-fixed-header .site-title a,
.ast-sticky-active .site-title a {
    color: #FAF6EF !important;
}


/* ══════════════════════════════════════════════════
   HEADER HTML WIDGET / CUSTOM TEXT ELEMENTS
   ══════════════════════════════════════════════════
   Customizer lets you add HTML widgets in header
   rows. These get inline color from Customizer.
   ══════════════════════════════════════════════════ */

.ast-primary-header-bar .ast-builder-html-element,
.ast-primary-header-bar .ast-builder-html-element p,
.ast-primary-header-bar .ast-builder-html-element a,
.ast-mobile-header-bar .ast-builder-html-element,
.ast-mobile-header-bar .ast-builder-html-element p,
.ast-mobile-header-bar .ast-builder-html-element a,
#ast-desktop-header .ast-builder-html-element,
#ast-mobile-header .ast-builder-html-element,
[data-section*="section-hb-html"] .ast-builder-html-element,
[data-section*="section-hb-html"] .ast-builder-html-element p {
    color: rgba(250,246,239,0.75) !important;
}

.ast-primary-header-bar .ast-builder-html-element a:hover,
.ast-mobile-header-bar .ast-builder-html-element a:hover {
    color: #fff !important;
}


/* ══════════════════════════════════════════════════
   HEADER BUTTONS (Customizer CTA buttons)
   ══════════════════════════════════════════════════ */

.ast-primary-header-bar .ast-builder-button-wrap .ast-custom-button,
.ast-mobile-header-bar .ast-builder-button-wrap .ast-custom-button,
#ast-desktop-header .ast-custom-button,
#ast-mobile-header .ast-custom-button,
[data-section*="section-hb-button"] .ast-custom-button {
    background: var(--gradient-sunset) !important;
    color: #fff !important;
    border: none !important;
    border-radius: var(--radius-full) !important;
    font-family: var(--font-heading) !important;
}

.ast-primary-header-bar .ast-builder-button-wrap .ast-custom-button:hover,
.ast-mobile-header-bar .ast-builder-button-wrap .ast-custom-button:hover,
[data-section*="section-hb-button"] .ast-custom-button:hover {
    background: var(--gradient-sunset-hover) !important;
}


/* ══════════════════════════════════════════════════
   HEADER SEARCH
   ══════════════════════════════════════════════════ */

.ast-header-search .search-field,
.ast-search-menu-icon .search-field,
.ast-primary-header-bar .search-field,
.ast-mobile-header-bar .search-field {
    background: var(--color-card) !important;
    color: var(--color-text-primary) !important;
    border: 1px solid var(--color-border) !important;
}

.ast-header-search .search-field::placeholder,
.ast-search-menu-icon .search-field::placeholder {
    color: var(--color-text-muted) !important;
}

.ast-header-search .search-submit,
.ast-search-menu-icon .search-submit {
    background: var(--gradient-sunset) !important;
    color: #fff !important;
}


/* ══════════════════════════════════════════════════
   FOOTER
   ══════════════════════════════════════════════════ */

/* Hide Astra's default footer completely */
.site-footer .ast-builder-footer-grid-columns,
.site-footer .ast-footer-copyright,
.site-footer .ast-small-footer,
.site-footer .site-below-footer-wrap,
.ast-footer-overlay .ast-builder-grid-row,
.site-footer .ast-builder-grid-row-container {
    display: none !important;
}

.site-footer,
.ast-footer-overlay,
footer.site-footer,
.ast-hfb-header .site-footer {
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
}

/* ── HAPPYPIP Custom Footer — Dark Theme ── */
.hp-footer {
    background: var(--green-deep);
    color: rgba(250, 246, 239, 0.6);
    font-family: var(--font-heading);
}

.hp-footer__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-3xl) var(--space-2xl) 0;
}

/* Top row — 4 columns */
.hp-footer__top {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1fr;
    gap: var(--space-2xl);
    padding-bottom: var(--space-2xl);
}

/* Brand column — logo fills column height, tagline centered below */
.hp-footer__brand {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.hp-footer__logo {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    width: 100%;
    margin-bottom: var(--space-sm);
}

.hp-footer__logo img {
    width: 100%;
    max-width: 168px;
    height: auto;
    object-fit: contain;
}

.hp-footer__tagline {
    font-family: var(--font-heading);
    font-size: 13px;
    font-weight: 500;
    color: rgba(250, 246, 239, 0.5);
    letter-spacing: 1.5px;
    text-transform: lowercase;
    text-align: center;
}

/* Social icons */
.hp-footer__socials {
    display: flex;
    gap: var(--space-sm);
}

.hp-footer__social {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid rgba(250, 246, 239, 0.15);
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(250, 246, 239, 0.5);
    transition: all 0.3s ease;
    text-decoration: none;
}

.hp-footer__social svg {
    width: 16px;
    height: 16px;
}

.hp-footer__social:hover {
    border-color: var(--sunset-mid);
    color: var(--sunset-mid);
    background: rgba(236, 169, 110, 0.1);
}

/* Link columns */
.hp-footer__heading {
    font-family: var(--font-heading);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: rgba(250, 246, 239, 0.9);
    margin-bottom: var(--space-lg);
}

.hp-footer__links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.hp-footer__links li {
    margin-bottom: var(--space-sm);
}

.hp-footer__links a {
    font-size: 14px;
    font-weight: 400;
    color: rgba(250, 246, 239, 0.5);
    text-decoration: none;
    transition: color 0.2s ease;
    line-height: 1.8;
}

.hp-footer__links a:hover {
    color: var(--sunset-mid);
}

/* Bottom bar */
.hp-footer__bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-lg) 0;
    border-top: 1px solid rgba(250, 246, 239, 0.1);
    font-size: 12px;
    color: rgba(250, 246, 239, 0.35);
}

.hp-footer__copy,
.hp-footer__legal {
    font-weight: 400;
}

/* Disclaimers */
.hp-footer__disclaimers {
    border-top: 1px solid rgba(250, 246, 239, 0.08);
    padding: var(--space-md) 0 var(--space-lg);
    text-align: center;
}

.hp-footer__disclaimers p {
    font-size: 11px;
    font-weight: 400;
    color: rgba(250, 246, 239, 0.25);
    line-height: 1.5;
    margin: 0 0 4px;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.hp-footer__disclaimers p:last-child {
    margin-bottom: 0;
}

.hp-footer__warn {
    color: var(--sunset-mid) !important;
    font-size: 12px;
    display: inline;
}

/* ── Footer responsive ── */
@media (max-width: 900px) {
    .hp-footer__top {
        grid-template-columns: 1fr 1fr 1fr;
        gap: var(--space-lg) var(--space-md);
    }

    .hp-footer__brand {
        grid-column: 1 / -1;
    }

    .hp-footer__logo img {
        max-width: 132px;
    }
}

@media (max-width: 540px) {
    .hp-footer__inner {
        padding: var(--space-xl) var(--space-lg) 0;
    }

    .hp-footer__bottom {
        flex-direction: column;
        gap: var(--space-xs);
        text-align: center;
        padding: var(--space-md) 0 var(--space-lg);
    }
}


/* ══════════════════════════════════════════════════
   WOOCOMMERCE CART — Icon, Flyout & Drawer
   ══════════════════════════════════════════════════ */

/* Cart icon — remove ANY background from Customizer/Astra on every wrapper */
.ast-site-header-cart,
.ast-site-header-cart .ast-cart-menu-wrap,
.ast-site-header-cart a,
.ast-site-header-cart .ast-addon-cart-wrap,
.ast-site-header-cart .ast-woo-header-cart,
.ast-site-header-cart .ast-cart-menu-wrap .count,
.ast-header-woo-cart,
.ast-header-woo-cart .ast-cart-menu-wrap,
.ast-header-woo-cart a,
.ast-woo-header-cart,
.ast-woo-header-cart a,
[data-section="section-header-woo-cart"],
[data-section="section-header-woo-cart"] a,
[data-section="section-header-woo-cart"] .ast-cart-menu-wrap,
#ast-desktop-header .ast-site-header-cart,
#ast-desktop-header .ast-site-header-cart a,
#ast-desktop-header .ast-site-header-cart .ast-cart-menu-wrap,
#ast-mobile-header .ast-site-header-cart,
#ast-mobile-header .ast-site-header-cart a,
#ast-mobile-header .ast-site-header-cart .ast-cart-menu-wrap,
.ast-header-break-point .ast-site-header-cart,
.ast-header-break-point .ast-site-header-cart a,
.ast-header-break-point .ast-site-header-cart .ast-cart-menu-wrap,
.ast-theme-transparent-header .ast-site-header-cart,
.ast-theme-transparent-header .ast-site-header-cart a,
.ast-theme-transparent-header .ast-site-header-cart .ast-cart-menu-wrap {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Cart icon hover — white on dark green */
.ast-site-header-cart .ast-cart-menu-wrap:hover,
.ast-site-header-cart a:hover {
    color: #fff !important;
    background: transparent !important;
}

.ast-site-header-cart a:hover svg,
.ast-site-header-cart .ast-cart-menu-wrap:hover svg {
    fill: #fff !important;
    color: #fff !important;
}

/* Cart flyout dropdown */
.ast-site-header-cart .widget_shopping_cart,
.ast-site-header-cart .ast-addon-cart-wrap {
    background: var(--color-card) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-md) !important;
    box-shadow: var(--shadow-modal) !important;
}

/* Cart drawer (slide-in panel) */
.astra-cart-drawer,
.astra-cart-drawer .astra-cart-drawer-content {
    background: var(--color-card) !important;
    color: var(--color-text-primary) !important;
}

.astra-cart-drawer-title {
    color: var(--color-text-primary) !important;
    font-family: var(--font-heading) !important;
    border-bottom: 1px solid var(--color-border) !important;
}

.astra-cart-drawer .astra-cart-drawer-close {
    color: var(--color-text-secondary) !important;
}

.astra-cart-drawer .astra-cart-drawer-close:hover {
    color: var(--color-text-primary) !important;
}

/* Cart items list */
.woocommerce-mini-cart,
.woocommerce-mini-cart .mini_cart_item,
.woocommerce-mini-cart .woocommerce-mini-cart-item {
    color: var(--color-text-primary) !important;
    border-bottom: 1px solid var(--color-border) !important;
}

.woocommerce-mini-cart .mini_cart_item a,
.woocommerce-mini-cart .woocommerce-mini-cart-item a {
    color: var(--color-text-primary) !important;
}

.woocommerce-mini-cart .mini_cart_item a:hover,
.woocommerce-mini-cart .woocommerce-mini-cart-item a:hover {
    color: var(--sunset-text) !important;
}

/* Remove item link */
.woocommerce-mini-cart .mini_cart_item .remove,
.woocommerce-mini-cart .mini_cart_item .remove_from_cart_button {
    color: var(--color-text-muted) !important;
}

.woocommerce-mini-cart .mini_cart_item .remove:hover,
.woocommerce-mini-cart .mini_cart_item .remove_from_cart_button:hover {
    color: #CC4B4B !important;
    background: rgba(204, 75, 75, 0.1) !important;
}

/* Cart item quantity & price */
.woocommerce-mini-cart .quantity,
.woocommerce-mini-cart .amount {
    color: var(--color-text-secondary) !important;
}

/* Cart total */
.woocommerce-mini-cart__total,
.ast-cart-summary-wrap {
    color: var(--color-text-primary) !important;
    border-top: 1px solid var(--color-border) !important;
    font-family: var(--font-heading) !important;
}

.woocommerce-mini-cart__total .amount,
.ast-cart-summary-wrap .amount {
    color: var(--price-color) !important;
    font-weight: 700 !important;
}

/* Cart buttons — View Cart & Checkout */
.woocommerce-mini-cart__buttons,
.ast-cart-action-wrap {
    border-top: 1px solid var(--color-border) !important;
}

.woocommerce-mini-cart__buttons .button,
.woocommerce-mini-cart__buttons a,
.ast-cart-action-wrap a {
    font-family: var(--font-heading) !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    font-size: 12px !important;
    border-radius: var(--radius-full) !important;
    transition: all 0.3s ease !important;
    text-align: center !important;
}

/* View Cart button — outline style */
.woocommerce-mini-cart__buttons .button:first-child,
.woocommerce-mini-cart__buttons a:first-child {
    background: transparent !important;
    color: var(--color-text-primary) !important;
    border: 1.5px solid var(--color-border) !important;
}

.woocommerce-mini-cart__buttons .button:first-child:hover,
.woocommerce-mini-cart__buttons a:first-child:hover {
    border-color: var(--sunset-mid) !important;
    color: var(--sunset-text) !important;
}

/* Checkout button — primary CTA */
.woocommerce-mini-cart__buttons .checkout,
.woocommerce-mini-cart__buttons a:last-child {
    background: var(--gradient-sunset) !important;
    color: #fff !important;
    border: none !important;
}

.woocommerce-mini-cart__buttons .checkout:hover,
.woocommerce-mini-cart__buttons a:last-child:hover {
    background: var(--gradient-sunset-hover) !important;
}

/* Empty cart message */
.woocommerce-mini-cart__empty-message,
.ast-mini-cart-empty {
    color: var(--color-text-muted) !important;
    font-family: var(--font-heading) !important;
}

/* Cart item thumbnails */
.woocommerce-mini-cart .mini_cart_item img,
.woocommerce-mini-cart .woocommerce-mini-cart-item img {
    border-radius: var(--radius-sm) !important;
    border: 1px solid var(--color-border) !important;
}

/* Cart drawer overlay */
.ast-cart-drawer-overlay {
    background: rgba(42, 37, 32, 0.4) !important;
    backdrop-filter: blur(4px) !important;
}


/* ══════════════════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════════════════ */

@media (max-width: 1024px) {
    .ast-primary-header-bar .ast-builder-grid-row,
    .ast-mobile-header-bar .ast-builder-grid-row {
        padding-left: var(--space-md) !important;
        padding-right: var(--space-md) !important;
    }
}