.theme {
  --text-color_primary: 0, 0, 0;
  --text-color_secondary: 55, 58, 60;
  --text-color_tertiary: 55, 58, 60;
  --text-color_quaternary: 180, 165, 127;
  --text-color_high-contrast: 255, 255, 255;

  --button-color_primary: 75, 46, 131;
  --button-color_secondary: 55, 58, 60;
  --button-color_tertiary: 133, 117, 77;
  --button-color_disabled: 217, 216, 234;

  --icon-color_primary: 75, 46, 131;
  --icon-color_secondary: 133, 117, 77;
  --icon-color_tertiary: 180, 165, 127;

  --background-color_primary: 255, 255, 255;
  --background-color_cell: 255, 255, 255;
  --background-color_primary-variant: 248, 248, 248;

  --navigation_background-color: 31, 12, 66;
  --navigation_button-color: 146, 126, 185;
  --navigation_button-color_selected: 31, 12, 66;
  --navigation_button-mobile-color_selected: 255, 255, 255;
  --navigation_button_background-color_selected: 255, 255, 255;

  --tab-panel_background-color: 237, 236, 245;
  --tab-panel_background-color_selected: 75, 46, 131;
  --tab-panel_foreground-color: 0, 0, 0;
  --tab-panel_foreground-color_selected: 255, 255, 255;

  --divider-color_primary: 221, 219, 219;

  --alert-color_dark: 181, 0, 33;

  --today-color_dark: 75, 46, 131;
  --today-color_light: 237, 236, 245;

  --success-color_dark: 36, 175, 155;
  --success-color_light: 209, 234, 230;

  --future-color_dark: 133, 117, 77;
  --future-color_light: 241, 238, 234;

  --canceled-color_dark: 157, 160, 169;
  --canceled-color_light: 238, 238, 238;

  --now-color_dark: 39, 7, 80;
  --now-color_light: 172, 159, 209;

  /* Adjust login logo image scale */
  --loginLogo-scale: 0.63;

  --navLogo-horizontalPadding-scale: 5px;

  /* ** Spinner ** */
  --spinnerCircle-background_1: var(--navigation_button-color);
  --spinnerCircle-background_2: var(--navigation_button-color);
  --spinnerCircle-background_3: var(--navigation_button-color);
  --spinnerCircle-background_4: var(--navigation_button-color);
}

@media screen and (prefers-color-scheme: dark) {
  .theme {
    --text-color_primary: 255, 255, 255;
    --text-color_secondary: 142, 142, 142;
    --text-color_tertiary: 135, 136, 136;
    --text-color_quaternary: 210, 197, 165;
    --text-color_high-contrast: 0, 0, 0;

    --button-color_primary: 157, 137, 200;
    --button-color_secondary: 153, 153, 153;
    --button-color_tertiary: 133, 117, 77;
    --button-color_disabled: 36, 36, 41;

    --icon-color_primary: 109, 81, 163;
    --icon-color_secondary: 133, 117, 71;
    --icon-color_tertiary: 180, 165, 127;

    --background-color_primary: 0, 0, 0;
    --background-color_cell: 20, 20, 20;
    --background-color_primary-variant: 12, 11, 11;

    --navigation_background-color: 0, 0, 0;
    --navigation_button-color: 146, 126, 185;
    --navigation_button-color_selected: 0, 0, 0;
    --navigation_button-mobile-color_selected: 255, 255, 255;
    --navigation_button_background-color_selected: 255, 255, 255;

    --tab-panel_background-color: 34, 33, 37;
    --tab-panel_background-color_selected: 157, 137, 200;
    --tab-panel_foreground-color: 255, 255, 255;
    --tab-panel_foreground-color_selected: 0, 0, 0;

    --divider-color_primary: 42, 38, 46;

    --alert-color_dark: 253, 69, 67;

    --today-color_dark: 75, 46, 131;
    --today-color_light: 35, 34, 54;

    --success-color_dark: 36, 175, 155;
    --success-color_light: 209, 234, 230;

    --future-color_dark: 133, 117, 77;
    --future-color_light: 20, 20, 20;

    --canceled-color_dark: 157, 160, 169;
    --canceled-color_light: 31, 31, 33;

    --now-color_dark: 34, 32, 40;
    --now-color_light: 48, 41, 68;
  }
}