Toast message content overflows the toast border

[Dmytro-Lukashenko]

Describe the bug

If the user adds to the "summary" or "detail" option a string without spaces length of more than 47 symbols the close button and text start to overflow the border of the toast.

Reproducer

https://stackblitz.com/edit/yashqz?file=src%2FApp.vue

PrimeVue version

3.30.2

Vue version

3.x

Language

ES6

Build / Runtime

Vite

Browser(s)

Chrome

Steps to reproduce the behavior

1.. Create a new Vue component and add the Toast component to the template.
2. Add a button to the template to trigger the toast appearing.
2. In the script tag import useToast composable
3. Create toast constant const toast = useToast();
4. Adjust toast options in the show function:

const show = () => {
  toast.add({
    severity: 'info',
    summary: 'Info',
    detail: 'File: 21_08_2023_test_environment_json_logs_data.json',
    life: 300000,
  });
}; 

6. Click the button to toast appears.
7. The toast content overflows the toast border.

Expected behavior

The toast content doesn't overflow the toast border.