@if($products->count() > 0)
    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" id="products-grid">
        @foreach($products as $product)
            <div class="relative group">
                <x-product-card :product="$product" />
                <button onclick="openQuickView({{ $product->id }})" class="absolute top-3 right-3 bg-[#7d6a52] text-white px-4 py-2 rounded-full text-sm hover:bg-[#9d8566] opacity-0 group-hover:opacity-100 transition-all shadow-lg font-medium">
                    Quick View
                </button>
            </div>
        @endforeach
    </div>
    
    <!-- Pagination -->
    <div class="mt-8" id="pagination-container">
        {{ $products->links() }}
    </div>
@else
    <div class="bg-white p-8 rounded-lg shadow-md text-center">
        <p class="text-[#645443] text-lg">No products found.</p>
        <p class="text-[#9d8566] mt-2">Try adjusting your filters.</p>
    </div>
@endif