/* Navigation overlay ordering for the Early Access campaign.
   Layer contract: modal > navbar/dropdowns > mobile panel > banner > page. */

@media (max-width: 768px) {
  .nav__mobile {
    top: calc(var(--nav-h) + var(--ea-banner-h, 0px)) !important;
    z-index: 950 !important;
    max-height: calc(100dvh - var(--nav-h) - var(--ea-banner-h, 0px));
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  /* The legacy mobile override also opens the language menu via
     :focus-within/:active. That can leave it visually open after JS has
     already closed it. Make .open the single source of truth. */
  .lang-sw:not(.open) .lang-drop,
  .lang-sw:focus-within:not(.open) .lang-drop,
  .lang-sw:active:not(.open) .lang-drop {
    display: block !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(-8px) !important;
  }

  .lang-sw.open .lang-drop {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) !important;
    z-index: 1100 !important;
  }
}