<div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:20px">
  <div>
    <h2 style="font-size:1.2rem;font-weight:700">Daftar Laporan Masyarakat</h2>
    <p class="text-muted text-sm">Kelurahan: <strong><?= e(Auth::user()['kelurahan_nama'] ?? '-') ?></strong></p>
  </div>
  <a href="<?= APP_URL ?>/verifikator/warga/tambah" class="btn btn-primary">➕ Input Manual Warga</a>
</div>

<!-- Filter Status -->
<div class="tabs">
  <?php $statuses = ['semua'=>'Semua','menunggu'=>'⏳ Menunggu','diproses'=>'🔄 Diproses','terverifikasi'=>'✅ Terverifikasi','ditolak'=>'❌ Ditolak']; ?>
  <?php foreach ($statuses as $s => $l): ?>
  <a href="?status=<?= $s ?>" class="tab-btn <?= ($status === $s) ? 'active' : '' ?>"><?= $l ?></a>
  <?php endforeach; ?>
</div>

<!-- SEARCH -->
<div class="filters-bar">
  <input type="text" id="search-lap" class="form-control" placeholder="🔍 Cari nama warga, kode laporan..." style="max-width:320px">
</div>

<!-- TABLE -->
<div class="card">
  <div class="card-body no-pad">
    <div class="table-wrap">
      <table id="table-laporan">
        <thead>
          <tr><th>Kode</th><th>Nama Warga</th><th>Pelapor</th><th>Alamat</th><th>Status</th><th>Tanggal</th><th>Aksi</th></tr>
        </thead>
        <tbody>
          <?php foreach ($data as $l): ?>
          <tr>
            <td><code style="font-size:0.78rem;background:#f1f5f9;padding:2px 6px;border-radius:4px"><?= e($l['kode_laporan']) ?></code></td>
            <td>
              <div style="font-weight:600"><?= e($l['nama_warga']) ?></div>
              <div class="text-xs text-muted"><?= e($l['alamat_warga']) ?></div>
            </td>
            <td class="text-sm">
              <?= e($l['nama_pelapor']) ?>
              <?php if ($l['no_hp_pelapor']): ?>
              <div class="text-xs text-muted"><?= e($l['no_hp_pelapor']) ?></div>
              <?php endif; ?>
            </td>
            <td class="text-sm"><?= e($l['kelurahan'] ?? '') ?></td>
            <td>
              <?php $badgeMap = ['menunggu'=>'badge-yellow','diproses'=>'badge-blue','terverifikasi'=>'badge-green','ditolak'=>'badge-red']; ?>
              <span class="badge <?= $badgeMap[$l['status']] ?? 'badge-gray' ?>"><?= ucfirst($l['status']) ?></span>
            </td>
            <td class="text-xs text-muted"><?= formatTanggal($l['created_at']) ?></td>
            <td>
              <a href="<?= APP_URL ?>/verifikator/laporan/<?= $l['id'] ?>" class="btn btn-primary btn-sm">Detail</a>
            </td>
          </tr>
          <?php endforeach; ?>
        </tbody>
      </table>
    </div>
    <?php if (empty($data)): ?>
    <div class="empty-state"><div class="empty-state-icon">📭</div><h3>Tidak ada laporan</h3><p>Belum ada laporan dengan status ini</p></div>
    <?php endif; ?>
  </div>
</div>

<script>document.addEventListener('DOMContentLoaded', () => App.initTableSearch('search-lap', 'table-laporan'));</script>
