<?= $this->extend('layouts/admin') ?>

<?= $this->section('admin_content') ?>
<!-- Inquiries Table Card -->
<div class="bg-white border border-gold/15 rounded-2xl shadow-sm overflow-hidden">
  <div class="p-6 border-b border-gray-100 flex justify-between items-center bg-gold-light/20">
    <h2 class="text-base font-bold text-charcoal flex items-center gap-2">
      <i data-lucide="inbox" class="w-5 h-5 text-saffron"></i>
      Booking & Quote Inquiries
    </h2>
    <span class="text-xs bg-saffron-light text-saffron font-bold px-3 py-1 rounded-full border border-saffron/10">
      Total Inquiries: <?= count($inquiries) ?>
    </span>
  </div>

  <div class="overflow-x-auto">
    <table class="w-full text-left border-collapse text-sm">
      <thead>
        <tr class="border-b border-gray-100 text-charcoal-muted font-semibold bg-gray-50/50">
          <th class="py-4 px-6">ID</th>
          <th class="py-4 px-6">Customer Details</th>
          <th class="py-4 px-6">Event Details</th>
          <th class="py-4 px-6">Inquiry Message / Notes</th>
          <th class="py-4 px-6">Date Received</th>
          <th class="py-4 px-6 text-right">Actions</th>
        </tr>
      </thead>
      <tbody>
        <?php if (empty($inquiries)): ?>
          <tr>
            <td colspan="6" class="py-12 px-6 text-center text-charcoal-muted font-light">
              No inquiries found. When customers submit forms on the site, they will appear here.
            </td>
          </tr>
        <?php else: ?>
          <?php foreach ($inquiries as $inq): ?>
            <tr class="border-b border-gray-100 hover:bg-gray-50/35 transition-all duration-150 items-start">
              <!-- ID -->
              <td class="py-4 px-6 text-charcoal-muted font-mono text-xs">
                #<?= $inq['id'] ?>
              </td>

              <!-- Customer Info -->
              <td class="py-4 px-6">
                <div class="font-bold text-charcoal text-sm"><?= esc($inq['name']) ?></div>
                <div class="text-xs text-charcoal-muted flex flex-col gap-1 mt-1.5 font-light">
                  <span class="flex items-center gap-1.5 hover:text-saffron transition-colors">
                    <i data-lucide="phone" class="w-3.5 h-3.5 text-gold-dark"></i> 
                    <a href="tel:<?= esc($inq['phone']) ?>"><?= esc($inq['phone']) ?></a>
                  </span>
                  <span class="flex items-center gap-1.5 hover:text-saffron transition-colors">
                    <i data-lucide="mail" class="w-3.5 h-3.5 text-gold-dark"></i> 
                    <a href="mailto:<?= esc($inq['email']) ?>"><?= esc($inq['email']) ?></a>
                  </span>
                </div>
              </td>

              <!-- Event Info -->
              <td class="py-4 px-6">
                <div class="flex flex-col gap-1.5">
                  <span class="self-start inline-block px-2.5 py-0.5 text-[10px] font-bold rounded-full bg-saffron-light text-saffron uppercase tracking-wider">
                    <?= esc($inq['event_type']) ?>
                  </span>
                  <div class="text-xs text-charcoal-light font-medium flex items-center gap-1">
                    <i data-lucide="calendar" class="w-3.5 h-3.5 text-charcoal-muted"></i>
                    <?= date('d M Y', strtotime($inq['event_date'])) ?>
                  </div>
                  <div class="text-xs text-charcoal-muted flex items-center gap-1 font-light">
                    <i data-lucide="users" class="w-3.5 h-3.5 text-charcoal-muted"></i>
                    Guests: <?= esc($inq['guests']) ?>
                  </div>
                </div>
              </td>

              <!-- Message/Notes -->
              <td class="py-4 px-6 max-w-sm">
                <?php if (empty($inq['message'])): ?>
                  <span class="text-charcoal-muted italic font-light text-xs">No message provided.</span>
                <?php else: ?>
                  <div class="bg-gold-light/20 border border-gold/10 rounded-xl p-3 text-xs text-charcoal-light font-light leading-relaxed whitespace-pre-line max-h-40 overflow-y-auto">
                    <?= esc($inq['message']) ?>
                  </div>
                <?php endif; ?>
              </td>

              <!-- Created At -->
              <td class="py-4 px-6 text-charcoal-muted font-light text-xs">
                <?= date('d M Y h:i A', strtotime($inq['created_at'])) ?>
              </td>

              <!-- Delete Action -->
              <td class="py-4 px-6 text-right">
                <form action="<?= base_url('admin/inquiries/delete/' . $inq['id']) ?>" method="POST" onsubmit="return confirm('Are you sure you want to delete this inquiry permanently?');" class="inline">
                  <button type="submit" class="text-red-500 hover:text-white hover:bg-red-500 border border-red-200 hover:border-red-500 p-2 rounded-xl transition-all" title="Delete Inquiry">
                    <i data-lucide="trash-2" class="w-4 h-4"></i>
                  </button>
                </form>
              </td>
            </tr>
          <?php endforeach; ?>
        <?php endif; ?>
      </tbody>
    </table>
  </div>
</div>
<?= $this->endSection() ?>
