Issue with toastr- could not able to see message in toastr

Pls check the screenshot
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" >
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css"  />
    <title>My Post</title>
    @livewireStyles
    <style>
       .toast-container .toast {
    color: #ffffff !important;
    background-color: #007bff !important;
    font-size: 16px !important;
    padding: 10px !important;
}

    </style>
    
</head>
<body>
    
    <livewire:posts />
    @livewireScripts
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js" ></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js" ></script>
    <script>
        toastr.options = {
            "closeButton": true,
            "debug": false,
            "newestOnTop": false,
            "progressBar": true,
            "positionClass": "toast-top-right",
            "preventDuplicates": false,
            "onclick": null,
            "showDuration": "300",
            "hideDuration": "1000",
            "timeOut": "5000",
            "extendedTimeOut": "1000",
            "showEasing": "swing",
            "hideEasing": "linear",
            "showMethod": "fadeIn",
            "hideMethod": "fadeOut"
        };
        window.addEventListener('toastr:info', event => {
            console.log('Toastr event received:', event);
            toastr.info(event.detail.message);
        });
        
    </script>
</body>
</html>```

```<div>
    <div class="container mt-5">
        <div class="row justify-content-center">
            <div class="col-md-6">
    <form wire:submit.prevent="addPost" >
        <div class="mb-3 row">
            <label for="exampleFormControlInput1" class="col-sm-2 col-form-label">Title</label>
            <div class="col-sm-10">
                <input type="text" class="form-control" id="title" wire:model="title" placeholder="Title">
            </div>
            
            @error('title') <span class="error">{{ $message }}</span> @enderror
        </div>
        <div class="mb-3 row">
            <label for="exampleFormControlInput1" class="col-sm-2 col-form-label">Slug</label>
            <div class="col-sm-10">
                <input type="text" class="form-control" id="slug" wire:model="slug" placeholder="Pls enter Slug">
            </div>
            
            @error('slug')
                <span class="error">{{$message}}</span>
            @enderror
        </div>
        <div class="mb-3 row" >
            <button type="submit" class="btn btn-primary">AddPost</button>
        </div>
    </form>
    <h3>Latest 5 Posts</h3>
    <table class="table">
        <thead>
          <tr>
            <th scope="col">Title</th>
            <th scope="col">Slug</th>
            
          </tr>
        </thead>
        <tbody>
            @foreach($posts as $post)
            <tr>
                <td>{{ $post->title }}</td>
                <td>{{ $post->slug }}</td>
            </tr>
        @endforeach
                
          
        </tbody>
    </table>
            </div>
        </div>
    </div>
</div>
```<?php

namespace App\Livewire;

use Livewire\Component;
use App\Models\Post;

class Posts extends Component
{
    public $title;
    public $slug;
    public $posts;
    public function mount()
    {
        $this->loadPosts();
    }

    public function loadPosts()
    {
        $this->posts = Post::latest()->take(10)->get();
    }

    public function addPost()
    {
        $this->validate([
            'title' => 'required',
            'slug' => 'required|unique:posts,slug',
        ]);

        Post::create([
            'title' => $this->title,
            'slug' => $this->slug,
        ]);
        $this->dispatch('toastr:info', ['message' => 'Post added Successfully']);



        $this->title = '';
        $this->slug = '';

        $this->loadPosts();
    }

    public function render()
    {
        return view('livewire.posts');
    }
}
Please or to participate in this conversation.