Integrate light theme's `@menu-bg-color` using a media query

public/css/icinga/base.less

@@ -60,6 +60,8 @@
 
 // Menu colors
 @menu-bg-color: #06062B;
+@menu-hover-bg-color: fade(@menu-bg-color, 50%);
+@menu-search-hover-bg-color: darken(@menu-bg-color, 20%);
 @menu-active-bg-color: #181742;
 @menu-color: #DBDBDB;
 @menu-active-color: @text-color;
@@ -104,6 +106,10 @@
     --text-color-on-icinga-blue: #F5F9FA;
     --menu-flyout-bg-color: #F5F9FA;
     --tab-hover-bg-color: fade(#F5F9FA, 50%);
+
+    --menu-bg-color: #DEECF1;
+    --menu-hover-bg-color: fade(#DEECF1, 50%);
+    --menu-search-hover-bg-color: darken(#DEECF1, 20%);
   }
 }
 

public/css/icinga/layout.less

@@ -32,7 +32,7 @@
 }
 
 #header-logo-container {
-  background: @menu-bg-color;
+  .var(background, menu-bg-color);
   height: 6em;
   padding: 1.25em;
   width: 16em;
@@ -141,7 +141,7 @@
 
 // Mobile menu
 #layout.minimal-layout #sidebar {
-  background-color: @menu-bg-color;
+  .var(background-color, menu-bg-color);
 }
 
 #mobile-menu-toggle {
@@ -332,7 +332,7 @@
   }
 
   #search:focus {
-    background-color: @menu-bg-color;
+    .var(background-color, menu-bg-color);
     border-radius: 0 .25em .25em 0;
     box-shadow: 0 0 .25em 0 rgba(0, 0, 0, .2);
     color: @menu-color;

public/css/icinga/login.less

@@ -4,7 +4,7 @@
 
 #login {
   height: 100%;
-  background-color: @menu-bg-color;
+  .var(background-color, menu-bg-color);
   background-repeat:  no-repeat;
   background-position: center center;
   text-align: center;

public/css/icinga/menu.less

@@ -10,7 +10,7 @@
 @icon-width: 1.7em; // 1.5em width + 0.2em right margin
 
 #menu {
-  background-color: @menu-bg-color;
+  .var(background-color, menu-bg-color);
   width: 100%;
   flex: 1;
   overflow: auto;
@@ -92,7 +92,7 @@
 
   &:not(.selected) > a:hover,
   &:not(.selected) > a:focus {
-    background-color: fade(@menu-bg-color, 50%)
+    .var(background-color, menu-hover-bg-color);
   }
 
   // Balance icon weight for non active menu items
@@ -222,7 +222,7 @@
 
   &:hover,
   &:focus {
-    background-color: darken(@menu-bg-color, 20);
+    .var(background-color, menu-search-hover-bg-color);
   }
 }
 
@@ -402,7 +402,7 @@
 
   &:focus,
   &:hover {
-    background-color: darken(@menu-bg-color, 20);
+    .var(background-color, menu-search-hover-bg-color);
     outline: none;
   }
 }

public/css/icinga/tabs.less

@@ -3,7 +3,7 @@
 // Styles for tab navigation of containers
 
 .tabs {
-  background-color: @menu-bg-color;
+  .var(background-color, menu-bg-color);
   letter-spacing: -0.417em;
 }
 

public/css/themes/icinga-light-theme.less

@@ -7,8 +7,6 @@
 
 @text-color: #535353;
 
-@menu-bg-color: #DEECF1;
-
 @menu-color: #676767;
 @menu-active-bg-color: #EDF7FC;