/**
 * Copyright (c) Matthieu Jabbour. All Rights Reserved.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 *
 */

 $colors: (
  primary: #2185d0,
  secondary: #1b1c1d,
  error: #db2828,
  warning: #fbbd08,
) !default;

$onColors: (
  primary: #ffffff,
  secondary: #ffffff,
  error: #ffffff,
  warning: #ffffff,
) !default;

$umbraValues: (
  0: 0px 0px 0px 0px #000000,
  1: 0px 0px 0px 0px #000000,
  2: 0px 0px 0px 0px #000000,
  3: 0px 0px 0px 0px #000000,
  4: 0px 0px 0px 0px #000000,
  5: 0px 0px 0px 0px #000000,
  6: 0px 0px 0px 0px #000000,
  7: 0px 0px 0px 0px #000000,
  8: 0px 0px 0px 0px #000000,
  9: 0px 0px 0px 0px #000000,
  10: 0px 0px 0px 0px #000000,
  11: 0px 0px 0px 0px #000000,
  12: 0px 0px 0px 0px #000000,
  13: 0px 0px 0px 0px #000000,
  14: 0px 0px 0px 0px #000000,
  15: 0px 0px 0px 0px #000000,
  16: 0px 0px 0px 0px #000000,
  17: 0px 0px 0px 0px #000000,
  18: 0px 0px 0px 0px #000000,
  19: 0px 0px 0px 0px #000000,
  20: 0px 0px 0px 0px #000000,
  21: 0px 0px 0px 0px #000000,
  22: 0px 0px 0px 0px #000000,
  23: 0px 0px 0px 0px #000000,
  24: 0px 0px 0px 0px #000000,
);

$penumbraValues: (
  0: 0px 0px 0px 0px #000000,
  1: 0px 0px 0px 0px #000000,
  2: 0px 0px 0px 0px #000000,
  3: 0px 0px 0px 0px #000000,
  4: 0px 0px 0px 0px #000000,
  5: 0px 0px 0px 0px #000000,
  6: 0px 0px 0px 0px #000000,
  7: 0px 0px 0px 0px #000000,
  8: 0px 0px 0px 0px #000000,
  9: 0px 0px 0px 0px #000000,
  10: 0px 0px 0px 0px #000000,
  11: 0px 0px 0px 0px #000000,
  12: 0px 0px 0px 0px #000000,
  13: 0px 0px 0px 0px #000000,
  14: 0px 0px 0px 0px #000000,
  15: 0px 0px 0px 0px #000000,
  16: 0px 0px 0px 0px #000000,
  17: 0px 0px 0px 0px #000000,
  18: 0px 0px 0px 0px #000000,
  19: 0px 0px 0px 0px #000000,
  20: 0px 0px 0px 0px #000000,
  21: 0px 0px 0px 0px #000000,
  22: 0px 0px 0px 0px #000000,
  23: 0px 0px 0px 0px #000000,
  24: 0px 0px 0px 0px #000000,
);

$ambiantValues: (
  0: 0px 0px 0px 0px #000000,
  1: 0px 0px 0px 0px #000000,
  2: 0px 0px 0px 0px #000000,
  3: 0px 0px 0px 0px #000000,
  4: 0px 0px 0px 0px #000000,
  5: 0px 0px 0px 0px #000000,
  6: 0px 0px 0px 0px #000000,
  7: 0px 0px 0px 0px #000000,
  8: 0px 0px 0px 0px #000000,
  9: 0px 0px 0px 0px #000000,
  10: 0px 0px 0px 0px #000000,
  11: 0px 0px 0px 0px #000000,
  12: 0px 0px 0px 0px #000000,
  13: 0px 0px 0px 0px #000000,
  14: 0px 0px 0px 0px #000000,
  15: 0px 0px 0px 0px #000000,
  16: 0px 0px 0px 0px #000000,
  17: 0px 0px 0px 0px #000000,
  18: 0px 0px 0px 0px #000000,
  19: 0px 0px 0px 0px #000000,
  20: 0px 0px 0px 0px #000000,
  21: 0px 0px 0px 0px #000000,
  22: 0px 0px 0px 0px #000000,
  23: 0px 0px 0px 0px #000000,
  24: 0px 0px 0px 0px #000000,
);

$cornerRadius: 1gp;

@import url('https://fonts.googleapis.com/css2?family=Lato&display=swap');
@font-face {
  font-family: 'Icons';
  src: url(https://fonts.gstatic.com/s/materialicons/v50/flUhRq6tzZclQEJ-Vdg-IuiaDsNcIhQ8tQ.woff2)
    format('woff2');
}

$typeScale: (
  headline1: (
    typeface: (
      Roboto,
      sans-serif,
    ),
    font: 500,
    size: 30px,
    case: capitalize,
    line-height: 49px,
    letter-spacing: 0px,
  ),
  headline2: (
    typeface: (
      inbentaMontserrat,
      sans-serif,
    ),
    font: 100,
    size: 28px,
    case: capitalize,
    line-height: 45px,
    letter-spacing: 0px,
  ),
  headline3: (
    typeface: (
      inbentaMontserrat,
      sans-serif,
    ),
    font: 500,
    size: 22px,
    case: capitalize,
    line-height: 36px,
    letter-spacing: 0px,
  ),
  headline4: (
    typeface: (
      inbentaMontserrat,
      sans-serif,
    ),
    font: 100,
    size: 20px,
    case: capitalize,
    line-height: 32px,
    letter-spacing: 0px,
  ),
  headline5: (
    typeface: (
      inbentaMontserrat,
      sans-serif,
    ),
    font: 400,
    size: 15px,
    case: uppercase,
    line-height: 24px,
    letter-spacing: 0.3px,
  ),
  headline6: (
    typeface: (
      inbentaMontserrat,
      sans-serif,
    ),
    font: 400,
    size: 12px,
    case: uppercase,
    line-height: 19px,
    letter-spacing: 0.3px,
  ),
  subtitle1: (
    typeface: (
      inbentaOpenSans,
      sans-serif,
    ),
    font: 500,
    size: 14px,
    case: capitalize,
    line-height: 24px,
    letter-spacing: 0.4px,
  ),
  subtitle2: (
    typeface: (
      inbentaOpenSans,
      sans-serif,
    ),
    font: 500,
    size: 13px,
    case: capitalize,
    line-height: 22px,
    letter-spacing: 0.4px,
  ),
  body1: (
    typeface: (
      inbentaOpenSans,
      sans-serif,
    ),
    font: 400,
    size: 15px,
    case: capitalize,
    line-height: 24px,
    letter-spacing: 0.4px,
  ),
  body2: (
    typeface: (
      inbentaOpenSans,
      sans-serif,
    ),
    font: 400,
    size: 13.5px,
    case: capitalize,
    line-height: 22px,
    letter-spacing: 0.48px,
  ),
  caption: (
    typeface: (
      inbentaOpenSans,
      sans-serif,
    ),
    font: 400,
    size: 12px,
    case: capitalize,
    line-height: 20px,
    letter-spacing: 0.57px,
  ),
  button: (
    typeface: Lato,
    font: 700,
    size: 0.875em,
    case: capitalize,
    line-height: 100%,
    letter-spacing: 0.5px,
  ),
  overline: (
    typeface: (
      inbentaOpenSans,
      sans-serif,
    ),
    font: 500,
    size: 14px,
    case: capitalize,
    line-height: 19px,
    letter-spacing: 0px,
  ),
  icon: (
    typeface: Icons,
    font: 400,
    size: 1em,
    line-height: 99%,
  ),
) !default;