/* Dropdown Fix CSS - Ensures user dropdown always appears above all content */

/* Force navbar to be on top */
header {
    position: relative !important;
    z-index: 50000 !important;
}

/* Force user dropdown to be on top of everything */
#userDropdown {
    position: fixed !important;
    z-index: 99999 !important;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25) !important;
    backdrop-filter: blur(8px);
    border: 1px solid rgba(229, 231, 235, 0.5) !important;
}

/* Ensure no other elements can override our dropdown */
#userDropdown * {
    position: relative;
    z-index: 1;
}

/* Prevent dashboard elements from creating new stacking contexts */
.dashboard-content,
.dashboard-content * {
    position: relative;
    z-index: auto !important;
}

/* Override any high z-index charts or dashboard elements */
canvas,
.chart-container,
.dashboard-card,
.card,
[class*="chart"],
[class*="graph"] {
    z-index: auto !important;
    position: relative !important;
}

/* Mobile menu should be below dropdown */
#mobileMenu {
    z-index: 40000 !important;
}

/* Additional safety for dropdown visibility */
#userDropdown.show,
#userDropdown:not(.hidden) {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    z-index: 99999 !important;
    position: fixed !important;
}