﻿/*Variables*/
:root {
    /* Paleta de colores */
    --primary: #fbecb9;
    --primary-hover: #E4A756;
    --primary-selected: #C9601E;
    --secondary: #C7E3F9;
    --secondary-hover: #9EC7ED;
    --secondary-selected: #274A73;
    --danger: #ff8a80;
    --danger-hover: #FF1A51;
    --danger-selected: #D50000;
    --text-normal: #002B43;
    --text-hover: #EDF1F9;
    --text-selected: #FFFFFF;
    --text-disabled: #A7ABB3;
    --alert-background: var(--primary);
    --alert-color: #F2CD30;
    --danger-background: var(--danger);
    --danger-color: var(--danger-selected);
    --success-background: #D0FF99;
    --success-color: #64DD17;
    /* Fin Paleta de colores */
    /* Fuentes */
    --main-font: Roboto;
    --main-fontSize: 14px;
    --caption-fontSize: 12px;
    --header-h1-fontSize: 32px;
    --header-h1-fontWeight: bold;
    --header-h2-fontSize: 24px;
    --header-h2-fontWeight: normal;
    --header-h3-fontSize: 20px;
    --header-h3-fontWeight: normal;
    /* Fin Fuentes */
    /* PRIMARY */
    --primarycomponent-font-color: var(--text-normal);
    --primarycomponent-font-color-hover: var(--text-normal-hover);
    --primarycomponent-font-color-focus: var(--text-normal-selected);
    --primarycomponent-font-color-disabled: #a7abb3;
    --primarycomponent-font-color-active: #ffffff;
    --primary-component-background: var(--primary);
    --primary-component-background-hover: var(--primary-hover);
    --primary-component-background-active: var(--primary-hover);
    --primary-component-background-focus: var(--primary-selected);
    --primary-component-background-disabled: var(--text-hover);
    --primary-button-border-radius: var(--button-border-radius);
    /* END PRIMARY */
    /* SECONDARY */
    --secondary-button-background: #cfe5ff;
    --secondary-button-color: v#002b43;
    --secondarycomponent-font-color: #002b43;
    --secondarycomponent-font-color-hover: #002b43;
    --secondarycomponent-font-color-focus: #ffffff;
    --secondarycomponent-font-color-disabled: #a7abb3;
    --secondarycomponent-font-color-active: #ffffff;
    --secondary-component-background: #cfe5ff;
    --secondary-component-background-hover: #9acbff;
    --secondary-component-background-focus: #004878;
    --secondary-component-background-disabled: var(--text-hover);
    --secondary-button-border-radius: var(--button-border-radius);
    /* END SECONDARY */
    /* TERTIARY */
    --tertiarycomponent-font-color: var(--text-normal);
    --tertiarycomponent-font-color-hover: var(--text-normal-hover);
    --tertiarycomponent-font-color-focus: var(--text-normal-selected);
    --tertiarycomponent-font-color-disabled: var(--text-normal-disabled);
    --tertiarycomponent-font-color-active: var(--text-normal-hover);
    --tertiary-component-background: var(--primary);
    --tertiary-component-background-hover: var(--primary-hover);
    --tertiary-component-background-active: var(--primary-selected);
    --tertiary-component-background-focus: var(--primary-hover);
    --tertiary-component-background-disabled: var(--text-hover);
    --tertiary-button-border-radius: var(--button_tertiary-border-radius) !important;
    /* END TERTIARY */
    /* DANGER */
    --dangercomponent-font-color: var(--text-normal);
    --dangercomponent-font-color-hover: var(--text-normal-hover);
    --dangercomponent-font-color-focus: var(--text-normal-selected);
    --dangercomponent-font-color-disabled: #a7abb3;
    --dangercomponent-font-color-active: #ffffff;
    --danger-component-background: var(--danger);
    --danger-component-background-hover: var(--danger-hover);
    --danger-component-background-active: var(--danger-hover);
    --danger-component-background-focus: var(--danger-selected);
    --danger-component-background-disabled: var(--text-hover);
    /* END DANGER */
    /* DATATABLE */
    --dt-cell-height: 33px;
    --dt-cell-line-height: 33px;
    /* END DATATABLE */
    /* Channel Defs */
    --twitter-color: #00ACEE;
    --whatsapp-color: #00BB2D;
    --chat-color: #34a853;
    --telegram-color: #2fa4d6;
    --facebook-color: #3b5998;
    --instagram-color: #8a3ab9;
    --phone-color: #ea4335;
    --email-color: #E57368;
    --sms-color: #4fa834;
    --businessProcess-color: #000000;
    /* Fin Channel Defs */
    /* DEBERÍA QUEDAR OBSOLETO - NO ELIMINAR - NO ELIMINAR - NO ELIMINAR */
    /* Paleta `primaria*/
    --primary-first: var(--secondary-selected);
    --primary-second: #83E8FF;
    --primary-third: #FB8500;
    --primary-fourth: #FFC215;
    --primary-radius: 15px;
    --secondary-radius: 0;
    /*Paleta secundaria*/
    --secondary-first: #062F44;
    --secondary-second: #EAEADF;
    --secondary-success: #A5EF75;
    --secondary-warning: #FFF683;
    --secondary-error: #FF8888;
    /* Específicas */
    --background-color-header: var(--primary-first) /* #007ac6*/;
    --background-color-header-external: var(--secondary-second) /* #007ac6*/;
    --text-color-header: white;
    --text-color-header-external: var(--primary-first);
    /* Paleta definida remitida por Verena. Diseñada en Figma */
    --brand-NeDk: #062F44;
    --brand-PrBl: var(--secondary-selected);
    --brand-TeBl: #82E8FF;
    --brand-PrOr: #FB8500;
    --brand-SeYe: #FFC215;
    --brand-NeLi: #EAEADF;
    --pr-Blue700: #003454;
    --pr-Blue600: #00426B;
    --pr-Blue500: var(--secondary-selected);
    --pr-Blue400: #336D91;
    --pr-Blue300: #5485A3;
    --pr-Blue200: #8AABC0;
    --te-Blue700: #5DA5B5;
    --te-Blue600: #77D3E8;
    --te-Blue500: #83E8FF;
    --te-Blue400: #9CEDFF;
    --te-Blue300: #ACF0FF;
    --te-Blue200: #C6F4FF;
    --ex-Orange700: #B25E00;
    --ex-Orange600: #E47900;
    --ex-Orange500: #FB8500;
    --ex-Orange400: #FC9D33;
    --ex-Orange300: #FCAD54;
    --ex-Orange200: #FDC78A;
    --ex-Yellow700: #B58A0F;
    --ex-Yellow600: #E8B113;
    --ex-Yellow500: #FFC215;
    --ex-Yellow400: #FFCE44;
    --ex-Yellow300: #FFD662;
    --ex-Yellow200: #FFE393;
    --ex-NeDark500: #062F44;
    --ex-NeDark400: #385969;
    --ex-NeDark300: #587482;
    --ex-NeDark200: #8C9FA9;
    --ex-NeDark100: #B2BFC5;
    --ex-NeDark50: #E6EAEC;
    --success-default: #56C25C;
    --success-background: #CFF3D1;
    --success-weak: #A0E8A3;
    --success-weaker: #CFF3D1;
    --success-outline: #56C25C;
    --warning-default: #FAAC15;
    --warning-background: #FFEDB9;
    --warning-weak: #FFDA73;
    --warning-weaker: #FFEDB9;
    --warning-outline: #FAAC15;
    --danger-default: #F23838;
    --danger-background: #FFC4C4;
    --danger-weak: #FF9C9C;
    --danger-weaker: #FFC4C4;
    --danger-outline: #F23838;
    --button-border-radius: 40px;
    --button_tertiary-border-radius: 2px;
    /* END DEBERÍA QUEDAR OBSOLETO - NO ELIMINAR - NO ELIMINAR - NO ELIMINAR */
}
/*Fin Variables*/