/**
 * Sistema de Gestión CRUD
 * Funciones JavaScript para todas las operaciones CRUD
 */

// Variables globales
let currentViewRecordId = null;

/**
 * Document ready function - Ejecuta cuando el DOM está completamente cargado
 */
document.addEventListener('DOMContentLoaded', function() {
    // Aplicar solución para el problema del backdrop modal
    fixModalBackdropIssue();
    
    // Inicializa todos los componentes y eventos
    initializeEventListeners();
    initializeDropdownButtons(); // Nueva función para manejar los dropdowns correctamente
    
    console.log('Sistema de Gestión CRUD - JavaScript inicializado');
});

/**
 * Función para corregir el problema del backdrop modal persistente
 */
function fixModalBackdropIssue() {
    // Función para eliminar el backdrop y restaurar el scroll
    function removeModalBackdrop() {
        // Eliminar todos los backdrops
        document.querySelectorAll('.modal-backdrop').forEach(backdrop => {
            backdrop.remove();
        });
        
        // Restaurar el scroll y los estilos del body
        document.body.classList.remove('modal-open');
        document.body.style.overflow = '';
        document.body.style.paddingRight = '';
    }
    
    // Monitorear los eventos 'hidden.bs.modal' de todos los modales
    document.querySelectorAll('.modal').forEach(modal => {
        modal.addEventListener('hidden.bs.modal', function() {
            // Verificar si hay otros modales abiertos antes de eliminar el backdrop
            const otherOpenModals = document.querySelectorAll('.modal.show');
            if (otherOpenModals.length === 0) {
                setTimeout(() => {
                    removeModalBackdrop();
                }, 150);
            }
        });
    });
    
    // Agregar manejadores de eventos a todos los botones de cierre de modal
    document.querySelectorAll('[data-bs-dismiss="modal"]').forEach(button => {
        button.addEventListener('click', function() {
            // Asegurarse de que el modal se cierre correctamente
            const modalElement = this.closest('.modal');
            if (modalElement) {
                const modalInstance = bootstrap.Modal.getInstance(modalElement);
                if (modalInstance) {
                    modalInstance.hide();
                    
                    // Establecer un temporizador corto para eliminar el backdrop después
                    // de que Bootstrap termine su animación
                    setTimeout(() => {
                        const openModals = document.querySelectorAll('.modal.show');
                        if (openModals.length === 0) {
                            removeModalBackdrop();
                        }
                    }, 300); // 300ms es aproximadamente la duración de la animación
                }
            }
        });
    });
    
    // Agregar un observador de mutaciones para detectar cambios en el DOM y limpiar backdrops huérfanos
    const observer = new MutationObserver(function(mutations) {
        // Verificar si hay backdrops sin modales visibles
        const backdrops = document.querySelectorAll('.modal-backdrop');
        const openModals = document.querySelectorAll('.modal.show');
        
        if (backdrops.length > 0 && openModals.length === 0) {
            // Esperar brevemente para asegurarse de que no se está abriendo un modal
            setTimeout(() => {
                const stillOpenModals = document.querySelectorAll('.modal.show');
                if (stillOpenModals.length === 0) {
                    removeModalBackdrop();
                }
            }, 150);
        }
    });
    
    // Iniciar observación del body para detectar cambios en el DOM
    observer.observe(document.body, { 
        childList: true, 
        subtree: true,
        attributes: true,
        attributeFilter: ['class']
    });
    
    // Agregar un manejador de eventos para detectar clics fuera de los modales
    document.addEventListener('click', function(event) {
        // Detectar si hay backdrops sin modales abiertos
        const backdrops = document.querySelectorAll('.modal-backdrop');
        const openModals = document.querySelectorAll('.modal.show');
        
        if (backdrops.length > 0 && openModals.length === 0) {
            removeModalBackdrop();
        }
    });
    
    // Agregar un manejador global para la tecla Escape
    document.addEventListener('keydown', function(event) {
        if (event.key === 'Escape') {
            // Al presionar Escape, verificar y limpiar backdrops huérfanos
            setTimeout(() => {
                const backdrops = document.querySelectorAll('.modal-backdrop');
                const openModals = document.querySelectorAll('.modal.show');
                
                if (backdrops.length > 0 && openModals.length === 0) {
                    removeModalBackdrop();
                }
            }, 300);
        }
    });
    
    console.log('Solución para backdrop modal aplicada');
}

/**
 * Inicializa todos los event listeners
 */
function initializeEventListeners() {
    // Resetea el formulario cuando se cierra el modal
    const formModal = document.getElementById('formModal');
    if (formModal) {
        formModal.addEventListener('hidden.bs.modal', function () {
            document.getElementById('recordForm').reset();
            document.getElementById('modalTitle').innerText = 'Nuevo Registro';
            document.getElementById('operation').value = 'create';
            
            // Resetea el campo ID
            const idField = document.getElementById('id');
            if (idField) {
                idField.value = '';
            }
        });
    }
    
    // Maneja el cambio en el número de autores
    const numAuthorsInput = document.getElementById('nro_autores');
    if (numAuthorsInput) {
        numAuthorsInput.addEventListener('change', function() {
            updateAuthorCards(parseInt(this.value) || 1);
        });
    }
    
    // Agrega event listeners a todos los campos de calificación para calcular promedio
    for (let evaluator = 1; evaluator <= 3; evaluator++) {
        for (let criteria = 1; criteria <= 6; criteria++) {
            const scoreField = document.getElementById(`calificacion${evaluator}_${criteria}`);
            if (scoreField) {
                scoreField.addEventListener('input', calculateAverageScore);
            }
        }
    }
    
    // Funcionalidad de búsqueda
    const searchInput = document.getElementById('searchInput');
    const searchButton = document.getElementById('searchButton');
    
    if (searchInput && searchButton) {
        searchButton.addEventListener('click', function() {
            performSearch(searchInput.value);
        });
        
        // Buscar también al presionar Enter
        searchInput.addEventListener('keypress', function(e) {
            if (e.key === 'Enter') {
                performSearch(this.value);
            }
        });
    }
    
    // Filtrar por estado
    const filterEstado = document.getElementById('filterEstado');
    if (filterEstado) {
        filterEstado.addEventListener('change', function() {
            applyFilter('estado', this.value);
        });
    }
    
    // Botón de exportación
    const exportButton = document.getElementById('exportButton');
    if (exportButton) {
        exportButton.addEventListener('click', exportData);
    }
}

/**
 * NUEVA FUNCIÓN: Inicializa los botones de dropdowns para las acciones
 * Esta función se encarga de manejar correctamente los menús desplegables
 */
function initializeDropdownButtons() {
    console.log('Inicializando botones de acciones...');
    
    // 1. Inicializar los dropdown toggles con Bootstrap
    const dropdownToggles = document.querySelectorAll('.dropdown-toggle');
    dropdownToggles.forEach(toggle => {
        // Creamos una instancia del dropdown de Bootstrap
        new bootstrap.Dropdown(toggle);
        
        console.log('Dropdown toggle inicializado:', toggle.textContent.trim());
    });
    
    // 2. Manejar los clicks en los elementos del menú desplegable
    const dropdownItems = document.querySelectorAll('.dropdown-menu .dropdown-item');
    dropdownItems.forEach(item => {
        // Eliminamos cualquier listener existente para evitar duplicados
        item.removeEventListener('click', handleDropdownItemClick);
        // Agregamos el nuevo listener
        item.addEventListener('click', handleDropdownItemClick);
        
        console.log('Dropdown item inicializado:', item.textContent.trim());
    });
}

/**
 * NUEVA FUNCIÓN: Maneja los clicks en los elementos del menú desplegable
 */
function handleDropdownItemClick(e) {
    e.preventDefault();
    
    const onclickAttr = this.getAttribute('onclick');
    console.log('Ejecutando onclick:', onclickAttr);
    
    if (onclickAttr) {
        // Extraer el nombre de la función y los parámetros
        const funcMatch = onclickAttr.match(/(\w+)\(([^)]*)\)/);
        if (funcMatch && funcMatch.length >= 3) {
            const functionName = funcMatch[1];
            const params = funcMatch[2].trim();
            
            console.log('Función extraída:', functionName, 'Parámetros:', params);
            
            // Ejecutar la función correspondiente con los parámetros
            if (functionName === 'viewRecord' && params) {
                viewRecord(parseInt(params));
            } else if (functionName === 'editRecord' && params) {
                editRecord(parseInt(params));
            } else if (functionName === 'deleteRecord' && params) {
                deleteRecord(parseInt(params));
            }
        }
    }
    
    // Cerrar el dropdown manualmente
    const dropdownMenu = this.closest('.dropdown-menu');
    if (dropdownMenu) {
        // Intentar usar la API de Bootstrap primero
        const bsDropdown = bootstrap.Dropdown.getInstance(dropdownMenu.previousElementSibling);
        if (bsDropdown) {
            bsDropdown.hide();
        } else {
            // Fallback: quitar la clase 'show' manualmente
            dropdownMenu.classList.remove('show');
        }
    }
}

/**
 * Función para editar un registro
 * @param {Object|number} record - Objeto de registro o ID a editar
 */
function editRecord(record) {
    try {
        console.log('Editando registro:', record);
        
        // Cierra cualquier dropdown abierto
        closeAllDropdowns();
        
        // Cambia el título del modal y operación
        document.getElementById('modalTitle').innerText = 'Editar Registro';
        document.getElementById('operation').value = 'update';
        
        // Completa el formulario con los datos del registro
        if (typeof record === 'object') {
            // Para tablas que no son ttrabajo
            for (const [key, value] of Object.entries(record)) {
                const element = document.getElementById(key);
                if (element) {
                    if (element.type === 'checkbox') {
                        element.checked = value == 1;
                    } else {
                        element.value = value;
                    }
                }
            }
            
            // Muestra el modal
            const modal = new bootstrap.Modal(document.getElementById('formModal'));
            modal.show();
        } else {
            // Para ttrabajo: carga datos vía AJAX
            loadRecordData(record, function(data) {
                // Completa el formulario con los datos
                for (const [key, value] of Object.entries(data)) {
                    const element = document.getElementById(key);
                    if (element) {
                        if (element.type === 'checkbox') {
                            element.checked = value == 1;
                        } else {
                            element.value = value !== null ? value : '';
                        }
                    }
                }
                
                // Actualiza la visibilidad de las tarjetas de autores
                updateAuthorCards(data.nro_autores || 1);
                
                // Calcula y muestra el puntaje promedio
                calculateAverageScore();
                
                // Muestra el modal
                const modal = new bootstrap.Modal(document.getElementById('formModal'));
                modal.show();
            });
        }
    } catch (error) {
        console.error('Error al editar registro:', error);
        alert('Ocurrió un error al intentar editar el registro. Por favor, inténtelo de nuevo.');
    }
    
    return false; // Previene el comportamiento predeterminado
}

/**
 * Función para ver un registro en detalle
 * @param {number} id - ID del registro a ver
 */
function viewRecord(id) {
    try {
        console.log('Viendo registro con ID:', id);
        
        // Cierra cualquier dropdown abierto
        closeAllDropdowns();
        
        currentViewRecordId = id;
        
        // Carga datos vía AJAX
        loadRecordData(id, function(data) {
            // Completa el modal de vista con los datos
            document.getElementById('view_codigo').textContent = data.codigo || '';
            document.getElementById('view_titulo').textContent = data.titulo || '';
            document.getElementById('view_fecha').textContent = formatDate(data.fecha);
            
            // Obtiene la descripción del estado
            document.getElementById('view_estado').textContent = getEstadoDescription(data.estado);
            document.getElementById('view_calificacion').textContent = data.calificacion_promedio || 'No evaluado';
            document.getElementById('view_aprobado').textContent = data.aprobado == 1 ? 'Sí' : 'No';
            
            // Secciones de contenido
            document.getElementById('view_introduccion').textContent = data.introduccion || 'No disponible';
            document.getElementById('view_materiales').textContent = data.materiales || 'No disponible';
            document.getElementById('view_resultados').textContent = data.resultados || 'No disponible';
            document.getElementById('view_conclusiones').textContent = data.conclusiones || 'No disponible';
            
            // Sección de autores
            document.getElementById('autoresView').innerHTML = generateAuthorsHTML(data);
            
            // Sección de evaluaciones
            document.getElementById('evaluacionesView').innerHTML = generateEvaluationsHTML(data);
            
            // Muestra el modal
            const modal = new bootstrap.Modal(document.getElementById('viewModal'));
            modal.show();
        });
    } catch (error) {
        console.error('Error al ver detalles:', error);
        alert('Ocurrió un error al intentar ver los detalles del registro. Por favor, inténtelo de nuevo.');
    }
    
    return false; // Previene el comportamiento predeterminado
}

/**
 * Función para editar un registro desde el modal de vista
 */
function editRecordFromView() {
    // Oculta el modal de vista
    const viewModal = bootstrap.Modal.getInstance(document.getElementById('viewModal'));
    viewModal.hide();
    
    // Abre el modal de edición con el registro actual
    if (currentViewRecordId) {
        setTimeout(() => {
            editRecord(currentViewRecordId);
        }, 300); // Esperar a que se cierre el modal de vista completamente
    }
}

/**
 * Función para eliminar un registro
 * @param {number} id - ID del registro a eliminar
 */
function deleteRecord(id) {
    try {
        console.log('Eliminando registro con ID:', id);
        
        // Cierra cualquier dropdown abierto
        closeAllDropdowns();
        
        document.getElementById('deleteId').value = id;
        
        // Muestra el modal de confirmación
        const modal = new bootstrap.Modal(document.getElementById('deleteModal'));
        modal.show();
    } catch (error) {
        console.error('Error al eliminar registro:', error);
        alert('Ocurrió un error al intentar eliminar el registro. Por favor, inténtelo de nuevo.');
    }
    
    return false; // Previene el comportamiento predeterminado
}

/**
 * Carga datos de registro vía AJAX con manejo mejorado de errores
 * @param {number} id - ID del registro a cargar
 * @param {Function} callback - Función callback a ejecutar con los datos
 */
function loadRecordData(id, callback) {
    console.log('Cargando datos para ID:', id);
    
    // Agregar timestamp para evitar caché
    const timestamp = new Date().getTime();
    const url = `get_record.php?table=ttrabajo&id=${id}&_=${timestamp}`;
    
    fetch(url)
        .then(response => {
            console.log('Estado de respuesta HTTP:', response.status);
            if (!response.ok) {
                throw new Error('Error en la respuesta del servidor: ' + response.status);
            }
            return response.text(); // Obtenemos como texto para inspeccionar
        })
        .then(responseText => {
            console.log('Longitud de la respuesta:', responseText.length);
            
            // Si la respuesta está vacía, no hay nada que procesar
            if (!responseText.trim()) {
                throw new Error('La respuesta del servidor está vacía');
            }
            
            try {
                // Intentar analizar el JSON
                const data = JSON.parse(responseText);
                console.log('Datos JSON obtenidos correctamente');
                
                if (callback && typeof callback === 'function') {
                    callback(data);
                }
            } catch (parseError) {
                console.error('Error al parsear JSON:', parseError);
                
                // Mostrar fragmento alrededor del error para depuración
                const errorPos = getJsonErrorPosition(parseError.message);
                if (errorPos > 0) {
                    const start = Math.max(0, errorPos - 20);
                    const end = Math.min(responseText.length, errorPos + 20);
                    console.log('Fragmento alrededor del error:');
                    console.log(responseText.substring(start, errorPos) + ' >>> ERROR AQUÍ >>> ' + responseText.substring(errorPos, end));
                    console.log('Caracteres en hexadecimal:');
                    for (let i = start; i < end; i++) {
                        console.log(`Posición ${i}: "${responseText[i]}" - Hex: ${responseText.charCodeAt(i).toString(16)}`);
                    }
                }
                
                throw parseError; // Re-lanzar para ser capturado por el catch
            }
        })
        .catch(error => {
            console.error('Error cargando datos:', error);
            alert('Error al cargar los datos del registro. Por favor, inténtelo de nuevo.');
        });
}

/**
 * Extrae la posición del error de un mensaje de error JSON
 * @param {string} errorMessage - Mensaje de error de JSON.parse
 * @returns {number} - Posición del error o -1 si no se puede determinar
 */
function getJsonErrorPosition(errorMessage) {
    // Parse error messages like: "Unexpected token < in JSON at position 0"
    const match = errorMessage.match(/position\s+(\d+)/i);
    if (match && match[1]) {
        return parseInt(match[1], 10);
    }
    return -1;
}

/**
 * Actualiza la visibilidad de las tarjetas de autores según el número de autores
 * @param {number} numAuthors - Número de autores a mostrar
 */
function updateAuthorCards(numAuthors) {
    numAuthors = parseInt(numAuthors) || 1;
    
    // Asegura un rango válido
    if (numAuthors < 1) numAuthors = 1;
    if (numAuthors > 10) numAuthors = 10;
    
    // Oculta todas las tarjetas de autores primero
    const authorCards = document.querySelectorAll('.author-card');
    authorCards.forEach(card => {
        card.style.display = 'none';
    });
    
    // Muestra las tarjetas de autores relevantes
    for (let i = 2; i <= numAuthors; i++) {
        const card = document.getElementById(`author${i}Card`);
        if (card) {
            card.style.display = 'block';
        }
    }
}

/**
 * Calcula el puntaje promedio de todos los criterios de los evaluadores
 */
function calculateAverageScore() {
    let allScores = [];
    
    // Recolecta todos los puntajes de criterios
    for (let evaluator = 1; evaluator <= 3; evaluator++) {
        for (let criteria = 1; criteria <= 6; criteria++) {
            const scoreField = document.getElementById(`calificacion${evaluator}_${criteria}`);
            if (scoreField && scoreField.value) {
                const score = parseFloat(scoreField.value);
                if (!isNaN(score)) {
                    allScores.push(score);
                }
            }
        }
    }
    
    // Calcula el promedio
    const avgField = document.getElementById('calificacion_promedio');
    if (avgField) {
        if (allScores.length > 0) {
            const sum = allScores.reduce((a, b) => a + b, 0);
            const avg = (sum / allScores.length).toFixed(2);
            avgField.value = avg;
        } else {
            avgField.value = '';
        }
    }
}

/**
 * Calcula el puntaje promedio para un evaluador
 * @param {Object} data - Datos del registro
 * @param {number} evaluatorNum - Número de evaluador (1-3)
 * @returns {string} - Puntaje promedio formateado
 */
function calculateEvaluatorAverage(data, evaluatorNum) {
    let sum = 0;
    let count = 0;
    
    for (let i = 1; i <= 6; i++) {
        const score = parseFloat(data[`calificacion${evaluatorNum}_${i}`]);
        if (!isNaN(score)) {
            sum += score;
            count++;
        }
    }
    
    return count > 0 ? (sum / count).toFixed(2) : 'No disponible';
}

/**
 * Genera HTML para mostrar autores
 * @param {Object} data - Datos del registro
 * @returns {string} - Markup HTML para autores
 */
function generateAuthorsHTML(data) {
    let authorsHtml = '';
    const numAuthors = parseInt(data.nro_autores) || 1;
    
    for (let i = 1; i <= numAuthors; i++) {
        if (data['autor' + i]) {
            authorsHtml += `
                <div class="mb-2">
                    <strong>Autor ${i}:</strong> ${data['titulo_autor' + i] ? data['titulo_autor' + i] + ' ' : ''}
                    ${data['autor' + i]} ${data['apellido_autor' + i] || ''}
                    ${data['inst_autor' + i] ? ' (' + data['inst_autor' + i] + ')' : ''}
                    ${data['email_autor' + i] ? ' - ' + data['email_autor' + i] : ''}
                </div>
            `;
        }
    }
    
    return authorsHtml || 'No hay información de autores';
}

/**
 * Genera HTML para mostrar evaluaciones
 * @param {Object} data - Datos del registro
 * @returns {string} - Markup HTML para evaluaciones
 */
function generateEvaluationsHTML(data) {
    let evaluationsHtml = '';
    
    // Verifica si hay evaluaciones
    if (data.evaluador1 || data.evaluador2 || data.evaluador3) {
        evaluationsHtml = '<div class="row">';
        
        // Evaluador 1
        if (data.evaluador1) {
            evaluationsHtml += generateEvaluatorHTML(data, 1);
        }
        
        // Evaluador 2
        if (data.evaluador2) {
            evaluationsHtml += generateEvaluatorHTML(data, 2);
        }
        
        // Evaluador 3
        if (data.evaluador3) {
            evaluationsHtml += generateEvaluatorHTML(data, 3);
        }
        
        evaluationsHtml += '</div>';
    } else {
        evaluationsHtml = '<p>No hay evaluaciones disponibles</p>';
    }
    
    return evaluationsHtml;
}

/**
 * Genera HTML para un evaluador
 * @param {Object} data - Datos del registro
 * @param {number} evaluatorNum - Número de evaluador (1-3)
 * @returns {string} - Markup HTML para evaluador
 */
function generateEvaluatorHTML(data, evaluatorNum) {
    return `
        <div class="col-md-4">
            <div class="card mb-3">
                <div class="card-header bg-light">Evaluador ${evaluatorNum}</div>
                <div class="card-body">
                    <p><strong>Fecha:</strong> ${formatDate(data[`calificacion${evaluatorNum}_fecha`])}</p>
                    <p><strong>Calificación promedio:</strong> ${calculateEvaluatorAverage(data, evaluatorNum)}</p>
                    <ul class="list-unstyled">
                        ${data[`calificacion${evaluatorNum}_1`] ? '<li>Criterio 1: ' + data[`calificacion${evaluatorNum}_1`] + '</li>' : ''}
                        ${data[`calificacion${evaluatorNum}_2`] ? '<li>Criterio 2: ' + data[`calificacion${evaluatorNum}_2`] + '</li>' : ''}
                        ${data[`calificacion${evaluatorNum}_3`] ? '<li>Criterio 3: ' + data[`calificacion${evaluatorNum}_3`] + '</li>' : ''}
                        ${data[`calificacion${evaluatorNum}_4`] ? '<li>Criterio 4: ' + data[`calificacion${evaluatorNum}_4`] + '</li>' : ''}
                        ${data[`calificacion${evaluatorNum}_5`] ? '<li>Criterio 5: ' + data[`calificacion${evaluatorNum}_5`] + '</li>' : ''}
                        ${data[`calificacion${evaluatorNum}_6`] ? '<li>Criterio 6: ' + data[`calificacion${evaluatorNum}_6`] + '</li>' : ''}
                    </ul>
                </div>
            </div>
        </div>
    `;
}

/**
 * Formatea fecha para mostrar
 * @param {string} dateString - String de fecha a formatear
 * @returns {string} - Fecha formateada
 */
function formatDate(dateString) {
    if (!dateString) return 'No disponible';
    
    const date = new Date(dateString);
    if (isNaN(date.getTime())) return 'Fecha inválida';
    
    return date.toLocaleDateString('es-ES', {
        day: '2-digit',
        month: '2-digit',
        year: 'numeric'
    });
}

/**
 * Obtiene descripción de estado a partir del código
 * @param {number|string} estadoCode - Código de estado
 * @returns {string} - Descripción de estado
 */
function getEstadoDescription(estadoCode) {
    estadoCode = parseInt(estadoCode);
    
    switch (estadoCode) {
        case 1: return 'Pendiente por asignar';
        case 2: return 'Pendiente por evaluar';
        case 3: return 'En proceso de evaluacion';
        case 4: return 'Evaluado';
        case 5: return 'No Aprobado';
        default: return 'Desconocido';
    }
}

/**
 * Realiza operación de búsqueda
 * @param {string} searchText - Texto a buscar
 */
function performSearch(searchText) {
    // En una aplicación real, esto navegaría a una URL filtrada
    // window.location.href = `?tab=ttrabajo&search=${encodeURIComponent(searchText)}`;
    
    // Para fines de demostración
    alert('Búsqueda implementada: ' + searchText);
    console.log('Buscando:', searchText);
}

/**
 * Aplica filtro a los datos
 * @param {string} filterType - Tipo de filtro
 * @param {string} filterValue - Valor por el que filtrar
 */
function applyFilter(filterType, filterValue) {
    // En una aplicación real, esto navegaría a una URL filtrada
    // window.location.href = `?tab=ttrabajo&${filterType}=${encodeURIComponent(filterValue)}`;
    
    // Para fines de demostración
    alert(`Filtro aplicado: ${filterType}=${filterValue}`);
    console.log('Filtrando por:', filterType, filterValue);
}

/**
 * Exporta datos a CSV o Excel
 */
function exportData() {
    // En una aplicación real, esto llamaría a un script de exportación del lado del servidor
    // window.location.href = 'export.php?table=ttrabajo&format=excel';
    
    // Para fines de demostración
    alert('Exportación de datos iniciada');
    console.log('Exportando datos');
}

/**
 * Cierra todos los dropdowns abiertos
 */
function closeAllDropdowns() {
    document.querySelectorAll('.dropdown-menu.show').forEach(menu => {
        menu.classList.remove('show');
    });
}

/**
 * Función original: Soluciona problemas con dropdowns y elementos interactivos
 * Esta función se mantiene para compatibilidad con el código existente,
 * pero el nuevo manejo principal de dropdowns se hace con initializeDropdownButtons()
 */
function fixDropdownIssues() {
    // Esta función ahora sirve como respaldo y se mantiene por compatibilidad
    console.log('Ejecutando correcciones auxiliares para dropdowns');
}

/**
 * Función de diagnóstico para depurar problemas de Bootstrap
 * Puedes llamar a esta función desde la consola del navegador
 */
function diagnosticarBootstrap() {
    console.log('=== DIAGNÓSTICO DE BOOTSTRAP ===');
    
    // Verificar si Bootstrap está cargado
    if (typeof bootstrap === 'undefined') {
        console.error('❌ Bootstrap no está cargado correctamente');
        return;
    }
    
  console.log('✓ Bootstrap está cargado');
    console.log('Versión:', bootstrap.Dropdown.VERSION || 'No detectada');
    
    // Verificar toggles de dropdown
    const dropdownToggles = document.querySelectorAll('.dropdown-toggle');
    console.log(`Encontrados ${dropdownToggles.length} botones dropdown-toggle`);
    
    dropdownToggles.forEach((toggle, i) => {
        console.log(`Toggle ${i + 1}:`, {
            texto: toggle.textContent.trim(),
            dataset: toggle.dataset,
            dataToggle: toggle.getAttribute('data-bs-toggle') || toggle.getAttribute('data-toggle'),
            instancia: bootstrap.Dropdown.getInstance(toggle) ? 'Sí' : 'No'
        });
    });
    
    // Verificar elementos del menú
    const menuItems = document.querySelectorAll('.dropdown-menu .dropdown-item');
    console.log(`Encontrados ${menuItems.length} elementos dropdown-item`);
    
    menuItems.forEach((item, i) => {
        console.log(`Item ${i + 1}:`, {
            texto: item.textContent.trim(),
            href: item.getAttribute('href'),
            onclick: item.getAttribute('onclick')
        });
    });
    
    // Verificar estado de los modales
    const modals = document.querySelectorAll('.modal');
    console.log(`Encontrados ${modals.length} modales`);
    
    modals.forEach((modal, i) => {
        const isVisible = modal.classList.contains('show');
        const instance = bootstrap.Modal.getInstance(modal);
        
        console.log(`Modal ${i + 1} (${modal.id}):`, {
            visible: isVisible ? 'Sí' : 'No',
            instancia: instance ? 'Sí' : 'No',
            backdrop: document.querySelector('.modal-backdrop') ? 'Presente' : 'Ausente'
        });
    });
    
    // Verificar estado del body
    console.log('Estado del body:', {
        clases: document.body.className,
        scroll: document.body.style.overflow,
        paddingRight: document.body.style.paddingRight
    });
    
    console.log('=== FIN DEL DIAGNÓSTICO ===');
}

/**
 * Función para verificar y limpiar cualquier estado inconsistente de la interfaz
 * Llámala desde la consola en caso de problemas
 */
function repararInterfaz() {
    console.log('Iniciando reparación de la interfaz...');
    
    // 1. Limpiar backdrops de modal
    document.querySelectorAll('.modal-backdrop').forEach(backdrop => {
        backdrop.remove();
        console.log('- Backdrop eliminado');
    });
    
    // 2. Restaurar propiedades del body
    document.body.classList.remove('modal-open');
    document.body.style.overflow = '';
    document.body.style.paddingRight = '';
    console.log('- Propiedades del body restauradas');
    
    // 3. Cerrar modales activos
    document.querySelectorAll('.modal.show').forEach(modal => {
        try {
            const instance = bootstrap.Modal.getInstance(modal);
            if (instance) {
                instance.hide();
                console.log(`- Modal ${modal.id} cerrado`);
            } else {
                modal.classList.remove('show');
                modal.style.display = 'none';
                console.log(`- Modal ${modal.id} ocultado manualmente`);
            }
        } catch (e) {
            console.warn(`Error al cerrar modal ${modal.id}:`, e);
        }
    });
    
    // 4. Cerrar dropdowns activos
    document.querySelectorAll('.dropdown-menu.show').forEach(menu => {
        menu.classList.remove('show');
        console.log('- Dropdown cerrado');
    });
    
    // 5. Asegurar que no haya elementos flotantes
    document.querySelectorAll('.tooltip, .popover').forEach(element => {
        element.remove();
        console.log('- Elemento flotante eliminado');
    });
    
    console.log('Reparación completa. Recarga la página si sigues experimentando problemas.');
}