document.addEventListener("DOMContentLoaded", function() {
    const tabla = document.getElementById("tabla");
    const resumenDiv = document.getElementById("resumen");
    tabla.querySelectorAll("tbody tr").forEach(function(row) {
        row.addEventListener("click", function() {
            tabla.querySelectorAll("tr").forEach(r => r.classList.remove("selected"));
            row.classList.add("selected");
            const resumen = row.getAttribute("data-resumen");
            resumenDiv.innerHTML = "<b>Resumen:</b> " + resumen;
        });
    });

    // Mostrar más filas al hacer clic en el botón
    const verMasBtn = document.getElementById("ver-mas");
    if (verMasBtn) {
        verMasBtn.addEventListener("click", function() {
            tabla.querySelectorAll("tbody tr").forEach(function(row, idx) {
                if (idx >= 12) {
                    row.style.display = "";
                }
            });
            verMasBtn.style.display = "none"; // Oculta el botón después de mostrar todo
        });
    }
});