<x-layouts::app :title="__('Edit Class')">
    <div class="max-w-3xl mx-auto flex flex-col gap-6">
        <flux:card>
            <div class="flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between">
                <div>
                    <flux:heading size="lg">{{ __('Edit Class') }}</flux:heading>
                    <flux:text variant="subtle">{{ __('Update details for the selected class.') }}</flux:text>
                </div>
            </div>

            <form action="{{ route('classes.update', $class->id) }}" method="POST" class="mt-6 space-y-6">
                @csrf
                @method('PUT')

                <flux:input
                    name="class_name"
                    :label="__('Class Name')"
                    :value="old('class_name', $class->class_name)"
                    type="text"
                    required
                    autofocus
                    :placeholder="__('Enter class name')"
                />

                <x-input-error :messages="$errors->get('class_name')" class="mt-2" />

                <div class="flex flex-col gap-3 sm:flex-row sm:justify-end">
                    <flux:button type="submit" variant="primary">
                        {{ __('Update Class') }}
                    </flux:button>
                    <flux:link :href="route('classes.index')" wire:navigate>
                            <flux:button type="button" variant="outline" class="px-4 py-2 text-sm">
                                {{ __('Cancel') }}
                            </flux:button>
                    </flux:link>
                </div>
            </form>
        </flux:card>
    </div>
</x-layouts::app>
