@extends('layouts.admin')
@section('title', 'Analytics dashboard')
@section('content')
<x-admin.page title="Analytics dashboard" subtitle="RFQ funnel depth and TRA-specific KPIs reconciled to commercial signals.">
    <x-slot:actions>
        <a href="{{ route('admin.analytics.experiments.index') }}" class="admin-btn">Experiments</a>
    </x-slot:actions>

    <div class="mb-5 grid gap-4 sm:grid-cols-2 lg:grid-cols-4">
        <x-admin.card>
            <div class="text-xs uppercase tracking-wide text-[#6d7175]">RFQ leads</div>
            <div class="mt-1 text-2xl font-semibold">{{ number_format($traKpis['rfq_funnel']['leads']) }}</div>
        </x-admin.card>
        <x-admin.card>
            <div class="text-xs uppercase tracking-wide text-[#6d7175]">Quotes</div>
            <div class="mt-1 text-2xl font-semibold">{{ number_format($traKpis['rfq_funnel']['quotes']) }}</div>
        </x-admin.card>
        <x-admin.card>
            <div class="text-xs uppercase tracking-wide text-[#6d7175]">Accepted</div>
            <div class="mt-1 text-2xl font-semibold">{{ number_format($traKpis['rfq_funnel']['accepted']) }}</div>
        </x-admin.card>
        <x-admin.card>
            <div class="text-xs uppercase tracking-wide text-[#6d7175]">Retail vs wholesale</div>
            <div class="mt-1 text-sm font-semibold tabular-nums">
                AUD {{ number_format(($traKpis['wholesale_vs_retail']['retail_cents'] ?? 0) / 100, 0) }}
                <span class="text-[#6d7175]">/</span>
                AUD {{ number_format(($traKpis['wholesale_vs_retail']['wholesale_cents'] ?? 0) / 100, 0) }}
            </div>
        </x-admin.card>
    </div>

    <div class="grid gap-5 lg:grid-cols-2">
        <x-admin.section title="RFQ funnel" hint="{{ $rfqFunnel['funnel'] }}">
            <ol class="space-y-3">
                @foreach($rfqFunnel['steps'] as $step)
                    <li class="flex items-center justify-between rounded-xl border border-[var(--color-admin-border)] px-4 py-3">
                        <div>
                            <div class="text-sm font-semibold">{{ str($step['key'])->headline() }}</div>
                            <div class="text-xs text-[#6d7175]">{{ $step['event'] }}</div>
                        </div>
                        <div class="text-right">
                            <div class="text-lg font-semibold tabular-nums">{{ number_format($step['count']) }}</div>
                            @if($step['conversion_from_previous'] !== null)
                                <div class="text-xs text-[#6d7175]">{{ $step['conversion_from_previous'] }}% from previous</div>
                            @endif
                        </div>
                    </li>
                @endforeach
            </ol>
        </x-admin.section>

        <x-admin.section title="Grade mix">
            @if(empty($traKpis['grade_mix']))
                <p class="text-sm text-[#6d7175]">No grade dimension on leads yet.</p>
            @else
                <ul class="space-y-2">
                    @foreach($traKpis['grade_mix'] as $grade => $total)
                        <li class="flex items-center justify-between rounded-xl px-2 py-2 text-sm">
                            <span class="font-medium">{{ $grade ?: 'Ungraded' }}</span>
                            <span class="tabular-nums font-semibold">{{ number_format($total) }}</span>
                        </li>
                    @endforeach
                </ul>
            @endif
        </x-admin.section>
    </div>
</x-admin.page>
@endsection