@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 Plano: ') }} {{ $plan->name }}
    </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 de Edição --}}
                <form method="POST" action="{{ route('admin.plans.update', $plan) }}">
                    @csrf {{-- Token CSRF --}}
                    @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 do
                            Plano <span class="text-red-500">*</span></label>
                        <input type="text" name="name" id="name" value="{{ old('name', $plan->name) }}"
                            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')
                        <p class="mt-1 text-sm text-red-500">{{ $message }}</p>
                        @enderror
                    </div>

                    {{-- Campo Slug --}}
                    <div class="mb-4">
                        <label for="slug" class="block text-sm font-medium text-gray-700 dark:text-gray-300">Slug
                            (URL)</label>
                        <input type="text" name="slug" id="slug" value="{{ old('slug', $plan->slug) }}"
                            placeholder="Deixe em branco para gerar do nome"
                            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('slug') border-red-500 @enderror">
                        @error('slug')
                        <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">Identificador na URL. Será gerado do
                            nome se vazio.</p>
                    </div>

                    {{-- Campo Preço --}}
                    <div class="mb-4">
                        <label for="price" class="block text-sm font-medium text-gray-700 dark:text-gray-300">Preço (R$)
                            <span class="text-red-500">*</span></label>
                        <input type="number" name="price" id="price" step="0.01" min="0"
                            value="{{ old('price', $plan->price) }}"
                            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('price') border-red-500 @enderror"
                            required>
                        @error('price')
                        <p class="mt-1 text-sm text-red-500">{{ $message }}</p>
                        @enderror
                    </div>

                    {{-- Campo Intervalo --}}
                    <div class="mb-4">
                        <label for="interval"
                            class="block text-sm font-medium text-gray-700 dark:text-gray-300">Intervalo/Duração <span
                                class="text-red-500">*</span></label>
                        {{-- Usando input de texto como no create. Adapte para select se preferir --}}
                        <input type="text" name="interval" id="interval" value="{{ old('interval', $plan->interval) }}"
                            placeholder="Ex: month, year, lifetime, 30_days"
                            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('interval') border-red-500 @enderror"
                            required>
                        @error('interval')
                        <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">Define a recorrência ou duração (ex:
                            month, year, lifetime, 15_days).</p>
                    </div>

                    {{-- Campo Descrição --}}
                    <div class="mb-4">
                        <label for="description"
                            class="block text-sm font-medium text-gray-700 dark:text-gray-300">Descrição</label>
                        <textarea name="description" id="description" rows="3"
                            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('description') border-red-500 @enderror">{{ old('description', $plan->description) }}</textarea>
                        @error('description')
                        <p class="mt-1 text-sm text-red-500">{{ $message }}</p>
                        @enderror
                    </div>

                    {{-- Campo Status (Ativo/Inativo) --}}
                    <div class="mb-4">
                        <label for="is_active" class="flex items-center">
                            <input type="checkbox" name="is_active" id="is_active" value="1"
                                class="rounded border-gray-300 text-indigo-600 shadow-sm focus:ring-indigo-500 dark:bg-gray-900 dark:border-gray-700"
                                {{ old('is_active', $plan->is_active) ? 'checked' : '' }}>
                            {{-- Usa old() ou valor atual --}}
                            <span class="ms-2 text-sm text-gray-600 dark:text-gray-400">Marcar como Ativo</span>
                        </label>
                        @error('is_active')
                        <p class="mt-1 text-sm text-red-500">{{ $message }}</p>
                        @enderror
                    </div>


                    {{-- Botões de Ação --}}
                    <div class="flex items-center justify-end mt-6 border-t border-gray-200 dark:border-gray-700 pt-4">
                        {{-- Botão Cancelar (Volta para detalhes do plano) --}}
                        <a href="{{ route('admin.plans.show', $plan) }}"
                            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">
                            Cancelar
                        </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