<?php
require_once __DIR__ . '/../../config/database.php';

$conn = getConnection();

// Consultar configuración del sistema
$sql = "SELECT TOP 1 * FROM configuracion_sistema";
$stmt = sqlsrv_query($conn, $sql);
$config = sqlsrv_fetch_array($stmt, SQLSRV_FETCH_ASSOC);

// Variables con valores por defecto
$nombre        = $config['nombre_plataforma'] ?? 'Sistema Integral para Importadores de Hidrocarburos';
$siglas        = $config['siglas'] ?? 'SIIH';
$logo          = $config['logo_url'] ?? 'assets/img/logo_siih.png';
$color1        = explode(',', $config['colores_primarios'] ?? '#003366,#0055A5')[0];
$color2        = explode(',', $config['colores_primarios'] ?? '#003366,#0055A5')[1];
?>

<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="UTF-8">
  <title><?= htmlspecialchars($siglas) ?> | Registro de Importador</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <!-- Bootstrap 5 -->
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
  <!-- SweetAlert2 -->
  <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
  <!-- Google reCAPTCHA v2 -->
  <script src="https://www.google.com/recaptcha/api.js" async defer></script>
  <style>
    body { background-color: #f4f6f9; font-family: 'Segoe UI', sans-serif; }
    .navbar { background-color: #fff; }
    .navbar .nav-link,
    .navbar-brand { color: <?= $color1 ?> !important; font-weight: 500; }
    .navbar .nav-link.active { background-color: #F9F9F9; border-radius: 5px; }
    .card-form { max-width: 900px; margin: 50px auto; padding: 40px; background: #fff; border-radius: 10px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); }
    .form-label { font-weight: 500; }
    .form-control,
    .form-select { border-radius: 6px; }
    footer { background-color: #e9ecef; padding: 20px; text-align: center; font-size: 14px; color: #666; }
    .recaptcha { margin-top: 20px; }
    .logo-siih { height: 90px; margin-right: 10px; }
  </style>
</head>
<body>

  <!-- Navbar institucional -->
  <nav class="navbar navbar-expand-lg">
    <div class="container">
      <a class="navbar-brand d-flex align-items-center text-dark" href="#">
        <img src="/IMPORTADORES/public/<?= htmlspecialchars($logo) ?>" alt="Logo" class="logo-siih">
        | Registro de Importador
      </a>
      <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
        <span class="navbar-toggler-icon"></span>
      </button>
      <div class="collapse navbar-collapse justify-content-end" id="navbarNav">
        <ul class="navbar-nav">
          <li class="nav-item">
            <a class="nav-link" href="/IMPORTADORES/">Inicio</a>
          </li>
          <li class="nav-item">
            <a class="nav-link active" aria-current="page" href="/IMPORTADORES/registro">Registro</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="/IMPORTADORES/login">Inicio sesión</a>
          </li>
        </ul>
      </div>
    </div>
  </nav>

  <!-- Contenedor del formulario -->
  <div class="container card-form">
    <form action="/IMPORTADORES/registro/enviar" method="POST" enctype="multipart/form-data" id="formRegistro">
      <div class="row g-3">
        <div class="col-md-6">
          <label for="company_name" class="form-label">Nombre de la empresa *</label>
          <input type="text" class="form-control" name="company_name" required>
        </div>

        <div class="col-md-6">
          <label for="rfc" class="form-label">RFC *</label>
          <input type="text" class="form-control" name="rfc" maxlength="13" required>
        </div>

        <div class="col-md-6">
          <label for="email" class="form-label">Correo electrónico *</label>
          <input type="email" class="form-control" name="email" required>
        </div>

        <div class="col-md-6">
          <label for="phone" class="form-label">Teléfono *</label>
          <input type="text" class="form-control" name="phone" required>
        </div>

        <div class="col-md-12">
          <label for="opinion_file" class="form-label">Padrón de importadores o encargo conferido (PDF) *</label>
          <input type="file" class="form-control" name="opinion_file" id="opinion_file" accept=".pdf" required>
        </div>

        <div class="col-md-12 text-center recaptcha">
          <div class="g-recaptcha" data-sitekey="6LfkMB8rAAAAAH-BEC1cMYij1HEhw4sTaEOl-UCA"></div>
        </div>

        <div class="col-md-12 text-end mt-4">
          <button type="submit" class="btn btn-primary px-4 py-2">Enviar solicitud</button>
        </div>
      </div>
    </form>
  </div>

  <div class="container ">
    <div class="alert alert-warning" role="alert">
      Una vez que envíes tu solicitud, será revisada manualmente por la agencia aduanal.
      Recibirás una notificación por correo electrónico cuando tu registro sea aprobado, junto con las instrucciones para activar tu cuenta e iniciar sesión en la plataforma.
    </div>
  </div>

  <!-- FOOTER -->
  <footer class="fixed-bottom">
    &copy; <?= date('Y') ?> <?= htmlspecialchars($siglas) ?> · <?= htmlspecialchars($nombre) ?>
  </footer>

  <!-- Validación JS -->
  <script>
    document.getElementById('formRegistro').addEventListener('submit', function(e) {
      const rfcInput = document.querySelector('input[name="rfc"]');
      const emailInput = document.querySelector('input[name="email"]');
      const phoneInput = document.querySelector('input[name="phone"]');
      const archivo = document.getElementById('opinion_file').files[0];
      const recaptcha = grecaptcha.getResponse();

      const rfc = rfcInput.value.trim().toUpperCase();
      const email = emailInput.value.trim();
      const phone = phoneInput.value.trim();

      // Expresiones regulares
      const correoRegex = /^[a-z0-9._+-]+@[a-z0-9.-]+\.[a-z]{2,}$/;
      const rfcRegex = /^[A-ZÑ&]{3,4}\d{6}[A-Z0-9]{3}$/;
      const telefonoRegex = /^\d{3}\s\d{7}$/;

      // Validación de correo
      if (!correoRegex.test(email)) {
        e.preventDefault();
        Swal.fire("Correo inválido", "No es una dirección de correo válida. Solo se permiten minúsculas.", "error");
        emailInput.focus();
        return;
      }

      // Validación de RFC
      if (!rfcRegex.test(rfc)) {
        e.preventDefault();
        Swal.fire("RFC inválido", "El RFC debe tener 12 o 13 caracteres con el formato correcto (ej. ABC123456XYZ).", "error");
        rfcInput.focus();
        return;
      }

      // Validación de teléfono
      if (!telefonoRegex.test(phone)) {
        e.preventDefault();
        Swal.fire("Teléfono inválido", "Debe tener 10 dígitos en el formato: 3 dígitos (LADA), espacio, y 7 dígitos. Ejemplo: 123 4567890", "error");
        phoneInput.focus();
        return;
      }

      // Validación de archivo PDF
      if (!archivo || archivo.type !== 'application/pdf') {
        e.preventDefault();
        Swal.fire("Error", "Solo se permite subir archivos PDF.", "error");
        return;
      }

      // Validación de reCAPTCHA
      if (recaptcha.length === 0) {
        e.preventDefault();
        Swal.fire("Verificación requerida", "Por favor completa el reCAPTCHA.", "warning");
        return;
      }
    });
  </script>

</body>
</html>