@props(['title', 'user', 'value', 'bgClass' => 'bg-[#0f4c81]', 'valueLabel' => 'Tổng thẻ đã nhận'])

<div class="card-stat-active {{ $bgClass }}">
    <div class="space-y-2">
        <div class="flex justify-between items-center">
            <span class="text-white/90 text-xs font-bold uppercase tracking-wider">{{ $title }}</span>
            <span class="text-2xl font-black">{{ $user && $value > 0 ? $user : 'Chưa có' }}</span>
        </div>
        <div class="flex justify-between items-center pt-2 border-t border-white/20">
            <span class="text-white/80 text-[10px] font-bold">{{ $valueLabel }}</span>
            <span class="text-lg font-bold text-yellow-300">{{ $value }} thẻ</span>
        </div>
    </div>
</div>