/**
 * Script simplificado de navegación para TRAUMA 2025
 * Este script maneja la navegación básica entre secciones del formulario
 */

document.addEventListener('DOMContentLoaded', function() {
    // Elementos clave del DOM
    const sections = document.querySelectorAll('.form-section');
    const nextButtons = document.querySelectorAll('.btn-next');
    const prevButtons = document.querySelectorAll('.btn-prev');
    const progressSteps = document.querySelectorAll('.step');
    const progressFill = document.querySelector('.progress-fill');
    
    // Ocultar todas las secciones excepto la primera
    sections.forEach((section, index) => {
        if (index === 0) {
            section.classList.add('active');
        } else {
            section.classList.remove('active');
        }
    });
    
    // Marcar el primer paso como activo
    if (progressSteps.length > 0) {
        progressSteps[0].classList.add('active');
    }
    
    // Función para navegar a una sección específica
    function goToSection(currentSection, targetSection) {
        console.log(`Navegando de la sección ${currentSection} a la ${targetSection}`);
        
        // Actualizar las secciones
        sections.forEach((section, index) => {
            const sectionNum = index + 1;
            section.classList.remove('active', 'prev');
            
            if (sectionNum === targetSection) {
                section.classList.add('active');
            } else if (sectionNum < targetSection) {
                section.classList.add('prev');
            }
        });
        
        // Actualizar los pasos de progreso
        if (progressSteps.length > 0) {
            progressSteps.forEach((step, index) => {
                const stepNum = index + 1;
                step.classList.remove('active', 'completed');
                
                if (stepNum === targetSection) {
                    step.classList.add('active');
                } else if (stepNum < targetSection) {
                    step.classList.add('completed');
                }
            });
        }
        
        // Actualizar la barra de progreso
        if (progressFill) {
            const totalSections = sections.length;
            const progressPercentage = ((targetSection - 1) / (totalSections - 1)) * 100;
            progressFill.style.width = `${progressPercentage}%`;
        }
        
        // Scroll hacia arriba
        window.scrollTo({ top: 0, behavior: 'smooth' });
    }
    
    // Configurar eventos para botones "Siguiente"
    nextButtons.forEach(button => {
        button.addEventListener('click', function() {
            const currentSection = parseInt(this.closest('.form-section').getAttribute('data-section') || 
                                          this.closest('.form-section').getAttribute('data-step'));
            const targetSection = parseInt(this.getAttribute('data-next'));
            
            if (!isNaN(currentSection) && !isNaN(targetSection)) {
                goToSection(currentSection, targetSection);
            } else {
                console.error('Atributos de navegación incorrectos', { currentSection, targetSection });
            }
        });
    });
    
    // Configurar eventos para botones "Anterior"
    prevButtons.forEach(button => {
        button.addEventListener('click', function() {
            const currentSection = parseInt(this.closest('.form-section').getAttribute('data-section') || 
                                          this.closest('.form-section').getAttribute('data-step'));
            const targetSection = parseInt(this.getAttribute('data-prev'));
            
            if (!isNaN(currentSection) && !isNaN(targetSection)) {
                goToSection(currentSection, targetSection);
            } else {
                console.error('Atributos de navegación incorrectos', { currentSection, targetSection });
            }
        });
    });
    
    // Permitir clicar en los pasos para navegar (opcional)
    if (progressSteps.length > 0) {
        progressSteps.forEach(step => {
            step.addEventListener('click', function() {
                const currentSection = parseInt(document.querySelector('.form-section.active').getAttribute('data-section'));
                const targetSection = parseInt(this.getAttribute('data-step'));
                
                // Solo permitir navegar hacia atrás o al paso actual
                if (!isNaN(currentSection) && !isNaN(targetSection) && targetSection <= currentSection) {
                    goToSection(currentSection, targetSection);
                }
            });
        });
    }
    
    console.log('Navegación inicializada correctamente');
});