@extends('admin.layouts.app')

@section('title', 'Create Menu')
@section('page_title', 'Create Menu')

@section('content')
    <div class="max-w-xl rounded-xl border border-slate-200 bg-white p-6 shadow-sm">
        <form method="POST" action="{{ route('admin.menus.store') }}" class="space-y-4">
            @csrf

            <div>
                <label for="name" class="mb-1 block text-sm font-medium text-slate-700">Name</label>
                <input type="text" name="name" id="name" value="{{ old('name') }}" required
                       class="w-full rounded-lg border border-slate-300 px-3 py-2 text-sm">
            </div>

            <div>
                <label for="slug" class="mb-1 block text-sm font-medium text-slate-700">Slug</label>
                <input type="text" name="slug" id="slug" value="{{ old('slug') }}" required
                       placeholder="header, footer, mobile"
                       class="w-full rounded-lg border border-slate-300 px-3 py-2 text-sm">
            </div>

            <div class="flex gap-2">
                <button type="submit" class="rounded-lg bg-blue-700 px-4 py-2 text-sm font-medium text-white hover:bg-blue-800">
                    Create Menu
                </button>
                <a href="{{ route('admin.menus.index') }}" class="rounded-lg bg-slate-100 px-4 py-2 text-sm text-slate-700 hover:bg-slate-200">
                    Cancel
                </a>
            </div>
        </form>
    </div>
@endsection