/* Menu fixes: show submenu on desktop hover and enable expandable submenu on mobile */

/* Desktop: show nav and dropdown on hover */
@media (min-width: 992px) {
  /* ensure nav visible and dropdowns can overflow */
  .nav-switch, .nav-switch * { overflow: visible !important; }
  .nav-switch nav { display: block !important; }
  .nav-switch nav ul { display: flex !important; gap: 1rem; align-items: center; }
  .nav-switch nav ul li { position: relative !important; }
  .nav-switch nav ul li .submenu {
    position: absolute !important;
    left: 0 !important;
    top: 100% !important;
    min-width: 220px !important;
    background: #0052a3 !important;
    box-shadow: 0 6px 18px rgba(0,0,0,0.08) !important;
    padding: 0.5rem 0 !important;
    display: none !important;
    z-index: 99999 !important;
  }
  .nav-switch nav ul li .submenu li { display: block !important; padding: 0 !important; }
  .nav-switch nav ul li .submenu li a { display: block !important; padding: 0.5rem 1rem !important; color: #fff !important; }
  /* force visible on hover, with !important to override other rules */
  .nav-switch nav ul li:hover > .submenu,
  .nav-switch nav ul li:focus-within > .submenu {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: translateY(0) !important;
  }

  /* accessibility: ensure submenu links are focusable when using keyboard */
  .nav-switch nav ul li .submenu a { visibility: visible !important; }
}

/* Mobile: hide nav by default, toggle with .open on .nav-switch */
@media (max-width: 991px) {
  .nav-switch nav { display: none; }
  .nav-switch.open nav { display: block; }
  .nav-switch nav ul { display: block; }
  .nav-switch nav ul li { position: relative; }
  .nav-switch nav ul li .submenu { display: none; padding-left: 1rem; }
  .nav-switch nav ul li.expanded > .submenu { display: block; }
  .nav-switch .submenu-arrow { float: right; }
  /* make the toggle button easier to tap */
  .navbar-toggle { padding: 0.6rem 0.8rem; font-size: 1.2rem; }
}

/* Accessibility: visually indicate expanded state */
.child-menu-bar > a[aria-expanded="true"] .submenu-arrow {
  transform: rotate(180deg);
}