/* static/css/mobile-dropdown-fix.css */

/* Ensure dropdowns can escape the navbar and sit on top */
.navbar { overflow: visible; }
.dropdown-menu { z-index: 1050; }

/* Make sure visible state is truly visible even if earlier CSS tweaked opacity/visibility */
.dropdown-menu.show {
  display: block;
  opacity: 1;
  visibility: visible;
  transform: none;
}

/* Desktop: allow hover-to-open if you like that behavior */
@media (min-width: 992px) {
  .navbar .dropdown:hover > .dropdown-menu {
    display: block;
    opacity: 1;
    visibility: visible;
    transform: none;
  }
  .dropdown-submenu:hover > .dropdown-menu {
    display: block;
    opacity: 1;
    visibility: visible;
    transform: none;
  }
}

/* Mobile/tablet: stack submenus in-flow so they don't go off-screen */
@media (max-width: 991.98px) {
  .dropdown-submenu > .dropdown-menu {
    position: static;
    float: none;
    margin: .25rem 0 0;
    border: 0;
    box-shadow: none;
  }

  /* show nested menu only when toggled .show by JS */
  .dropdown-submenu > .dropdown-menu { display: none; }
  .dropdown-submenu > .dropdown-menu.show { display: block; }

  /* Optional caret for submenu parents */
  .dropdown-submenu > .dropdown-item.has-arrow::after {
    content: "\203A"; /* › */
    float: right;
  }
}