document.addEventListener('DOMContentLoaded', function() {
    
    // 1. Inicialización del Slider (Swiper)
    const initSwiper = () => {
        const swiperContainer = document.querySelector('.etn-egr-swiper-container');
        
        if (swiperContainer) {
            new Swiper('.etn-egr-swiper-container', {
                slidesPerView: 1,
                spaceBetween: 20,
                loop: true,
                autoplay: {
                    delay: 5000,
                    disableOnInteraction: false,
                },
                pagination: {
                    el: '.swiper-pagination',
                    clickable: true,
                },
                navigation: {
                    nextEl: '.swiper-button-next',
                    prevEl: '.swiper-button-prev',
                },
                // Adaptabilidad (Responsivo)
                breakpoints: {
                    640: {
                        slidesPerView: 2,
                    },
                    1024: {
                        slidesPerView: 3, // Configurable desde el admin en el futuro
                    },
                },
                on: {
                    init: function () {
                        // Quitar el esqueleto una vez que Swiper carga
                        document.querySelectorAll('.etn-egr-skeleton').forEach(el => {
                            el.classList.remove('etn-egr-skeleton');
                        });
                    },
                },
            });
        }
    };

    // 2. Lógica del Modal "Leer Más"
    const initModal = () => {
        const readMoreBtns = document.querySelectorAll('.etn-egr-read-more');
        const modal = document.getElementById('etn-egr-modal');
        const modalContent = document.getElementById('etn-egr-modal-body');
        const closeBtn = document.querySelector('.etn-egr-modal-close');

        readMoreBtns.forEach(btn => {
            btn.addEventListener('click', function(e) {
                e.preventDefault();
                const fullText = this.getAttribute('data-full-text');
                modalContent.innerHTML = fullText;
                modal.style.display = 'block';
                document.body.style.overflow = 'hidden'; // Bloquear scroll
            });
        });

        if (closeBtn) {
            closeBtn.onclick = function() {
                modal.style.display = 'none';
                document.body.style.overflow = 'auto';
            };
        }

        // Cerrar al hacer clic fuera del modal
        window.onclick = function(event) {
            if (event.target == modal) {
                modal.style.display = 'none';
                document.body.style.overflow = 'auto';
            }
        };
    };

    // Lanzar funciones
    initSwiper();
    initModal();
});