<?= $this->extend('layouts/main') ?>
<?= $this->section('content') ?>

<div class="row justify-content-center">
    <div class="col-lg-8">
        <div class="card border-0 shadow-sm" style="border-radius: 12px;">
            <div class="card-header bg-white border-0 pt-4 px-4 pb-2">
                <div class="d-flex align-items-center gap-2">
                    <a href="/siswa/counseling" class="btn btn-light btn-sm text-secondary px-2 py-1.5" style="border-radius: 6px;">
                        <i class="bi bi-chevron-left"></i> Kembali
                    </a>
                    <h5 class="fw-bold text-dark mb-0">Buat Pengaduan / Konseling Baru</h5>
                </div>
                <small class="text-muted d-block mt-2">Isi formulir di bawah ini dengan lengkap untuk memulai percakapan bimbingan dengan Guru.</small>
            </div>
            
            <div class="card-body px-4 pb-4">
                <?php if (session()->getFlashdata('errors')): ?>
                    <div class="alert alert-danger border-0 small mb-3" style="border-radius: 8px;">
                        <ul class="mb-0">
                            <?php foreach (session()->getFlashdata('errors') as $error): ?>
                                <li><?= esc($error) ?></li>
                            <?php endforeach; ?>
                        </ul>
                    </div>
                <?php endif; ?>

                <form action="/siswa/counseling/store" method="POST" class="needs-validation">
                    <?= csrf_field() ?>

                    <!-- Pilih Tipe -->
                    <div class="mb-3">
                        <label class="form-label fw-bold text-dark">Tipe Layanan</label>
                        <div class="row g-2">
                            <div class="col-6">
                                <input type="radio" class="btn-check" name="type" id="type_counseling" value="konseling" checked>
                                <label class="btn btn-outline-primary w-100 py-3 d-flex flex-column align-items-center gap-2" for="type_counseling" style="border-radius: 10px;">
                                    <i class="bi bi-person-hearts fs-4"></i>
                                    <span class="fw-bold">Konseling / Curhat Pribadi</span>
                                </label>
                            </div>
                            <div class="col-6">
                                <input type="radio" class="btn-check" name="type" id="type_complaint" value="pengaduan">
                                <label class="btn btn-outline-primary w-100 py-3 d-flex flex-column align-items-center gap-2" for="type_complaint" style="border-radius: 10px;">
                                    <i class="bi bi-megaphone fs-4"></i>
                                    <span class="fw-bold">Pengaduan / Laporan Umum</span>
                                </label>
                            </div>
                        </div>
                    </div>

                    <!-- Pilih Guru -->
                    <div class="mb-3">
                        <label for="assigned_teacher_id" class="form-label fw-bold text-dark">Tujuan Guru Bimbingan / Penerima</label>
                        <select name="assigned_teacher_id" id="assigned_teacher_id" class="form-select search-select" required style="border-radius: 8px; padding: 0.6rem 1rem;">
                            <option value="" disabled selected>-- Cari dan Pilih Nama Guru --</option>
                            <?php foreach ($teachers as $t): ?>
                                <option value="<?= $t['id'] ?>" <?= old('assigned_teacher_id') == $t['id'] ? 'selected' : '' ?>>
                                    <?= esc($t['name']) ?>
                                </option>
                            <?php endforeach; ?>
                        </select>
                        <small class="text-muted fs-7">Siswa bebas memilih guru manapun yang dipercaya, baik Wali Kelas, Guru BK, Kepala Sekolah, maupun Guru Mata Pelajaran.</small>
                    </div>

                    <!-- Kategori -->
                    <div class="mb-3">
                        <label for="category" class="form-label fw-bold text-dark">Kategori Laporan/Bimbingan</label>
                        <select name="category" id="category" class="form-select" required style="border-radius: 8px; padding: 0.6rem 1rem;">
                            <option value="pribadi" <?= old('category') === 'pribadi' ? 'selected' : '' ?>>Pribadi (Masalah Keluarga/Kesehatan Mental/Pribadi)</option>
                            <option value="akademik" <?= old('category') === 'akademik' ? 'selected' : '' ?>>Akademik (Kesulitan Belajar/Nilai/Tugas)</option>
                            <option value="sarpras" <?= old('category') === 'sarpras' ? 'selected' : '' ?>>Sarana Prasarana (Kerusakan Fasilitas Sekolah)</option>
                            <option value="bullying" <?= old('category') === 'bullying' ? 'selected' : '' ?>>Keamanan (Bullying/Pelecehan/Intimidasi/Kekerasan)</option>
                            <option value="karir" <?= old('category') === 'karir' ? 'selected' : '' ?>>Konsultasi Rencana Pendidikan Selanjutnya (Kuliah / Kerja)</option>
                            <option value="lainnya" <?= old('category') === 'lainnya' ? 'selected' : '' ?>>Lainnya</option>
                        </select>
                    </div>

                    <!-- Subjek -->
                    <div class="mb-3">
                        <label for="subject" class="form-label fw-bold text-dark">Subjek / Topik Utama</label>
                        <input type="text" name="subject" id="subject" class="form-control" placeholder="Contoh: Kesulitan belajar mata pelajaran Fisika" value="<?= old('subject') ?>" required minlength="5" maxlength="255" style="border-radius: 8px; padding: 0.6rem 1rem;">
                    </div>

                    <!-- Kirim Secara Anonim -->
                    <div class="mb-3">
                        <div class="form-check form-switch bg-light p-3 rounded" style="border-radius: 8px;">
                            <input class="form-check-input ms-0 me-2" type="checkbox" name="is_anonymous" id="is_anonymous" value="1" <?= old('is_anonymous') ? 'checked' : '' ?>>
                            <label class="form-check-label fw-bold text-danger" for="is_anonymous">Kirim sebagai Anonim (Sembunyikan Nama Saya)</label>
                            <small class="text-muted d-block mt-1">Jika diaktifkan, nama asli Anda tidak akan ditampilkan kepada Guru penerima untuk melindungi privasi Anda. Namun, sistem sekolah tetap mencatat keluhan Anda untuk ditindaklanjuti.</small>
                        </div>
                    </div>

                    <!-- Isi Pesan Pertama -->
                    <div class="mb-4">
                        <label for="message" class="form-label fw-bold text-dark">Pesan / Penjelasan Detail Keluhan</label>
                        <textarea name="message" id="message" rows="5" class="form-control" placeholder="Tuliskan keluhan atau hal yang ingin dikonsultasikan secara detail di sini..." required minlength="5" style="border-radius: 8px;"></textarea>
                    </div>

                    <!-- Tombol Kirim -->
                    <button type="submit" class="btn btn-primary w-100 py-2.5 fw-bold" style="border-radius: 8px; font-size: 1rem;">
                        <i class="bi bi-send-fill me-2"></i>Kirim Aduan / Konseling
                    </button>
                </form>
            </div>
        </div>
    </div>
</div>

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