/* ============================================
   SIMPLE MOBILE NAV DROPDOWN FIX
   Pure CSS solution for mobile dropdowns
   ============================================ */

@media (max-width: 991px) {
  /* Make dropdowns work with pure CSS on mobile */
  .navbar-nav .dropdown {
    position: relative;
  }

  /* Hide dropdown by default */
  .navbar-nav .dropdown .dropdown-menu {
    display: none !important;
    position: static !important;
    width: 100% !important;
    border: none !important;
    box-shadow: none !important;
    background-color: rgba(248, 249, 250, 0.95) !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Show dropdown on focus/active */
  .navbar-nav .dropdown:focus-within .dropdown-menu,
  .navbar-nav .dropdown:active .dropdown-menu,
  .navbar-nav .dropdown.show .dropdown-menu {
    display: block !important;
  }

  /* Make dropdown toggle focusable */
  .navbar-nav .dropdown-toggle {
    cursor: pointer !important;
    position: relative !important;
    padding-right: 2.5rem !important;
  }

  /* Arrow indicator */
  .navbar-nav .dropdown-toggle::after {
    position: absolute !important;
    right: 1rem !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    pointer-events: none !important;
  }

  /* Dropdown items */
  .navbar-nav .dropdown-menu .dropdown-item {
    display: block !important;
    width: 100% !important;
    padding: 0.75rem 2rem !important;
    clear: both !important;
    font-weight: 400 !important;
    color: #212529 !important;
    text-align: inherit !important;
    white-space: nowrap !important;
    background-color: transparent !important;
    border: 0 !important;
  }

  .navbar-nav .dropdown-menu .dropdown-item:hover,
  .navbar-nav .dropdown-menu .dropdown-item:focus {
    color: var(--primary-color) !important;
    background-color: rgba(64, 0, 165, 0.05) !important;
  }

  /* Active state */
  .navbar-nav .dropdown-menu .dropdown-item.active {
    color: var(--primary-color) !important;
    background-color: rgba(64, 0, 165, 0.1) !important;
    font-weight: 600 !important;
  }

  /* Ensure proper touch targets */
  .navbar-nav .dropdown-toggle,
  .navbar-nav .dropdown-item {
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
  }

  /* RTL support */
  [dir="rtl"] .navbar-nav .dropdown-toggle {
    padding-right: 1rem !important;
    padding-left: 2.5rem !important;
  }

  [dir="rtl"] .navbar-nav .dropdown-toggle::after {
    right: auto !important;
    left: 1rem !important;
  }

  [dir="rtl"] .navbar-nav .dropdown-menu .dropdown-item {
    text-align: right !important;
  }

  /* Accessibility: Show dropdown on keyboard navigation */
  .navbar-nav .dropdown-toggle:focus + .dropdown-menu,
  .navbar-nav .dropdown-toggle:focus-visible + .dropdown-menu {
    display: block !important;
  }

  /* Keep dropdown open when navigating items */
  .navbar-nav .dropdown-menu:hover,
  .navbar-nav .dropdown-menu:focus-within {
    display: block !important;
  }
}

/* Alternative: Checkbox hack for better mobile support */
@media (max-width: 991px) {
  /* Hide checkbox */
  .mobile-dropdown-toggle {
    display: none;
  }

  /* Style the label as dropdown toggle */
  .mobile-dropdown-label {
    display: block !important;
    width: 100% !important;
    padding: 0.5rem 1rem !important;
    cursor: pointer !important;
    position: relative !important;
  }

  /* Show dropdown when checkbox is checked */
  .mobile-dropdown-toggle:checked ~ .dropdown-menu {
    display: block !important;
  }

  /* Rotate arrow when checked */
  .mobile-dropdown-toggle:checked ~ .mobile-dropdown-label::after {
    transform: translateY(-50%) rotate(180deg) !important;
  }
}

/* Fallback for JavaScript disabled */
.no-js .navbar-nav .dropdown:hover .dropdown-menu,
.no-js .navbar-nav .dropdown:focus-within .dropdown-menu {
  display: block !important;
}

/* iOS Safari specific fixes */
@supports (-webkit-touch-callout: none) {
  @media (max-width: 991px) {
    .navbar-nav .dropdown-toggle {
      -webkit-touch-callout: none !important;
      -webkit-user-select: none !important;
      -webkit-tap-highlight-color: transparent !important;
    }
  }
}

/* Ensure dropdowns work on desktop */
@media (min-width: 992px) {
  .navbar-nav .dropdown .dropdown-menu {
    display: none;
  }

  .navbar-nav .dropdown:hover .dropdown-menu,
  .navbar-nav .dropdown.show .dropdown-menu {
    display: block;
  }

  .navbar-nav .dropdown-toggle {
    padding-right: 0.5rem !important;
  }

  .mobile-dropdown-toggle,
  .mobile-dropdown-label {
    display: none !important;
  }
}