@extends('layouts.app')
@section('title', 'Search')
@section('breadcrumb')
    <li class="breadcrumb-item active" aria-current="page">Search</li>
@endsection

@section('content')
    <x-layout.page-header title="Search" subtitle="Find products, customers, invoices and settings — instantly." icon="search" />

    <x-ui.card>
        <form method="GET" action="{{ route('search.index') }}" class="search-page__form">
            <div class="input-group input-group-lg">
                <span class="input-group-text">{!! icon('search') !!}</span>
                <input type="search" name="q" value="{{ $query ?? '' }}"
                    class="form-control" placeholder="Type to search — Ctrl + K anywhere" autofocus>
                <button class="btn btn-primary" type="submit">Search</button>
            </div>
        </form>

        @if(($query ?? '') === '')
            <div class="search-page__hint text-muted small mt-3">
                Full search will light up as modules ship in later sprints (products, purchases, sales,
                customers, suppliers, invoices, ledgers).
            </div>
        @elseif(count($groups) === 0)
            <x-ui.empty
                title="No results"
                :message="'Nothing matched \"' . e($query) . '\". Try shorter or different keywords.'"
                icon="binoculars"
            />
        @else
            @foreach($groups as $group)
                <section class="search-group">
                    <header class="search-group__header">{{ $group['label'] }} ({{ count($group['items']) }})</header>
                    <ul class="search-group__list">
                        @foreach($group['items'] as $item)
                            <li class="search-group__item">
                                <a href="{{ $item['href'] }}" class="search-group__link">
                                    <span class="search-group__icon">{!! icon($item['icon'] ?? 'dot') !!}</span>
                                    <span class="search-group__label">{{ $item['label'] }}</span>
                                    @if(!empty($item['hint']))
                                        <span class="search-group__hint">{{ $item['hint'] }}</span>
                                    @endif
                                </a>
                            </li>
                        @endforeach
                    </ul>
                </section>
            @endforeach
        @endif
    </x-ui.card>
@endsection