@charset "UTF-8";

/* Alias Masterbrand */
:root {
	/* brand colors */
	--brand-color-1: #ff6200;
	--brand-color-2: #ffffff;
	--brand-color-3: #56504c;
	--brand-color-4: #30313f;

	/* Grays */
	--black: #000000;
	--gray-100: #f5f5f5;
	--gray-200: #efe9e5;
	--gray-300: #d6d0cc;
	--gray-400: #cdced9;
	--gray-500: #89837f;
	--gray-600: #56504c;
	--gray-700: #495057;
	--gray-800: #231d19;
	--gray-900: #272833;
	--white: #ffffff;

	/* Theme colors */
	--danger: #b71c1c;
	--dark: #6e6e6e;
	--gray-dark: #3b3b3b;
	--info: #003f88;
	--light: #f1f2f5;
	--lighter: #f7f8f9;
	--primary: #ff6200;
	--secondary: #0f0f0f;
	--success: #007a47;
	--warning: #aa7900;

	/* ↑↑ Style book Itau masterbrand ↑↑ */

	/* primary */
	--primary-100: var(--org-100);
	--primary-200: var(--org-200);
	--primary-300: var(--org-300);
	--primary-400: var(--org-400);
	--primary-500: var(--org-500);
	--primary-600: var(--org-600);
	--primary-700: var(--org-700);
	--primary-800: var(--org-800);
	--primary-900: var(--org-900);

	/* secondary */
	--secondary-100: var(--bl-drk-100);
	--secondary-200: var(--bl-drk-200);
	--secondary-300: var(--bl-drk-300);
	--secondary-400: var(--bl-drk-400);
	--secondary-500: var(--bl-drk-500);
	--secondary-600: var(--bl-drk-600);
	--secondary-700: var(--bl-drk-700);
	--secondary-800: var(--bl-drk-800);
	--secondary-900: var(--bl-drk-900);

	/* neutral */
	--neutral-100: var(--gy-100);
	--neutral-1000: var(--gy-1000);
	--neutral-200: var(--gy-200);
	--neutral-300: var(--gy-300);
	--neutral-400: var(--gy-400);
	--neutral-500: var(--gy-500);
	--neutral-600: var(--gy-600);
	--neutral-700: var(--gy-700);
	--neutral-800: var(--gy-800);
	--neutral-900: var(--gy-900);

	--black-alias: var(--bk);
	--white-alias: var(--wh);

	/* alfa */
	--neutral-gya-drk-00: var(--gya-drk-00);
	--neutral-gya-drk-08: var(--gya-drk-08);
	--neutral-gya-drk-16: var(--gya-drk-16);
	--neutral-gya-drk-24: var(--gya-drk-24);
	--neutral-gya-drk-32: var(--gya-drk-32);
	--neutral-gya-drk-40: var(--gya-drk-40);
	--neutral-gya-drk-48: var(--gya-drk-48);
	--neutral-gya-drk-56: var(--gya-drk-56);
	--neutral-gya-drk-64: var(--gya-drk-64);
	--neutral-gya-drk-72: var(--gya-drk-72);
	--neutral-gya-drk-80: var(--gya-drk-80);
	--neutral-gya-drk-88: var(--gya-drk-88);
	--neutral-gya-drk-96: var(--gya-drk-96);
	
	--neutral-gya-lt-00: var(--gya-lt-00);
	--neutral-gya-lt-08: var(--gya-lt-08);
	--neutral-gya-lt-16: var(--gya-lt-16);
	--neutral-gya-lt-24: var(--gya-lt-24);
	--neutral-gya-lt-32: var(--gya-lt-32);
	--neutral-gya-lt-40: var(--gya-lt-40);
	--neutral-gya-lt-48: var(--gya-lt-48);
	--neutral-gya-lt-56: var(--gya-lt-56);
	--neutral-gya-lt-64: var(--gya-lt-64);
	--neutral-gya-lt-72: var(--gya-lt-72);
	--neutral-gya-lt-80: var(--gya-lt-80);
	--neutral-gya-lt-88: var(--gya-lt-88);
	--neutral-gya-lt-96: var(--gya-lt-96);

	/* error */
	--error-100: var(--rd-100);
	--error-200: var(--rd-200);
	--error-300: var(--rd-300);
	--error-400: var(--rd-400);
	--error-500: var(--rd-500);
	--error-600: var(--rd-600);
	--error-700: var(--rd-700);
	--error-800: var(--rd-800);
	--error-900: var(--rd-900);

	/* success */
	--success-100: var(--gr-100);
	--success-200: var(--gr-200);
	--success-300: var(--gr-300);
	--success-400: var(--gr-400);
	--success-500: var(--gr-500);
	--success-600: var(--gr-600);
	--success-700: var(--gr-700);
	--success-800: var(--gr-800);
	--success-900: var(--gr-900);

	/* warning */
	--warning-100: var(--yel-100);
	--warning-200: var(--yel-200);
	--warning-300: var(--yel-300);
	--warning-400: var(--yel-400);
	--warning-500: var(--yel-500);
	--warning-600: var(--yel-600);
	--warning-700: var(--yel-700);
	--warning-800: var(--yel-800);
	--warning-900: var(--yel-900);

	/* info light */
	--info-lt-100: var(--bl-100);
	--info-lt-200: var(--bl-200);
	--info-lt-300: var(--bl-300);
	--info-lt-400: var(--bl-400);
	--info-lt-500: var(--bl-500);
	--info-lt-600: var(--bl-600);
	--info-lt-700: var(--bl-700);
	--info-lt-800: var(--bl-800);
	--info-lt-900: var(--bl-900);

	/* info dark */
	--info-drk-100: var(--bl-drk-100);
	--info-drk-200: var(--bl-drk-200);
	--info-drk-300: var(--bl-drk-300);
	--info-drk-400: var(--bl-drk-400);
	--info-drk-500: var(--bl-drk-500);
	--info-drk-600: var(--bl-drk-600);
	--info-drk-700: var(--bl-drk-700);
	--info-drk-800: var(--bl-drk-800);
	--info-drk-900: var(--bl-drk-900);
}

/* Mapped */
:root {
	/* Primary buttons */
	--button-background-primary-hover: var(--primary-400);
	--button-background-primary-inverse-hover: var(--neutral-200);
	--button-background-primary-inverse-pressed: var(--neutral-400);
	--button-background-primary-inverse: var(--white-alias);
	--button-background-primary-pressed: var(--primary-600);
	--button-background-primary: var(--primary-500);

	/* Secondary buttons */
	--button-background-secondary-hover: var(--secondary-100);
	--button-background-secondary-inverse-hover: var(--neutral-gya-lt-08);
	--button-background-secondary-inverse-pressed: var(--secondary-100);
	--button-background-secondary-inverse: var(--neutral-gya-lt-00);
	--button-background-secondary-pressed: var(--secondary-800);
	--button-background-secondary: var(--neutral-gya-drk-00);
	--button-border-secondary-inverse: var(--secondary-100);
	--button-border-secondary: var(--secondary-700);

	/* Danger buttons */
	--button-background-danger-hover: var(--error-600);
	--button-background-danger-pressed: var(--error-700);
	--button-background-danger: var(--error-500);

	/* Ghost buttons */
	--button-background-ghost-hover: var(--neutral-gya-drk-08);
	--button-background-ghost-inverse-hover: var(--neutral-gya-lt-08);
	--button-background-ghost-inverse-pressed: var(--neutral-gya-lt-16);
	--button-background-ghost-inverse: var(--neutral-gya-lt-00);
	--button-background-ghost-pressed: var(--neutral-gya-drk-16);
	--button-background-ghost: var(--neutral-gya-drk-00);

	/* nav */
    --nav-background-01: var(--neutral-900);
    --nav-background-02: var(--neutral-900);
    --nav-border-01: var(--neutral-700);
	--nav-border-02: var(--white-alias);
    --nav-hover: var(--neutral-gya-lt-08);
    --nav-icon-01: var(--neutral-100);
    --nav-icon-02: var(--neutral-100);
    --nav-text: var(--neutral-100);

    /* text */
    --text-body-01: var(--neutral-1000);
    --text-body-02: var(--neutral-800);
    --text-body-03: var(--neutral-600);
    --text-brand: var(--primary-500);
    --text-disabled-inverse: var(--neutral-gya-lt-24);
    --text-disabled: var(--neutral-gya-drk-24);
    --text-display: var(--neutral-1000);
    --text-error-600: var(--error-600);
    --text-error: var(--error-500);
    --text-heading: var(--neutral-1000);
    --text-info-700: var(--info-lt-700);
    --text-info: var(--info-lt-500);
    --text-inverse: var(--neutral-100);
    --text-subtitle: var(--neutral-900);
    --text-success-700: var(--success-700);
    --text-success: var(--success-500);
    --text-warning-900: var(--warning-900);
    --text-warning: var(--warning-700);

    /* icon */
    --icon-brand: var(--primary-500);
    --icon-default: var(--neutral-1000);
    --icon-disabled-inverse: var(--neutral-gya-lt-24);
    --icon-disabled: var(--neutral-gya-drk-24);
    --icon-error: var(--error-500);
    --icon-info: var(--info-lt-500);
    --icon-inverse: var(--neutral-100);
    --icon-success: var(--success-500);
    --icon-surface-brand-100: var(--primary-100);
    --icon-surface-brand-200: var(--primary-200);
    --icon-surface-default-01: var(--neutral-200);
    --icon-surface-default-02: var(--neutral-600);
    --icon-surface-default: var(--white-alias);
    --icon-surface-disabled: var(--gya-drk-08);
    --icon-surface-error-200: var(--rd-200);
    --icon-surface-info-200: var(--bl-200);
    --icon-surface-success-100: var(--success-100);
    --icon-surface-success-200: var(--success-200);
    --icon-surface-success-500: var(--success-500);
    --icon-surface-warning-200: var(--warning-200);
    --icon-warning: var(--warning-500);

    /* border */
    --border-brand-200: var(--primary-200);
    --border-brand: var(--primary-500);
    --border-default: var(--neutral-300);
    --border-disabled-inverse: var(--neutral-gya-lt-08);
    --border-disabled: var(--neutral-gya-drk-08);
    --border-diviser-inverse: var(--gy-800);
    --border-diviser: var(--neutral-200);
    --border-error-200: var(--error-200);
    --border-error: var(--error-500);
    --border-focus: var(--info-lt-500);
    --border-hover: var(--neutral-400);
    --border-info-200: var(--info-lt-200);
    --border-info: var(--info-lt-500);
    --border-inverse: var(--gy-800);
    --border-selected: var(--neutral-800);
    --border-success-200: var(--success-200);
    --border-success: var(--success-500);
    --border-warning-200: var(--warning-200);
    --border-warning: var(--warning-500);

    /* background */
    --background-de-prueba: var(--neutral-1000);
    --bg-inverse: var(--neutral-1000);
    --bg: var(--neutral-100);

    /* surface */
    --surface-brand: var(--primary-100);
    --surface-default: var(--white-alias);
    --surface-disabled-inverse: var(--neutral-gya-lt-08);
    --surface-disabled: var(--neutral-gya-drk-08);
    --surface-elevation-01: var(--white-alias);
    --surface-elevation-02: var(--neutral-100);
    --surface-elevation-03: var(--neutral-300);
    --surface-error: var(--error-100);
    --surface-hover-inverse: var(--neutral-gya-lt-08);
    --surface-hover: var(--neutral-gya-drk-08);
    --surface-info: var(--info-lt-100);
    --surface-inverse: var(--neutral-1000);
    --surface-pressed-inverse: var(--neutral-gya-lt-16);
    --surface-pressed: var(--neutral-gya-drk-16);
    --surface-selected-01: var(--info-lt-100);
    --surface-selected-02: var(--info-lt-500);
    --surface-success: var(--neutral-100);
    --surface-warning: var(--warning-100);

    /* link */
    --link-hover: var(--info-lt-400);
    --link-pressed: var(--info-drk-600);
    --link-visited: var(--info-lt-700);
    --link: var(--info-lt-500);
	--link-inverse: var(--neutral-100);
	--link-inverse-hover: var(--neutral-200);
	--link-inverse-pressed: var(--neutral-400);
	--link-inverse-visited: var(--neutral-500);

    /* overlay */
    --overlay-modal: var(--neutral-gya-drk-56);
}