:root {
  --red: red;
  --highlight-row-red: #ffd7da;
  --green: green;
  --blue: blue;
  --input-color: var(--dark-color);
  --btn-background-color: var(--dark-color);
  --header-background-color: var(--dark-color);
  --header-background-color1: var(--medium-color);
  --header-background-color2: var(--light-color);
  --legend_color: black;
  --legend_background-color: var(--medium-color);
  --hover-background-color: var(--medium-color);
  --btn-hover-color: var(--hover-medium-color);
  --body-background-color: #bdbdbd;
  --body-background-color: #f5f3f0;
  --font-color-header: white;
  --subtitle-color: var(--dark-color);
  --heading-color: var(--dark-color);
  --btn-selected-color: var(--light-color);
  --score-font-color: white;
}
@media (prefers-color-scheme: dark) {
  :root {
    --red: #ff4d4d;
    --green: #b3ff66;
    --blue: #99ddff;
    --highlight-row-red: red;
    --subtitle-color: var(--medium-color);
    --btn-hover-color: var(--medium-color);
    --heading-color: var(--medium-color);
    --input-color: var(--medium-color);
    --selected-background-color: #00631e;
    --alternate-row-background-color: #171717;
    --body-background-color: black;
    --font-color: white;
    --btn-font-color: white;
    --btn-font-hover-color: black;
    --font-hyperlink-color: var(--light-color);
    --btn-border-color: var(--dark-color);
    --btn-selected-color: black;
    --score-font-color: black;
  }
}