diff --git a/.github/workflows/whiskers-check.yml b/.github/workflows/whiskers-check.yml
index 0413deb..977dd84 100644
--- a/.github/workflows/whiskers-check.yml
+++ b/.github/workflows/whiskers-check.yml
@@ -3,7 +3,7 @@ name: whiskers
 on:
   workflow_dispatch:
   push:
-    branches: [main]
+    branches: [fix/compact-mode-css]
   pull_request:
     branches: [main]
 
diff --git a/templates/userChrome.tera b/templates/userChrome.tera
index 66b0708..feade86 100644
--- a/templates/userChrome.tera
+++ b/templates/userChrome.tera
@@ -36,6 +36,14 @@ whiskers:
     --toolbox-bgcolor-inactive: #{{ mantle.hex }} !important;
   }
 
+  hbox#titlebar {
+    background-color: #{{ mantle.hex }} !important;
+  }
+
+  #zen-appcontent-navbar-container {
+    background-color: #{{ mantle.hex }} !important;
+  }
+
   #permissions-granted-icon{
     color: #{{ mantle.hex }} !important;
   }
diff --git a/themes/Mocha/Mauve/userChrome.css b/themes/Mocha/Mauve/userChrome.css
index b38dd77..4847990 100644
--- a/themes/Mocha/Mauve/userChrome.css
+++ b/themes/Mocha/Mauve/userChrome.css
@@ -26,7 +26,17 @@
     --toolbox-bgcolor-inactive: #181825 !important;
   }
 
-  #permissions-granted-icon{
+  /* For Vertical bar (Sidebar) */
+  hbox#titlebar {
+    background-color: #181825 !important;
+  }
+
+  /* For Toolbar  */
+  #zen-appcontent-navbar-container {
+    background-color: #181825 !important;
+  }
+
+  #permissions-granted-icon {
     color: #181825 !important;
   }