/* Local fallback for the exported mobile navigation drawer. */
#mobile-hamburger-drawer {
  position: fixed !important;
  top: 0;
  left: 0;
  bottom: 0;
  z-index: 10001;
  width: min(86vw, 360px);
  max-width: 100%;
  overflow-y: auto;
  background: #202d35;
  transform: translateX(-105%);
  transition: transform 0.25s ease;
  visibility: hidden;
  box-shadow: 4px 0 18px rgba(0, 0, 0, 0.25);
}

body.mobile-menu-open #mobile-hamburger-drawer {
  transform: translateX(0);
  visibility: visible;
}

#layout-drawer-overlay {
  position: fixed !important;
  inset: 0;
  z-index: 10000;
  display: block !important;
  background: rgba(0, 0, 0, 0.45);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}

body.mobile-menu-open #layout-drawer-overlay {
  opacity: 1;
  visibility: visible;
}

#layout-drawer-hamburger {
  position: fixed !important;
  top: 20px;
  right: 18px;
  z-index: 10002;
  display: block !important;
  cursor: pointer;
  touch-action: manipulation;
}

body.mobile-menu-open {
  overflow: hidden;
}

#mobile-hamburger-drawer a {
  touch-action: manipulation;
}

@media (prefers-reduced-motion: reduce) {
  #mobile-hamburger-drawer,
  #layout-drawer-overlay {
    transition: none;
  }
}

/* Sub-menu accordion inside the drawer.
   The exported theme collapses sub-lists with max-height/opacity (not display),
   so the open state has to override those same properties. */
#mobile-hamburger-drawer .unifiednav__container[data-depth] {
  opacity: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
  transition: max-height 0.3s ease-in-out, opacity 0.25s ease-out !important;
}

#mobile-hamburger-drawer .unifiednav__item-wrap.mobile-submenu-open > .unifiednav__container[data-depth] {
  opacity: 1 !important;
  max-height: 200em !important;
  pointer-events: auto !important;
}

#mobile-hamburger-drawer .unifiednav__item_has-sub-nav > .nav-item-text .icon::before {
  transition: transform 0.3s ease;
}

#mobile-hamburger-drawer .unifiednav__item-wrap.mobile-submenu-open > .unifiednav__item_has-sub-nav > .nav-item-text .icon::before {
  transform: rotate(180deg);
}

@media (prefers-reduced-motion: reduce) {
  #mobile-hamburger-drawer .unifiednav__container[data-depth],
  #mobile-hamburger-drawer .unifiednav__item_has-sub-nav > .nav-item-text .icon::before {
    transition: none !important;
  }
}