// Import Alpine.js
import Alpine from 'alpinejs'

// Make Alpine available on the window object
window.Alpine = Alpine

// Initialize Alpine
Alpine.start()

// Header JavaScript - Hamburger menu functionality
document.addEventListener('DOMContentLoaded', function() {
  // Mobile menu toggle
  const offcanvasToggle = document.querySelector('.cs-header__offcanvas-toggle');
  const offcanvasClose = document.querySelector('.cs-header__offcanvas-close');
  const offcanvas = document.querySelector('.cs-header__offcanvas');
  const overlay = document.querySelector('.cs-search-overlay');
  
  if (offcanvasToggle) {
    offcanvasToggle.addEventListener('click', function() {
      offcanvas.classList.add('active');
      overlay.style.display = 'block';
      document.body.style.overflow = 'hidden';
    });
  }
  
  if (offcanvasClose) {
    offcanvasClose.addEventListener('click', function() {
      offcanvas.classList.remove('active');
      overlay.style.display = 'none';
      document.body.style.overflow = '';
    });
  }
  
  
  // Search functionality
  const searchToggle = document.querySelectorAll('.cs-header__search-toggle');
  const searchClose = document.querySelector('.cs-search__close');
  const search = document.querySelector('.cs-search');
  
  searchToggle.forEach(toggle => {
    toggle.addEventListener('click', function() {
      search.style.display = 'block';
      overlay.style.display = 'block';
      document.body.style.overflow = 'hidden';
    });
  });
  
  if (searchClose) {
    searchClose.addEventListener('click', function() {
      search.style.display = 'none';
      overlay.style.display = 'none';
      document.body.style.overflow = '';
    });
  }
  
  if (overlay) {
    overlay.addEventListener('click', function() {
      if (offcanvas) {
        offcanvas.classList.remove('active');
      }
      search.style.display = 'none';
      overlay.style.display = 'none';
      document.body.style.overflow = '';
      
    });
  }
});

console.log("Hello world");