{{-- resources/views/admin/data-staff/edit_profil.blade.php --}}
<div class="tab-pane fade show active" id="profil" role="tabpanel">
    <div class="row mb-4">
        <div class="col-lg-3 text-center mb-4 mb-lg-0 border-end pe-lg-4">
            <h6 class="fw-bold mb-3 text-primary border-bottom pb-2 text-start">Foto Profil</h6>
            
            <div class="mb-3 position-relative d-inline-block">
                <img src="{{ $staff->foto ? asset('storage/staff/' . $staff->foto) : 'https://ui-avatars.com/api/?name='.urlencode($staff->nama_lengkap).'&background=random&size=250' }}" 
                     id="preview-foto" 
                     class="img-thumbnail rounded-circle object-fit-cover shadow-sm" 
                     style="width: 180px; height: 180px; aspect-ratio: 1/1;"
                     alt="Foto Profil Staff">
            </div>

            <input type="hidden" name="foto_base64" id="foto_base64">
            <input type="file" class="d-none" id="foto_file_trigger" accept="image/*">

            <div class="d-grid gap-2 px-1">
                <button type="button" class="btn btn-sm btn-outline-primary" onclick="document.getElementById('foto_file_trigger').click()">
                    <i class="bi bi-folder2-open me-1"></i> Pilih Galeri
                </button>
                <button type="button" class="btn btn-sm btn-primary" id="btnBukaKamera">
                    <i class="bi bi-camera me-1"></i> Buka Kamera
                </button>
            </div>
            <div class="form-text mt-2" style="font-size: 11px;">Otomatis WebP. Max: 2MB.</div>
        </div>

        <div class="col-lg-9 ps-lg-4">
            <h6 class="fw-bold mb-3 text-primary border-bottom pb-2">Identitas Dasar Staff</h6>
            
            <div class="mb-3">
                <label class="form-label fw-medium">Nama Lengkap & Gelar <span class="text-danger">*</span></label>
                <input type="text" name="nama_lengkap" class="form-control fw-bold" value="{{ old('nama_lengkap', $staff->nama_lengkap) }}" required>
            </div>
            
            <div class="row mb-3">
                <div class="col-md-6 mb-3 mb-md-0">
                    <label class="form-label fw-medium">Tempat Lahir <span class="text-danger">*</span></label>
                    <input type="text" name="tempat_lahir" class="form-control" value="{{ old('tempat_lahir', $staff->tempat_lahir) }}" required>
                </div>
                <div class="col-md-6">
                    <label class="form-label fw-medium">Tanggal Lahir <span class="text-danger">*</span></label>
                    <input type="date" name="tanggal_lahir" class="form-control" value="{{ old('tanggal_lahir', $staff->tanggal_lahir) }}" required>
                </div>
            </div>

            <div class="row mb-3">
                <div class="col-md-6 mb-3 mb-md-0">
                    <label class="form-label fw-medium">Agama <span class="text-danger">*</span></label>
                    <input type="text" name="agama" class="form-control bg-light" value="{{ old('agama', $staff->agama ?? 'Islam') }}" readonly>
                </div>
                <div class="col-md-6">
                    <label class="form-label fw-medium">Jenis Kelamin <span class="text-danger">*</span></label>
                    <select name="jenis_kelamin" class="form-select" required>
                        <option value="L" {{ old('jenis_kelamin', $staff->jenis_kelamin) == 'L' ? 'selected' : '' }}>Laki-laki</option>
                        <option value="P" {{ old('jenis_kelamin', $staff->jenis_kelamin) == 'P' ? 'selected' : '' }}>Perempuan</option>
                    </select>
                </div>
            </div>

            <div class="row">
                <div class="col-md-6 mb-3 mb-md-0">
                    <label class="form-label fw-medium">NUPTK <span class="text-muted fw-normal" style="font-size: 12px;">(Opsional)</span></label>
                    <input type="text" name="nuptk" class="form-control" value="{{ old('nuptk', $staff->nuptk) }}">
                </div>
                <div class="col-md-6">
                    <label class="form-label fw-medium">Jenis PTK <span class="text-muted fw-normal" style="font-size: 12px;">(Opsional)</span></label>
                    <input type="text" name="jenis_ptk" class="form-control" value="{{ old('jenis_ptk', $staff->jenis_ptk) }}" placeholder="Cth: Tenaga Administrasi, Satpam">
                </div>
            </div>

        </div>
    </div>

    <hr class="my-4 border-secondary opacity-25">

    <div class="row mb-4">
        <div class="col-12">
            <h6 class="fw-bold mb-3 text-primary border-bottom pb-2">Data Registrasi & Pengangkatan Kepegawaian Madrasah</h6>
            
            <div class="row mb-3">
                <div class="col-md-4 mb-3 mb-md-0">
                    <label class="form-label fw-medium">No. SK Pengangkatan</label>
                    <input type="text" name="sk_pengangkatan" class="form-control" value="{{ old('sk_pengangkatan', $staff->sk_pengangkatan) }}">
                </div>
                <div class="col-md-4 mb-3 mb-md-0">
                    <label class="form-label fw-medium">TMT Pengangkatan (Masehi)</label>
                    <input type="date" name="tmt_pengangkatan" id="tmt_masehi" class="form-control border-success" value="{{ old('tmt_pengangkatan', $staff->tmt_pengangkatan) }}">
                </div>
                <div class="col-md-4">
                    <label class="form-label fw-medium">TMT Pengangkatan (Hijriyah)</label>
                    <input type="text" name="tmt_pengangkatan_hijriyah" id="tmt_hijriyah" class="form-control border-success" value="{{ old('tmt_pengangkatan_hijriyah', $staff->tmt_pengangkatan_hijriyah ?? '') }}" placeholder="Contoh: 1 Muharram 1445 H">
                </div>
            </div>
            
            <div class="mb-3">
                <label class="form-label fw-medium text-danger fw-bold">NIP (Nomor Induk Pegawai Khusus Madrasah)</label>
                <input type="text" name="nip" id="nip_madrasah" class="form-control fw-bold border-danger" value="{{ old('nip', $staff->nip) }}" placeholder="Isi/Edit NIP Madrasah di sini">
                <div class="form-text" style="font-size: 11px;">(Auto-Generate) Format Awal: Kode (44802) + Tahun Hijriyah + Urut. Dapat diedit manual jika SK ditemukan.</div>
            </div>

            <div class="mb-3">
                <label class="form-label fw-medium">Status Kepegawaian</label>
                <select name="status_kepegawaian" class="form-select">
                    <option value="">-- Pilih Status --</option>
                    <option value="Pegawai Tetap Yayasan" {{ old('status_kepegawaian', $staff->status_kepegawaian) == 'Pegawai Tetap Yayasan' ? 'selected' : '' }}>Pegawai Tetap Yayasan</option>
                    <option value="Pegawai Tidak Tetap Yayasan" {{ old('status_kepegawaian', $staff->status_kepegawaian) == 'Pegawai Tidak Tetap Yayasan' ? 'selected' : '' }}>Pegawai Tidak Tetap Yayasan</option>
                </select>
            </div>

            <div class="mb-3 p-3 bg-success bg-opacity-10 border border-success rounded">
                <label class="form-label fw-bold text-success mb-3">Tugas Tambahan (Jabatan di Madrasah)</label>
                @php
                    $selectedJabatans = $staff->jabatans ? $staff->jabatans->pluck('id')->toArray() : [];
                @endphp
                <div class="row g-2">
                    @foreach($jabatans as $jabatan)
                        <div class="col-md-4 col-sm-6">
                            <div class="form-check">
                                <input class="form-check-input border-success shadow-sm" type="checkbox" name="jabatan_ids[]" value="{{ $jabatan->id }}" id="jabatan_{{ $jabatan->id }}" {{ in_array($jabatan->id, old('jabatan_ids', $selectedJabatans)) ? 'checked' : '' }}>
                                <label class="form-check-label text-dark" for="jabatan_{{ $jabatan->id }}" style="font-size: 13px;">
                                    {{ $jabatan->nama_jabatan }}
                                </label>
                            </div>
                        </div>
                    @endforeach
                </div>
            </div>

            <div class="mb-3">
                <label class="form-label fw-medium">Lembaga Pengangkatan</label>
                <input type="text" name="lembaga_pengangkatan" class="form-control" value="{{ old('lembaga_pengangkatan', $staff->lembaga_pengangkatan) }}" placeholder="Cth: Yayasan / Kementerian Agama">
            </div>

            <div class="row">
                <div class="col-md-6 mb-3 mb-md-0">
                    <label class="form-label fw-medium">Pangkat Golongan</label>
                    <input type="text" name="pangkat_golongan" class="form-control" value="{{ old('pangkat_golongan', $staff->pangkat_golongan) }}" placeholder="Isi jika PNS/Inpassing">
                </div>
                <div class="col-md-6">
                    <label class="form-label fw-medium">Sumber Gaji</label>
                    <input type="text" name="sumber_gaji" class="form-control" value="{{ old('sumber_gaji', $staff->sumber_gaji) }}" placeholder="Cth: Yayasan / APBN">
                </div>
            </div>

        </div>
    </div>

    <div class="row">
        <div class="col-12">
            <div class="p-4 bg-light rounded border border-primary" style="--bs-border-opacity: .2;">
                <h6 class="fw-bold mb-3 text-primary border-bottom border-primary pb-2 d-inline-block">Status Kepegawaian Negeri & Kartu Identitas (PNS)</h6>
                
                <div class="row mb-3">
                    <div class="col-md-4 mb-3 mb-md-0">
                        <label class="form-label fw-medium">SK CPNS</label>
                        <input type="text" name="sk_cpns" class="form-control" value="{{ old('sk_cpns', $staff->sk_cpns) }}">
                    </div>
                    <div class="col-md-4 mb-3 mb-md-0">
                        <label class="form-label fw-medium">Tanggal CPNS</label>
                        <input type="date" name="tanggal_cpns" class="form-control" value="{{ old('tanggal_cpns', $staff->tanggal_cpns) }}">
                    </div>
                    <div class="col-md-4">
                        <label class="form-label fw-medium">TMT PNS</label>
                        <input type="date" name="tmt_pns" class="form-control" value="{{ old('tmt_pns', $staff->tmt_pns) }}">
                    </div>
                </div>
                
                <div class="row">
                    <div class="col-md-4 mb-3 mb-md-0">
                        <label class="form-label fw-medium">Karpeg</label>
                        <input type="text" name="karpeg" class="form-control" value="{{ old('karpeg', $staff->karpeg) }}">
                    </div>
                    <div class="col-md-4 mb-3 mb-md-0">
                        <label class="form-label fw-medium">Karis/Karsu</label>
                        <input type="text" name="karis_karsu" class="form-control" value="{{ old('karis_karsu', $staff->karis_karsu) }}">
                    </div>
                    <div class="col-md-4">
                        <label class="form-label fw-medium">NUKS</label>
                        <input type="text" name="nuks" class="form-control" value="{{ old('nuks', $staff->nuks) }}">
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>