<?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, []); ?> 
        <style>
            .dash-header-title {
                font-weight: 600;
                font-size: 1.5rem;
                letter-spacing: -0.01em;
                color: #0f0f0f;
            }
        </style>
        <h2 class="dash-header-title">Produk</h2>
     <?php $__env->endSlot(); ?>

    <style>
        .prod-wrap { 
            font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; 
        }

        .prod-inner {
            max-width: 1280px;
            margin: 0 auto;
            padding: 40px 24px;
        }

        /* ── TOP BAR ── */
        .prod-topbar {
            display: flex;
            align-items: flex-end;
            justify-content: space-between;
            margin-bottom: 32px;
        }

        .prod-eyebrow {
            font-size: 0.65rem;
            font-weight: 600;
            letter-spacing: 0.05em;
            text-transform: uppercase;
            color: #999;
            margin-bottom: 4px;
        }

        .prod-title {
            font-size: 1.5rem;
            font-weight: 600;
            color: #0f0f0f;
            letter-spacing: -0.01em;
        }

        .prod-add-btn {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            background: #0f0f0f;
            color: #fff;
            font-family: inherit;
            font-size: 0.7rem;
            font-weight: 600;
            letter-spacing: 0.05em;
            text-transform: uppercase;
            text-decoration: none;
            padding: 10px 22px;
            border-radius: 30px;
            transition: background 0.2s;
            white-space: nowrap;
        }

        .prod-add-btn:hover { background: #333; }

        .prod-add-btn-plus {
            font-size: 1.1rem;
            font-weight: 400;
            line-height: 1;
        }

        /* ── TABLE WRAP ── */
        .prod-table-wrap {
            background: #fff;
            border: 1px solid #ebebeb;
            border-radius: 12px;
            overflow-x: auto;
        }

        .prod-table {
            width: 100%;
            border-collapse: collapse;
            min-width: 800px;
        }

        .prod-table thead th {
            padding: 14px 20px;
            font-size: 0.65rem;
            font-weight: 600;
            letter-spacing: 0.05em;
            text-transform: uppercase;
            color: #999;
            background: #fafafa;
            border-bottom: 1px solid #f0f0f0;
            text-align: left;
        }

        .prod-table thead th.right { text-align: right; }

        .prod-table tbody tr {
            border-bottom: 1px solid #f5f5f5;
            transition: background 0.15s;
        }

        .prod-table tbody tr:last-child { border-bottom: none; }
        .prod-table tbody tr:hover { background: #fafafa; }

        .prod-table td {
            padding: 16px 20px;
            vertical-align: middle;
        }

        /* ── PRODUCT IMAGE ── */
        .prod-img {
            width: 48px;
            height: 48px;
            object-fit: cover;
            border-radius: 8px;
            border: 1px solid #f0f0f0;
            display: block;
        }

        .prod-img-placeholder {
            width: 48px;
            height: 48px;
            background: #f5f5f5;
            border-radius: 8px;
            border: 1px solid #f0f0f0;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        /* ── PRODUCT NAME ── */
        .prod-name {
            font-size: 0.9rem;
            font-weight: 600;
            color: #1a1a1a;
        }

        /* ── CATEGORY BADGE ── */
        .prod-cat-badge {
            display: inline-block;
            font-size: 0.65rem;
            font-weight: 500;
            letter-spacing: 0.02em;
            color: #999;
            background: #f5f5f5;
            border: 1px solid #ebebeb;
            padding: 4px 12px;
            border-radius: 30px;
        }

        /* ── PRICE ── */
        .prod-price-main {
            font-size: 0.85rem;
            font-weight: 600;
            color: #1a1a1a;
        }

        .prod-price-range {
            font-size: 0.7rem;
            color: #bbb;
            margin-top: 2px;
        }

        .prod-no-variant {
            font-size: 0.7rem;
            color: #d4a017;
            letter-spacing: 0.02em;
        }

        /* ── VARIANTS ── */
        .prod-variant-row {
            display: flex;
            align-items: center;
            gap: 8px;
            margin-bottom: 6px;
            font-size: 0.75rem;
            color: #666;
        }

        .prod-variant-row:last-child { margin-bottom: 0; }

        .prod-variant-size {
            font-weight: 600;
            color: #999;
            width: 32px;
            flex-shrink: 0;
        }

        .prod-variant-color-dot {
            width: 10px;
            height: 10px;
            border-radius: 50%;
            border: 1px solid rgba(0,0,0,0.08);
            flex-shrink: 0;
        }

        .prod-variant-stock-ok   { font-weight: 600; color: #2e7d32; margin-left: auto; }
        .prod-variant-stock-zero { font-weight: 600; color: #c62828; margin-left: auto; }

        .prod-variant-more {
            font-size: 0.65rem;
            color: #ccc;
            letter-spacing: 0.02em;
            margin-top: 4px;
        }

        /* ── TOTAL STOCK BADGE ── */
        .prod-stock-ok {
            display: inline-block;
            font-size: 0.65rem;
            font-weight: 600;
            letter-spacing: 0.02em;
            padding: 4px 12px;
            border-radius: 30px;
            background: #e8f5e9;
            color: #2e7d32;
            border: 1px solid #c8e6d4;
        }

        .prod-stock-zero {
            display: inline-block;
            font-size: 0.65rem;
            font-weight: 600;
            letter-spacing: 0.02em;
            padding: 4px 12px;
            border-radius: 30px;
            background: #ffebee;
            color: #c62828;
            border: 1px solid #f5c6c1;
        }

        /* ── ACTIONS ── */
        .prod-actions {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            gap: 20px;
        }

        .prod-edit-link {
            font-size: 0.7rem;
            font-weight: 600;
            letter-spacing: 0.05em;
            text-transform: uppercase;
            color: #aaa;
            text-decoration: none;
            padding-bottom: 2px;
            border-bottom: 1px solid transparent;
            transition: color 0.2s, border-color 0.2s;
        }

        .prod-edit-link:hover { color: #0f0f0f; border-bottom-color: #0f0f0f; }

        .prod-delete-btn {
            font-size: 0.7rem;
            font-weight: 600;
            letter-spacing: 0.05em;
            text-transform: uppercase;
            color: #ccc;
            background: none;
            border: none;
            cursor: pointer;
            padding: 0;
            padding-bottom: 2px;
            border-bottom: 1px solid transparent;
            font-family: inherit;
            transition: color 0.2s, border-color 0.2s;
        }

        .prod-delete-btn:hover { color: #c62828; border-bottom-color: #c62828; }

        /* ── EMPTY STATE ── */
        .prod-empty {
            padding: 72px 28px;
            text-align: center;
        }

        .prod-empty-title {
            font-size: 1.1rem;
            font-weight: 500;
            color: #ccc;
            margin-bottom: 8px;
        }

        .prod-empty-desc {
            font-size: 0.8rem;
            font-weight: 400;
            color: #ddd;
            letter-spacing: 0.02em;
            margin-bottom: 24px;
        }

        .prod-empty-btn {
            display: inline-block;
            background: #0f0f0f;
            color: #fff;
            font-family: inherit;
            font-size: 0.7rem;
            font-weight: 600;
            letter-spacing: 0.05em;
            text-transform: uppercase;
            text-decoration: none;
            padding: 10px 24px;
            border-radius: 30px;
            transition: background 0.2s;
        }

        .prod-empty-btn:hover { background: #333; }

        /* ── PAGINATION ── */
        .prod-pagination {
            margin-top: 24px;
        }
    </style>

    <div class="prod-wrap">
        <div class="prod-inner">

            
            <div class="prod-topbar">
                <div>
                    <div class="prod-title">Daftar Produk</div>
                </div>
                <a href="<?php echo e(route('admin.products.create')); ?>" class="prod-add-btn">
                    <span class="prod-add-btn-plus">+</span> Tambah Produk
                </a>
            </div>

            
            <div class="prod-table-wrap">
                <table class="prod-table">
                    <thead>
                        <tr>
                            <th>Gambar</th>
                            <th>Nama Produk</th>
                            <th>Kategori</th>
                            <th>Harga</th>
                            <th>Stok per Varian</th>
                            <th>Total Stok</th>
                            <th class="right">Aksi</th>
                        </tr>
                    </thead>
                    <tbody>
                        <?php $__empty_1 = true; $__currentLoopData = $products; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $product): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_1 = false; ?>
                        <tr>
                            
                            <td>
                                <?php
                                    $primaryImg   = $product->images->where('is_primary', true)->first();
                                    $firstImg     = $product->images->first();
                                    $productImage = $primaryImg ?: $firstImg;
                                ?>
                                <?php if($productImage): ?>
                                    <img src="<?php echo e(asset('storage/' . $productImage->image_path)); ?>"
                                         class="prod-img"
                                         alt="<?php echo e($product->name); ?>">
                                <?php else: ?>
                                    <div class="prod-img-placeholder">
                                        <svg width="20" height="20" fill="none" stroke="#ccc" viewBox="0 0 24 24">
                                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"
                                                d="M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z" />
                                        </svg>
                                    </div>
                                <?php endif; ?>
                            </td>

                            
                            <td>
                                <span class="prod-name"><?php echo e($product->name); ?></span>
                            </td>

                            
                            <td>
                                <span class="prod-cat-badge"><?php echo e($product->category->name ?? '—'); ?></span>
                            </td>

                            
                            <td>
                                <?php if($product->variants && $product->variants->count() > 0): ?>
                                    <?php
                                        $prices   = $product->variants->pluck('additional_price')->filter();
                                        $minPrice = $prices->min();
                                        $maxPrice = $prices->max();
                                    ?>
                                    <div class="prod-price-main">Rp <?php echo e(number_format($minPrice, 0, ',', '.')); ?></div>
                                    <?php if($minPrice != $maxPrice): ?>
                                        <div class="prod-price-range">— <?php echo e(number_format($maxPrice, 0, ',', '.')); ?></div>
                                    <?php endif; ?>
                                <?php else: ?>
                                    <span class="prod-no-variant">Belum ada varian</span>
                                <?php endif; ?>
                            </td>

                            
                            <td>
                                <?php if($product->variants && $product->variants->count() > 0): ?>
                                    <?php $__currentLoopData = $product->variants->take(3); $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $variant): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                        <div class="prod-variant-row">
                                            <span class="prod-variant-size"><?php echo e($variant->size ?? '—'); ?></span>
                                            <?php if($variant->color_code): ?>
                                                <span class="prod-variant-color-dot"
                                                      style="background-color: <?php echo e($variant->color_code); ?>"></span>
                                            <?php endif; ?>
                                            <span><?php echo e($variant->color ?? '—'); ?></span>
                                            <span class="<?php echo e($variant->stock > 0 ? 'prod-variant-stock-ok' : 'prod-variant-stock-zero'); ?>">
                                                <?php echo e($variant->stock); ?>

                                            </span>
                                        </div>
                                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                    <?php if($product->variants->count() > 3): ?>
                                        <div class="prod-variant-more">+<?php echo e($product->variants->count() - 3); ?> lainnya</div>
                                    <?php endif; ?>
                                <?php else: ?>
                                    <span style="color:#ddd; font-size:0.8rem;">—</span>
                                <?php endif; ?>
                            </td>

                            
                            <td>
                                <?php $totalStock = $product->variants->sum('stock'); ?>
                                <?php if($totalStock > 0): ?>
                                    <span class="prod-stock-ok"><?php echo e($totalStock); ?> Item</span>
                                <?php else: ?>
                                    <span class="prod-stock-zero">Habis</span>
                                <?php endif; ?>
                            </td>

                            
                            <td>
                                <div class="prod-actions">
                                    <a href="<?php echo e(route('admin.products.edit', $product->id)); ?>" class="prod-edit-link">Edit</a>

                                    <form action="<?php echo e(route('admin.products.destroy', $product->id)); ?>"
                                          method="POST"
                                          class="inline"
                                          onsubmit="return confirm('Hapus produk \'<?php echo e($product->name); ?>\'?')">
                                        <?php echo csrf_field(); ?>
                                        <?php echo method_field('DELETE'); ?>
                                        <button type="submit" class="prod-delete-btn">Hapus</button>
                                    </form>
                                </div>
                            </td>
                        </tr>
                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_1): ?>
                        <tr>
                            <td colspan="7">
                                <div class="prod-empty">
                                    <div class="prod-empty-title">Belum ada produk</div>
                                    <div class="prod-empty-desc">Mulai dengan menambahkan produk pertama Anda</div>
                                    <a href="<?php echo e(route('admin.products.create')); ?>" class="prod-empty-btn">+ Tambah Produk</a>
                                </div>
                            </td>
                        </tr>
                        <?php endif; ?>
                    </tbody>
                </table>
            </div>

            
            <?php if($products->hasPages()): ?>
            <div class="prod-pagination">
                <?php echo e($products->withQueryString()->links()); ?>

            </div>
            <?php endif; ?>

        </div>
    </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\toko\resources\views/admin/products/index.blade.php ENDPATH**/ ?>