/**
 * Mobile Menu Toggle Fix
 * Ensures the mobile menu button is visible on all pages
 * Including "Our Menu" and "About" pages
 */

/* Force menu toggle to display on mobile screens */
@media (max-width: 1199px) {
    #site-header-menu #site-navigation .menu-toggle,
    .tm-mmmenu-override-yes #site-header-menu #site-navigation div.mega-menu-wrap .mega-menu-toggle {
        display: block !important;
        position: absolute !important;
        right: 0 !important;
        z-index: 999 !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    /* Ensure the menu toggle is visible on all pages */
    body .menu-toggle,
    body #site-header-menu #site-navigation .menu-toggle {
        display: block !important;
    }
    
    /* Override any page-specific hiding */
    .page #site-header-menu #site-navigation .menu-toggle,
    .page-template #site-header-menu #site-navigation .menu-toggle,
    .page-id-* #site-header-menu #site-navigation .menu-toggle {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}

/* Desktop - hide on larger screens */
@media (min-width: 1200px) {
    #site-header-menu #site-navigation .menu-toggle,
    .tm-mmmenu-override-yes #site-header-menu #site-navigation div.mega-menu-wrap .mega-menu-toggle {
        display: none !important;
    }
}

/**
 * Home Page Banner Responsive Fix
 * Ensures banner images are fully visible on all devices
 */

/* Desktop banner fixes - prevent cropping on large screens */
@media (min-width: 1025px) {
    /* Prevent section overlap on desktop */
    body .elementor-section {
        margin-top: 0 !important;
        position: relative !important;
    }
    
    /* Ensure banner section is fully visible */
    body .elementor-section.elementor-section-height-full,
    body .elementor-section.elementor-section-height-min-height {
        overflow: visible !important;
    }
    
    /* Banner background - ensure full visibility */
    body .elementor-section {
        background-size: cover !important;
        background-position: center center !important;
        background-repeat: no-repeat !important;
    }
    
    /* Override any negative margins that cause overlap */
    body .elementor-section[data-settings*="margin"],
    body .elementor-element.elementor-section,
    body section.elementor-section {
        margin-top: 0 !important;
        top: auto !important;
        transform: translateY(0) !important;
    }
    
    /* Ensure sections don't overlap each other */
    body .elementor-section + .elementor-section {
        margin-top: 0 !important;
        clear: both !important;
    }
}

/* Tablet and mobile banner fixes */
@media (max-width: 1024px) {
    /* Elementor sections - ensure full visibility and prevent overlap */
    body .elementor-section,
    body .elementor-top-section {
        overflow: visible !important;
        position: relative !important;
        margin-top: 0 !important;
    }
    
    /* Remove fixed height that causes cropping */
    body .elementor-section.elementor-section-height-full,
    body .elementor-section.elementor-section-height-min-height {
        height: auto !important;
        min-height: 0 !important;
    }
    
    /* Banner background images - show full image */
    body .elementor-section,
    body .elementor-section .elementor-background-overlay,
    body .elementor-section > .elementor-background-slideshow,
    body .elementor-section > .elementor-background-video-container {
        background-size: 100% auto !important;
        background-position: center top !important;
        background-repeat: no-repeat !important;
        background-attachment: scroll !important;
    }
    
    /* Ensure containers adapt to content */
    body .elementor-section > .elementor-container,
    body .elementor-section:not(.elementor-section-height-default) > .elementor-container {
        min-height: 0 !important;
        height: auto !important;
        padding-top: 60px !important;
        padding-bottom: 60px !important;
        position: relative !important;
        z-index: 1 !important;
    }
    
    /* Cover images */
    body .wp-block-cover,
    body .wp-block-cover-image,
    body .elementor-widget-image img {
        object-fit: contain !important;
        width: 100% !important;
        height: auto !important;
        max-width: 100% !important;
    }
    
    /* Prevent section overlap - critical for visibility */
    body .elementor-section {
        clear: both !important;
        display: block !important;
        margin-bottom: 0 !important;
        margin-top: 0 !important;
        transform: none !important;
    }
    
    /* Override any negative margins that cause overlap */
    body .elementor-section[data-settings*="margin"],
    body .elementor-section.elementor-element {
        margin-top: 0 !important;
        top: auto !important;
        transform: translateY(0) !important;
    }
}

@media (max-width: 768px) {
    /* Mobile specific adjustments */
    body .elementor-section .elementor-column {
        width: 100% !important;
    }
    
    /* Remove fixed heights completely on mobile */
    body .elementor-section.elementor-section-height-full,
    body .elementor-section.elementor-section-height-min-height,
    body .elementor-section {
        height: auto !important;
        min-height: 0 !important;
        position: relative !important;
        margin-top: 0 !important;
    }
    
    /* Ensure images are not cropped */
    body .elementor-widget-image img,
    body .elementor-background-overlay {
        object-fit: contain !important;
        object-position: center top !important;
    }
    
    /* Banner containers - let content determine height */
    body .elementor-section > .elementor-container {
        min-height: 0 !important;
        height: auto !important;
        padding: 60px 15px !important;
        position: relative !important;
        z-index: 1 !important;
    }
    
    /* Background images - full width, auto height */
    body .elementor-section,
    body .elementor-section > .elementor-background-slideshow,
    body .elementor-section > .elementor-background-video-container,
    body .elementor-background-overlay {
        background-size: 100% auto !important;
        background-repeat: no-repeat !important;
        background-position: center top !important;
        background-attachment: scroll !important;
    }
    
    /* Ensure sections don't overlap - force all sections to respect boundaries */
    body .elementor-section {
        margin-bottom: 0 !important;
        margin-top: 0 !important;
        clear: both !important;
        display: block !important;
        position: relative !important;
        top: 0 !important;
        transform: translateY(0) !important;
    }
    
    /* Override any negative margin on specific sections */
    body section.elementor-section,
    body .elementor-element.elementor-section {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        top: auto !important;
    }
    
    /* Add adequate space for hero/banner sections */
    body .elementor-section.elementor-section-height-full:first-of-type,
    body .elementor-section.elementor-section-height-min-height:first-of-type {
        min-height: 50vh !important;
        margin-bottom: 0 !important;
    }
    
    /* Ensure text content is properly positioned */
    body .elementor-section .elementor-widget-wrap {
        position: relative !important;
        z-index: 2 !important;
    }
    
    /* Force all sections after banner to stay below */
    body .elementor-section + .elementor-section {
        margin-top: 0 !important;
        top: auto !important;
        position: relative !important;
    }
}

@media (max-width: 480px) {
    /* Extra small mobile devices */
    .elementor-section.elementor-section-height-full,
    .elementor-section.elementor-section-height-min-height {
        min-height: 250px !important;
        padding: 30px 15px !important;
    }
    
    /* Ensure text is readable on banners */
    .elementor-section .elementor-heading-title {
        font-size: clamp(24px, 5vw, 40px) !important;
        line-height: 1.3 !important;
    }
    
    /* Button spacing on banners */
    .elementor-section .elementor-button {
        padding: 12px 24px !important;
        font-size: 14px !important;
    }
}

/**
 * WooCommerce My Account Navigation Fix
 * Ensures hover states are visible with proper contrast
 */

/* My Account navigation hover and active states */
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover,
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
    color: #000 !important;
}

/* Ensure text is visible on hover */
.woocommerce-account .woocommerce-MyAccount-navigation li a {
    transition: all 0.3s ease !important;
    color: #333 !important;
}
