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

<style>
.status-card {
    border-radius: 18px;
    overflow: hidden;
}
.status-icon {
    font-size: 48px;
}
.timeline {
    position: relative;
    margin-left: 20px;
}
.timeline::before {
    content: '';
    position: absolute;
    left: 8px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: #dee2e6;
}
.timeline-item {
    position: relative;
    padding-left: 30px;
    margin-bottom: 20px;
}
.timeline-item::before {
    content: '';
    position: absolute;
    left: 0;
    top: 4px;
    width: 16px;
    height: 16px;
    background: #0d6efd;
    border-radius: 50%;
}
</style>

<div class="container py-5">
    <div class="row justify-content-center">
        <div class="col-md-6">

            <!-- FORM CEK STATUS -->
            <div class="card shadow status-card mb-4">
                <div class="card-header bg-primary text-white text-center">
                    <h5 class="mb-0">
                        <i class="fas fa-search me-2"></i>Cek Status PPDB
                    </h5>
                </div>

                <div class="card-body p-4">
                    <form method="get">
                        <div class="mb-3">
                            <label class="form-label fw-bold">No Pendaftaran / NISN</label>
                            <input type="text"
                                   name="keyword"
                                   value="<?= esc($keyword ?? '') ?>"
                                   class="form-control form-control-lg"
                                   placeholder="Contoh: PPDB-2025-0001"
                                   required>
                        </div>

                        <button class="btn btn-primary w-100 btn-lg">
                            <i class="fas fa-search me-1"></i> Cek Status
                        </button>
                    </form>
                </div>
            </div>

            <!-- HASIL -->
            <?php if(isset($record)): ?>
                <div class="card shadow status-card">
                    <div class="card-body p-4 text-center">

                        <?php
                        $map = [
                            'PENDING'  => ['warning','clock','Menunggu Verifikasi'],
                            'APPROVED' => ['success','check-circle','DITERIMA'],
                            'REJECTED' => ['danger','times-circle','DITOLAK']
                        ];
                        [$color,$icon,$label] = $map[$record['status']];
                        ?>

                        <div class="status-icon text-<?= $color ?> mb-2">
                            <i class="fas fa-<?= $icon ?>"></i>
                        </div>

                        <h4 class="fw-bold"><?= $label ?></h4>
                        <span class="badge bg-<?= $color ?> mb-3">
                            <?= $record['status'] ?>
                        </span>

                        <hr>

                        <table class="table table-sm text-start">
                            <tr><th>No Pendaftaran</th><td><?= $record['reg_no'] ?></td></tr>
                            <tr><th>Nama</th><td><?= $record['name'] ?></td></tr>
                            <tr><th>NISN</th><td><?= $record['nisn'] ?></td></tr>
                            <tr><th>Asal Sekolah</th><td><?= $record['school_origin'] ?></td></tr>
                        </table>

                        <?php if($record['status']=='APPROVED'): ?>
                            <a href="<?= site_url('ppdb/print/'.$record['id']) ?>"
                               target="_blank"
                               class="btn btn-success mt-2">
                                <i class="fas fa-print me-1"></i> Cetak Bukti
                            </a>
                        <?php endif; ?>

                    </div>
                </div>

            <?php elseif(isset($keyword)): ?>
                <div class="alert alert-danger text-center">
                    <i class="fas fa-exclamation-circle me-1"></i>
                    Data tidak ditemukan
                </div>
            <?php endif; ?>

        </div>
    </div>
</div>

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