/***
 COLOR START
 ***/
// BASE
@color-base-white: #ffffff;
@color-base-black: #101828;
// NEUTRAL
@color-gray-800: #1d2939;
@color-gray-700: #344054;
@color-gray-600: #475467;
@color-gray-500: #667085;
@color-gray-400: #98a2b3;
@color-gray-300: #d0d5dd;
@color-gray-200: #eaecf0;
@color-gray-100: #f2f4f7;
@color-gray-50: #f9fafb;
@color-gray-25: #fcfcfd;
@color-white: #ffffff;
// EFFECT
@color-bg-overlay: rgba(0, 0, 0, 0.4);
// PRIMARY
@color-primary-900: #622605;
@color-primary-800: #923a07;
@color-primary-700: #c34d0a;
@color-primary-600: #dc560b;
@color-primary-500: #f4600c;
@color-primary-400: #f6803d;
@color-primary-300: #fab086;
@color-primary-200: #fbbf9e;
@color-primary-100: #fccfb6;
@color-primary-50: #fde7db;
@color-primary-25: #fef7f3;

@color-secondary-900: #164c63;
@color-secondary-800: #155b75;
@color-secondary-700: #0e7090;
@color-secondary-600: #088ab2;
@color-secondary-500: #06aed4;
@color-secondary-400: #22ccee;
@color-secondary-300: #67e3f9;
@color-secondary-200: #a5f0fc;
@color-secondary-100: #cff9fe;
@color-secondary-50: #ecfdff;
@color-secondary-25: #f5feff;
// FUNCTIONAL
// Success
@color-success-900: #054f31;
@color-success-800: #05603a;
@color-success-700: #027a48;
@color-success-600: #039855;
@color-success-500: #12b76a;
@color-success-400: #32d583;
@color-success-300: #6ce9a6;
@color-success-200: #a6f4c5;
@color-success-100: #d1fadf;
@color-success-50: #ecfdf3;
@color-success-25: #f6fef9;
// Warning
@color-warning-900: #7a2e0e;
@color-warning-800: #93370d;
@color-warning-700: #b54708;
@color-warning-600: #dc6803;
@color-warning-500: #f79009;
@color-warning-400: #fdb022;
@color-warning-300: #fec84b;
@color-warning-200: #fedf89;
@color-warning-100: #fef0c7;
@color-warning-50: #fffaeb;
@color-warning-25: #fffcf5;
// Error
@color-error-900: #7a271a;
@color-error-800: #912018;
@color-error-700: #b42318;
@color-error-600: #d92d20;
@color-error-500: #f04438;
@color-error-400: #f97066;
@color-error-300: #fda29b;
@color-error-200: #fecdca;
@color-error-100: #fee4e2;
@color-error-50: #fef3f2;
@color-error-25: #fffbfa;

// SUPPORT COLOR
// Yellow
@color-yellow-900: #664c0b;
@color-yellow-800: #997210;
@color-yellow-700: #cc9816;
@color-yellow-600: #e6ab18;
@color-yellow-500: #ffbe1b;
@color-yellow-400: #ffcb49;
@color-yellow-300: #ffe298;
@color-yellow-200: #ffe5a4;
@color-yellow-100: #ffecbb;
@color-yellow-50: #fff5dd;
@color-yellow-25: #fffcf4;

// Default
@default-color: @color-gray-500;
@default-color-hover: color(~`colorPalette('@{default-color}', 5) `);
@default-color-active: color(~`colorPalette('@{default-color}', 7) `);
@default-color-outline: fade(@default-color, @outline-fade);
@default-color-deprecated-bg: @color-gray-100;
@default-color-deprecated-border: @color-gray-300;