<?= $this->extend('layout/management_layout') ?>
<?= $this->section('content') ?>

<div class="container my-4">
  <div class="d-flex justify-content-between align-items-center mb-3 flex-wrap gap-2">
    <h2 class="mb-0">Parent Contacts</h2>
    <div class="d-flex align-items-center gap-2">
      <?php if (!empty($schoolYear)): ?>
        <span class="badge bg-primary">School Year: <?= esc($schoolYear) ?></span>
      <?php endif; ?>
      <?php if (!empty($semester)): ?>
        <span class="badge bg-info text-dark">Semester: <?= esc($semester) ?></span>
      <?php endif; ?>
      <a href="<?= site_url('whatsapp') ?>" class="btn btn-outline-secondary btn-sm">
        Back
      </a>
    </div>
  </div>

  <?php if (empty($contacts)): ?>
    <div class="alert alert-warning">No parent contacts found for the selected term.</div>
  <?php else: ?>
    <div class="card shadow-sm">
      <div class="card-body">
        <div class="table-responsive">
          <table class="table table-striped table-hover align-middle" id="parentContactsTable">
            <thead class="table-light">
              <tr>
                <th style="width: 14rem;">Name</th>
                <th style="width: 10rem;">Type</th>
                <th style="width: 14rem;">Phone</th>
                <th style="width: 18rem;">Email</th>
              </tr>
            </thead>
            <tbody>
              <?php foreach ($contacts as $row): ?>
                <tr>
                  <td><?= esc(trim(($row['lastname'] ?? '') . ', ' . ($row['firstname'] ?? ''))) ?></td>
                  <td>
                    <span class="badge <?= ($row['type'] === 'Second Parent') ? 'bg-secondary' : 'bg-success' ?>">
                      <?= esc($row['type']) ?>
                    </span>
                  </td>
                  <td>
                    <?php if (!empty($row['phone'])): ?>
                      <a href="tel:<?= esc(preg_replace('/\D+/', '', $row['phone'])) ?>">
                        <?= esc($row['phone']) ?>
                      </a>
                    <?php else: ?>
                      <span class="text-muted">—</span>
                    <?php endif; ?>
                  </td>
                  <td>
                    <?php if (!empty($row['email'])): ?>
                      <a href="mailto:<?= esc($row['email']) ?>"><?= esc($row['email']) ?></a>
                    <?php else: ?>
                      <span class="text-muted">—</span>
                    <?php endif; ?>
                  </td>
                </tr>
              <?php endforeach; ?>
            </tbody>
          </table>
        </div>

        <div class="small text-muted mt-2">
          Tip: Click a phone to dial, email to compose.
        </div>
      </div>
    </div>
  <?php endif; ?>
</div>

<?= $this->endSection() ?>

<?= $this->section('scripts') ?>
<script>
  // If you use DataTables elsewhere, init it the same way here:
  // $('#parentContactsTable').DataTable();
</script>
<?= $this->endSection() ?>
