@if(session('success'))
    <div class="toast bg-success text-white show" role="alert" aria-live="assertive" aria-atomic="true" style="position: fixed; top: 20px; right: 20px; min-width: 250px; z-index: 9999;">
        <div class="toast-header bg-success text-white">
        <strong class="me-auto">Success</strong>
        <button type="button" class="btn-close btn-close-white ms-2 mb-1" data-bs-dismiss="toast" aria-label="Close"></button>
        </div>
        <div class="toast-body">
        {{ session('success') }}
        </div>
    </div>
    <script>
        document.addEventListener('DOMContentLoaded', function () {
        var successToastEl = document.querySelector('.toast.bg-success');
        if (successToastEl) {
            var toast = new bootstrap.Toast(successToastEl, {delay: 3000});
            toast.show();
        }
        });
    </script>
    @endif

    @if ($errors->any())
    <div class="toast bg-danger text-white show" role="alert" 
    style="position: fixed; top: 20px; right: 20px; min-width: 250px; z-index: 9999;">
        
        <div class="toast-header bg-danger text-white">
            <strong class="me-auto">Error</strong>
            <button type="button" class="btn-close btn-close-white ms-2 mb-1" data-bs-dismiss="toast" aria-label="Close"></button>
        </div>

        <div class="toast-body">
            @foreach ($errors->all() as $error)
                <div>{{ $error }}</div>
            @endforeach
        </div>

    </div>
    @endif