/* SEARCH MODAL DESKTOP SCRIPT */
document.addEventListener('DOMContentLoaded', function () {
    'use strict';
    
    const modal = document.getElementById('searchModal');
    if (!modal) return;
    
    const trigger = document.getElementById('searchModalTrigger');
    const closeButton = document.getElementById('closeModal');
    const modalContent = modal.querySelector('.rtds-modal-content');
    const header = document.querySelector('.rtds-header');
    
    if (!trigger || !closeButton || !modalContent) return;
    
    // Helper function to get focusable elements
    const getFocusableElements = (container) => {
        const focusableSelectors = [
            'a[href]',
            'button:not([disabled])',
            'textarea:not([disabled])',
            'input:not([disabled])',
            'select:not([disabled])',
            '[tabindex]:not([tabindex="-1"])'
        ].join(', ');
        
        return Array.from(container.querySelectorAll(focusableSelectors)).filter(
            el => el.offsetParent !== null &&
            el.getAttribute('aria-hidden') !== 'true' &&
            el.style.display !== 'none' &&
            el.style.visibility !== 'hidden'
        );
    };
    
    // Focus trap handler
    let focusTrapHandler = null;
    
    const trapFocus = (e) => {
        if (modal.style.display === 'none' || modal.getAttribute('aria-hidden') === 'true') {
            return;
        }
        
        // Se l'elemento che sta ricevendo il focus non è dentro la modale, riporta il focus dentro
        if (!modalContent.contains(e.target)) {
            e.preventDefault();
            const focusableElements = getFocusableElements(modalContent);
            if (focusableElements.length > 0) {
                focusableElements[0].focus();
            }
        }
    };
    
    // Open modal function
    const openModal = (interactionType = 'pointer') => {
        modal.style.display = 'flex';
        modal.classList.add("rtds-z-20");
        modal.setAttribute('aria-hidden', 'false');
        
        if (header) {
            header.classList.add('has-search-modal-open');
        }
        
        // Update aria-expanded on trigger
        trigger.setAttribute('aria-expanded', 'true');
        
        // Aggiungi classe per indicare il tipo di interazione
        modal.classList.remove('is-opened-by-pointer', 'is-opened-by-keyboard');
        if (interactionType === 'keyboard') {
            modal.classList.add('is-opened-by-keyboard');
        } else {
            modal.classList.add('is-opened-by-pointer');
        }
        
        // Activate focus trap at document level
        focusTrapHandler = trapFocus;
        document.addEventListener('focusin', focusTrapHandler);
        
        // Get all focusable elements inside modal content
        const focusableElements = getFocusableElements(modalContent);
        const fallbackFocusable = modalContent.querySelector('.is-focusable-element');
        
        // Cerca l'input di ricerca (può essere un input normale o l'input dell'autocomplete)
        const searchInput = modalContent.querySelector('input[type="search"], input[id*="Search"], input[id*="search"], .autocomplete__input');
        
        // Focus on search input if available, otherwise first focusable element or fallback
        if (searchInput) {
            setTimeout(() => {
                searchInput.focus();
            }, 100);
        } else if (focusableElements.length > 0) {
            focusableElements[0].focus();
        } else if (fallbackFocusable) {
            fallbackFocusable.setAttribute('tabindex', '-1');
            fallbackFocusable.focus();
        }
        
        // Prevent body scroll
        if (!document.documentElement.classList.contains('!rtds-overflow-hidden')) {
            document.documentElement.classList.add('!rtds-overflow-hidden');
        }
    };
    
    // Close modal function
    const closeModal = () => {
        // Remove focus trap
        if (focusTrapHandler) {
            document.removeEventListener('focusin', focusTrapHandler);
            focusTrapHandler = null;
        }
        
        // Remove tabindex from fallback focusable element
        const fallbackFocusable = modalContent.querySelector('.is-focusable-element');
        if (fallbackFocusable) {
            fallbackFocusable.removeAttribute('tabindex');
        }
        
        // Restore body scroll
        if (document.documentElement.classList.contains('!rtds-overflow-hidden')) {
            document.documentElement.classList.remove('!rtds-overflow-hidden');
        }
        
        modal.style.display = 'none';
        modal.setAttribute('aria-hidden', 'true');
        modal.classList.remove("rtds-z-20");
        
        if (header) {
            header.classList.remove('has-search-modal-open');
        }
        
        // Update aria-expanded on trigger and return focus
        trigger.setAttribute('aria-expanded', 'false');
        trigger.focus();
    };
    
    // Event listeners
    // Gestione apertura tramite click/touch (pointer)
    trigger.addEventListener('click', (e) => {
        openModal('pointer');
    });
    
    // Gestione apertura tramite tastiera (Enter/Space)
    trigger.addEventListener('keydown', (e) => {
        if (e.key === 'Enter' || e.key === ' ') {
            e.preventDefault();
            openModal('keyboard');
        }
    });
    
    closeButton.addEventListener('click', closeModal);
    
    // Keyboard navigation
    modal.addEventListener('keydown', function (event) {
        // Se l'utente inizia a navigare con la tastiera, rimuovi la classe is-opened-by-pointer
        // per permettere al focus ring di apparire normalmente
        if (modal.classList.contains('is-opened-by-pointer')) {
            // Rimuovi is-opened-by-pointer quando l'utente usa Tab, frecce, o altri tasti di navigazione
            if (event.key === 'Tab' || event.key.startsWith('Arrow') || event.key === 'Home' || event.key === 'End') {
                modal.classList.remove('is-opened-by-pointer');
            }
        }
        
        if (event.key === 'Tab') {
            const focusableElements = getFocusableElements(modalContent);
            
            // If no focusable elements, prevent tabbing
            if (focusableElements.length === 0) {
                event.preventDefault();
                return;
            }
            
            const firstFocusableElement = focusableElements[0];
            const lastFocusableElement = focusableElements[focusableElements.length - 1];
            
            if (event.shiftKey) {
                // Shift + Tab: backward navigation
                if (document.activeElement === firstFocusableElement) {
                    lastFocusableElement.focus();
                    event.preventDefault();
                }
            } else {
                // Tab: forward navigation
                if (document.activeElement === lastFocusableElement) {
                    firstFocusableElement.focus();
                    event.preventDefault();
                }
            }
        }
        
        if (event.key === 'Escape') {
            closeModal();
        }
    });
});