/* =========================================================
   Organize color variables in a Sass Map.
   This way, the colors can be iterated, are more organized,
   and are more intuitive to reference.
   ========================================================= */

$palettes: (
  'primary': (
    500: #FF4D4F,
    800: #A31D1B,
  ),
  'neutral': (
    800: #171C26,
    700: #252D3B,
    500: #4C5059,
    400: #7A7E86,
    300: #B8BCCC,
    100: #F1F1F3,
    0:   #FFFFFF,
  ),
  // Feedback colors
  'action': (
    base: #328dfc,
  ),
  'alert': (
    base: #ff8100,
  ),
  'warning': (
    200: #fef5e1,
    base: #f8cd6b,
    700: #da9b0c,
  ),
  'negative': (
    base: #F4260B,
  ),
  'positive': (
    base: #3ecf8e,
  ),
  'box-shadow': (
    base: hsla(0, 50%, 0%, 0.2)
  ),
);