/* BOOK592 Unified Header Dropdowns V1 — presentation only.
   Account menu and mobile website menu share one typographic rhythm.
   Corrects inconsistent icon/padding injected for reminder and pricing links.
   Does not add, remove, reroute or submit navigation items. */

:root { --b592-menu-navy: #172B40; --b592-menu-copper: #BC6946; }

/* Same panel sizing, scroll behavior and comfortable PWA touch targets. */
.site-nav :is(.account-panel,.mobile-menu-panel) {
  box-sizing: border-box;
  width: min(300px, calc(100vw - 28px));
  max-width: calc(100vw - 28px);
  max-height: min(78dvh, 640px);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  padding: 9px;
  border-radius: 16px;
  background: #fff;
}

/* Apply exactly the same link alignment to ordinary and highlighted menu links. */
.site-nav .account-panel a,
.site-nav .mobile-menu-panel a,
.site-nav .account-panel .account-signout {
  box-sizing: border-box;
  width: 100%;
  min-height: 44px;
  padding: 11px 13px;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 0;
  border: 0;
  border-radius: 10px;
  background: transparent;
  text-align: left;
  text-decoration: none;
  color: var(--b592-menu-navy);
  font-size: 13px;
  line-height: 1.42;
  font-weight: 700;
  white-space: normal;
  overflow-wrap: anywhere;
  -webkit-tap-highlight-color: transparent;
}

/* The V1 resource-page CSS added an icon ONLY to these two links;
   remove that visual decoration so they align with every other menu item. */
.site-nav .account-panel a.b592-r-menu-link,
.site-nav .mobile-menu-panel a.b592-r-menu-link {
  display: flex;
  align-items: center;
  gap: 0;
  min-height: 44px;
  padding: 11px 13px;
  border: 0;
  background: transparent;
  font-size: 13px;
  font-weight: 700;
}
.site-nav .account-panel a.b592-r-menu-link::before,
.site-nav .mobile-menu-panel a.b592-r-menu-link::before {
  content: none !important;
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  flex-basis: 0 !important;
}

/* Unified hover/current/focus styling: shared navy text and soft copper accent. */
.site-nav .account-panel a:hover,
.site-nav .mobile-menu-panel a:hover,
.site-nav .account-panel a.b592-r-menu-link:hover,
.site-nav .mobile-menu-panel a.b592-r-menu-link:hover {
  color: var(--b592-menu-navy);
  background: #F8EFE8;
  border: 0;
}
.site-nav .account-panel a[aria-current="page"],
.site-nav .mobile-menu-panel a[aria-current="page"],
.site-nav .account-panel a.b592-r-menu-link[aria-current="page"],
.site-nav .mobile-menu-panel a.b592-r-menu-link[aria-current="page"] {
  color: #8F482C !important;
  background: #F8EFE8 !important;
  border: 0 !important;
}
.site-nav .account-panel :is(a,button):focus-visible,
.site-nav .mobile-menu-panel :is(a,button):focus-visible {
  outline: 2px solid var(--b592-menu-copper);
  outline-offset: -2px;
}
.site-nav .account-panel .account-signout { color: #A34532; cursor: pointer; }
.site-nav .account-panel .account-signout:hover { background: #F8EFE8; }

/* Keep the header menus fully accessible on narrow phone/PWA screens. */
@media (max-width: 420px) {
  .site-nav :is(.account-panel,.mobile-menu-panel) {
    width: min(300px, calc(100vw - 20px));
    max-width: calc(100vw - 20px);
    max-height: calc(83dvh - env(safe-area-inset-bottom, 0px));
    padding: 7px;
  }
  .site-nav .account-panel a,
  .site-nav .mobile-menu-panel a,
  .site-nav .account-panel .account-signout,
  .site-nav .account-panel a.b592-r-menu-link,
  .site-nav .mobile-menu-panel a.b592-r-menu-link { min-height: 46px; padding: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .site-nav .account-panel *, .site-nav .mobile-menu-panel * { transition: none !important; }
}
