<?php $__env->startSection('title', 'Product Performance'); ?>
<?php $__env->startSection('page-title', 'Product Performance'); ?>

<?php $__env->startSection('content'); ?>
<!-- Search & Filter Form -->
<div class="mb-6 rounded-2xl border border-slate-200 bg-white p-5 shadow-soft dark:border-slate-800 dark:bg-slate-950">
    <form method="GET" action="<?php echo e(route('admin.reports.products')); ?>" class="flex flex-col md:flex-row items-end justify-between gap-4">
        <div class="flex-1 grid grid-cols-1 sm:grid-cols-2 gap-4 w-full">
            <div>
                <label class="block text-xs font-semibold text-gray-500 dark:text-gray-400 uppercase tracking-wider mb-2">Start Date</label>
                <input type="date" name="date_from" value="<?php echo e($dateFrom); ?>"
                       class="w-full py-2.5 px-4 bg-white dark:bg-gray-900 border border-gray-300 dark:border-gray-700 rounded-lg text-sm text-gray-900 dark:text-white focus:outline-none focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-transparent">
            </div>
            <div>
                <label class="block text-xs font-semibold text-gray-500 dark:text-gray-400 uppercase tracking-wider mb-2">End Date</label>
                <input type="date" name="date_to" value="<?php echo e($dateTo); ?>"
                       class="w-full py-2.5 px-4 bg-white dark:bg-gray-900 border border-gray-300 dark:border-gray-700 rounded-lg text-sm text-gray-900 dark:text-white focus:outline-none focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-transparent">
            </div>
        </div>
        <div class="flex items-center gap-3 w-full md:w-auto">
            <button type="submit" class="btn-primary w-full md:w-auto">
                <i class="fas fa-sync mr-2 text-xs"></i> Update Report
            </button>
            <button type="button" onclick="window.print()" class="btn-secondary w-full md:w-auto">
                <i class="fas fa-print mr-2 text-xs"></i> Print Report
            </button>
        </div>
    </form>
</div>

<!-- Product Metrics Cards -->
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 mb-6">
    <!-- Active Sales Products -->
    <div class="bg-white dark:bg-gray-950 border border-gray-200 dark:border-gray-800 rounded-lg p-5">
        <span class="text-xs font-semibold text-gray-500 dark:text-gray-400 uppercase tracking-wider block mb-1">On Sale Catalog Items</span>
        <h3 class="text-2xl font-extrabold text-blue-600 dark:text-blue-400"><?php echo e($onSaleCount); ?></h3>
    </div>

    <!-- Products Out of Stock -->
    <div class="bg-white dark:bg-gray-950 border border-gray-200 dark:border-gray-800 rounded-lg p-5">
        <span class="text-xs font-semibold text-gray-500 dark:text-gray-400 uppercase tracking-wider block mb-1">Out Of Stock Products</span>
        <h3 class="text-2xl font-extrabold <?php echo e($lowStockProducts->count() > 0 ? 'text-rose-600 dark:text-rose-400' : 'text-gray-950 dark:text-white'); ?>">
            <?php echo e($lowStockProducts->count()); ?>

        </h3>
    </div>

    <!-- Distinct Best Sellers -->
    <div class="bg-white dark:bg-gray-950 border border-gray-200 dark:border-gray-800 rounded-lg p-5">
        <span class="text-xs font-semibold text-gray-500 dark:text-gray-400 uppercase tracking-wider block mb-1">Unique Sold Products</span>
        <h3 class="text-2xl font-extrabold text-green-600 dark:text-green-400"><?php echo e($productStats->count()); ?></h3>
    </div>
</div>

<div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
    <!-- Best Sellers Table -->
    <div class="lg:col-span-2 bg-white dark:bg-gray-950 border border-gray-200 dark:border-gray-800 rounded-lg overflow-hidden flex flex-col justify-between">
        <div class="px-6 py-4 border-b border-gray-200 dark:border-gray-800">
            <h3 class="text-base font-bold text-gray-900 dark:text-white">Product Sales Performance</h3>
        </div>
        
        <div class="p-6 flex-1">
            <div class="overflow-visible">
                <table id="productReportTable" class="dataTable">
                    <thead>
                        <tr>
                            <th>Product Name</th>
                            <th>Regular Price</th>
                            <th>Stock Status</th>
                            <th>Units Sold</th>
                            <th>Gross Income</th>
                        </tr>
                    </thead>
                    <tbody>
                        <?php $__currentLoopData = $productStats; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $stat): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                            <tr>
                                <td class="font-semibold text-gray-900 dark:text-white">
                                    <?php echo e($stat->name); ?>

                                </td>
                                <td class="text-gray-500 dark:text-gray-400">
                                    $<?php echo e(number_format($stat->price, 2)); ?>

                                </td>
                                <td>
                                    <?php if($stat->in_stock): ?>
                                        <span class="px-2 py-0.5 rounded bg-green-50 text-green-700 dark:bg-green-900/20 dark:text-green-400 text-xs font-semibold border border-green-200 dark:border-green-800">In Stock</span>
                                    <?php else: ?>
                                        <span class="px-2 py-0.5 rounded bg-rose-50 text-rose-700 dark:bg-rose-900/20 dark:text-rose-400 text-xs font-semibold border border-rose-200 dark:border-rose-800">Out of Stock</span>
                                    <?php endif; ?>
                                </td>
                                <td class="text-gray-900 dark:text-white font-medium">
                                    <?php echo e($stat->units_sold); ?> units
                                </td>
                                <td class="font-bold text-gray-900 dark:text-white">
                                    $<?php echo e(number_format($stat->gross_revenue, 2)); ?>

                                </td>
                            </tr>
                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                    </tbody>
                </table>
            </div>
        </div>
    </div>

    <!-- Low Stock Catalog Alerts -->
    <div class="bg-white dark:bg-gray-950 border border-gray-200 dark:border-gray-800 rounded-lg overflow-hidden mt-6">
        <div class="px-6 py-4 border-b border-gray-200 dark:border-gray-800">
            <h3 class="text-base font-bold text-gray-900 dark:text-white flex items-center">
                <i class="bi bi-exclamation-triangle-fill text-rose-500 mr-2"></i> Out Of Stock Checklist
            </h3>
        </div>
        <div class="p-6">
            <?php if($lowStockProducts->count() > 0): ?>
                <div class="space-y-4 max-h-[360px] overflow-y-auto pr-1">
                    <?php $__currentLoopData = $lowStockProducts; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $product): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                        <div class="flex items-center justify-between p-3 rounded-lg border border-rose-100 dark:border-rose-900/30 bg-rose-50/20 dark:bg-rose-950/10">
                            <div>
                                <h4 class="text-xs font-bold text-gray-900 dark:text-white"><?php echo e($product->name); ?></h4>
                                <span class="text-[10px] text-gray-400 dark:text-gray-500">ID: #<?php echo e($product->id); ?> | Category: <?php echo e($product->categoryRelation->name ?? 'Default'); ?></span>
                            </div>
                            <a href="<?php echo e(route('admin.products.edit', $product->id)); ?>" class="text-[10px] font-bold text-blue-600 dark:text-blue-400 hover:underline">
                                Edit Stock
                            </a>
                        </div>
                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                </div>
            <?php else: ?>
                <div class="text-center py-20 text-gray-500 dark:text-gray-400 text-sm">
                    <i class="bi bi-check-circle-fill text-emerald-500 text-3xl mb-3 block"></i>
                    <p>All catalog products are in stock!</p>
                </div>
            <?php endif; ?>
        </div>
    </div>
</div>

<!-- jQuery and DataTables JS -->
<link rel="stylesheet" href="https://cdn.datatables.net/responsive/2.5.0/css/responsive.dataTables.min.css">
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script src="https://cdn.datatables.net/1.13.7/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/responsive/2.5.0/js/dataTables.responsive.min.js"></script>

<?php echo $__env->make('admin.partials.datatables-styles', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?>
<script>
$(document).ready(function() {
    $('#productReportTable').DataTable({
        responsive: true,
        pageLength: 25,
        order: [[3, 'desc']],
        dom: '<"flex justify-between items-center mb-4"<"flex items-center gap-2"l><"flex items-center gap-2"f>>rt<"flex justify-between items-center mt-4"<"text-sm text-gray-600 dark:text-gray-400"i><"flex items-center gap-1"p>>'
    });
});
</script>
<?php $__env->stopSection(); ?>

<?php echo $__env->make('admin.layouts.app', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH /Users/mac/Documents/e-com/resources/views/admin/reports/products.blade.php ENDPATH**/ ?>