/* Shared mobile overlay behavior: used by styles.css and standalone pages. */
html:has(.mobile-menu.active),
body:has(.mobile-menu.active) {
  overflow: hidden !important;
}

/* A filtered/transformed ancestor would anchor fixed children to the header. */
.global-nav:has(.mobile-menu.active) {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transform: none !important;
}

.global-nav:has(.mobile-menu.active) .hamburger {
  position: fixed !important;
  top: 24px !important;
  right: 24px !important;
  z-index: 1002 !important;
}

/* Keep scrolling links out of the close button's fixed hit area. */
.global-nav:has(.mobile-menu.active)::after {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 64px;
  background: #fbfaf6;
  z-index: 1001;
}

.mobile-menu {
  overscroll-behavior-y: contain;
}

/* Shared VI/EN headers only: floating contact controls must not cover menu links. */
html:is([lang="vi"], [lang="en"]):has(script[src="/scripts/header.js"]) body:has(.mobile-menu.active) .chat-btn {
  visibility: hidden !important;
}

/* Clip horizontal spill without making body a scroll container for sticky nav.
   Keep the existing full scroll lock while the mobile menu is open. */
html:is([lang="vi"], [lang="en"]):has(script[src="/scripts/header.js"]):not(:has(.mobile-menu.active)),
html:is([lang="vi"], [lang="en"]):has(script[src="/scripts/header.js"]):not(:has(.mobile-menu.active)) body {
  overflow-x: clip !important;
}