@php
    /** @var \App\Models\User|null $targetUser */
    $isEdit = isset($targetUser) && $targetUser instanceof \App\Models\User;
@endphp

<div class="row g-4">
    <div class="col-lg-8">
        <div class="block block-rounded mb-0">
            <div class="block-header block-header-default">
                <h3 class="block-title">{{ $isEdit ? 'Modifier utilisateur' : 'Nouvel utilisateur' }}</h3>
            </div>
            <div class="block-content">
                <div class="row g-3">
                    <div class="col-md-6">
                        <label class="form-label" for="name">Nom</label>
                        <input id="name" type="text" name="name" class="form-control form-control-alt" value="{{ old('name', $targetUser->name ?? '') }}" required>
                    </div>
                    <div class="col-md-6">
                        <label class="form-label" for="email">Email</label>
                        <input id="email" type="email" name="email" class="form-control form-control-alt" value="{{ old('email', $targetUser->email ?? '') }}" required>
                    </div>
                    <div class="col-md-4">
                        <label class="form-label" for="role">Role utilisateur</label>
                        <select id="role" name="role" class="form-select" required>
                            @foreach (['admin', 'client', 'liner'] as $roleOption)
                                <option value="{{ $roleOption }}" @selected(old('role', $targetUser->role ?? 'client') === $roleOption)>{{ strtoupper($roleOption) }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-md-4">
                        <label class="form-label" for="phone">Telephone</label>
                        <input id="phone" type="text" name="phone" class="form-control form-control-alt" value="{{ old('phone', $targetUser->phone ?? '') }}">
                    </div>
                    <div class="col-md-4 d-flex align-items-end" id="kyc-block">
                        <div class="form-check">
                            <input class="form-check-input" type="checkbox" value="1" id="is_kyc_verified" name="is_kyc_verified" @checked((bool) old('is_kyc_verified', $targetUser->is_kyc_verified ?? false))>
                            <label class="form-check-label" for="is_kyc_verified">KYC verifie</label>
                            <small id="kyc-admin-hint" class="form-text text-muted d-block mt-1 d-none">
                                Non applicable pour le role admin.
                            </small>
                        </div>
                    </div>
                    <div class="col-12">
                        <label class="form-label" for="bio">Bio</label>
                        <textarea id="bio" name="bio" class="form-control form-control-alt" rows="4">{{ old('bio', $targetUser->bio ?? '') }}</textarea>
                    </div>
                    <div class="col-md-6">
                        <label class="form-label" for="language">Langue app</label>
                        <select id="language" name="language" class="form-select">
                            @foreach (['fr' => 'Francais', 'en' => 'English'] as $languageValue => $languageLabel)
                                <option value="{{ $languageValue }}" @selected(old('language', $targetUser->language ?? 'fr') === $languageValue)>{{ $languageLabel }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-md-6">
                        <label class="form-label" for="region">Region</label>
                        <select id="region" name="region" class="form-select">
                            @foreach (['FR' => 'France', 'SN' => 'Senegal', 'CI' => 'Cote d Ivoire'] as $regionValue => $regionLabel)
                                <option value="{{ $regionValue }}" @selected(old('region', $targetUser->region ?? 'FR') === $regionValue)>{{ $regionLabel }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-12">
                        <div class="row g-3">
                            <div class="col-md-3">
                                <input type="hidden" name="push_notifications_enabled" value="0">
                                <div class="form-check form-switch">
                                    <input class="form-check-input" type="checkbox" role="switch" id="push_notifications_enabled" name="push_notifications_enabled" value="1" @checked((bool) old('push_notifications_enabled', $targetUser->push_notifications_enabled ?? true))>
                                    <label class="form-check-label" for="push_notifications_enabled">Push active</label>
                                </div>
                            </div>
                            <div class="col-md-3">
                                <input type="hidden" name="sms_notifications_enabled" value="0">
                                <div class="form-check form-switch">
                                    <input class="form-check-input" type="checkbox" role="switch" id="sms_notifications_enabled" name="sms_notifications_enabled" value="1" @checked((bool) old('sms_notifications_enabled', $targetUser->sms_notifications_enabled ?? false))>
                                    <label class="form-check-label" for="sms_notifications_enabled">SMS actif</label>
                                </div>
                            </div>
                            <div class="col-md-3">
                                <input type="hidden" name="email_notifications_enabled" value="0">
                                <div class="form-check form-switch">
                                    <input class="form-check-input" type="checkbox" role="switch" id="email_notifications_enabled" name="email_notifications_enabled" value="1" @checked((bool) old('email_notifications_enabled', $targetUser->email_notifications_enabled ?? true))>
                                    <label class="form-check-label" for="email_notifications_enabled">Email mission</label>
                                </div>
                            </div>
                            <div class="col-md-3">
                                <input type="hidden" name="email_marketing_enabled" value="0">
                                <div class="form-check form-switch">
                                    <input class="form-check-input" type="checkbox" role="switch" id="email_marketing_enabled" name="email_marketing_enabled" value="1" @checked((bool) old('email_marketing_enabled', $targetUser->email_marketing_enabled ?? true))>
                                    <label class="form-check-label" for="email_marketing_enabled">Email marketing</label>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <label class="form-label" for="password">Mot de passe {{ $isEdit ? '(laisser vide pour conserver)' : '' }}</label>
                        <input id="password" type="password" name="password" class="form-control form-control-alt" {{ $isEdit ? '' : 'required' }}>
                    </div>
                    <div class="col-md-6">
                        <label class="form-label" for="password_confirmation">Confirmation mot de passe</label>
                        <input id="password_confirmation" type="password" name="password_confirmation" class="form-control form-control-alt" {{ $isEdit ? '' : 'required' }}>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-lg-4">
        <div class="block block-rounded mb-0">
            <div class="block-header block-header-default">
                <h3 class="block-title">Actions</h3>
            </div>
            <div class="block-content">
                <button type="submit" class="btn btn-alt-primary w-100 mb-2">
                    <i class="fa fa-save opacity-50 me-1"></i> {{ $isEdit ? 'Mettre a jour' : 'Creer l utilisateur' }}
                </button>
                <a href="{{ route('bo.users.index') }}" class="btn btn-alt-secondary w-100">
                    Retour a la liste
                </a>
            </div>
        </div>
    </div>
</div>

<script>
    (() => {
        const roleSelect = document.getElementById('role');
        const kycInput = document.getElementById('is_kyc_verified');
        const kycHint = document.getElementById('kyc-admin-hint');

        if (!roleSelect || !kycInput || !kycHint) {
            return;
        }

        const syncKycForRole = () => {
            const isAdmin = roleSelect.value === 'admin';
            kycInput.disabled = isAdmin;
            if (isAdmin) {
                kycInput.checked = true;
            }
            kycHint.classList.toggle('d-none', !isAdmin);
        };

        roleSelect.addEventListener('change', syncKycForRole);
        syncKycForRole();
    })();
</script>
