/*Use https://codepen.io/sosuke/pen/Pjoqqp to generate css Filter from hex color value when generating new theme.
        using SVGs in img tags is more performant but has this downfall where you cannot directly access the fill element
        in the SVG path to alter color using a normal hex value. To keep all themeing in CSS a filter is used instead.
        Mapping reference used in this theme:
             #666666 = invert(43%) sepia(0%) saturate(1%) hue-rotate(170deg) brightness(90%) contrast(89%)
             #999999 = invert(64%) sepia(0%) saturate(21%) hue-rotate(149deg) brightness(96%) contrast(88%)
             #DD5F5F = invert(63%) sepia(21%) saturate(5569%) hue-rotate(318deg) brightness(88%) contrast(98%)
    */


:root, html[data-theme='light'] {
    --theme-primary-color: #100EA0;
    --theme-secondary-color: #657687;
    --theme-btn-primary-color: #8FA7BF;
    --theme-btn-primary-text-color: #100EA0;
    --theme-btn-primary-hover-color: #657687;
    --theme-btn-primary-disabled-color: #100EA0;
    --theme-btn-secondary-color: #100EA0;
    --theme-btn-secondary-hover-color: #657687;
    --theme-btn-secondary-disabled-color: #100EA0;
    --theme-contact-us-link-color: var(--theme-primary-color);
    --theme-link-disabled-color: #100EA0;
    --theme-body-text-color: var(--bs-body-color);
    --theme-muted-text-color: #657687;
    --theme-secondary-text-color: #100EA0;
    --theme-label-text-color: #131516;
    --theme-label-text-transform: uppercase;
    --theme-input-text-color: #131516;
    --theme-input-border-color: #657687;
    --theme-input-hint-text-color: #666666;
    --theme-input-disabled-text-color: #8FA7BF;
    --theme-input-disabled-border-color: #8FA7BF;
    --theme-input-disabled-background-color: #FFFFFF;
    --theme-input-background-color: #FFFFFF;
    --theme-error-message-input-border-color: #DD5F5F;
    --theme-error-message-color-filter: invert(63%) sepia(21%) saturate(5569%) hue-rotate(318deg) brightness(88%) contrast(98%);
    --theme-input-icon-color-filter: invert(4%) sepia(5%) saturate(1650%) hue-rotate(155deg) brightness(93%) contrast(91%);
    --theme-input-icon-disabled-color-filter: invert(13%) sepia(52%) saturate(6757%) hue-rotate(244deg) brightness(74%) contrast(121%);
    --theme-font-family: 'Work Sans';
    --theme-scrollbar-color: #657687;
    --theme-body-background-color: #C9E4FF;
    --theme-hero-background-color: #FFFFFF;
    --theme-hero-text-color: #657687;
    --theme-hero-link-hover: #657687; /*should match secondary color UNLESS hero background is secondary color*/

    --theme-header-row-background-color: #FFFFFF;
    --theme-header-row-text-color: #100EA0;
    --theme-status-tag-background-color: #8FA7BF;
    --theme-navbar-background-color: #FFFFFF;
    --theme-card-background-color: #FFFFFF;
    --theme-card-text-color: #100EA0;
    --theme-list-group-text-color: #212529;
    --theme-list-selected-border-color: #FFFFFF;
    --theme-list-selected-text-color: #100EA0;
    --theme-global-footer-color: #131516;
    --theme-policy-footer-color: #131516;
    /*Logo*/
    --theme-logo-image-path: url(../images/logos/C0047-LightDark.svg);
}