c8y-dashboard-gridstack:not([name]):not([use-context]) > .dashboard-theme-dark,
body .dashboard-preview-slot.panel-content-dark,
.dashboard-preview-slot.dashboard-theme-dark,
c8y-context-dashboard.c8y-grid-dashboard.dashboard-theme-dark,
.c8y-grid-dashboard c8y-dashboard-child .panel-content-dark {
  .c8y-dark-theme();

  // Override legacy --text-color to use dark theme value
  // This ensures root-component tokens (which reference --text-color) get the correct dark value
  --text-color: var(--c8y-text-color);
  --text-muted: var(--c8y-text-muted);

  color: @text-color;
}

.dashboard-preview-slot.dashboard-theme-dark {
  // background: #011932 !important;
}

c8y-dashboard-gridstack:not([name]):not([use-context]) > .dashboard-theme-dark,
c8y-context-dashboard.c8y-grid-dashboard.dashboard-theme-dark {
  --c8y-dashboard-background: var(--c8y-palette-low);
  background-color: var(--c8y-dashboard-background);
}

body:has(.dashboard-theme-dark:not(.dashboard-preview-slot)){
  .c8y-ui-action-bar{
    .c8y-dark-theme();
    .btn-help{
      outline: 1px solid @status-info;
      background-color: @status-info;
      --help-info-color: @palette-high;
      color: @palette-high;
    }
  }
}