@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap');


:root {
    /* @section Sizes @do_not_theme */
    --size-00: 0px;
    --size-01: 1px;
    --size-02: 2px;
    --size-04: 4px;
    --size-06: 6px;
    --size-08: 8px;
    --size-12: 12px;
    --size-16: 16px;
    --size-20: 20px;
    --size-24: 24px;
    --size-28: 28px;
    --size-32: 32px;
    --size-36: 36px;
    --size-40: 40px;
    --size-44: 44px;
    --size-48: 48px;
    --size-52: 52px;
    --size-56: 56px;
    --size-60: 60px;
    --size-64: 64px;
    --size-68: 68px;
    --size-72: 72px;
    --size-76: 76px;
    --size-80: 80px;
    --size-84: 84px;
    --size-88: 88px;
    --size-92: 92px;
    --size-96: 96px;
    --size-100: 100px;
    --size-104: 104px;
    --size-108: 108px;
    --size-112: 112px;
    --size-116: 116px;
    --size-120: 120px;
    --size-124: 124px;
    --size-128: 128px;
    --size-132: 132px;
    --size-136: 136px;
    --size-176: 176px;
    /* @end */

    /* @section Colors */
    /* @subsection Charcoal */
    --primary-charcoal-50: #D9DADB;
    --primary-charcoal-100: #C0C1C2;
    --primary-charcoal-200: #A0A1A4;
    --primary-charcoal-300: #818286;
    --primary-charcoal-400: #616367;
    --primary-charcoal-500: #424449;
    --primary-charcoal-600: #37393D;
    --primary-charcoal-700: #2C2D31;
    --primary-charcoal-800: #212224;
    --primary-charcoal-900: #161718;
    --primary-charcoal-1000: #0D0E0F;
    --primary-charcoal-a50: #42444917;
    --primary-charcoal-a100: #4244492E;
    --primary-charcoal-a150: #4244493D;
    --primary-charcoal-a200: #42444952;
    /* @end */

    /* @subsection Green  */
    --primary-fgreen-50: #E0EBDE;
    --primary-fgreen-100: #CBDEC8;
    --primary-fgreen-200: #B0CDAC;
    --primary-fgreen-300: #96BD90;
    --primary-fgreen-400: #7CAC75;
    --primary-fgreen-500: #629C59;
    --primary-fgreen-600: #52824A;
    --primary-fgreen-700: #41683B;
    --primary-fgreen-800: #314E2C;
    --primary-fgreen-900: #21341E;
    --primary-fgreen-1000: #141F12;
    --primary-fgreen-a50: #629C5917;
    --primary-fgreen-a100: #629C592E;
    --primary-fgreen-a150: #629C593D;
    --primary-fgreen-a200: #629C5952;
    /* @end */

    /* @subsection Cyan */
    --primary-cyan-50: #CFF1EF;
    --primary-cyan-100: #AFE7E5;
    --primary-cyan-200: #87DBD8;
    --primary-cyan-300: #5ECFCB;
    --primary-cyan-400: #36C3BE;
    --primary-cyan-500: #0EB7B1;
    --primary-cyan-600: #0C9994;
    --primary-cyan-700: #097A76;
    --primary-cyan-800: #075C59;
    --primary-cyan-900: #053D3B;
    --primary-cyan-1000: #032523;
    --primary-cyan-a50: #0EB7B117;
    --primary-cyan-a100: #0EB7B12E;
    --primary-cyan-a150: #0EB7B13D;
    --primary-cyan-a200: #0EB7B152;
    /* @end */

    /* @subsection Aqua */
    --primary-aqua-50: #D8F2EF;
    --primary-aqua-100: #BEE9E4;
    --primary-aqua-200: #9EDFD7;
    --primary-aqua-300: #7DD4C9;
    --primary-aqua-400: #5DC9BC;
    --primary-aqua-500: #3CBEAE;
    --primary-aqua-600: #329E91;
    --primary-aqua-700: #287F74;
    --primary-aqua-800: #1E5F57;
    --primary-aqua-900: #143F3A;
    --primary-aqua-1000: #0C2623;
    --primary-aqua-a50: #3CBEAE17;
    --primary-aqua-a100: #3CBEAE2E;
    --primary-aqua-a150: #3CBEAE3D;
    --primary-aqua-a200: #3CBEAE52;
    /* @end */

    /* @subsection Light Green */
    --primary-lgreen-50: #EBF8E9;
    --primary-lgreen-100: #DEF4DB;
    --primary-lgreen-200: #CEEEC9;
    --primary-lgreen-300: #BDE8B7;
    --primary-lgreen-400: #ADE3A5;
    --primary-lgreen-500: #9CDD93;
    --primary-lgreen-600: #82B87B;
    --primary-lgreen-700: #689362;
    --primary-lgreen-800: #4E6F4A;
    --primary-lgreen-900: #344A31;
    --primary-lgreen-1000: #1F2C1D;
    --primary-lgreen-a50: #9CDD9317;
    --primary-lgreen-a100: #9CDD932E;
    --primary-lgreen-a150: #9CDD933D;
    --primary-lgreen-a200: #9CDD9352;
    /* @end */

    /* @subsection Crimson */
    --primary-crimson-50: #FFF5F5;
    --primary-crimson-100: #FEE4E2;
    --primary-crimson-200: #FEC6C3;
    --primary-crimson-300: #FD9D96;
    --primary-crimson-400: #F96C62;
    --primary-crimson-500: #F04438;
    --primary-crimson-600: #D92D20;
    --primary-crimson-700: #B42318;
    --primary-crimson-800: #9A0E0E;
    --primary-crimson-900: #880C0C;
    --primary-crimson-1000: #750A0A;
    --primary-crimson-a50: #D92D2017;
    --primary-crimson-a100: #D92D202E;
    --primary-crimson-a150: #D92D203D;
    --primary-crimson-a200: #D92D2052;
    /* @end */

    /* @subsection Royal */
    --primary-royal-50: #DBDCED;
    --primary-royal-100: #c3c5e0;
    --primary-royal-200: #A6A9D1;
    --primary-royal-300: #888CC2;
    --primary-royal-400: #6A6FB2;
    --primary-royal-500: #4C52A3;
    --primary-royal-600: #3F4488;
    --primary-royal-700: #33376D;
    --primary-royal-800: #262952;
    --primary-royal-900: #191B36;
    --primary-royal-1000: #0F1021;
    --primary-royal-a50: #4C52A317;
    --primary-royal-a100: #4C52A32E;
    --primary-royal-a150: #4C52A33D;
    --primary-royal-a200: #4C52A352;
    /* @end */

    /* @subsection Coral */
    --primary-coral-50: #FDE9DD;
    --primary-coral-100: #FCDAC6;
    --primary-coral-200: #FBC8AA;
    --primary-coral-300: #F9B58D;
    --primary-coral-400: #F8A371;
    --primary-coral-500: #F69054;
    --primary-coral-600: #CD7846;
    --primary-coral-700: #A46038;
    --primary-coral-800: #7B482A;
    --primary-coral-900: #52301C;
    --primary-coral-1000: #311D11;
    --primary-coral-a50: #F6905417;
    --primary-coral-a100: #F690542E;
    --primary-coral-a150: #F690543D;
    --primary-coral-a200: #F6905452;
    /* @end */

    /* @subsection Sky */
    --netural-sky-50: #F8FAFC;
    --netural-sky-100: #D2E0F3;
    --netural-sky-200: #BCD1ED;
    --netural-sky-300: #A6C2E8;
    --netural-sky-400: #8FB2E2;
    --netural-sky-500: #79A3DC;
    --netural-sky-600: #6588B7;
    --netural-sky-700: #516D93;
    --netural-sky-800: #3C516E;
    --netural-sky-900: #283649;
    --netural-sky-1000: #18212C;
    --netural-sky-a50: #79A3DC17;
    --netural-sky-a100: #79A3DC2E;
    --netural-sky-a150: #79A3DC3D;
    --netural-sky-a200: #79A3DC52;
    /* @end */

    /* @subsection Slate Blue */
    --netural-slateblue-50: #DFE4E9;
    --netural-slateblue-100: #C9D2DA;
    --netural-slateblue-200: #AFBBC8;
    --netural-slateblue-300: #94A4B6;
    --netural-slateblue-400: #798EA3;
    --netural-slateblue-500: #5E7791;
    --netural-slateblue-600: #4E6379;
    --netural-slateblue-700: #3F4F61;
    --netural-slateblue-800: #2F3C49;
    --netural-slateblue-900: #1F2830;
    --netural-slateblue-1000: #13181D;
    --netural-slateblue-a50: #5E779117;
    --netural-slateblue-a100: #5E77912E;
    --netural-slateblue-a150: #5E77913D;
    --netural-slateblue-a200: #5E779152;
    /* @end */

    /* @subsection Gray */
    --netural-gray-50: #E4E7E9;
    --netural-gray-100: #D2D7DA;
    --netural-gray-200: #BBC2C7;
    --netural-gray-300: #A5AEB4;
    --netural-gray-400: #8E9AA2;
    --netural-gray-500: #78868F;
    --netural-gray-600: #647077;
    --netural-gray-700: #50595F;
    --netural-gray-800: #3C4347;
    --netural-gray-900: #282D30;
    --netural-gray-1000: #181B1D;
    --netural-gray-a50: #78868F17;
    --netural-gray-a100: #78868F2E;
    --netural-gray-a150: #78868F3D;
    --netural-gray-a200: #78868F6B;
    /* @end */

    /* @subsection Yellow */
    --netural-yellow-50: #F8EDD2;
    --netural-yellow-100: #F3E1B5;
    --netural-yellow-200: #EDD290;
    --netural-yellow-300: #E6C36A;
    --netural-yellow-400: #E0B445;
    --netural-yellow-500: #DAA520;
    --netural-yellow-600: #B68A1B;
    --netural-yellow-700: #916E15;
    --netural-yellow-800: #6D5310;
    --netural-yellow-900: #49370B;
    --netural-yellow-1000: #2C2106;
    --netural-yellow-a50: #DAA52017;
    --netural-yellow-a100: #DAA5202E;
    --netural-yellow-a150: #DAA5203D;
    --netural-yellow-a200: #DAA52052;
    /* @end */

    /* @subsection Lavendar Gray */
    --netural-lavgray-50: #FCFDFE;
    --netural-lavgray-100: #FBFBFD;
    --netural-lavgray-200: #F9FAFC;
    --netural-lavgray-300: #F6F8FB;
    --netural-lavgray-400: #F4F6FA;
    --netural-lavgray-500: #F2F4F9;
    --netural-lavgray-600: #CACBD0;
    --netural-lavgray-700: #A1A3A6;
    --netural-lavgray-800: #797A7D;
    --netural-lavgray-900: #515153;
    --netural-lavgray-1000: #303132;
    --netural-lavgray-a50: #F2F4F917;
    --netural-lavgray-a100: #F2F4F92E;
    --netural-lavgray-a150: #F2F4F93D;
    --netural-lavgray-a200: #F2F4F952;
    /* @end */

    /* @subsection White */
    --netural-white-10: #FFFFFF17;
    --netural-white-25: #FFFFFF2E;
    --netural-white-50: #FFFFFF3D;
    --netural-white-100: #FFFFFF52;
    --netural-white-200: #FFFFFF7A;
    --netural-white-300: #FFFFFFA3;
    --netural-white-400: #FFFFFFCC;
    --netural-white-450: #FFFFFFE0;
    --netural-white-500: #FFFFFF;
    /* @end */

    /* @subsection Black */
    --netural-black-10: #00000017;
    --netural-black-25: #0000002E;
    --netural-black-50: #0000003D;
    --netural-black-100: #00000052;
    --netural-black-200: #0000007A;
    --netural-black-300: #000000A3;
    --netural-black-400: #000000CC;
    --netural-black-450: #000000E0;
    --netural-black-500: #000000;
    /* @end */

    /* @section Font Sizes */
    --fz-size-00: 0px;
    --fz-size-10: 10px;
    --fz-size-11: 11px;
    --fz-size-12: 12px;
    --fz-size-14: 14px;
    --fz-size-16: 16px;
    --fz-size-18: 18px;
    --fz-size-20: 20px;
    --fz-size-24: 24px;
    --fz-size-30: 30px;
    --fz-size-32: 32px;
    --fz-size-34: 34px;
    --fz-size-36: 36px;
    --fz-size-38: 38px;
    --fz-size-40: 40px;
    --fz-size-42: 42px;
    --fz-size-48: 48px;
    --fz-size-56: 56px;
    --fz-size-64: 64px;
    --fz-size-72: 72px;
    --fz-size-92: 92px;
    /* @end */

    /* @section Line Height */
    --lineheight-00: 0px;
    --lineheight-14: 14px;
    --lineheight-16: 16px;
    --lineheight-18: 18px;
    --lineheight-20: 20px;
    --lineheight-22: 22px;
    --lineheight-24: 24px;
    --lineheight-26: 26px;
    --lineheight-32: 32px;
    --lineheight-36: 36px;
    --lineheight-38: 38px;
    --lineheight-40: 40px;
    --lineheight-42: 42px;
    --lineheight-46: 46px;
    --lineheight-48: 48px;
    --lineheight-50: 50px;
    --lineheight-56: 56px;
    --lineheight-64: 64px;
    --lineheight-70: 70px;
    --lineheight-78: 78px;
    --lineheight-100: 100px;
    /* @end */

    /* @section font-weight @do_not_theme */
    --fw-200: 200;
    --fw-300: 300;
    --fw-400: 400;
    --fw-500: 500;
    --fw-600: 600;
    --fw-700: 700;
    --fw-800: 800;
    --fw-900: 900;
    /* @end */

    /* @section para-spacing @do_not_theme */
    --ps-00: 0px;
    --ps-08: 8px;
    --ps-10: 10px;
    --ps-11: 11px;
    --ps-12: 12px;
    /* @end */

    /* @section list-spacing @do_not_theme */
    --lis-00: 0px;
    --lis-04: 4px;
    --lis-08: 8px;
    --lis-12: 12px;
    --lis-16: 16px;
    --lis-20: 20px;
    --lis-24: 24px;
    /* @end */

    /* @section spacing @do_not_theme */
    --spacing-0: 0px;
    --spacing-1: 2px;
    --spacing-2: 4px;
    --spacing-3: 8px;
    --spacing-4: 12px;
    --spacing-5: 16px;
    --spacing-6: 20px;
    --spacing-7: 24px;
    --spacing-8: 32px;
    --spacing-9: 40px;
    --spacing-10: 48px;
    --spacing-11: 56px;   
    /* @end */

    /* @section Border Radius */
    --bradius-none: 0px;
    --bradius-xsmall: 1px;
    --bradius-small: 2px;
    --bradius-medium: 4px;
    --bradius-large: 8px;
    --bradius-xlarge: 12px;
    --bradius-2xlarge: 16px;
    --bradius-max: 1000px;
    /* @end */

    /* @section border-width @do_not_theme */
    --bwidth-none: 0px;
    --bwidth-thinner: 0.5px;
    --bwidth-thin: 1px;
    --bwidth-thick: 1.5px;
    --bwidth-thicker: 2px;
    /* @end */

    /* @section Icon Size */
    --iconsize-xsmall: 8px;
    --iconsize-small: 12px;
    --iconsize-medium: 16px;
    --iconsize-large: 20px;
    --iconsize-xlarge: 24px;
    --iconsize-2xlarge: 32px;
    --iconsize-3xlarge: 36px;
    --iconsize-4xlarge: 44px;
    /* @end */

    /* @section opacity @do_not_theme */  
    --opacity-0: 0;
    --opacity-1: 0.08;
    --opacity-2: 0.12;
    --opacity-3: 0.16;
    --opacity-4: 0.24;
    --opacity-5: 0.32;
    --opacity-6: 0.40;
    --opacity-7: 0.48;
    --opacity-8: 0.56;
    --opacity-9: 0.64;
    --opacity-10: 0.72;
    --opacity-11: 0.88;
    --opacity-12: 1;


    /* @section elevation microraised  @do_not_theme */
    --elevation-micro: 0px 2px 5px;
    /* @end */

    /* @section elevation lowraised  @do_not_theme */
    --elevation-low: 0px 2px 16px;
    /* @end */

    /* @section elevation midraised  @do_not_theme */
    --elevation-mid: 0px 8px 24px;
    /* @end */

    /* @section elevation highraised  @do_not_theme */
    --elevation-high: 0px 16px 48px -4px;
    /* @end */
    /* @section elevation bottomsheet  @do_not_theme */
    --elevation-bottom: 0px -16px 48px -4px;
    /* @end */


	/* @section Typography*/
	--typography-typefaces-display: "Playfair Display";
    --typography-typefaces-heading: "Raleway";
    --typography-typefaces-body: "Nunito Sans";
    --typography-typefaces-code: "IBM Plex Mono";
	/* @end */
	
    /* @section Font Weight @do_not_theme */
    --font-weight-regular: var(--fw-400);
    --font-weight-semi-bold: var(--fw-600);
    --font-weight-bold: var(--fw-700);
	
	
    /* @section Paragraph Spacing @do_not_theme */
    --paragraph-spacing-00: var(--ps-00);
    --paragraph-spacing-100: var(--ps-08);
    --paragraph-spacing-200: var(--ps-10);
    --paragraph-spacing-300: var(--ps-11);
    --paragraph-spacing-400: var(--ps-12);
	
	
    /* @section List Spacing @do_not_theme */
    --list-spacing-00: var(--lis-00);
    --list-spacing-100: var(--lis-08);


    /*screensize button xsmall*/
    --button-xsmall-horizontal-padding: var(--spacing-3);
    --button-xsmall-height: var( --size-28);
    --button-xsmall-width-iconoly: var( --size-28);
    --button-xsmall-gap: var(--spacing-2);
    --button-xsmall-border-radius: var( --bradius-medium);
    --button-xsmall-leading-icon: var(--iconsize-small);
    --button-xsmall-trailing-icon: var(--iconsize-small);
    --button-xsmall-main-icon: var(--iconsize-medium);
	
	
    /*screensize button small*/
    --button-small-horizontal-padding: var(--spacing-4);
    --button-small-height: var( --size-32);
    --button-small-width-iconoly: var( --size-32);
    --button-small-gap: var(--spacing-2);
    --button-small-border-radius: var( --bradius-medium);
    --button-small-leading-icon: var(--iconsize-small);
    --button-small-trailing-icon: var(--iconsize-small);
    --button-small-main-icon: var(--iconsize-medium);
	
	
    /*screensize button medium*/
    --button-medium-horizontal-padding: var(--spacing-6);
    --button-medium-height: var( --size-36);
    --button-medium-width-iconoly: var( --size-36);
    --button-medium-gap: var(--spacing-3);
    --button-medium-border-radius: var( --bradius-medium);
    --button-medium-leading-icon: var(--iconsize-medium);
    --button-medium-trailing-icon: var(--iconsize-medium);
    --button-medium-main-icon: var(--iconsize-medium);
	
	
    /*screensize button large*/
    --button-large-horizontal-padding: var(--spacing-6);
    --button-large-height: var( --size-48);
    --button-large-width-iconoly: var( --size-48);
    --button-large-gap: var(--spacing-3);
    --button-large-border-radius: var( --bradius-medium);
    --button-large-leading-icon: var(--iconsize-medium);
    --button-large-trailing-icon: var(--iconsize-medium);
    --button-large-main-icon: var(--iconsize-medium);


    /*counter small*/
    --counter-small-horizontal-padding: var(--spacing-3);
    --counter-small-vertical-padding: var(--spacing-1);
    --counter-small-font-size: var(--fz-size-10);
    --counter-small-line-height: var(--lineheight-16);
    --counter-small-border-radius: var(--bradius-max);
    --counter-small-font-weight: var(--fw-700);

    --counter-medium-horizontal-padding: var(--spacing-3);
    --counter-medium-vertical-padding: var(--spacing-2);
    --counter-medium-font-size: var(--fz-size-10);
    --counter-medium-line-height: var(--lineheight-18);
    --counter-medium-border-radius: var(--bradius-max);
    --counter-medium-font-weight: var(--fw-700);

    --counter-large-horizontal-padding: var(--spacing-4);
    --counter-large-vertical-padding: var(--spacing-2);
    --counter-large-font-size: var(--fz-size-12);
    --counter-large-line-height: var(--lineheight-18);
    --counter-large-border-radius: var(--bradius-max);
    --counter-large-font-weight: var(--fw-700);


    /*tag medium*/
    --tag-medium-left-padding: var(--spacing-3);
    --tag-medium-right-padding: var(--spacing-2);
    --tag-medium-vertical-padding: var(--spacing-1);
    --tag-medium-leading-icon: var(--iconsize-small);
    --tag-medium-gap: var(--spacing-2);
    --tag-medium-border-radius: var(--bradius-max);
	
	
    /*tag large*/
    --tag-large-left-padding: var(--spacing-4);
    --tag-large-right-padding: var(--spacing-3);
    --tag-large-vertical-padding: var(--spacing-2);
    --tag-large-leading-icon-size: var(--iconsize-small);
    --tag-large-gap: var(--spacing-2);
    --tag-large-border-radius: var(--bradius-max);


    /* chips group xsmall*/
    --chips-xsmall-label-top-vertical-gap: var(--spacing-4);
    --chips-xsmall-label-left-vertical-gap: var(--spacing-5);
    --chips-xsmall-label-left-horizontal-gap: var(--spacing-4);
    --chips-xsmall-chipgroup-vertical-gap: var(--spacing-3);
    --chips-xsmall-chipgroup-horizontal-gap: var(--spacing-3);
	
	
    /*chips group small*/
    --chips-small-label-top-vertical-gap: var(--spacing-4);
    --chips-small-label-left-vertical-gap: var(--spacing-5);
    --chips-small-label-left-horizontal-gap: var(--spacing-4);
    --chips-small-chipgroup-vertical-gap: var(--spacing-3);
    --chips-small-chipgroup-horizontal-gap: var(--spacing-3);
	
	
    /*chips group medium*/
    --chips-medium-label-top-vertical-gap: var(--spacing-4);
    --chips-medium-label-left-vertical-gap: var(--spacing-5);
    --chips-medium-label-left-horizontal-gap: var(--spacing-4);
    --chips-medium-chipgroup-vertical-gap: var(--spacing-3);
    --chips-medium-chipgroup-horizontal-gap: var(--spacing-4);
	
	
    /*chip group large*/
    --chips-large-label-top-vertical-gap: var(--spacing-4);
    --chips-large-label-left-vertical-gap: var(--spacing-5);
    --chips-large-label-left-horizontal-gap: var(--spacing-4);
    --chips-large-chipgroup-vertical-gap: var(--spacing-3);
    --chips-large-chipgroup-horizontal-gap: var(--spacing-4);


    /*icon button*/
    --iconbutton-12px-iconsize: var(--iconsize-small);
    --iconbutton-12px-border-radius: var(--bradius-small);
    --iconbutton-16px-iconsize: var(--iconsize-medium);
    --iconbutton-16px-border-radius: var(--bradius-small);
    --iconbutton-20px-iconsize: var(--iconsize-large);
    --iconbutton-20px-border-radius: var(--bradius-small);
    --iconbutton-24px-iconsize: var(--iconsize-xlarge);
    --iconbutton-24px-border-radius: var(--bradius-small);
    --iconbutton-44pxspacing-iconsize: var(--iconsize-4xlarge);
    --iconbutton-44pxspacing-border-radius: var(--bradius-small);
    --iconbutton-44pxspacing-border-radius2: var(--bradius-medium);


    /*indicator*/
    --indicator-small-gap: var(--spacing-2);
    --indicator-small-height: var(--size-16);
    --indicator-small-border-radius: var(--bradius-none);
    --indicator-medium-gap: var(--spacing-2);
    --indicator-medium-height: var(--size-20);
    --indicator-medium-border-radius: var(--bradius-none);
    --indicator-large-gap: var(--spacing-2);
    --indicator-large-height: var(--size-20);
    --indicator-large-border-radius: var(--bradius-none);


    /*link xsmall*/
    --link-xsmall-horizontal-padding: var(--spacing-0);
    --link-xsmall-vertical-padding: var(--spacing-0);
    --link-xsmall-gap: var(--spacing-2);
    --link-xsmall-border-radius: var(--bradius-none);
    --link-xsmall-leading-icon: var(--iconsize-small);
    --link-xsmall-trailing-icon: var(--iconsize-small);
    --link-xsmall-main-icon: var(--iconsize-small);
    --link-xsmall-border-width: var( --bwidth-thin);
	
	
    /*link small*/
    --link-small-horizontal-padding: var(--spacing-0);
    --link-small-vertical-padding: var(--spacing-0);
    --link-small-gap: var(--spacing-2);
    --link-small-border-radius: var(--bradius-none);
    --link-small-leading-icon: var(--iconsize-small);
    --link-small-trailing-icon: var(--iconsize-small);
    --link-small-main-icon: var(--iconsize-small);
    --link-small-border-width: var( --bwidth-thin);
	
	
    /*link medium*/
    --link-medium-horizontal-padding: var(--spacing-0);
    --link-medium-vertical-padding: var(--spacing-0);
    --link-medium-gap: var(--spacing-2);
    --link-medium-border-radius: var(--bradius-none);
    --link-medium-leading-icon: var(--iconsize-medium);
    --link-medium-trailing-icon: var(--iconsize-medium);
    --link-medium-main-icon: var(--iconsize-medium);
    --link-medium-border-width: var( --bwidth-thin);
	
	
    /*link large*/
    --link-large-horizontal-padding: var(--spacing-0);
    --link-large-vertical-padding: var(--spacing-0);
    --link-large-gap: var(--spacing-2);
    --link-large-border-radius: var(--bradius-none);
    --link-large-leading-icon: var(--iconsize-medium);
    --link-large-trailing-icon: var(--iconsize-medium);
    --link-large-main-icon: var(--iconsize-medium);
    --link-large-border-width: var(--bwidth-thin);


    /*list assets*/
    --list-assets-large-icon: var(--iconsize-medium);
    --list-assets-medium-icon: var(--iconsize-medium);
    --list-assets-small-icon: var(--iconsize-small);
	
	
    /*list small*/
    --list-small-unordered-left-padding-l1: var(--spacing-0);
    --list-small-unordered-left-padding-l2: var(--spacing-5);
    --list-small-unordered-left-padding-l3: var(--spacing-8);
    --list-small-unordered-left-padding-icon: var(--spacing-0);
    --list-small-unordered-vertical-padding: var(--spacing-0);
    --list-small-unordered-horizontal-gap: var(--spacing-3);
    --list-small-unordered-vertical-gap: var(--spacing-3);
    /**/
    --list-small-ordered-left-padding-l1: var(--spacing-0);
    --list-small-ordered-left-padding-l2: var(--spacing-6);
    --list-small-ordered-left-padding-l3: var(--spacing-9);
    --list-small-ordered-left-padding-custom: var(--spacing-0);
    --list-small-ordered-vertical-padding: var(--spacing-0);
    --list-small-ordered-horizontal-gap: var(--spacing-2);
    --list-small-ordered-horizontal-gap-custom: var(--spacing-3);
    --list-small-ordered-vertical-gap: var(--spacing-3);
	
	
    /*list medium*/
    --list-medium-unordered-left-padding-l1: var(--spacing-0);
    --list-medium-unordered-left-padding-l2: var(--spacing-5);
    --list-medium-unordered-left-padding-l3: var(--spacing-8);
    --list-medium-unordered-left-padding-icon: var(--spacing-0);
    --list-medium-unordered-vertical-padding: var(--spacing-0);
    --list-medium-unordered-horizontal-gap: var(--spacing-3);
    --list-medium-unordered-vertical-gap: var(--spacing-3);
    /**/
    --list-medium-ordered-left-padding-l1: var(--spacing-0);
    --list-medium-ordered-left-padding-l2: var(--spacing-6);
    --list-medium-ordered-left-padding-l3: var(--spacing-9);
    --list-medium-ordered-left-padding-custom: var(--spacing-0);
    --list-medium-ordered-vertical-padding: var(--spacing-0);
    --list-medium-ordered-horizontal-gap: var(--spacing-2);
    --list-medium-ordered-horizontal-gap-custom: var(--spacing-3);
    --list-medium-ordered-vertical-gap: var(--spacing-3);
	
	
    /*list large*/
    --list-large-unordered-left-padding-l1: var(--spacing-0);
    --list-large-unordered-left-padding-l2: var(--spacing-5);
    --list-large-unordered-left-padding-l3: var(--spacing-8);
    --list-large-unordered-left-padding-icon: var(--spacing-0);
    --list-large-unordered-vertical-padding: var(--spacing-0);
    --list-large-unordered-horizontal-gap: var(--spacing-3);
    --list-large-unordered-vertical-gap: var(--spacing-3);
    /**/
    --list-large-ordered-left-padding-l1: var(--spacing-0);
    --list-large-ordered-left-padding-l2: var(--spacing-6);
    --list-large-ordered-left-padding-l3: var(--spacing-9);
    --list-large-ordered-left-padding-custom: var(--spacing-0);
    --list-large-ordered-vertical-padding: var(--spacing-0);
    --list-large-ordered-horizontal-gap: var(--spacing-2);
    --list-large-ordered-horizontal-gap-custom: var(--spacing-3);
    --list-large-ordered-vertical-gap: var(--spacing-3);


    /*chips xsmall*/
    --chips-xsmall-withoutiocn-left-padding: var(--spacing-4);
    --chips-xsmall-withoutiocn-right-padding: var(--spacing-4);
    --chips-xsmall-withoutiocn-height: 24;
    --chips-xsmall-withoutiocn-border-radius: var(--bradius-max);
    /**/
    --chips-xsmall-withiocn-left-padding: var(--spacing-4);
    --chips-xsmall-withiocn-right-padding: var(--spacing-4);
    --chips-xsmall-withiocn-gap: var(--spacing-2);
    --chips-xsmall-withiocn-height: 24;
    --chips-xsmall-withiocn-width-iconcontainer: 12;
    --chips-xsmall-withiocn-leading-icon: var(--iconsize-small);
    --chips-xsmall-withiocn-border-radius: var(--bradius-max);
	
	
    /*chips small*/
    --chips-small-withoutiocn-left-padding: var(--spacing-4);
    --chips-small-withoutiocn-right-padding: var(--spacing-4);
    --chips-small-withoutiocn-height: 28;
    --chips-small-withoutiocn-border-radius: var(--bradius-max);
    /**/
    --chips-small-withiocn-left-padding: var(--spacing-4);
    --chips-small-withiocn-right-padding: var(--spacing-4);
    --chips-small-withiocn-gap: var(--spacing-2);
    --chips-small-withiocn-height: 28;
    --chips-small-withiocn-width-iconcontainer: 12;
    --chips-small-withiocn-leading-icon: var(--iconsize-small);
    --chips-small-withiocn-border-radius: var(--bradius-max);
	
	
    /*chips medium*/
    --chips-medium-withoutiocn-left-padding: var(--spacing-6);
    --chips-medium-withoutiocn-right-padding: var(--spacing-6);
    --chips-medium-withoutiocn-height: 36;
    --chips-medium-withoutiocn-border-radius: var(--bradius-max);
    /**/
    --chips-medium-withiocn-left-padding: var(--spacing-5);
    --chips-medium-withiocn-right-padding: var(--spacing-6);
    --chips-medium-withiocn-gap: var(--spacing-3);
    --chips-medium-withiocn-height: 36;
    --chips-medium-withiocn-width-iconcontainer: 16;
    --chips-medium-withiocn-leading-icon: var(--iconsize-medium);
    --chips-medium-withiocn-border-radius: var(--bradius-max);
	
	
    /*chips large*/
    --chips-large-withoutiocn-left-padding: var(--spacing-7);
    --chips-large-withoutiocn-right-padding: var(--spacing-7);
    --chips-large-withoutiocn-height: 48;
    --chips-large-withoutiocn-border-radius: var(--bradius-max);
    /**/
    --chips-large-withiocn-left-padding: var(--spacing-6);
    --chips-large-withiocn-right-padding: var(--spacing-7);
    --chips-large-withiocn-gap: var(--spacing-3);
    --chips-large-withiocn-height: 48;
    --chips-large-withiocn-width-iconcontainer: 20;
    --chips-large-withiocn-leading-icon: var(--iconsize-large);
    --chips-large-withiocn-border-radius: var(--bradius-max);


    /*badge small*/
    --badge-small-horizontal-padding: var(--spacing-2);
    --badge-small-gap: var(--spacing-1);
    --badge-small-height: var(--size-16);
    --badge-small-border-radius: var(--bradius-max);
    --badge-small-icon-size: var(--iconsize-xsmall);
	
	
    /*badge medium*/
    --badge-medium-horizontal-padding: var(--spacing-3);
    --badge-medium-gap: var(--spacing-2);
    --badge-medium-height: var(--size-20);
    --badge-medium-border-radius: var(--bradius-max);
    --badge-medium-icon-size: var(--iconsize-xsmall);
	
	
    /*badge large*/
    --badge-large-horizontal-padding: var(--spacing-4);
    --badge-large-gap: var(--spacing-2);
    --badge-large-height: var(--size-24);
    --badge-large-border-radius: var(--bradius-max);
    --badge-large-icon-size: var(--iconsize-medium);


    /*tooltip*/
    --tooltip-horizontal-padding: var(--spacing-4);
    --tooltip-vertical-padding: var(--spacing-4);
    --tooltip-gap: var(--spacing-2);
    --tooltip-margin: var(--spacing-2);
    --tooltip-border-radius: var(--bradius-medium);
    --tooltip-border-width: var(--bwidth-thinner);


    /* dropdown menu noresults*/
    --dropdownmenu-noresults-padding-horizontal: var(--spacing-5);
    --dropdownmenu-noresults-padding-vertical: var(--spacing-5);
    --dropdownmenu-noresults-gap-horizontal: var(--spacing-5);
    --dropdownmenu-noresults-gapinternal-horizontal: var(--spacing-3);
    --dropdownmenu-noresults-border-radius: var(--bradius-none);
    --dropdownmenu-noresults-icon-size: var(--iconsize-xlarge);
	
	
    /*dropdown menu header*/
    --dropdownmenu-header-leading-icon-size: var(--iconsize-large);
    --dropdownmenu-header-horizontal-padding: var(--spacing-5);
    --dropdownmenu-header-top-padding: var(--spacing-4);
    --dropdownmenu-header-bottom-padding: var(--spacing-5);
    --dropdownmenu-header-horizontalgap-wrapper: var(--spacing-5);
    --dropdownmenu-header-horizontalgap-left: var(--spacing-3);
    --dropdownmenu-header-horizontalgap-heading-container: var(--spacing-3);
    --dropdownmenu-header-toppadding-heading-container: var(--spacing-1);
	
	
    /*dropdown menu footer*/
    --dropdownmenu-footer-horizontal-horizontal-gap: var(--spacing-5);
    --dropdownmenu-footer-horizontal-bottom-padding: var(--spacing-5);
    --dropdownmenu-footer-horizontal-horizontal-padding: var(--spacing-5);
    --dropdownmenu-footer-horizontal-gap-actionscontain: var(--spacing-5);
    --dropdownmenu-footer-horizontal-gap-actionsstac: var(--spacing-5);
    --dropdownmenu-footer-vertical-vertical-gap: var(--spacing-5);
    --dropdownmenu-footer-vertical-bottom-padding: var(--spacing-5);
    --dropdownmenu-footer-vertical-horizontal-padding: var(--spacing-5);
    --dropdownmenu-footer-vertical-gap-actionscontain: var(--spacing-5);
    --dropdownmenu-footer-vertical-gap-actionsstac: var(--spacing-5);


    /*  actionlistitem group  */
    --actionlistitem-group-padding-horizontal: var(--spacing-3);
    --actionlistitem-group-padding-vertical: var(--spacing-2);
    --actionlistitem-group-padding-gap: var(--spacing-3);
	
	
    /*content type*/
    --actionlistitem-contenttype-default-padding-horizontal: var(--spacing-3);
    --actionlistitem-contenttype-default-padding-vertical: var(--spacing-3);
    --actionlistitem-contenttype-default-gap-horizontal: var(--spacing-3);
    --actionlistitem-contenttype-default-gap-vertical: var(--spacing-2);
    --actionlistitem-contenttype-default-borderradius: var(--bradius-medium);
    /**/
    --actionlistitem-contenttype-separator-padding-horizontal: var(--spacing-3);
    --actionlistitem-contenttype-separator-padding-vertical: var(--spacing-1);
    --actionlistitem-contenttype-separator-gap: var(--spacing-0);
    --actionlistitem-contenttype-separator-borderradius: var(--bradius-none);
    /**/
    --actionlistitem-contenttype-sectionheading-padding-horizontal: var(--spacing-3);
    --actionlistitem-contenttype-sectionheading-padding-vertical-top: var(--spacing-3);
    --actionlistitem-contenttype-sectionheading-padding-vertical-bottom: var(--spacing-1);
    --actionlistitem-contenttype-sectionheading-gap-horizontal: var(--spacing-3);
    --actionlistitem-contenttype-sectionheading-borderradius: var(--bradius-none);
    /**/
    --actionlistitem-contenttype-subnav1-padding-horizontal-l: var(--spacing-3);
    --actionlistitem-contenttype-subnav1-padding-horizontal-R: var(--spacing-3);
    --actionlistitem-contenttype-subnav1-padding-vertical: var(--spacing-2);
    --actionlistitem-contenttype-subnav1-gap-horizontal: var(--spacing-3);
    --actionlistitem-contenttype-subnav1-gap-vertical: var(--spacing-2);
    --actionlistitem-contenttype-subnav1-borderradius: var(--bradius-medium);
    /**/
    --actionlistitem-contenttype-subnav2-padding-horizontal-l: var(--spacing-5);
    --actionlistitem-contenttype-subnav2-padding-horizontal-R: var(--spacing-3);
    --actionlistitem-contenttype-subnav2-padding-vertical: var(--spacing-2);
    --actionlistitem-contenttype-subnav2-gap-horizontal: var(--spacing-3);
    --actionlistitem-contenttype-subnav2-gap-vertical: var(--spacing-2);
    --actionlistitem-contenttype-subnav2-borderradius: var(--bradius-medium);
    /**/
    --actionlistitem-contenttype-subnav3-padding-horizontal-l: var(--spacing-7);
    --actionlistitem-contenttype-subnav3-padding-horizontal-R: var(--spacing-3);
    --actionlistitem-contenttype-subnav3-padding-vertical: var(--spacing-2);
    --actionlistitem-contenttype-subnav3-gap-horizontal: var(--spacing-3);
    --actionlistitem-contenttype-subnav3-gap-vertical: var(--spacing-2);
    --actionlistitem-contenttype-subnav3-borderradius: var(--bradius-medium);
	
	
    /*badgegroup*/
    --actionlistitem-badgegroup-gap: var(--spacing-3);
	
	
    /*leading & trailing*/
    --leadingelements-icon-Container-width: var(--size-20);
    --leadingelements-icon-Container-height: var(--size-20);
    --leadingelements-icon-width-medium: var(--iconsize-medium);
    --leadingelements-icon-height-medium: var(--iconsize-medium);
    --leadingelements-slot-width-medium: var(--size-20);
    --leadingelements-slot-height-medium: var(--size-20);
    --leadingelements-icon-width-large: var(--iconsize-large);
    --leadingelements-icon-height-large: var(--iconsize-large);


    /*tab small*/
    --tab-small-bordered-horizontal-vertical-padding: var(--spacing-4);
    --tab-small-bordered-horizontal-gap: var(--spacing-3);
    --tab-small-bordered-vertical-vertical-padding: var(--spacing-2);
    --tab-small-bordered-vertical-horizontal-padding: var(--spacing-4);
    --tab-small-bordered-vertical-horizontal-gap: var(--spacing-3);
    /**/
    --tab-small-filled-horizontal-vertical-padding: var(--spacing-3);
    --tab-small-filled-horizontal-horizontal-padding: var(--spacing-3);
    --tab-small-filled-horizontal-horizontal-gap: var(--spacing-3);
    --tab-small-filled-vertical-vertical-padding: var(--spacing-3);
    --tab-small-filled-vertical-horizontal-padding: var(--spacing-4);
    --tab-small-filled-vertical-horizontal-gap: var(--spacing-3);
	
	
    /*tab medium*/
    --tab-medium-bordered-horizontal-vertical-padding: var(--spacing-5);
    --tab-medium-bordered-horizontal-gap: var(--spacing-3);
    --tab-medium-bordered-vertical-vertical-padding: var(--spacing-2);
    --tab-medium-bordered-vertical-horizontal-padding: var(--spacing-4);
    --tab-medium-bordered-vertical-horizontal-gap: var(--spacing-3);
	
	
    /**/
    --tab-medium-filled-horizontal-vertical-padding: var(--spacing-3);
    --tab-medium-filled-horizontal-horizontal-padding: var(--spacing-3);
    --tab-medium-filled-horizontal-horizontal-gap: var(--spacing-3);
    --tab-medium-filled-vertical-vertical-padding: var(--spacing-4);
    --tab-medium-filled-vertical-horizontal-padding: var(--spacing-4);
    --tab-medium-filled-vertical-horizontal-gap: var(--spacing-3);
	
	
    /*tab large*/
    --tab-large-bordered-horizontal-vertical-padding: var(--spacing-4);
    --tab-large-bordered-horizontal-gap: var(--spacing-3);
    --tab-large-bordered-vertical-vertical-padding: var(--spacing-2);
    --tab-large-bordered-vertical-horizontal-padding: var(--spacing-4);
    --tab-large-bordered-vertical-horizontal-gap: var(--spacing-3);
	
	
    /**/
    --tab-large-filled-horizontal-vertical-padding: var(--spacing-3);
    --tab-large-filled-horizontal-horizontal-padding: var(--spacing-3);
    --tab-large-filled-horizontal-horizontal-gap: var(--spacing-3);
    --tab-large-filled-vertical-vertical-padding: var(--spacing-4);
    --tab-large-filled-vertical-horizontal-padding: var(--spacing-4);
    --tab-large-filled-vertical-horizontal-gap: var(--spacing-3);


    /*carousel*/
    --carousel-indicator-gap: var(--spacing-2);
    --carousel-horizontal-container: var(--spacing-7);
    --carousel-vertical-gap-root: var(--spacing-7);
    --carousel-navigation-buttons-main-icon: var(--iconsize-medium);
    --carousel-navigation-buttons-button-padding: var(--spacing-3);
    --carousel-navigation-control-bottom-gap: var(--spacing-5);

    /*card*/
    --card-border-radius-medium: var(--bradius-medium);
    --card-border-radius-large: var(--bradius-large);
    --card-border-radius-xlarge: var(--bradius-xlarge);
    --card-default-padding-0: var(--spacing-0);
    --card-default-padding-3: var(--spacing-3);
    --card-default-padding-4: var(--spacing-4);
    --card-default-padding-5: var(--spacing-5);
    --card-default-padding-7: var(--spacing-7);
    --card-default-iconsize: var(--iconsize-large);
    --card-default-verticalgap4: var(--spacing-4);
    --card-default-verticalgap0: var(--spacing-0);
    --card-default-verticalgap3: var(--spacing-3);
    --card-default-verticalgap4: var(--spacing-4);
    --card-default-verticalgap5: var(--spacing-5);
    --card-default-verticalgap7: var(--spacing-7);
	    /**/
    --card-media-padding-5: var(--spacing-5);
    --card-media-padding-6: var(--spacing-6);
    --card-media-padding-7: var(--spacing-7);
    --card-media-verticalgap5: var(--spacing-5);
    --card-media-verticalgap6: var(--spacing-6);


    /*progress bar*/
    --progressbar-small-horizontal-gap: var(--spacing-2);
    --progressbar-small-vertical-gap: var(--spacing-2);
    --progressbar-small-height: var(--spacing-1);
    --progressbar-large-horizontal-gap: var(--spacing-2);
    --progressbar-large-vertical-gap: var(--spacing-2);
    --progressbar-large-height: var(--spacing-2);


    /*switch*/
    --switch-small-margin: var(--spacing-1);
    --switch-small-padding: var(--spacing-1);
    --switch-small-thumb-width: var(--size-12);
    --switch-small-thumb-height: var(--size-12);
    --switch-small-track-width: var(--size-28);
    --switch-small-border-radius: var(--bradius-max);
    /**/
    --switch-medium-margin: var(--spacing-1);
    --switch-medium-padding: var(--spacing-1);
    --switch-medium-thumb-width: var(--size-16);
    --switch-medium-thumb-height: var(--size-16);
    --switch-medium-track-width: var(--size-36);
    --switch-medium-border-radius: var(--bradius-max);


    /*modal*/
    --modal-main-component-border-radius: var(--bradius-large);
    --modal-header-leading-iconsize: var(--iconsize-large);
    --modal-header-horizontal-padding: var(--spacing-6);
    --modal-header-top-padding: var(--spacing-6);
    --modal-header-horizontal-gap-wrapper: var(--spacing-5);
    --modal-header-vertical-gap: var(--spacing-5);
    --modal-header-horizontal-gap-left: var(--spacing-3);
    --modal-header-horizontal-gap-heading: var(--spacing-3);
    --modal-header-top-padding-heading: var(--spacing-1);
    /**/
    --modal-footer-horizontal-horizontal-gap: var(--spacing-5);
    --modal-footer-horizontal-bottom-padding: var(--spacing-6);
    --modal-footer-horizontal-horizontal-padding: var(--spacing-6);
    --modal-footer-horizontal-gap-actionscontain: var(--spacing-5);
    --modal-footer-horizontal-gap-actionsstac: var(--spacing-5);
    /**/
    --modal-footer-vertical-vertical-gap: var(--spacing-5);
    --modal-footer-vertical-bottom-padding: var(--spacing-6);
    --modal-footer-vertical-horizontal-padding: var(--spacing-6);
    --modal-footer-vertical-gap-actionscontain: var(--spacing-5);
    --modal-footer-vertical-gap-actionsstac: var(--spacing-5);


    /*collapsible*/
    --collapsible-vertical-gap: var(--spacing-5);


    /*checkbox*/
    --checkbox-individual-small-horizontal-gap: var(--spacing-2);
    --checkbox-individual-small-vertical-padding: var(--spacing-1);
    --checkbox-individual-small-vertical-gap: var(--spacing-2);
    --checkbox-individual-medium-horizontal-gap: var(--spacing-2);
    --checkbox-individual-medium-vertical-padding: var(--spacing-1);
    --checkbox-individual-medium-vertical-gap: var(--spacing-2);
    /**/
    --checkbox-group-small-horizontal-gap-root: var(--spacing-2);
    --checkbox-group-small-vertical-gap-root: var(--spacing-2);
    --checkbox-group-small-vertical-gap-body: var(--spacing-2);
    --checkbox-group-small-vertical-checkbox-body: var(--spacing-3);
    --checkbox-group-medium-horizontal-gap-root: var(--spacing-2);
    --checkbox-group-medium-vertical-gap-root: var(--spacing-2);
    --checkbox-group-medium-vertical-gap-body: var(--spacing-2);
    --checkbox-group-medium-vertical-gap-checkbox-body: var(--spacing-3);


    /*popover*/
    --popover-horizontal-padding: var(--spacing-5);
    --popover-vertical-padding: var(--spacing-5);
    --popover-vertical-gap-container: var(--spacing-5);
    --popover-vertical-gap-content: var(--spacing-2);
    --popover-vertical-gap-body: var(--spacing-5);
    --popover-border-radius: var( --bradius-large);
    --popover-footer-gap-root: var(--spacing-7);
    --popover-footer-gap-button-group: var(--spacing-4);
    --popover-header-right-padding: var(--spacing-4);
    --popover-header-gap: var(--spacing-3);
    --popover-header-icon-size: var(--iconsize-large);


    /*radio*/
    --radio-individual-small-group-horizontal-gap: var(--spacing-2);
    --radio-individual-small-vertical-gap-labelgroup: var(--spacing-0);
    --radio-individual-small-vertical-padding-root: var(--spacing-1);
    --radio-individual-medium-vertical-padding-root: var(--spacing-1);
    --radio-individual-medium-group-horizontal-gap: var(--spacing-2);
    --radio-individual-medium-vertical-gap-labelgroup: var(--spacing-0);
    /**/
    --radio-group-small-group-vertical-gap: var(--spacing-2);
    --radio-group-small-group-horizontal-gap: var(--spacing-2);
    --radio-group-small-vertical-gap-radio-group: var(--spacing-2);
    --radio-group-medium-group-vertical-gap: var(--spacing-2);
    --radio-group-medium-group-horizontal-gap: var(--spacing-2);
    --radio-group-medium-vertical-gap-radiogroup: var(--spacing-3);
    /**/
    --radiobase-icon-stroke-width: var(--bwidth-thick);


    /*accordion*/
    --accordion-vertical-gap: var(--spacing-0);
    --accordion-body-vertical-padding: var(--spacing-5);
    --accordion-body-horizontal-padding: var(--spacing-5);
    --accordion-body-vertical-gap: var(--spacing-5);
    /**/
    --accordion-header-vertical-padding: var(--spacing-5);
    --accordion-header-horizontal-padding: var(--spacing-5);
    --accordion-header-horizontal-gap-accordion-title: var(--spacing-2);
    --accordion-header-horizontal-gap-accordion-header: var(--spacing-4);


    /*spinner*/
    --spinner-medium-size: var(--iconsize-medium);
    --spinner-medium-gap: var(--spacing-2);
    --spinner-large-size: var(--iconsize-large);
    --spinner-large-gap: var(--spacing-3);
    --spinner-xlarge-size: var(--iconsize-xlarge);
    --spinner-xlarge-gap: var(--spacing-3);


    /*spotlight popover*/
    --spotlight-horizontal-padding: var(--spacing-5);
    --spotlight-vertical-padding: var(--spacing-5);
    --spotlight-vertical-gap-container: var(--spacing-5);
    --spotlight-vertical-gap-content: var(--spacing-2);
    --spotlight-vertical-gap-body: var(--spacing-5);
    --spotlight-border-radius: var(--bradius-large);
    /**/
    --spotlight-header-right-padding: var(--spacing-4);
    --spotlight-header-gap: var(--spacing-3);
    --spotlight-header-icon-size: var(--iconsize-large);
    /**/
    --spotlight-footer-gap-te: var(--spacing-4);
    --spotlight-footer-gap-icon: var(--spacing-3);  


    /*bottom-sheet*/
    --bottomsheet-noresults-horizontal-padding: var(--spacing-5);
    --bottomsheet-noresults-vertical-padding: var(--spacing-5);
    --bottomsheet-noresults-gap-horizontal: var(--spacing-5);
    --bottomsheet-noresults-gap-internal-horizontal: var(--spacing-3);
    --bottomsheet-noresults-border-radius: var(--bradius-none);
    --bottomsheet-noresults-iconsize: var(--iconsize-xlarge);
    /**/
    --bottomsheet-header-horizontal-padding: var(--spacing-5);
    --bottomsheet-header-top-padding: var(--spacing-4);
    --bottomsheet-header-horizontal-gap-wrapper: var(--spacing-5);
    --bottomsheet-header-vertical-gap-root: var(--spacing-5);
    --bottomsheet-header-horizontal-gap-left-container: var(--spacing-3);
    --bottomsheet-header-horizontal-gap-heading-container: var(--spacing-3);
    --bottomsheet-header-top-padding-heading-container: var(--spacing-1);
    /**/
    --bottomsheet-footer-horizontal-horizontal-gap: var(--spacing-5);
    --bottomsheet-footer-horizontal-bottom-padding: var(--spacing-5);
    --bottomsheet-footer-horizontal-horizontal-padding: var(--spacing-5);
    --bottomsheet-footer-horizontal-gap-actions-contain: var(--spacing-5);
    --bottomsheet-footer-horizontal-gap-actions-stac: var(--spacing-5);
    /**/
    --bottomsheet-footer-vertical-vertical-gap: var(--spacing-5);
    --bottomsheet-footer-vertical-bottom-padding: var(--spacing-5);
    --bottomsheet-footer-vertical-horizontal-padding: var(--spacing-5);
    --bottomsheet-footer-vertical-gap-actions-contain: var(--spacing-5);
    --bottomsheet-footer-vertical-gap-actions-stac: var(--spacing-5);


    /*tabs*/
    --tab-medium-bordered-horizontal-gap: var(--spacing-8);
    --tab-medium-bordered-vertical-gap: var(--spacing-0);
    /**/
    --tab-medium-filled-horizontal-gap: var(--spacing-1);
    --tab-medium-filled-horizontal-horizontal-padding: var(--spacing-2);
    --tab-medium-filled-horizontal-vertical-padding: var(--spacing-2);
    /**/
    --tab-medium-filled-vertical-gap: var(--spacing-0);
    --tab-medium-filled-vertical-horizontal-padding: var(--spacing-2);
    --tab-medium-filled-vertical-vertical-padding: var(--spacing-2);
    --tab-large-bordered-horizontal-gap: var(--spacing-8);
    --tab-large-bordered-vertical-gap: var(--spacing-0);
    /**/
    --tab-large-filled-horizontal-gap: var(--spacing-1);
    --tab-large-filled-horizontal-horizontal-padding: var(--spacing-2);
    --tab-large-filled-horizontal-vertical-padding: var(--spacing-2);
    /**/
    --tab-large-filled-vertical-gap: var(--spacing-0);
    --tab-large-filled-vertical-horizontal-padding: var(--spacing-2);
    --tab-large-filled-vertical-vertical-padding: var(--spacing-2);



    /*input textfield*/
    --input-textfield-small-height: var(--size-32);
    --input-textfield-medium-height: var(--size-36);
    --input-textfield-large-height: var(--size-48);
    --input-textfield-large-horizontal-padding: var(--spacing-4);
	
	
    /*input textarea*/
    --input-textarea-medium-height-2lines: var(--size-56);
    --input-textarea-medium-height-3lines: var(--size-76);
    --input-textarea-medium-height-4lines: var(--size-96);
    --input-textarea-medium-height-5lines: var(--size-116);
    /**/
    --input-textarea-large-height-2lines: var(--size-64);
    --input-textarea-large-height-3lines: var(--size-88);
    --input-textarea-large-height-4lines: var(--size-112);
    --input-textarea-large-height-5lines: var(--size-136);


    /*alert*/
    --alert-padding-horizontal: var(--spacing-4);
    --alert-padding-vertical: var(--spacing-4);
    --alert-padding-border-radius: var(--bradius-medium);


    /*table*/
    --table-header-height: var(--size-52);
    --table-cell-normal-height: var(--size-52);
    --table-cell-comfortable-height: var(--size-60);
    --table-cell-condensed-height: var(--size-44);


    /*toast*/
    --toast-bgcolour: var(--netural-white-500);


    /*fileupload*/
    --fileupload-uploaditem-innerbody-spacing: var(--spacing-0);
    --fileupload-uploaditem-filenamegroup-spacing: var(--spacing-3);
    --fileupload-uploadcta-innerbody-spacing: var(--spacing-0);


    /*form*/
    --form-label-medium-width: var(--size-120);
    --form-label-large-width: var(--size-176);


    /* Layout */
    --header-height: 56px;
    --sidebar-collapsed-width: 60px;

    --normal: var(--netural-slateblue-500);
    --muted: var(--primary-fgreen-600);
    --subtle:var(--netural-slateblue-300);
    --transparent: #ffffff00;
    --header-and-footer: var(--primary-charcoal-500);
 
 
    /* @section Surface Background Colors */
        /* @subsection Gray */
        --surface-background-gray-subtle: var(--netural-lavgray-500);
        --surface-background-gray-moderate: var(--netural-lavgray-300);
        --surface-background-gray-intense: var(--netural-lavgray-100);
        /* @end */

        /* @subsection Dark */
        --surface-background-dark-subtle: var(--netural-lavgray-1000);
        --surface-background-dark-moderate: var(--netural-lavgray-900);
        --surface-background-dark-intense: var(--netural-lavgray-800);
        /* @end */
    
        /* @subsection Primary */
        --surface-background-primary-subtle: var(--primary-fgreen-a50);
        --surface-background-primary-intense: var(--primary-fgreen-600);
        /* @end */

        /* @section Cyan */
        --surface-background-cyan-subtle: var(--primary-cyan-50);
        --surface-background-cyan-intense: var(--primary-cyan-800);
        /* @end */

        /* @section Royal */
        --surface-background-royal-subtle: var(--primary-royal-50);
        --surface-background-royal-intense: var(--primary-royal-800);
        /* @end */
    
        /* @section Coral */
        --surface-background-coral-subtle: var(--primary-coral-50);
        --surface-background-coral-intense: var(--primary-coral-800);
        /* @end */
        /* @end */
    
        /* @section Surface Border Colors */
        /* @subsection Gray */
        --surface-border-gray-normal: var(--netural-slateblue-500);
        --surface-border-gray-subtle: var(--netural-slateblue-300);
        --surface-border-gray-muted: var(--netural-slateblue-a100);
        /* @end */
    
        /* @subsection Primary */
        --surface-border-primary-normal: var(--primary-fgreen-500);
        --surface-border-primary-muted: var(--primary-fgreen-a100);
        /* @end */
    /* @end */

    /* @section Surface Text Colors */
        /* @subsection Gray */
        --surface-text-gray-normal: var(--netural-slateblue-1000);
        --surface-text-gray-subtle: var(--netural-slateblue-900);
        --surface-text-gray-muted: var(--netural-slateblue-600);
        --surface-text-gray-disabled: var(--netural-slateblue-a150);
        /* @end */
        
        /* @subsection Primary */
        --surface-text-primary-normal: var(--primary-fgreen-700);
        --surface-text-primary-subtle: var(--netural-white-500);
        /* @end */
        
        /* @subsection Cyan */
        --surface-text-oncyan-onsubtle: var(--primary-lgreen-800);
        --surface-text-oncyan-onintense: var(--primary-lgreen-200);
        /* @end */
        
        /* @subsection Royal */
        --surface-text-onroyal-onsubtle: var(--netural-sky-800);
        --surface-text-onroyal-onintense: var(--netural-sky-200);
        --surface-text-oncoral-onsubtle: var(--netural-yellow-800);
        --surface-text-oncoral-onintense: var(--netural-yellow-200);
        /* @end */
        
        /* @subsection White */
        --surface-text-staticwhite-normal: var(--netural-white-500);
        --surface-text-staticwhite-subtle: var(--netural-white-450);
        --surface-text-staticwhite-muted: var(--netural-white-200);
        --surface-text-staticwhite-disabled: var(--netural-white-100);
        /* @end */
        
        /* @subsection Black */
        --surface-text-staticblack-normal: var(--netural-black-500);
        --surface-text-staticblack-subtle: var(--netural-black-300);
        --surface-text-staticblack-muted: var(--netural-black-200);
        --surface-text-staticblack-disabled: var(--netural-black-100);
        /* @end */
    /* @end */

    /* @section Surface Icon Colors */
        /* @subsection Gray */
        --surface-icon-gray-normal: var(--netural-slateblue-1000);
        --surface-icon-gray-subtle: var(--netural-slateblue-900);
        --surface-icon-gray-muted: var(--netural-slateblue-600);
        --surface-icon-gray-disabled: var(--netural-slateblue-a150);
        /* @end */

        /* @subsection Primary  */
        --surface-icon-primary-normal: var(--primary-fgreen-700);
        /* @end */

        /* @subsection Cyan */
        --surface-icon-oncyan-onsubtle: var(--primary-lgreen-800);
        --surface-icon-oncyan-onintense: var(--primary-lgreen-200);
        /* @end */

        /* @subsection Royal */
        --surface-icon-onroyal-onsubtle: var(--netural-sky-700);
        --surface-icon-onroyal-onintense: var(--netural-sky-300);
        /* @end */

        /* @subsection Coral */
        --surface-icon-oncoral-onsubtle: var(--netural-yellow-700);
        --surface-icon-oncoral-onintense: var(--netural-yellow-300);
        /* @end */

        /* @subsection White */
        --surface-icon-staticwhite-normal: var(--netural-white-500);
        --surface-icon-staticwhite-subtle: var(--netural-white-450);
        --surface-icon-staticwhite-muted: var(--netural-white-200);
        --surface-icon-staticwhite-disabled: var(--netural-white-100);
        /* @end */

        /* @subsection Black */
        --surface-icon-staticblack-normal: var(--netural-black-500);
        --surface-icon-staticblack-subtle: var(--netural-black-300);
        --surface-icon-staticblack-muted: var(--netural-black-200);
        --surface-icon-staticblack-disabled: var(--netural-black-100);
        /* @end */
    /* @end */
 
 
    /* @section Feedback Background Color */
    /* @subsection Primary */
    --feedback-background-positive-subtle: var(--primary-lgreen-a50);
    --feedback-background-positive-intense: var(--primary-lgreen-800);
    /* @end */

    /* @subsection Negative */
    --feedback-background-negative-subtle: var(--primary-crimson-a50);
    --feedback-background-negative-intense: var(--primary-crimson-700);
    /* @end */

    /* @subsection Notice */
    --feedback-background-notice-subtle: var(--netural-yellow-a50);
    --feedback-background-notice-intense: var(--netural-yellow-800);
    /* @end */

    --feedback-background-information-subtle: var(--netural-sky-a50);
    --feedback-background-information-intense: var(--netural-sky-700);
    --feedback-background-neutral-subtle: var(--netural-slateblue-a50);
    --feedback-background-neutral-intense: var(--netural-slateblue-1000);
 
 
    /* @section Feedback Border Color */
    /* @subsection Primary */
    --feedback-border-positive-subtle: var(--primary-lgreen-a150);
    --feedback-border-positive-intense: var(--primary-lgreen-800);
    /* @end */

    /* @subsection Negative */
    --feedback-border-negative-subtle: var(--primary-crimson-a100);
    --feedback-border-negative-intense: var(--primary-crimson-700);
    /* @end */

    /* @subsection Notice */
    --feedback-border-notice-subtle: var(--netural-yellow-a100);
    --feedback-border-notice-intense: var(--netural-yellow-700);
    /* @end */

    --feedback-border-information-subtle: var(--netural-sky-a100);
    --feedback-border-information-intense: var(--netural-sky-600);
    --feedback-border-neutral-subtle: var(--netural-slateblue-a100);
    --feedback-border-neutral-intense: var(--netural-slateblue-1000);
 
 
    /*feedback text color*/
    --feedback-text-positive-subtle: var(--primary-lgreen-200);
    --feedback-text-positive-intense: var(--primary-lgreen-800);
    --feedback-text-negative-subtle: var(--primary-crimson-100);
    --feedback-text-negative-intense: var(--primary-crimson-700);
    --feedback-text-notice-subtle: var(--netural-yellow-100);
    --feedback-text-notice-intense: var(--netural-yellow-800);
    --feedback-text-information-subtle: var(--netural-sky-100);
    --feedback-text-information-intense: var(--netural-sky-700);
    --feedback-text-neutral-subtle: var(--netural-slateblue-500);
    --feedback-text-neutral-intense: var(--netural-slateblue-1000);
 
 
    /*feedback icon color*/
    --feedback-icon-positive-subtle: var(--primary-lgreen-200);
    --feedback-icon-positive-intense: var(--primary-lgreen-800);
    --feedback-icon-negative-subtle: var(--primary-crimson-100);
    --feedback-icon-negative-intense: var(--primary-crimson-700);
    --feedback-icon-notice-subtle: var(--netural-yellow-100);
    --feedback-icon-notice-intense: var(--netural-yellow-800);
    --feedback-icon-information-subtle: var(--netural-sky-100);
    --feedback-icon-information-intense: var(--netural-sky-700);
    --feedback-icon-neutral-subtle: var(--netural-slateblue-500);
    --feedback-icon-neutral-intense: var(--netural-slateblue-1000);
 
 
    /*interactive background color*/
    --interactive-background-positive-default: var(--primary-lgreen-800);
    --interactive-background-positive-highlighted: var(--primary-lgreen-900);
    --interactive-background-positive-disabled: var(--primary-lgreen-a100);
    --interactive-background-positive-faded: var(--primary-lgreen-a100);
    --interactive-background-positive-fadedHighlighted: var(--primary-lgreen-a150);
    /**/
    --interactive-background-negative-default: var(--primary-crimson-600);
    --interactive-background-negative-highlighted: var(--primary-crimson-700);
    --interactive-background-negative-disabled: var(--primary-crimson-a50);
    --interactive-background-negative-faded: var(--primary-crimson-a50);
    --interactive-background-negative-fadedHighlighted: var(--primary-crimson-a100);
    /**/
    --interactive-background-notice-default: var(--netural-yellow-700);
    --interactive-background-notice-highlighted: var(--netural-yellow-800);
    --interactive-background-notice-disabled: var(--netural-yellow-a50);
    --interactive-background-notice-faded: var(--netural-yellow-a50);
    --interactive-background-notice-fadedHighlighted: var(--netural-yellow-a100);
    /**/
    --interactive-background-information-default: var(--netural-sky-700);
    --interactive-background-information-highlighted: var(--netural-sky-800);
    --interactive-background-information-disabled: var(--netural-sky-a50);
    --interactive-background-information-faded: var(--netural-sky-a50);
    --interactive-background-information-fadedHighlighted: var(--netural-sky-a100);
    /**/
    --interactive-background-neutral-default: var(--netural-slateblue-900);
    --interactive-background-neutral-highlighted: var(--netural-slateblue-1000);
    --interactive-background-neutral-disabled: var(--netural-slateblue-a100);
    --interactive-background-neutral-faded: var(--netural-slateblue-a100);
    --interactive-background-neutral-fadedHighlighted: var(--netural-slateblue-a150);
    /**/
    --interactive-background-gray-default: var(--netural-gray-a100);
    --interactive-background-gray-highlighted: var(--netural-gray-a150);
    --interactive-background-gray-disabled: var(--netural-gray-a50);
    --interactive-background-gray-faded: var(--netural-gray-a50);
    --interactive-background-gray-fadedHighlighted: var(--netural-gray-a100);
    /**/
    --interactive-background-primary-default: var(--primary-fgreen-600);
    --interactive-background-primary-highlighted: var(--primary-fgreen-700);
    --interactive-background-primary-disabled: var(--primary-fgreen-a50);
    --interactive-background-primary-faded: var(--primary-fgreen-a50);
    --interactive-background-primary-fadedHighlighted: var(--primary-fgreen-a100);
    /**/
    --interactive-background-staticblack-default: var(--netural-black-500);
    --interactive-background-staticblack-highlighted: var(--netural-black-400);
    --interactive-background-staticblack-disabled: var(--netural-black-200);
    --interactive-background-staticblack-faded: var(--netural-black-50);
    --interactive-background-staticblack-fadedHighlighted: var(--netural-black-100);
    /**/
    --interactive-background-staticwhite-default: var(--netural-white-500);
    --interactive-background-staticwhite-highlighted: var(--netural-white-400);
    --interactive-background-staticwhite-disabled: var(--netural-white-50);
    --interactive-background-staticwhite-faded: var(--netural-white-50);
    --interactive-background-staticwhite-fadedHighlighted: var(--netural-white-200);
   
   
    /*interactive border color*/
    --interactive-border-positive-default: var(--primary-fgreen-600);
    --interactive-border-positive-highlighted: var(--primary-fgreen-700);
    --interactive-border-positive-disabled: var(--primary-fgreen-a100);
    --interactive-border-positive-fadedHighlighted: var(--primary-fgreen-a100);
    --interactive-border-positive-faded: var(--primary-fgreen-a100);
    /**/
    --interactive-border-negative-default: var(--primary-crimson-600);
    --interactive-border-negative-highlighted: var(--primary-crimson-700);
    --interactive-border-negative-disabled: var(--primary-crimson-a100);
    --interactive-border-negative-fadedHighlighted: var(--primary-crimson-a100);
    --interactive-border-negative-faded: var(--primary-crimson-a100);
    /**/
    --interactive-border-notice-default: var(--netural-yellow-600);
    --interactive-border-notice-highlighted: var(--netural-yellow-700);
    --interactive-border-notice-disabled: var(--netural-yellow-a100);
    --interactive-border-notice-fadedHighlighted: var(--netural-yellow-a100);
    --interactive-border-notice-faded: var(--netural-yellow-a100);
    /**/
    --interactive-border-information-default: var(--netural-sky-600);
    --interactive-border-information-highlighted: var(--netural-sky-700);
    --interactive-border-information-disabled: var(--netural-sky-a100);
    --interactive-border-information-fadedHighlighted: var(--netural-sky-a100);
    --interactive-border-information-faded: var(--netural-sky-a100);
    /**/
    --interactive-border-neutral-default: var(--netural-slateblue-700);
    --interactive-border-neutral-highlighted: var(--netural-slateblue-800);
    --interactive-border-neutral-disabled: var(--netural-slateblue-300);
    --interactive-border-neutral-fadedHighlighted: var(--netural-slateblue-a100);
    --interactive-border-neutral-faded: var(--netural-slateblue-a100);
    /**/
    --interactive-border-gray-default: var(--netural-gray-600);
    --interactive-border-gray-highlighted: var(--netural-gray-700);
    --interactive-border-gray-disabled: var(--netural-gray-a200);
    --interactive-border-gray-faded: var(--netural-gray-a100);
    /**/
    --interactive-border-primary-default: var(--primary-fgreen-600);
    --interactive-border-primary-highlighted: var(--primary-fgreen-700);
    --interactive-border-primary-disabled: var(--primary-fgreen-a100);
    --interactive-border-primary-faded: var(--primary-fgreen-a100);
    /**/
    --interactive-border-staticblack-default: var(--netural-black-500);
    --interactive-border-staticblack-highlighted: var(--netural-black-500);
    --interactive-border-staticblack-disabled: var(--netural-black-100);
    --interactive-border-staticblack-faded: var(--netural-black-100);
    /**/
    --interactive-border-staticwhite-default: var(--netural-white-500);
    --interactive-border-staticwhite-highlighted: var(--netural-white-400);
    --interactive-border-staticwhite-disabled: var(--netural-white-100);
    --interactive-border-staticwhite-faded: var(--netural-white-50);
   
   
    /*interactive text color*/
    --interactive-text-positive-normal: var(--primary-lgreen-800);
    --interactive-text-positive-subtle: var(--primary-lgreen-600);
    --interactive-text-positive-muted: var(--primary-lgreen-400);
    --interactive-text-positive-fadedHighlighted: var(--primary-lgreen-400);
    --interactive-text-positive-disabled: var(--primary-lgreen-a200);
    /**/
    --interactive-text-negative-normal: var(--primary-crimson-700);
    --interactive-text-negative-subtle: var(--primary-crimson-600);
    --interactive-text-negative-muted: var(--primary-crimson-400);
    --interactive-text-negative-fadedHighlighted: var(--primary-crimson-400);
    --interactive-text-negative-disabled: var(--primary-crimson-a200);
    /**/
    --interactive-text-notice-normal: var(--netural-yellow-800);
    --interactive-text-notice-subtle: var(--netural-yellow-600);
    --interactive-text-notice-muted: var(--netural-yellow-400);
    --interactive-text-notice-fadedHighlighted: var(--netural-yellow-400);
    --interactive-text-notice-disabled: var(--netural-yellow-a200);
    /**/
    --interactive-text-information-normal: var(--netural-sky-800);
    --interactive-text-information-subtle: var(--netural-sky-600);
    --interactive-text-information-muted: var(--netural-sky-400);
    --interactive-text-information-fadedHighlighted: var(--netural-sky-400);
    --interactive-text-information-disabled: var(--netural-sky-a200);
    /**/
    --interactive-text-neutral-normal: var(--netural-slateblue-1000);
    --interactive-text-neutral-subtle: var(--netural-slateblue-900);
    --interactive-text-neutral-muted: var(--netural-slateblue-600);
    --interactive-text-neutral-fadedHighlighted: var(--netural-slateblue-600);
    --interactive-text-neutral-disabled: var(--netural-slateblue-a150);
    /**/
    --interactive-text-gray-normal: var(--netural-gray-1000);
    --interactive-text-gray-subtle: var(--netural-gray-900);
    --interactive-text-gray-muted: var(--netural-gray-600);
    --interactive-text-gray-disabled: var(--netural-gray-a200);
    /**/
    --interactive-text-primary-normal: var(--primary-fgreen-700);
    --interactive-text-primary-subtle: var(--primary-fgreen-600);
    --interactive-text-primary-muted: var(--primary-fgreen-400);
    --interactive-text-primary-disabled: var(--primary-fgreen-a100);
    /**/
    --interactive-text-onprimary-normal: var(--netural-white-500);
    --interactive-text-onprimary-subtle: var(--netural-white-400);
    --interactive-text-onprimary-muted: var(--netural-white-300);
    --interactive-text-onprimary-disabled: var(--netural-white-100);
    /**/
    --interactive-text-staticblack-normal: var(--netural-black-500);
    --interactive-text-staticblack-subtle: var(--netural-black-400);
    --interactive-text-staticblack-muted: var(--netural-black-300);
    --interactive-text-staticblack-disabled: var(--netural-black-100);
    /**/
    --interactive-text-staticwhite-normal: var(--netural-white-500);
    --interactive-text-staticwhite-subtle: var(--netural-white-400);
    --interactive-text-staticwhite-muted: var(--netural-white-300);
    --interactive-text-staticwhite-disabled: var(--netural-white-100);
   
   
    /*interactive icon color*/
    --interactive-icon-positive-normal: var(--primary-lgreen-800);
    --interactive-icon-positive-subtle: var(--primary-lgreen-600);
    --interactive-icon-positive-muted: var(--primary-lgreen-400);
    --interactive-icon-positive-disabled: var(--primary-lgreen-a200);
    /**/
    --interactive-icon-negative-normal: var(--primary-crimson-700);
    --interactive-icon-negative-subtle: var(--primary-crimson-600);
    --interactive-icon-negative-muted: var(--primary-crimson-400);
    --interactive-icon-negative-disabled: var(--primary-crimson-a200);
    /**/
    --interactive-icon-notice-normal: var(--netural-yellow-800);
    --interactive-icon-notice-subtle: var(--netural-yellow-600);
    --interactive-icon-notice-muted: var(--netural-yellow-400);
    --interactive-icon-notice-disabled: var(--netural-yellow-a200);
    /**/
    --interactive-icon-information-normal: var(--netural-sky-800);
    --interactive-icon-information-subtle: var(--netural-sky-600);
    --interactive-icon-information-muted: var(--netural-sky-400);
    --interactive-icon-information-disabled: var(--netural-sky-a200);
    /**/
    --interactive-icon-neutral-normal: var(--netural-slateblue-1000);
    --interactive-icon-neutral-subtle: var(--netural-slateblue-900);
    --interactive-icon-neutral-muted: var(--netural-slateblue-600);
    --interactive-icon-neutral-disabled: var(--netural-slateblue-a150);
    /**/
    --interactive-icon-gray-normal: var(--netural-gray-1000);
    --interactive-icon-gray-subtle: var(--netural-gray-900);
    --interactive-icon-gray-muted: var(--netural-gray-600);
    --interactive-icon-gray-disabled: var(--netural-gray-a200);
    /**/
    --interactive-icon-primary-normal: var(--primary-fgreen-700);
    --interactive-icon-primary-subtle: var(--primary-fgreen-600);
    --interactive-icon-primary-muted: var(--primary-fgreen-400);
    --interactive-icon-primary-disabled: var(--primary-fgreen-a100);
    /**/
    --interactive-icon-onprimary-normal: var(--netural-white-500);
    --interactive-icon-onprimary-subtle: var(--netural-white-400);
    --interactive-icon-onprimary-muted: var(--netural-white-300);
    --interactive-icon-onprimary-disabled: var(--netural-white-100);
    /**/
    --interactive-icon-staticblack-normal: var(--netural-black-500);
    --interactive-icon-staticblack-subtle: var(--netural-black-400);
    --interactive-icon-staticblack-muted: var(--netural-black-300);
    --interactive-icon-staticblack-disabled: var(--netural-black-100);
    /**/
    --interactive-icon-staticwhite-normal: var(--netural-white-500);
    --interactive-icon-staticwhite-subtle: var(--netural-white-400);
    --interactive-icon-staticwhite-muted: var(--netural-white-300);
    --interactive-icon-staticwhite-disabled: var(--netural-white-100);
   
   
    /*interactive hover color*/
    --interactive-hover-subtle: var(--netural-white-50);
    --interactive-hover-intense: var(--netural-black-10);
 
 
    /*overlay background color*/
    --overlay-background-moderate: var(--netural-sky-a150);
    --overlay-background-subtle: var(--netural-black-200);
 
 
    /*popup background color*/
    --popup-background-subtle: var(--netural-lavgray-50);
    --popup-background-intense: var(--netural-lavgray-1000);
 
    /*popup border color*/
    --popup-border-subtle: var(--netural-lavgray-a100);
    --popup-border-intense: var(--netural-lavgray-900);
 
 
    /*elevation color*/
    --elevation-microRaised:#3F4F6117;
    --elevation-lowRaised: #3F4F611F;
    --elevation-midRaised: #3F4F611F;
    --elevation-highRaised: #3F4F612E;
    --elevation-bottomsheet: var();
    --elevation-toast: var();
 
 
    /*list item asset color*/
    --listItemAsset-color: var(--netural-slateblue-600);
 
 
    /*link border color*/
    --link-border-positive: var(--primary-lgreen-600);
    --link-border-negative: var(--primary-crimson-600);
    --link-border-notice: var(--netural-yellow-600);
    --link-border-information: var(--netural-sky-600);
    --link-border-neutral: var(--netural-slateblue-900);
    --link-border-primary: var(--primary-fgreen-600);
    --link-border-staticwhite: var(--netural-white-400);
    --link-border-staticblack: var(--netural-black-400);
    --link-border-gray: var(--netural-gray-900);
 
 
    /*amount strikthrough*/
    --amount-strikethrough-positive: var(--primary-lgreen-800);
    --amount-strikethrough-negative: var(--primary-crimson-700);
    --amount-strikethrough-notice: var(--netural-yellow-800);
    --amount-strikethrough-information: var(--netural-sky-700);
    --amount-strikethrough-neutral: var(--netural-slateblue-1000);
    --amount-strikethrough-primary: var(--primary-fgreen-700);
    --amount-strikethrough-staticwhite: var(--netural-white-500);
    --amount-strikethrough-staticblack: var(--netural-black-500);
    --amount-strikethrough-graynormal: var(--netural-slateblue-1000);
    --amount-strikethrough-graysubtle: var(--netural-slateblue-900);
    --amount-strikethrough-graymuted: var(--netural-slateblue-600);
 
    /*card*/
    --card-bg-intense: var(--netural-lavgray-100);
    --card-bg-moderate: var(--netural-lavgray-300);
    --card-bg-subtle: var(--netural-lavgray-500);
 
    --footer-logo-filter: "";

    /* @section Focus */
    --focus-ring: #424449;
    --focus-box-shadow: #F8FAFC;
    /* @end */

    
}

[data-theme="dark"] {
        --normal: var(--netural-slateblue-100);
        --muted: var(--primary-fgreen-600);
        --subtle:var(--netural-slateblue-300);
        --transparent: #ffffff00;
        --header-and-footer: var(--netural-slateblue-900);
    
    
        /*surface background color*/
        --surface-background-gray-subtle: var(--netural-slateblue-1000);
        --surface-background-gray-moderate: var(--netural-slateblue-900);
        --surface-background-gray-intense: var(--netural-slateblue-800);
    
        --surface-background-dark-subtle: var(--netural-lavgray-500);
        --surface-background-dark-moderate: var(--netural-lavgray-300);
        --surface-background-dark-intense: var(--netural-lavgray-100);
    
        --surface-background-primary-subtle: var(--primary-fgreen-a200);
        --surface-background-primary-intense: var(--primary-fgreen-400);
    
        --surface-background-cyan-subtle: var(--primary-cyan-900);
        --surface-background-cyan-intense: var(--primary-cyan-100);
    
        --surface-background-royal-subtle: var(--primary-royal-900);
        --surface-background-royal-intense: var(--primary-royal-100);
    
        --surface-background-coral-subtle: var(--primary-coral-900);
        --surface-background-coral-intense: var(--primary-coral-100);
    
        /*surface border color*/
        --surface-border-gray-normal: var(--netural-slateblue-100);
        --surface-border-gray-subtle: var(--netural-slateblue-400);
        --surface-border-gray-muted: var(--netural-lavgray-a200);
    
        --surface-border-primary-normal: var(--primary-fgreen-500);
        --surface-border-primary-muted: var(--primary-fgreen-a200);
    
        /*surface text color*/
        --surface-text-gray-normal: var(--netural-lavgray-100);
        --surface-text-gray-subtle: var(--netural-slateblue-200);
        --surface-text-gray-muted: var(--netural-slateblue-400);
        --surface-text-gray-disabled: var(--netural-lavgray-a200);
    
        --surface-text-primary-normal: var(--primary-fgreen-200);
        --surface-text-primary-subtle: var(--netural-black-500);
    
        --surface-text-oncyan-onsubtle: var(--primary-lgreen-200);
        --surface-text-oncyan-onintense: var(--primary-lgreen-800);
    
        --surface-text-onroyal-onsubtle: var(--netural-sky-200);
        --surface-text-onroyal-onintense: var(--netural-sky-800);
    
        --surface-text-oncoral-onsubtle: var(--netural-yellow-200);
        --surface-text-oncoral-onintense: var(--netural-yellow-800);
    
        --surface-text-staticwhite-normal: var(--netural-white-500);
        --surface-text-staticwhite-subtle: var(--netural-white-450);
        --surface-text-staticwhite-muted: var(--netural-white-200);
        --surface-text-staticwhite-disabled: var(--netural-white-100);
    
        --surface-text-staticblack-normal: var(--netural-white-500);
        --surface-text-staticblack-subtle: var(--netural-white-300);
        --surface-text-staticblack-muted: var(--netural-white-200);
        --surface-text-staticblack-disabled: var(--netural-white-100);
    
        /*surface icon color*/
        --surface-icon-gray-normal: var(--netural-slateblue-50);
        --surface-icon-gray-subtle: var(--netural-slateblue-200);
        --surface-icon-gray-muted: var(--netural-slateblue-500);
        --surface-icon-gray-disabled: var(--netural-slateblue-a150);
    
        --surface-icon-primary-normal: var(--primary-fgreen-300);
    
        --surface-icon-oncyan-onsubtle: var(--primary-lgreen-200);
        --surface-icon-oncyan-onintense: var(--primary-lgreen-800);
    
        --surface-icon-onroyal-onsubtle: var(--netural-sky-300);
        --surface-icon-onroyal-onintense: var(--netural-sky-700);
    
        --surface-icon-oncoral-onsubtle: var(--netural-yellow-300);
        --surface-icon-oncoral-onintense: var(--netural-yellow-700);
    
        --surface-icon-staticwhite-normal: var(--netural-white-500);
        --surface-icon-staticwhite-subtle: var(--netural-white-450);
        --surface-icon-staticwhite-muted: var(--netural-white-200);
        --surface-icon-staticwhite-disabled: var(--netural-white-100);
    
        --surface-icon-staticblack-normal: var(--netural-black-500);
        --surface-icon-staticblack-subtle: var(--netural-black-300);
        --surface-icon-staticblack-muted: var(--netural-black-200);
        --surface-icon-staticblack-disabled: var(--netural-black-100);
    
    
        /* feedback background color */
        --feedback-background-positive-subtle: var(--primary-lgreen-a100);
        --feedback-background-positive-intense: var(--primary-lgreen-900);
        --feedback-background-negative-subtle: var(--primary-crimson-a100);
        --feedback-background-negative-intense: var(--primary-crimson-800);
        --feedback-background-notice-subtle: var(--netural-yellow-a100);
        --feedback-background-notice-intense: var(--netural-yellow-900);
        --feedback-background-information-subtle: var(--netural-sky-a100);
        --feedback-background-information-intense: var(--netural-sky-800);
        --feedback-background-neutral-subtle: var(--netural-gray-a100);
        --feedback-background-neutral-intense: var(--netural-gray-800);
    
        /* feedback border color */
        --feedback-border-positive-subtle: var(--primary-lgreen-a200);
        --feedback-border-positive-intense: var(--primary-lgreen-900);
        --feedback-border-negative-subtle: var(--primary-crimson-a200);
        --feedback-border-negative-intense: var(--primary-crimson-800);
        --feedback-border-notice-subtle: var(--netural-yellow-a200);
        --feedback-border-notice-intense: var(--netural-yellow-800);
        --feedback-border-information-subtle: var(--netural-sky-a200);
        --feedback-border-information-intense: var(--netural-sky-700);
        --feedback-border-neutral-subtle: var(--netural-slateblue-a100);
        --feedback-border-neutral-intense: var(--netural-slateblue-900);
    
        /*feedback text color*/
        --feedback-text-positive-subtle: var(--primary-lgreen-100);
        --feedback-text-positive-intense: var(--primary-lgreen-500);
        --feedback-text-negative-subtle: var(--primary-crimson-50);
        --feedback-text-negative-intense: var(--primary-crimson-300);
        --feedback-text-notice-subtle: var(--netural-yellow-50);
        --feedback-text-notice-intense: var(--netural-yellow-400);
        --feedback-text-information-subtle: var(--netural-sky-50);
        --feedback-text-information-intense: var(--netural-sky-300);
        --feedback-text-neutral-subtle: var(--netural-slateblue-700);
        --feedback-text-neutral-intense: var(--netural-slateblue-50);
    
        /*feedback icon color*/
        --feedback-icon-positive-subtle: var(--primary-lgreen-100);
        --feedback-icon-positive-intense: var(--primary-lgreen-600);
        --feedback-icon-negative-subtle: var(--primary-crimson-50);
        --feedback-icon-negative-intense: var(--primary-crimson-300);
        --feedback-icon-notice-subtle: var(--netural-yellow-50);
        --feedback-icon-notice-intense: var(--netural-yellow-400);
        --feedback-icon-information-subtle: var(--netural-sky-50);
        --feedback-icon-information-intense: var(--netural-sky-300);
        --feedback-icon-neutral-subtle: var(--netural-slateblue-700);
        --feedback-icon-neutral-intense: var(--netural-slateblue-50);
    
    
        /*interactive background color*/
        --interactive-background-positive-default: var(--primary-lgreen-600);
        --interactive-background-positive-highlighted: var(--primary-lgreen-700);
        --interactive-background-positive-disabled: var(--primary-lgreen-a150);
        --interactive-background-positive-faded: var(--primary-lgreen-a100);
        --interactive-background-positive-fadedHighlighted: var(--primary-lgreen-a150);
        /**/
        --interactive-background-negative-default: var(--primary-crimson-600);
        --interactive-background-negative-highlighted: var(--primary-crimson-700);
        --interactive-background-negative-disabled: var(--primary-crimson-a100);
        --interactive-background-negative-faded: var(--primary-crimson-a150);
        --interactive-background-negative-fadedHighlighted: var(--primary-crimson-a200);
        /**/
        --interactive-background-notice-default: var(--netural-yellow-500);
        --interactive-background-notice-highlighted: var(--netural-yellow-600);
        --interactive-background-notice-disabled: var(--netural-yellow-a150);
        --interactive-background-notice-faded: var(--netural-yellow-a100);
        --interactive-background-notice-fadedHighlighted: var(--netural-yellow-a150);
        /**/
        --interactive-background-information-default: var(--netural-sky-500);
        --interactive-background-information-highlighted: var(--netural-sky-600);
        --interactive-background-information-disabled: var(--netural-sky-a150);
        --interactive-background-information-faded: var(--netural-sky-a100);
        --interactive-background-information-fadedHighlighted: var(--netural-sky-a150);
        /**/
        --interactive-background-neutral-default: var(--netural-slateblue-50);
        --interactive-background-neutral-highlighted: var(--netural-slateblue-200);
        --interactive-background-neutral-disabled: var(--netural-slateblue-a100);
        --interactive-background-neutral-faded: var(--netural-slateblue-a100);
        --interactive-background-neutral-fadedHighlighted: var(--netural-slateblue-a150);
        /**/
        --interactive-background-gray-default: var(--netural-lavgray-a100);
        --interactive-background-gray-highlighted: var(--netural-lavgray-a150);
        --interactive-background-gray-disabled: var(--netural-lavgray-a50);
        --interactive-background-gray-faded: var(--netural-gray-a200);
        --interactive-background-gray-fadedHighlighted: var(--netural-lavgray-a100);
        /**/
        --interactive-background-primary-default: var(--primary-fgreen-400);
        --interactive-background-primary-highlighted: var(--primary-fgreen-500);
        --interactive-background-primary-disabled: var(--primary-fgreen-a150);
        --interactive-background-primary-faded: var(--primary-fgreen-a150);
        --interactive-background-primary-fadedHighlighted: var(--primary-fgreen-a200);
        /**/
        --interactive-background-staticblack-default: var(--netural-black-500);
        --interactive-background-staticblack-highlighted: var(--netural-black-500);
        --interactive-background-staticblack-disabled: var(--netural-white-200);
        --interactive-background-staticblack-faded: var(--netural-black-50);
        --interactive-background-staticblack-fadedHighlighted: var(--netural-black-100);
        /**/
        --interactive-background-staticwhite-default: var(--netural-white-500);
        --interactive-background-staticwhite-highlighted: var(--netural-white-400);
        --interactive-background-staticwhite-disabled: var(--netural-white-50);
        --interactive-background-staticwhite-faded: var(--netural-white-50);
        --interactive-background-staticwhite-fadedHighlighted: var(--netural-white-200);
    
    
        /*interactive border color*/
        --interactive-border-positive-default: var(--primary-fgreen-600);
        --interactive-border-positive-highlighted: var(--primary-fgreen-700);
        --interactive-border-positive-disabled: var(--primary-fgreen-a100);
        --interactive-border-positive-fadedHighlighted: var(--primary-fgreen-a100);
        --interactive-border-positive-faded: var(--primary-fgreen-a100);
        /**/
        --interactive-border-negative-default: var(--primary-crimson-600);
        --interactive-border-negative-highlighted: var(--primary-crimson-700);
        --interactive-border-negative-disabled: var(--primary-crimson-a100);
        --interactive-border-negative-fadedHighlighted: var(--primary-crimson-a100);
        --interactive-border-negative-faded: var(--primary-crimson-a100);
        /**/
        --interactive-border-notice-default: var(--netural-yellow-600);
        --interactive-border-notice-highlighted: var(--netural-yellow-700);
        --interactive-border-notice-disabled: var(--netural-yellow-a100);
        --interactive-border-notice-fadedHighlighted: var(--netural-yellow-a100);
        --interactive-border-notice-faded: var(--netural-yellow-a100);
        /**/
        --interactive-border-information-default: var(--netural-sky-600);
        --interactive-border-information-highlighted: var(--netural-sky-700);
        --interactive-border-information-disabled: var(--netural-sky-a100);
        --interactive-border-information-fadedHighlighted: var(--netural-sky-a100);
        --interactive-border-information-faded: var(--netural-sky-a100);
        /**/
        --interactive-border-neutral-default: var(--netural-slateblue-200);
        --interactive-border-neutral-highlighted: var(--netural-slateblue-200);
        --interactive-border-neutral-disabled: var(--netural-slateblue-800);
        --interactive-border-neutral-fadedHighlighted: var(--netural-slateblue-a100);
        --interactive-border-neutral-faded: var(--netural-slateblue-a100);
        /**/
        --interactive-border-gray-default: var(--netural-gray-500);
        --interactive-border-gray-highlighted: var(--netural-gray-600);
        --interactive-border-gray-disabled: var(--netural-gray-700);
        --interactive-border-gray-faded: var(--netural-gray-a100);
        /**/
        --interactive-border-primary-default: var(--primary-fgreen-400);
        --interactive-border-primary-highlighted: var(--primary-fgreen-500);
        --interactive-border-primary-disabled: var(--primary-fgreen-a200);
        --interactive-border-primary-faded: var(--primary-fgreen-a150);
        /**/
        --interactive-border-staticwhite-default: var(--netural-white-500);
        --interactive-border-staticwhite-highlighted: var(--netural-white-400);
        --interactive-border-staticwhite-disabled: var(--netural-white-100);
        --interactive-border-staticwhite-faded: var(--netural-white-50);
        /**/
        --interactive-border-staticblack-default: var(--netural-black-500);
        --interactive-border-staticblack-highlighted: var(--netural-black-500);
        --interactive-border-staticblack-disabled: var(--netural-black-100);
        --interactive-border-staticblack-faded: var(--netural-black-100);
    
    
        /*interactive text color*/
        --interactive-text-positive-normal: var(--primary-lgreen-200);
        --interactive-text-positive-subtle: var(--primary-lgreen-400);
        --interactive-text-positive-muted: var(--primary-lgreen-700);
        --interactive-text-positive-fadedHighlighted: var(--primary-lgreen-700);
        --interactive-text-positive-disabled: var(--primary-lgreen-a200);
        /**/
        --interactive-text-negative-normal: var(--primary-crimson-300);
        --interactive-text-negative-subtle: var(--primary-crimson-400);
        --interactive-text-negative-muted: var(--primary-crimson-700);
        --interactive-text-negative-fadedHighlighted: var(--primary-crimson-700);
        --interactive-text-negative-disabled: var(--primary-crimson-a200);
        /**/
        --interactive-text-notice-normal: var(--netural-yellow-200);
        --interactive-text-notice-subtle: var(--netural-yellow-400);
        --interactive-text-notice-muted: var(--netural-yellow-700);
        --interactive-text-notice-fadedHighlighted: var(--netural-yellow-700);
        --interactive-text-notice-disabled: var(--netural-yellow-a200);
        /**/
        --interactive-text-information-normal: var(--netural-sky-200);
        --interactive-text-information-subtle: var(--netural-sky-400);
        --interactive-text-information-muted: var(--netural-sky-700);
        --interactive-text-information-fadedHighlighted: var(--netural-sky-700);
        --interactive-text-information-disabled: var(--netural-sky-a200);
        /**/
        --interactive-text-neutral-normal: var(--netural-slateblue-100);
        --interactive-text-neutral-subtle: var(--netural-slateblue-300);
        --interactive-text-neutral-muted: var(--netural-slateblue-500);
        --interactive-text-neutral-fadedHighlighted: var(--netural-slateblue-500);
        --interactive-text-neutral-disabled: var(--netural-lavgray-a200);
        /**/
        --interactive-text-gray-normal: var(--netural-gray-50);
        --interactive-text-gray-subtle: var(--netural-gray-200);
        --interactive-text-gray-muted: var(--netural-gray-300);
        --interactive-text-gray-disabled: var(--netural-white-100);
        /**/
        --interactive-text-primary-normal: var(--primary-fgreen-200);
        --interactive-text-primary-subtle: var(--primary-fgreen-400);
        --interactive-text-primary-muted: var(--primary-fgreen-600);
        --interactive-text-primary-disabled: var(--primary-fgreen-a200);
        /**/
        --interactive-text-onprimary-normal: var(--netural-black-500);
        --interactive-text-onprimary-subtle: var(--netural-black-400);
        --interactive-text-onprimary-muted: var(--netural-black-300);
        --interactive-text-onprimary-disabled: var(--netural-black-100);
        /**/
        --interactive-text-staticblack-normal: var(--netural-black-500);
        --interactive-text-staticblack-subtle: var(--netural-black-400);
        --interactive-text-staticblack-muted: var(--netural-black-300);
        --interactive-text-staticblack-disabled: var(--netural-black-100);
        /**/
        --interactive-text-staticwhite-normal: var(--netural-white-500);
        --interactive-text-staticwhite-subtle: var(--netural-white-400);
        --interactive-text-staticwhite-muted: var(--netural-white-300);
        --interactive-text-staticwhite-disabled: var(--netural-white-100);  
        
        /*------------------------------------------------------------------*/
    
        /*interactive icon color*/
        --interactive-icon-positive-normal: var(--primary-lgreen-200);
        --interactive-icon-positive-subtle: var(--primary-lgreen-400);
        --interactive-icon-positive-muted: var(--primary-lgreen-700);
        --interactive-icon-positive-disabled: var(--primary-lgreen-a200);
        /**/
        --interactive-icon-negative-normal: var(--primary-crimson-300);
        --interactive-icon-negative-subtle: var(--primary-crimson-400);
        --interactive-icon-negative-muted: var(--primary-crimson-600);
        --interactive-icon-negative-disabled: var(--primary-crimson-a200);
        /**/
        --interactive-icon-notice-normal: var(--netural-yellow-200);
        --interactive-icon-notice-subtle: var(--netural-yellow-400);
        --interactive-icon-notice-muted: var(--netural-yellow-700);
        --interactive-icon-notice-disabled: var(--netural-yellow-a200);
        /**/
        --interactive-icon-information-normal: var(--netural-sky-200);
        --interactive-icon-information-subtle: var(--netural-sky-400);
        --interactive-icon-information-muted: var(--netural-sky-700);
        --interactive-icon-information-disabled: var(--netural-sky-a200);
        /**/
        --interactive-icon-neutral-normal: var(--netural-slateblue-100);
        --interactive-icon-neutral-subtle: var(--netural-slateblue-300);
        --interactive-icon-neutral-muted: var(--netural-slateblue-600);
        --interactive-icon-neutral-disabled: var(--netural-lavgray-a200);
        /**/
        --interactive-icon-gray-normal: var(--netural-gray-50);
        --interactive-icon-gray-subtle: var(--netural-gray-200);
        --interactive-icon-gray-muted: var(--netural-gray-400);
        --interactive-icon-gray-disabled: var(--netural-white-100);
        /**/
        --interactive-icon-primary-normal: var(--primary-fgreen-200);
        --interactive-icon-primary-subtle: var(--primary-fgreen-400);
        --interactive-icon-primary-muted: var(--primary-fgreen-600);
        --interactive-icon-primary-disabled: var(--primary-fgreen-a200);
        /**/
        --interactive-icon-onprimary-normal: var(--netural-black-500);
        --interactive-icon-onprimary-subtle: var(--netural-black-400);
        --interactive-icon-onprimary-muted: var(--netural-black-300);
        --interactive-icon-onprimary-disabled: var(--netural-black-100);
        /**/
        --interactive-icon-staticblack-normal: var(--netural-black-500);
        --interactive-icon-staticblack-subtle: var(--netural-black-400);
        --interactive-icon-staticblack-muted: var(--netural-black-300);
        --interactive-icon-staticblack-disabled: var(--netural-black-100);
        /**/
        --interactive-icon-staticwhite-normal: var(--netural-white-500);
        --interactive-icon-staticwhite-subtle: var(--netural-white-400);
        --interactive-icon-staticwhite-muted: var(--netural-white-300);
        --interactive-icon-staticwhite-disabled: var(--netural-white-100);
    
    
        /*interactive hover color*/
        --interactive-hover-subtle: var(--netural-white-25);
        --interactive-hover-intense: var(--netural-black-100);
    
    
        /*overlay background color*/
        --overlay-background-moderate: var(--netural-slateblue-a150);
        --overlay-background-subtle: var(--netural-black-400);
    
    
        /*popup background color*/
        --popup-background-subtle: var(--netural-slateblue-900);
        --popup-background-intense: var(--netural-slateblue-50);
    
        /*popup border color*/
        --popup-border-subtle: var(--netural-slateblue-600);
        --popup-border-intense: var(--netural-lavgray-a100);
    
    
        /*elevation color*/
        --elevation-microRaised: #3F4F6117;
        --elevation-lowRaised: #3F4F611F;
        --elevation-midRaised: #3F4F611F;
        --elevation-highRaised: #3F4F612E;
        --elevation-bottomsheet: var();
        --elevation-toast: var();
    
    
        /*list item asset color*/
        --listItemAsset-color: var(--netural-slateblue-600);
    
    
        /*link border color*/
        --link-border-positive: var(--primary-lgreen-600);
        --link-border-negative: var(--primary-crimson-600);
        --link-border-notice: var(--netural-yellow-600);
        --link-border-information: var(--netural-sky-600);
        --link-border-neutral: var(--netural-slateblue-900);
        --link-border-primary: var(--primary-fgreen-500);
        --link-border-staticwhite: var(--netural-white-400);
        --link-border-staticblack: var(--netural-black-400);
        --link-border-gray: var(--netural-gray-900);
    
    
        /*amount strikthrough*/
        --amount-strikethrough-positive: var(--primary-lgreen-800);
        --amount-strikethrough-negative: var(--primary-crimson-600);
        --amount-strikethrough-notice: var(--netural-yellow-700);
        --amount-strikethrough-information: var(--netural-sky-600);
        --amount-strikethrough-neutral: var(--netural-slateblue-1000);
        --amount-strikethrough-primary: var(--primary-fgreen-500);
        --amount-strikethrough-staticwhite: var(--netural-white-500);
        --amount-strikethrough-staticblack: var(--netural-black-500);
        --amount-strikethrough-graynormal: var(--netural-slateblue-1000);
        --amount-strikethrough-graysubtle: var(--netural-slateblue-900);
        --amount-strikethrough-graymuted: var(--netural-slateblue-600);
    
        /*card*/
        --card-bg-intense: var(--netural-slateblue-800);
        --card-bg-moderate: var(--netural-slateblue-900);
        --card-bg-subtle: var(--netural-slateblue-1000);
    
        --footer-logo-filter: invert(1) brightness(10);

        /* Focus */
        --focus-ring: #F8FAFC;
        --focus-box-shadow: #424449;
    }