<?= $this->extend('layout/template') ?>

<?= $this->section('content') ?>
<style>
    .card-settings {
        border: none;
        border-radius: 20px;
        box-shadow: 0 10px 40px rgba(0,0,0,0.05);
        background: #fff;
        overflow: hidden;
    }
    .card-header-custom {
        background: linear-gradient(135deg, #435ebe 0%, #25396f 100%);
        padding: 20px 30px;
        color: white;
    }
    .time-input-group {
        background: #f8f9fa;
        padding: 15px;
        border-radius: 15px;
        border: 1px solid #eef2f7;
        transition: all 0.3s;
    }
    .time-input-group:hover {
        border-color: #435ebe;
        box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    }
    .section-title {
        font-weight: 800;
        color: #435ebe;
        margin-bottom: 15px;
        display: flex;
        align-items: center;
        gap: 10px;
    }
    .form-label {
        font-size: 0.85rem;
        font-weight: 700;
        color: #607080;
    }
    .form-control {
        border-radius: 10px;
    }
    .btn-save {
        background: linear-gradient(90deg, #435ebe, #25396f);
        border: none;
        border-radius: 12px;
        padding: 12px 30px;
        font-weight: 600;
        box-shadow: 0 4px 15px rgba(67, 94, 190, 0.3);
        color: white;
        transition: all 0.3s;
    }
    .btn-save:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 25px rgba(67, 94, 190, 0.4);
        color: white;
    }
</style>

<div class="page-heading">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <div>
            <h3 class="mb-1 text-primary fw-bold">Setting Jam Absensi</h3>
            <p class="text-subtitle text-muted">Atur rentang waktu masuk dan pulang untuk Guru dan Siswa.</p>
        </div>
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb mb-0">
                <li class="breadcrumb-item"><a href="<?= base_url('admin/dashboard') ?>">Dashboard</a></li>
                <li class="breadcrumb-item active" aria-current="page">Setting Jam</li>
            </ol>
        </nav>
    </div>
</div>

<div class="page-content">
    <?php if (session()->getFlashdata('success')) : ?>
        <div class="alert alert-success alert-dismissible fade show shadow-sm border-0 mb-4" role="alert">
            <i class="bi bi-check-circle-fill me-2"></i> <?= session()->getFlashdata('success') ?>
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
        </div>
    <?php endif; ?>

    <form action="<?= base_url('admin/setting-jam/update') ?>" method="post">
        <?= csrf_field() ?>
        
        <div class="row">
            <!-- Setting Guru -->
            <div class="col-12 col-md-6 mb-4">
                <div class="card card-settings h-100">
                    <div class="card-header-custom">
                        <h5 class="text-white mb-0"><i class="bi bi-person-video3 me-2"></i> Pengaturan Guru</h5>
                    </div>
                    <div class="card-body p-4">
                        <div class="section-title"><i class="bi bi-box-arrow-in-right"></i> Jam Masuk</div>
                        <div class="time-input-group mb-4">
                            <div class="row">
                                <div class="col-6">
                                    <label class="form-label">Mulai Absen</label>
                                    <input type="time" name="guru_masuk_mulai" class="form-control" value="<?= isset($guru['jam_masuk_mulai']) ? $guru['jam_masuk_mulai'] : '' ?>" required>
                                </div>
                                <div class="col-6">
                                    <label class="form-label text-danger">Batas Terlambat</label>
                                    <input type="time" name="guru_masuk_akhir" class="form-control border-danger" value="<?= isset($guru['jam_masuk_akhir']) ? $guru['jam_masuk_akhir'] : '' ?>" required>
                                </div>
                            </div>
                            <small class="text-muted d-block mt-2 fst-italic">*Absen setelah batas akhir akan tercatat "Terlambat".</small>
                        </div>

                        <div class="section-title text-success"><i class="bi bi-box-arrow-left"></i> Jam Pulang</div>
                        <div class="time-input-group">
                            <div class="row">
                                <div class="col-6">
                                    <label class="form-label text-warning">Batas Cepat Pulang</label>
                                    <input type="time" name="guru_pulang_mulai" class="form-control border-warning" value="<?= isset($guru['jam_pulang_mulai']) ? $guru['jam_pulang_mulai'] : '' ?>" required>
                                </div>
                                <div class="col-6">
                                    <label class="form-label">Akhir Absen</label>
                                    <input type="time" name="guru_pulang_akhir" class="form-control" value="<?= isset($guru['jam_pulang_akhir']) ? $guru['jam_pulang_akhir'] : '' ?>" required>
                                </div>
                            </div>
                            <small class="text-muted d-block mt-2 fst-italic">*Pulang sebelum batas awal akan tercatat "Cepat Pulang".</small>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Setting Siswa -->
            <div class="col-12 col-md-6 mb-4">
                <div class="card card-settings h-100">
                    <div class="card-header-custom bg-gradient-info" style="background: linear-gradient(135deg, #11998e 0%, #38ef7d 100%);">
                        <h5 class="text-white mb-0"><i class="bi bi-backpack me-2"></i> Pengaturan Siswa</h5>
                    </div>
                    <div class="card-body p-4">
                        <div class="section-title"><i class="bi bi-box-arrow-in-right"></i> Jam Masuk</div>
                        <div class="time-input-group mb-4">
                            <div class="row">
                                <div class="col-6">
                                    <label class="form-label">Mulai Absen</label>
                                    <input type="time" name="siswa_masuk_mulai" class="form-control" value="<?= isset($siswa['jam_masuk_mulai']) ? $siswa['jam_masuk_mulai'] : '' ?>" required>
                                </div>
                                <div class="col-6">
                                    <label class="form-label text-danger">Batas Terlambat</label>
                                    <input type="time" name="siswa_masuk_akhir" class="form-control border-danger" value="<?= isset($siswa['jam_masuk_akhir']) ? $siswa['jam_masuk_akhir'] : '' ?>" required>
                                </div>
                            </div>
                        </div>

                        <div class="section-title text-success"><i class="bi bi-box-arrow-left"></i> Jam Pulang</div>
                        <div class="time-input-group">
                            <div class="row">
                                <div class="col-6">
                                    <label class="form-label text-warning">Batas Cepat Pulang</label>
                                    <input type="time" name="siswa_pulang_mulai" class="form-control border-warning" value="<?= isset($siswa['jam_pulang_mulai']) ? $siswa['jam_pulang_mulai'] : '' ?>" required>
                                </div>
                                <div class="col-6">
                                    <label class="form-label">Akhir Absen</label>
                                    <input type="time" name="siswa_pulang_akhir" class="form-control" value="<?= isset($siswa['jam_pulang_akhir']) ? $siswa['jam_pulang_akhir'] : '' ?>" required>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-12 text-end">
                <button type="submit" class="btn btn-save">
                    <i class="bi bi-save me-2"></i> Simpan Perubahan
                </button>
            </div>
        </div>
    </form>
</div>
<?= $this->endSection() ?>