/**
 * Frontend JavaScript for Child Author Header Block
 * Handles mobile menu toggle functionality
 * 
 * Uses class-based selection to support multiple header instances on same page
 */

document.addEventListener('DOMContentLoaded', () => {
    // Find all header block instances
    const headerBlocks = document.querySelectorAll('.awt-header-block');

    if (!headerBlocks.length) {
        return;
    }

    // Loop through each header block instance
    headerBlocks.forEach((headerBlock) => {
        const toggleBtn = headerBlock.querySelector('.mobile-toggle-btn');
        const mobileMenu = headerBlock.querySelector('.mobile-menu');

        if (toggleBtn && mobileMenu) {
            toggleBtn.addEventListener('click', (e) => {
                e.preventDefault();
                mobileMenu.classList.toggle('hidden');

                // Update aria-expanded for accessibility
                const isExpanded = !mobileMenu.classList.contains('hidden');
                toggleBtn.setAttribute('aria-expanded', isExpanded);
            });
        }
    });

    // Close mobile menu when clicking outside
    document.addEventListener('click', (e) => {
        headerBlocks.forEach((headerBlock) => {
            const toggleBtn = headerBlock.querySelector('.mobile-toggle-btn');
            const mobileMenu = headerBlock.querySelector('.mobile-menu');

            if (mobileMenu && toggleBtn) {
                const isClickInside = headerBlock.contains(e.target);

                if (!isClickInside && !mobileMenu.classList.contains('hidden')) {
                    mobileMenu.classList.add('hidden');
                    toggleBtn.setAttribute('aria-expanded', 'false');
                }
            }
        });
    });
});
