diff --git a/src/assets/styles/_common-mixins.scss b/src/assets/styles/_common-mixins.scss
index 4cf6984..dfe467c 100644
--- a/src/assets/styles/_common-mixins.scss
+++ b/src/assets/styles/_common-mixins.scss
@@ -40,11 +40,11 @@
 }
 
 @mixin inset-shadow {
-    box-shadow: inset 0 4px 3px -2px var(--iqser-btn-bg-hover);
+    box-shadow: inset 0 4px 3px -2px var(--iqser-shadow);
 }
 
 @mixin drop-shadow {
-    box-shadow: 0 4px 3px 2px var(--iqser-btn-bg-hover);
+    box-shadow: 0 2px 6px 0 var(--iqser-shadow);
 }
 
 @mixin clear-btn {
@@ -59,9 +59,9 @@
 
 @mixin clear-a {
     text-decoration: none;
-    color: initial;
+    color: var(--iqser-text);
 
     &:hover {
-        color: initial;
+        color: var(--iqser-text);
     }
 }
diff --git a/src/assets/styles/common-breadcrumbs.scss b/src/assets/styles/common-breadcrumbs.scss
index 5756f33..7df17fb 100644
--- a/src/assets/styles/common-breadcrumbs.scss
+++ b/src/assets/styles/common-breadcrumbs.scss
@@ -18,7 +18,7 @@
         color: var(--iqser-primary);
 
         &[aria-expanded='true'] .mat-button-wrapper > span {
-            color: var(--iqser-accent);
+            color: var(--iqser-text);
         }
     }
 }
diff --git a/src/assets/styles/common-buttons.scss b/src/assets/styles/common-buttons.scss
index 84c43ab..f136b90 100644
--- a/src/assets/styles/common-buttons.scss
+++ b/src/assets/styles/common-buttons.scss
@@ -23,7 +23,7 @@
     }
 
     &.mat-button-disabled .mat-button-wrapper {
-        color: var(--iqser-accent);
+        color: var(--iqser-text);
         opacity: 0.3;
     }
 }
diff --git a/src/assets/styles/common-components.scss b/src/assets/styles/common-components.scss
index 4598a4f..a3bd775 100644
--- a/src/assets/styles/common-components.scss
+++ b/src/assets/styles/common-components.scss
@@ -79,6 +79,7 @@
         display: flex;
         align-items: center;
         min-width: fit-content;
+        @include mixins.line-clamp(1);
 
         mat-icon {
             width: 10px;
diff --git a/src/assets/styles/common-dialogs.scss b/src/assets/styles/common-dialogs.scss
index ede9ae4..9eda646 100644
--- a/src/assets/styles/common-dialogs.scss
+++ b/src/assets/styles/common-dialogs.scss
@@ -2,7 +2,8 @@
 
 .mat-dialog-container {
     display: flex !important;
-    color: var(--iqser-accent);
+    color: var(--iqser-text);
+    background-color: var(--iqser-background);
     padding: 0 !important;
     border-radius: 8px !important;
     @include common-mixins.scroll-bar;
diff --git a/src/assets/styles/common-inputs.scss b/src/assets/styles/common-inputs.scss
index c9c540b..e4c566f 100644
--- a/src/assets/styles/common-inputs.scss
+++ b/src/assets/styles/common-inputs.scss
@@ -177,7 +177,7 @@ form .iqser-input-group:not(first-of-type) {
         letter-spacing: 0;
         line-height: 14px;
         margin-bottom: 2px;
-        color: var(--iqser-accent);
+        color: var(--iqser-text);
 
         &.mat-checkbox-layout {
             opacity: 1;
diff --git a/src/assets/styles/common-layout.scss b/src/assets/styles/common-layout.scss
index d9a2c4a..27a6ed0 100644
--- a/src/assets/styles/common-layout.scss
+++ b/src/assets/styles/common-layout.scss
@@ -125,7 +125,7 @@ section.settings {
     background-color: var(--iqser-background);
     max-width: 650px;
     height: fit-content;
-    box-shadow: 0 1px 5px 0 rgba(40, 50, 65, 0.19);
+    box-shadow: 0 1px 5px 0 rgba(var(--iqser-accent-rgb), 0.19);
     position: unset;
 
     .heading-l {
diff --git a/src/assets/styles/common-loading.scss b/src/assets/styles/common-loading.scss
index 43fdc4f..7f93ba9 100644
--- a/src/assets/styles/common-loading.scss
+++ b/src/assets/styles/common-loading.scss
@@ -6,15 +6,15 @@
 @keyframes dots {
     0%,
     20% {
-        color: rgba(40, 50, 65, 0);
-        text-shadow: 0.25em 0 0 rgba(40, 50, 65, 0), 0.5em 0 0 rgba(40, 50, 65, 0);
+        color: rgba(var(--iqser-accent-rgb), 0);
+        text-shadow: 0.25em 0 0 rgba(var(--iqser-accent-rgb), 0), 0.5em 0 0 rgba(var(--iqser-accent-rgb), 0);
     }
     40% {
         color: #283241;
-        text-shadow: 0.25em 0 0 rgba(40, 50, 65, 0), 0.5em 0 0 rgba(40, 50, 65, 0);
+        text-shadow: 0.25em 0 0 rgba(var(--iqser-accent-rgb), 0), 0.5em 0 0 rgba(var(--iqser-accent-rgb), 0);
     }
     60% {
-        text-shadow: 0.25em 0 0 #283241, 0.5em 0 0 rgba(40, 50, 65, 0);
+        text-shadow: 0.25em 0 0 #283241, 0.5em 0 0 rgba(var(--iqser-accent-rgb), 0);
     }
     80%,
     100% {
diff --git a/src/assets/styles/common-menu.scss b/src/assets/styles/common-menu.scss
index 8775cd5..f2586b9 100644
--- a/src/assets/styles/common-menu.scss
+++ b/src/assets/styles/common-menu.scss
@@ -2,12 +2,12 @@
 
 .mat-menu-panel {
     border-radius: 8px !important;
-    box-shadow: 0 2px 6px 0 rgba(40, 50, 65, 0.3);
     max-width: none !important;
     min-width: 180px !important;
     margin-top: 10px;
-    background-color: var(--iqser-background);
+    background-color: var(--iqser-popup-background);
     @include common-mixins.scroll-bar;
+    @include common-mixins.drop-shadow;
 
     .mat-menu-content:not(:empty) {
         padding-top: 8px;
diff --git a/src/assets/styles/common-select.scss b/src/assets/styles/common-select.scss
index 56fee69..5773c34 100644
--- a/src/assets/styles/common-select.scss
+++ b/src/assets/styles/common-select.scss
@@ -8,15 +8,15 @@
     .mat-option {
         margin: 1px 8px;
         border-radius: 4px;
+        color: var(--iqser-text);
 
         &:hover:not(.mat-option-disabled),
         &:focus:not(.mat-option-disabled) {
-            background-color: var(--iqser-grey-6);
+            background-color: var(--iqser-btn-bg);
         }
 
         &.mat-selected:not(.mat-option-multiple) {
             background-color: rgba(var(--iqser-primary-rgb), 0.2);
-            color: var(--iqser-text);
         }
     }
 }
diff --git a/src/assets/styles/common-toggle.scss b/src/assets/styles/common-toggle.scss
index 161a8bd..092d02d 100644
--- a/src/assets/styles/common-toggle.scss
+++ b/src/assets/styles/common-toggle.scss
@@ -27,11 +27,11 @@
     &.mat-primary.mat-checked {
         .mat-slide-toggle-bar {
             background-color: var(--iqser-primary);
-            border: 1px solid var(--iqser-white);
+            border: 1px solid var(--iqser-background);
         }
 
         .mat-slide-toggle-thumb {
-            background-color: var(--iqser-white);
+            background-color: var(--iqser-background);
         }
 
         .mat-slide-toggle-thumb-container {
diff --git a/src/lib/buttons/help-button/help-button.component.html b/src/lib/buttons/help-button/help-button.component.html
index bac8fc3..45fbb64 100644
--- a/src/lib/buttons/help-button/help-button.component.html
+++ b/src/lib/buttons/help-button/help-button.component.html
@@ -1,14 +1,6 @@
-<iqser-icon-button
-    *ngIf="dialogButton"
-    (action)="activateHelpMode()"
-    icon="iqser:help-outline"
-    type="help"
-    [label]="'help-mode.button-text' | translate"
-></iqser-icon-button>
 <iqser-circle-button
-    *ngIf="!dialogButton"
     (action)="activateHelpMode()"
+    [tooltip]="'help-mode.button-text' | translate"
     icon="iqser:help-outline"
     type="help"
-    [tooltip]="'help-mode.button-text' | translate"
 ></iqser-circle-button>
diff --git a/src/lib/buttons/help-button/help-button.component.ts b/src/lib/buttons/help-button/help-button.component.ts
index 86f8d49..c684311 100644
--- a/src/lib/buttons/help-button/help-button.component.ts
+++ b/src/lib/buttons/help-button/help-button.component.ts
@@ -8,7 +8,6 @@ import { HelpModeService } from '@iqser/common-ui';
     styleUrls: ['./help-button.component.scss'],
 })
 export class HelpButtonComponent implements OnInit, OnDestroy {
-    @Input() dialogButton = true;
     @Input() helpButtonKey?: string;
 
     constructor(private readonly _helpModeService: HelpModeService) {}
@@ -27,6 +26,6 @@ export class HelpButtonComponent implements OnInit, OnDestroy {
             window.open(url, '_blank');
             return;
         }
-        this._helpModeService.activateHelpMode(this.dialogButton);
+        this._helpModeService.activateHelpMode();
     }
 }
diff --git a/src/lib/help-mode/help-mode-dialog/help-mode-dialog.component.scss b/src/lib/help-mode/help-mode-dialog/help-mode-dialog.component.scss
index 6f76799..ba695e0 100644
--- a/src/lib/help-mode/help-mode-dialog/help-mode-dialog.component.scss
+++ b/src/lib/help-mode/help-mode-dialog/help-mode-dialog.component.scss
@@ -1,5 +1,5 @@
 section {
-    background: var(--iqser-grey-4);
+    background: var(--iqser-grey-4); // todo
     align-items: center;
 
     .content {
diff --git a/src/lib/listing/scroll-button/scroll-button.component.scss b/src/lib/listing/scroll-button/scroll-button.component.scss
index ee4a294..8eaace7 100644
--- a/src/lib/listing/scroll-button/scroll-button.component.scss
+++ b/src/lib/listing/scroll-button/scroll-button.component.scss
@@ -6,7 +6,7 @@
     width: 44px;
     border: none;
     border-radius: 8px 0 0 8px;
-    box-shadow: -1px 1px 5px 0 rgba(40, 50, 65, 0.25);
+    box-shadow: -1px 1px 5px 0 rgba(var(--iqser-accent-rgb), 0.25);
 
     &.bottom {
         bottom: 30px;