@extends('layouts.app')
@section('title', 'Testing - PPOB Online')
@section('content')
<div class="max-w-7xl mx-auto px-4 py-8">
    @include('partials.banners')
    @include('partials.categories')
    <section class="mt-8">
        <h2 class="text-2xl font-bold mb-6">Produk Populer</h2>
        <div class="grid grid-cols-2 md:grid-cols-4 lg:grid-cols-6 gap-4">
            @foreach($products ?? [] as $product)
            <div class="bg-white dark:bg-gray-800 rounded-xl p-4 shadow-sm border hover:shadow-md transition">
                <h3 class="font-semibold text-sm">{{ $product->name }}</h3>
                <p class="text-primary font-bold mt-2">Rp{{ number_format($product->sell_price, 0, ',', '.') }}</p>
                <button onclick="buy({{ $product->id }})" class="btn-primary text-white text-sm w-full mt-3 py-2 rounded-lg">Beli</button>
            </div>
            @endforeach
        </div>
    </section>
</div>
@endsection