/* ========================================
   Dropdown Menu Z-Index Fix
   Ensures dropdowns appear above all page content
   ======================================== */

/* Bootstrap dropdown menus - set high z-index */
.dropdown-menu {
  z-index: 9999 !important;
  position: absolute !important;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15) !important;
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
  background: white !important;
}

/* Ensure dropdown toggles and their parent containers have proper z-index */
.dropdown,
.nav-item.dropdown {
  position: relative;
  z-index: 9990;
}

/* When dropdown is showing, increase z-index even more */
.dropdown.show,
.nav-item.dropdown.show {
  z-index: 9995 !important;
}

/* Fix for navbar dropdowns specifically */
.navbar .dropdown-menu {
  z-index: 9999 !important;
  margin-top: 0.25rem;
}

/* Ensure dropdowns in the navbar are visible */
.navbar-nav .dropdown-menu {
  position: absolute !important;
  z-index: 9999 !important;
  background: white !important;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15) !important;
}

/* Fix for dropdowns in modals */
.modal .dropdown-menu {
  z-index: 10050 !important;
}

/* Fix for dropdowns in the appshell topbar */
.appshell-topbar .dropdown-menu,
.topbar-right .dropdown-menu {
  z-index: 9999 !important;
  position: absolute !important;
}

/* Ensure dropdown menus in data tables are visible */
.dataTables_wrapper .dropdown-menu,
table .dropdown-menu {
  z-index: 9999 !important;
}

/* Fix overflow issues that might hide dropdowns */
.navbar-collapse {
  overflow: visible !important;
}

.navbar-nav {
  overflow: visible !important;
}

/* Ensure dropdown items are clickable */
.dropdown-item {
  position: relative;
  z-index: 1;
  cursor: pointer;
}

.dropdown-item:hover {
  background-color: #f8f9fa;
}

/* Fix for RTL language support */
[dir="rtl"] .dropdown-menu {
  right: auto !important;
  left: 0 !important;
}

/* Animation for dropdown appearance */
.dropdown-menu {
  animation: dropdownFadeIn 0.2s ease-out;
  transform-origin: top;
}

@keyframes dropdownFadeIn {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Ensure dropdowns work with sticky headers */
.sticky-top .dropdown-menu,
.fixed-top .dropdown-menu {
  z-index: 9999 !important;
}

/* Fix for dropdown menus in cards and panels */
.card .dropdown-menu,
.panel .dropdown-menu {
  z-index: 9999 !important;
}

/* Responsive fixes for mobile */
@media (max-width: 768px) {
  .dropdown-menu {
    position: absolute !important;
    z-index: 9999 !important;
    width: calc(100vw - 2rem);
    max-width: 300px;
  }
}

/* Dark mode support */
@media (prefers-color-scheme: dark) {
  .dropdown-menu {
    background: #1a1a1a !important;
    border-color: #333 !important;
  }
  
  .dropdown-item {
    color: #fff;
  }
  
  .dropdown-item:hover {
    background-color: #2a2a2a;
  }
}