html[data-color-mode="dark"] .gadget .dashboard-item-header {
  background-color: var(--ds-surface-raised, #eeeeee);
}
html[data-color-mode="dark"] .gadget .dashboard-item-title {
  color: var(--ds-text, #ffffff);
}
.gadget.color1 .dashboard-item-header,
.gadget-colors .color1 > a {
  background-color: var(--ds-background-brand-bold, #0747a6);
}
.gadget.color1 .dashboard-item-title {
  color: var(--ds-surface, #ffffff);
}
.gadget.color1 > .gadget-hover > .dashboard-item-header,
.gadget.color1 > .gadget-hover > .dashboard-item-content {
  /* stylelint-disable-next-line */
  border-color: color-mix(in srgb, var(--ds-background-brand-bold, #0747a6) 90%, #ffffff);
}
.gadget.color2 .dashboard-item-header,
.gadget-colors .color2 > a {
  background-color: var(--ds-background-danger-bold, #de350b);
}
.gadget.color2 .dashboard-item-title {
  color: var(--ds-surface, #ffffff);
}
.gadget.color2 > .gadget-hover > .dashboard-item-header,
.gadget.color2 > .gadget-hover > .dashboard-item-content {
  /* stylelint-disable-next-line */
  border-color: color-mix(in srgb, var(--ds-background-danger-bold, #de350b) 90%, #ffffff);
}
.gadget.color3 .dashboard-item-header,
.gadget-colors .color3 > a {
  background-color: var(--ds-background-accent-orange-subtler-pressed, #ff8b00);
}
.gadget.color3 .dashboard-item-title {
  color: var(--ds-surface, #ffffff);
}
.gadget.color3 > .gadget-hover > .dashboard-item-header,
.gadget.color3 > .gadget-hover > .dashboard-item-content {
  /* stylelint-disable-next-line */
  border-color: color-mix(in srgb, var(--ds-background-accent-orange-subtler-pressed, #ff8b00) 90%, #ffffff);
}
.gadget.color4 .dashboard-item-header,
.gadget-colors .color4 > a {
  background-color: var(--ds-background-accent-green-bolder-hovered, #00875a);
}
.gadget.color4 .dashboard-item-title {
  color: var(--ds-surface, #ffffff);
}
.gadget.color4 > .gadget-hover > .dashboard-item-header,
.gadget.color4 > .gadget-hover > .dashboard-item-content {
  /* stylelint-disable-next-line */
  border-color: color-mix(in srgb, var(--ds-background-accent-green-bolder-hovered, #00875a) 90%, #ffffff);
}
.gadget.color5 .dashboard-item-header,
.gadget-colors .color5 > a {
  background-color: var(--ds-background-accent-teal-bolder, #00a3bf);
}
.gadget.color5 .dashboard-item-title {
  color: var(--ds-surface, #ffffff);
}
.gadget.color5 > .gadget-hover > .dashboard-item-header,
.gadget.color5 > .gadget-hover > .dashboard-item-content {
  /* stylelint-disable-next-line */
  border-color: color-mix(in srgb, var(--ds-background-accent-teal-bolder, #00a3bf) 90%, #ffffff);
}
.gadget.color6 .dashboard-item-header,
.gadget-colors .color6 > a {
  background-color: var(--ds-background-accent-purple-bolder-hovered, #6554c0);
}
.gadget.color6 .dashboard-item-title {
  color: var(--ds-surface, #ffffff);
}
.gadget.color6 > .gadget-hover > .dashboard-item-header,
.gadget.color6 > .gadget-hover > .dashboard-item-content {
  /* stylelint-disable-next-line */
  border-color: color-mix(in srgb, var(--ds-background-accent-purple-bolder-hovered, #6554c0) 90%, #ffffff);
}
.gadget.color7 .dashboard-item-header,
.gadget-colors .color7 > a {
  background-color: var(--ds-background-accent-gray-bolder, #5e6c84);
}
.gadget.color7 .dashboard-item-title {
  color: var(--ds-surface, #ffffff);
}
.gadget.color7 > .gadget-hover > .dashboard-item-header,
.gadget.color7 > .gadget-hover > .dashboard-item-content {
  /* stylelint-disable-next-line */
  border-color: color-mix(in srgb, var(--ds-background-accent-gray-bolder, #5e6c84) 90%, #ffffff);
}
.gadget.color8 .dashboard-item-title a {
  color: var(--ds-text, #444444);
}