diff --git a/resources/js_vue3/App.vue b/resources/js_vue3/App.vue
index 0e4f6282..8cf0f9e9 100644
--- a/resources/js_vue3/App.vue
+++ b/resources/js_vue3/App.vue
@@ -55,7 +55,7 @@
         :duration="4000"
         :speed="0"
         :max="1"
-        classes="notification is-radiusless" />
+        classes="notification notification-banner is-radiusless" />
     <main class="main-section">
         <RouterView />
     </main>
diff --git a/resources/js_vue3/assets/app.scss b/resources/js_vue3/assets/app.scss
index 9c89d468..b852621c 100644
--- a/resources/js_vue3/assets/app.scss
+++ b/resources/js_vue3/assets/app.scss
@@ -927,14 +927,14 @@ footer.main .field.is-grouped {
 }
 
 @supports (padding-top: env(safe-area-inset-top)) {
-  .notification {
+  .notification-banner {
     --safe-area-inset-top: env(safe-area-inset-top);
     padding-top: calc(0.4rem + var(--safe-area-inset-top));
   }
 }
 
 @supports (padding-top: constant(safe-area-inset-top)) {
-  .notification {
+  .notification-banner {
     --safe-area-inset-top: constant(safe-area-inset-top);
     padding-top: calc(0.4rem + var(--safe-area-inset-top));
   }