@props([
    'title',
    'body' => null,
    'variant' => 'warning',
])

@php
    $sev = config('theme.ui.severity', []);
    $bg =
        match ($variant) {
            'danger' => $sev['danger'] ?? config('theme.colors.accent'),
            default => $sev['warning'] ?? config('theme.colors.muted'),
        };
    $fg = $variant === 'warning' ? config('theme.colors.text') : config('theme.colors.on_badge');
@endphp

<div class="alert mb-0 border-0 small" style="background-color: {{ $bg }}; color: {{ $fg }};">
    <div class="fw-semibold">{{ $title }}</div>
    @if ($body)
        <div class="mt-1">{{ $body }}</div>
    @endif
</div>
