/* navigation-fix.css - Specific fixes for navigation menu issues */

/* Ensure navigation links are clickable */
nav a, .nav-link, header a {
  cursor: pointer !important;
  pointer-events: auto !important;
  position: relative !important;
  z-index: 5 !important;
}

/* Ensure header doesn't block clicks with its background styling */
header::before {
  z-index: -1 !important;
  pointer-events: none !important;
}

/* Fix layering issues that might prevent clicks */
header {
  isolation: isolate;
}

header > div, header nav {
  isolation: isolate;
  z-index: 1;
}

/* Make sure mobile menu always works */
#mobile-menu-button {
  cursor: pointer !important;
  pointer-events: auto !important;
  touch-action: manipulation !important;
  z-index: 10 !important;
}

#mobile-menu {
  z-index: 50 !important;
}

/* Increase touchable area for navigation links */
@media (max-width: 768px) {
  header nav a, #mobile-menu nav a {
    padding: 12px !important;
    margin: 4px 0 !important;
    display: block !important;
  }
  
  header nav {
    display: flex !important;
    flex-wrap: wrap !important;
  }
}

/* Fix for desktop navigation */
@media (min-width: 769px) {
  header nav {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 8px !important;
  }
  
  header nav a {
    display: block !important;
    padding: 8px 12px !important;
    white-space: nowrap !important;
  }
  
  /* Fix for nav items being too close together */
  header nav a:not(:last-child) {
    margin-right: 4px !important;
  }
}

/* Make sure absolute positioned elements don't block clicks */
.absolute {
  pointer-events: none !important;
}
.absolute a, .absolute button, .absolute input, .absolute select {
  pointer-events: auto !important;
}

/* Fix for any potential opacity issues that might make elements unclickable */
header, header *, nav, nav * {
  opacity: 1 !important;
}

/* Ensure z-index layering is correct */
header {
  z-index: 30 !important;
}

header > div {
  z-index: 31 !important;
}

nav {
  z-index: 32 !important;
}

/* Fix for potential hidden overflow issues */
header, nav {
  overflow: visible !important;
}

/* Fix any click events being swallowed by parent elements */
header *, nav * {
  pointer-events: auto !important;
}

/* Fix specifically for Safari */
@supports (-webkit-touch-callout: none) {
  nav a, header a {
    -webkit-touch-callout: default !important;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1) !important;
  }
}

/* Fix for persistent mobile menu issue */
#mobile-menu {
    transform: translateX(100%) !important;
    visibility: hidden;
}

#mobile-menu.open {
    transform: translateX(0) !important;
    visibility: visible;
}

/* Only apply these important rules when not in the 'open' state */
#mobile-menu:not(.open) {
    right: -100% !important;  /* Additional fallback to move it off-screen */
}

/* Ensure overlay is properly hidden */
#mobile-menu-overlay:not(.open) {
    display: none !important;
}