@media (max-width: 1023px) {
  body.wm-mobile-menu-open {
    overflow: hidden !important;
    touch-action: none !important;
  }

  #navbar {
    z-index: 70 !important;
  }

  #navbar > #mobileMenu {
    position: absolute !important;
    top: var(--wm-navbar-height, 64px) !important;
    right: 0 !important;
    bottom: auto !important;
    height: calc(100dvh - var(--wm-world-bar-height, 36px) - var(--wm-navbar-height, 64px)) !important;
    width: min(88vw, 360px) !important;
    max-width: min(88vw, 360px) !important;
    padding-top: 1rem !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
    z-index: 75 !important;
    transform: translateX(110%) !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  #navbar > #mobileMenu.open {
    transform: translateX(0) !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  body.wm-mobile-menu-open #mobileMenu {
    transform: translateX(0) !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  #navbar > #mobileOverlay {
    position: absolute !important;
    top: var(--wm-navbar-height, 64px) !important;
    left: 0 !important;
    right: 0 !important;
    height: calc(100dvh - var(--wm-world-bar-height, 36px) - var(--wm-navbar-height, 64px)) !important;
    z-index: 68 !important;
  }

  #mobileMenu .mobile-acc-content.open {
    display: flex !important;
    flex-direction: column !important;
  }
}

@media (max-width: 767px) {
  #navbar > #mobileMenu {
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    max-width: none !important;
    padding: 0.75rem 1rem max(1.25rem, env(safe-area-inset-bottom)) !important;
    border-top: 1px solid #e2e8f0 !important;
    box-shadow: 0 18px 36px rgba(15, 23, 42, 0.18) !important;
    transition: none !important;
  }

  #mobileMenu > div {
    max-width: 100% !important;
  }

  #navbar > #mobileMenu.open {
    transform: translateX(0) !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  body.wm-mobile-menu-open #mobileMenu {
    transform: translateX(0) !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  #navbar ul.hidden.md\:flex {
    display: none !important;
  }

  #hamburger.md\:hidden,
  #mobileMenu.md\:hidden {
    display: block !important;
  }

  #hamburger.md\:hidden {
    display: flex !important;
  }

  #mobileOverlay.md\:hidden:not(.hidden) {
    display: block !important;
  }
}

@media (min-width: 1024px) {
  #navbar > #mobileMenu,
  #navbar > #mobileOverlay,
  #hamburger {
    display: none !important;
  }
}