@props(['ton' => 'gray'])
@php
    $tons = [
        'gray' => 'bg-gray-100 text-gray-600 dark:bg-white/10 dark:text-gray-300',
        'success' => 'bg-green-100 text-green-700 dark:bg-green-500/15 dark:text-green-400',
        'warning' => 'bg-amber-100 text-amber-700 dark:bg-amber-500/15 dark:text-amber-400',
        'danger' => 'bg-red-100 text-red-700 dark:bg-red-500/15 dark:text-red-400',
        'info' => 'bg-blue-100 text-blue-700 dark:bg-blue-500/15 dark:text-blue-400',
    ];
@endphp
<span class="inline-flex items-center whitespace-nowrap rounded-full px-2.5 py-1 text-xs font-medium {{ $tons[$ton] ?? $tons['gray'] }}">{{ $slot }}</span>