/* datahuru's colour on the engine's dashboard, linked after the engine's own
   stylesheet. The brand blue fills the actions — buttons — and nothing else:
   what is selected or switched on stays neutral, so a blue fill always means
   "press me". */

:root,
.dark {
  /* The brand blue, and a hair deeper as a fill so white text on it passes
     4.5:1. */
  --brand: #027bfd;
  --primary: #0070f0;
  --primary-foreground: #ffffff;
}

/* Switched on and ticked: the ink, not the brand. */
input.peer[role="switch"]:checked + div {
  background-color: var(--foreground);
}
input[type="checkbox"]:checked,
input[type="checkbox"]:indeterminate {
  background-color: var(--foreground);
  border-color: var(--foreground);
  color: var(--background);
}