const filas = 10;
const columnas = 12;
let diaSeleccionado = 23;
const asientosVendidos = { 5: new Set(), 6: new Set(), 7: new Set() };
let asientosSeleccionados = new Set();

function seleccionarDia(dia) {
    diaSeleccionado = dia;
    asientosSeleccionados.clear();
    document.querySelectorAll('.dias button').forEach(btn => btn.classList.remove('selected'));
    event.target.classList.add('selected');
    renderizarAsientos();
}

function toggleAsiento(asiento) {
    if (asientosVendidos[diaSeleccionado].has(asiento)) return;
    if (asientosSeleccionados.has(asiento)) {
        asientosSeleccionados.delete(asiento);
    } else {
        asientosSeleccionados.add(asiento);
    }
    renderizarAsientos();
}

function venderAsientos() {
    asientosSeleccionados.forEach(asiento => asientosVendidos[diaSeleccionado].add(asiento));
    asientosSeleccionados.clear();
    renderizarAsientos();
}

function renderizarAsientos() {
    const contenedor = document.getElementById('asientos');
    contenedor.innerHTML = '';
    for (let i = 0; i < filas * columnas; i++) {
        const asiento = `${Math.floor(i / columnas) + 1}${String.fromCharCode(65 + (i % columnas))}`;
        const boton = document.createElement('button');
        boton.className = 'asiento';
        if (asientosVendidos[diaSeleccionado].has(asiento)) {
            boton.classList.add('vendido');
        } else if (asientosSeleccionados.has(asiento)) {
            boton.style.backgroundColor = 'orange';
        }
        boton.textContent = asiento;
        boton.onclick = () => toggleAsiento(asiento);
        contenedor.appendChild(boton);
    }
}

renderizarAsientos();