@php
  $menu = $menu ?? null;
@endphp

<div class="mb-3">
    <label class="form-label">Title <span class="text-danger">*</span></label>
    <input type="text" name="title" class="form-control @error('title') is-invalid @enderror"
           value="{{ old('title', $menu->title ?? '') }}" required>
    @error('title') <div class="invalid-feedback">{{ $message }}</div> @enderror
</div>

<div class="mb-3">
    <label class="form-label">Slug</label>
    <input type="text" name="slug" class="form-control @error('slug') is-invalid @enderror"
           value="{{ old('slug', $menu->slug ?? '') }}" placeholder="Auto-generated from title">
    @error('slug') <div class="invalid-feedback">{{ $message }}</div> @enderror
    <div class="form-text">Slug updates automatically as you type the title. You can edit it manually anytime.</div>
</div>

<div class="mb-3">
    <label class="form-label">Parent Menu</label>
    <select name="parent_id" class="form-select @error('parent_id') is-invalid @enderror">
        <option value="">— Top Level —</option>
        @foreach($parents as $parent)
            <option value="{{ $parent->id }}" @selected(old('parent_id', $menu->parent_id ?? '') == $parent->id)>
                {{ $parent->title }}
            </option>
        @endforeach
    </select>
    @error('parent_id') <div class="invalid-feedback">{{ $message }}</div> @enderror
</div>

<div class="row">
    <div class="col-md-6 mb-3">
        <label class="form-label">Icon class</label>
        <input type="text" name="icon" class="form-control" value="{{ old('icon', $menu->icon ?? 'ri-file-list-line') }}" placeholder="ri-home-4-line">
    </div>
    <div class="col-md-6 mb-3">
        <label class="form-label">Sort Order</label>
        <input type="number" name="sort_order" class="form-control" min="0" value="{{ old('sort_order', $menu->sort_order ?? 0) }}">
    </div>
</div>

<div class="row">
    <div class="col-md-6 mb-3">
        <label class="form-label">Laravel Route Name</label>
        <input type="text" name="route_name" class="form-control" value="{{ old('route_name', $menu->route_name ?? '') }}" placeholder="e.g. about">
    </div>
    <div class="col-md-6 mb-3">
        <label class="form-label">Custom URL</label>
        <input type="text" name="url" class="form-control" value="{{ old('url', $menu->url ?? '') }}" placeholder="Optional if route is set">
    </div>
</div>

<div class="d-flex flex-wrap gap-4">
    <div class="form-check">
        <input class="form-check-input" type="checkbox" name="status" value="1" id="status"
               @checked(old('status', $menu->status ?? true))>
        <label class="form-check-label" for="status">Active</label>
    </div>
    <div class="form-check">
        <input class="form-check-input" type="checkbox" name="show_in_header" value="1" id="show_in_header"
               @checked(old('show_in_header', $menu->show_in_header ?? true))>
        <label class="form-check-label" for="show_in_header">Show in Header</label>
    </div>
    <div class="form-check">
        <input class="form-check-input" type="checkbox" name="show_in_footer" value="1" id="show_in_footer"
               @checked(old('show_in_footer', $menu->show_in_footer ?? false))>
        <label class="form-check-label" for="show_in_footer">Show in Footer</label>
    </div>
</div>