const burgerMenu = document.getElementById("burger-menu");
const mainNav = document.getElementById("main-nav");
const nav = document.querySelector("nav");
const body = document.body;
burgerMenu.addEventListener('click', () => {
    nav.classList.toggle('active');
    burgerMenu.classList.toggle('active');

    if(nav.classList.contains('active')){
        body.style.overflowY = "hidden";
        nav.style.animation = "increase-height 1s";
    }
    else{
        body.style.overflowY = "auto";
        nav.style.animation = "decrease-height 1s";
    }
  });


const searchBtn = document.getElementById("search-popup-btn");
const searchPopup = document.getElementById("search-popup");
const searchPopupCloseBtn = document.getElementById("search-popup-close-btn");
searchBtn.addEventListener('click', ()=>{
    searchPopup.style.display="flex";
    body.style.overflowY = "hidden";
})
searchPopupCloseBtn.addEventListener('click',()=>{
    searchPopup.style.display="none";
    body.style.overflowY = "auto";
})



window.onscroll = ()=>{
  if(window.scrollY >= 100){
    nav.style.position ="fixed";
    nav.style.top ="0";
    nav.style.zIndex ="99";
  }
  else{
    nav.style.position ="relative";
    nav.style.zIndex ="1";
  }
}

