@props(['type' => 'success', 'message' => ''])

<div class="app-toast is-visible" data-type="{{ $type }}" role="status">
    <span class="app-toast-icon">
        @if ($type === 'warning' || $type === 'error')
            <x-icon name="alert" />
        @else
            <x-icon name="check" />
        @endif
    </span>
    <div class="app-toast-body">
        <p class="app-toast-title">{{ $message }}</p>
    </div>
    <button type="button" class="app-toast-close" aria-label="Cerrar">
        <x-icon name="close" />
    </button>
</div>