{{-- Reports --}}
@extends('layouts.app')
@section('page-title','Reports')
@section('content')
<div style="display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px">
    @foreach([
        ['name'=>'Lead Report','icon'=>'fas fa-users','color'=>'#2563eb','bg'=>'#eff6ff','route'=>'reports.leads'],
        ['name'=>'Sales Pipeline','icon'=>'fas fa-funnel-dollar','color'=>'#7c3aed','bg'=>'#faf5ff','route'=>'reports.pipeline'],
        ['name'=>'Team Performance','icon'=>'fas fa-user-tie','color'=>'#0891b2','bg'=>'#f0f9ff','route'=>'reports.team'],
        ['name'=>'Follow-Up Report','icon'=>'fas fa-calendar-check','color'=>'#ca8a04','bg'=>'#fefce8','route'=>'reports.followups'],
        ['name'=>'Property Report','icon'=>'fas fa-building','color'=>'#16a34a','bg'=>'#f0fdf4','route'=>'reports.properties'],
        ['name'=>'Area Demand','icon'=>'fas fa-map-marked-alt','color'=>'#dc2626','bg'=>'#fef2f2','route'=>'reports.areas'],
    ] as $r)
    <div class="card">
        <div class="card-body" style="text-align:center;padding:32px 20px">
            <div style="width:64px;height:64px;background:{{ $r['bg'] }};border-radius:16px;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;font-size:26px;color:{{ $r['color'] }}">
                <i class="{{ $r['icon'] }}"></i>
            </div>
            <h3 style="font-size:16px;font-weight:600;margin-bottom:8px">{{ $r['name'] }}</h3>
            <div style="display:flex;gap:8px;justify-content:center;margin-top:16px">
                <a href="{{ route($r['route'],['format'=>'csv','from'=>now()->startOfMonth()->format('Y-m-d'),'to'=>now()->endOfMonth()->format('Y-m-d')]) }}" class="btn btn-secondary btn-sm"><i class="fas fa-file-csv"></i> CSV</a>
                <a href="{{ route($r['route'],['format'=>'pdf','from'=>now()->startOfMonth()->format('Y-m-d'),'to'=>now()->endOfMonth()->format('Y-m-d')]) }}" class="btn btn-secondary btn-sm"><i class="fas fa-file-pdf"></i> PDF</a>
            </div>
        </div>
    </div>
    @endforeach
</div>
@endsection