const toggle = document.getElementById("menu-icon");
const menu = document.getElementById("drop-menu");
const fm = document.getElementById("full-menu");

toggle.addEventListener("click", () => {
  menu.classList.toggle("hidden");
  fm.classList.toggle("bg-tan-400");
});

document.addEventListener("click", (e) => {
  if ( !fm.contains(e.target) ) {
    menu.classList.add("hidden");
    fm.classList.remove("bg-tan-400");
  }
});

document.getElementById("mainmenu").querySelectorAll('a').forEach(l =>  l.className = (l.href == document.URL ? 'menulink active' : 'menulink'));

//script for lightbox feature in portfolio:
(function() {
  const lightbox = document.getElementById('lightbox');
  const lightboxImage = document.getElementById('lightbox-image');
  const lightboxClose = document.getElementById('lightbox-close');
  const lightboxPrev = document.getElementById('lightbox-prev');
  const lightboxNext = document.getElementById('lightbox-next');
  const lightboxCounter = document.getElementById('lightbox-counter');
  
  let currentGallery = null;
  let currentIndex = 0;
  let galleryImages = [];
  
  function openLightbox(gallery, index) {
    currentGallery = gallery;
    currentIndex = index;
    galleryImages = Array.from(gallery.querySelectorAll('.gallery-image'));
    
    showImage(currentIndex);
    lightbox.classList.remove('hidden');
    document.body.style.overflow = 'hidden';
  }
  
  function closeLightbox() {
    lightbox.classList.add('hidden');
    document.body.style.overflow = '';
    currentGallery = null;
    galleryImages = [];
  }
  
  function showImage(index) {
    if (galleryImages.length === 0) return;
    
    currentIndex = (index + galleryImages.length) % galleryImages.length;
    const img = galleryImages[currentIndex];
    lightboxImage.src = img.dataset.large;
    lightboxCounter.textContent = `${currentIndex + 1} / ${galleryImages.length}`;
  }
  
  function nextImage() {
    showImage(currentIndex + 1);
  }
  
  function prevImage() {
    showImage(currentIndex - 1);
  }
  
  // Click on gallery images
  document.querySelectorAll('[data-gallery-group]').forEach(gallery => {
    gallery.querySelectorAll('.gallery-image').forEach((img, index) => {
      img.addEventListener('click', () => {
        openLightbox(gallery, index);
      });
    });
  });
  
  // Close button
  if (lightboxClose) lightboxClose.addEventListener('click', closeLightbox);
  
  // Navigation buttons
  if (lightboxPrev) lightboxPrev.addEventListener('click', (e) => {
    e.stopPropagation();
    prevImage();
  });
  
  if (lightboxNext) lightboxNext.addEventListener('click', (e) => {
    e.stopPropagation();
    nextImage();
  });
  
  // Click outside image to close
  if (lightbox) lightbox.addEventListener('click', (e) => {
    if (e.target === lightbox) {
      closeLightbox();
    }
  });
  
  // Keyboard navigation
  document.addEventListener('keydown', (e) => {
    if (lightbox.classList.contains('hidden')) return;
    
    if (e.key === 'Escape') {
      closeLightbox();
    } else if (e.key === 'ArrowRight') {
      nextImage();
    } else if (e.key === 'ArrowLeft') {
      prevImage();
    }
  });
})();