/**
 * Menu Fix CSS for WooCommerce Product Pages
 * Optional fix for navigation menu visibility issues and duplicate menu removal
 * Includes spacing fixes for professional layout
 */

/* ====================================
   SPACING FIXES - Professional Layout
   ==================================== */

/* FIX 1: Make pink/red background container extend edge-to-edge */
/* Remove padding/margin from OUTER header container (the one with background color) */
.site-header,
#masthead,
header.site-header,
.main-header,
#site-header,
.header-wrapper {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
}

/* Ensure body doesn't add padding that creates gaps */
body {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Remove max-width constraints from parent wrappers */
.site-header .ast-container,
.site-header-container,
.main-header-bar-wrap {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Add 15px padding inside the header for menu/logo spacing */
.site-header:first-of-type .main-header-bar,
.site-header:first-of-type .ast-container,
#masthead:first-of-type .site-header-container,
.site-header:first-of-type .header-inner,
.site-header:first-of-type > .container,
.site-header:first-of-type > div:first-child {
    padding-left: 15px !important;
    padding-right: 15px !important;
}

/* FIX 2: Remove space above header - header starts at top */
body,
body.woocommerce,
body.single-product {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.site-header:first-of-type,
#masthead:first-of-type,
header:first-of-type {
    margin-top: 0 !important;
    margin-bottom: 30px !important; /* Add space below header instead */
}

/* Allow space for WordPress admin bar when logged in */
body.admin-bar .site-header:first-of-type,
body.admin-bar #masthead:first-of-type {
    margin-top: 32px !important;
}

@media screen and (max-width: 782px) {
    body.admin-bar .site-header:first-of-type,
    body.admin-bar #masthead:first-of-type {
        margin-top: 46px !important;
    }

    /* Smaller bottom spacing on mobile */
    .site-header:first-of-type,
    #masthead:first-of-type,
    header:first-of-type {
        margin-bottom: 20px !important;
    }
}

/* FIX 3: Add breathing room between product title and image */
.single-product .product .product_title,
.woocommerce div.product .product_title {
    margin-bottom: 25px !important;
}

/* Alternative: add top margin to product gallery if title spacing doesn't work */
.single-product .woocommerce-product-gallery,
.single-product div.product div.images {
    margin-top: 25px !important;
}

/* Responsive spacing adjustments for mobile */
@media (max-width: 768px) {
    /* Ensure pink background extends edge-to-edge on mobile */
    .site-header,
    #masthead {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
    }

    /* Add 15px padding inside header on mobile */
    .site-header:first-of-type .main-header-bar,
    .site-header:first-of-type .ast-container,
    #masthead:first-of-type .site-header-container,
    .site-header:first-of-type .header-inner {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    .single-product .product .product_title,
    .single-product .woocommerce-product-gallery {
        margin-bottom: 20px !important;
        margin-top: 20px !important;
    }
}

/* ====================================
   0. REMOVE DUPLICATE MENUS
   ==================================== */

/* Hide duplicate/second header instances */
.site-header:nth-of-type(2),
header.site-header:nth-of-type(2),
#masthead:nth-of-type(2) {
    display: none !important;
}

/* Hide mobile header on desktop (common duplicate cause) */
@media (min-width: 782px) {
    .mobile-header,
    .ast-mobile-header,
    .ast-mobile-header-wrap,
    .responsive-menu-wrapper,
    .mobile-menu-wrapper,
    .oceanwp-mobile-menu-icon,
    body:not(.rtl) .mobile-header-navigation-icon {
        display: none !important;
    }
}

/* Hide second consecutive header */
body.single-product .site-header + .site-header,
body.single-product header + header,
body.single-product #masthead + #masthead {
    display: none !important;
}

/* Astra specific duplicate removal */
.ast-header-break-point .ast-mobile-header-wrap {
    display: none !important;
}

@media (min-width: 921px) {
    .ast-mobile-header-wrap,
    .ast-mobile-menu-buttons {
        display: none !important;
    }
}

/* ====================================
   1. FORCE HEADER VISIBILITY (Primary Menu Only)
   ==================================== */

/* Standard WordPress & WooCommerce headers */
.site-header:first-of-type,
header.site-header:first-of-type,
#masthead:first-of-type,
.main-header:first-of-type,
#site-header:first-of-type {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    z-index: 9999 !important;
}

/* Desktop navigation only */
@media (min-width: 782px) {
    nav.primary-navigation,
    .primary-navigation,
    .desktop-navigation,
    .main-navigation {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}

/* ====================================
   2. MENU SPECIFIC SELECTORS
   ==================================== */

/* Only show primary navigation on desktop */
@media (min-width: 782px) {
    .site-header:first-of-type .main-navigation,
    .site-header:first-of-type #site-navigation,
    .site-header:first-of-type .site-navigation,
    .site-header:first-of-type .primary-menu,
    .site-header:first-of-type .nav-menu {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}

/* ====================================
   3. THEME-SPECIFIC FIXES
   ==================================== */

/* Astra Theme - Desktop only */
@media (min-width: 921px) {
    .ast-header-break-point .site-header:first-of-type,
    .ast-header-break-point .main-header-bar:first-of-type,
    .ast-builder-menu-1:first-of-type,
    .ast-desktop-header {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}

/* OceanWP Theme - Desktop only */
@media (min-width: 960px) {
    #site-header:first-of-type,
    #site-header-inner:first-of-type,
    .oceanwp-nav {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}

/* Storefront Theme */
.storefront-primary-navigation,
.site-branding,
.site-header:first-of-type .col-full {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* GeneratePress Theme */
.inside-header,
.site-header:first-of-type .inside-header,
.main-navigation:first-of-type .inside-navigation {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Divi Theme - Desktop only */
@media (min-width: 981px) {
    #main-header,
    #et-top-navigation {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}

/* Avada Theme - Desktop only */
@media (min-width: 800px) {
    #header:first-of-type,
    .fusion-header:first-of-type,
    .fusion-header-wrapper:first-of-type {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}

/* Elementor Header */
header.elementor-location-header:first-of-type,
.elementor-location-header:first-of-type {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* ====================================
   4. PREVENT Z-INDEX CONFLICTS
   ==================================== */

/* Keep primary header above product content */
.site-header:first-of-type,
#masthead:first-of-type,
header:first-of-type {
    position: relative !important;
    z-index: 9999 !important;
}

/* Prevent product images from overlaying header */
.woocommerce-product-gallery,
.woocommerce div.product div.images,
.single-product .product .images {
    z-index: 1 !important;
}

/* ====================================
   5. MOBILE MENU FIXES
   ==================================== */

/* Mobile menu toggles - only on mobile */
@media (max-width: 781px) {
    .site-header:first-of-type .mobile-menu-toggle,
    .site-header:first-of-type .menu-toggle,
    .site-header:first-of-type button.menu-toggle,
    .site-header:first-of-type .hamburger,
    .site-header:first-of-type .mobile-nav-toggle,
    .site-header:first-of-type .nav-toggle {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* Ensure mobile menus can appear */
    .site-header:first-of-type .mobile-menu,
    .site-header:first-of-type .mobile-navigation,
    .site-header:first-of-type .responsive-menu {
        visibility: visible !important;
        opacity: 1 !important;
    }
}

/* ====================================
   6. RESET COMMON HIDING TECHNIQUES
   ==================================== */

/* Remove any height restrictions - first header only */
.site-header:first-of-type,
#masthead:first-of-type {
    max-height: none !important;
    height: auto !important;
}

/* Ensure primary header isn't pushed off-screen */
.site-header:first-of-type,
#masthead:first-of-type {
    top: auto !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
}

/* ====================================
   7. STICKY HEADER FIXES
   ==================================== */

.site-header:first-of-type.sticky-header,
.site-header:first-of-type.is-sticky,
.site-header:first-of-type.fixed-header {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    z-index: 9999 !important;
}

/* ====================================
   8. CARTFLOWS COMPATIBILITY
   ==================================== */

/* Ensure primary header appears on CartFlows pages */
.cartflows_step .site-header:first-of-type,
.cartflows_step #masthead:first-of-type,
.wcf-embed-checkout-form .site-header:first-of-type {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* ====================================
   9. PRODUCT PAGE SPECIFIC
   ==================================== */

/* Ensure primary header is visible on single product pages */
.single-product .site-header:first-of-type,
.single-product #masthead:first-of-type,
.woocommerce-page .site-header:first-of-type {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* ====================================
   10. OVERRIDE PAGE-SPECIFIC HIDING
   ==================================== */

/* Some themes hide headers on specific page types - show first header only */
.page .site-header:first-of-type,
.single .site-header:first-of-type,
body.woocommerce .site-header:first-of-type,
body.single-product .site-header:first-of-type {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}