/* =====================================================
   VANAKKAM KASHI — gokashi.in
   Main JavaScript
   ===================================================== */

document.addEventListener('DOMContentLoaded', () => {

  /* ===== NAVBAR SCROLL ===== */
  const navbar = document.getElementById('navbar');
  if (navbar) {
    window.addEventListener('scroll', () => {
      navbar.classList.toggle('scrolled', window.scrollY > 60);
    });
  }

  /* ===== HAMBURGER MENU ===== */
  const hamburger = document.getElementById('hamburger');
  const navMenu   = document.getElementById('navMenu');
  if (hamburger && navMenu) {
    hamburger.addEventListener('click', (e) => {
      e.stopPropagation();
      hamburger.classList.toggle('active');
      navMenu.classList.toggle('active');
    });
    document.querySelectorAll('.nav-link').forEach(l => {
      l.addEventListener('click', () => {
        hamburger.classList.remove('active');
        navMenu.classList.remove('active');
      });
    });
    document.addEventListener('click', e => {
      if (navbar && !navbar.contains(e.target)) {
        hamburger.classList.remove('active');
        navMenu.classList.remove('active');
      }
    });
  }

  /* ===== ACTIVE PAGE HIGHLIGHTING (uses pathname) ===== */
  const currentFile = (window.location.pathname.split('/').pop() || 'index.html').toLowerCase();
  document.querySelectorAll('.nav-link').forEach(link => {
    const href = (link.getAttribute('href') || '').toLowerCase();
    if (href === currentFile || (currentFile === '' && href === 'index.html')) {
      link.classList.add('active');
    } else {
      link.classList.remove('active');
    }
  });

  /* ===== HERO SLIDER ===== */
  const slides = document.querySelectorAll('.slide');
  const dotsContainer = document.getElementById('slideDots');
  const slidePrev = document.getElementById('slidePrev');
  const slideNext = document.getElementById('slideNext');
  let currentSlide = 0;
  let slideInterval = null;

  if (slides.length && dotsContainer) {
    slides.forEach((_, i) => {
      const dot = document.createElement('button');
      dot.className = 'slide-dot' + (i === 0 ? ' active' : '');
      dot.setAttribute('aria-label', `Slide ${i+1}`);
      dot.addEventListener('click', () => goTo(i));
      dotsContainer.appendChild(dot);
    });
    const dots = dotsContainer.querySelectorAll('.slide-dot');

    function goTo(i) {
      slides[currentSlide].classList.remove('active');
      dots[currentSlide].classList.remove('active');
      currentSlide = (i + slides.length) % slides.length;
      slides[currentSlide].classList.add('active');
      dots[currentSlide].classList.add('active');
    }
    function nextSlide() { goTo(currentSlide + 1); }
    function prevSlide() { goTo(currentSlide - 1); }

    if (slideNext) slideNext.addEventListener('click', () => { nextSlide(); resetInterval(); });
    if (slidePrev) slidePrev.addEventListener('click', () => { prevSlide(); resetInterval(); });

    function startInterval() { slideInterval = setInterval(nextSlide, 6000); }
    function resetInterval() { clearInterval(slideInterval); startInterval(); }
    startInterval();
  }

  /* ===== PACKAGE TABS ===== */
  document.querySelectorAll('.pkg-tab').forEach(tab => {
    tab.addEventListener('click', () => {
      const target = tab.dataset.tab;
      document.querySelectorAll('.pkg-tab').forEach(t => t.classList.remove('active'));
      document.querySelectorAll('.pkg-content').forEach(c => c.classList.remove('active'));
      tab.classList.add('active');
      const content = document.getElementById('tab-' + target);
      if (content) content.classList.add('active');
    });
  });

  /* ===== GALLERY FILTERS ===== */
  document.querySelectorAll('.gallery-filter').forEach(btn => {
    btn.addEventListener('click', () => {
      const cat = btn.dataset.filter;
      document.querySelectorAll('.gallery-filter').forEach(b => b.classList.remove('active'));
      btn.classList.add('active');
      document.querySelectorAll('.gallery-page-grid .gallery-item').forEach(item => {
        const c = item.dataset.cat;
        item.style.display = (cat === 'all' || c === cat) ? '' : 'none';
      });
    });
  });

  /* ===== SCROLL TO TOP ===== */
  const scrollTopBtn = document.getElementById('scrollTop');
  if (scrollTopBtn) {
    window.addEventListener('scroll', () => {
      scrollTopBtn.classList.toggle('visible', window.scrollY > 400);
    });
    scrollTopBtn.addEventListener('click', () => {
      window.scrollTo({ top: 0, behavior: 'smooth' });
    });
  }

  /* ===== CONTACT FORM (graceful, no backend) ===== */
  const contactForm = document.getElementById('contactForm');
  if (contactForm) {
    contactForm.addEventListener('submit', (e) => {
      e.preventDefault();
      const data = new FormData(contactForm);
      const name = data.get('name') || 'Pilgrim';
      const email = data.get('email') || '';
      const phone = data.get('phone') || '';
      const travelers = data.get('travelers') || '';
      const dest = data.get('destination') || '';
      const message = data.get('message') || '';
      const subject = encodeURIComponent(`Yatra Enquiry from ${name} - ${dest}`);
      const body = encodeURIComponent(
        `Namaste,\n\nI am interested in a pilgrimage tour with Vanakkam Kashi.\n\n` +
        `Name: ${name}\n` +
        `Email: ${email}\n` +
        `Phone: ${phone}\n` +
        `Travelers: ${travelers}\n` +
        `Preferred Destination: ${dest}\n\n` +
        `Message:\n${message}\n\nThank you.`
      );
      window.location.href = `mailto:vanakamkashi@gmail.com?subject=${subject}&body=${body}`;
      const note = document.getElementById('formNote');
      if (note) {
        note.textContent = 'Opening your email app to send the enquiry...';
        note.style.color = 'var(--green)';
        setTimeout(() => { note.textContent = ''; }, 6000);
      }
    });
  }

  /* ===== INTERSECTION OBSERVER FOR SCROLL REVEAL ===== */
  const revealEls = document.querySelectorAll('.dest-card, .pkg-card, .why-card, .testi-card, .value-card, .hl-card');
  if ('IntersectionObserver' in window && revealEls.length) {
    const io = new IntersectionObserver((entries) => {
      entries.forEach(en => {
        if (en.isIntersecting) {
          en.target.style.opacity = '1';
          en.target.style.transform = 'translateY(0)';
          io.unobserve(en.target);
        }
      });
    }, { threshold: 0.12 });
    revealEls.forEach(el => {
      el.style.opacity = '0';
      el.style.transform = 'translateY(20px)';
      el.style.transition = 'opacity .6s ease, transform .6s ease';
      io.observe(el);
    });
  }

  /* ===== LAZY LOADING POLYFILL FALLBACK ===== */
  // Native lazy loading is used via loading="lazy" attribute.
  // For older browsers, fall back to IntersectionObserver
  if (!('loading' in HTMLImageElement.prototype) && 'IntersectionObserver' in window) {
    const lazyImages = document.querySelectorAll('img[loading="lazy"][data-src]');
    const lazyObserver = new IntersectionObserver((entries) => {
      entries.forEach(entry => {
        if (entry.isIntersecting) {
          const img = entry.target;
          img.src = img.dataset.src;
          img.removeAttribute('data-src');
          lazyObserver.unobserve(img);
        }
      });
    });
    lazyImages.forEach(img => lazyObserver.observe(img));
  }

});
