// Line height
$lineHeight: 1.15;

// Calendar colors
$calendarColorsQuantity: 18;

// Breakpoints
$breakpoints: (
  md: 992px,
);

// Default font
$font-stack: 'Roboto', sans-serif;

// Values for font-weight
$fonts: (
  thin: 100,
  light: 300,
  regular: 400,
  medium: 500,
  semibold: 600,
  bold: 700,
  black: 900,
);

// Values for font-size
$sizeText: (
  30: 1.875rem,
  28: 1.75rem,
  24: 1.5rem,
  22: 1.375rem,
  20: 1.25rem,
  18: 1.125rem,
  16: 1rem,
  14: 0.875rem,
  12: 0.75rem,
  10: 0.625rem,
  8: 0.5rem,
);

// Colors available
$colors: (
  transparent: transparent,
  darwined-blue-10: #6993c9,
  darwined-blue-30: #507aaf,
  darwined-blue-50: #376197,
  darwined-blue-70: #294870,
  darwined-blue-90: #1a365b,
  primary-darwin-50: #376197,
  foris-blue-10: #bce9f0,
  foris-blue-30: #5ecbdc,
  foris-blue-50: #00abc8,
  foris-blue-70: #0b718e,
  foris-blue-90: #005066,
  foris-green-10: #e0efe7,
  foris-green-30: #add8c4,
  foris-green-50: #6bbe9c,
  foris-green-70: #52987c,
  foris-green-90: #306e55,
  foris-white: #ffffff,
  layout-light: #fafafa,
  layout-dark: #333333,
  layout-black: #000000,
  layout-grey-5: #f4f5f6,
  layout-grey-10: #efeff0,
  layout-grey-20: #dedfe2,
  layout-grey-30: #c7c7cb,
  layout-grey-50: #96979e,
  layout-grey-70: #58595f,
  layout-grey-90: #1b1c1d,
  message-alert-30: #ffda85,
  message-alert-50: #ffc949,
  message-alert-70: #f6b215,
  massages-alert-alert-50: #fec91b,
  message-negative-30: #ff5f58,
  message-negative-50: #e33932,
  message-negative-70: #bc271c,
  massages-negative-error-30: #ff5252,
  message-positive-30: #8bd173,
  message-positive-50: #5eb840,
  message-positive-70: #359116,
  massages-positive-confirmation-50: #35ab5f,
);

// Colors palette
$colorsPalette: (
  palette1: #f69b70,
  palette2: #afcea7,
  palette3: #a5d3d8,
  palette4: #f9cf85,
  palette5: #cca89f,
  palette6: #9db2b4,
  palette7: #cdd89d,
  palette8: #d9c69e,
  palette9: #b79e72,
  palette10: #9dd8b9,
  palette11: #81b1b6,
  palette12: #8ca792,
  palette13: #e0ac52,
  palette14: #a9bdcd,
  palette15: #f7b07d,
  palette16: #b4c8b9,
  palette17: #a49473,
  palette18: #628387,
  palette19: #dd8e53,
  palette20: #a27e76,
  palette21: #6f9e85,
  palette22: #768c9e,
  palette23: #d17b55,
  palette24: #83ab78,
  palette25: #d0c2a7,
  palette26: #a3ac7c,
);

// Check if we can delete this var
$colorsPrincipal: (
  darwined-blue-10: #6993c9,
  darwined-blue-30: #507aaf,
  darwined-blue-50: #376197,
  darwined-blue-70: #294870,
  darwined-blue-90: #1a365b,
);

// Check if we can delete this var
$colorsConfirm: (
  message-negative-30: #ff5f58,
  message-negative-50: #e33932,
  message-negative-70: #bc271c,
  message-alert-30: #fecf4f,
  message-alert-50: #ffbb00,
  message-positive-30: #54cb97,
  message-positive-50: #3fbc89,
  message-positive-70: #21865d,
);

// Check if we can move this var or change this values
$donutColors: (
  1: var(--color-info-50),
  2: var(--color-warning-50),
  3: var(--color-warning-50),
  4: var(--color-gray-30),
);

// Check if we can delete or move this var
$zIndex: (
  basic: 1,
  element: 2,
  intermediate: 3,
  select: 4,
  modal: 10,
  menu: 11,
);

// DT borders
$borders: (
  md: 1px,
);

// DT radius
$radius: (
  sm: 0.125rem,
  md: 0.25rem,
  lg: 0.5rem,
  xl: 0.75rem,
  xxl: 1rem,
  3xl: 1.25rem,
  4xl: 1.5rem,
  5xl: 1.75rem,
  6xl: 2rem,
);

// DT spacing
$spacing: (
  xxs: 0.25rem,
  xs: 0.5rem,
  sm: 0.75rem,
  md: 1rem,
  lg: 1.25rem,
  xl: 1.5rem,
  xxl: 2rem,
  xxxl: 2.75rem,
  4xl: 4rem,
  5xl: 4.5rem,
);

// DT shadow - use css variables and then delete this
$shadow: (
  sm: 0 0 2px 0 rgba(49, 61, 73, 0.5),
  md: (
    0 1px 2px 1px rgba(49, 61, 73, 0.1),
    0 1px 6px 0 rgba(49, 61, 73, 0.2),
  ),
  lg: (
    0 0 4px 1px rgba(49, 61, 73, 0.1),
    0 2px 16px 0 rgba(49, 61, 73, 0.3),
  ),
  elevate: (
    0 2px 4px 0 rgba(49, 61, 73, 0.15),
  ),

  //Web shadows
  web-none: none,
  web-sm: 0 0 2px 0 rgba(49, 61, 73, 0.5),
  web-md: (
    0 2px 8px 0 rgba(49, 61, 73, 0.2),
    0 1px 2px 1 rgba(49, 61, 73, 0.1),
  ),
  web-lg: (
    0 2px 16px 0 rgba(49, 61, 73, 0.3),
    0 0 4px 1 rgba(49, 61, 73, 0.1),
  ),
  web-elevate: 0 2px 4px 0 rgba(49, 61, 73, 0.2),
  web-lg-brand: 0 20px 40px -20px rgba(49, 61, 73, 0.2),
  web-elevate-brand: 0 25px 30px -10px rgba(0, 0, 0, 0.25),
);

// Replace and remove this var
$boxShadow: 0 0 3px 0 rgba(map-get($colors, layout-grey-90), 0.2);