@extends('layouts.app')

@php
    $money = fn ($value) => 'Rs ' . number_format((float) $value, 2);
    $max = fn ($items) => max(1, collect($items)->max('value') ?: 1);
@endphp

@section('content')
    <div class="page-title">
        <div>
            <h1>Dashboard</h1>
            <p class="muted">Sales, stock, customer, branch, payment, and cashier performance overview.</p>
        </div>
        <a class="btn btn-primary" href="#new-bill">New bill</a>
    </div>

    <section class="quick-actions">
        @foreach ($quickActions as $action)
            <a class="btn btn-{{ $action['tone'] }}" href="{{ $action['href'] }}">{{ $action['label'] }}</a>
        @endforeach
    </section>

    <section class="stat-grid">
        <div><span class="muted">Today sales</span><strong>{{ $money($widgets['today_sales']) }}</strong></div>
        <div><span class="muted">Monthly sales</span><strong>{{ $money($widgets['monthly_sales']) }}</strong></div>
        <div><span class="muted">Total orders</span><strong>{{ number_format($widgets['total_orders']) }}</strong></div>
        <div><span class="muted">Profit margin</span><strong>{{ $widgets['profit_margin'] }}%</strong></div>
    </section>

    <section class="stat-grid" style="margin-top: 16px;">
        <div><span class="muted">Pending payments</span><strong>{{ $money($widgets['pending_payments']) }}</strong></div>
        <div><span class="muted">Online orders</span><strong>{{ number_format($widgets['online_orders']) }}</strong></div>
        <div><span class="muted">Low stock alerts</span><strong>{{ $lowStockProducts->count() }}</strong></div>
        <div><span class="muted">Branch session</span><strong>#{{ session('shift_id', '-') }}</strong></div>
    </section>

    <section class="dashboard-grid">
        <div class="dash-card">
            <h2>Sales chart</h2>
            <div class="mini-chart">
                @foreach ($charts['sales'] as $point)
                    <div class="mini-bar">
                        <span style="height: {{ 18 + (($point['value'] / $max($charts['sales'])) * 150) }}px;"></span>
                        <span>{{ $point['label'] }}</span>
                    </div>
                @endforeach
            </div>
        </div>
        <div class="dash-card">
            <h2>Payment mode breakdown</h2>
            <div class="bar-chart">
                @php $paymentMax = max(1, $paymentBreakdown->max('total') ?: 1); @endphp
                @foreach ($paymentBreakdown as $payment)
                    <div class="bar-row">
                        <span>{{ ucfirst($payment->mode) }}</span>
                        <span class="bar-track"><span class="bar-fill" style="width: {{ ($payment->total / $paymentMax) * 100 }}%;"></span></span>
                        <span class="metric">{{ $money($payment->total) }}</span>
                    </div>
                @endforeach
            </div>
        </div>
    </section>

    <section class="dashboard-grid">
        <div class="dash-card">
            <h2>Profit chart</h2>
            <div class="mini-chart">
                @foreach ($charts['profit'] as $point)
                    <div class="mini-bar">
                        <span class="bar-fill info" style="height: {{ 18 + (($point['value'] / $max($charts['profit'])) * 150) }}px;"></span>
                        <span>{{ $point['label'] }}</span>
                    </div>
                @endforeach
            </div>
        </div>
        <div class="dash-card">
            <h2>Product category chart</h2>
            <div class="bar-chart">
                @php $categoryMax = $max($charts['categories']); @endphp
                @foreach ($charts['categories'] as $category)
                    <div class="bar-row">
                        <span>{{ $category['label'] }}</span>
                        <span class="bar-track"><span class="bar-fill accent" style="width: {{ ($category['value'] / $categoryMax) * 100 }}%;"></span></span>
                        <span class="metric">{{ $money($category['value']) }}</span>
                    </div>
                @endforeach
            </div>
        </div>
    </section>

    <section class="dashboard-grid">
        <div class="dash-card">
            <h2>Hourly billing graph</h2>
            <div class="mini-chart">
                @foreach ($charts['hourlyBilling'] as $point)
                    <div class="mini-bar">
                        <span style="height: {{ 10 + (($point['value'] / $max($charts['hourlyBilling'])) * 150) }}px;"></span>
                        <span>{{ substr($point['label'], 0, 2) }}</span>
                    </div>
                @endforeach
            </div>
        </div>
        <div class="dash-card">
            <h2>Cashier performance graph</h2>
            <div class="bar-chart">
                @php $cashierMax = $max($charts['cashiers']); @endphp
                @foreach ($charts['cashiers'] as $cashier)
                    <div class="bar-row">
                        <span>{{ $cashier['label'] }}</span>
                        <span class="bar-track"><span class="bar-fill info" style="width: {{ ($cashier['value'] / $cashierMax) * 100 }}%;"></span></span>
                        <span class="metric">{{ $money($cashier['value']) }}</span>
                    </div>
                @endforeach
            </div>
        </div>
    </section>

    <section class="dashboard-grid">
        <div class="dash-card">
            <h2>Fast-moving products</h2>
            @foreach ($fastMovingProducts as $product)
                <div class="list-row">
                    <span>{{ $product->name }} <span class="muted">({{ $product->sku }})</span></span>
                    <span class="metric">{{ $product->sold_quantity }} sold</span>
                </div>
            @endforeach
        </div>
        <div class="dash-card">
            <h2>Low stock alerts</h2>
            @foreach ($lowStockProducts as $product)
                <div class="list-row">
                    <span>{{ $product->name }}</span>
                    <span class="badge suspended">{{ $product->stock_quantity }} left</span>
                </div>
            @endforeach
        </div>
    </section>

    <section class="dashboard-grid">
        <div class="dash-card">
            <h2>Branch comparison</h2>
            @php $branchMax = max(1, $branchComparison->max('sales') ?: 1); @endphp
            <div class="bar-chart">
                @foreach ($branchComparison as $branch)
                    <div class="bar-row">
                        <span>{{ $branch->name }}</span>
                        <span class="bar-track"><span class="bar-fill" style="width: {{ ($branch->sales / $branchMax) * 100 }}%;"></span></span>
                        <span class="metric">{{ $money($branch->sales) }}</span>
                    </div>
                @endforeach
            </div>
        </div>
        <div class="dash-card">
            <h2>Top customers</h2>
            @foreach ($topCustomers as $customer)
                <div class="list-row">
                    <span>{{ $customer->name }} <span class="muted">{{ $customer->mobile }}</span></span>
                    <span class="metric">{{ $money($customer->total_spent) }}</span>
                </div>
            @endforeach
        </div>
    </section>
@endsection