<section>
    <header>
        <h2 class="h5 fw-bold">
            {{ __('Informasi Profil') }}
        </h2>

        <p class="mt-1 text-muted small">
            {{ __("Perbarui informasi profil dan alamat email akun Anda.") }}
        </p>
    </header>

    <form id="send-verification" method="post" action="{{ route('verification.send') }}">
        @csrf
    </form>

    <form method="post" action="{{ route('profile.update') }}" class="mt-4">
        @csrf
        @method('patch')

        {{-- Bagian Nama Lengkap --}}
        <div class="mb-3">
            <label for="name" class="form-label">{{ __('Nama Lengkap') }}</label>
            <input id="name" name="name" type="text" class="form-control @error('name') is-invalid @enderror"
                value="{{ old('name', $user->name) }}" required autofocus autocomplete="name">
            @error('name')
            <div class="invalid-feedback">{{ $message }}</div>
            @enderror
        </div>

        {{-- Bagian Email  --}}
        <div class="mb-3">
            <label for="email" class="form-label">{{ __('Email') }}</label>
            <input id="email" name="email" type="email"
                class="form-control @error('email') is-invalid @enderror" value="{{ old('email', $user->email) }}"
                required autocomplete="username">
            @error('email')
            <div class="invalid-feedback">{{ $message }}</div>
            @enderror

            @if ($user instanceof \Illuminate\Contracts\Auth\MustVerifyEmail && !$user->hasVerifiedEmail())
            <div class="mt-2">
                <p class="small text-muted">
                    {{ __('Alamat email Anda belum terverifikasi.') }}
                    <button form="send-verification" class="btn btn-link text-decoration-underline p-0 small">
                        {{ __('Klik di sini untuk mengirim ulang email verifikasi.') }}
                    </button>
                </p>
                @if (session('status') === 'verification-link-sent')
                <p class="mt-2 fw-medium small text-success">
                    {{ __('Tautan verifikasi baru telah dikirim ke alamat email Anda.') }}
                </p>
                @endif
            </div>
            @endif
        </div>

        {{-- Bagian Nomor Telepon --}}
        <div class="mb-3">
            <label for="phone" class="form-label">{{ __('Nomor Telepon (WA)') }}</label>
            <input id="phone" name="phone" type="text" class="form-control @error('phone') is-invalid @enderror"
                value="{{ old('phone', $user->phone) }}" required>
            @error('phone')
            <div class="invalid-feedback">{{ $message }}</div>
            @enderror
            <small class="text-muted">*Nomor telepon wajib diisi</small>
        </div>

        <hr class="my-4">

        {{-- Bagian Info Spesifik Role (Tidak Dapat Diubah) --}}
        @if ($user->role == 'siswa')
        <div class="mb-3">
            <label for="nomor_induk" class="form-label">NISN (Nomor Induk Siswa Nasional)</label>
            <input id="nomor_induk" type="text" class="form-control" value="{{ $user->nomor_induk }}" readonly disabled>
            <small class="text-muted">NISN tidak dapat diubah.</small>
        </div>
        <div class="row g-3">
            <div class="col-md-6 mb-3">
                <label for="kelas" class="form-label">Kelas</label>
                <input id="kelas" type="text" class="form-control" value="{{ $user->kelas }}" readonly disabled>
            </div>
            <div class="col-md-6 mb-3">
                <label for="golongan" class="form-label">Golongan</label>
                <input id="golongan" type="text" class="form-control" value="{{ $user->golongan }}" readonly disabled>
            </div>
        </div>
        @else
        {{-- Untuk Guru atau Penjaga Perpus --}}
        <div class="mb-3">
            <label for="nuptk" class="form-label">NIP / NUPTK</label>
            <input id="nuptk" type="text" class="form-control" value="{{ $user->nuptk }}" readonly disabled>
            <small class="text-muted">ID Kepegawaian tidak dapat diubah.</small>
        </div>
        @endif


        <div class="d-flex align-items-center gap-3 mt-3">
            <button type="submit" class="btn btn-primary">{{ __('Simpan') }}</button>

            @if (session('status') === 'profile-updated')
            <span class="text-success fw-bold">{{ __('Tersimpan.') }}</span>
            @endif
        </div>
    </form>
</section>