// Global border radius
$border-radius-root: 4px;
$rounded: (
  'xl': $border-radius-root * 5
);

// Spacing
$spacer: 4px;

$grid-breakpoints: (
  'xs': 0,
  'sm': 600px,
  'md': 960px,
  'lg': 1280px - 16px,
  'xl': 1920px - 16px
);

$display-breakpoints: (
  'print-only': 'only print',
  'screen-only': 'only screen',
  'xs-only': 'only screen and (max-width: #{map-get($grid-breakpoints, 'sm') - 1})',
  'sm-only': 'only screen and (min-width: #{map-get($grid-breakpoints, 'sm')}) and (max-width: #{map-get($grid-breakpoints, 'md') - 1})',
  'sm-and-down': 'only screen and (max-width: #{map-get($grid-breakpoints, 'md') - 1})',
  'sm-and-up': 'only screen and (min-width: #{map-get($grid-breakpoints, 'sm')})',
  'md-only': 'only screen and (min-width: #{map-get($grid-breakpoints, 'md')}) and (max-width: #{map-get($grid-breakpoints, 'lg') - 1})',
  'md-and-down': 'only screen and (max-width: #{map-get($grid-breakpoints, 'lg') - 1})',
  'md-and-up': 'only screen and (min-width: #{map-get($grid-breakpoints, 'md')})',
  'lg-only': 'only screen and (min-width: #{map-get($grid-breakpoints, 'lg')}) and (max-width: #{map-get($grid-breakpoints, 'xl') - 1})',
  'lg-and-down': 'only screen and (max-width: #{map-get($grid-breakpoints, 'xl') - 1})',
  'lg-and-up': 'only screen and (min-width: #{map-get($grid-breakpoints, 'lg')})',
  'xl-only': 'only screen and (min-width: #{map-get($grid-breakpoints, 'xl')})'
);

// Transitions
$transition: (
  'fast-out-slow-in': cubic-bezier(0.4, 0, 0.2, 1),
  'linear-out-slow-in': cubic-bezier(0, 0, 0.2, 1),
  'fast-out-linear-in': cubic-bezier(0.4, 0, 1, 1),
  'ease-in-out': cubic-bezier(0.4, 0, 0.6, 1),
  'fast-in-fast-out': cubic-bezier(0.25, 0.8, 0.25, 1),
  'swing': cubic-bezier(0.25, 0.8, 0.5, 1)
);

// Inputs and labels
$label-font-size: 14px;
$input-font-size: 14px;
$input-top-spacing: 16px;
$text-field-active-label-height: 12px;

// List
$list-item-dense-title-font-size: 0.875rem;
$list-item-dense-title-font-weight: 600;
$list-item-two-line-min-height: 44px;

// Table
$data-table-expanded-content-box-shadow: inset 0 4px 10px -5px rgba(50, 50, 50, 0.1), inset 0 -4px 6px -5px rgba(50, 50, 50, 0.1);

// Chips and icons
$icon-sizes: (
  'default': (
    'height': 30
  )
);
$chip-padding: 5px 12px;

$badge-bordered-width: 2px;
$badge-dot-border-width: 2px;
$badge-dot-height: 9.5px;
$badge-dot-width: 9.5px;
$badge-dot-border-radius: 4.75px;