diff --git a/files/static/src/main.css b/files/static/src/main.css
index 03b1278457..e44bde62c8 100644
--- a/files/static/src/main.css
+++ b/files/static/src/main.css
@@ -156,7 +156,4 @@
 }
 
 /* ---------------------- TOASTS ----------------------- */
-.toast {
-	@apply bg-gray-300 border border-gray-400
-}
 
diff --git a/files/templates/toasts/toasts.html b/files/templates/toasts/toasts.html
index 7fb5eeb8de..cb92014fb1 100644
--- a/files/templates/toasts/toasts.html
+++ b/files/templates/toasts/toasts.html
@@ -5,12 +5,12 @@
 </div>
 
 <div class="toast" id="toast-post-success" style="position: fixed; bottom: 1.5rem; margin: 0 auto; left: 0; right: 0; width: 275px; z-index: 1000" role="alert" aria-live="assertive" aria-atomic="true" data-bs-animation="true" data-bs-autohide="true" data-bs-delay="5000">
-	<div class="toast-body bg-success text-center text-white">
+	<div class="toast-body bg-green-500 border border-green-900 text-center text-white">
 		<i class="fas fa-comment-alt-smile mr-2"></i><span id="toast-post-success-text"></span>
 	</div>
 </div>
 <div class="toast" id="toast-post-error" style="position: fixed; bottom: 1.5rem; margin: 0 auto; left: 0; right: 0; width: 275px; z-index: 1000" role="alert" aria-live="assertive" aria-atomic="true" data-bs-animation="true" data-bs-autohide="true" data-bs-delay="5000">
-	<div class="toast-body bg-danger text-center text-white">
+	<div class="toast-body bg-red-500 border border-red-900 text-center text-white">
 		<i class="fas fa-exclamation-circle mr-2"></i><span id="toast-post-error-text">Error, please try again later.</span>
 	</div>
 </div>
\ No newline at end of file