@php
$colorClasses = match($status['color'] ?? 'gray') {
    'yellow' => ['dot' => 'bg-yellow-400', 'badge' => 'bg-yellow-100 text-yellow-800 dark:bg-yellow-900/30 dark:text-yellow-300'],
    'green'  => ['dot' => 'bg-green-400',  'badge' => 'bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-300'],
    'purple' => ['dot' => 'bg-purple-400', 'badge' => 'bg-purple-100 text-purple-800 dark:bg-purple-900/30 dark:text-purple-300'],
    'gray'   => ['dot' => 'bg-gray-400',   'badge' => 'bg-gray-100 text-gray-700 dark:bg-gray-700 dark:text-gray-300'],
    'blue'   => ['dot' => 'bg-blue-400',   'badge' => 'bg-blue-100 text-blue-800 dark:bg-blue-900/30 dark:text-blue-300'],
    'red'    => ['dot' => 'bg-red-400',    'badge' => 'bg-red-100 text-red-800 dark:bg-red-900/30 dark:text-red-300'],
    'orange' => ['dot' => 'bg-orange-400', 'badge' => 'bg-orange-100 text-orange-800 dark:bg-orange-900/30 dark:text-orange-300'],
    default  => ['dot' => 'bg-gray-400',   'badge' => 'bg-gray-100 text-gray-700'],
};
@endphp

<div class="mb-2 flex items-center justify-between px-1">
    <div class="flex items-center gap-2">
        <span class="h-2.5 w-2.5 rounded-full {{ $colorClasses['dot'] }}"></span>
        <h3 class="font-semibold text-sm text-gray-700 dark:text-gray-200">
            {{ $status['title'] }}
        </h3>
    </div>
    <span class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-semibold {{ $colorClasses['badge'] }}">
        {{ $status['total'] ?? count($status['records']) }}
    </span>
</div>