/* Member Login CTA: id-scoped (specificity 1,0,1+) so customizer global
   `a:not(...)` link recolours and any inherited link colors cannot beat it.
   Resting = primary (matches border). Hover = primary bg + white text. */
#member-login-cta,
#member-login-cta:link,
#member-login-cta:visited {
  color: var(--color-gov-primary) !important;
  background-color: #ffffff !important;
  border: 2px solid var(--color-gov-primary) !important;
}
#member-login-cta:hover,
#member-login-cta:focus,
#member-login-cta:active {
  color: #ffffff !important;
  background-color: var(--color-gov-primary) !important;
  border-color: var(--color-gov-primary) !important;
}
#member-login-cta:hover svg,
#member-login-cta:focus svg {
  color: #ffffff !important;
  stroke: #ffffff !important;
}

#mobile-menu.mobile-overlay {
  transition:
    transform 0.32s cubic-bezier(0.2, 0.9, 0.2, 1),
    opacity 0.28s ease;
  transform: translateY(-6%);
  opacity: 0;
  pointer-events: none;
  background-color: #ffffff !important;
  backdrop-filter: blur(10px);
  visibility: hidden;
  display: none;
  z-index: 99999 !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
}

#mobile-menu.mobile-overlay.is-open {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
  display: block !important;
}

/* Ensure toggle buttons work properly */
#mobile-menu-toggle,
#search-toggle {
  pointer-events: auto !important;
  cursor: pointer !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1);
  user-select: none;
}

#mobile-menu-toggle svg,
#search-toggle svg {
  pointer-events: none;
}

.mobile-overlay .mobile-menu-item,
.mobile-overlay #mobile-menu li {
  transform: translateY(8px);
  opacity: 0;
  transition:
    transform 0.28s ease,
    opacity 0.28s ease;
}

.mobile-overlay.is-open .mobile-menu-item,
.mobile-overlay.is-open #mobile-menu li {
  transform: translateY(0);
  opacity: 1;
}

/* Force vertical stacking in mobile overlay - only when overlay is open */
#mobile-menu.is-open,
#mobile-menu.is-open nav,
#mobile-menu.is-open ul,
#mobile-menu.is-open li {
  display: block !important;
}

#mobile-menu ul.mobile-menu-list {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
}

#mobile-menu ul.mobile-menu-list > li {
  display: block !important;
  margin: 0 0 0.6rem 0 !important;
}

#mobile-menu ul.mobile-menu-list a,
#mobile-menu ul.mobile-menu-list button,
#mobile-menu ul.mobile-menu-list .menu-link {
  display: block !important;
  width: 100% !important;
  padding: 0.85rem 1rem !important;
  border-radius: 0.5rem !important;
  text-decoration: none !important;
  text-align: left !important;
  font-weight: 600 !important;
  color: var(--color-gov-text) !important;
  background: transparent !important;
  margin-bottom: 1em;
  transition:
    background 0.18s ease,
    transform 0.12s ease !important;
}

#mobile-menu ul.mobile-menu-list a:hover,
#mobile-menu ul.mobile-menu-list a:focus {
  background: rgba(15, 23, 42, 0.04) !important;
  transform: translateY(-1px) !important;
  outline: none !important;
}

#mobile-menu .mobile-menu-inner {
  max-height: calc(100vh - 80px);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

/* Header z-index management */
#masthead {
  z-index: 9998;
}

.mobile-overlay {
  z-index: 10010;
  background: #ffffff !important;
}

/* Ensure mobile menu has proper background */
#mobile-menu {
  background-color: rgba(255, 255, 255, 0.98) !important;
}

/* Additional mobile menu styling */
.mobile-menu-inner {
  background: #ffffff;
}

/* Hidden search form */
#header-search-form.hidden {
  display: none !important;
  pointer-events: none;
}

/* Animation classes */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-fade-in-up {
  animation: fadeInUp 0.6s ease-out;
}

.stagger-1 {
  animation-delay: 0.1s;
}

.stagger-2 {
  animation-delay: 0.2s;
}

.stagger-3 {
  animation-delay: 0.3s;
}

.stagger-4 {
  animation-delay: 0.4s;
}

@keyframes slide-up {
  from {
    transform: translateY(100%);
    opacity: 0;
  }

  to {
    transform: translateY(0);
    opacity: 1;
  }
}

.animate-slide-up {
  animation: slide-up 0.5s ease-out;
}

/* Keep top-bar text-size controls out of mobile header; shown in mobile drawer instead. */
@media (max-width: 767px) {
  #masthead > .site-header .header-font-size-controls,
  #masthead > .site-header .js-font-size-increase,
  #masthead > .site-header .js-font-size-decrease,
  #masthead > .site-header #font-size-increase,
  #masthead > .site-header #font-size-decrease {
    display: none !important;
  }
}