@use "sass:color";
// Layout Change Breakpoints

$breakpoint-small: 481px;
$breakpoint-medium: 641px;
$breakpoint-xmedium: 860px;
$breakpoint-large: 1025px;
$breakpoint-xlarge: 1200px;
$breakpoint-xxlarge: 1441px;
$breakpoint-xxxlarge: 1921px;

// Font size variables
$font-size-extra-large:	  32px;
$font-size-large:				  18px;
$font-size-md-large:		  16px;
$font-size-md:            14px;
$font-size-small:				  12px;
$font-size-mini:				  10px;

$font-weight-thin: 		    100;
$font-weight-light: 	    300;
$font-weight-normal: 	    400;
$font-weight-medium: 	    500;
$font-weight-bold: 		    700;

// Colors
$color-primary: #4D4CFC;
$color-primary-light: color.adjust($color-primary, $lightness: 15%);
$color-primary-dark: color.adjust($color-primary, $lightness: -20%);
$color-primary-darker: color.adjust(color.adjust($color-primary, $lightness: -40%), $saturation: -60%);

$color-secondary: #AFB3C0;
$color-secondary-light: color.adjust($color-secondary, $lightness: 15%);
$color-secondary-dark: color.adjust($color-secondary, $lightness: -15%);

$color-success: #45DFB0;
$color-success-light: color.adjust($color-success, $lightness: 15%);
$color-success-dark: color.adjust($color-success, $lightness: -15%);

$color-alert: #FF425E;
$color-alert-light: color.adjust($color-alert, $lightness: 15%);
$color-alert-dark: color.adjust($color-alert, $lightness: -15%);

$color-warning: #FFFF00;
$color-warning-light: color.adjust($color-warning, $lightness: 15%);
$color-warning-dark: color.adjust($color-warning, $lightness: -15%);

$color-dark-gray: #666666;

$color-text: #434448;
$color-text: #434448;
$default-color-hover: #EFF0F3;

$default-background-color-app: #F4F4F5;
$list-divider-color: #dadce2;