@extends('admin.layouts.app')

@section('title', __('admin.menu_analytics'))
@section('heading', __('admin.menu_analytics'))

@section('content')
<x-admin.page-header :title="__('admin.menu_analytics')" />

@if (! empty($kpis['computed_at']))
    <p class="mb-4 text-sm text-slate-500">
        {{ __('admin.analytics_computed_at', ['date' => $kpis['date'] ?? '—']) }}
    </p>
@endif

<div class="grid gap-4 sm:grid-cols-2 xl:grid-cols-3">
    @foreach ([
        ['label' => __('admin.analytics_orders_today'), 'value' => number_format($kpis['orders_today'] ?? 0)],
        ['label' => __('admin.analytics_orders_week'), 'value' => number_format($kpis['orders_week'] ?? 0)],
        ['label' => __('admin.analytics_lead_conversion'), 'value' => number_format($kpis['lead_conversion_rate'] ?? 0, 1).'%'],
        ['label' => __('admin.analytics_low_stock'), 'value' => number_format($kpis['low_stock_count'] ?? 0)],
        ['label' => __('admin.analytics_revenue_month'), 'value' => number_format($kpis['revenue_month'] ?? 0, 0)],
    ] as $card)
        <div class="admin-card">
            <p class="text-xs font-semibold uppercase eca-theme-text-muted">{{ $card['label'] }}</p>
            <p class="mt-2 text-3xl font-bold text-brand-accent">{{ $card['value'] }}</p>
        </div>
    @endforeach
</div>

<div class="admin-card mt-6">
    <h2 class="mb-4 text-lg font-bold">{{ __('admin.analytics_top_categories') }}</h2>
    <div class="admin-table-wrap admin-table-wrap--responsive">
        <table class="admin-table">
            <thead>
                <tr>
                    <th>{{ __('admin.category') }}</th>
                    <th>{{ __('admin.analytics_orders_count') }}</th>
                </tr>
            </thead>
            <tbody>
                @forelse ($kpis['top_categories'] ?? [] as $row)
                    <tr>
                        <td data-label="{{ __('admin.category') }}">{{ $row['name'] }}</td>
                        <td data-label="{{ __('admin.analytics_orders_count') }}">{{ number_format($row['orders_count']) }}</td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="2" class="admin-empty">{{ __('admin.empty') }}</td>
                    </tr>
                @endforelse
            </tbody>
        </table>
    </div>
</div>
@endsection