/* Dropdown Toggle Fix - Click Support for Desktop, Mobile Click Toggle */
/* High priority overrides to ensure both hover and click work correctly */
/* iPad/Touch optimized */

/* ========== MOBILE FIRST (max-width: 1024px) ========== */
@media screen and (max-width: 1024px) {
    /* DISABLE all hover effects on mobile/tablet */
    .mega-menu:hover .mega-dropdown {
        opacity: 0 !important;
        visibility: hidden !important;
        display: none !important;
        pointer-events: none !important;
    }
    
    /* iPad/Touch optimization - prevent accidental hover triggers */
    .dropdown-toggle {
        touch-action: manipulation !important;
        -webkit-tap-highlight-color: transparent !important;
        user-select: none !important;
        -webkit-user-select: none !important;
        -webkit-touch-callout: none !important;
    }
    
    /* Mobile: ONLY click-open class shows dropdown */
    .mega-menu.click-open .mega-dropdown {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: translateX(-50%) translateY(0) !important;
        pointer-events: all !important;
    }
    
    /* Legacy mobile-open class support */
    .mega-dropdown.mobile-open {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: translateX(-50%) translateY(0) !important;
    }
    
    /* Ensure columns are visible in mobile */
    .mega-menu.click-open .mega-column,
    .mega-dropdown.mobile-open .mega-column {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    /* iPad specific - force position */
    .mega-menu.click-open {
        position: relative !important;
        z-index: 9999 !important;
    }
    
    /* Arrow rotation when open */
    .mega-menu.click-open .dropdown-toggle::before {
        transform: rotate(180deg) !important;
    }
    
    /* Override hover arrow rotation (disabled on touch) */
    .mega-menu:hover .dropdown-toggle::before {
        transform: none !important;
    }
}

/* ========== DESKTOP (min-width: 1025px) ========== */
@media screen and (min-width: 1025px) {
    /* Desktop: Enable click-open state */
    .mega-menu.click-open .mega-dropdown {
        opacity: 1 !important;
        visibility: visible !important;
        transform: translateX(-50%) translateY(0) !important;
        pointer-events: all !important;
        display: grid !important;
    }
    
    /* Desktop: Allow normal hover behavior when NOT clicked */
    .mega-menu:not(.click-open):hover .mega-dropdown {
        opacity: 1;
        visibility: visible;
        transform: translateX(-50%) translateY(0);
    }
    
    /* Desktop: When clicked open, keep it open regardless of hover */
    .mega-menu.click-open:hover .mega-dropdown {
        opacity: 1 !important;
        visibility: visible !important;
        transform: translateX(-50%) translateY(0) !important;
    }
    
    /* Arrow rotation when clicked open */
    .mega-menu.click-open .dropdown-toggle::before {
        transform: rotate(180deg) !important;
    }
    
    /* Block hover from re-showing dropdown immediately after user clicks to close */
    .mega-menu.hover-disabled:hover .mega-dropdown {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
    .mega-menu.hover-disabled .dropdown-toggle::before {
        transform: none !important;
    }
}
