/* Default theme */

:root {
    --eos-color-primary-rgb: 239, 112, 1; /* #EF7001 */
    --eos-color-primary-orange-red-rgb: 240, 78, 35; /* #F04E23 */
    --eos-color-primary-dark-rgb: 20, 34, 51; /* #142233 */
    --eos-color-primary-light-rgb: 253, 207, 166; /* #FDCFA6 */
    --eos-color-primary-active-rgb: 255, 121, 0; /* Orange #FF7900 */
    --eos-color-secondary-navy-rgb: 68, 87, 119; /* #445777 */
    --eos-color-secondary-blue-rgb: 13, 123, 180; /* #0D7BB4 */
    --eos-color-secondary-light-blue-rgb: 237, 248, 253; /* #EDF8FD */
    --eos-color-secondary-beige-rgb: 251, 237, 226; /* #FBEDE2 */
    --eos-color-secondary-blue-rgb: 10, 118, 173; /* #0A76AD */
    --eos-color-neutral-darkest-rgb: 137, 144, 153; /* #899099 */
    --eos-color-neutral-medium-rgb: 196, 200, 204; /* #C4C8CC */
    --eos-color-neutral-lightest-rgb: 243, 244, 245; /* #F3F4F5 */
    --eos-color-additional-lightest-gray-rgb: 231, 232, 234; /* #E7E8EA */
    --eos-color-additional-medium-gray-rgb: 161, 156, 156; /* #A19C9C */
    --eos-color-additional-dark-gray-rgb: 112, 112, 112; /* #707070 */
    --eos-color-body-rgb: 68, 68, 68; /* Body Color #444444 */
    --eos-color-secondary-dark-rgb: 13, 123, 180; /* #0D7BB4 */

    --eos-color-primary: rgb(var(--eos-color-primary-rgb));
    --eos-color-primary-orange-red: rgb(
        var(--eos-color-primary-orange-red-rgb)
    );
    --eos-color-primary-dark: rgb(var(--eos-color-primary-dark-rgb));
    --eos-color-primary-light: rgb(var(--eos-color-primary-light-rgb));
    --eos-color-primary-active: rgb(var(--eos-color-primary-active-rgb));
    --eos-color-secondary-navy: rgb(var(--eos-color-secondary-navy-rgb));
    --eos-color-secondary-blue: rgb(var(--eos-color-secondary-blue-rgb));
    --eos-color-secondary-light-blue: rgb(
        var(--eos-color-secondary-light-blue-rgb)
    );
    --eos-color-secondary-beige: rgb(var(--eos-color-secondary-beige-rgb));
    --eos-color-neutral-darkest: rgb(var(--eos-color-neutral-darkest-rgb));
    --eos-color-neutral-medium: rgb(var(--eos-color-neutral-medium-rgb));
    --eos-color-neutral-lightest: rgb(var(--eos-color-neutral-lightest-rgb));
    --eos-color-secondary-dark: rgb(var(--eos-color-secondary-dark-rgb));
    --eos-color-additional-lightest-gray: rgb(
        var(--eos-color-additional-lightest-gray-rgb)
    );
    --eos-color-additional-medium-gray: rgb(
        var(--eos-color-additional-medium-gray-rgb)
    );
    --eos-color-additional-dark-gray: rgb(
        var(--eos-color-additional-dark-gray-rgb)
    );

    /* New Colors from Sprint 24 */
    --eos-color-secondary-teal-rgb: 0, 169, 173; /* #00A9AD */
    --eos-color-true-black-rgb: 0, 0, 0; /* #000000 */
    --eos-color-gray1-dark-rgb: 101, 101, 101; /* #656565 */
    --eos-color-white-rgb: 255, 255, 255; /* #FFFFFF */
    --eos-color-additional-gray3-medium-rgb: 175, 175, 175; /* #AFAFAF */
    --eos-color-additional-brown-rgb: 153, 110, 36; /* #996E24 */
    --eos-color-primary-dark-orange-rgb: 219, 102, 0; /* #DB6600 */
    --eos-color-accessible-green-on-dark-rgb: 0, 155, 114; /* #009B72 */
    --eos-color-dark-yellow-rgb: 224, 141, 1; /* #E08D01 */
    --eos-color-accessible-red-on-dark-rgb: 255, 0, 51; /* #FF0033 */
    --eos-color-accessible-dark-yellow-rgb: 231, 160, 41; /* #E7A029 */
    --eos-color-accessible-burnt-orange-rgb: 178, 83, 1; /* #B25301 */
    --eos-color-accessible-secondary-blue-rgb: 8, 120, 175; /* #0878AF */
    --eos-color-accessible-med-yellow-rgb: 252, 176, 76; /* #FCB04C */
    --eos-color-placeholder-rgb: 104, 112, 120; /* #687078 */
    --eos-color-purple-rgb: 122, 86, 167; /* #7A56A7 */

    --eos-color-secondary-teal: rgb(var(--eos-color-secondary-teal-rgb));
    --eos-color-secondary-teal-light: rgb(
        var(--eos-color-secondary-teal-rgb),
        0.62
    );
    --eos-color-secondary-teal-very-light: hsl(
        from var(--eos-color-secondary-teal) calc(h + 1.61) calc(s * 0.55)
            calc(l * 94.215 / 34)
    );
    --eos-color-true-black: rgb(var(--eos-color-true-black-rgb));
    --eos-color-gray1-dark: rgb(var(--eos-color-gray1-dark-rgb));
    --eos-color-white: rgb(var(--eos-color-white-rgb));
    --eos-color-additional-gray3-medium: rgb(
        var(--eos-color-additional-gray3-medium-rgb)
    );
    --eos-color-additional-brown: rgb(var(--eos-color-additional-brown-rgb));
    --eos-color-primary-dark-orange: rgb(
        var(--eos-color-primary-dark-orange-rgb)
    );
    --eos-color-accessible-green-on-dark: rgb(
        var(--eos-color-accessible-green-on-dark-rgb)
    );
    --eos-color-dark-yellow: rgb(var(--eos-color-dark-yellow-rgb));
    --eos-color-accessible-red-on-dark: rgb(
        var(--eos-color-accessible-red-on-dark-rgb)
    );
    --eos-color-accessible-dark-yellow: rgb(
        var(--eos-color-accessible-dark-yellow-rgb)
    );
    --eos-color-accessible-burnt-orange: rgb(
        var(--eos-color-accessible-burnt-orange-rgb)
    );
    --eos-color-accessible-secondary-blue: rgb(
        var(--eos-color-accessible-secondary-blue-rgb)
    );
    --eos-color-accessible-med-yellow: rgb(
        var(--eos-color-accessible-med-yellow-rgb)
    );
    --eos-color-placeholder: rgb(var(--eos-color-placeholder-rgb));
    --eos-color-purple: rgb(var(--eos-color-purple-rgb));

    /* End Colors */

    --eos-timer-under: var(--eos-color-accessible-green-on-dark-rgb);
    --eos-timer-warning: var(--eos-color-dark-yellow);
    --eos-timer-over: var(--eos-color-accessible-red-on-dark);
    --eos-color-warning: var(--eos-color-accessible-dark-yellow)
        --eos-color-warning-dark: var(--eos-color-accessible-burnt-orange);
    --eos-color-measurable-met: var(--eos-color-success);
    --eos-color-body: rgb(var(--eos-color-body-rgb));
    --eos-color-success-rgb: 1, 128, 94; /* #01805E */
    --eos-color-success-light-rgb: 237, 247, 244; /* #EDF7F4 */
    --eos-color-info-rgb: 37, 137, 189; /* #2589BD */
    --eos-color-warning-light-rgb: 252, 242, 226; /* #FCF2E2 */
    --eos-color-danger-rgb: 196, 40, 71; /* #C42847 */
    --eos-color-danger-light-rgb: 249, 233, 236; /* #F9E9EC */
    --eos-color-success: rgb(var(--eos-color-success-rgb));
    --eos-color-success-light: rgb(var(--eos-color-success-light-rgb));
    --eos-color-info: rgb(var(--eos-color-info-rgb));
    --eos-color-warning-light: rgb(var(--eos-color-warning-light-rgb));
    --eos-color-danger: rgb(var(--eos-color-danger-rgb));
    --eos-color-danger-light: rgb(var(--eos-color-danger-light-rgb));

    /* 
	 * Action color is often same as primary, but does not have to be. A cue that an element does something,
     * e.g. action buttons.
     */
    --eos-color-action-rgb: var(--eos-color-primary-rgb);
    --eos-color-action: var(--eos-color-primary);
    --eos-header-bg: var(--eos-color-secondary-navy);
    --eos-header-text-color: var(--eos-color-white);
    --eos-header-nav-hover-bg: rgba(255, 255, 255, 0.2);
    --eos-header-avatar-bg: var(--eos-color-secondary-navy);
    --eos-header-avatar-text: rgba(255, 255, 255, 0.7);
    --eos-header-toggler-color: var(--eos-color-white);
    --eos-body-bg: var(--eos-color-white);
    --eos-footer-text: var(--eos-color-secondary-navy);
    --eos-scroll-handle-color: #bbb;
    --eos-scroll-handle-hover-color: var(--eos-color-secondary-navy);
    --eos-left-nav-bg: var(--eos-color-neutral-lightest);
    --eos-left-nav-toggler-color: var(--eos-color-secondary-blue);
    --eos-left-nav-item-icon-color: var(--eos-color-additional-dark-gray);
    --eos-left-nav-item-text-color: var(--eos-color-additional-dark-gray);
    --eos-left-nav-item-hover-icon-color: var(--eos-color-action);
    --eos-left-nav-item-hover-text-color: var(--eos-color-action);
    --eos-left-nav-item-hover-bg: transparent;
    --eos-left-nav-item-active-bg: var(--eos-color-white);
    --eos-left-nav-item-active-icon-color: var(--eos-color-white);
    --eos-left-nav-item-active-text-color: var(--eos-color-white);

    --eos-btn-primary-bg: var(--eos-color-primary);
    --eos-btn-primary-border-color: var(--eos-color-primary);
    --eos-btn-primary-text-color: var(--eos-color-white);
    --eos-btn-primary-hover-bg: var(--eos-color-primary-orange-red);
    --eos-btn-primary-hover-text-color: var(--eos-color-white);
    --eos-btn-primary-hover-border-color: var(--eos-color-primary-orange-red);
    --eos-btn-primary-disabled-bg: var(--eos-color-neutral-darkest);
    --eos-btn-primary-disabled-border-color: var(--eos-color-neutral-darkest);
    --eos-btn-primary-disabled-text-color: var(--eos-color-neutral-darkest);

    --eos-btn-secondary-bg: var(--eos-color-secondary-navy);
    --eos-btn-secondary-border-color: var(--eos-color-secondary-navy);
    --eos-btn-secondary-text-color: var(--eos-color-white);
    --eos-btn-secondary-hover-bg: var(--eos-color-primary-orange-red);
    --eos-btn-secondary-hover-text-color: var(--eos-color-white);
    --eos-btn-secondary-hover-border-color: var(--eos-color-primary-orange-red);
    --eos-btn-secondary-disabled-bg: var(--eos-color-neutral-darkest);
    --eos-btn-secondary-disabled-border-color: var(--eos-color-neutral-darkest);

    --eos-btn-text-bg: transparent;
    --eos-btn-text-border-color: transparent;
    --eos-btn-text-text-color: var(--eos-color-accessible-secondary-blue);
    --eos-btn-text-hover-text-color: var(--eos-color-primary-orange-red);
    --eos-btn-text-disabled-color: var(--eos-color-neutral-darkest);

    --eos-btn-muted-bg: transparent;
    --eos-btn-muted-border-color: transparent;
    --eos-btn-muted-text-color: var(--eos-color-accessible-secondary-blue);
    --eos-btn-muted-hover-bg: transparent;
    --eos-btn-muted-hover-text-color: var(--eos-color-primary-orange-red);
    --eos-btn-muted-hover-border-color: transparent;
    --eos-btn-muted-disabled-text-color: var(--eos-color-neutral-darkest);
    --eos-btn-muted-disabled-border-color: transparent;

    --eos-tbl-head-border-color: var(--eos-color-neutral-medium);
    --eos-tbl-action-divider-color: var(--eos-color-additional-lightest-gray);
    --eos-field-label-color: var(--eos-color-secondary-navy);
    --eos-textbox-bg: var(--eos-color-neutral-lightest);
    --eos-textbox-border-color: var(--eos-color-neutral-lightest);
    --eos-input-filled-in-color: var(--eos-color-true-black);
    --eos-tile-heading-color: var(--eos-color-secondary-navy);
    --eos-context-menu-color: var(--eos-color-secondary-blue);
    --eos-context-menu-hover-color: var(--eos-color-action);
    --eos-tab-active-color: var(--eos-color-secondary-blue);

    --eos-btn-approve-bg: var(--eos-color-accessible-green-on-dark);
    --eos-btn-approve-border-color: var(--eos-color-accessible-green-on-dark);
    --eos-btn-approve-text-color: var(--eos-color-white);
    --eos-btn-approve-hover-bg: var(--eos-btn-approve-bg);
    --eos-btn-approve-hover-text-color: var(--eos-color-white);
    --eos-btn-approve-hover-border-color: var(--eos-btn-approve-hover-bg);

    /* z-index values */
    --eos-popup-z-index: 2147483001;
    --eos-popup-panel-z-index: 2147483002;
    --eos-prompt-modal-z-index: 2147483003;
    --eos-confirm-modal-z-index: 2147483004;

    --eos-html-field-z-index: 2147483003;
    --eos-toast-z-index: 2147483003;
    --eos-tooltip-z-index: 10000000001;
}