@extends('layouts.admin') {{-- Usa o layout admin --}}

{{-- Define o cabeçalho da página --}}
<x-slot name="header">
    <h2 class="font-semibold text-xl text-gray-800 dark:text-gray-200 leading-tight">
        {{ __('Editar Usuário: ') }} {{ $user->name }} (#{{ $user->id }})
    </h2>
</x-slot>

@section('content')
<div class="py-1">
    <div class="max-w-4xl mx-auto sm:px-6 lg:px-8"> {{-- Max width menor para forms --}}
        <div class="bg-white dark:bg-gray-800 overflow-hidden shadow-sm sm:rounded-lg">
            <div class="p-6 text-gray-900 dark:text-gray-100">
                {{-- Formulário apontando para a rota de update --}}
                {{-- Lembre-se: O Controller Admin\UserController@update já existe e usa UpdateUserRequest --}}
                <form method="POST" action="{{ route('admin.users.update', $user) }}">
                    @csrf {{-- Token de segurança OBRIGATÓRIO --}}
                    @method('PUT') {{-- Método HTTP correto para atualização --}}

                    {{-- Campo Nome --}}
                    <div class="mb-4">
                        <label for="name"
                            class="block text-sm font-medium text-gray-700 dark:text-gray-300">Nome</label>
                        <input type="text" name="name" id="name" value="{{ old('name', $user->name) }}"
                            {{-- old() mostra valor antigo ou atual --}}
                            class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 dark:bg-gray-700 dark:border-gray-600 dark:text-gray-100 @error('name') border-red-500 @enderror"
                            required>
                        @error('name') {{-- Mostra erro de validação para 'name' --}}
                        <p class="mt-1 text-sm text-red-500">{{ $message }}</p>
                        @enderror
                    </div>

                    {{-- Campo Email --}}
                    <div class="mb-4">
                        <label for="email"
                            class="block text-sm font-medium text-gray-700 dark:text-gray-300">Email</label>
                        <input type="email" name="email" id="email" value="{{ old('email', $user->email) }}"
                            class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 dark:bg-gray-700 dark:border-gray-600 dark:text-gray-100 @error('email') border-red-500 @enderror"
                            required>
                        @error('email')
                        <p class="mt-1 text-sm text-red-500">{{ $message }}</p>
                        @enderror
                    </div>

                    {{-- Campo Função (Role) --}}
                    <div class="mb-4">
                        <label for="role" class="block text-sm font-medium text-gray-700 dark:text-gray-300">Função
                            (Role)</label>
                        <select name="role" id="role"
                            class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 dark:bg-gray-700 dark:border-gray-600 dark:text-gray-100 @error('role') border-red-500 @enderror"
                            required>
                            <option value="customer" {{ old('role', $user->role) === 'customer' ? 'selected' : '' }}>
                                Cliente (Customer)
                            </option>
                            <option value="admin" {{ old('role', $user->role) === 'admin' ? 'selected' : '' }}>
                                Administrador (Admin)
                            </option>
                        </select>
                        @error('role')
                        <p class="mt-1 text-sm text-red-500">{{ $message }}</p>
                        @enderror
                    </div>

                    {{-- Campo Código do Cliente --}}
                    <div class="mb-4">
                        <label for="customer_code"
                            class="block text-sm font-medium text-gray-700 dark:text-gray-300">Código do Cliente</label>
                        <input type="text" name="customer_code" id="customer_code"
                            value="{{ old('customer_code', $user->customer_code) }}"
                            placeholder="Ex: CUST-123 (Opcional)"
                            class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 dark:bg-gray-700 dark:border-gray-600 dark:text-gray-100 @error('customer_code') border-red-500 @enderror">
                        @error('customer_code')
                        <p class="mt-1 text-sm text-red-500">{{ $message }}</p>
                        @enderror
                        <p class="mt-1 text-xs text-gray-500 dark:text-gray-400">Opcional. Usado para identificar o
                            cliente via WhatsApp.</p>
                    </div>

                    {{-- TO DO: Adicionar opção para alterar senha se necessário (exigiria mais campos e validação) --}}

                    {{-- Botões de Ação --}}
                    <div class="flex items-center justify-end mt-6">
                        {{-- Botão Voltar/Cancelar --}}
                        <a href="{{ route('admin.users.show', $user) }}"
                            class="inline-flex items-center px-4 py-2 bg-gray-400 dark:bg-gray-600 border border-transparent rounded-md font-semibold text-xs text-white dark:text-gray-200 uppercase tracking-widest hover:bg-gray-500 dark:hover:bg-gray-500 active:bg-gray-600 focus:outline-none focus:border-gray-900 focus:ring ring-gray-300 disabled:opacity-25 transition ease-in-out duration-150 mr-4">
                            Voltar
                        </a>

                        {{-- Botão Salvar Alterações --}}
                        <button type="submit"
                            class="inline-flex items-center px-4 py-2 bg-blue-600 border border-transparent rounded-md font-semibold text-xs text-white uppercase tracking-widest hover:bg-blue-700 active:bg-blue-800 focus:outline-none focus:border-blue-900 focus:ring ring-blue-300 disabled:opacity-25 transition ease-in-out duration-150">
                            Salvar Alterações
                        </button>
                    </div>
                </form>

            </div>
        </div>
    </div>
</div>
@endsection