@extends('layouts.admin')
@section('title', isset($user) ? 'Edit Pengguna' : 'Tambah Pengguna')
@section('header', isset($user) ? 'Edit Pengguna' : 'Tambah Pengguna')

@section('content')
<div class="max-w-2xl">

    <a href="{{ route('admin.users.index') }}"
       class="inline-flex items-center gap-1.5 text-sm text-gray-500 hover:text-gray-700 mb-6">
        <i class="fa fa-arrow-left" style="font-size:11px"></i> Kembali
    </a>

    <div class="bg-white rounded-xl border border-gray-100 p-6">
        <h2 class="font-semibold text-gray-800 mb-6">{{ isset($user) ? 'Edit Pengguna' : 'Tambah Pengguna Baru' }}</h2>

        @if($errors->any())
        <div class="mb-4 px-4 py-3 bg-red-50 border border-red-200 rounded-xl">
            @foreach($errors->all() as $err)
            <p class="text-xs text-red-500">{{ $err }}</p>
            @endforeach
        </div>
        @endif

        <form method="POST"
              action="{{ isset($user) ? route('admin.users.update', $user) : route('admin.users.store') }}">
            @csrf
            @if(isset($user)) @method('PUT') @endif

            {{-- Nama --}}
            <div class="mb-4">
                <label class="block text-sm font-medium text-gray-700 mb-1.5">Nama Lengkap <span class="text-red-500">*</span></label>
                <input type="text" name="name" value="{{ old('name', $user->name ?? '') }}"
                       class="w-full border border-gray-200 rounded-xl px-4 py-2.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-300 @error('name') border-red-400 @enderror"
                       placeholder="Nama lengkap pengguna">
                @error('name') <p class="text-xs text-red-500 mt-1">{{ $message }}</p> @enderror
            </div>

            {{-- Email --}}
            <div class="mb-4">
                <label class="block text-sm font-medium text-gray-700 mb-1.5">Email <span class="text-red-500">*</span></label>
                <input type="email" name="email" value="{{ old('email', $user->email ?? '') }}"
                       class="w-full border border-gray-200 rounded-xl px-4 py-2.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-300 @error('email') border-red-400 @enderror"
                       placeholder="email@sekolah.sch.id">
                @error('email') <p class="text-xs text-red-500 mt-1">{{ $message }}</p> @enderror
            </div>

            {{-- NIS / NIP --}}
            <div class="mb-4">
                <label class="block text-sm font-medium text-gray-700 mb-1.5">NIS / NIP</label>
                <input type="text" name="nis_nip" value="{{ old('nis_nip', $user->nis_nip ?? '') }}"
                       class="w-full border border-gray-200 rounded-xl px-4 py-2.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-300"
                       placeholder="Nomor Induk Siswa atau Pegawai">
            </div>

            {{-- Role --}}
            <div class="mb-4">
                <label class="block text-sm font-medium text-gray-700 mb-1.5">Role <span class="text-red-500">*</span></label>
                <select name="role_id"
                        class="w-full border border-gray-200 rounded-xl px-4 py-2.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-300 @error('role_id') border-red-400 @enderror">
                    <option value="">— Pilih Role —</option>
                    @foreach($roles as $role)
                    <option value="{{ $role->id }}" {{ old('role_id', $user->role_id ?? '') == $role->id ? 'selected' : '' }}>
                        {{ ucfirst($role->name) }}
                    </option>
                    @endforeach
                </select>
                @error('role_id') <p class="text-xs text-red-500 mt-1">{{ $message }}</p> @enderror
            </div>

            {{-- Password --}}
            <div class="mb-4">
                <label class="block text-sm font-medium text-gray-700 mb-1.5">
                    Password
                    @if(isset($user)) 
                        <span class="text-gray-400 text-xs font-normal">(kosongkan jika tidak ingin mengubah)</span>
                    @else
                        <span class="text-red-500">*</span>
                    @endif
                </label>
                <input type="password" name="password" id="pwd-input"
                       class="w-full border border-gray-200 rounded-xl px-4 py-2.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-300 @error('password') border-red-400 @enderror"
                       placeholder="{{ isset($user) ? 'Password baru (opsional)' : 'Minimal 8 karakter' }}">
                @error('password') <p class="text-xs text-red-500 mt-1">{{ $message }}</p> @enderror
            </div>

            {{-- Konfirmasi --}}
            <div class="mb-6">
                <label class="block text-sm font-medium text-gray-700 mb-1.5">Konfirmasi Password</label>
                <input type="password" name="password_confirmation"
                       class="w-full border border-gray-200 rounded-xl px-4 py-2.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-300"
                       placeholder="Ulangi password">
            </div>

            {{-- Status Aktif (edit saja) --}}
            @if(isset($user))
            <div class="mb-6 p-4 bg-gray-50 rounded-xl border border-gray-100">
                <label class="flex items-center gap-3 cursor-pointer">
                    <input type="checkbox" name="is_active" value="1" {{ old('is_active', $user->is_active) ? 'checked' : '' }}
                           class="w-4 h-4 rounded">
                    <div>
                        <p class="text-sm font-medium text-gray-700">Akun Aktif</p>
                        <p class="text-xs text-gray-500">Pengguna dapat login jika akun aktif</p>
                    </div>
                </label>
            </div>
            @endif

            {{-- Actions --}}
            <div class="flex gap-3">
                <button type="submit"
                        class="bg-blue-600 hover:bg-blue-700 text-white text-sm font-semibold px-6 py-2.5 rounded-xl transition">
                    {{ isset($user) ? 'Simpan Perubahan' : 'Tambah Pengguna' }}
                </button>
                <a href="{{ route('admin.users.index') }}"
                   class="bg-gray-100 hover:bg-gray-200 text-gray-700 text-sm font-semibold px-6 py-2.5 rounded-xl transition">
                    Batal
                </a>
            </div>
        </form>
    </div>
</div>
@endsection