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

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

<div class="border rounded p-3 small" style="border-color: {{ $border }} !important;">
    <div class="fw-semibold" style="color: {{ $text }};">{{ $title }}</div>
    @if ($body)
        <div class="mt-1" style="color: {{ $muted }};">{{ $body }}</div>
    @endif
</div>
