/* ------------ Colors ------------ */

/**
primary colors
**/
$primary-color-100: #FEEFE1;
$primary-color-200: #FDD3AF;
$primary-color-300: #FCB87D;
$primary-color-400: #FB9D4B;
$primary-color-500: #F58220;
$primary-color-600: #D7690A;
$primary-color-700: #A65107;
$primary-color-800: #753905;
$primary-color-900: #442103;

/**
secondary colors
**/
$secondary-color-100: #CCF5EB;
$secondary-color-200: #99ECD7;
$secondary-color-300: #40DBB4;
$secondary-color-400: #00CF9B;
$secondary-color-500: #00C293;
$secondary-color-600: #00AF85;
$secondary-color-700: #008F6D;
$secondary-color-800: #005C46;
$secondary-color-900: #004434;
$background-color: #F3F4F5;

/**
support colors

gray
**/
$support-color-gray-050: #F7F8F9;
$support-color-gray-100: #EEF0F3;
$support-color-gray-150: #DFE3E9;
$support-color-gray-200: #D5DAE1;
$support-color-gray-300: #BBC3CF;
$support-color-gray-400: #8896AB;
$support-color-gray-500: #556987;
$support-color-gray-600: #4D5F7A;
$support-color-gray-700: #404F65;
$support-color-gray-800: #333F51;
$support-color-gray-900: #2A3342;

/**
green
**/
$support-color-green-050: #F0FDF4;
$support-color-green-100: #DCFCE7;
$support-color-green-200: #BBF7D0;
$support-color-green-300: #86EFAC;
$support-color-green-400: #4ADE80;
$support-color-green-500: #22C55E;
$support-color-green-600: #16A34A;
$support-color-green-700: #15803D;
$support-color-green-800: #166534;
$support-color-green-900: #14532D;

/**
purple
**/
$support-color-purple-050: #FBF7FF;
$support-color-purple-100: #F6EEFE;
$support-color-purple-200: #E9D5FD;
$support-color-purple-300: #DCBBFC;
$support-color-purple-400: #C288F9;
$support-color-purple-500: #A855F7;
$support-color-purple-600: #974DDE;
$support-color-purple-700: #7E40B9;
$support-color-purple-800: #653394;
$support-color-purple-900: #522A79;

/**
red
**/
$support-color-red-050: #FEF7F6;
$support-color-red-100: #FDEEEC;
$support-color-red-200: #FBD6D0;
$support-color-red-300: #F9BDB4;
$support-color-red-400: #F48B7C;
$support-color-red-500: #EF5944;
$support-color-red-600: #D7503D;
$support-color-red-700: #B34333;
$support-color-red-800: #8F3529;
$support-color-red-900: #752C21;

/**
orange
**/
$support-color-orange-050: #FFFAF3;
$support-color-orange-100: #FEF5E7;
$support-color-orange-200: #FDE7C2;
$support-color-orange-300: #FBD89D;
$support-color-orange-400: #F8BB54;
$support-color-orange-500: #F59E0B;
$support-color-orange-600: #DD8E0A;
$support-color-orange-700: #B87708;
$support-color-orange-800: #935F07;
$support-color-orange-900: #784D05;

/**
blue
**/
$support-color-blue-050: #F5F9FF;
$support-color-blue-100: #EBF3FE;
$support-color-blue-200: #CEE0FD;
$support-color-blue-300: #B1CDFB;
$support-color-blue-400: #76A8F9;
$support-color-blue-500: #3B82F6;
$support-color-blue-600: #3575DD;
$support-color-blue-700: #2C62B9;
$support-color-blue-800: #234E94;
$support-color-blue-900: #1D4079;

/**
others
**/
$other-color-black: #000000;
$other-color-white: #FFFFFF;
$other-color-gradient: linear-gradient(180deg, #E1E5EA 0%, #FFFFFF 100%);
$scrollbar-size: 6px;

/* ------------ Typography ---------- */
$font-family: 'Inter';
$font-style: normal;

$fs-1: 24px;
$fs-2: 20px;
$fs-3: 16px;
$fs-4: 14px;
$fs-5: 12px;
$fs-6: 10px;

$fw-light: 300;
$fw-regular: 400;
$fw-semibold: 600;
$fw-bold: 700;

$lh-30: 30px;
$lh-24: 24px;
$lh-16: 16px;

:root {
    --support-color-gray-050: #F7F8F9;
}