<?php
// $crud and $hijri are available via index.php context
$hijriYear = date('Y'); // fallback to Gregorian year
if (isset($_SESSION['hijri']) && !empty($_SESSION['hijri'])) {
    $hijriDt = new DateTime($_SESSION['hijri']);
    $hijriYear = (int) $hijriDt->format('Y');
}
$hijriYearEnd = $hijriYear + 1;
?>
<div id="stdListContent" dir="rtl" class="p-2">

    <!-- Filter Card -->
    <div class="card border-0 shadow-sm rounded-4 overflow-hidden mb-4">
        <div class="card-header bg-primary bg-opacity-10 border-0 py-3 px-4">
            <h5 class="mb-0 fw-bold text-primary d-flex align-items-center justify-content-start urdu-regular fs-4">
                <i class="bi bi-people-fill ms-2"></i> رجسٹرڈ طلباء کی فہرست
            </h5>
        </div>
        <div class="card-body p-4 bg-white">
            <div class="row g-4 text-end">

                <!-- Darja -->
                <div class="col-md-4">
                    <label class="form-label fw-bold urdu-regular fs-5" for="rpt_darja">درجہ منتخب کریں</label>
                    <div class="input-group input-group-lg shadow-sm rounded-3 overflow-hidden" dir="ltr">
                        <span class="input-group-text bg-light border-0 text-primary"><i
                                class="bi bi-journal-bookmark"></i></span>
                        <?php $crud->darjaatCmb('rpt_darja', '', 'form-select border-0 text-end urdu-regular'); ?>
                    </div>
                </div>

                <!-- Date Start -->
                <div class="col-md-4">
                    <label class="form-label fw-bold urdu-regular fs-5" for="rpt_date_start">تاریخ ابتداء (سال)</label>
                    <div class="input-group input-group-lg shadow-sm rounded-3 overflow-hidden" dir="ltr">
                        <span class="input-group-text bg-light border-0 text-primary"><i
                                class="bi bi-calendar-event"></i></span>
                        <input type="number" id="rpt_date_start" class="form-control border-0 text-end"
                            value="<?php echo $hijriYear; ?>">
                    </div>
                </div>

                <!-- Date End -->
                <div class="col-md-4">
                    <label class="form-label fw-bold urdu-regular fs-5" for="rpt_date_end">تاریخ انتہاء (سال)</label>
                    <div class="input-group input-group-lg shadow-sm rounded-3 overflow-hidden" dir="ltr">
                        <span class="input-group-text bg-light border-0 text-primary"><i
                                class="bi bi-calendar-check"></i></span>
                        <input type="number" id="rpt_date_end" class="form-control border-0 text-end"
                            value="<?php echo $hijriYearEnd; ?>">
                    </div>
                </div>
            </div>

            <!-- Action Buttons -->
            <div class="row mt-4">
                <div class="col-12 d-flex justify-content-end gap-3">
                    <button type="button" id="btnPrintReport"
                        class="btn btn-outline-secondary px-4 py-2 rounded-3 urdu-regular fs-5 d-none">
                        <i class="bi bi-printer ms-2"></i> پرنٹ
                    </button>
                    <button type="button" id="btnShowReport"
                        class="btn btn-primary px-5 py-2 rounded-3 urdu-regular fs-5">
                        <i class="bi bi-search ms-2"></i> رپورٹ دکھائیں
                    </button>
                </div>
            </div>
        </div>
    </div>

    <!-- Results Container -->
    <div id="rpt-results" class="mt-2"></div>

</div>

<style>
    #stdListContent .input-group {
        flex-direction: row-reverse;
    }

    #stdListContent .form-select {
        background-position: left 0.75rem center;
        padding-left: 2.5rem;
        padding-right: 1rem;
    }

    #stdListContent .card {
        border: 1px solid rgba(13, 110, 253, 0.08) !important;
    }

    @media print {
        body * {
            visibility: hidden;
        }

        #rpt-print-area,
        #rpt-print-area * {
            visibility: visible;
        }

        #rpt-print-area {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
        }

        .no-print {
            display: none !important;
        }
    }
</style>

<!-- Page Specific JS -->
<script src="assets/js/rpt_stdList.js"></script>