/* CSS crítico para el menú móvil - z-index y pointer-events */
/* Selectores alineados con el HTML real (IDs, no data-attributes) */

/* Overlay del menú */
#mobile-menu-overlay {
  z-index: 9998 !important;
  pointer-events: auto;
  -webkit-tap-highlight-color: transparent;
}

/* Panel del menú móvil */
#mobile-menu {
  z-index: 9999 !important;
  pointer-events: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

/* Enlaces dentro del panel - scoped a menu links */
#mobile-menu .mobile-menu-link {
  pointer-events: auto !important;
  cursor: pointer;
  position: relative;
  z-index: 1;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1);
  /* Touch targets mínimo 44px para iOS */
  min-height: 44px;
  display: flex;
  align-items: center;
}

/* Botón hamburguesa */
#mobile-menu-toggle {
  pointer-events: auto !important;
  cursor: pointer;
  z-index: 10001 !important;
  -webkit-tap-highlight-color: transparent;
}

/* Prevenir scroll del body cuando el menú está abierto - iOS safe */
body.menu-open {
  overflow: hidden !important;
  position: fixed !important;
  width: 100% !important;
  top: var(--scroll-top, 0px);
}

/* Touch improvements para iOS */
body.menu-open #mobile-menu {
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
}

/* Transiciones definidas en style.css — no duplicar aquí */