document.addEventListener("DOMContentLoaded", function() {
    const eventosContainer = document.querySelector(".eventos");
    const buscador = document.getElementById("buscarEvento");

    let eventosOriginales = "";

    fetch("controladores/cargar-evento.php")
    .then(response => {
        if (!response.ok) {
            throw new Error("Error al cargar los conciertos");
        }
        return response.text();
    })
    .then(data => {
        eventosOriginales = data;
        eventosContainer.innerHTML = data;
    })
    .catch(error => console.error("Error al cargar los conciertos:", error));

    buscador.addEventListener("input", function() {
        const terminoBusqueda = buscador.value.toLowerCase();

        const tempElement = document.createElement('div');
        tempElement.innerHTML = eventosOriginales;

        const eventosFiltrados = Array.from(tempElement.querySelectorAll('.evento'))
            .filter(evento => evento.textContent.toLowerCase().includes(terminoBusqueda))
            .map(evento => evento.outerHTML)
            .join("");

        eventosContainer.innerHTML = eventosFiltrados;
    });
});