/**
 * ----------------------------------------------------
 * Mobile Menu Overrides (menu-overrides.css)
 * ----------------------------------------------------
 * - Ensures full-width responsive overlay
 * - Aligns close ("X") button to top-right
 * - Prevents overlap with menu items
 * - Keeps compatibility with TwentyTwentyFive defaults
 * - Fixes stuck burger highlight after tap
 * - Restores underline for active page links
 * - Prevent header blocking overlay taps
 * - Reset focus highlight on tapped menu items
 * - Ensure header contents always reappear on scroll
 * - Remove tap highlight / UA focus BG on burger & X
 */

/* ----------------------------------------------------
 * 1. Mobile menu container (open state)
 * ---------------------------------------------------- */
.wp-block-navigation__responsive-container.is-menu-open {
  position: fixed;                 /* lock overlay to viewport */
  top: 0;                          /* stick to top */
  left: 0;                         /* stick to left */
  right: 0;                        /* stick to right */
  width: 100vw;                    /* full viewport width */
  height: 100vh;                   /* full viewport height */
  box-sizing: border-box;          /* include padding in width */
  padding: 1rem;                   /* breathing space inside overlay */
  display: flex;                   /* flex layout for content */
  flex-direction: column;          /* stack items vertically */
  align-items: flex-start;         /* left-align menu items */
  justify-content: flex-start;     /* start items at top */
  background: var(--c-white, #fff);/* fallback to theme white */
  z-index: 9999;                   /* ensure menu is above all */
}

/* ----------------------------------------------------
 * 2. Close "X" button (top-right aligned)
 * ---------------------------------------------------- */
.wp-block-navigation__responsive-container-close {
  align-self: flex-end;            /* push button to right edge */
  margin-bottom: 1rem;             /* space below before menu items */
}

/* ----------------------------------------------------
 * 3. Burger button highlight reset
 * ---------------------------------------------------- */
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-open:focus,
.wp-block-navigation__responsive-container-open:active {
  outline: none !important;        /* remove browser focus ring */
  box-shadow: none !important;     /* remove any shadow highlight */
  background: transparent !important; /* reset background highlight */
}

/* ----------------------------------------------------
 * 4. Active page link underline
 * ---------------------------------------------------- */
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item a[aria-current="page"],
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item.current-menu-item > a {
  text-decoration: underline !important; /* show underline */
  text-underline-offset: 4px !important; /* spacing from text */
  font-weight: 600 !important;           /* emphasize active link */
}

/* ----------------------------------------------------
 * 5. Prevent header blocking overlay taps
 * ---------------------------------------------------- */
body.has-modal-open header[role="banner"],
body.has-modal-open header.wp-block-template-part {
  pointer-events: none !important; /* disable header hitbox */
}

/* ----------------------------------------------------
 * 6. Reset focus highlight on tapped menu items
 * ---------------------------------------------------- */
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item a:focus,
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item a:active {
  outline: none !important;       /* remove focus ring */
  box-shadow: none !important;    /* remove shadow */
  background: transparent !important; /* clear background */
}

/* ----------------------------------------------------
 * 7. Ensure header contents always reappear on scroll
 * ---------------------------------------------------- */
header.is-default .wp-block-site-logo,
header.is-transparent .wp-block-site-logo,
header.is-default .wp-block-navigation__responsive-container-open,
header.is-transparent .wp-block-navigation__responsive-container-open {
  visibility: visible !important; /* guarantee visibility */
  opacity: 1 !important;          /* force repaint */
  transition: opacity 0.2s ease;  /* smooth re-entry */
}

/* ----------------------------------------------------
 * 8. Remove tap highlight / UA focus BG on burger & X
 * ----------------------------------------------------
 * Fix lingering grey rectangle on iOS (Safari/Chrome/DDG)
 * by fully resetting the buttons’ UA styles.
 */
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close,
button.wp-block-navigation__responsive-container-open,
button.wp-block-navigation__responsive-container-close {
  -webkit-tap-highlight-color: rgba(0,0,0,0); /* disable tap flash */
  -webkit-appearance: none;                   /* strip Safari UA style */
  appearance: none;                           /* strip UA style */
  background: transparent !important;         /* no grey bg */
  border: 0 !important;                       /* no UA border */
}

.wp-block-navigation__responsive-container-open:focus,
.wp-block-navigation__responsive-container-open:active,
.wp-block-navigation__responsive-container-close:focus,
.wp-block-navigation__responsive-container-close:active {
  outline: none !important;                   /* no focus ring */
  box-shadow: none !important;                /* no shadow */
  background: transparent !important;         /* keep clear */
}