document.addEventListener('DOMContentLoaded', function() {
    const header = document.querySelector('header');
    const wpAdminBar = document.querySelector('#wpadminbar');

    const stickyHeaderMobile = document.querySelector('.header-right');
    const relativeHeaderMobile = document.querySelector('.header-left');

    const mainLogo = document.querySelector('.main-logo');
    const description = document.querySelector('.description');
    const burgerContainer = document.querySelector('.menu-toggle > div');
    const menuIconContainer = document.querySelector('.menu-toggle > div > div');
    const menuText = document.querySelector('.menu-toggle > div > p');

    const breakpointTablet = 768;

    function checkMobile() {
        if (window.innerWidth < breakpointTablet) {
            stickyHeaderMobile.style.top = wpAdminBar ? `${wpAdminBar.offsetHeight}px` : '0px';
        } else {
            stickyHeaderMobile.style.top = 'unset';
        }
    }

    function resetStyles() {
        header.style.removeProperty("height");
        mainLogo.style.removeProperty("padding");
        description.style.removeProperty("opacity");
        burgerContainer.style.removeProperty("padding");
        burgerContainer.style.removeProperty("justify-content");
        menuIconContainer.style.removeProperty("font-size");
        menuText.style.removeProperty("display");
    }

    window.addEventListener('scroll', () => {
        const isScrolledTop = window.scrollY === 0;
        if (window.innerWidth < breakpointTablet) {
            // mobile
            if (window.scrollY > header.getBoundingClientRect().bottom) {
                // déployer petit logo à gauche
                if(!stickyHeaderMobile.classList.contains('scrolled')) {
                    stickyHeaderMobile.classList.add('scrolled')
                }
            } else {
                // rétracter petit logo à gauche
                if(stickyHeaderMobile.classList.contains('scrolled')) {
                    stickyHeaderMobile.classList.remove('scrolled');
                }
            }
        } else {
            // desktop
            header.style.height = isScrolledTop ? '12vh' : '6vh';
            header.style.minHeight = isScrolledTop ? '100px' : 'unset';
            mainLogo.style.padding = isScrolledTop ? '1.5rem 2rem' : '0.2rem 0.4rem';
            description.style.opacity = isScrolledTop ? '1' : '0';
            burgerContainer.style.padding = isScrolledTop ? '2rem' : '0.6rem 1rem';
            burgerContainer.style.justifyContent = isScrolledTop ? 'space-between' : 'center';
            menuIconContainer.style.fontSize = isScrolledTop ? '2rem' : '1.5rem';
            menuText.style.display = isScrolledTop ? '' : 'none';



            if (window.scrollY === 0) {
                // agrandir le header
            } else {
                // diminuer le header
            }
        }


    });

let resizeTimeout;
let previousWidth = window.innerWidth;

window.addEventListener('resize', () => {
    let currentWidth = window.innerWidth;
    
    if (currentWidth !== previousWidth) {
        window.scrollTo(0, 0);
        previousWidth = currentWidth;
    }
    
    clearTimeout(resizeTimeout);
    resizeTimeout = setTimeout(function() {
        resetStyles();
        checkMobile();
    }, 150);
});

    checkMobile();
});