@props(['status'])

@php
    $styles = match ($status) {
        'success' => 'bg-accent-100 text-accent-800 dark:bg-accent-900/40 dark:text-accent-300',
        'failed', 'reversed' => 'bg-red-100 text-red-700 dark:bg-red-900/40 dark:text-red-300',
        'processing', 'pending' => 'bg-amber-100 text-amber-800 dark:bg-amber-900/40 dark:text-amber-300',
        default => 'bg-slate-100 text-slate-700 dark:bg-slate-800 dark:text-slate-300',
    };
@endphp

<span class="inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-semibold {{ $styles }}">
    {{ ucfirst($status) }}
</span>