/**
 * Dropdown Fix CSS
 * 
 * This CSS file fixes issues with dropdown menus overlapping with page content
 * by adjusting z-index values and ensuring proper positioning.
 */

/* Ensure dropdown menus appear above page content */
.dropdown-menu {
    z-index: 1030 !important; /* Higher than default Bootstrap z-index */
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

/* Fix for navbar dropdowns */
.navbar .dropdown-menu {
    margin-top: 0.125rem !important;
    border: 1px solid rgba(0, 0, 0, 0.15) !important;
}

/* Ensure the dropdown toggle has proper z-index */
.dropdown-toggle {
    position: relative;
    z-index: 1031 !important; /* Higher than dropdown-menu */
}

/* Fix for dropdown items */
.dropdown-item {
    padding: 0.5rem 1.5rem !important;
}

/* Fix for dropdown headers */
.dropdown-header {
    padding: 0.5rem 1.5rem !important;
    font-weight: 600 !important;
}

/* Fix for dropdown dividers */
.dropdown-divider {
    margin: 0.5rem 0 !important;
}

/* Ensure page content doesn't overlap with dropdowns */
.container-fluid, 
.container,
.card,
.table-responsive {
    position: relative;
    z-index: 1 !important; /* Lower than dropdown z-index */
}

/* Fix for navbar z-index */
.navbar {
    z-index: 1029 !important; /* Lower than dropdown but higher than content */
}

/* Remove modal z-index rules from dropdown-fix.css since they're now in modal-fix.css */
/* This prevents conflicts between the two CSS files */

/* Fix for tooltips and popovers */
.tooltip {
    z-index: 1070 !important;
}
.popover {
    z-index: 1060 !important;
}

/* Fix for dropdown positioning */
.dropdown {
    position: relative !important;
}

/* Hide all dropdown menus by default */
.dropdown-menu {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: none !important;
    animation: none !important;
}

/* Only show dropdown menus with the show class */
.dropdown-menu.show {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    z-index: 1030 !important;
}

/* Override any Bootstrap transitions or animations */
.dropdown-menu.fade {
    transition: none !important;
    animation: none !important;
}

/* Override any hover effects */
.dropdown:hover .dropdown-menu {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}

.dropdown:hover .dropdown-menu.show {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Fix for dropdown menu width */
.dropdown-menu {
    min-width: 10rem !important;
    max-width: 20rem !important;
}

/* Fix for dropdown menu scrolling if too many items */
.dropdown-menu.scrollable {
    max-height: 80vh !important;
    overflow-y: auto !important;
}

/* Fix for dropdown menu animation */
.dropdown-menu {
    animation: dropdown-animation 0.2s ease-out !important;
    transform-origin: top center !important;
}

@keyframes dropdown-animation {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}