/* Minimal mobile navigation; submenu behavior remains an inline accordion. */
#m-menu-drawer {
  --mobile-nav-ink: #061b37;
  --mobile-nav-gold: #c99b3f;
  --mobile-nav-line: #d6dfeb;
}
#m-menu-drawer .m-menu-drawer__wrapper {
  width: min(420px, 100%);
  color: var(--mobile-nav-ink);
  background: #ffffff;
  border-top: 1px solid var(--mobile-nav-line);
  box-shadow: 12px 0 40px rgb(6 27 55 / 8%);
}
#m-menu-drawer .m-menu-drawer__content {
  justify-content: flex-start;
  box-sizing: border-box;
  min-height: 0;
  overflow-y: auto;
  padding: 0 24px max(24px, env(safe-area-inset-bottom));
  overscroll-behavior: contain;
  touch-action: pan-y;
}
#m-menu-drawer .m-menu-drawer__navigation {
  flex: 0 0 auto;
  min-height: 0;
  overflow-y: visible;
  overscroll-behavior: contain;
  touch-action: pan-y;
  scrollbar-width: thin;
}
#m-menu-drawer .m-menu-drawer__navigation > .m-menu-mobile__item {
  margin: 0;
  border: 0;
  border-bottom: 1px solid var(--mobile-nav-line);
  border-radius: 0;
  background: transparent;
}
#m-menu-drawer .m-menu-drawer__navigation > .m-menu-mobile__item:last-child { border-bottom: 0; }
#m-menu-drawer .m-menu-mobile__item { flex-wrap: wrap; }
#m-menu-drawer .m-menu-mobile__item > .m-menu-mobile__link { flex: 1 1 0; }
#m-menu-drawer .m-menu-mobile__item > a {
  min-width: 0;
  min-height: 58px;
  justify-content: flex-start;
  gap: 0;
  padding: 16px 0;
  color: var(--mobile-nav-ink);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
  overflow-wrap: anywhere;
  border-radius: 0;
  transition: color .18s ease;
}
#m-menu-drawer .m-mobile-nav-icon { display: none; }
#m-menu-drawer .m-menu-mobile__item > a[aria-current='page'] { color: var(--mobile-nav-gold); }
#m-menu-drawer .m-menu-mobile__toggle-button {
  flex: 0 0 44px;
  min-height: 58px;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: #76818b;
  background: transparent;
}
#m-menu-drawer .m-menu-mobile__toggle-button svg {
  width: 11px;
  height: 11px;
  pointer-events: none;
  transition: transform .2s ease;
}
#m-menu-drawer .m-menu-mobile__toggle-button[aria-expanded='true'] { color: var(--mobile-nav-ink); }
#m-menu-drawer .m-menu-mobile__toggle-button[aria-expanded='true'] svg { transform: rotate(90deg); }
#m-menu-drawer :is(a, button):focus-visible { outline: 2px solid var(--mobile-nav-gold); outline-offset: -2px; }
#m-menu-drawer .m-menu-mobile :is(a, button):focus:not(:focus-visible) { outline: none; box-shadow: none; }
#m-menu-drawer .m-megamenu-mobile {
  position: static;
  flex: 0 0 100%;
  display: grid;
  grid-template-rows: 0fr;
  min-width: 0;
  transform: none;
  visibility: hidden;
  overflow: clip;
  overscroll-behavior: auto;
  background: transparent;
  color: var(--mobile-nav-ink);
  border-radius: 0;
  transition: grid-template-rows .22s ease, visibility .22s ease;
}
#m-menu-drawer.open .m-megamenu-mobile { visibility: hidden; transition: grid-template-rows .22s ease, visibility .22s ease; }
#m-menu-drawer .m-megamenu-mobile.open { grid-template-rows: 1fr; visibility: visible; }
#m-menu-drawer .m-megamenu-mobile__wrapper {
  min-height: 0;
  /* Clip the accordion animation without creating a nested scroll container. */
  overflow: clip;
  padding: 0;
  touch-action: pan-y;
  overscroll-behavior: auto;
}
#m-menu-drawer .m-submenu-mobile {
  margin: 0 0 16px 2px;
  padding: 0 0 0 16px;
  border: 0;
  border-left: 1px solid #dde2e7;
  border-radius: 0;
  background: transparent;
}
#m-menu-drawer .m-submenu-mobile .m-menu-mobile__item > a {
  min-height: 44px;
  padding: 11px 0;
  font-size: 14px;
  font-weight: 400;
}
#m-menu-drawer .m-submenu-mobile .m-menu-mobile__toggle-button { min-height: 44px; }
#m-menu-drawer .m-menu-mobile__view-all {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 44px;
  margin: 0 0 12px;
  padding: 10px 0;
  border: 0;
  color: var(--mobile-nav-gold);
  font-size: 14px;
  font-weight: 500;
}
#m-menu-drawer .m-menu-customer { margin-top: 16px; flex-shrink: 0; }
#m-menu-drawer .m-menu-customer__wrapper {
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
#m-menu-drawer .m-menu-customer__label { margin-bottom: 12px; color: #76818b; font-size: 13px; font-weight: 400; }
#m-menu-drawer .m-signin-button {
  min-height: 46px;
  padding: 11px 16px;
  border: 1px solid #dce1e6;
  border-radius: 4px;
  background: #ffffff;
  color: var(--mobile-nav-ink);
  font-size: 14px;
  font-weight: 500;
  box-shadow: none;
}
#m-menu-drawer .m-menu-customer__language-currency { gap: 8px; }
@media (hover: hover) {
  #m-menu-drawer .m-menu-mobile__item > a:hover,
  #m-menu-drawer .m-menu-mobile__toggle-button:hover { color: var(--mobile-nav-gold); background: transparent; }
  #m-menu-drawer .m-signin-button:hover { background: #ffffff; color: var(--mobile-nav-ink); border-color: #aeb9c4; box-shadow: none; }
}
@media (prefers-reduced-motion: reduce) {
  #m-menu-drawer, #m-menu-drawer * { transition: none !important; }
}
/* Simple white mobile menu with social links at the bottom. */
#m-menu-drawer .m-menu-drawer__content { padding-top: 12px; }
#m-menu-drawer .m-menu-drawer__navigation > .m-menu-mobile__item > a { font-weight: 500; }
#m-menu-drawer .m-mobile-nav-icon { display: none; }
#m-menu-drawer .m-menu-mobile__item > a[aria-current='page'] { color: #061b37; font-weight: 600; }
#m-menu-drawer .m-menu-mobile__toggle-button { color: #657187; }
#m-menu-drawer .m-submenu-mobile { border-left-color: #d6dfeb; }
#m-menu-drawer .m-menu-mobile__view-all { color: #061b37; font-weight: 600; background: transparent; border: 0; }
#m-menu-drawer .m-menu-drawer__social { flex: none; margin-top: auto; padding-top: 24px; }
/* Đáy menu: khối tài khoản ngay trên icon social, cách hẳn danh sách menu. */
#m-menu-drawer .m-menu-drawer__footer { flex: none; margin-top: auto; padding-top: 32px; }
#m-menu-drawer .m-menu-drawer__footer .m-menu-customer { margin: 0; padding: 20px 0 4px; border-top: 1px solid #eceef1; }
#m-menu-drawer .m-menu-drawer__footer .m-menu-customer__wrapper { display: block; }
#m-menu-drawer .m-menu-drawer__footer .m-menu-customer__label { margin: 0 0 12px; color: #657187; font-size: 12px; }
#m-menu-drawer .m-menu-drawer__footer .m-menu-customer__label strong { color: #061b37; font-weight: 600; }
#m-menu-drawer .m-menu-drawer__footer .m-menu-customer__actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 8px; }
#m-menu-drawer .m-menu-drawer__footer .m-menu-customer__logout { display: inline-block; margin-top: 12px; color: #657187; font-size: 13px; text-decoration: underline; text-underline-offset: 2px; }
#m-menu-drawer .m-menu-drawer__footer .m-menu-drawer__social { margin-top: 0; padding-top: 16px; }
#m-menu-drawer .m-menu-drawer__social > p { margin: 0 0 12px; padding-top: 20px; border-top: 1px solid #eceef1; color: #657187; font-size: 12px; font-weight: 400; }
#m-menu-drawer .social-media-links { display: flex; flex-wrap: wrap; gap: 8px; }
#m-menu-drawer .social-media-links a { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 12px; border: 1px solid #eceef1; background: #fff; color: #061b37; }
#m-menu-drawer .social-media-links svg { width: 18px; height: 18px; }
#m-menu-drawer .social-media-links a:active { background: #f5f5f5; }

/* Use the measured visible viewport in both normal and sticky headers. */
#m-menu-drawer { height: var(--menu-drawer-height, calc(100dvh - var(--m-header-height, 0px))); }
.m-header.mobile-menu-open .m-header__wrapper { transform: none; transition: none; }