:root {

  /* Colors */
  --store-primary: 246, 235, 97;
  --store-secondary: 245, 228, 211;
  --store-secondary-40: 251, 244, 237;
  --store-dark: 61, 65, 68;
  --store-gray-one: 139, 139, 139;
  --store-gray-two: 207, 207, 207;
  --store-gray-three: 243, 243, 243;
  --store-promotion: 219, 76, 0;
  --store-success: 1, 152, 43;
  --store-warning: 219, 76, 0;
  --store-danger: 217, 0, 47;
  --store-blue: 22, 0, 255;
  --store-white: 255, 255, 255;
  --store-black: 0, 0, 0;
  --store-light-brown-one: #FBF4ED;
  --store-light-brown-two: #F8EBDE;

  /* Font */
  --store-font: 'Neue Haas Grotesk Display Pro', -apple-system, blinkmacsystemfont, sans-serif;
  --store-icon-font: 'icomoon';
  --store-base-font-size: 16px;
  --store-text: var(--store-dark);

  /* Others / Legacy */
  --store-checkout: var(--store-secondary);
  --iconsBefore: 0;
  --iconsAfter: 0;

  /*
   * Venia
   *  --venia-anim-*: Used in multiple files
   *  --venia-background-color: Only used in Main component
   *  --venia-border: Used in multiple files
   *  --venia-error: Used in multiple files, as error
   *  --venia-error-alt: Not used
   *  --venia-font: Only used in ToastContainer component
   *  --venia-grey: Used in multiple files
   *  --venia-grey-dark: Used in multiple files
   *  --venia-grey-darker: Used in Header component
   *  --venia-grey-darker: Used in Header component
   *  --venia-orange: Used in ToastContainer component, as warning color
   *  --venia-teal: Used in multiple files, as primary color
   *  --venia-teal-alt: Not used
   *  --venia-teal-dark: Used in Button component
   *  --venia-teal-light: Used in multiple files
   *  --venia-text: Used in multiple files
   *  --venia-text-alt: Used in multiple files
   *  --venia-text-hint: Not used
   *  --venia-text-spot: Not used
   *  --venia-warning-dark: Used in CategoryList component
   *  --venia-warning-light: Used in CategoryList component
   */
  --venia-anim-bounce: cubic-bezier(0.5, 1.8, 0.9, 0.8);
  --venia-anim-in: cubic-bezier(0, 0, 0.2, 1);
  --venia-anim-out: cubic-bezier(0.4, 0, 1, 1);
  --venia-anim-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --venia-background-color: var(--store-gray-three);
  --venia-border: var(--store-gray-two);
  --venia-error: var(--store-danger);
  --venia-error-alt: var(--store-danger);
  --venia-font: var(--store-font);
  --venia-grey: var(--store-gray-three);
  --venia-grey-dark: var(--store-gray-two);
  --venia-grey-darker: var(--store-gray-one);
  --venia-orange: var(--store-warning);
  --venia-teal: var(--store-primary);
  --venia-teal-alt: var(--store-primary);
  --venia-teal-dark: var(--store-primary);
  --venia-teal-light: var(--store-primary);
  --venia-text: var(--store-text);
  --venia-text-alt: var(--store-text);
  --venia-text-hint: var(--store-text);
  --venia-text-spot: var(--store-text);
  --venia-warning-dark: 246, 65, 0;
  --venia-warning-light: 255, 136, 93;
}