/* ── Mobile nav ≤980px — collapsible submenus in Divi's hamburger ──
   Pairs with js/mobile-menu.js, which injects `.mobile-toggle` and flips
   `.dt-open` / `.visible`. Collapse rules need `!important` to beat Divi's
   `.et_mobile_menu li ul { display: block !important }`, and stay scoped to
   `.eos-menu-js` so submenus fall back to open if the JS never runs. */

/* Positioning context for the absolute toggle (nested items too) */
ul.et_mobile_menu li.menu-item-has-children,
ul.et_mobile_menu li.page_item_has_children {
  position: relative;
}

/* Toggle — 44px tap target pinned right; the parent link keeps the rest of the row */
ul.et_mobile_menu li.menu-item-has-children > .mobile-toggle,
ul.et_mobile_menu li.page_item_has_children > .mobile-toggle {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 999;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  min-height: 44px;
  height: 100%;
  padding: 0 !important;
  border: none;
  background-color: transparent;
}

ul.et_mobile_menu li.menu-item-has-children > .mobile-toggle::after,
ul.et_mobile_menu li.page_item_has_children > .mobile-toggle::after {
  font-family: "ETModules";
  content: "\33";
  color: currentColor;
}

ul.et_mobile_menu li.dt-open > .mobile-toggle::after {
  content: "\32";
}

/* height:auto when open — 100% would cover the nested rows and eat their taps */
ul.et_mobile_menu li.dt-open > .mobile-toggle {
  height: auto;
}

/* Collapsed by default; `.children` covers page-based fallback menus */
.eos-menu-js ul.et_mobile_menu li.menu-item-has-children > .sub-menu,
.eos-menu-js ul.et_mobile_menu li.menu-item-has-children > .children,
.eos-menu-js ul.et_mobile_menu li.page_item_has_children > .sub-menu,
.eos-menu-js ul.et_mobile_menu li.page_item_has_children > .children {
  display: none !important;
  visibility: hidden !important;
}

/* Open state — one class heavier than the collapse rule so it wins on specificity */
.eos-menu-js ul.et_mobile_menu li.menu-item-has-children > .sub-menu.visible,
.eos-menu-js ul.et_mobile_menu li.menu-item-has-children > .children.visible,
.eos-menu-js ul.et_mobile_menu li.page_item_has_children > .sub-menu.visible,
.eos-menu-js ul.et_mobile_menu li.page_item_has_children > .children.visible {
  display: block !important;
  visibility: visible !important;
}

/* Undo Divi's tint + bold on parent rows */
ul.et_mobile_menu li.menu-item-has-children > a {
  background-color: transparent;
  font-weight: 400;
}

/* ── .pa-open-mobile-menu — opt-in class: stacked list ≤980px instead of the
   hamburger. On the footer menu; the header omits it. ── */
@media (max-width: 980px) {
  .pa-open-mobile-menu .et_pb_menu__menu {
    display: flex !important;
    flex-direction: column !important;
  }
  .pa-open-mobile-menu .et_mobile_nav_menu {
    display: none !important;
  }
}