// =========================
// 1) Cuenta atrás boda
// =========================

const weddingDate = new Date("2026-09-19T12:30:00+02:00");

function updateCountdown() {
    const now = new Date();
    const diff = weddingDate.getTime() - now.getTime();

    const daysEl = document.getElementById("days");
    const hoursEl = document.getElementById("hours");
    const minutesEl = document.getElementById("minutes");
    const secondsEl = document.getElementById("seconds");

    if (!daysEl) return;

    if (diff <= 0) {
        daysEl.textContent = "0";
        hoursEl.textContent = "0";
        minutesEl.textContent = "0";
        secondsEl.textContent = "0";
        return;
    }

    const totalSeconds = Math.floor(diff / 1000);

    daysEl.textContent = Math.floor(totalSeconds / 86400);
    hoursEl.textContent = String(Math.floor((totalSeconds % 86400) / 3600)).padStart(2, "0");
    minutesEl.textContent = String(Math.floor((totalSeconds % 3600) / 60)).padStart(2, "0");
    secondsEl.textContent = String(totalSeconds % 60).padStart(2, "0");
}

updateCountdown();
setInterval(updateCountdown, 1000);

// =========================
// 2) Mostrar/ocultar RSVP
// =========================

const asistenciaSelect = document.getElementById("asistencia");
const guestDetails = document.getElementById("guestDetails");

function actualizarFormularioAsistencia() {
    if (!asistenciaSelect || !guestDetails) return;

    const viene = asistenciaSelect.value === "si";

    guestDetails.style.display = viene ? "block" : "none";

    if (!viene) {
        const acompanantesInput = document.getElementById("acompanantes");
        const acompanantesExtra = document.getElementById("acompanantesExtra");

        if (acompanantesInput) acompanantesInput.value = "0";
        if (acompanantesExtra) acompanantesExtra.innerHTML = "";
    }
}

if (asistenciaSelect) {
    asistenciaSelect.addEventListener("change", actualizarFormularioAsistencia);
    actualizarFormularioAsistencia();
}

// =========================
// 3) RSVP + Seguridad
// =========================

// =========================
// 3) RSVP
// =========================

const rsvpForm = document.getElementById("rsvpForm");
const rsvpMessage = document.getElementById("rsvpMessage");

if (rsvpForm) {
    rsvpForm.addEventListener("submit", function (e) {
        e.preventDefault();

        rsvpMessage.textContent = "Enviando confirmación...";
        rsvpMessage.style.color = "#5D7158";

        enviarConfirmacionEmailJS();
    });
}


//const rsvpForm = document.getElementById("rsvpForm");
//const rsvpMessage = document.getElementById("rsvpMessage");

////const rsvpSecurityModal = document.getElementById("rsvpSecurityModal");
////const rsvpSecurityInput = document.getElementById("rsvpSecurityInput");
////const rsvpSecurityMessage = document.getElementById("rsvpSecurityMessage");
////const rsvpSecurityAccept = document.getElementById("rsvpSecurityAccept");
////const rsvpSecurityCancel = document.getElementById("rsvpSecurityCancel");

//let rsvpPendingSubmit = false;

//if (rsvpForm) {
//    rsvpForm.addEventListener("submit", function (e) {
//        e.preventDefault();

//        rsvpPendingSubmit = true;
//        rsvpSecurityModal.classList.add("open");

//        rsvpSecurityInput.value = "";
//        rsvpSecurityMessage.textContent = "";

//        setTimeout(() => rsvpSecurityInput.focus(), 100);
//    });
//}

//function cerrarRsvpSecurityModal() {
//    rsvpPendingSubmit = false;
//    rsvpSecurityModal.classList.remove("open");
//}

//function confirmarEnvioRsvp() {
    //if (!rsvpPendingSubmit) return;

    //const valor = rsvpSecurityInput.value.trim().toUpperCase();

    //if (valor !== "AMOR") {
    //    rsvpSecurityMessage.textContent = "Validación incorrecta 💚";
    //    return;
    //}

    //rsvpSecurityModal.classList.remove("open");

    //rsvpMessage.textContent = "Enviando confirmación...";
    //rsvpMessage.style.color = "#5D7158";

    //enviarConfirmacionEmailJS();

//    if (rsvpForm) {
//        rsvpForm.addEventListener("submit", function (e) {
//            e.preventDefault();

//            rsvpMessage.textContent = "Enviando confirmación...";
//            rsvpMessage.style.color = "#5D7158";

//            enviarConfirmacionEmailJS();
//        });
//    }
//}


//if (rsvpSecurityAccept) {
//    rsvpSecurityAccept.addEventListener("click", confirmarEnvioRsvp);
//}

//if (rsvpSecurityCancel) {
//    rsvpSecurityCancel.addEventListener("click", cerrarRsvpSecurityModal);
//}

//if (rsvpSecurityInput) {
//    rsvpSecurityInput.addEventListener("keydown", function (e) {
//        if (e.key === "Enter") confirmarEnvioRsvp();
//    });
//}


// =========================
// 4) Acompañantes dinámicos
// =========================


const acompanantesInput = document.getElementById("acompanantes");
const acompanantesExtra = document.getElementById("acompanantesExtra");

const opcionesMenu = `
    <option value="">Selecciona una opción</option>
    <option value="normal">Normal</option>
    <option value="vegetariano">Vegetariano</option>
    <option value="vegano">Vegano</option>
    <option value="infantil">Infantil</option>
    <option value="sin_gluten">Sin gluten</option>
    <option value="vegetariano_sin_gluten">Vegetariano sin gluten</option>
    <option value="halal">Halal</option>
    <option value="sin_lactosa">Sin lactosa</option>
    <option value="embarazada">Embarazada</option>
    <option value="otro">Otro</option>
`;

function generarAcompanantes() {
    if (!acompanantesInput || !acompanantesExtra) return;

    let cantidad = parseInt(acompanantesInput.value, 10);
    if (isNaN(cantidad) || cantidad < 0) cantidad = 0;
    if (cantidad > 8) cantidad = 8;

    acompanantesInput.value = cantidad;
    acompanantesExtra.innerHTML = "";

    for (let i = 1; i <= cantidad; i++) {
        const bloque = document.createElement("div");
        bloque.className = "acompanante-card";

        bloque.innerHTML = `
            <h4>Acompañante ${i}</h4>

            <div class="form-row">
                <div class="form-group">
                    <label for="nombre_acompanante_${i}">Nombre y apellidos</label>
                    <input 
                        type="text" 
                        id="nombre_acompanante_${i}" 
                        name="nombre_acompanante_${i}">
                </div>

                <div class="form-group">
                    <label for="menu_acompanante_${i}">Tipo de menú</label>
                    <select 
                        id="menu_acompanante_${i}" 
                        name="menu_acompanante_${i}">
                        ${opcionesMenu}
                    </select>
                </div>
            </div>

            <div class="form-group">
                <label for="alergias_acompanante_${i}">Alergias o intolerancias</label>
                <textarea 
                    id="alergias_acompanante_${i}" 
                    name="alergias_acompanante_${i}" 
                    rows="2"></textarea>
            </div>
        `;

        acompanantesExtra.appendChild(bloque);
    }
}

if (acompanantesInput) {
    acompanantesInput.addEventListener("input", generarAcompanantes);
    generarAcompanantes();
}

// =========================
// 5) Confirmar_Asistencia
// =========================

function enviarConfirmacionEmailJS() {
    const nombre = document.getElementById("nombre")?.value || "";
    const asistencia = document.getElementById("asistencia")?.value || "";
    const acompanantes = document.getElementById("acompanantes")?.value || "0";
    const menuPrincipal = document.getElementById("menu")?.value || "";
    const alergiasPrincipal = document.getElementById("alergias")?.value || "";
    const comentarios = document.getElementById("comentarios")?.value || "";

    let detalleAcompanantes = "";

    for (let i = 1; i <= parseInt(acompanantes, 10); i++) {
        const nombreAcomp = document.getElementById(`nombre_acompanante_${i}`)?.value || "";
        const menuAcomp = document.getElementById(`menu_acompanante_${i}`)?.value || "";
        const alergiasAcomp = document.getElementById(`alergias_acompanante_${i}`)?.value || "";

        detalleAcompanantes += `
                Acompañante ${i}
                Nombre: ${nombreAcomp || "No indicado"}
                Menú: ${menuAcomp || "No indicado"}
                Alergias: ${alergiasAcomp || "No indicado"}

                `;
    }

    if (detalleAcompanantes === "") {
        detalleAcompanantes = "<p>Sin acompañantes</p>";
    }

    const templateParams = {
        nombre: nombre,
        asistencia: asistencia,
        acompanantes: acompanantes,
        menu_principal: menuPrincipal,
        alergias_principal: alergiasPrincipal || "No indicado",
        comentarios: comentarios || "Sin comentarios",
        detalle_acompanantes: detalleAcompanantes,
        fecha_envio: new Date().toLocaleString("es-ES")
    };

    emailjs.send(
        "service_0b1ew3v",
        "Confirmacion_Asistencia",
        templateParams
    )
        .then(() => {
            rsvpMessage.textContent = "¡Gracias por confirmar! 🥂";
            rsvpMessage.style.color = "#5D7158";

            rsvpForm.reset();
            actualizarFormularioAsistencia();

            const acompanantesExtra = document.getElementById("acompanantesExtra");
            if (acompanantesExtra) acompanantesExtra.innerHTML = "";

            rsvpPendingSubmit = false;
        })
        .catch((error) => {
            console.error("Error EmailJS:", error);

            rsvpMessage.textContent = "No se ha podido enviar la confirmación. Inténtalo de nuevo.";
            rsvpMessage.style.color = "#9b3a3a";

            rsvpPendingSubmit = false;
        });
}

// =========================
// 6) Seguridad invitación
// =========================

const btnVerInvitacion = document.querySelector('a[href="#invitacion"].btn.primary');
const invitationModal = document.getElementById("invitationModal");
const invitationBox = document.getElementById("invitationBox");
const promiseCheckbox = document.getElementById("invitationPromise");
const modalAccept = document.getElementById("modalAccept");
const modalCancel = document.getElementById("modalCancel");
const securityAnswer = document.getElementById("securityAnswer");
const securityMessage = document.getElementById("securityMessage");

function comprobarAcceso() {
    const correcto = securityAnswer.value === "correcta" && promiseCheckbox.checked;
    modalAccept.disabled = !correcto;
}

if (btnVerInvitacion) {
    btnVerInvitacion.addEventListener("click", e => {
        e.preventDefault();
        invitationModal.classList.add("open");
    });
}

if (securityAnswer) securityAnswer.addEventListener("change", comprobarAcceso);
if (promiseCheckbox) promiseCheckbox.addEventListener("change", comprobarAcceso);

if (modalCancel) modalCancel.addEventListener("click", () => {
    invitationModal.classList.remove("open");
});

if (modalAccept) {
    modalAccept.addEventListener("click", () => {
        invitationBox.classList.remove("locked");
        invitationModal.classList.remove("open");
    });
}

// =========================
// 7) Canción favorita
// =========================

const songForm = document.getElementById("songForm");
const songMessage = document.getElementById("songMessage");

function enviarCancionEmailJS() {

    const cancion =
        document.getElementById("songRecommendation")?.value.trim();

    if (!cancion) {
        return;
    }

    const templateParams = {
        cancion: cancion,
        fecha_envio: new Date().toLocaleString("es-ES")
    };

    emailjs.send(
        "service_0b1ew3v",
        "Cancion_Boda",
        templateParams
    )
        .then(() => {

            songMessage.textContent =
                "¡Gracias por tu recomendación!";
            songMessage.style.color = "#5D7158";

            songForm.reset();

        })
        .catch((error) => {

            console.error("Error EmailJS:", error);

            songMessage.textContent =
                "No se ha podido enviar la canción.";
            songMessage.style.color = "#b33a3a";

        });
}

if (songForm) {

    songForm.addEventListener("submit", function (e) {

        e.preventDefault();

        enviarCancionEmailJS();

    });

}

// =========================
// 8) After Party
// =========================

const afterButtons = document.querySelectorAll(".after-choice");
const afterMessage = document.getElementById("afterMessage");

afterButtons.forEach(button => {
    button.addEventListener("click", function () {
        const respuesta = this.dataset.after;

        afterMessage.textContent = "Enviando respuesta...";
        afterMessage.style.color = "#5D7158";

        const templateParams = {
            respuesta_afterparty: respuesta,
            fecha_envio: new Date().toLocaleString("es-ES")
        };

        emailjs.send(
            "service_0b1ew3v",
            "Afterparty_Boda",
            templateParams
        )
            .then(() => {
                afterMessage.textContent = "¡Gracias por responder!";
                afterMessage.style.color = "#5D7158";
            })
            .catch((error) => {
                console.error("Error EmailJS:", error);
                afterMessage.textContent = "No se ha podido enviar la respuesta.";
                afterMessage.style.color = "#b33a3a";
            });
    });
});


// Banner

const banner = document.getElementById("cookieBanner");
const btnAccept = document.getElementById("acceptCookies");

if (banner && btnAccept) {
    if (!localStorage.getItem("cookiesAccepted")) {
        banner.style.display = "flex";
    }

    btnAccept.addEventListener("click", () => {
        localStorage.setItem("cookiesAccepted", "true");
        banner.style.display = "none";
    });
}