@extends('layouts.admin')

@section('title', 'Dashboard')
@section('page_title', 'Dashboard')

@section('content')
<div class="grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-4 gap-5 mb-7">
    @foreach([
        ['Products', $stats['products'], 'ki-handcart'],
        ['Orders', $stats['orders'], 'ki-parcel'],
        ['Customers', $stats['customers'], 'ki-users'],
        ['Pending', $stats['pending_orders'], 'ki-time'],
        ['Approvals', $stats['pending_accounts'] ?? 0, 'ki-user-tick'],
        ['Revenue', '₹'.number_format($stats['revenue'], 0), 'ki-dollar'],
    ] as [$label, $value, $icon])
        <div class="kt-card">
            <div class="kt-card-content flex items-center justify-between p-5">
                <div>
                    <div class="text-sm text-secondary-foreground mb-1">{{ $label }}</div>
                    <div class="text-2xl font-semibold text-mono">{{ $value }}</div>
                </div>
                <i class="ki-filled {{ $icon }} text-2xl text-primary"></i>
            </div>
        </div>
    @endforeach
</div>

<div class="grid grid-cols-1 xl:grid-cols-3 gap-5">
    <div class="kt-card xl:col-span-2">
        <div class="kt-card-header">
            <h3 class="kt-card-title">Recent Orders</h3>
            <a href="{{ route('admin.orders.index') }}" class="kt-btn kt-btn-sm kt-btn-light">View all</a>
        </div>
        <div class="kt-card-content p-0">
            <div class="kt-scrollable-x-auto">
                <table class="kt-table table-auto">
                    <thead>
                        <tr>
                            <th class="min-w-[140px]">Order</th>
                            <th class="min-w-[140px]">Customer</th>
                            <th>Status</th>
                            <th>Total</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse($recentOrders as $order)
                            <tr>
                                <td><a class="text-primary font-medium" href="{{ route('admin.orders.show', $order) }}">{{ $order->order_number }}</a></td>
                                <td>{{ $order->customer_name }}</td>
                                <td><span class="kt-badge kt-badge-outline kt-badge-sm">{{ ucfirst($order->status) }}</span></td>
                                <td>₹{{ number_format($order->total, 0) }}</td>
                            </tr>
                        @empty
                            <tr><td colspan="4" class="text-center text-secondary-foreground py-8">No orders yet</td></tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>
    </div>

    <div class="kt-card">
        <div class="kt-card-header"><h3 class="kt-card-title">Low / Out of Stock</h3></div>
        <div class="kt-card-content flex flex-col gap-3">
            @forelse($lowStock as $product)
                <div class="flex justify-between items-center gap-2">
                    <a href="{{ route('admin.products.edit', $product) }}" class="text-sm">{{ $product->name }}</a>
                    <span class="kt-badge kt-badge-destructive kt-badge-sm">{{ $product->stock_qty }}</span>
                </div>
            @empty
                <div class="text-sm text-secondary-foreground">All products look healthy.</div>
            @endforelse
        </div>
    </div>
</div>
@endsection