{{-- Instant suggestions for the header search panel. --}}
@if ($total === 0)
    <p class="py-2 text-sm text-text-muted">
        {{ __('No matches for “:term”. Try a sector name, a district, or a project title.', ['term' => $term]) }}
    </p>
@else
    <div class="grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
        @foreach ($results as $group => $items)
            <div>
                <p class="meta-label mb-2">{{ $group }}</p>
                <ul class="space-y-1">
                    @foreach ($items as $item)
                        <li>
                            <a href="{{ $item['url'] }}" class="block rounded-lg px-2 py-1.5 transition hover:bg-surface-muted">
                                <span class="block truncate text-sm font-medium text-text">
                                    {!! \App\Services\SiteSearch::highlight($item['title'], $term, 70) !!}
                                </span>
                                @if (filled($item['meta']))
                                    <span class="block truncate text-xs text-text-muted">{{ $item['meta'] }}</span>
                                @endif
                            </a>
                        </li>
                    @endforeach
                </ul>
            </div>
        @endforeach
    </div>

    <a href="{{ route('search', ['q' => $term]) }}" class="link-arrow mt-5">
        {{ __('See all results') }} <x-icon name="arrow-right" class="icon-arrow size-4" />
    </a>
@endif