/* NUCLEAR OPTION - FORCE EVERYTHING TO WORK */
/* Add this CSS temporarily to make dropdowns work no matter what */

/* Step 1: Fix all overflow issues */
nav,
.header,
.header-main,
.nav-menu,
.nav-menu > li {
    overflow: visible !important;
}

/* Step 2: Make dropdown visible and styled */
.dropdown-menu {
    /* Positioning */
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    
    /* Size and spacing */
    min-width: 220px !important;
    padding: 10px 0 !important;
    margin-top: 5px !important;
    
    /* Visual appearance */
    background: white !important;
    border: 1px solid #e5e5e5 !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.15) !important;
    
    /* Start hidden */
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateY(-10px) !important;
    
    /* Z-index */
    z-index: 999999 !important;
    
    /* Ensure it displays */
    display: block !important;
    max-height: none !important;
    
    /* Animation */
    transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease !important;
}

/* Step 3: Show on hover (this should work!) */
.nav-menu > li.has-dropdown:hover .dropdown-menu {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
}

/* Step 4: Show on click (when dropdown-open class is added) */
.nav-menu > li.has-dropdown.dropdown-open .dropdown-menu {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
}

/* Step 5: Style the dropdown items */
.dropdown-menu li {
    list-style: none !important;
}

.dropdown-menu a {
    display: block !important;
    padding: 10px 20px !important;
    color: #333 !important;
    text-decoration: none !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    background: white !important;
    transition: all 0.2s ease !important;
}

.dropdown-menu a:hover {
    background: #f0f4ff !important;
    color: #1e40af !important;
    padding-left: 25px !important;
}

/* Step 6: Ensure parent items have proper stacking */
.nav-menu > li.has-dropdown {
    position: relative !important;
    z-index: 100 !important;
}

.nav-menu > li.has-dropdown.dropdown-open {
    z-index: 999998 !important;
}

/* Step 7: Style the dropdown toggle icon */
.dropdown-toggle-icon {
    cursor: pointer !important;
}

/* Step 8: Rotate icon when open */
.nav-menu > li.has-dropdown.dropdown-open .dropdown-toggle-icon i {
    transform: rotate(180deg) !important;
}
