/* Universal Dropdown Menu Fix - Ensures ALL dropdowns appear above sliders and other elements */

/* Override ALL Bootstrap dropdown z-index values */
.dropdown-menu,
.navbar .dropdown-menu,
.nav-item .dropdown-menu,
.theme-dropdown-menu,
.theme-dropdown-menu-portal {
    z-index: 9999999 !important;
    position: absolute !important;
}

/* Force dropdown menus to render at highest level */
.dropdown-menu {
    z-index: 9999999 !important;
    position: absolute !important;
    background: rgba(255, 255, 255, 0.98) !important;
    backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(0,0,0,0.1) !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2) !important;
    border-radius: 8px !important;
}

/* Ensure dropdowns appear above slider elements */
.hero-slider,
.slider-nav,
.slider-dots,
.slide,
.slide-overlay,
.slide-content {
    z-index: 1 !important;
}

/* Force slider navigation to stay below dropdowns */
.slider-nav {
    z-index: 1 !important;
}

.slider-dots {
    z-index: 1 !important;
}

/* Override any competing z-index values */
.marquee-container {
    z-index: 1 !important;
}

/* Ensure header stays below dropdowns but above content */
.header,
.navbar {
    z-index: 1000 !important;
}

/* Universal dropdown portal system */
.universal-dropdown-portal {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    pointer-events: none !important;
    z-index: 9999999 !important;
}

.universal-dropdown-portal.active {
    pointer-events: auto !important;
}

.universal-dropdown-portal .dropdown-menu {
    pointer-events: auto !important;
    position: absolute !important;
    z-index: 9999999 !important;
}

/* Ensure theme menu portal has highest priority */
.theme-dropdown-menu-portal,
.theme-dropdown-menu {
    z-index: 9999999 !important;
}

/* Override any inline styles that might interfere */
[style*="z-index"] .dropdown-menu {
    z-index: 9999999 !important;
}

/* Special handling for mobile devices */
@media (max-width: 768px) {
    .dropdown-menu,
    .navbar .dropdown-menu,
    .theme-dropdown-menu {
        z-index: 9999999 !important;
        position: fixed !important;
    }
}

/* Debug helper - shows z-index values */
.debug-zindex .dropdown-menu::after {
    content: "z-index: 9999999";
    position: absolute;
    top: -20px;
    right: 0;
    background: red;
    color: white;
    padding: 2px 5px;
    font-size: 10px;
    border-radius: 3px;
}

/* CRITICAL FIX: Suppress all competing elements first - DEFINITIVE SOLUTION */

/* Force ALL slider elements to lowest z-index */
.hero-slider, .hero-slider *, 
.slider-nav, .slider-nav.prev, .slider-nav.next,
.slider-dots, .slide, .slide-overlay, .slide-content,
.marquee-container, .marquee-text {
    z-index: 0 !important;
}

/* Force slow marquee speed for readability */
.marquee-text {
    animation: marquee 90s linear infinite !important;
}

/* Override any inline styles on slider elements */
[class*="slider"], [class*="slide"], [class*="marquee"] {
    z-index: 0 !important;
}

/* Force header/navbar to intermediate level */
.header { z-index: 10000 !important; }
.navbar { z-index: 10000 !important; }

/* Ensure main navigation dropdowns work */
.navbar .dropdown-menu {
    z-index: 1001 !important;
}

/* Create isolated stacking context for dropdowns */
.dropdown, .nav-item.dropdown {
    position: relative !important;
    z-index: 1001 !important;
}

/* DROPDOWN ELEMENTS - HIGHEST PRIORITY */
.dropdown-menu { z-index: 9999999 !important; }
.theme-dropdown-menu-portal { z-index: 9999999 !important; }
.theme-dropdown-menu { z-index: 9999999 !important; }
.theme-notification { z-index: 9999998 !important; }

/* Bootstrap dropdown overrides */
.navbar .dropdown-menu,
.nav-item .dropdown-menu {
    z-index: 9999999 !important;
    position: absolute !important;
}

/* Force dropdown positioning to be independent */
.dropdown-menu,
.theme-dropdown-menu {
    transform: translateZ(0) !important; /* Force hardware acceleration */
    will-change: transform, opacity !important;
}

/* MOBILE MENU HAMBURGER BUTTON FIXES */
.navbar-toggler {
    outline: none !important;
    border: 2px solid rgba(255,255,255,0.3) !important;
    border-radius: 4px !important;
    padding: 6px 10px !important;
    background: transparent !important;
    position: relative !important;
    z-index: 1001 !important;
    cursor: pointer !important;
}

.navbar-toggler:focus,
.navbar-toggler:active,
.navbar-toggler:hover {
    box-shadow: 0 0 0 2px rgba(255,255,255,0.3) !important;
    border-color: rgba(255,255,255,0.6) !important;
    background: rgba(255,255,255,0.1) !important;
}

.navbar-toggler-icon {
    background-image: none !important;
    width: 24px !important;
    height: 20px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
}

.navbar-toggler-icon i,
.navbar-toggler-icon .fas {
    color: white !important;
    font-size: 20px !important;
    line-height: 1 !important;
    display: block !important;
}

/* MOBILE NAVBAR COLLAPSE FIXES */
@media (max-width: 991.98px) {
    .navbar-collapse {
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        right: 0 !important;
        background: rgba(0,0,0,0.95) !important;
        backdrop-filter: blur(10px) !important;
        border-radius: 0 0 8px 8px !important;
        padding: 20px !important;
        margin: 0 !important;
        box-shadow: 0 8px 25px rgba(0,0,0,0.3) !important;
        border: 1px solid rgba(255,255,255,0.1) !important;
        border-top: none !important;
        z-index: 9999998 !important;
    }
    
    /* Ensure mobile navbar collapse doesn't overlap desktop */
    .container .navbar-collapse {
        position: absolute !important;
    }
}
    
    /* Hide collapsed menu by default (mobile only) */
    @media (max-width: 991.98px) {
        .navbar-collapse:not(.show) {
            display: none !important;
            visibility: hidden !important;
            opacity: 0 !important;
        }
    }
    
    /* CRITICAL: Force desktop menu to always be visible */
    @media (min-width: 992px) {
        .navbar-collapse {
            display: flex !important;
            visibility: visible !important;
            opacity: 1 !important;
            position: static !important;
            flex-basis: auto !important;
            flex-grow: 1 !important;
        }
        
        /* Override mobile positioning on desktop */
        .container .navbar-collapse {
            position: static !important;
        }
        
        .navbar-nav {
            flex-direction: row !important;
            display: flex !important;
            margin-left: auto !important;
        }
        
        .navbar-nav .nav-item {
            margin-left: 0.5rem !important;
        }
        
        .navbar-nav .nav-link {
            padding: 0.5rem 1rem !important;
            color: rgba(255,255,255,0.8) !important;
            font-weight: 500 !important;
        }
        
        .navbar-nav .nav-link:hover {
            color: white !important;
        }
    }
    
    /* Show expanded menu on mobile */
    @media (max-width: 991.98px) {
        .navbar-collapse.show {
            display: block !important;
            visibility: visible !important;
            opacity: 1 !important;
            animation: mobileMenuSlideDown 0.3s ease-out !important;
        }
    }
    
    /* Mobile navigation items styling */
    .navbar-nav {
        flex-direction: column !important;
        width: 100% !important;
        gap: 0 !important;
    }
    
    .navbar-nav .nav-item {
        width: 100% !important;
        margin: 2px 0 !important;
    }
    
    .navbar-nav .nav-link {
        color: white !important;
        padding: 12px 15px !important;
        border-radius: 6px !important;
        display: flex !important;
        align-items: center !important;
        font-weight: 500 !important;
        transition: all 0.3s ease !important;
        text-decoration: none !important;
    }
    
    .navbar-nav .nav-link:hover,
    .navbar-nav .nav-link:focus {
        background: rgba(255,255,255,0.1) !important;
        color: #ffd700 !important;
        transform: translateX(5px) !important;
    }
    
    .navbar-nav .nav-link i {
        margin-right: 10px !important;
        width: 20px !important;
        text-align: center !important;
    }
}

/* Animation for mobile menu slide down */
@keyframes mobileMenuSlideDown {
    from {
        opacity: 0;
        transform: translateY(-15px);
        visibility: hidden;
    }
    to {
        opacity: 1;
        transform: translateY(0);
        visibility: visible;
    }
}

/* Ensure mobile menu button is always clickable */
.navbar-toggler {
    pointer-events: auto !important;
    user-select: none !important;
}

/* Force Bootstrap collapse behavior */
.collapse:not(.show) {
    display: none !important;
}

.collapsing {
    height: auto !important;
    transition: all 0.3s ease !important;
}

/* Emergency visibility fixes */
.navbar-toggler[aria-expanded="true"] ~ .navbar-collapse,
.navbar-toggler[aria-expanded="true"] + .navbar-collapse {
    display: block !important;
    visibility: visible !important;
}

/* Container positioning fix */
.container .navbar-toggler {
    position: relative !important;
    z-index: 1002 !important;
}

.container .navbar-collapse {
    position: static !important;
    z-index: 1001 !important;
}

/* FINAL OVERRIDE: Force Bootstrap collapse behavior on desktop to be disabled */
@media (min-width: 992px) {
    .navbar-expand-lg .navbar-collapse {
        display: flex !important;
        flex-basis: auto !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    .navbar-expand-lg .navbar-nav {
        flex-direction: row !important;
        display: flex !important;
    }
    
    .navbar-expand-lg .navbar-toggler {
        display: none !important;
    }
}

/* Emergency visibility fix for all desktop breakpoints */
@media (min-width: 992px) {
    .navbar-collapse.collapse:not(.show) {
        display: flex !important;
    }
}