<x-app-layout>
	<div class="container mx-auto">
		<h1 class="text-2xl font-bold mb-4">Add Level</h1>

		@if ($errors->any())
			<div class="bg-red-100 text-red-800 p-3 rounded mb-4">
				<ul>
					@foreach ($errors->all() as $error)
						<li>{{ $error }}</li>
					@endforeach
				</ul>
			</div>
		@endif

		<form action="{{ route('admin.levels.store') }}" method="POST" class="space-y-6">
			@csrf
			<div>
				<label for="name" class="block font-medium text-sm text-gray-700">Level Name</label>
				<input id="name" type="text" name="name" class="form-input mt-1 block w-full"
					value="{{ old('name') }}" required />
			</div>

			<div>
				<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-900 focus:outline-none focus:border-blue-900 focus:ring
						   focus:ring-blue-300 disabled:opacity-25 transition">
					Save
				</button>
			</div>
		</form>
	</div>
</x-app-layout>