<?php $__env->startSection('title', 'Beranda'); ?>

<?php $__env->startSection('content'); ?>

<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-10">

    
    <div class="bg-gradient-to-r from-gray-50 to-gray-100 border border-gray-200 rounded-3xl p-10 mb-10 relative overflow-hidden">
        <div class="max-w-xl">
            <h1 class="text-4xl font-extrabold text-primary leading-tight mb-4">
                Temukan produk terbaik<br>
                untuk kebutuhan Anda
            </h1>
            <p class="text-secondary mb-6">
                Koleksi pilihan dengan kualitas terbaik untuk pengalaman belanja yang nyaman.
            </p>

            <button onclick="document.getElementById('produk').scrollIntoView()"
                class="bg-primary text-white px-6 py-3 rounded-full font-semibold hover:bg-gray-800 transition shadow-lg">
                Lihat Produk
            </button>
        </div>

        <div class="absolute -top-16 -right-16 w-72 h-72 bg-blue-400 opacity-20 blur-[100px] rounded-full"></div>
    </div>

    
    <div id="produk" class="flex flex-col md:flex-row md:items-center md:justify-between gap-4 mb-6">
        <h2 class="text-2xl font-bold text-primary">Semua Produk</h2>

        <form method="GET" class="w-full md:w-auto">
            <div class="relative">
                <input type="text" name="search" value="<?php echo e(request('search')); ?>"
                    placeholder="Cari produk..."
                    class="w-full md:w-64 bg-gray-100 border-transparent rounded-full py-2.5 pl-10 pr-4 text-sm focus:bg-white focus:ring-2 focus:ring-accent/20 focus:border-accent transition">
                <i class="bi bi-search absolute left-3 top-1/2 -translate-y-1/2 text-gray-400"></i>
            </div>
        </form>
    </div>

    
    <div class="flex flex-wrap gap-2 mb-8">
        <a href="<?php echo e(route('customer.dashboard')); ?>"
            class="px-4 py-2 rounded-full text-sm font-medium border 
            <?php echo e(!request('kategori') ? 'bg-primary text-white border-primary' : 'text-gray-600 hover:bg-gray-100'); ?>">
            Semua
        </a>

        <?php $__currentLoopData = $kategoriList ?? []; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $kat): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
            <a href="<?php echo e(route('customer.dashboard',['kategori'=>$kat->id])); ?>"
                class="px-4 py-2 rounded-full text-sm font-medium border 
                <?php echo e(request('kategori')==$kat->id ? 'bg-primary text-white border-primary' : 'text-gray-600 hover:bg-gray-100'); ?>">
                <?php echo e($kat->nama); ?>

            </a>
        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
    </div>

    
    <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-5">

        <?php $__empty_1 = true; $__currentLoopData = $produkTerbaru; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $p): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_1 = false; ?>
            <a href="<?php echo e(route('customer.produk.show',$p->id)); ?>"
               class="group bg-white rounded-2xl border border-gray-100 overflow-hidden shadow-sm hover:shadow-lg transition">

                
                <div class="h-44 bg-gray-100 overflow-hidden">
                    <?php if($p->foto): ?>
                        <img src="<?php echo e(asset('storage/'.$p->foto)); ?>"
                             class="w-full h-full object-cover group-hover:scale-105 transition duration-500">
                    <?php endif; ?>
                </div>

                
                <div class="p-4">
                    <h3 class="text-sm font-semibold text-gray-800 line-clamp-2 mb-2 group-hover:text-accent transition">
                        <?php echo e($p->nama); ?>

                    </h3>

                    <div class="flex justify-between items-center">
                        <span class="text-base font-bold text-gray-900">
                            Rp <?php echo e(number_format($p->harga,0,',','.')); ?>

                        </span>

                        <div class="w-8 h-8 flex items-center justify-center rounded-full bg-gray-100 group-hover:bg-accent group-hover:text-white transition">
                            <i class="bi bi-cart-plus"></i>
                        </div>
                    </div>
                </div>
            </a>

        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_1): ?>
            <p class="col-span-full text-center text-gray-500">Produk tidak ditemukan</p>
        <?php endif; ?>

    </div>

    
    <div class="mt-10">
        <?php echo e($produkTerbaru->links()); ?>

    </div>

</div>

<?php $__env->stopSection(); ?>
<?php echo $__env->make('layouts.customer', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH C:\laragon\www\Toko-miftah\resources\views/customer/dashboard.blade.php ENDPATH**/ ?>