// Aggressive mobile navigation improvements to eliminate error flash
let menuInitialized = false;
let linksInitialized = false;
let overlay = null;

// Immediately hide potential error messages
document.documentElement.style.setProperty('--error-display', 'none');
document.body.classList.add('page-loading');

function createMobileOverlay() {
  if (overlay) return overlay;
  
  overlay = document.createElement('div');
  overlay.className = 'mobile-nav-overlay';
  overlay.style.cssText = `
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--dark-background-color);
    z-index: 9999;
    opacity: 0;
    visibility: hidden;
    transition: all 0.15s ease;
  `;
  document.body.appendChild(overlay);
  return overlay;
}

function showLoadingOverlay() {
  const overlay = createMobileOverlay();
  overlay.classList.add('active');
}

function hideLoadingOverlay() {
  if (overlay) {
    overlay.classList.remove('active');
    setTimeout(() => {
      if (overlay && overlay.parentNode) {
        overlay.parentNode.removeChild(overlay);
        overlay = null;
      }
    }, 300);
  }
}

function closeMobileMenu() {
  const mobileMenu = document.querySelector('[data-landingsite-mobile-menu]');
  if (mobileMenu && !mobileMenu.classList.contains('hidden')) {
    mobileMenu.classList.add('hidden');
    
    const menuButton = document.querySelector('[data-landingsite-mobile-menu-toggle]');
    if (menuButton) {
      menuButton.setAttribute('aria-expanded', 'false');
    }
  }
}

function setupMobileMenuAutoClose() {
  if (menuInitialized) return;
  
  const mobileMenu = document.querySelector('[data-landingsite-mobile-menu]');
  if (!mobileMenu) {
    setTimeout(setupMobileMenuAutoClose, 50);
    return;
  }
  
  menuInitialized = true;
  
  const mobileLinks = mobileMenu.querySelectorAll('a');
  mobileLinks.forEach(link => {
    link.addEventListener('click', function(e) {
      closeMobileMenu();
      
      // Show overlay for internal navigation
      const href = link.getAttribute('href');
      if (href && href.startsWith('/')) {
        showLoadingOverlay();
        document.documentElement.classList.add('page-transitioning');
        
        // Hide overlay after navigation starts
        setTimeout(() => {
          hideLoadingOverlay();
          document.documentElement.classList.remove('page-transitioning');
        }, 400);
      }
    });
  });
  
  // Close menu when clicking outside
  document.addEventListener('click', function(event) {
    const menuButton = document.querySelector('[data-landingsite-mobile-menu-toggle]');
    if (!mobileMenu.contains(event.target) && !menuButton.contains(event.target)) {
      closeMobileMenu();
    }
  });
}

function setupSmoothNavigation() {
  if (linksInitialized) return;
  linksInitialized = true;
  
  // Mark page as ready
  document.body.classList.remove('page-loading');
  document.body.classList.add('page-ready', 'page-loaded');
  
  // Hide any error elements immediately
  const errorElements = document.querySelectorAll([
    '[class*="error"]',
    '[class*="not-found"]', 
    '[id*="error"]',
    '[id*="not-found"]',
    '.error-message',
    '.not-found-message'
  ].join(','));
  
  errorElements.forEach(el => {
    el.style.display = 'none';
    el.style.visibility = 'hidden';
    el.style.opacity = '0';
  });
  
  // Improve all internal links
  const allLinks = document.querySelectorAll('a[href]');
  allLinks.forEach(link => {
    let isNavigating = false;
    
    link.addEventListener('click', function(e) {
      if (isNavigating) {
        e.preventDefault();
        return false;
      }
      
      const href = link.getAttribute('href');
      if (href && href.startsWith('/')) {
        isNavigating = true;
        
        // Immediate visual feedback
        link.style.opacity = '0.7';
        closeMobileMenu();
        
        // Show loading overlay for smoother transition
        showLoadingOverlay();
        document.documentElement.classList.add('page-transitioning');
        
        // Clean up after navigation
        setTimeout(() => {
          isNavigating = false;
          link.style.opacity = '';
          hideLoadingOverlay();
          document.documentElement.classList.remove('page-transitioning');
        }, 600);
      }
    });
  });
}

// Enhanced initialization
export function init() {
  // Immediate setup
  document.body.classList.add('page-loading');
  
  // Hide error messages as soon as possible
  const style = document.createElement('style');
  style.textContent = `
    [class*="error"], [class*="not-found"], [id*="error"], [id*="not-found"] {
      display: none !important;
      visibility: hidden !important;
      opacity: 0 !important;
    }
  `;
  document.head.appendChild(style);
  
  // Wait for DOM but not too long
  const setup = () => {
    setupMobileMenuAutoClose();
    setupSmoothNavigation();
  };
  
  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', setup);
  } else {
    setTimeout(setup, 10);
  }
}

export function teardown() {
  menuInitialized = false;
  linksInitialized = false;
  document.body.classList.remove('page-loading', 'page-ready', 'page-loaded');
  document.documentElement.classList.remove('page-transitioning');
  hideLoadingOverlay();
}