@extends('partner.layouts.app')

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

@section('content')
    @php
        $stats = [
            ['label' => 'Total Redemptions', 'value' => '1,247', 'sub' => '+156 this month', 'trend' => 'up'],
            ['label' => 'Active Offers', 'value' => '8', 'sub' => '2 expiring soon', 'trend' => 'warning'],
            ['label' => 'Member Reach', 'value' => '45,230', 'sub' => 'Potential customers', 'trend' => 'neutral'],
            ['label' => 'Est. Revenue Impact', 'value' => 'Rs. 2.4M', 'sub' => 'From member visits', 'trend' => 'up'],
        ];
        $chartBars = [35, 45, 55, 75, 62, 50];
        $chartMonths = ['Sep', 'Oct', 'Nov', 'Dec', 'Jan', 'Feb'];
    @endphp

    <div class="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4">
        <div><h1 class="text-2xl font-bold text-gray-900">Partner Dashboard</h1><p class="text-gray-600">Manage your offers and track performance.</p></div>
    </div>

    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
        @foreach($stats as $stat)
            <div class="bg-white p-6 rounded-xl shadow-sm border border-gray-100">
                <p class="text-sm font-medium text-gray-500">{{ $stat['label'] }}</p>
                <p class="mt-2 text-2xl font-bold text-[#0d4a4a]">{{ $stat['value'] }}</p>
                <div class="mt-2 text-xs">
                    @if ($stat['trend'] === 'up')<span class="text-green-600 font-medium inline-flex items-center"><i data-lucide="trending-up" class="w-3 h-3 mr-1"></i>{{ $stat['sub'] }}</span>
                    @elseif ($stat['trend'] === 'warning')<span class="text-amber-600 font-medium inline-flex items-center"><i data-lucide="alert-circle" class="w-3 h-3 mr-1"></i>{{ $stat['sub'] }}</span>
                    @else<span class="text-gray-500">{{ $stat['sub'] }}</span>@endif
                </div>
            </div>
        @endforeach
    </div>

    <div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
        <div class="lg:col-span-2 rounded-xl border border-gray-100 bg-white p-6 shadow-sm">
            <div class="mb-6 flex items-center justify-between"><h2 class="text-lg font-bold text-gray-900">Redemption Trends</h2><span class="rounded-lg bg-gray-100 px-3 py-1.5 text-sm text-gray-600">Last 6 Months</span></div>
            <div class="h-64 rounded-lg bg-gradient-to-b from-amber-50 to-white p-4"><div class="flex h-full items-end justify-between gap-3">@foreach ($chartBars as $idx => $height)<div class="flex h-full flex-1 flex-col justify-end"><div class="rounded-t bg-[#F5A623]" style="height: {{ $height }}%"></div><p class="mt-2 text-center text-xs text-gray-500">{{ $chartMonths[$idx] }}</p></div>@endforeach</div></div>
        </div>
        <div class="space-y-4">
            <div class="rounded-xl border border-gray-100 bg-white p-6 shadow-sm"><p class="text-sm text-gray-500">Avg. Discount Given</p><p class="mt-1 text-2xl font-bold text-[#0d4a4a]">Rs. 850</p></div>
            <div class="rounded-xl border border-gray-100 bg-white p-6 shadow-sm"><p class="text-sm text-gray-500">Peak Redemption Day</p><p class="mt-1 text-2xl font-bold text-[#0d4a4a]">Friday</p><p class="text-xs text-gray-400">6:00 PM - 9:00 PM</p></div>
            <div class="rounded-xl border border-gray-100 bg-white p-6 shadow-sm"><p class="text-sm text-gray-500">Top Performing Offer</p><p class="mt-1 text-lg font-bold text-[#0d4a4a]">20% Off Dining</p><p class="text-xs text-green-600">450 redemptions</p></div>
        </div>
    </div>
@endsection