<?php $__env->startSection('content'); ?>
    <div class="space-y-6">
        <div class="flex flex-wrap items-center justify-between gap-4">
            <div>
                <h2 class="text-2xl font-semibold text-slate-900">Dashboard</h2>
                <p class="text-sm text-slate-500">Ringkasan performa bisnis hari ini.</p>
            </div>
        </div>

        <div class="grid gap-4 md:grid-cols-2 xl:grid-cols-4">
            <div class="rounded-2xl border border-amber-100 bg-gradient-to-br from-white to-amber-50 p-5 shadow-sm">
                <div class="flex items-center justify-between">
                    <div>
                        <p class="text-xs uppercase tracking-[0.2em] text-amber-700/70">Total Item Menu</p>
                        <p class="mt-2 text-3xl font-semibold text-slate-900"><?php echo e($totalMenu); ?></p>
                    </div>
                    <div class="flex h-12 w-12 items-center justify-center rounded-xl bg-amber-100 text-amber-700">
                        <svg class="h-6 w-6" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
                            <path d="M5 3a1 1 0 0 1 1 1v5a3 3 0 0 0 6 0V4a1 1 0 1 1 2 0v5a5 5 0 0 1-4 4.9V18a1 1 0 1 1-2 0v-4.1A5 5 0 0 1 4 9V4a1 1 0 0 1 1-1Z"/>
                        </svg>
                    </div>
                </div>
            </div>

            <div class="rounded-2xl border border-indigo-100 bg-gradient-to-br from-white to-indigo-50 p-5 shadow-sm">
                <div class="flex items-center justify-between">
                    <div>
                        <p class="text-xs uppercase tracking-[0.2em] text-indigo-700/70">Total Transaksi</p>
                        <p class="mt-2 text-3xl font-semibold text-slate-900"><?php echo e($totalTransaksi); ?></p>
                    </div>
                    <div class="flex h-12 w-12 items-center justify-center rounded-xl bg-indigo-100 text-indigo-700">
                        <svg class="h-6 w-6" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
                            <path d="M6 4a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V8.414a2 2 0 0 0-.586-1.414l-2.414-2.414A2 2 0 0 0 11.586 4H6Zm4 8H7a1 1 0 1 1 0-2h3a1 1 0 1 1 0 2Zm3 3H7a1 1 0 1 1 0-2h6a1 1 0 1 1 0 2Z"/>
                        </svg>
                    </div>
                </div>
            </div>

            <div class="rounded-2xl border border-sky-100 bg-gradient-to-br from-white to-sky-50 p-5 shadow-sm">
                <div class="flex items-center justify-between">
                    <div>
                        <p class="text-xs uppercase tracking-[0.2em] text-sky-700/70">Total Omzet</p>
                        <p class="mt-2 text-2xl font-semibold text-slate-900"><?php echo e(format_rupiah($totalOmzet)); ?></p>
                    </div>
                    <div class="flex h-12 w-12 items-center justify-center rounded-xl bg-sky-100 text-sky-700">
                        <svg class="h-6 w-6" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
                            <path d="M3 3a1 1 0 0 1 1 1v12h12a1 1 0 1 1 0 2H4a2 2 0 0 1-2-2V4a1 1 0 0 1 1-1Zm12 4a1 1 0 0 1 .993.883L16 8v6a1 1 0 1 1-2 0V9.414l-3.293 3.293a1 1 0 0 1-1.414 0L7 10.414l-1.293 1.293a1 1 0 1 1-1.414-1.414l2-2a1 1 0 0 1 1.414 0L10 10.586l2.586-2.586A1 1 0 0 1 13 7h2Z"/>
                        </svg>
                    </div>
                </div>
            </div>

            <div class="rounded-2xl border border-emerald-100 bg-gradient-to-br from-white to-emerald-50 p-5 shadow-sm">
                <div class="flex items-center justify-between">
                    <div>
                        <p class="text-xs uppercase tracking-[0.2em] text-emerald-700/70">Total Profit</p>
                        <p class="mt-2 text-2xl font-semibold text-slate-900"><?php echo e(format_rupiah($totalProfit)); ?></p>
                    </div>
                    <div class="flex h-12 w-12 items-center justify-center rounded-xl bg-emerald-100 text-emerald-700 text-xl font-bold">
                        $
                    </div>
                </div>
            </div>
        </div>

        <?php if (isset($component)) { $__componentOriginal53747ceb358d30c0105769f8471417f6 = $component; } ?>
<?php if (isset($attributes)) { $__attributesOriginal53747ceb358d30c0105769f8471417f6 = $attributes; } ?>
<?php $component = Illuminate\View\AnonymousComponent::resolve(['view' => 'components.card','data' => ['class' => 'overflow-hidden']] + (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag ? $attributes->all() : [])); ?>
<?php $component->withName('card'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php if (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag): ?>
<?php $attributes = $attributes->except(\Illuminate\View\AnonymousComponent::ignoredParameterNames()); ?>
<?php endif; ?>
<?php $component->withAttributes(['class' => 'overflow-hidden']); ?>
            <div class="flex flex-wrap items-center justify-between gap-3">
                <div>
                    <h3 class="text-lg font-semibold text-slate-900">Trend Penjualan Bulanan</h3>
                    <p class="text-sm text-slate-500">Trend penjualan 12 bulan terakhir.</p>
                </div>
            </div>
            <div class="mt-4 w-full">
                <canvas id="sales-trend-chart" height="140"></canvas>
            </div>
         <?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__attributesOriginal53747ceb358d30c0105769f8471417f6)): ?>
<?php $attributes = $__attributesOriginal53747ceb358d30c0105769f8471417f6; ?>
<?php unset($__attributesOriginal53747ceb358d30c0105769f8471417f6); ?>
<?php endif; ?>
<?php if (isset($__componentOriginal53747ceb358d30c0105769f8471417f6)): ?>
<?php $component = $__componentOriginal53747ceb358d30c0105769f8471417f6; ?>
<?php unset($__componentOriginal53747ceb358d30c0105769f8471417f6); ?>
<?php endif; ?>

        <div class="grid gap-4 lg:grid-cols-2">
            <?php if (isset($component)) { $__componentOriginal53747ceb358d30c0105769f8471417f6 = $component; } ?>
<?php if (isset($attributes)) { $__attributesOriginal53747ceb358d30c0105769f8471417f6 = $attributes; } ?>
<?php $component = Illuminate\View\AnonymousComponent::resolve(['view' => 'components.card','data' => []] + (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag ? $attributes->all() : [])); ?>
<?php $component->withName('card'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php if (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag): ?>
<?php $attributes = $attributes->except(\Illuminate\View\AnonymousComponent::ignoredParameterNames()); ?>
<?php endif; ?>
<?php $component->withAttributes([]); ?>
                <div class="flex items-center justify-between">
                    <div>
                        <h3 class="text-lg font-semibold text-slate-900">Komposisi Omzet vs Profit</h3>
                        <p class="text-sm text-slate-500">Perbandingan omset dan profit.</p>
                    </div>
                </div>
                <div class="mt-4 flex items-center justify-center">
                    <div class="w-full max-w-xs">
                        <canvas id="profit-pie-chart" height="220"></canvas>
                    </div>
                </div>
             <?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__attributesOriginal53747ceb358d30c0105769f8471417f6)): ?>
<?php $attributes = $__attributesOriginal53747ceb358d30c0105769f8471417f6; ?>
<?php unset($__attributesOriginal53747ceb358d30c0105769f8471417f6); ?>
<?php endif; ?>
<?php if (isset($__componentOriginal53747ceb358d30c0105769f8471417f6)): ?>
<?php $component = $__componentOriginal53747ceb358d30c0105769f8471417f6; ?>
<?php unset($__componentOriginal53747ceb358d30c0105769f8471417f6); ?>
<?php endif; ?>
            <?php if (isset($component)) { $__componentOriginal53747ceb358d30c0105769f8471417f6 = $component; } ?>
<?php if (isset($attributes)) { $__attributesOriginal53747ceb358d30c0105769f8471417f6 = $attributes; } ?>
<?php $component = Illuminate\View\AnonymousComponent::resolve(['view' => 'components.card','data' => []] + (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag ? $attributes->all() : [])); ?>
<?php $component->withName('card'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php if (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag): ?>
<?php $attributes = $attributes->except(\Illuminate\View\AnonymousComponent::ignoredParameterNames()); ?>
<?php endif; ?>
<?php $component->withAttributes([]); ?>
                <div class="flex items-center justify-between">
                    <div>
                        <h3 class="text-lg font-semibold text-slate-900">Menu Terlaris</h3>
                        <p class="text-sm text-slate-500">Total omset per tipe menu.</p>
                    </div>
                </div>
                <div class="mt-4 flex items-center justify-center">
                    <div class="w-full max-w-xs">
                        <canvas id="menu-type-pie-chart" height="220"></canvas>
                    </div>
                </div>
             <?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__attributesOriginal53747ceb358d30c0105769f8471417f6)): ?>
<?php $attributes = $__attributesOriginal53747ceb358d30c0105769f8471417f6; ?>
<?php unset($__attributesOriginal53747ceb358d30c0105769f8471417f6); ?>
<?php endif; ?>
<?php if (isset($__componentOriginal53747ceb358d30c0105769f8471417f6)): ?>
<?php $component = $__componentOriginal53747ceb358d30c0105769f8471417f6; ?>
<?php unset($__componentOriginal53747ceb358d30c0105769f8471417f6); ?>
<?php endif; ?>
        </div>
    </div>

    <?php $__env->startPush('scripts'); ?>
        <script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.2/dist/chart.umd.min.js"></script>
        <script>
            const chartLabels = <?php echo json_encode($chartLabels, 15, 512) ?>;
            const chartSalesCurrent = <?php echo json_encode($chartSalesCurrent, 15, 512) ?>;
            const chartSalesPrevious = <?php echo json_encode($chartSalesPrevious, 15, 512) ?>;
            const currentYear = <?php echo json_encode($currentYear, 15, 512) ?>;
            const previousYear = <?php echo json_encode($previousYear, 15, 512) ?>;
            const ctx = document.getElementById('sales-trend-chart');
            const totalOmzet = <?php echo json_encode((float) $totalOmzet, 15, 512) ?>;
            const totalProfit = <?php echo json_encode((float) $totalProfit, 15, 512) ?>;
            const menuTypeLabels = <?php echo json_encode($menuTypeLabels, 15, 512) ?>;
            const menuTypeSales = <?php echo json_encode($menuTypeSales, 15, 512) ?>;

            if (ctx) {
                new Chart(ctx, {
                    type: 'line',
                    data: {
                        labels: chartLabels,
                        datasets: [
                            {
                                label: String(previousYear),
                                data: chartSalesPrevious,
                                borderColor: '#60a5fa',
                                backgroundColor: 'rgba(96, 165, 250, 0.12)',
                                tension: 0.35,
                                fill: false,
                                pointRadius: 3,
                                pointBackgroundColor: '#60a5fa',
                            },
                            {
                                label: String(currentYear),
                                data: chartSalesCurrent,
                                borderColor: '#f59e0b',
                                backgroundColor: 'rgba(245, 158, 11, 0.15)',
                                tension: 0.35,
                                fill: false,
                                pointRadius: 3,
                                pointBackgroundColor: '#f59e0b',
                            },
                        ],
                    },
                    options: {
                        responsive: true,
                        maintainAspectRatio: false,
                        plugins: {
                            legend: {
                                position: 'bottom',
                                labels: { usePointStyle: true },
                            },
                        },
                        scales: {
                            y: {
                                ticks: {
                                    callback: (value) => new Intl.NumberFormat('id-ID').format(value),
                                    maxTicksLimit: 10,
                                    autoSkip: false,
                                },
                                grid: { color: 'rgba(148, 163, 184, 0.2)' },
                            },
                            x: {
                                grid: { display: false },
                            },
                        },
                    },
                });
            }

            const pieCtx = document.getElementById('profit-pie-chart');
            if (pieCtx) {
                new Chart(pieCtx, {
                    type: 'pie',
                    data: {
                        labels: ['Omzet', 'Profit'],
                        datasets: [{
                            data: [totalOmzet, totalProfit],
                            backgroundColor: ['#0ea5e9', '#22c55e'],
                            borderColor: '#ffffff',
                            borderWidth: 2,
                        }],
                    },
                    options: {
                        plugins: {
                            legend: {
                                position: 'bottom',
                                labels: { usePointStyle: true },
                            },
                            tooltip: {
                                callbacks: {
                                    label: (context) => {
                                        const value = context.raw || 0;
                                        return `${context.label}: ${new Intl.NumberFormat('id-ID').format(value)}`;
                                    },
                                },
                            },
                        },
                    },
                });
            }

            const menuPieCtx = document.getElementById('menu-type-pie-chart');
            if (menuPieCtx) {
                new Chart(menuPieCtx, {
                    type: 'pie',
                    data: {
                        labels: menuTypeLabels,
                        datasets: [{
                            data: menuTypeSales,
                            backgroundColor: ['#f97316', '#0ea5e9', '#8b5cf6'],
                            borderColor: '#ffffff',
                            borderWidth: 2,
                        }],
                    },
                    options: {
                        plugins: {
                            legend: {
                                position: 'bottom',
                                labels: { usePointStyle: true },
                            },
                            tooltip: {
                                callbacks: {
                                    label: (context) => {
                                        const value = context.raw || 0;
                                        return `${context.label}: ${new Intl.NumberFormat('id-ID').format(value)}`;
                                    },
                                },
                            },
                        },
                    },
                });
            }
        </script>
    <?php $__env->stopPush(); ?>
<?php $__env->stopSection(); ?>

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