@extends('layouts.app')

@section('content')
<div class="max-w-6xl mx-auto px-10 py-16">
    <h1 class="text-3xl font-extrabold text-gray-900 mb-8">Dashboard Admin</h1>

    <div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-8">
        <div class="bg-white rounded-2xl shadow-sm border border-orange-100 p-8">
            <h3 class="text-sm font-bold text-gray-500 uppercase tracking-widest mb-2">Total Pengguna Terdaftar</h3>
            <p class="text-4xl font-black text-orange-700">{{ $totalUsers }}</p>
        </div>

        <div class="bg-white rounded-2xl shadow-sm border border-orange-100 p-8">
            <h3 class="text-sm font-bold text-gray-500 uppercase tracking-widest mb-2">Total Klasifikasi Dilakukan</h3>
            <p class="text-4xl font-black text-orange-700">{{ $totalClassifications }}</p>
        </div>
    </div>

    <div class="bg-white rounded-2xl shadow-sm border border-orange-100 p-8 mb-8">
        <h3 class="text-sm font-bold text-gray-500 uppercase tracking-widest mb-6">Statistik Klasifikasi per Kelas</h3>
        <div class="space-y-4">
            @forelse ($statistikKelas as $item)
                <div class="flex items-center justify-between">
                    <span class="font-bold text-gray-900 capitalize">{{ $item->label }}</span>
                    <span class="px-4 py-1 bg-orange-50 text-orange-700 rounded-full text-sm font-bold">{{ $item->total }} kali</span>
                </div>
            @empty
                <p class="text-gray-400">Belum ada data klasifikasi.</p>
            @endforelse
        </div>
    </div>

    <a href="{{ route('admin.users') }}" class="inline-block px-8 py-4 bg-orange-700 text-white rounded-full font-bold shadow-lg hover:bg-orange-800 transition">
        Kelola Data Pengguna
    </a>
    <a href="{{ route('admin.export') }}" class="inline-block text-center px-8 py-4 bg-gray-800 text-white rounded-full font-bold shadow-lg hover:bg-black transition">
            Export Data CSV
        </a>
</div>
@endsection