:root {
    --ui-base-color-grey100: #F5F5F5;
    --ui-base-color-grey200: rgb(243, 243, 243); /* bg */
    --ui-base-color-grey300: #535353;
    --ui-base-color-grey400: #cacaca;
    --ui-base-color-grey500: #999999; /* text */
    --ui-base-color-grey600: #4e4e4e;
    --ui-base-color-grey700: #e1e1e1;

    --ui-base-color-grey800: #414141;

    --ui-base-color-grey900: #373737;

    --ui-base-color-green500: #97BE0D;
    --ui-base-color-green300: #00A4A7;
    --ui-base-color-green600: #0B7338;

    --ui-base-color-orange300: #FF9759;
    --ui-base-color-orange400: #ED7902;
    --ui-base-color-orange500: #EC6607;

    --ui-base-color-red200: #D3232A;
    --ui-base-color-red400: #D22329;
    --ui-base-color-red500: #EB0000;
    --ui-base-color-red600: #CE0101;
    --ui-base-color-light-rose: rgba(235,0,0,0.1);

    --ui-base-color-white: #FFFFFF;
    --ui-base-color-black: #292222;
    --ui-base-color-black200: #000000;
    --ui-base-color-black-transparent: rgba(0, 0, 0, 0.35);
    --adv-banners-title-color: var(--ui-button-tetriary-text-color);

    --ui-avatar-cropper-initials-background: var(--ui-base-color-white);

    --ui-base-color-gray-transparent: rgba(102, 117, 126, 0.35);
    --ui-paper-button-unchecked-color: var(--ui-base-color-grey700);
    --ui-paper-button-toggled-border-background-color: var(--ui-base-color-orange400);

    --ui-color-avatar-active: var(--ui-base-color-grey400);

    --ui-color-error: var(--ui-base-color-red500);

    --ui-color-text-secondary-light: var(--ui-base-color-grey500);

    --ui-color-primary: var(--ui-base-color-black200);
    --ui-color-primary-darken: var(--ui-base-color-grey700);
    --ui-color-primary-contrast: var(--ui-color-primary);
    --ui-color-primary-lighten: var(--ui-color-primary);

    --ui-color-tetriary: var(--ui-base-color-grey400);
    --ui-color-tetriary-lighten: var(--ui-base-color-grey400);
    --ui-color-tetriary-darken: var(--ui-base-color-grey500);

    --ui-notification-error-background: var(--ui-base-color-grey200);

    --ui-color-contact-button: var(--ui-base-color-grey200);
    --ui-color-contact-button-text: var(--ui-color-primary);
    --ui-color-button-hover: var(--ui-color-primary);
    --ui-button-primary-background-hover-color: var(--ui-base-color-orange400);
    --ui-button-secondary-border-color: var(--ui-base-color-orange400);
    --ui-button-secondary-text-color: var(--ui-base-color-orange400);

    --ui-color-innova-grey: var(--ui-base-color-grey700);

    --ui-color-background: var(--ui-base-color-white);
    --ui-color-background-contrast: var(--ui-base-color-grey800);
    --ui-color-background-contrast-secondary: var(--ui-base-color-grey500);
    --ui-color-background-contrast-highlighted: var(--ui-base-color-red400);
    --ui-color-background-contrast-lighten: var(--ui-base-color-grey700);
    --ui-color-background-transparent: var(--ui-base-color-black-transparent);
    --ui-color-backdrop: var(--ui-base-color-grey400);

    --ui-card-color-surface: var(--ui-base-color-grey200);
    --ui-cost-sharing-card-surface-color: var(--ui-base-color-orange400);

    --ui-color-surface: var(--ui-base-color-grey700);
    --ui-color-surface-contrast: var(--ui-base-color-black200);
    --ui-color-surface-contrast-secondary: var(--ui-base-color-grey600);

    --ui-color-text-primary: var(--ui-color-primary);
    --ui-color-text-secondary: var(--ui-color-background-contrast);
    --ui-color-text-highlighted: var(--ui-color-background-contrast-highlighted);
    --ui-contact-preview-secondary: var(--ui-color-text-primary);
    --ui-color-event-title: var(--ui-color-text-primary);

    --ui-color-background-contrast-highlighted-premium-development: var(--ui-base-color-orange400);

    --ui-color-border: var(--ui-base-color-grey400);
    --ui-color-border-light: var(--ui-base-color-grey400);

    /* for specific elements: */
    --ui-icon-color: var(--ui-color-primary);
    --ui-icon-color-darken: var(--ui-color-primary);
    --ui-icon-color-alternative: var(--ui-base-color-orange400);
    --ui-event-text-color: var(--ui-color-text-primary);
    --ui-subtitle-color: var(--ui-color-text-primary);

    --ui-cost-sharing-card-button-color: var(--ui-base-color-white);
    --ui-cost-sharing-card-text-color: var(--ui-base-color-white);
    --ui-cost-sharing-card-date-color: var(--ui-base-color-white);
    --ui-cost-sharing-card-progress-color: var(--ui-color-text-primary);
    --ui-cost-sharing-card-progress-color-vvg: var(--ui-color-text-primary);
    --ui-cost-sharing-card-progress-color-kvg: var(--ui-color-text-primary);
    --ui-cost-sharing-card-progress-container-color: var(--ui-base-color-grey400);

    --ui-color-ripple-effect: var(--ui-base-color-gray-transparent);

    --ui-color-tips-header: var(--ui-base-color-red400);

    --ui-button-tetriary-text-color: var(--ui-color-text-highlighted);
    --ui-button-primary-hover-color: var(--ui-base-color-white);

    --ui-color-alu-button-option-iron-selected: var(--ui-button-tetriary-text-color);

    --ui-color-paper-toggle-button-checked: var(--ui-color-tetriary);

    --ui-person-view-background-color: transparent;

    --ui-person-view-background-checked-color: var(--ui-base-color-orange400);

    --ui-color-file-selector-text: var(--ui-base-color-red400);

    --ui-premium-border-color: var(--ui-base-color-grey500);

    --ui-color-contact-text: var(--ui-base-color-white);
    --ui-contact-button-icon-color: var(--ui-base-color-white);
    --ui-contact-button-icon-color-hover: var(--ui-color-primary);
    --ui-contact-button-background: var(--ui-base-color-orange400);

    --ui-insured-object-premium-background: var(--ui-base-color-white);

    --ui-unchecked-paper-toggle-button-color: var(--ui-paper-button-unchecked-color);
    --custom-date-picker-primary-color: var(--ui-base-color-orange400);

    --ui-franchise-button-background: var(--ui-base-color-grey700);
    --ui-color-heading4: var(--ui-color-surface-contrast);
    --ui-contact-phone-number: var(--ui-base-color-red200);
    --ui-avatar-background-color: var(--ui-base-color-white);
    --ui-avatar-text-color: var(--ui-base-color-orange400);
    --ui-avatar-border-color: var(--ui-base-color-black200);
    --ui-color-premium-icon: var(--ui-base-color-light-rose);
    --ui-color-premium-icon-border: transparnt;

    --ui-footer-background: var(--ui-base-color-orange400);
    --ui-color-footer-link: var(--ui-base-color-white);

    --ui-date-picker-color-background: var(--ui-base-color-orange400);

    --paper-checkbox-checked-color:  var(--ui-base-color-orange400);
    --notification-modal-button-background-color:  var(--ui-base-color-orange400);

    --ui-person-view-date-selected-color: var(--ui-base-color-white);
    --ui-person-view-name-selected-color: var(--ui-base-color-white);

    /*--ui-filter-icon-colo*/

    --ui-color-secondary-darken: var(--ui-color-text-primary);

    --ui-color-insured-product-progress-color: var(--ui-color-primary);
    --ui-color-insured-product-progress-container-color: var(--ui-base-color-grey400);

    --ui-color-burger-menu-button: var(--ui-base-color-grey300);
    --date-picker-date-item-color: var(--ui-color-surface-contrast-secondary);

    --ui-color-icon-income: var(--ui-base-color-green600);
    --ui-color-icon-outcome: var(--ui-base-color-orange500);
    --ui-radio-material-primary-color: var(--ui-base-color-black200);

    --ui-color-invoice-status-icon-open: var(--ui-base-color-orange300);
    --ui-color-invoice-status-icon-warning: var(--ui-base-color-red600);
    --ui-color-invoice-status-icon-delayed: var(--ui-icon-color);
    --ui-color-invoice-status-icon-completed: var(--ui-base-color-green600);

    --ui-tip-card-arrow-color: var(--ui-base-color-red400);

    --ui-benefits-button-hover-color: var(--ui-color-primary);
}
