<?php
define('SECURE_ACCESS', true);
require_once __DIR__ . '/../includes/config.php';
require_once __DIR__ . '/../includes/database.php';
require_once __DIR__ . '/../includes/functions.php';

$page_title = 'Contacto';
$error = '';
$success = '';

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    if (!csrf_verify()) {
        $error = 'Token de seguridad inválido.';
    } else {
        $nombre = sanitize($_POST['nombre'] ?? '');
        $email = sanitize($_POST['email'] ?? '');
        $telefono = sanitize($_POST['telefono'] ?? '');
        $asunto = sanitize($_POST['asunto'] ?? '');
        $mensaje = sanitize($_POST['mensaje'] ?? '');
        if (empty($nombre) || empty($email) || empty($mensaje)) {
            $error = 'Nombre, correo y mensaje son obligatorios.';
        } elseif (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
            $error = 'Correo inválido.';
        } else {
            $db = db();
            $stmt = $db->prepare('INSERT INTO mensajes_contacto (nombre, email, telefono, asunto, mensaje) VALUES (?, ?, ?, ?, ?)');
            $stmt->execute([$nombre, $email, $telefono, $asunto, $mensaje]);
            $success = 'Tu mensaje fue enviado correctamente. Nos pondremos en contacto pronto.';
            csrf_regenerate();
        }
    }
}

require_once __DIR__ . '/../includes/header.php';
?>
<?php
// Links directos de contacto (efectivos y clicables)
$tel_directo = preg_replace('/[^0-9+]/', '', TIENDA_TELEFONO);
$wa_numero   = preg_replace('/[^0-9]/', '', TIENDA_WHATSAPP);
$dir_query   = rawurlencode(TIENDA_DIRECCION);
?>
<section class="page-header"><div class="container"><h1>Contacto</h1><nav aria-label="breadcrumb"><ol class="breadcrumb mb-0"><li class="breadcrumb-item"><a href="<?= url('') ?>">Inicio</a></li><li class="breadcrumb-item active">Contacto</li></ol></nav></div></section>
<section class="py-5">
  <div class="container">
    <div class="row g-4">
      <!-- Columna izquierda: canales efectivos de contacto -->
      <div class="col-lg-5">
        <div class="contact-info-card h-100">
          <h3 class="fw-bold mb-3">Estamos para ayudarte</h3>
          <p class="text-white-50">Elige el canal que prefieras y te responderemos a la brevedad.</p>

          <a href="tel:<?= e($tel_directo) ?>" class="text-white text-decoration-none">
            <div><i class="bi bi-telephone-fill me-2"></i><strong>Llámanos:</strong> <?= TIENDA_TELEFONO ?></div>
          </a>
          <a href="https://wa.me/<?= e($wa_numero) ?>?text=<?= urlencode('Hola TechShop Perú, necesito información.') ?>" target="_blank" rel="noopener" class="text-white text-decoration-none">
            <div><i class="bi bi-whatsapp me-2"></i><strong>WhatsApp:</strong> <?= TIENDA_WHATSAPP ?></div>
          </a>
          <a href="mailto:<?= e(TIENDA_EMAIL) ?>" class="text-white text-decoration-none">
            <div><i class="bi bi-envelope-fill me-2"></i><strong>Email:</strong> <?= TIENDA_EMAIL ?></div>
          </a>
          <a href="https://www.google.com/maps/search/?api=1&query=<?= $dir_query ?>" target="_blank" rel="noopener" class="text-white text-decoration-none">
            <div><i class="bi bi-geo-alt-fill me-2"></i><strong>Visítanos:</strong> <?= TIENDA_DIRECCION ?></div>
          </a>
          <div><i class="bi bi-clock-fill me-2"></i><strong>Horario:</strong> Lun a Vie: 9:00 - 19:00 · Sáb: 9:00 - 13:00</div>
        </div>
      </div>

      <!-- Columna derecha: formulario + mapa -->
      <div class="col-lg-7">
        <div class="card border-0 shadow-sm">
          <div class="card-body p-4">
            <?php if ($error): ?><div class="alert alert-danger"><?= e($error) ?></div><?php endif; ?>
            <?php if ($success): ?><div class="alert alert-success"><?= e($success) ?></div><?php endif; ?>
            <form method="POST" class="needs-validation" novalidate>
              <?= csrf_field() ?>
              <div class="row g-3">
                <div class="col-md-6"><label class="form-label">Nombre</label><input type="text" class="form-control" name="nombre" required></div>
                <div class="col-md-6"><label class="form-label">Correo</label><input type="email" class="form-control" name="email" required></div>
                <div class="col-md-6"><label class="form-label">Teléfono</label><input type="text" class="form-control" name="telefono"></div>
                <div class="col-md-6"><label class="form-label">Asunto</label><input type="text" class="form-control" name="asunto"></div>
                <div class="col-12"><label class="form-label">Mensaje</label><textarea class="form-control" name="mensaje" rows="5" required></textarea></div>
              </div>
              <button type="submit" class="btn btn-primary mt-3">Enviar mensaje</button>
            </form>
          </div>
        </div>

        <!-- Mapa de ubicación -->
        <div class="card border-0 shadow-sm mt-4">
          <div class="card-body p-3">
            <h5 class="fw-bold mb-3"><i class="bi bi-map text-primary me-2"></i>Nuestra Ubicación</h5>
            <div class="contact-map rounded-3 overflow-hidden" style="height:260px;">
              <iframe
                src="https://www.google.com/maps?q=<?= $dir_query ?>&output=embed"
                width="100%" height="100%" style="border:0;"
                allowfullscreen loading="lazy"
                referrerpolicy="no-referrer-when-downgrade"
                title="Mapa - <?= e(TIENDA_NOMBRE) ?>"></iframe>
            </div>
            <div class="d-flex align-items-center justify-content-between mt-3 small">
              <span class="text-muted"><i class="bi bi-geo-alt me-1"></i><?= e(TIENDA_DIRECCION) ?></span>
              <a href="https://www.google.com/maps/search/?api=1&query=<?= $dir_query ?>" target="_blank" rel="noopener" class="btn btn-outline-primary btn-sm">Cómo llegar</a>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>
<?php require_once __DIR__ . '/../includes/footer.php'; ?>
