@extends('layouts.app')

@section('title', 'Reports')

@section('content')
    <x-breadcrumbs :items="[
        ['label' => 'Dashboard', 'url' => route('dashboard')],
        ['label' => 'Reports'],
    ]" />

    <x-page-header title="Reports" subtitle="Operational and financial reporting" />

    @foreach ($catalog as $group => $reports)
        <h2 class="h6 text-muted text-uppercase mt-4 mb-3">{{ $group }}</h2>
        <div class="row g-3 mb-2">
            @foreach ($reports as $type => $label)
                <div class="col-md-6 col-xl-4">
                    <div class="vem-stat-card h-100">
                        <h3 class="h6 mb-2">{{ $label }}</h3>
                        <a href="{{ route('reports.show', $type) }}" class="btn btn-sm btn-outline-primary">View Report</a>
                    </div>
                </div>
            @endforeach
        </div>
    @endforeach
@endsection
