:root {
  --si-color-pure-black: #000000;
  --si-color-black: #101820;
  --si-color-dark-gray: #4e5661;
  --si-color-medium-gray: #b8c0cc;
  --si-color-light-gray: #e4e9f2;
  --si-color-off-white: #f2f4f7;
  --si-color-white: #ffffff;
  --si-color-dark-blue: #00458a;
  --si-color-bright-blue: #82d5fa;
  --si-color-brand-blue: #009cde;
  --si-color-yellow: #ffcd00;
  --si-color-error-red: #cc2200;
  --si-color-disabled: #65778b;
}

:root {
  --si-color-primary: var(--si-color-black);
  --si-color-secondary: var(--si-color-bright-blue);
  --si-color-tertiary: var(--si-color-yellow);
  --si-color-success: var(--si-color-bright-blue);
  --si-color-info: var(--si-color-dark-gray);
  --si-color-warning: var(--si-color-yellow);
  --si-color-danger: var(--si-color-error-red);
  --si-color-light: var(--si-color-light-gray);
  --si-color-dark: var(--si-color-dark-gray);
  --si-color-a11y-background: var(--si-color-white);
}