<?php
require_once 'config.php';
require_once 'functions.php';
requireLogin();

$id   = (int)($_GET['id'] ?? 0);
$stmt = $pdo->prepare("SELECT r.*, c.name as car_name, c.image as car_image, c.price_km,
                               ch.name as chauffeur_name, ch.phone as chauffeur_phone, ch.photo as chauffeur_photo,
                               u.name as user_name, u.email as user_email
                        FROM reservations r
                        JOIN cars c       ON r.car_id       = c.id
                        JOIN chauffeurs ch ON r.chauffeur_id = ch.id
                        JOIN users u       ON r.user_id      = u.id
                        WHERE r.id = ? AND r.user_id = ?");
$stmt->execute([$id, $_SESSION['user_id']]);
$res = $stmt->fetch();
if (!$res) redirect('my_reservations.php');
?>
<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Réservation confirmée – First Car</title>
    <link rel="stylesheet" href="style.css">
    <style>
      .confirmed-hero{text-align:center;padding:3rem 1rem 2rem;animation:fadeUp .6s ease both;}
      .confirmed-icon{font-size:4rem;display:block;margin-bottom:1rem;animation:pulse-ring 1.5s ease 1;}
      .confirmed-title{font-family:'Cormorant Garamond',serif;font-size:2.8rem;font-weight:700;color:var(--orange-light);}
      .confirmed-sub{color:var(--light2);font-weight:300;margin-top:.6rem;}
      .recap-card{background:linear-gradient(135deg,rgba(232,130,12,.08),rgba(232,130,12,.03));border:1px solid rgba(232,130,12,.2);border-radius:var(--radius-lg);padding:2rem;max-width:680px;margin:2rem auto;animation:fadeUp .6s .2s ease both;opacity:0;animation-fill-mode:both;}
      .recap-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;}
      .recap-item label{font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--orange);display:block;margin-bottom:.25rem;}
      .recap-item span{font-size:.95rem;color:var(--light);font-weight:500;}
      .recap-divider{grid-column:1/-1;height:1px;background:rgba(255,255,255,.06);}
      .chauffeur-recap{display:flex;align-items:center;gap:1rem;grid-column:1/-1;}
      .actions-row{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;margin-top:2rem;}
      @media(max-width:600px){.recap-grid{grid-template-columns:1fr;}}
    </style>
</head>
<body>
<?php include 'header.php'; ?>
<main class="container">
  <div class="confirmed-hero">
    <span class="confirmed-icon">✅</span>
    <h1 class="confirmed-title">Réservation confirmée !</h1>
    <p class="confirmed-sub">Un email de confirmation a été envoyé à <strong><?= sanitize($res['user_email']) ?></strong></p>
  </div>

  <div class="recap-card">
    <h2 style="font-family:'Cormorant Garamond',serif;font-size:1.5rem;margin-bottom:1.5rem;text-align:center;">
      Récapitulatif de votre réservation <span style="color:var(--light2);font-size:1rem;">#<?= $res['id'] ?></span>
    </h2>

    <div class="recap-grid">
      <!-- Véhicule -->
      <div class="recap-item">
        <label>Véhicule</label>
        <span><?= sanitize($res['car_name']) ?></span>
      </div>
      <!-- Tarif -->
      <div class="recap-item">
        <label>Tarif indicatif</label>
        <span><?= number_format($res['price_km'], 2, ',', '.') ?> €/km</span>
      </div>

      <div class="recap-divider"></div>

      <!-- Date -->
      <div class="recap-item">
        <label>Date</label>
        <span><?= date('d/m/Y', strtotime($res['reservation_date'])) ?></span>
      </div>
      <!-- Heure -->
      <div class="recap-item">
        <label>Heure</label>
        <span><?= substr($res['reservation_time'], 0, 5) ?></span>
      </div>

      <div class="recap-divider"></div>

      <!-- Départ -->
      <div class="recap-item">
        <label>📍 Départ</label>
        <span><?= sanitize($res['pickup_address'] ?: 'Non renseigné') ?></span>
      </div>
      <!-- Arrivée -->
      <div class="recap-item">
        <label>🏁 Destination</label>
        <span><?= sanitize($res['dropoff_address'] ?: 'Non renseigné') ?></span>
      </div>

      <div class="recap-divider"></div>

      <!-- Chauffeur -->
      <div class="chauffeur-recap">
        <?php if (!empty($res['chauffeur_photo'])): ?>
          <img src="images/<?= sanitize($res['chauffeur_photo']) ?>" alt="" class="chauffeur-avatar" style="width:52px;height:52px;">
        <?php else: ?>
          <div class="chauffeur-avatar-placeholder">🎩</div>
        <?php endif; ?>
        <div>
          <label style="font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--orange);display:block;margin-bottom:.25rem;">Votre chauffeur</label>
          <span style="font-size:.95rem;color:var(--light);font-weight:600;"><?= sanitize($res['chauffeur_name']) ?></span>
          <span style="display:block;font-size:.82rem;color:var(--light2);"><?= sanitize($res['chauffeur_phone']) ?></span>
        </div>
      </div>
    </div>
  </div>

  <div class="actions-row">
    <a href="my_reservations.php" class="btn btn-outline">Voir mes réservations</a>
    <a href="dashboard.php" class="btn btn-primary">Réserver un autre trajet</a>
  </div>
</main>
<?php include 'footer.php'; ?>
</body>
</html>
