diff --git a/client/src/views/admin/layouts/detail.js b/client/src/views/admin/layouts/detail.js
index 9c9bbce774..c8d0c05dc1 100644
--- a/client/src/views/admin/layouts/detail.js
+++ b/client/src/views/admin/layouts/detail.js
@@ -82,12 +82,14 @@ class LayoutDetailView extends LayoutGridView {
                 'danger',
                 'warning',
                 'info',
+                'primary',
             ],
             style: {
                 'info': 'info',
                 'success': 'success',
                 'danger': 'danger',
                 'warning': 'warning',
+                'primary': 'primary',
             },
             default: 'default',
             translation: 'LayoutManager.options.style',
diff --git a/client/src/views/admin/layouts/side-panels-detail.js b/client/src/views/admin/layouts/side-panels-detail.js
index 51f2408256..63f96c4ca0 100644
--- a/client/src/views/admin/layouts/side-panels-detail.js
+++ b/client/src/views/admin/layouts/side-panels-detail.js
@@ -52,12 +52,14 @@ class LayoutSidePanelsDetailView extends LayoutRowsView {
                 'danger',
                 'warning',
                 'info',
+                'primary',
             ],
             style: {
                 'info': 'info',
                 'success': 'success',
                 'danger': 'danger',
                 'warning': 'warning',
+                'primary': 'primary',
             },
             default: 'default',
             translation: 'LayoutManager.options.style',
diff --git a/frontend/less/espo/value-variables.less b/frontend/less/espo/value-variables.less
index e3f872ba9e..d5ad4eaee2 100644
--- a/frontend/less/espo/value-variables.less
+++ b/frontend/less/espo/value-variables.less
@@ -124,9 +124,9 @@
 @panel-default-border-value: #e7eaed;
 @panel-default-bg-value: @panel-bg-value;
 
-@panel-primary-bg-value: darken(@brand-primary-value, 12%);
+@panel-primary-bg-value: darken(@state-primary-bg-value, 3%);
 @panel-primary-border-value: @panel-primary-bg-value;
-@panel-primary-text-value: @white-color-value;
+@panel-primary-text-value: @state-primary-text-value;
 
 @panel-danger-bg-value: @state-danger-bg-value;
 @panel-danger-border-value: @panel-danger-bg-value;
diff --git a/frontend/less/hazyblue/variables.less b/frontend/less/hazyblue/variables.less
index b8381b411b..3d0c366fa7 100644
--- a/frontend/less/hazyblue/variables.less
+++ b/frontend/less/hazyblue/variables.less
@@ -27,7 +27,7 @@
 @panel-default-border-value: #dcdcdc;
 @panel-default-bg-value: @panel-bg-value;
 
-@panel-primary-bg-value: #849fab;
+@panel-primary-bg-value: #d0e6f9;
 @panel-success-bg-value: #cee0ba;
 @panel-danger-bg-value: #ebccd1;
 @panel-warning-bg-value: #efda97;