/**
 * Do not edit directly
 */

:host,
html {
  --_orange: #ff6200;
  --_white: #ffffff;
  --_gray_100: #f0f0f0;
  --_gray_200: #d9d9d9;
  --_gray_300: #a8a8a8;
  --_gray_400: #696969;
  --_gray_500: #3d3d3d;
  --_gray_600: #333333;
  --_gray_700: #212121;
  --_gray_800: #050505;
  --_indigo_100: #ededf5;
  --_indigo_200: #dcdceb;
  --_indigo_300: #cbcae0;
  --_indigo_400: #bab9d6;
  --_indigo_500: #525199;
  --_indigo_600: #31305b;
  --_fuchsia_100: #f6e5ef;
  --_fuchsia_200: #eecce0;
  --_fuchsia_300: #e6b2d1;
  --_fuchsia_400: #dd99c2;
  --_fuchsia_500: #ab0066;
  --_fuchsia_600: #66003d;
  --_sky_100: #eff6fb;
  --_sky_200: #dfedf8;
  --_sky_300: #cfe4f4;
  --_sky_400: #bfdbf0;
  --_sky_500: #559bd1;
  --_sky_600: #335d7d;
  --_lime_100: #fafbeb;
  --_lime_200: #f6f7d8;
  --_lime_300: #f1f4c4;
  --_lime_400: #ecf0b1;
  --_lime_500: #d0d93c;
  --_lime_600: #7c8224;
  --_leaf_100: #eaf4ed;
  --_leaf_200: #d6eadc;
  --_leaf_300: #c2dfca;
  --_leaf_400: #aed5b9;
  --_leaf_500: #349651;
  --_leaf_600: #1f5a30;
  --_minus_400: #e14242;
  --_minus_500: #d70000;
  --_plus_400: #aed5b9;
  --_plus_500: #349651;
  --_annotation_400: #a5e5e5;
  --_annotation_600: #008080;
  --_opacity_10: 0.1;
  --_opacity_20: 0.2;
  --_opacity_30: 0.3;
  --_opacity_40: 0.4;
  --_opacity_50: 0.5;
  --_opacity_60: 0.6;
  --_opacity_70: 0.7;
  --_opacity_80: 0.8;
  --_opacity_90: 0.9;
  --_dimension_25: 0.125rem;
  --_dimension_50: 0.25rem;
  --_dimension_100: 0.5rem;
  --_dimension_200: 1rem;
  --_dimension_300: 1.5rem;
  --_dimension_400: 2rem;
  --_dimension_500: 2.5rem;
  --_dimension_600: 3rem;
  --_dimension_700: 3.5rem;
  --_dimension_800: 4rem;
  --_dimension_1000: 5rem;
  --_dimension_1200: 6rem;
}

/**
 * Do not edit directly
 */

:host,
html {
  --bg_tab: #f6f6f6;
  --bg_tab-secondary: #fafafa;
  --border_default_width: 0.0625rem;
  --border_default_style: solid;
  --border_subtle_width: 0.0625rem;
  --border_subtle_style: solid;
  --border_primary_width: 0.0625rem;
  --border_primary_style: solid;
  --border_secondary_width: 0.0625rem;
  --border_secondary_style: solid;
  --border_tertiary_width: 0.0625rem;
  --border_tertiary_style: solid;
  --border_info_width: 0.0625rem;
  --border_info_style: solid;
  --border_info-inverse_width: 0.0625rem;
  --border_info-inverse_style: solid;
  --border_success_width: 0.0625rem;
  --border_success_style: solid;
  --border_warning_width: 0.0625rem;
  --border_warning_style: solid;
  --border_error_width: 0.0625rem;
  --border_error_style: solid;
  --border_disabled_width: 0.0625rem;
  --border_disabled_style: solid;
  --border_inverse_width: 0.0625rem;
  --border_inverse_style: solid;
  --border_emphasis_width: 0.0625rem;
  --border_emphasis_style: solid;
  --border_dropZone-default_width: 0.0625rem;
  --border_dropZone-default_style: dashed;
  --border_dropZone-disabled_width: 0.0625rem;
  --border_dropZone-disabled_style: dashed;
  --border_onColor_width: 0.0625rem;
  --border_onColor_style: solid;
  --border_focus-inner_style: solid;
  --border_focus-outer_style: solid;
  --opacity_pressed: var(
    --_opacity_60
  ); /* opacity token for pressed states to be used as a composite in component tokens */
  --opacity_overlay: var(--_opacity_70); /* Used for scrim modals */
  --fg_default: var(--_gray_600);
  --fg_subtle: var(--_gray_400);
  --fg_disabled: var(--_gray_300);
  --fg_onColor: var(--_white);
  --fg_inverse: var(--_white);
  --fg_primary: var(--_orange);
  --fg_secondary: var(--_indigo_500);
  --fg_tertiary: var(--_fuchsia_500);
  --fg_info: var(--_sky_500);
  --fg_success: var(--_leaf_500);
  --fg_warning: var(--_orange);
  --fg_error: var(--_minus_500);
  --bg_default: var(--_white);
  --bg_page: var(--_gray_100);
  --bg_subtle: var(--_gray_200);
  --bg_overlay: rgba(51, 51, 51, 0.7);
  --bg_primary: var(--_orange);
  --bg_secondary: var(--_indigo_500);
  --bg_secondary-subtle: var(--_indigo_200);
  --bg_tertiary: var(--_fuchsia_500);
  --bg_info: var(--_sky_500);
  --bg_success: var(--_leaf_200);
  --bg_done: var(--_leaf_500);
  --bg_hover-primary: var(--_sky_300); /* Legacy OJ SUN components use case */
  --bg_hover-secondary: var(
    --_indigo_200
  ); /* Legacy OJ SUN components use case */
  --bg_hover-tertiary: var(
    --_fuchsia_200
  ); /* Legacy OJ SUN components use case */
  --bg_highlight: var(--_sky_200); /* Legacy OJ SUN components use case */
  --bg_disabled: var(--_gray_300);
  --bg_page-tags: var(--_gray_200);
  --bg_page-tags-inverse: var(--_indigo_500);
  --bg_page-library: var(--_white);
  --bg_tab-inverse: var(--_indigo_600);
  --bg_tab-secondary-inverse: var(--_indigo_500);
  --bg_tab-border: var(--_gray_100);
  --bg_tab-border-inverse: var(--_indigo_500);
  --bg_snackbar: var(--_gray_400);
  --bg_notification: var(--_minus_500);
  --bg_onColor: var(--_white);
  --bg_pageSecondary: var(--_white);
  --border_default_color: var(--_gray_400);
  --border_subtle_color: var(--_gray_200);
  --border_primary_color: var(--_orange);
  --border_secondary_color: var(--_indigo_500);
  --border_tertiary_color: var(--_fuchsia_500);
  --border_info_color: var(--_sky_500);
  --border_info-inverse_color: var(--_sky_400);
  --border_success_color: var(--_leaf_500);
  --border_warning_color: var(--_orange);
  --border_error_color: var(--_minus_500);
  --border_disabled_color: var(--_gray_300);
  --border_inverse_color: var(--_white);
  --border_emphasis_color: var(--_gray_600);
  --border_dropZone-default_color: var(--_gray_400);
  --border_dropZone-disabled_color: var(--_gray_300);
  --border_onColor_color: var(--_white);
  --border_focus-inner_color: var(--_white);
  --border_focus-inner_width: var(--_dimension_25);
  --border_focus-outer_color: var(--_sky_600);
  --border_focus-outer_width: var(--_dimension_25);
  --padding_xxs: var(--_dimension_50);
  --padding_xs: var(--_dimension_100);
  --padding_sm: var(--_dimension_200);
  --padding_md: var(--_dimension_300);
  --padding_lg: var(--_dimension_400);
  --padding_xl: var(--_dimension_500);
  --padding_xxl: var(--_dimension_600);
  --padding_xxxl: var(--_dimension_700);
  --gap_xxs: var(--_dimension_50);
  --gap_xs: var(--_dimension_100);
  --gap_sm: var(--_dimension_200);
  --gap_md: var(--_dimension_300);
  --gap_lg: var(--_dimension_400);
  --gap_xl: var(--_dimension_500);
  --gap_xxl: var(--_dimension_600);
  --gap_xxxl: var(--_dimension_700);
}

/**
 * Do not edit directly
 */

:host([data-theme~="dark"]),
html[data-theme~="dark"] {
  --border_dropZone-default_style: solid;
  --border_dropZone-disabled_style: dash;
  --opacity_pressed: var(
    --_opacity_60
  ); /* opacity token for pressed states to be used as a composite in component tokens */
  --opacity_overlay: var(--_opacity_70); /* Used for scrim modals */
  --fg_default: var(--_gray_100);
  --fg_subtle: var(--_gray_200);
  --fg_disabled: var(--_gray_400);
  --fg_inverse: var(--_gray_800);
  --fg_secondary: var(--_indigo_400);
  --fg_tertiary: var(--_fuchsia_400);
  --fg_info: var(--_sky_400);
  --fg_success: var(--_leaf_400);
  --fg_error: var(--_minus_400);
  --bg_default: var(--_gray_700);
  --bg_page: var(--_gray_800);
  --bg_subtle: var(--_gray_600);
  --bg_overlay: rgba(240, 240, 240, 0.7);
  --bg_secondary-subtle: var(--_indigo_400);
  --bg_tertiary: var(--_fuchsia_400);
  --bg_info: var(--_sky_600);
  --bg_success: var(--_leaf_600);
  --bg_done: var(--_leaf_400);
  --bg_hover-primary: var(--_sky_600); /* Legacy OJ SUN components use case */
  --bg_hover-secondary: var(
    --_indigo_600
  ); /* Legacy OJ SUN components use case */
  --bg_hover-tertiary: var(
    --_fuchsia_600
  ); /* Legacy OJ SUN components use case */
  --bg_highlight: var(--_sky_600); /* Legacy OJ SUN components use case */
  --bg_disabled: var(--_gray_400);
  --bg_page-tags: var(--_gray_600);
  --bg_page-tags-inverse: var(--_gray_200);
  --bg_page-library: var(--_gray_800);
  --bg_tab: var(--_gray_700);
  --bg_tab-inverse: var(--_indigo_500);
  --bg_tab-secondary: var(--_gray_500);
  --bg_tab-secondary-inverse: var(--_indigo_400);
  --bg_tab-border: var(--_gray_700);
  --bg_snackbar: var(--_gray_200);
  --bg_notification: var(--_minus_400);
  --bg_pageSecondary: var(--_gray_800);
  --border_subtle_color: var(--_gray_600);
  --border_secondary_color: var(--_indigo_400);
  --border_tertiary_color: var(--_fuchsia_400);
  --border_info_color: var(--_sky_400);
  --border_info-inverse_color: var(--_sky_500);
  --border_success_color: var(--_leaf_400);
  --border_error_color: var(--_minus_400);
  --border_disabled_color: var(--_gray_500);
  --border_inverse_color: var(--_gray_600);
  --border_emphasis_color: var(--_white);
  --border_dropZone-default_color: var(--_gray_500);
  --border_dropZone-disabled_color: var(--_gray_400);
  --border_focus-inner_color: var(--_sky_600);
  --border_focus-outer_color: var(--_white);
}


@font-face {
  font-family: 'INGMe';
  src: url('assets/INGMe/Regular/INGMeWeb-Regular.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'INGMe';
  src: url('assets/INGMe/Bold/INGMeWeb-Bold.woff2') format('woff2');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

body {
  font-family: INGMe, arial, helvetica, sans-serif;
}

/**
* ###########   From this line starts the Spanish local tokens.  ################
*
* To add local tokens, use this file, located in /ing-web-es/assets/es.global.css
*
* this file is added to the end of the global.css
*/

/****
*  ES Colors
****/
:host,
html {
  --_es_electric-blue: #3d4cc9;
  --_es_faded-blue: #737dd9;
  --_es_cool-blue: #0797fd;
  --_es_greece-blue: #429aca;
  --_es_deep-river: #266678;
  --_es_poker-green: #339781;
  --_es_ocean-blue: #00afb1;
  --_es_turquoise: #abdbb2;
  --_es_grass-green: #5fc634;
  --_es_olive-green: #687709;
  --_es_gold-orange: #ffa810;
  --_es_pumpkin-orange: #ff8413;
  --_es_grain-brown: #dfd1b0;
  --_es_lady-rose: #d98181;
  --_es_french-rose: #f7af80;
  --_es_bouganville-rose: #f35465;
  --_es_rich-maroon: #bc1d5e;
  --_es_garnet-wine: #77133c;
  --_es_purple: #8a148c;
  --_es_orchid-lilac: #bf64e0;
  --_es_blue-logo: #000066;
}
/***** Gray opacity ****/
:host,
html {
  --_es_gray-100-10: rgba(240, 240, 240, 0.1);
  --_es_gray-100-20: rgba(240, 240, 240, 0.2);
  --_es_gray-100-40: rgba(240, 240, 240, 0.4);
  --_es_gray-600-05: rgba(51, 51, 51, 0.05);
  --_es_gray-600-10: rgba(51, 51, 51, 0.1);
  --_es_gray-600-20: rgba(51, 51, 51, 0.2);
}
/***** END gray opacity ****/

/***** Indigo opacity ****/
:host,
html {
  --_es_indigo-500-20: rgba(82, 81, 153, 0.2);
  --_es_indigo-500-60: rgba(82, 81, 153, 0.6);
  --_es_indigo-400-40: rgba(186, 185, 214, 0.4);
  --_es_indigo-400-60: rgba(186, 185, 214, 0.6);
}
/***** END Indigo opacity ****/

/****
* END ES Colors
****/

/****
*  ES Background 
****/
:host,
html {
  --_es_bg_secondary-accent: var(--_indigo_500);
  --_es_bg_inverse: var(--_gray_600);

  --_es_bg_context: var(--_es_gray-600-10);
  --_es_bg_context-inverse: var(--_es_gray-100-20);

  --_es_bg_strong-indigo: var(--_indigo_500);
  --_es_bg_strong-fuchsia: var(--_fuchsia_500);
  --_es_bg_strong-sky: var(--_sky_500);
  --_es_bg_strong-leaf: var(--_leaf_500);
  --_es_bg_strong-lime: var(--_lime_500);

  --_es_bg_mid-indigo: var(--_indigo_400);
  --_es_bg_mid-fuchsia: var(--_fuchsia_400);
  --_es_bg_mid-sky: var(--_sky_400);
  --_es_bg_mid-leaf: var(--_leaf_400);
  --_es_bg_mid-lime: var(--_lime_400);

  --_es_bg_subtle-indigo: var(--_indigo_200);
  --_es_bg_subtle-fuchsia: var(--_fuchsia_200);
  --_es_bg_subtle-sky: var(--_sky_200);
  --_es_bg_subtle-leaf: var(--_leaf_200);
  --_es_bg_subtle-lime: var(--_lime_200);
  
  --_es_bg_states_surface-hover: var(--_es_gray-600-10);
  --_es_bg_states_surface-pressed: var(--_es_gray-600-20);
  --_es_bg_states_surface-inverse-hover: var(--_es_gray-100-20);
  --_es_bg_states_surface-inverse-pressed: var(--_es_gray-100-40);
}

:host([data-theme~='dark']),
html[data-theme~='dark'] {
  --_es_bg_secondary-accent: var(--_indigo_400);
  --_es_bg_inverse: var(--_gray_100);

  --_es_bg_context: var(--_es_gray-100-20);
  --_es_bg_context-inverse: var(--_es_gray-600-10);

  --_es_bg_strong-indigo: var(--_indigo_400);
  --_es_bg_strong-fuchsia: var(--_fuchsia_400);
  --_es_bg_strong-sky: var(--_sky_400);
  --_es_bg_strong-leaf: var(--_leaf_400);
  --_es_bg_strong-lime: var(--_lime_400);

  --_es_bg_mid-indigo: var(--_indigo_500);
  --_es_bg_mid-fuchsia: var(--_fuchsia_500);
  --_es_bg_mid-sky: var(--_sky_500);
  --_es_bg_mid-leaf: var(--_leaf_500);
  --_es_bg_mid-lime: var(--_lime_500);

  --_es_bg_subtle-indigo: var(--_indigo_600);
  --_es_bg_subtle-fuchsia: var(--_fuchsia_600);
  --_es_bg_subtle-sky: var(--_sky_600);
  --_es_bg_subtle-leaf: var(--_leaf_600);
  --_es_bg_subtle-lime: var(--_lime_600);

  --_es_bg_states_surface-hover: var(--_es_gray-100-20);
  --_es_bg_states_surface-pressed: var(--_es_gray-100-40);
  --_es_bg_states_surface-inverse-hover: var(--_es_gray-600-10);
  --_es_bg_states_surface-inverse-pressed: var(--_es_gray-600-20);
}

/****
*  END ES Background 
****/

/****
*  ES Foreground 
****/
:host,
html {
  --_es_fg_secondary-accent: var(--_indigo_500);
  --_es_fg_product-home: var(--_es_faded-blue);
  --_es_fg_product-transport: var(--_es_ocean-blue);
  --_es_fg_product-leisure: var(--_es_grass-green);
  --_es_fg_product-payroll: var(--_es_deep-river);
  --_es_fg_product-excludes: var(--_es_olive-green);
  --_es_fg_product-mix-categories: var(--_es_poker-green);
  --_es_fg_product-purchases: var(--_es_orchid-lilac);
  --_es_fg_product-expenses: var(--_es_purple);
  --_es_fg_product-education: var(--_es_french-rose);
  --_es_fg_product-health: var(--_es_lady-rose);
  --_es_fg_product-incomes: var(--_es_rich-maroon);
  --_es_fg_product-investment: var(--_es_garnet-wine);
  --_es_fg_product-supermarkets: var(--_es_cool-blue);
  --_es_fg_product-savings: var(--_es_electric-blue);
  --_es_fg_product-cash: var(--_es_gold-orange);
  --_es_fg_product-wedding: var(--_es_bouganville-rose);
  --_es_fg_product-travel: var(--_es_greece-blue);
  --_es_fg_product-unforeseen: var(--_es_pumpkin-orange);
}

:host([data-theme='dark']),
html[data-theme='dark'] {
  --_es_fg_secondary-accent: var(--_indigo_100);
  --_es_fg_product-home: var(--_es_faded-blue);
  --_es_fg_product-transport: var(--_es_ocean-blue);
  --_es_fg_product-leisure: var(--_es_grass-green);
  --_es_fg_product-payroll: var(--_es_deep-river);
  --_es_fg_product-excludes: var(--_es_olive-green);
  --_es_fg_product-mix-categories: var(--_es_poker-green);
  --_es_fg_product-purchases: var(--_es_orchid-lilac);
  --_es_fg_product-expenses: var(--_es_purple);
  --_es_fg_product-education: var(--_es_french-rose);
  --_es_fg_product-health: var(--_es_lady-rose);
  --_es_fg_product-incomes: var(--_es_rich-maroon);
  --_es_fg_product-investment: var(--_es_garnet-wine);
  --_es_fg_product-supermarkets: var(--_es_cool-blue);
  --_es_fg_product-savings: var(--_es_electric-blue);
  --_es_fg_product-cash: var(--_es_gold-orange);
  --_es_fg_product-wedding: var(--_es_bouganville-rose);
  --_es_fg_product-travel: var(--_es_greece-blue);
  --_es_fg_product-unforeseen: var(--_es_pumpkin-orange);
}
/****
*  END ES Foreground 
****/

/****
*  END ES Border 
****/

:host,
html {
  --_es_border_secondary-accent: var(--_indigo_500);
  --_es_border_pageColor: var(--_gray_100);
  --_es_border_states_default: var(--_indigo_500);
  --_es_border_states_hover: var(--_es_indigo-500-20);
  --_es_border_states_pressed: var(--_es_indigo-500-60);
  --_es_border_states_inverse: var(--_indigo_400);
  --_es_border_states_inverse-hover: var(--_es_indigo-400-40);
  --_es_border_states_inverse-pressed: var(--_es_indigo-400-60);
  --_es_border_focus_inverse-inner: var(--_sky_600);
  --_es_border_focus_inverse-outer: var(--_white); 
  --_es_fix_border_subtle: var(--_gray_200);
  --_es_fix_border_focus-inner: var(--_white);
  --_es_fix_border_focus-outer: var(--_sky_600);
}

:host([data-theme='dark']),
html[data-theme='dark'] {
  --_es_border_secondary-accent: var(--_indigo_100);
  --_es_border_pageColor: var(--_gray_800);
    --_es_border_states_default: var(--_indigo_400);
  --_es_border_states_hover: var(--_es_indigo-400-40);
  --_es_border_states_pressed: var(--_es_indigo-400-60);
  --_es_border_states_inverse: var(--_indigo_500);
  --_es_border_states_inverse-hover: var(--_es_indigo-500-20);
  --_es_border_states_inverse-pressed: var(--_es_indigo-500-60);
    --_es_border_focus_inverse-inner: var(--_sky_600);
  --_es_border_focus_inverse-outer: var(--_white);
    --_es_fix_border_subtle: var(--_gray_500);
  --_es_fix_border_focus-inner: var(--_white);
  --_es_fix_border_focus-outer: var(--_sky_600);
}
/****
*  END ES Border 
****/

/****
*  ES sizes 
****/
:host,
html {
  --_es_size_1: 0.0625rem;
  --_es_size_2: 0.125rem;
  --_es_size_4: 0.25rem;
  --_es_size_8: 0.5rem;
  --_es_size_12: 0.75rem;
  --_es_size_16: 1rem;
  --_es_size_20: 1.25rem;
  --_es_size_24: 1.5rem;
  --_es_size_32: 2rem;
  --_es_size_40: 2.5rem;
  --_es_size_48: 3rem;
  --_es_size_52: 3.25rem;
  --_es_size_56: 3.5rem;
  --_es_size_64: 4rem;
  --_es_size_72: 4.5rem;
  --_es_size_80: 5rem;
}
/****
*  END ES sizes 
****/