:root {
  /* Color palette. */
  --color-white: #ffffff;
  --color-white-o-90: rgba(255, 255, 255, 0.9);
  --color-white-o-50: rgba(255, 255, 255, 0.5);
  --color-white-o-25: rgba(255, 255, 255, 0.25);
  --color-black: #111111;
  --color-black-o-25: rgb(17, 17, 17, 0.25);
  --color-black-o-50: rgb(17, 17, 17, 0.50);

  /* Typography colors. */
  --color-text: #212121;
  --color-text-dimmed: #545560;
  --color-text-extra-dimmed: #9e9e9e;
  --color-mark-background: #fff59d;

  /* Main colors. */
  --color-primary: #1565c0;
  --color-on-primary: var(--color-white);
  --color-primary-light: #5e92f3;
  --color-primary-dark: #003c8f;
  --color-primary-container: #e3f2fd;
  --color-on-primary-container: #0d47a1;

  --color-secondary: #ef6c00;
  --color-on-secondary: var(--color-white);
  --color-secondary-light: #ff9d3f;
  --color-secondary-dark: #b53d00;
  --color-secondary-container: #fff3e0;
  --color-on-secondary-container: #b53d00;

  --color-background: #f5f5f5;
  --color-surface: var(--color-white);
  --color-on-surface: var(--color-black);

  --color-error: #d32f2f;
  --color-on-error: var(--color-white);
  --color-error-light: #ff6659;
  --color-error-dark: #9a0007;
  --color-error-container: #ffcdd2;
  --color-on-error-container: #7f0000;

  --color-warning: #fbc02d;
  --color-on-warning: var(--color-black);
  --color-warning-container: #fff9c4;
  --color-on-warning-container: #bf360c;

  --color-success: #388e3c;
  --color-on-success: var(--color-black);
  --color-success-container: #c8e6c9;
  --color-on-success-container: #1b5e20;

  /* Utility colors. */
  --color-border: #bdbdbd;
  --color-border-light: var(--color-material-grey-200);
  --color-border-dark: #222330;
  --color-disabled: #eeeeee;

  /* Additional colors. */
  --color-material-grey-50: #fafafa;
  --color-material-grey-200: #eeeeee;
  --color-material-grey-300: #e0e0e0;
  --color-material-grey-900: #212121;
  --color-material-red-50: #ffebee;
  --color-material-green-400: #66bb6a;
  --color-material-yellow-100: #fff9c4;
  --color-material-amber-300: #ffd54f;
}