<?php if (isset($component)) { $__componentOriginal9ac128a9029c0e4701924bd2d73d7f54 = $component; } ?>
<?php if (isset($attributes)) { $__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54 = $attributes; } ?>
<?php $component = App\View\Components\AppLayout::resolve([] + (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag ? $attributes->all() : [])); ?>
<?php $component->withName('app-layout'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php if (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag): ?>
<?php $attributes = $attributes->except(\App\View\Components\AppLayout::ignoredParameterNames()); ?>
<?php endif; ?>
<?php $component->withAttributes([]); ?>
     <?php $__env->slot('header', null, []); ?> 
        <div class="flex items-center justify-between">
            <div>
                <h1 class="text-3xl font-bold text-amber-700">INTERIA</h1>
                <p class="text-stone-600 mt-2 font-medium">Jelajahi Koleksi Furniture Kami</p>
            </div>
        </div>
     <?php $__env->endSlot(); ?>

    <style>
        body {
            background: #ffffff;
        }

        .glass-card {
            background: white;
            backdrop-filter: blur(12px);
            border: 1px solid #e7e2d9;
            box-shadow: 0 10px 40px -15px rgba(120, 80, 50, 0.1);
        }

        .gradient-primary {
            background: linear-gradient(135deg, #fef9c3 0%, #fed7aa 50%, #fde68a 100%);
            color: #78350f !important;
            font-weight: bold;
        }

        .gradient-primary:hover {
            background: linear-gradient(135deg, #fde68a 0%, #fdba74 50%, #fef9c3 100%);
            transform: translateY(-2px);
            box-shadow: 0 10px 25px -5px rgba(253, 186, 116, 0.3);
        }

        .input-group {
            position: relative;
        }

        .input-icon {
            position: absolute;
            left: 1rem;
            top: 50%;
            transform: translateY(-50%);
            color: #a8a29e;
        }

        .input-field {
            padding-left: 3rem;
            background: white;
            border: 1px solid #e7e2d9;
            color: #44403c;
            transition: all 0.3s ease;
            width: 100%;
        }

        .input-field:focus {
            border-color: #fed7aa;
            box-shadow: 0 0 0 3px rgba(253, 186, 116, 0.2);
            outline: none;
        }

        select.input-field {
            background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%2392857d' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");
            background-position: right 0.5rem center;
            background-repeat: no-repeat;
            background-size: 1.5em 1.5em;
            padding-right: 2.5rem;
            -webkit-appearance: none;
            appearance: none;
        }

        .product-card {
            transition: all 0.3s ease;
            background: white;
            border: 1px solid #e7e2d9;
            border-radius: 1rem;
            overflow: hidden;
        }

        .product-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 20px 40px -15px rgba(253, 186, 116, 0.15);
            border-color: #fed7aa;
        }

        .stock-badge {
            background: rgba(255, 255, 255, 0.95);
            border: 1px solid #e7e2d9;
            color: #44403c;
            font-weight: 600;
            padding: 0.5rem 1rem;
            border-radius: 9999px;
            font-size: 0.75rem;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.03);
        }

        .price-gradient {
            background: linear-gradient(135deg, #f97316 0%, #fbbf24 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            font-weight: 800;
        }

        label {
            color: #57534e;
            font-weight: 600;
            font-size: 0.875rem;
        }
    </style>

    
    <div class="space-y-12">

            
            <div class="glass-card rounded-3xl p-8 mb-12">
                <form method="GET" action="<?php echo e(route('product.index')); ?>">
                    <div class="grid grid-cols-1 md:grid-cols-12 gap-6">

                        <div class="md:col-span-4">
                            <label class="block text-sm font-semibold text-stone-600 mb-3">
                                Cari Produk
                            </label>
                            <div class="input-group">
                                <div class="input-icon">
                                    <i class="fas fa-search text-stone-400"></i>
                                </div>
                                <input type="text"
                                    name="search"
                                    value="<?php echo e(request('search')); ?>"
                                    placeholder="Ketik nama produk..."
                                    class="w-full input-field py-3 rounded-xl">
                            </div>
                        </div>

                        <div class="md:col-span-3">
                            <label class="block text-sm font-semibold text-stone-600 mb-3">
                                Kategori
                            </label>
                            <select name="category"
                                class="w-full input-field py-3 rounded-xl">
                                <option value="">Semua Kategori</option>
                                <?php $__currentLoopData = $categories; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $category): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                <option value="<?php echo e($category->category_id); ?>" <?php echo e(request('category') == $category->category_id ? 'selected' : ''); ?>>
                                    <?php echo e($category->category_name); ?>

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

                        <div class="md:col-span-3">
                            <label class="block text-sm font-semibold text-stone-600 mb-3">
                                Urutkan
                            </label>
                            <select name="sort"
                                class="w-full input-field py-3 rounded-xl">
                                <option value="">Terbaru</option>
                                <option value="price_low">Harga Rendah</option>
                                <option value="price_high">Harga Tinggi</option>
                                <option value="name">Nama A-Z</option>
                            </select>
                        </div>

                        <div class="md:col-span-2 flex items-end">
                            <button type="submit"
                                class="w-full gradient-primary text-white font-semibold py-3 rounded-xl shadow-lg transition">
                                Filter
                            </button>
                        </div>

                    </div>
                </form>
            </div>

            
            <?php if($products->count() > 0): ?>
            <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-8">
                <?php $__currentLoopData = $products; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $product): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                <?php
                $images = is_array($product->image) ? $product->image : json_decode($product->image);
                ?>

                <div class="product-card flex flex-col">

                    <a href="<?php echo e(route('product.show', $product->product_id)); ?>"
                        class="block relative bg-stone-100">
                        <?php if($images && count($images) > 0): ?>
                        <img src="<?php echo e(asset('storage/'.$images[0])); ?>"
                            class="w-full h-64 object-cover hover:scale-110 transition duration-700">
                        <?php else: ?>
                        <div class="w-full h-64 flex items-center justify-center bg-stone-100">
                            <i class="fas fa-image text-4xl text-stone-400"></i>
                        </div>
                        <?php endif; ?>

                        <div class="absolute top-4 right-4">
                            <?php if($product->stock > 0): ?>
                            <span class="stock-badge text-emerald-600 text-xs font-bold px-4 py-2 rounded-full">
                                Stok: <?php echo e($product->stock); ?>

                            </span>
                            <?php else: ?>
                            <span class="stock-badge text-rose-600 text-xs font-bold px-4 py-2 rounded-full">
                                Habis
                            </span>
                            <?php endif; ?>
                        </div>
                    </a>

                    <div class="p-6 flex flex-col flex-1 bg-white">

                        <span class="text-amber-600 text-sm font-semibold mb-2">
                            <?php echo e($product->category->category_name ?? 'Uncategorized'); ?>

                        </span>

                        <a href="<?php echo e(route('product.show', $product->product_id)); ?>"
                            class="font-bold text-xl text-stone-800 mb-3 hover:text-amber-600 transition">
                            <?php echo e($product->product_name); ?>

                        </a>

                        <p class="text-sm text-stone-600 mb-6">
                            <?php echo e(Str::limit($product->description, 80)); ?>

                        </p>

                        <div class="mt-auto">
                            <p class="text-2xl font-extrabold price-gradient mb-6">
                                Rp <?php echo e(number_format($product->price, 0, ',', '.')); ?>

                            </p>

                            <?php if(auth()->guard()->check()): ?>
                                <?php if(!auth()->user()->isAdmin()): ?>
                            <div class="grid grid-cols-2 gap-3">

                                
                                <form action="<?php echo e(route('cart.store')); ?>" method="POST">
                                    <?php echo csrf_field(); ?>
                                    <input type="hidden" name="product_id" value="<?php echo e($product->product_id); ?>">
                                    <button type="submit"
                                        class="w-full border border-amber-700 text-amber-700 font-semibold py-3 rounded-xl hover:bg-amber-50 transition">
                                        Keranjang
                                    </button>
                                </form>

                                
                                <form action="<?php echo e(route('order.buyNow')); ?>" method="POST">
                                    <?php echo csrf_field(); ?>
                                    <input type="hidden" name="product_id" value="<?php echo e($product->product_id); ?>">
                                    <button type="submit"
                                        class="w-full gradient-primary text-white font-semibold py-3 rounded-xl">
                                        Beli
                                    </button>
                                </form>
                            </div>
                                <?php endif; ?>
                            <?php endif; ?>
                        </div>
                    </div>
                </div>
                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
            </div>
            <?php else: ?>
            <div class="bg-white rounded-3xl p-16 text-center border border-stone-200">
                <h3 class="text-3xl font-bold text-stone-800 mb-4">
                    Produk Tidak Ditemukan
                </h3>
                <p class="text-stone-600">
                    Coba ubah filter atau kata kunci pencarian.
                </p>
            </div>
            <?php endif; ?>

    </div>
 <?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54)): ?>
<?php $attributes = $__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54; ?>
<?php unset($__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54); ?>
<?php endif; ?>
<?php if (isset($__componentOriginal9ac128a9029c0e4701924bd2d73d7f54)): ?>
<?php $component = $__componentOriginal9ac128a9029c0e4701924bd2d73d7f54; ?>
<?php unset($__componentOriginal9ac128a9029c0e4701924bd2d73d7f54); ?>
<?php endif; ?><?php /**PATH C:\laragon\www\interia\resources\views/product/index.blade.php ENDPATH**/ ?>