/**
 * Envío AJAX del formulario de contacto + modal de éxito.
 */
(function () {
  'use strict';

  const form   = document.getElementById('form-contacto');
  const modal  = document.getElementById('modal-contacto');
  const btnCerrar = modal ? modal.querySelector('.modal-cerrar') : null;
  const btnEnviar = form ? form.querySelector('button[type="submit"]') : null;

  if (!form || !modal) return;

  let redirectTimer = null;

  // ── Helpers ────────────────────────────────────────────────────────
  function abrirModal(mensaje) {
    const texto = modal.querySelector('.modal-mensaje');
    if (texto && mensaje) texto.textContent = mensaje;
    modal.classList.add('is-visible');
    modal.setAttribute('aria-hidden', 'false');
    document.body.style.overflow = 'hidden';
  }

  function cerrarModal(redirigir = false) {
    modal.classList.remove('is-visible');
    modal.setAttribute('aria-hidden', 'true');
    document.body.style.overflow = '';
    if (redirectTimer) clearTimeout(redirectTimer);
    if (redirigir) window.location.href = 'index.html';
  }

  function mostrarError(mensaje) {
    // Reutilizamos el modal con estética distinta
    modal.classList.add('is-error');
    abrirModal(mensaje);
  }

  // ── Cerrar modal ───────────────────────────────────────────────────
  if (btnCerrar) {
    btnCerrar.addEventListener('click', () => cerrarModal(true));
  }
  modal.addEventListener('click', (e) => {
    if (e.target === modal) cerrarModal(true);
  });
  document.addEventListener('keydown', (e) => {
    if (e.key === 'Escape' && modal.classList.contains('is-visible')) {
      cerrarModal(true);
    }
  });

  // ── Submit ─────────────────────────────────────────────────────────
  form.addEventListener('submit', async (e) => {
    e.preventDefault();

    // Validación nativa HTML5
    if (!form.checkValidity()) {
      form.reportValidity();
      return;
    }

    // Estado de carga
    const textoOriginal = btnEnviar ? btnEnviar.innerHTML : '';
    if (btnEnviar) {
      btnEnviar.disabled = true;
      btnEnviar.innerHTML = 'Enviando…';
    }

    try {
      const data = new FormData(form);
      const res  = await fetch('enviar.php', {
        method: 'POST',
        body: data,
        headers: { 'X-Requested-With': 'XMLHttpRequest' },
      });

      const json = await res.json().catch(() => ({
        status: 'error',
        message: 'Respuesta inválida del servidor.',
      }));

      if (json.status === 'success') {
        modal.classList.remove('is-error');
        abrirModal(json.message || '¡Gracias! Te contactaremos en breve.');
        form.reset();

        const delay = Number(json.delay) || 4000;
        redirectTimer = setTimeout(() => {
          window.location.href = json.redirect || 'index.html';
        }, delay);
      } else {
        mostrarError(json.message || 'No pudimos enviar tu mensaje.');
      }
    } catch (err) {
      mostrarError('Hubo un problema de conexión. Probá nuevamente.');
    } finally {
      if (btnEnviar) {
        btnEnviar.disabled = false;
        btnEnviar.innerHTML = textoOriginal;
      }
    }
  });
})();