@php
    $messages = array_filter([
        'status' => session('status'),
        'warning' => session('warning'),
        'error' => session('error'),
    ]);
    $styles = [
        'status' => 'border-emerald-200 bg-emerald-50 text-emerald-800',
        'warning' => 'border-amber-200 bg-amber-50 text-amber-900',
        'error' => 'border-red-200 bg-red-50 text-red-800',
    ];
@endphp
@foreach ($messages as $type => $message)
    <div role="{{ $type === 'status' ? 'status' : 'alert' }}" class="mb-4 flex items-start gap-3 rounded-lg border px-4 py-3 text-sm {{ $styles[$type] }}" x-data="{ open: true }" x-show="open">
        <span class="flex-1">{{ $message }}</span>
        <button type="button" class="-m-1 rounded p-1 opacity-60 hover:opacity-100" x-on:click="open = false" aria-label="{{ __('Cerrar aviso') }}">
            <x-icon name="x" class="size-4" />
        </button>
    </div>
@endforeach