

<?php $__env->startSection('title', 'Finance Dashboard'); ?>
<?php $__env->startSection('heading', 'Finance Dashboard'); ?>

<?php $__env->startSection('content'); ?>

<?php
    $currency = config('app.currency_symbol', '₹');
    $formatMoney = fn ($amount) => $currency . number_format((float) $amount, 2);
?>

<?php echo $__env->make('finance.top-submenu', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?>


<div class="mb-5 flex flex-wrap items-center justify-between gap-3">
    <div>
        <h1 class="font-semibold uppercase tracking-[0.18em] text-primary">Finance Operations</h1>
        <p class="mt-1 text-sm text-slate-500">Cash position, approvals, and month-to-date flow at a glance.</p>
    </div>
    <div class="flex flex-wrap gap-3">
        <a href="<?php echo e(route('expenses.create')); ?>"
           class="inline-flex items-center gap-2 rounded-full border border-rose-200 bg-rose-50 px-3.5 py-1.5 text-sm font-medium text-rose-800 shadow-sm transition hover:bg-rose-100">
            <i class="bi bi-receipt text-sm"></i> Record expense
        </a>
        <a href="<?php echo e(route('deposits.create')); ?>"
           class="inline-flex items-center gap-2 rounded-full border border-sky-200 bg-sky-50 px-3.5 py-1.5 text-sm font-medium text-sky-800 shadow-sm transition hover:bg-sky-100">
            <i class="bi bi-plus-lg text-sm"></i> Add deposit
        </a>
    </div>
</div>


<div class="mb-6 grid gap-4 sm:grid-cols-2 xl:grid-cols-4">
    <div class="group relative flex items-center gap-4 overflow-hidden rounded-2xl border border-slate-200/70 bg-gradient-to-br from-white via-emerald-50/40 to-slate-50 p-5 pl-6 shadow-sm transition-all duration-300 hover:-translate-y-0.5 hover:shadow-md">
        <span class="absolute inset-y-0 left-0 w-1.5 rounded-l-2xl bg-emerald-500" aria-hidden="true"></span>
        <div class="flex h-12 w-12 shrink-0 items-center justify-center rounded-xl bg-emerald-100">
            <i class="bi bi-wallet2 text-xl text-emerald-600"></i>
        </div>
        <div class="min-w-0">
            <p class="text-xs font-semibold uppercase tracking-wider text-slate-500">Total cash balance</p>
            <p class="mt-1 truncate text-xl font-bold <?php echo e($totalCashBalance >= 0 ? 'text-slate-800' : 'text-rose-700'); ?>"><?php echo e($formatMoney($totalCashBalance)); ?></p>
            <p class="mt-0.5 text-xs text-slate-400">
                <?php echo e($accountCount); ?> <?php echo e(Str::plural('account', $accountCount)); ?>

                · <?php echo e($formatMoney($accountCashBalance ?? $totalCashBalance)); ?> in accounts
                · <?php echo e($formatMoney($mtdExpenses)); ?> MTD expenses deducted
            </p>
        </div>
    </div>

    <div class="group relative flex items-center gap-4 overflow-hidden rounded-2xl border border-slate-200/70 bg-gradient-to-br from-white via-sky-50/40 to-slate-50 p-5 pl-6 shadow-sm transition-all duration-300 hover:-translate-y-0.5 hover:shadow-md">
        <span class="absolute inset-y-0 left-0 w-1.5 rounded-l-2xl bg-sky-500" aria-hidden="true"></span>
        <div class="flex h-12 w-12 shrink-0 items-center justify-center rounded-xl bg-sky-100">
            <i class="bi bi-arrow-down-circle text-xl text-sky-600"></i>
        </div>
        <div>
            <p class="text-xs font-semibold uppercase tracking-wider text-slate-500">Deposits (MTD)</p>
            <p class="mt-1 text-xl font-bold text-sky-700"><?php echo e($formatMoney($mtdDeposits)); ?></p>
            <p class="mt-0.5 text-xs text-slate-400">Money in this month</p>
        </div>
    </div>

    <div class="group relative flex items-center gap-4 overflow-hidden rounded-2xl border border-slate-200/70 bg-gradient-to-br from-white via-rose-50/30 to-slate-50 p-5 pl-6 shadow-sm transition-all duration-300 hover:-translate-y-0.5 hover:shadow-md">
        <span class="absolute inset-y-0 left-0 w-1.5 rounded-l-2xl bg-rose-500" aria-hidden="true"></span>
        <div class="flex h-12 w-12 shrink-0 items-center justify-center rounded-xl bg-rose-100">
            <i class="bi bi-arrow-up-circle text-xl text-rose-600"></i>
        </div>
        <div>
            <p class="text-xs font-semibold uppercase tracking-wider text-slate-500">Expenses (MTD)</p>
            <p class="mt-1 text-xl font-bold text-rose-600"><?php echo e($formatMoney($mtdExpenses)); ?></p>
            <p class="mt-0.5 text-xs text-slate-400">Approved &amp; paid only</p>
        </div>
    </div>

    <div class="group relative flex items-center gap-4 overflow-hidden rounded-2xl border border-slate-200/70 bg-gradient-to-br from-white via-amber-50/40 to-slate-50 p-5 pl-6 shadow-sm transition-all duration-300 hover:-translate-y-0.5 hover:shadow-md">
        <span class="absolute inset-y-0 left-0 w-1.5 rounded-l-2xl bg-amber-500" aria-hidden="true"></span>
        <div class="flex h-12 w-12 shrink-0 items-center justify-center rounded-xl bg-amber-100">
            <i class="bi bi-hourglass-split text-xl text-amber-600"></i>
        </div>
        <div>
            <p class="text-xs font-semibold uppercase tracking-wider text-slate-500">Pending approval</p>
            <p class="mt-1 text-xl font-bold text-amber-700"><?php echo e($pendingExpensesCount); ?></p>
            <p class="mt-0.5 text-xs text-slate-400"><?php echo e($formatMoney($pendingExpensesAmount)); ?> awaiting review</p>
        </div>
    </div>
</div>


<?php
    $netPositive = $netCashFlowMtd >= 0;
?>
<div class="mb-6 rounded-2xl border px-5 py-4 <?php echo e($netPositive ? 'border-emerald-200 bg-emerald-50/60' : 'border-rose-200 bg-rose-50/60'); ?>">
    <div class="flex flex-wrap items-center justify-between gap-3">
        <div class="flex items-center gap-3">
            <span class="flex h-10 w-10 items-center justify-center rounded-full <?php echo e($netPositive ? 'bg-emerald-100 text-emerald-600' : 'bg-rose-100 text-rose-600'); ?>">
                <i class="bi <?php echo e($netPositive ? 'bi-graph-up-arrow' : 'bi-graph-down-arrow'); ?>"></i>
            </span>
            <div>
                <p class="text-sm font-semibold text-slate-800">Net cash flow (month to date)</p>
                <p class="text-xs text-slate-500">Deposits minus approved/paid expenses</p>
            </div>
        </div>
        <p class="text-xl font-bold <?php echo e($netPositive ? 'text-emerald-700' : 'text-rose-700'); ?>">
            <?php echo e($netPositive ? '+' : ''); ?><?php echo e($formatMoney($netCashFlowMtd)); ?>

        </p>
    </div>
</div>


<div class="mb-6 grid gap-5 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' => ['class' => 'rounded-2xl border border-slate-200/70 bg-gradient-to-br from-white via-teal-50/20 to-slate-50/80 p-5 shadow-sm']] + (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' => 'rounded-2xl border border-slate-200/70 bg-gradient-to-br from-white via-teal-50/20 to-slate-50/80 p-5 shadow-sm']); ?>
        <div class="mb-4">
            <p class="text-xs font-semibold uppercase tracking-[0.18em] text-primary">Cash flow</p>
            <h3 class="mt-1 text-base font-semibold text-slate-900">Deposits vs expenses</h3>
            <p class="mt-1 text-sm text-slate-500">Last 6 months — approved/paid expenses only.</p>
        </div>
        <div class="rounded-xl border border-slate-200/70 bg-white/90 p-3 shadow-sm">
            <div class="h-64 w-full">
                <canvas id="financeCashFlowChart" class="h-full w-full"></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' => ['class' => 'rounded-2xl border border-slate-200/70 bg-gradient-to-br from-white via-indigo-50/20 to-slate-50/80 p-5 shadow-sm']] + (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' => 'rounded-2xl border border-slate-200/70 bg-gradient-to-br from-white via-indigo-50/20 to-slate-50/80 p-5 shadow-sm']); ?>
        <div class="mb-4 flex items-start justify-between gap-3">
            <div>
                <p class="text-xs font-semibold uppercase tracking-[0.18em] text-indigo-600">Expenses</p>
                <h3 class="mt-1 text-base font-semibold text-slate-900">Approval pipeline</h3>
                <p class="mt-1 text-sm text-slate-500">Current status distribution.</p>
            </div>
            <a href="<?php echo e(route('expenses.index', ['status' => 'pending'])); ?>"
               class="shrink-0 rounded-lg bg-amber-50 px-3 py-1.5 text-xs font-medium text-amber-700 hover:bg-amber-100">
                Review pending
            </a>
        </div>
        <div class="rounded-xl border border-slate-200/70 bg-white/90 p-3 shadow-sm">
            <div class="h-52 w-full">
                <canvas id="financeStatusChart" class="h-full w-full"></canvas>
            </div>
        </div>
        <div class="mt-4 grid grid-cols-2 gap-2">
            <?php
                $statusMeta = [
                    'pending'  => ['bg' => 'bg-amber-100',  'dot' => 'bg-amber-500',  'text' => 'text-amber-800'],
                    'approved' => ['bg' => 'bg-sky-100',    'dot' => 'bg-sky-500',    'text' => 'text-sky-800'],
                    'paid'     => ['bg' => 'bg-emerald-100','dot' => 'bg-emerald-500','text' => 'text-emerald-800'],
                    'rejected' => ['bg' => 'bg-rose-100',   'dot' => 'bg-rose-500',   'text' => 'text-rose-800'],
                ];
            ?>
            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $statusMeta; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $status => $colors): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                <div class="flex items-center justify-between rounded-lg <?php echo e($colors['bg']); ?> px-3 py-1.5">
                    <div class="flex items-center gap-2">
                        <span class="h-2.5 w-2.5 rounded-full <?php echo e($colors['dot']); ?>"></span>
                        <span class="text-xs font-medium <?php echo e($colors['text']); ?> capitalize"><?php echo e($status); ?></span>
                    </div>
                    <span class="text-sm font-bold <?php echo e($colors['text']); ?>"><?php echo e($byStatus[$status]); ?></span>
                </div>
            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
        </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 class="mb-6 grid gap-5 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' => ['class' => 'rounded-2xl border border-slate-200/70 bg-white p-5 shadow-sm']] + (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' => 'rounded-2xl border border-slate-200/70 bg-white p-5 shadow-sm']); ?>
        <div class="mb-4 flex items-center justify-between">
            <div>
                <h3 class="text-base font-semibold text-slate-900">Account balances</h3>
                <p class="mt-0.5 text-sm text-slate-500">Top accounts by current balance.</p>
            </div>
            <a href="<?php echo e(route('accounts.index')); ?>" class="inline-flex items-center gap-1 text-sm font-medium text-primary hover:underline">
                View all <i class="bi bi-chevron-right text-[10px]"></i>
            </a>
        </div>
        <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($accountBalances->isEmpty()): ?>
            <div class="py-8 text-center text-sm text-slate-500">
                <p>No accounts yet.</p>
                <a href="<?php echo e(route('accounts.create')); ?>" class="mt-2 inline-block text-primary hover:underline">Add your first account</a>
            </div>
        <?php else: ?>
            <div class="space-y-3">
                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $accountBalances; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $account): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                    <?php
                        $pct = ($accountCashBalance ?? $totalCashBalance) > 0
                            ? round(((float) $account->current_balance / ($accountCashBalance ?? $totalCashBalance)) * 100)
                            : 0;
                    ?>
                    <div>
                        <div class="mb-1 flex items-center justify-between text-sm">
                            <div>
                                <span class="font-medium text-slate-800"><?php echo e($account->name); ?></span>
                                <span class="ml-2 text-xs capitalize text-slate-400"><?php echo e($account->type); ?></span>
                            </div>
                            <span class="font-semibold text-slate-700"><?php echo e($formatMoney($account->current_balance)); ?></span>
                        </div>
                        <div class="h-2 overflow-hidden rounded-full bg-slate-100">
                            <div class="h-full rounded-full bg-primary transition-all" style="width: <?php echo e(max($pct, 4)); ?>%"></div>
                        </div>
                    </div>
                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
            </div>
        <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
     <?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' => ['class' => 'rounded-2xl border border-slate-200/70 bg-white p-5 shadow-sm']] + (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' => 'rounded-2xl border border-slate-200/70 bg-white p-5 shadow-sm']); ?>
        <div class="mb-4 flex items-center justify-between">
            <div>
                <h3 class="text-base font-semibold text-slate-900">Spend by category</h3>
                <p class="mt-0.5 text-sm text-slate-500">This month — all expense statuses.</p>
            </div>
            <a href="<?php echo e(route('expenses.index')); ?>" class="text-sm font-medium text-primary hover:underline">All expenses</a>
        </div>
        <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if(empty($expenseByCategory)): ?>
            <p class="py-8 text-center text-sm text-slate-500">No expenses recorded this month.</p>
        <?php else: ?>
            <div class="rounded-xl border border-slate-200/70 bg-white/90 p-3 shadow-sm">
                <div class="h-56 w-full">
                    <canvas id="financeCategoryChart" class="h-full w-full"></canvas>
                </div>
            </div>
        <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
     <?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>


<?php if (isset($component)) { $__componentOriginal53747ceb358d30c0105769f8471417f6 = $component; } ?>
<?php if (isset($attributes)) { $__attributesOriginal53747ceb358d30c0105769f8471417f6 = $attributes; } ?>
<?php $component = Illuminate\View\AnonymousComponent::resolve(['view' => 'components.card','data' => ['class' => 'rounded-2xl border border-slate-200/70 bg-white p-5 shadow-sm']] + (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' => 'rounded-2xl border border-slate-200/70 bg-white p-5 shadow-sm']); ?>
    <div class="mb-4 flex items-center justify-between">
        <div>
            <h3 class="text-base font-semibold text-slate-900">Recent activity</h3>
            <p class="mt-0.5 text-sm text-slate-500">Latest deposits and expenses.</p>
        </div>
    </div>

    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($recentTransactions->isEmpty()): ?>
        <div class="flex flex-col items-center justify-center py-10 text-center">
            <div class="mb-3 flex h-14 w-14 items-center justify-center rounded-full bg-slate-100">
                <i class="bi bi-cash-stack text-2xl text-slate-400"></i>
            </div>
            <p class="text-sm font-medium text-slate-600">No transactions yet</p>
            <p class="mt-1 text-xs text-slate-400">Record a deposit or expense to populate this feed.</p>
        </div>
    <?php else: ?>
        <div class="overflow-x-auto">
            <table class="w-full text-sm">
                <thead>
                    <tr class="border-b border-slate-100">
                        <th class="pb-3 text-left text-xs font-semibold uppercase tracking-wider text-slate-500">Type</th>
                        <th class="pb-3 text-left text-xs font-semibold uppercase tracking-wider text-slate-500">Description</th>
                        <th class="pb-3 text-left text-xs font-semibold uppercase tracking-wider text-slate-500 hidden sm:table-cell">Reference</th>
                        <th class="pb-3 text-left text-xs font-semibold uppercase tracking-wider text-slate-500">Date</th>
                        <th class="pb-3 text-right text-xs font-semibold uppercase tracking-wider text-slate-500">Amount</th>
                        <th class="pb-3 text-right text-xs font-semibold uppercase tracking-wider text-slate-500"></th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-slate-50">
                    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $recentTransactions; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $tx): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                        <tr class="hover:bg-slate-50/70">
                            <td class="py-3 pr-4">
                                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($tx['type'] === 'deposit'): ?>
                                    <span class="inline-flex items-center gap-1 rounded-full bg-emerald-100 px-2.5 py-0.5 text-xs font-medium text-emerald-700">
                                        <i class="bi bi-arrow-down-short"></i> Deposit
                                    </span>
                                <?php else: ?>
                                    <span class="inline-flex items-center gap-1 rounded-full bg-rose-100 px-2.5 py-0.5 text-xs font-medium text-rose-700">
                                        <i class="bi bi-arrow-up-short"></i> Expense
                                    </span>
                                <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                            </td>
                            <td class="py-3 pr-4 font-medium text-slate-800"><?php echo e($tx['label']); ?></td>
                            <td class="py-3 pr-4 text-slate-500 hidden sm:table-cell"><?php echo e(Str::limit($tx['reference'], 40)); ?></td>
                            <td class="py-3 pr-4 text-slate-500"><?php echo e($tx['date']?->format('d M Y') ?? '—'); ?></td>
                            <td class="py-3 pr-4 text-right font-semibold <?php echo e($tx['type'] === 'deposit' ? 'text-emerald-700' : 'text-rose-700'); ?>">
                                <?php echo e($tx['type'] === 'deposit' ? '+' : '−'); ?><?php echo e($formatMoney($tx['amount'])); ?>

                            </td>
                            <td class="py-3 text-right">
                                <a href="<?php echo e($tx['edit_route']); ?>" class="text-xs font-medium text-primary hover:underline">Open</a>
                            </td>
                        </tr>
                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                </tbody>
            </table>
        </div>
    <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
 <?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 $__env->stopSection(); ?>

<?php $__env->startPush('scripts'); ?>
<script>
document.addEventListener('DOMContentLoaded', function () {
    if (typeof Chart === 'undefined') return;

    var palette = {
        text: '#334155',
        muted: '#94a3b8',
        grid: 'rgba(148, 163, 184, 0.18)',
        border: '#ffffff',
        tooltipBg: 'rgba(255, 255, 255, 0.98)',
        tooltipText: '#0f172a'
    };

    Chart.defaults.color = palette.text;
    Chart.defaults.font.family = 'ui-sans-serif, system-ui, -apple-system, Segoe UI, sans-serif';
    Chart.defaults.font.size = 12;
    Chart.defaults.borderColor = palette.grid;

    var tooltipDefaults = {
        backgroundColor: palette.tooltipBg,
        titleColor: palette.tooltipText,
        bodyColor: palette.tooltipText,
        borderColor: palette.grid,
        borderWidth: 1,
        padding: 10
    };

    var flowLabels = <?php echo json_encode(array_column($monthlyFlow, 'label'), 512) ?>;
    var flowDeposits = <?php echo json_encode(array_column($monthlyFlow, 'deposits'), 512) ?>;
    var flowExpenses = <?php echo json_encode(array_column($monthlyFlow, 'expenses'), 512) ?>;

    var ctxFlow = document.getElementById('financeCashFlowChart');
    if (ctxFlow) {
        new Chart(ctxFlow.getContext('2d'), {
            type: 'bar',
            data: {
                labels: flowLabels,
                datasets: [
                    {
                        label: 'Deposits',
                        data: flowDeposits,
                        backgroundColor: '#0d9488',
                        borderRadius: 6,
                        maxBarThickness: 28
                    },
                    {
                        label: 'Expenses',
                        data: flowExpenses,
                        backgroundColor: '#f43f5e',
                        borderRadius: 6,
                        maxBarThickness: 28
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                plugins: { legend: { position: 'bottom' }, tooltip: tooltipDefaults },
                scales: {
                    x: { grid: { display: false } },
                    y: { beginAtZero: true, ticks: { color: palette.muted }, grid: { color: palette.grid } }
                }
            }
        });
    }

    var statusLabels = ['Pending', 'Approved', 'Paid', 'Rejected'];
    var statusData = [
        <?php echo e($byStatus['pending']); ?>,
        <?php echo e($byStatus['approved']); ?>,
        <?php echo e($byStatus['paid']); ?>,
        <?php echo e($byStatus['rejected']); ?>

    ];
    var statusColors = ['#f59e0b', '#0ea5e9', '#10b981', '#f43f5e'];

    var ctxStatus = document.getElementById('financeStatusChart');
    if (ctxStatus) {
        new Chart(ctxStatus.getContext('2d'), {
            type: 'doughnut',
            data: {
                labels: statusLabels,
                datasets: [{
                    data: statusData,
                    backgroundColor: statusColors,
                    borderColor: palette.border,
                    borderWidth: 3,
                    hoverOffset: 8
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                cutout: '62%',
                plugins: { legend: { display: false }, tooltip: tooltipDefaults }
            }
        });
    }

    var catLabels = <?php echo json_encode(array_column($expenseByCategory, 'name'), 512) ?>;
    var catData = <?php echo json_encode(array_column($expenseByCategory, 'total'), 512) ?>;
    var ctxCat = document.getElementById('financeCategoryChart');
    if (ctxCat && catLabels.length > 0) {
        new Chart(ctxCat.getContext('2d'), {
            type: 'bar',
            data: {
                labels: catLabels,
                datasets: [{
                    label: 'Amount',
                    data: catData,
                    backgroundColor: '#6366f1',
                    borderRadius: 8,
                    maxBarThickness: 24
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                indexAxis: 'y',
                plugins: { legend: { display: false }, tooltip: tooltipDefaults },
                scales: {
                    x: { beginAtZero: true, grid: { color: palette.grid } },
                    y: { grid: { display: false } }
                }
            }
        });
    }
});
</script>
<?php $__env->stopPush(); ?>

<?php echo $__env->make('layouts.app', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH /var/www/html/kiyohr/v2_version/resources/views/finance/dashboard.blade.php ENDPATH**/ ?>