@extends('layouts.admin')
@section('title', 'Tambah Siswa')
@section('page-title', 'Tambah Siswa')
@section('admin-content')
<x-card title="Form Siswa" subtitle="Akun login siswa otomatis memakai NIS (bukan username terpisah).">
<form action="{{ route('admin.siswa.store') }}" method="POST" class="grid grid-cols-1 gap-4 md:grid-cols-2">
    @csrf
    <x-input name="nis" label="NIS" required />
    <x-input name="nama_lengkap" label="Nama Lengkap" required />

    <div>
        <label class="mb-1 block text-sm font-semibold text-slate-700">Jenis Kelamin</label>
        <select name="jenis_kelamin" class="w-full rounded-xl border border-slate-200 bg-white px-3 py-2.5 text-sm shadow-sm outline-none transition focus:border-brand-400 focus:ring-4 focus:ring-brand-200">
            <option value="L" {{ old('jenis_kelamin')=='L'?'selected':'' }}>Laki-laki</option>
            <option value="P" {{ old('jenis_kelamin')=='P'?'selected':'' }}>Perempuan</option>
        </select>
    </div>

    <div>
        <label class="mb-1 block text-sm font-semibold text-slate-700">Kelas</label>
        <select name="kelas_id" class="w-full rounded-xl border border-slate-200 bg-white px-3 py-2.5 text-sm shadow-sm outline-none transition focus:border-brand-400 focus:ring-4 focus:ring-brand-200" required>
            @foreach($kelasList as $k)
                <option value="{{ $k->id }}" {{ old('kelas_id')==$k->id?'selected':'' }}>{{ $k->tingkat }} - {{ $k->nama_kelas }}</option>
            @endforeach
        </select>
    </div>

    <div class="md:col-span-2 my-2 border-t border-slate-200 pt-4"></div>
    <p class="md:col-span-2 text-sm text-slate-600">Login siswa menggunakan <strong>NIS</strong> yang sama dengan kolom di atas.</p>

    <x-input name="password" label="Password" type="password" required />
    <x-input name="password_confirmation" label="Konfirmasi Password" type="password" required />

    <div class="md:col-span-2 mt-2 flex flex-wrap gap-2">
        <x-button type="submit" variant="secondary">Simpan</x-button>
        <x-button href="{{ route('admin.siswa.index') }}" variant="ghost">Batal</x-button>
    </div>
</form>
</x-card>
@endsection