@props(['type' => 'info', 'dismissible' => false])

@php
$types = [
    'info' => 'bg-blue-50 text-blue-800 border-blue-200',
    'success' => 'bg-green-50 text-green-800 border-green-200',
    'warning' => 'bg-yellow-50 text-yellow-800 border-yellow-200',
    'error' => 'bg-red-50 text-red-800 border-red-200',
];
$typeClass = $types[$type] ?? $types['info'];
@endphp

<div {{ $attributes->merge(['class' => "rounded-lg border p-4 {$typeClass}"]) }}>
    <div class="flex">
        <div class="flex-1">
            {{ $slot }}
        </div>
        @if($dismissible)
            <button type="button" class="ml-3 -mr-1 -my-1 p-1 rounded hover:bg-black/5" onclick="this.parentElement.parentElement.remove()">
                <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
                </svg>
            </button>
        @endif
    </div>
</div>