:root {
  /* figure how the best approach on making this globally supported */
  --text-base: 14px;
  --text-lg: 16px;
  --text-sm: 12px;
  --text-xl: 24px;
  --text-xs: 11px;
  --text-color-strong: #000000;
  --text-color-medium: #5c5c5c;
  --text-color-light: #999999;
}

/* default css variables */
.elc-checkout,
#react-aria-modal-dialog {
  /* TODO - unfortunately there are conflicts with the vulcan's defined variables
     for primary colors, so scoped them to elc apps till we have the design system ready */
  --color-primary-210: #eeeeee;
  --color-primary-300: #e0e0e0;
  --color-primary-350: #dbdbdb;
  --color-primary-400: #bdbdbd;
  --color-primary-500: #aaaaaa;
  --color-primary-600: #707070;
  --color-primary-700: #616161;
  --color-primary-800: #424242;
  --color-primary-900: #212121;
}