diff --git a/server/ui-src/App.vue b/server/ui-src/App.vue
index c6d9269..b231ce4 100644
--- a/server/ui-src/App.vue
+++ b/server/ui-src/App.vue
@@ -533,7 +533,7 @@ export default {
 						<i class="bi bi-envelope me-1" v-if="isConnected"></i>
 						<i class="bi bi-arrow-clockwise me-1" v-else></i>
 						Inbox 
-						<span style="margin-top: -5px; margin-left: 5px;" class="position-absolute badge rounded-pill text-bg-secondary" title="Unread messages" v-if="unread">
+						<span class="badge rounded-pill text-bg-primary ms-1" title="Unread messages" v-if="unread">
 							{{ formatNumber(unread) }}
 						</span>
 					</a>
diff --git a/server/ui-src/assets/_bootstrap_variables.scss b/server/ui-src/assets/_bootstrap_variables.scss
index 3e26dec..1d3791f 100644
--- a/server/ui-src/assets/_bootstrap_variables.scss
+++ b/server/ui-src/assets/_bootstrap_variables.scss
@@ -1 +1,2 @@
 $link-decoration: none;
+$primary: #3465b5;