<?php /** @var array $appt; @var ?array $customer; @var ?array $form */ ?>
<section class="pt-32 pb-28 max-w-2xl mx-auto px-6 text-center">
  <div class="text-6xl text-gold">✓</div>
  <h1 class="mt-6 text-4xl md:text-5xl font-display"><?= e(t('booking.confirm.title')) ?></h1>
  <p class="mt-4 text-bone/70"><?= e(t('booking.confirm.body', ['email' => $customer['email'] ?? ''])) ?></p>
  <div class="mt-8 bg-ink/40 border border-white/10 rounded-xl p-6 text-left">
    <div class="text-xs uppercase tracking-widest text-gold mb-2"><?= e(t('booking.confirm.reference')) ?></div>
    <div class="font-mono text-sm break-all"><?= e($appt['id'] ?? '') ?></div>
    <?php if (!empty($appt['start_at'])): ?>
      <div class="mt-4 text-xs uppercase tracking-widest text-gold"><?= e(t('booking.review.datetime')) ?></div>
      <div class="text-lg"><?= e((new DateTimeImmutable($appt['start_at']))->format('l, F j · g:i A')) ?></div>
    <?php endif; ?>
  </div>
  <?php if ($form && !empty($form['resume_token'])): ?>
    <a href="<?= url('/intake/' . rawurlencode($form['resume_token'])) ?>" class="btn-gold mt-8 inline-block">
      <?= e(t('booking.confirm.continue_form')) ?>
    </a>
  <?php endif; ?>
  <div class="mt-4"><a href="<?= url('/') ?>" class="text-sm text-bone/50 hover:text-bone"><?= e(t('booking.confirm.back_home')) ?></a></div>
</section>
