@extends('layouts.admin')

@section('title', 'Navigation')

@section('content')
    <div class="grid gap-5 sm:grid-cols-2 lg:grid-cols-3">
        @foreach ($menus as $menu)
            <a href="{{ route('admin.menus.edit', $menu) }}" class="admin-card p-5 transition hover:shadow-md">
                <div class="flex items-start justify-between gap-3">
                    <div>
                        <h2 class="text-base">{{ $menu->name }}</h2>
                        <p class="mt-1 text-xs uppercase tracking-wider text-text-muted">{{ $menu->location }}</p>
                    </div>
                    <span class="pill bg-primary-50 text-primary">{{ $menu->items_count }} items</span>
                </div>

                @if ($menu->description)
                    <p class="mt-3 text-sm text-text-secondary">{{ $menu->description }}</p>
                @endif
            </a>
        @endforeach
    </div>
@endsection