document.addEventListener("DOMContentLoaded", function () {
    const btnToggle = document.getElementById("toggleViewBtn");
    const tabla = document.getElementById("tablaResponsive");
    const tarjetas = document.getElementById("tarjetasResponsive");

    // Asegurar que se oculte/visualice correctamente desde el principio
    tabla.style.display = "none";
    tarjetas.style.display = "block";

    btnToggle.addEventListener("click", () => {
        const mostrandoTabla = tabla.style.display === "block";

        tabla.style.display = mostrandoTabla ? "none" : "block";
        tarjetas.style.display = mostrandoTabla ? "block" : "none";

        btnToggle.textContent = mostrandoTabla ? "Ver como tabla (Exportar)" : "Ver como tarjetas";
    });
});
