:root {
    /* TP Color */
    
    --navy-400:#197ABF;
    --navy-500:#006CB8;
    --navy-600:#00599A;
    /* Blue Colors */
    --blue-100: #E1E9FF;
    --blue-200: #C3D3FF;
    --blue-300: #A6B9FE;
    --blue-400: #8A9BFE;
    --blue-500: #6A92FE;
    --blue-600: #4969FE;
    --blue-700: #405898;
    --blue-800: #2A3466;
    --blue-900: #151D33;

    /* Red Colors */
    --red-100: #FFFAFA;
    --red-200: #FEECEC;
    --red-300: #FFB5B5;
    --red-400: #FF8CBC;
    --red-500: #FF6363;
    --red-600: #FF4242;
    --red-700: #E52222;
    --red-800: #BD0C0C;
    --red-900: #750404;

    /* Neutral Colors */
    --neutral-0: #000000;
    --neutral-5: #0F0F10;
    --neutral-7: #141415;
    --neutral-10: #1E1719;
    --neutral-15: #1B1C1E;
    --neutral-17: #212225;
    --neutral-20: #292A2D;
    --neutral-22: #2E2F;
    --neutral-23: #333438;
    --neutral-25: #37383C;
    --neutral-30: #46474C;
    --neutral-40: #5A5C63;
    --neutral-50: #70737C;
    --neutral-60: #878A93;
    --neutral-70: #989BA2;
    --neutral-80: #AEB0B6;
    --neutral-90: #C2C4C8;
    --neutral-95: #DBDCEF;
    --neutral-96: #E1E2E4;
    --neutral-97: #EAEBDC;
    --neutral-98: #F4F4F5;
    --neutral-99: #F7F7F8;
    --neutral-100: #FFFFFF;

    --adaptiveGrey0: #fff;
    --adaptiveGrey50: #f9fafb;
    --adaptiveGrey100: #f2f4f6;
    --adaptiveGrey200: #e5e8eb;
    --adaptiveGrey300: #d1d6db;
    --adaptiveGrey400: #b0b8c1;
    --adaptiveGrey500: #8b95a1;
    --adaptiveGrey600: #6b7684;
    --adaptiveGrey700: #4e5968;
    --adaptiveGrey800: #333d4b;
    --adaptiveGrey900: #191f28;

    
    
    /* Shadow */
    --shadow-normal: 0px 1px 2px 0px rgba(0, 0, 0, 0.12), 0px 0px 1px 0px rgba(0, 0, 0, 0.08), 0px 0px 1px 0px rgba(0, 0, 0, 0.08);;
    --shadow-emphasize: 0px 2px 8px 0px rgba(46, 93, 214, 0.12), 0px 1px 4px 0px rgba(46, 93, 214, 0.08), 0px 0px 1px 0px rgba(46, 93, 214, 0.08);    
    --shadow-strong: 0px 6px 12px 0px rgba(0, 0, 0, 0.12), 0px 4px 8px 0px rgba(0, 0, 0, 0.08), 0px 0px 4px 0px rgba(0, 0, 0, 0.08);;
    --shadow-heavy: 0px 16px 20px 0px rgba(0, 0, 0, 0.12), 0px 8px 16px 0px rgba(0, 0, 0, 0.08), 0px 0px 8px 0px rgba(0, 0, 0, 0.08);;

    /* Primary , Dark Mode 동일 */
    --primary-normal: var(--navy-500);
    --primary-hover: var(--navy-400);
    --primary-active: var(--navy-600);
    
    /* Text, Icon  */
    --text-default: var(--neutral-10);
    --text-strong: var(--neutral-0);
    --text-sub: var(--neutral-30);
    --text-info: var(--neutral-60);
    --text-assistive: var(--neutral-90);
    --text-disable: var(--neutral-96);
    --text-reverse: var(--neutral-100);

    --text-default: var(--neutral-10);
    --text-strong: var(--neutral-0);
    --text-sub: var(--neutral-30);
    --text-info: var(--neutral-60);
    --text-assistive: var(--neutral-90);
    /* --text-disable: var(--neutral-96); */
    --text-disable: #C2C4C8;
    --text-reverse: var(--neutral-100);
    --text-palceholder: #B3B5B7;
    

    /* Background  */
    --background-default: var(--neutral-100);
    --background-alternative: var(--neutral-98);
    --background-code: var(--neutral-10);
    --background-strong: var(--neutral-95);
    --background-hover: var(--neutral-96);
    --background-disable: #EAEAEA;

    /* Background/Dimmer  */
    --background-dimmer-light-default-1: rgba(247, 247, 248, 0.5);
    --background-dimmer-light-default-2: rgba(231, 231, 232, 0.5);

    /* Border  */
    --border-default: var(--neutral-96);
    --border-second: #DBDCDF;
    --border-focus: #333333;
    
    --border-sub: var(--neutral-97);
    --border-alternative: var(--neutral-98);
    --border-strong: var(--neutral80);

    /* Danger - Light, Dark 동일 */
    --danger-text: var(--red-600);
    --danger-base: var(--red-500);
    --danger-border: var(--red-200);
    --danger-surface: var(--red-100);

    /* Information - Light, Dark 동일 */
    --info-text: var(--blue-400);
    --info-base: var(--blue-500);
    --info-border: var(--blue-200);
    --info-surface: var(--blue-100);
    /* System */
    --system-blue:#306AFF;
    --system-red:#FF5959;
}