@php
    $teamPerformance = $teamPerformance ?? [];
    $cards = $teamPerformance['cards'] ?? [];
    $periodLabel = $teamPerformance['period_label'] ?? ($tv['period_label'] ?? now()->format('F Y'));
@endphp

<div class="tv-leaderboard-card flex flex-col flex-1 min-h-0 rounded-2xl border border-slate-800/80 overflow-hidden">
    <div class="flex-1 min-h-0 flex flex-col px-6 sm:px-10 pt-5 sm:pt-6 pb-6 sm:pb-8">
        <h2 class="tv-team-performance-title text-center font-bold text-white tracking-tight mb-6 sm:mb-8 shrink-0">
            Sales Team Performance
        </h2>

        <div id="tv-team-performance-grid" class="w-full max-w-7xl mx-auto flex-1 min-h-0 grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-4 gap-6 sm:gap-8 xl:gap-10 items-center content-center">
            @include('sales-tv.partials.circular-metric', [
                'card' => $cards['total_sales_revenue'] ?? [],
                'title' => 'Total Sales Revenue',
                'periodLabel' => $periodLabel,
            ])
            @include('sales-tv.partials.circular-metric', [
                'card' => $cards['gross_profit'] ?? [],
                'title' => 'Gross Profit',
                'periodLabel' => $periodLabel,
            ])
            @include('sales-tv.partials.circular-metric', [
                'card' => $cards['units_sold'] ?? [],
                'title' => 'Units Sold',
                'unitsSuffix' => true,
                'periodLabel' => $periodLabel,
            ])
            @include('sales-tv.partials.circular-metric', [
                'card' => $cards['applications_submitted'] ?? [],
                'title' => 'Applications Submitted',
                'periodLabel' => $periodLabel,
            ])
        </div>
    </div>
</div>