diff --git a/app/javascript/dashboard/components/ChatListHeader.vue b/app/javascript/dashboard/components/ChatListHeader.vue
index 039cf7ec6..01a337045 100644
--- a/app/javascript/dashboard/components/ChatListHeader.vue
+++ b/app/javascript/dashboard/components/ChatListHeader.vue
@@ -80,7 +80,7 @@ const toggleConversationLayout = () => {
       </h1>
       <span
         v-if="!hasAppliedFiltersOrActiveFolders"
-        class="p-1 my-0.5 mx-1 rounded-md capitalize bg-slate-50 dark:bg-slate-800 text-xxs text-slate-600 dark:text-slate-300"
+        class="p-1 my-0.5 mx-1 rounded-md capitalize dark:bg-n-solid-3 hover:bg-n-slate-3 text-xxs text-n-slate-11"
       >
         {{ $t(`CHAT_LIST.CHAT_STATUS_FILTER_ITEMS.${activeStatus}.TEXT`) }}
       </span>
diff --git a/app/javascript/dashboard/components/widgets/conversation/ConversationBox.vue b/app/javascript/dashboard/components/widgets/conversation/ConversationBox.vue
index 3c0a45b4b..951fbebef 100644
--- a/app/javascript/dashboard/components/widgets/conversation/ConversationBox.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/ConversationBox.vue
@@ -123,7 +123,10 @@ export default {
         :show-badge="false"
       />
     </woot-tabs>
-    <div v-show="!activeIndex" class="flex h-full min-h-0 m-0 bg-n-background">
+    <div
+      v-show="!activeIndex"
+      class="flex h-full min-h-0 m-0 bg-slate-25 dark:bg-slate-800"
+    >
       <MessagesView
         v-if="currentChat.id"
         :inbox-id="inboxId"
diff --git a/app/javascript/dashboard/components/widgets/conversation/ConversationCard.vue b/app/javascript/dashboard/components/widgets/conversation/ConversationCard.vue
index cdb7e125a..bdb466c37 100644
--- a/app/javascript/dashboard/components/widgets/conversation/ConversationCard.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/ConversationCard.vue
@@ -243,7 +243,7 @@ export default {
   <div
     class="relative flex items-start flex-grow-0 flex-shrink-0 w-auto max-w-full px-4 py-0 border-t-0 border-b-0 border-l-2 border-r-0 border-transparent border-solid cursor-pointer conversation hover:bg-n-alpha-1 dark:hover:bg-n-solid-3/80 group"
     :class="{
-      'active animate-card-select bg-n-alpha-2 dark:bg-n-solid-3/90 border-woot-500':
+      'active animate-card-select bg-n-alpha-2 dark:bg-n-solid-3/90 border-n-brand':
         isActiveChat,
       'unread-chat': hasUnread,
       'has-inbox-name': showInboxName,