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

/* Neutral Colors */

$neutral-branded-50: #F9FAFA;
$neutral-branded-100: #F3F6FC;
$neutral-branded-150: #F2F5F7;
$neutral-branded-200: #EAEDF0;
$neutral-branded-250: #E1E5EA;
$neutral-branded-300: #D0D6DD;
$neutral-branded-400: #98A3B3;
$neutral-branded-500: #667485;
$neutral-branded-600: #475566;
$neutral-branded-700: #344255;
$neutral-branded-800: #1D283A;

/* Neutral Grey Colors */
$neutral-grey-0: #FFFFFF;
$neutral-grey-100: #FDFDFD;
$neutral-grey-200: #E5E5E5;
$neutral-grey-300: #DDDDDD;
$neutral-grey-400: #D3D3D3;
$neutral-grey-500: #CCCCCC;
$neutral-grey-600: #333333;
$neutral-grey-700: #000000;

/* Primary WordPress Colors */
$primary-wordpress: #0783BE;

$primary-wordpress-100: #0783BE;
$primary-wordpress-200: #0073AA;
$primary-wordpress-300: #0075A5;
$primary-wordpress-400: #066FA1;
$primary-wordpress-500: #066998;
$primary-wordpress-600: #044767;

/* Primary Branded Colors */
$primary-branded-100: #218DE6;
$primary-branded-200: #1E80D9;
$primary-branded-300: #1E80D9;
$primary-branded-400: #196EC6;
$primary-branded-500: #2A3A51;

/* Accented Colors */
$accented-100: #DBDBFF;
$accented-200: #7070FE;
$accented-300: #4F4FD0;



/* Success Colors */
$success-100: #F0F7F1;
$success-200: #B8DEBB;
$success-300: #00A30B;

/* Error Colors */
$error-100: #F7F0ED;
$error-200: #F1B8B5;
$error-300: #F82B21;

/* Elevation -------------------------------------------------------------------------------------------------------- */
$elevation-1: 0px 1px 2px rgba($neutral-branded-800, 0.1);

/* Radius ----------------------------------------------------------------------------------------------------------- */

$radius-md: 6px;
$radius-lg: 8px;
$radius-sm: 4px;

/* Outline ---------------------------------------------------------------------------------------------------------- */

$outline: 3px solid #EBF5FA;

/* Font Size -------------------------------------------------------------------- */

$fs-0: 11px;
$fs-1: 12px;
$fs-2: 13px;
$fs-3: 14px;
$fs-4: 15px;
$fs-5: 16px;
$fs-6: 18px;
$fs-7: 21px;

/* Spacers ------------------------------------------------------------------ */
$spacer-sm: 8px;
$spacer-md: 12px;
$spacer-lg: 24px;