// Settings :: Cosmetics

$fabric-colors: (
  'primary': #009fee,
  'secondary1': #fff000,
  'secondary2': #de007b,
  'secondary3': #d20f15,
  'black': #000,
  'white': #fff,
  'pale-grey': #f7f7f7,
  'light-grey': #e5e5e5,
  'grey': #6d6d6d,
  'medium-grey': #3f3f3f,
  'dark-grey': #202020,
  'positive': #59b25a,
  'caution': #ffc107,
  'negative': #c74441,
  'info': #357aba,
);

// $fabric-color-interval: 10% !global;
// $fabric-mix-levels: 5;

$fabric-tones: 5;

// Sizes
$fabric-font-size-h0: 64px !default;
$fabric-font-size-h1: 36px !default;
$fabric-font-size-h2: 28px !default;
$fabric-font-size-h3: 24px !default;
$fabric-font-size-h4: 20px !default;
$fabric-font-size-h5: 18px !default;
$fabric-font-size-h6: 16px !default;
$fabric-font-size-standard: 14px !default;
$fabric-font-size-small: 11px !default;
$fabric-font-size-tiny: 11px !default;

$fabric-kerning: -30 !default;

$fabric-sizes: (
  'tiny': (
    $fabric-global-spacing-unit-tiny,
    $fabric-font-size-tiny,
  ),
  'small': (
    $fabric-global-spacing-unit-small,
    $fabric-font-size-h4,
  ),
  'large': (
    $fabric-global-spacing-unit-large,
    $fabric-font-size-h4,
  ),
  'huge': (
    $fabric-global-spacing-unit-huge,
    $fabric-font-size-h1,
  ),
  'jumbo': (
    $fabric-global-spacing-unit-huge,
    $fabric-font-size-h0,
  ),
);

// Surfaces
$fabric-surfaces: (
  '0': 'none',
  '1': '0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24)',
  '2': '0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23)',
  '3': '0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23)',
  '4': '0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22)',
  '5': '0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22)',
);

// Opacities
$fabric-opacities: (
  '0': 1,
  '1': 0.9,
  '2': 0.8,
  '3': 0.7,
  '4': 0.6,
  '5': 0.5,
  '6': 0.4,
  '7': 0.3,
  '8': 0.2,
  '9': 0.1,
);

// Typography
// Variables
$fabric-face-thin: 'FS-Emeric-Thin', Helvetica, sans-serif;
$fabric-face-light: 'FS-Emeric-Light', Helvetica, sans-serif;
$fabric-face-medium: 'FS-Emeric-Medium', Helvetica, sans-serif;
$fabric-face-regular: 'FS-Emeric-Regular', Helvetica, sans-serif;
$fabric-face-bold: 'FS-Emeric-Bold', Helvetica, sans-serif;
$fabric-face-book: 'FS-Emeric-Book', Helvetica, sans-serif;
$fabric-face-core: 'FS-Emeric-Core', Helvetica, sans-serif;

// Maps
$types: (
  display7: (
    64px,
    $fabric-face-bold,
  ),
  display6: (
    33px,
    $fabric-face-bold,
  ),
  display5: (
    32px,
    $fabric-face-bold,
  ),
  display4: (
    28px,
    $fabric-face-bold,
  ),
  display3: (
    24px,
    $fabric-face-bold,
  ),
  display2: (
    22px,
    $fabric-face-medium,
  ),
  display1: (
    20px,
    $fabric-face-regular,
  ),
  button: (
    18px,
    $fabric-face-core,
  ),
  bodylead: (
    18px,
    $fabric-face-medium,
  ),
  body: (
    16px,
    $fabric-face-regular,
  ),
  caption: (
    14px,
    $fabric-face-core,
  ),
  h1: (
    36px,
    $fabric-face-bold,
  ),
  h2: (
    32px,
    $fabric-face-bold,
  ),
  h3: (
    28px,
    $fabric-face-bold,
  ),
  h4: (
    24px,
    $fabric-face-bold,
  ),
  h5: (
    22px,
    $fabric-face-medium,
  ),
  h6: (
    20px,
    $fabric-face-regular,
  ),
);

$typeface: (
  'light': $fabric-face-light,
  'book': $fabric-face-book,
  'medium': $fabric-face-medium,
  'regular': $fabric-face-regular,
  'core': $fabric-face-core,
  'thin': $fabric-face-thin,
  'bold': $fabric-face-bold,
);
