@extends('front.layout.app')

@section('content')
    {{-- @dd($products) --}}
    <style>
        .container.mt-4 {
            padding: 200px;
        }
    </style>

    <div class="container mt-4">
        <h2>Search Results for "{{ $query }}"</h2>

        <!-- Vendor Section -->
        @if ($vendors->isNotEmpty())
            <div class="search-text mb-4">
                <h3>Vendors:</h3>
                @foreach ($vendors as $vendor)
                    <a href="{{ route('front.vendor.shop', $vendor->id) }}">
                        <h4>{{ $vendor->name }}</h4>
                    </a>
                @endforeach
            </div>
        @endif

        <!-- Product Section -->
        @if ($products->isNotEmpty())
            <div class="search-text">
                <h3>Products:</h3>
                @foreach ($products as $product)
                    <a href="{{ route('front.shop.product', ['slug' => $product->slug]) }}">
                        <h4>{{ $product->name }}</h4>
                    </a>
                @endforeach
            </div>
        @endif

        <!-- No Results -->
        @if ($vendors->isEmpty() && $products->isEmpty())
            <div class="alert alert-warning text-center mt-4" role="alert">
                No results found.
            </div>
        @endif
    </div>
@endsection