/* ===============================================
   NAVIGATION FIX - ANTI-FLICKERING SOLUTION
   =============================================== */

/* Stabilize header positioning */
.user-main-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  will-change: auto !important;
  transform: translateZ(0) !important;
  -webkit-transform: translateZ(0) !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
}

/* Optimize navigation container */
.user-main-nav {
  z-index: 999 !important;
  position: relative !important;
  transform: translateZ(0) !important;
  -webkit-transform: translateZ(0) !important;
}

/* Navigation links - anti-flicker optimizations */
.user-main-nav ul li a,
.desktop-nav a {
  /* Hardware acceleration */
  transform: translateZ(0) !important;
  -webkit-transform: translateZ(0) !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
  
  /* Optimized transitions */
  transition: background-color 0.15s ease, 
              border-color 0.15s ease, 
              transform 0.1s ease !important;
  
  /* Prevent layout shifts */
  will-change: background-color, border-color, transform !important;
  contain: layout style !important;
  
  /* Ensure clickable */
  pointer-events: auto !important;
  cursor: pointer !important;
  
  /* Stable positioning */
  position: relative !important;
  z-index: 100 !important;
  display: inline-block !important;
}

/* Hover state - simplified */
.user-main-nav ul li a:hover,
.desktop-nav a:hover {
  transform: translateY(-1px) translateZ(0) !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
}

/* Active/click state - immediate feedback */
.user-main-nav ul li a:active,
.desktop-nav a:active {
  transform: translateY(0px) translateZ(0) !important;
  transition: none !important;
}

/* Remove complex animations that cause flicker */
.user-main-nav ul li a::before,
.user-main-nav ul li a::after,
.desktop-nav a::before,
.desktop-nav a::after {
  display: none !important;
}

/* Mobile hamburger - ensure it doesn't interfere */
.mobile-hamburger {
  z-index: 1001 !important;
  pointer-events: auto !important;
}

/* Theme toggle positioning */
.theme-toggle-small {
  z-index: 1001 !important;
  pointer-events: auto !important;
}

/* Prevent any text selection issues */
.user-main-nav ul li a {
  -webkit-user-select: none !important;
  -moz-user-select: none !important;
  -ms-user-select: none !important;
  user-select: none !important;
}

/* Force repaint on hover to prevent visual glitches */
.user-main-nav ul li a:hover {
  -webkit-transform: translateY(-1px) translateZ(0) !important;
  transform: translateY(-1px) translateZ(0) !important;
}

/* Performance optimizations */
.user-main-header * {
  box-sizing: border-box !important;
}

/* Ensure navigation works on touch devices */
@media (hover: none) {
  .user-main-nav ul li a:hover {
    transform: translateZ(0) !important;
  }
}

/* Reduce motion for users who prefer it */
@media (prefers-reduced-motion: reduce) {
  .user-main-nav ul li a {
    transition: none !important;
  }
  
  .user-main-nav ul li a:hover {
    transform: translateZ(0) !important;
  }
} 