@extends('layouts.app')

@section('title','Profil Kepala Desa')

@section('content')
<div class="container-fluid">

    {{-- ================= MODE OFFLINE ================= --}}
    @if(session('offline_mode'))
    <div class="alert alert-warning d-flex align-items-center mb-3">
        <i class="bi bi-wifi-off me-2 fs-5"></i>
        <div>
            <strong>Mode Offline</strong><br>
            Perubahan profil akan disimpan dan disinkronkan saat koneksi kembali tersedia.
        </div>
    </div>
    @endif

    <h4 class="fw-bold mb-3">Profil Kepala Desa</h4>

    {{-- ================= NOTIFIKASI ================= --}}
    @if(session('success'))
    <div class="alert alert-success">
        {{ session('success') }}
    </div>
    @endif

    @if($errors->any())
    <div class="alert alert-danger">
        <ul class="mb-0">
            @foreach($errors->all() as $error)
            <li>{{ $error }}</li>
            @endforeach
        </ul>
    </div>
    @endif

    {{-- ================= FORM PROFIL ================= --}}
    <form method="POST" action="{{ route('desa.profil.update') }}">
        @csrf
        @method('PUT')

        {{-- NAMA DESA --}}
        <div class="mb-3">
            <label class="form-label">Nama Desa</label>
            <input type="text"
                class="form-control"
                value="{{ $user->desa?->nama_desa ?? '-' }}"
                disabled>
        </div>

        {{-- NAMA LENGKAP --}}
        <div class="mb-3">
            <label class="form-label">Nama Lengkap</label>
            <input type="text"
                name="nama"
                class="form-control"
                value="{{ old('nama', $user->nama) }}"
                required>
        </div>

        {{-- NIK --}}
        <div class="mb-3">
            <label class="form-label">NIK</label>
            <input type="text"
                name="nik"
                class="form-control"
                value="{{ old('nik', $user->nik) }}"
                maxlength="16"
                required>
        </div>

        {{-- USERNAME --}}
        <div class="mb-3">
            <label class="form-label">Username</label>
            <input type="text"
                class="form-control"
                value="{{ $user->username }}"
                disabled>
        </div>

        {{-- EMAIL --}}
        <div class="mb-4">
            <label class="form-label">Email</label>
            <input type="email"
                class="form-control"
                value="{{ $user->email }}"
                disabled>
            <small class="text-muted">
                Email digunakan untuk notifikasi & reset password
            </small>
        </div>

        {{-- AKSI --}}
        <button class="btn btn-success">
            <i class="bi bi-save me-1"></i>
            Simpan Perubahan
        </button>

        <a href="{{ route('desa.dashboard') }}"
            class="btn btn-secondary ms-2">
            Kembali
        </a>
    </form>

</div>
@endsection