:root {
    /* main declarations ----------------------------------------------------------------------- */
    --app--background: var(--theme--background, #f6f6fb); /* #f6f6fb or #302F36 */
    --app--color: var(--theme--color, #636169); /* #636169 or A9A7AF */
    --app-accent--color: var(--theme-accent--color, #5972f2); /*  */
    --app-error-color: var(--theme-error-color, #e43742);
    --app-brand--color: var(--theme-brand--color, #ed1c24); /*  */
    --app-brand--text-color: var(--theme-brand--text-color, #564f59); /* # 564F59 or #A095A4 */
    --app--font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif,
        'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
    --app--root-size: 16px;
    --app--medium-font-size: 0.75rem;

    --app--base-padding: 1rem;
    --app--half-padding: 0.5rem;
    --app--quoter-padding: 0.25rem;
    --app--doble-padding: 2rem;
    --app--triple-padding: 3rem;

    --app-backdrop--background: var(--theme-backdrop--background, rgba(246, 246, 251, 0.6));

    --app--z-index-max : 10000;

    /* shadows --------------------------------------------------------------------------------- */

    /* component declarations ------------------------------------------------------------------ */
    --app-header--background: transparent;
    --app-footer--background: transparent;

    --app-content-header--background: var(
        --theme-content-header--background,
        linear-gradient(180deg, rgba(246, 246, 251, 1) 0%, rgba(246, 246, 251, 0.6) 100%)
    );
    --app-content-footer--background: var(
        --theme-content-footer--background,
        linear-gradient(0deg, rgba(238, 238, 243, 1) 0%, rgba(238, 238, 243, 0.6) 100%)
    );
    --app-content-footer--radius: var(--theme-content-footer--radius);

    /*navigation*/
    --app-nav--color: var(--theme-nav--color); /* #636169 or #9B99A2 */
    --app-nav--background: var(--theme-nav--background, #efeff5); /* #efeff5 or #36363D */
    --app-nav-links--color: var(--theme-nav-links--color);
    --app-nav-link-secondary--color: var(--theme-nav-link-secondary--color);
    --app-nav-link-secondary--background: var(--theme-nav-link-secondary--background);
    --app-nav-icon--color: var(--theme-nav-icon--color, #b4b7cb);
    --app-nav-icon--font-size: 0.875rem;
    --app-nav-headers--color: var(--theme-nav-headers--color, #a3a3a3); /*  */
    --app-nav-headers--font-size: 12px; /*  */
    --app-nav-headers--height: 2rem; /*  */
    --app-nav-headers--border-color: var(--theme-nav-headers--border-color, #484848); /* #484848 */
    --app-nav-resizer--color: var(--theme-nav-resizer--color, #e2e5ff); /* #e2e5ff */
    --app-nav-box--background: transparent;
    --app-nav-box-active--background: var(
        --theme-nav-box-active--background,
        #dfe3f6
    ); /* #DFE3F6 or #43434d */
    --app-nav-box--radius: var(--theme--radius, 0.75rem); /*  */

    --app-separators: var(--theme-separators, #e4e6ef); /* #e4e6ef or #35353d */
    --app-separators-hover: var(--theme-separators-hover, #e4e6ef);

    /* assignments ----------------------------------------------------------------------------- */
    --fui-layout--font-family: var(--app--font);
    --fui-layout--font-size: var(--app--root-size);

    /*header*/
    --fui-header--padding: 0.75rem 2rem;
    --fui-header--margin: 0 0 0.5rem;
    --fui-header--background: var(--app-header--background);
    --fui-logo-sygnet--color: var(--app-brand--color);
    --fui-logo-text--color: var(--app-brand--text-color);

    /*navigation*/
    --fui-navigation-link--font-size: var(--app-nav-icon--font-size);
    --fui-navigation-link--color: var(--app-nav-links--color);
    --fui-nav--background: var(--app-nav--background);
    --fui-nav--resizer--color: var(--app-nav-resizer--color);
    --fui-nav-icon--color: var(--app-nav-icon--color);
    --fui-nav-icon-active--color: var(--app-accent--color);
    --fui-navigation-link--border-radius: var(--app-nav-box--radius);
    --fui-navigation-link--background-color: #dfe3f6;
    --fui-navigation-link-active--color: var(--app-nav-links--color); /* #d8d7e3 */
    --fui-navigation-link-active--background-color: var(--app-nav-box-active--background);
    --fui-navigation-link-secondary--color: var(--app-nav-headers--color);
    --fui-navigation-link-secondary--background-color: var(--app-nav-link-secondary--background);

    --fui-footer--background: var(--app-footer--background);

    /*navigation group*/
    --fui-navigation-group--summary--height: var(--app-nav-headers--height);
    --fui-navigation-group--summary--font-size: var(--app-nav-headers--font-size);
    --fui-navigation-group--summary--padding: var();
    --fui-navigation-group--summary--margin: var();
    --fui-navigation-group--summary--color: var(--app-nav-headers--color);
    --fui-navigation-group--summary--border: var();
    --fui-navigation-group--summary--icon-size: var();

    /*navigation group*/
    --fui-content-header--background: var(--app--background);
    --fui-content-header--border-bottom: 1px solid var(--app-separators);
    --fui-content-footer--background: var(--app-content-footer--background);
    --fui-content-footer--border-top: 1px solid #dfe0e4;

      /*-- forms  -- */

    /*table-wrapper*/
    --fui-table-wrapper_default-normal--background: var(--app--background);
    --fui-table-wrapper_default-normal--border-radius: var(--theme--radius);

    --fui-table-filters_default-normal--border-color: var(--app-separators);
    --fui-table-add-filters_default-normal--text-color: var(--app--color);
    --fui-table-filters_default-normal--background: var(--app--background);
    --fui-table-filters_default-normal--border-radius: var(--theme--radius);
    --fui-table-filters-value_default-normal--text-color: var(--app--color);
    --fui-table-filters-type_default-normal--text-color: var(--app-accent--color);
    --fui-table-filters_default-hover--border-color: var(--app-accent--color);

    --fui-table_default-normal--border-color: var(--app-separators);
    --fui-table_default-normal--text-color: var(--app--color);
    --fui-table_default-hover--background: var(--fui-input_hover_background);

    --fui-table-item_default-hover--background: var(--fui-input_background);

    /*form-section*/
    --fui-form-section--border-color: var(--app-separators);
    --fui-form-separator_color: var(--app-separators);
    --fui-form-section--border-radius: var(--theme--radius);
    --fui-form-section-hover--border-color: var(--theme-separators-hover);

    /* fudoui-blocked-reason */
    --fudoui-comp-blocked-default-normal--background: var(--app--background);

     /*input */
    --fui-input--text-color: var(--app--color); /* #555 */
    --fui-input--background: var(--theme-input--background, #ededf1); /* #fff or #35353d */
    --fui-input--border-color: transparent; /* #ccc or #494954 */
    --fui-input--border-radius: var(--theme--forms-radius, 0.5rem); /* 4px or 8px */
    --fui-input--box-shadow: none; /* inset 0 1px 1px rgba(0, 0, 0, 0.075) */
    --fui-input-hover--background: var(--theme-input-hover--background, #e7e7ec);
    --fui-input_default-focus--background: var(--theme-input-hover--background, #e7e7ec);
    --fui-input-disabled--text-color: var(
        --theme-input-disabled--text-color,
        rgba(99, 99, 114, 0.6)
    ); /* #555 */
    --fui-input-disabled--background: transparent; /* #fff */
    --fui-input-disabled--border-color: var(
        --theme-input-disabled--border-color,
        #ededf1
    ); /* #ccc or rgba(73, 73, 84, 0.7) */
    --fui-input-disabled--border-radius: 0.5rem; /* 4px */
    --fui-input-disabled--box-shadow: none; /* inset 0 1px 1px rgba(0, 0, 0, 0.075) */
    --fui-input-after-disabled--color: var(--theme-input-after-disabled--color);

    --fui-input-group-addon--background: var(--theme-input-group-addon--background);

    /* -----------------------new variables------------------------------------ */

    /*new input variables */
    --fui-input_color: var(--theme-input_color);
    --fui-input-label_color: var(--theme-input_color);
    --fui-input_background: var(--theme-input_background);
    --fui-input_border-color: var(--theme-input_border-color);
    --fui-input_border-radius: var(--theme-input_border-radius);
    --fui-input_shadow: var(--theme-input_shadow);
    --fui-input-clear-btn_background: var(--theme-input-clear-btn_background);

    --fui-input_hover_border-color: var(--theme-input_hover_border-color);
    --fui-input_hover_background: var(--theme-input_hover_background);
    --fui-input_focus_border-color: var(--theme-input_focus_border-color);
    --fui-input_focus_background: var(--theme-input_focus_background);
    --fui-input_focus_color: var(--theme-input_focus_color);
    --fui-input-clear-btn_focus_background: var(--theme-input-clear-btn_focus_background);

    --fui-input_disabled_background: var(--theme-input_disabled_background);
    --fui-input_disabled_border-color: var(--theme-input_disabled_border-color);
    --fui-input_disabled_color: var(--theme-input_disabled_color);
    --fui-input-label_disabled_color: var(--theme-input_disabled_color);

    /*new input number variables*/
    --fui-input-number_border-color: var(--theme-input_border-color);
    --fui-input-number_background: var(--theme-input_background);
    --fui-input-number_color: var(--theme-input_color);
    --fui-input-number-label_color: var(--theme-input_color);
    --fui-input-number_border-radius: var(--theme-input_border-radius);

    --fui-input-number_focus_background: var(--theme-input_focus_background);
    --fui-input-number_focus_border-color: var(--theme-input_focus_border-color);
    --fui-input-number_focus_color: var(--theme-input_focus_color);
    --fui-input-number_hover_background: var(--theme-input_hover_background);
    --fui-input-number_hover_border-color: var(--theme-input_hover_border-color);

    --fui-input-number-disabled_background: var(--theme-input_disabled_background);
    --fui-input-number-disabled_border-color: var(--theme-input_disabled_border-color);
    --fui-input-number-label-disabled_color: var(--theme-input_disabled_color);
    --fui-input-number-disabled_color: var(--theme-input_disabled_color);

    /*new button variables */
    --fui-button_color: var(--theme-button_color);
    --fui-button_border-color: var(--theme-button_color);
    --fui-button_background: transparent;
    --fui-button_border-radius: var(--theme-input_border-radius);
    --fui-button_hover_background: transparent;
    --fui-button_hover_color: var(--app-accent--color);
    --fui-button_hover_border-color: var(--app-accent--color);
    --fui-button_focus_background: transparent;
    --fui-button_focus_border-color: var(--theme-button_color);
    --fui-button_focus_color: var(--app-accent--color);

    --fui-button_action_background: var(--theme-button_action_background);
    --fui-button_action_color: var(--theme-button_action_color);
    --fui-button_action_border-color: var(--theme-button_action_background);
    --fui-button_action-hover_background: var(--theme-button_action-hover_background);
    --fui-button_action-hover_border-color: var(--theme-button_action-hover_border-color);
    --fui-button_action-focus_background: var(--theme-button_action-focus_background);
    --fui-button_action-focus_border-color: var(--theme-button_action-focus_border-color);

    --fui-button_action-light_border-color: var(--theme-button_action_background);
    --fui-button_action-light_color: var(--theme-button_action_background);
    --fui-button_action-light_hover_border-color: var(--theme-button_action-hover_border-color);
    --fui-button_action-light_hover_color: var(--theme-button_action-hover_border-color);
    --fui-button_action-light_focus_border-color: var(--theme-button_action-focus_background);
    --fui-button_action-light_focus_color: var(--theme-button_action-focus_border-color);

    --fui-button_warning_background: var(--theme-button_warning_background);
    --fui-button_warning_border-color: var(--theme-button_warning_background);
    --fui-button_warning_hover_background: var(--theme-button_warning_hover_background);

    --fui-button_disabled_color: var(--theme-button_disabled_color);
    --fui-button_disabled_border-color: var(--theme-button_disabled_border-color);
    --fui-button_disabled_background: var(--theme-button_disabled_background);

    /*new checkbox variables*/
    --fui-checkbox-marker_background: var(--app--background);
    --fui-checkbox-marker_border-color: var(--theme-input_color);
    --fui-checkbox-label_color: var(--theme-input_color);
    --fui-checkbox-marker_border-radius: var(--theme-input_border-radius);

    --fui-checkbox-tick_border-color: var(--app-accent--color);
    --fui-checkbox-marker_checked_border-color: var(--app-accent--color);
    --fui-checkbox-tick_indefinite_background: var(--app-accent--color);

    --fui-checkbox-marker_top: 0px;

    /*new radio-input variables*/
    --fui-radio-input-border-color: var(--theme-input_color);
    --fui-radio-input-bg-color: var(--app--background);
    --fui-radio-input-checked-color: var(--app-accent--color);
    --fui-radio-input-box-shadow: var(--theme--dropdown-large--shadow);
    --fui-radio-input-label-color: var(--theme-input_color);
    --fui-radio-input-disabled-color: var(--theme-input-radio_disabled_color);
    --fui-radio-input-readonly-color: var(--theme-input_readonly_color);
    --fui-radio-input-error-color: var(--app-error-color);
    --fui-radio-input-dirty-color: var(--theme-input_dirty_color);
    --fui-radio-input-hint-color: var(--theme-nav-icon--color);

    /*new selector variables*/
    --fui-selector-label_background: var(--theme-input_background);
    --fui-selector-label_border-color: var(--theme-input_border-color);
    --fui-selector-label_icon-color: var(--theme-input_color);
    --fui-selector-label_hover_background: var(--theme-input_hover_background);
    --fui-selector-label_hover_border-color: var(--theme-input_hover_border-color);
    --fui-selector-label_opened_background: var(--theme-input_focus_background);
    --fui-selector-label_opened_border-color: var(--theme-input_focus_border-color);
    --fui-selector-label_border-radius: var(--theme-input_border-radius);
    --fui-selector-options_border-radius: var(--theme-input_border-radius);
    --fui-selector-options_background: var(--theme-input_focus_background);
    --fui-selector-options_border-color: var(--theme-input_border-color);
    --fui-selector-option-item_hover_background: var(--theme-input_background);
    --fui-selector-option-item_selected_color: var(--app-accent--color);
    --fui-selector-label__icon_action_color: var(--app-accent--color);
    --fui-selector-label_action_border-color: var(--app-accent--color);
    --fui-selector-label_action_color: var(--app-accent--color);

    --fui-selector_disabled_background: var(--theme-input_disabled_background);
    --fui-selector-label_disabled_color: var(--theme-input_disabled_color);
    --fui-selector_disabled_border-color: var(--theme-input_disabled_border-color);

    /*new datepicker variables*/
    --fui-datepicker-select_background: var(--theme-input_background);
    --fui-datepicker-select_border-color: var(--theme-input_border-color);
    --fui-datepicker-select_color: var(--theme-input_color);
    --fui-datepicker-select-icon-collapse_stroke: var(--theme-input_color);
    --fui-datepicker-select_focus_background: var(--theme-input_background);
    --fui-datepicker-select_focus_border-color: var(--theme-input_focus_border-color);
    --fui-datepicker-select-dropdown_background: var(--theme-input_background);
    --fui-datepicker-select-dropdown_border-color: var(--theme-input_focus_border-color);
    --fui-datepicker-select_default-normal--border-radius: var(--theme-input_border-radius);
    --fui-datepicker-select-dropdown_border-radius: var(--theme-input_border-radius);

    --fui-datepicker-calendar-header_color: var(--theme-input_color);
    --fui-datepicker-calendar-header_background: var(--theme-input_background);
    --fui-datepicker-calendar-header-cell-btn_background: transparent;
    --fui-datepicker-calendar-header-cell-btn_border-color: var(--theme-button_color);
    --fui-datepicker-calendar-header-cell-btn_hover_border-color: var(--theme-button_action-hover_border-color);
    --fui-datepicker-calendar-header-cell-btn_hover_background: transparent;
    --fui-datepicker-calendar-header-cell-btn_border-radius: var(--theme-input_border-radius);
    --fui-datepicker-calendar-cell-btn_border-radius: var(--theme-input_border-radius);
    --fui-datepicker-calendar-cell_active_background: transparent;
    --fui-datepicker-calendar-cell_active_border-color: var(--theme-button_color);
    --fui-datepicker-calendar-cell_color: var(--theme-input_color);
    --fui-datepicker-calendar-cell_active-weekend_background: var(--fui-input_focus_background);
    --fui-datepicker-calendar-cell_active-weekend_color: var(--theme-input_color);
    --fui-datepicker-calendar-cell_active-today_background: var(--app-accent--color);
    --fui-datepicker-calendar-cell_active-today_color: var(--theme-button_action_color);
    --fui-datepicker-calendar-cell_active-today_border-color: var(--fui-input_focus_border-color);
    --fui-datepicker-calendar-cell_active_hover_border-color: var(--app-accent--color);
    --fui-datepicker-calendar-cell_active_hover_color: var(--app-accent--color);
    --fui-datepicker-calendar-cell_active-selected_border-color: var(--app-accent--color);

    /*new timepicker variables*/
    --fui-timepicker-select_background: var(--theme-input_background);
    --fui-timepicker-select_border-color: var(--theme-input_border-color);
    --fui-timepicker-select_color: var(--theme-input_color);
    --fui-timepicker-select-icon-collapse_stroke: var(--theme-input_color);
    --fui-timepicker-select_focus_background: var(--theme-input_background);
    --fui-timepicker-select_focus_border-color: var(--theme-input_focus_border-color);
    --fui-timepicker-select-dropdown_background: var(--theme-input_background);
    --fui-timepicker-select-dropdown_border-color: var(--theme-input_focus_border-color);
    --fui-timepicker-select-dropdown-list_border-color: var(--theme-input_focus_border-color);
    --fui-timepicker-select-dropdown-list-element_hover_background: var(--theme-input_hover_background);
    --fui-timepicker-select-dropdown-list-element_active_color: var(--app-accent--color);
    --fui-timepicker-select_default-normal--border-radius: var(--theme-input_border-radius);
    --fui-timepicker-select-dropdown_border-radius: var(--theme-input_border-radius);

    /*new blocked variables*/
    --fui-comp-blocked_background: var(--app--background);
    --fui-comp-blocked_color: var(--app-accent--color);
    --fui-comp-blocked_border-color: var(--fui-input_focus_border-color);

    /*new textarea variables*/

    --fui-textarea_color: var(--fui-input_color);
    --fui-textarea-label_color: var(--fui-input_color);
    --fui-textarea_background: var(--fui-input_background);
    --fui-textarea_hover_border-color: var(--fui-input_hover_border-color);
    --fui-textarea_focus_border-color: var(--app-accent--color);
    --fui-textarea_focus_background: var(--fui-input_focus_background);
    --fui-textarea_focus_color: var(--fui-input_focus_color);
    --fui-textarea_border-radius: var(--theme-input_border-radius);
    --fui-textarea-clear-btn_background: var(--fui-textarea_focus_background);
    --fui-textarea-clear-btn_border-color: var(--fui-textarea_focus_background);
    --fui-textarea-optional_background: var(--fui-textarea_background);
    --fui-textarea-optional_border-color: var(--fui-input_border-color);
    --fui-textarea-optional_color: var(--fui-textarea_color);
    --fui-textarea-optional-clear-btn_background: var(--fui-textarea_focus_background);
    --fui-textarea-optional-clear-btn_border-color: var(--fui-textarea_focus_background);
    --fui-textarea-optional_hover_border-color: var(--app-accent--color);
    --fui-textarea-optional_focus_color: var(--fui-textarea_focus_color);
    --fui-textarea-optional_focus_background: var(--fui-textarea_background);
    --fui-textarea-optional_focus_border-color: var(--app-accent--color);

    /*new table variables*/
    --fui-table_color: var(--theme-input_color);
    --fui-table_hover_background: var(--theme-input_hover_background);
    --fui-table_selected_background: var(--theme-input_focus_background);
    --fui-table_blocked_background: var(--theme-table_blocked_background);
    --fui-table_border-radius: var(--theme-input_border-radius);

    --grants_background: var(--theme-grants_background);

    --fui-modal-body--background: var(--app--background);

    /* new page-header variables */
    --fui-page-header-background: var(--app--background);
    --fui-page-header-border-bottom: 1px solid var(--app-separators);

    /* ------------------------------------------------------------ */

    /* input-number */
    --fui-input-number-label_default-normal--color: var(--app--color);
    --fui-input-number_default-hovered--background:  var(--theme-input--background, #ededf1);
    --fui-input-number_default-focus--background: var(--theme-input-hover--background, #e7e7ec);

    /* buttons */
    --fui-button--background: var(--theme-button--background, #dfe3f6);
    --fui-button-disabled--background: var(--theme-button-disabled--background, #ececf1);

    --fui-btn_default-hover--background: var(--fui-input-hover--background);
    --fui-btn_default-hover--border-color: var(--app-accent--color);
    --fui-btn_default-focus--background: var(--fui-input-hover--background);
    --fui-btn_default-focus--color: var(--app-accent--color);

    --btn-border-action: var(--app-accent--color);
    --btn-background-action: var(--app-accent--color);
    --btn-border-radius: var(--theme-button--border-radius, 0.5rem);

    --fui-btn_action-normal--background: var(--app-accent--color);
    --fui-btn_action-normal--border-color: var(--app-accent--color);
    --fui-btn_action-hover--background: var(--theme-dashlet-primary-hover--fill);
    --fui-btn_action-hover--border-color: var(--theme-dashlet-primary-hover--fill);
    --fui-btn_action-normal--color: var(--app--background);
    --fui-btn_action-focus--color: var(--app--background);
    --fui-btn_action-focus--background: var(--theme-dashlet-primary-hover--fill);

    --fui-btn_action_light-normal--color: var(--app-accent--color);
    --fui-btn_action_light-normal--border-color: var(--app-accent--color);

    --fui-btn_ghost-hover--border-color: var(--app-separators);
    --fui-btn_ghost-hover--background: transparent;

    --btn-primary-border: var(--app-accent--color);

    /* checkbox */
    --fui-checkbox-label_default-normal--color: var(--app--color);
    --fui-checbox-marker_default-normal--border-color: var(--app--color);
    --fui-checbox-marker_default-checked--border-color: var(--app--color);
    --fui-checbox-marker_default-normal--background: var(--app--background);
    --fui-checbox-marker_default-checked--border-color: var(--app-accent--color);
    --fui-checkbox-tick_default-normal--border-color: var(--app-accent--color);
    --fui-checbox-marker_default-normal--border-color: var(--app--color);
    --fui-checbox-marker_default-normal--border-radius: var(--theme-checkbox-radius);

    /* checkbox-button */
    --fui-checkbox-button-border-radius: var(--theme--forms-radius);
    --fui-checkbox-button-background-color: var(--theme-input--background, #ededf1);
    --fui-checkbox-button-border-color: var(--app-separators);
    --fui-checkbox-button-label-text-color: var(--app--color);
    --fui-checkbox-button-checked-border-color: var(--app-accent--color);
    --fui-checkbox-button-checked-background-color: var(--theme-input--background, #ededf1);
    --fui-checkbox-button-label-checked-text-color: var(--app--color);
    --fui-checkbox-button-hover-background-color: var(--theme-input-hover--background, #e7e7ec);
    --fui-checkbox-button-hover-border-color: var(--app-accent--color);

    /* radio-button */
    --fui-radio-list-divided_default-normal--text-color: var(--app-accent--color);
    --fui-radio-item_default-normal--border-radius: var(--theme--forms-radius);
    --fui-radio-item_default-normal--background: var(--theme-input--background, #ededf1);
    --fui-radio-item_default-normal--border-color: var(--app-separators);
    --fui-radio-item-label_default-normal--text-color: var(--app--color);
    --fui-radio-item_checked-normal--border-color: var(--app-accent--color);
    --fui-radio-item_checked-normal--background: var(--theme-input--background, #ededf1);
    --fui-radio-item-label_checked-normal--text-color: var(--app--color);
    --fui-radio-item_default-hover--background: var(--theme-input-hover--background, #e7e7ec);
    --fui-radio-item_default-hover--border-color: var(--app-accent--color);
    --fui-radio-item_checked-normal--border-size: 2px;

    /* selectbox */
    --fui-selectbox_default-normal--background: var(--theme-selectbox_default-normal--background);
    --fui-selectbox_default-normal--border-radius: var(--theme-selectbox_default-normal--border-radius);
    --fui-select-option_default-normal--background: var(--theme-selectbox_default-normal--background);
    --fui-selectbox-dropdown_default-normal--background: var(--theme-selectbox_default-normal--background);
    --fui-selectbox_default-normal--border-color: var(--theme-selectbox_default-normal--border-color);
    --fui-selectbox_default-active--background: var(--theme-selectbox_default-active--background);
    --fui-selectbox-dropdown_default-normal--border-color: var(--theme-selectbox_default-normal--border-color);
    --fui-selectbox-dropdown_default-normal--border-radius: var(--theme-selectbox_default-normal--border-radius);
    --fui-select-option_default-selected--text-color: var(--theme-select-option_default-selected--text-color);
    --fui-select-option_default-hover--background: var(--theme-select-option_default-hover--background);
    --fui-select-option_default-disabled--text-color: var(--theme-select-option_default-disabled--text-color);
    --fui-selectbox_default-normal--text-color: var(--app--color);
    --fui-selectbox_default-active--background: var(--theme-selectbox_default-active--background);
    --fui-selector-option-item_selected-normal--color: var(--app--color);
    --fui-selectbox-container_default-normal--color-label: var(--app--color);
    --fui-selectbox-search_default-normal--background: var(--theme-input-hover--background, #e7e7ec);
    --fui-selectbox-search_default-normal--border-color: var(--app-accent--color);
    --fui-selectbox-search_default-normal--text-color: var(--app--color);
    --fui-selectbox-search-input_default-normal--background: var(--theme-input-hover--background, #e7e7ec);

    /* selector */
    --fui-selector-label_default-normal--border-radius: var(--theme--radius);
    --fui-selector-label_default-normal--background: var(--theme-selectbox_default-normal--background);
    --fui-selector-label_default-normal--border-color: var(--app-separators);
    --fui-selector-label_default-normal--icon-color: var(--app--color);
    --fui-selector-label_default-hover--background: var(--theme-input-hover--background, #e7e7ec);
    --fui-selector-label_default-hover--border-color: var(--app-accent--color);
    --fui-selector-label_opened-normal--background: var(--theme-input-hover--background, #e7e7ec);
    --fui-selector-label_opened-normal--border-color: var(--app-accent--color);
    --fui-selector-options_default-normal--background: var(--theme-selectbox_default-normal--background);
    --fui-selector-options_default-normal--border-color: transparent;
    --fui-selector-options_default-normal--border-radius: var(--theme--radius);
    --fui-selector-option-item-hover--background: var(--theme-input-hover--background, #e7e7ec);
    --fui-selector-option-item_selected-normal--background: var(--theme-selectbox_default-normal--background);
    --fui-selector-option-item_selected-normal--color: var(--app-accent--color);


    /* multiselect */
    --fui-multiselect-default-normal--background: var(--theme-selectbox_default-normal--background);
    --fui-multiselect-default-normal--border-color: var(--theme-selectbox_default-normal--border-color);
    --fui-multiselect-default-normal--border-radius: var(--theme-selectbox_default-normal--border-radius);
    --fui-multiselect-default-normal--border-color: var(--theme-multiselect-default-normal--border-color);
    --fui-multiselect-default-normal--background: var(--theme-multiselect-default-normal--background);
    --fui-multiselect_default-active--background: var(--theme-selectbox_default-active--background);
    --fui-multiselect-dropdown-list-default-normal--background: var(--theme-input--background);
    --fui-multiselect-list-default-active--background: var(--theme-input-hover--background);
    --fui-multiselect-list-header-default-active--background: var(--theme-input--background);
    --fui-multiselect-list-default-hover--background: var(--theme-input-hover--background);
    --fui-multiselect-label-default-normal--background: var(--theme-input--background);
    --fui-multiselect-label-default-hover--background: var(--theme-input-hover--background);
    --fui-multiselect-label-default-normal--border-color: var(--app-accent--color);
    --fui-multiselect-label-default-normal--border-radius: var(
        --theme-multiselect-label-default-normal--border-radius
    );

    /* inputs */
    --control-border-radius: 0.5rem;

    /*dropdown*/
    --fui-dropdown-icon--color: var(--app-accent--color);
    --fui-dropdown--border-radius: var(--theme--radius); /* 1rem */
    --fui-dropdown--border: 1px solid transparent; /* 1px solid #ccc */
    --fui-dropdown-hover--border: 1px solid var(--app-accent--color); /* 1px solid #ccc */
    --fui-dropdown--background: transparent; /* #ececf1 or #dfe3f6 or #34343d */
    --fui-dropdown-hover--background: transparent; /* #dfe3f6 or #35353d */

    --fui-dropdown-item--color: var(--app--color);
    --fui-dropdown-item--background: transparent;
    --fui-dropdown-item--dot-color: var(--app-accent--color);
    --fui-dropdown-item-active--background: transparent;
    --fui-dropdown-item-active--border-color: var(--app-accent--color);
    --fui-dropdown-item--border-radius: var(--theme--radius);

    /*tooltip*/
    --fui-tooltip--background: var(--theme-tooltip--background);
    --fui-tooltip--font-size: var(--app--medium-font-size);
    --fui-tooltip--z-index: var(--app--z-index-max);

    /* language switcher component */
    --fui-langswitcher-normal--border-radius: var(--theme--radius);
    --fui-langswitcher-normal--text-color: var(--app--color);
    --fui-langswitcher-normal--background: var(--fui-input-hover--background);

    /* theme switcher component */
    --fui-theme-switcher--color: var(--app--color);
    --fui-theme-switcher--background: var(--app--background);
    --fui-theme-switcher--border-radius: var(--theme--radius);
    --fui-theme-switcher--box-shadow: var(--theme--dropdown-large--shadow);
    --fui-theme-switcher--bckg-light: var();
    --fui-theme-switcher--color-light: var();
    --fui-theme-switcher--bckg-dark: var();
    --fui-theme-switcher--color-dark: var();
    --fui-theme-switcher--bckg-terminal: var();
    --fui-theme-switcher--color-terminal: var();
    --fui-theme-switcher--color-set--light1: var();
    --fui-theme-switcher--color-set--light2: var();
    --fui-theme-switcher--color-set--light3: var();
    --fui-theme-switcher--color-set--light4: var();
    --fui-theme-switcher--color-set--light5: var();
    --fui-theme-switcher--color-set--light6: var();
    --fui-theme-switcher--color-set--dark1: var();
    --fui-theme-switcher--color-set--dark2: var();
    --fui-theme-switcher--color-set--dark3: var();
    --fui-theme-switcher--color-set--dark4: var();
    --fui-theme-switcher--color-set--dark5: var();
    --fui-theme-switcher--color-set--dark6: var();
    --fui-theme-switcher--color-set--terminal1: var();
    --fui-theme-switcher--color-set--terminal2: var();
    --fui-theme-switcher--color-set--terminal3: var();
    --fui-theme-switcher--color-set--terminal4: var();
    --fui-theme-switcher--color-set--terminal5: var();
    --fui-theme-switcher--color-set--terminal6: var();

    /*modals*/
    --fui-modal--background: var(--theme-modal-body--background);
    --fui-modal--color: var(--app--color);
    --fui-modal-footer--background: var(--theme-modal-footer--background);
    --fui-modal-backdrop--background: var(--theme-modal-backdrop--background);

    /*logs*/
    --fui-log-info--background: var(--theme-log-info--background);
    --fui-log-info--color: var(--theme-log-info--color);
    --fui-log-warning--background: var(--theme-log-warning--background);
    --fui-log-warning--color: var(--theme-log-warning--color);
    --fui-log-error--background: var(--theme-log-error--background);
    --fui-log-error--color: var(--theme-log-error--color);

    /*password changers*/
    --fui-password-changers-percent--background-color: var(
        --theme-password-changers-percent--background-color
    );
    --fui-password-changers-percent--text-color: var(--theme-password-changers-percent--text-color);
    --fui-password-changers-percent--border-color: var(
        --theme-password-changers-percent--border-color
    );

    /*data*/
    --fui-tabs--border-color: var(--app-separators);
    --fui-tabs--hover--row-background: var(
        --theme-tabs--hover--row-background,
        #fffdfd
    ); /* #fffdfd or 2d2c34 */

    /*dashboard*/
    --fui-dashlet--background: var(--theme-dashlet--background, #f3f3f7);
    --fui-dashlet-header--background: var(--theme-dashlet-header--background, #f3f3f7);
    --fui-dashlet-header--border: var(--theme-dashlet-header--border);
    --fui-dashlet-header--border-radius: var(--theme-dashlet-header--border-radius);
    --fui-dashlet-dark--background: var(--theme-dashlet-dark--background, #181a28);
    --fui-dashlet-dark-header--background: var(--theme-dashlet-dark-header--background);
    --fui-dashlet-dark-header--border: var(--theme-dashlet-dark--background);
    --fui-dashlet--radius: var(--theme-dashlet--radius, 0);
    --fui-dashlet-primary--fill: var(--theme-dashlet-primary--fill);
    --fui-dashlet-secondary--fill: var(--app--color);
    --fui-dashlet-primary-hover--fill: var(--theme-dashlet-primary-hover--fill);

    /* FUDOUI ------------------------ */
    /*button*/
    --fui-btn_default-normal--color: var(--app-accent--color);
    --fui-btn_default-normal--border-color: var(--app-accent--color);
    --fui-btn_default-normal--border-radius: var(--theme--forms-radius);
    /*switcher*/
    --fui-switch_default-normal--color: var(--theme-switch_default-normal--color);
    --fui-switch_default-normal--background: var(
        --theme-switch_default-normal--background,
        #d7dae2
    );
    --fui-switch-marker-canvas_default-selected--background: var(--theme-accent--color);

    /*  // FUDOUI -------------------- */
    /*textarea*/
    --fui-textarea_default-normal--color: var(--theme-textarea_default-normal--color);
    --fui-textarea_default-normal--background: var(--theme-textarea_default-normal--background);
    --fui-textarea_default-normal--border-color: var(--theme-textarea_default-normal--border-color);
    --fui-textarea-label_default-normal--color: var(--theme-textarea-label_default-normal--color);
    --fui-textarea_default-focus--background: var(--theme-textarea_default-focus--background);
    --fui-textarea_default-focus--border-color: var(--theme-textarea_default-focus--border-color);
    --fui-textarea_default-normal--border-radius: var(--theme--forms-radius);

    /*textarea-optional*/

    --fui-textarea-optional_default-normal--border-color: var(--theme-textarea_default-normal--border-color);
    --fui-textarea-optional_default-hover--border-color: var(--app-separators-hover);
    --fui-textarea-optional_default-normal--border-radius: var(--theme--forms-radius);
    --fui-textarea-optional_default-normal--color: var(--app--color);
    --fui-textarea-optional_default-normal--background: var(--theme-textarea_default-normal--background);
    --fui-textarea-input_default-normal--background: var(--theme-textarea_default-normal--background);
    --fui-textarea-optional_default-focus--background: var(--theme-textarea_default-focus--background);
    --fui-textarea-optional_default-focus--border-color: var(--theme-textarea_default-focus--border-color);

    /*input*/
    --fui-input_default-normal--background: var(--fui-input--background);
    --fui-input_default-normal--border-color: var(--fui-input--border-color);
    --fui-input_default-disabled--border-color: var(--fui-input-disabled--border-color);
    --fui-input_default-disabled--background: var(--fui-input-disabled--background);
    --fui-input_default-hover--border-color: transparent;
    --fui-input_default-normal--color: var(--fui-input--text-color);
    --fui-input-label_default-normal--color: var(--app--color);
    --fui-input_default-normal--border-radius: var(--fui-input--border-radius);
    --fui-input_default-focus--border-color: var(--app-accent--color);
    --fui-input_default-normal--shadow: var(--fui-input--box-shadow);
    /*input-number*/
    --fui-input-number_default-normal--background: var(--fui-input--background);
    --fui-input-number_default-normal--border-color: var(--fui-input--border-color);
    --fui-input-number_default-disabled--border-color: var(--fui-input-disabled--border-color);
    --fui-input-number_default-disabled--background: var(--fui-input-disabled--background);
    --fui-input-number_default-hover--border-color: transparent;
    --fui-input-number_default-normal--color: var(--fui-input--text-color);
    --fui-input-number_default-normal--border-radius: var(--fui-input--border-radius);
    --fui-input-number_default-focus--border-color: var(--app-accent--color);
    --fui-input-number_default-normal--shadow: var(--fui-input--box-shadow);

    /*card*/
    --fui-card_background: var(--theme-dashlet--background, #f3f3f7);
    --fui-card_radius: var(--theme-dashlet--radius, 0);
    --fui-card-header_background: var(--theme-dashlet-header--background, #f3f3f7);
    --fui-card-header_radius: var(--theme-dashlet-header--border-radius);

    /*FUDOUI --------------------*/
    /* others */
    --fui-ajax-backdrop-color: var(--theme-modal-backdrop--background);
    --fui-ajax-backdrop-filter: blur(1px);
    --fui-hr--border-style: 1px solid var(--app-separators); /* 1px solid #eee */

    --fui-sessions-icon--background: var(--theme-sessions-icon--background, #e5e5ec);

    --fui-dropdown--shadow: var(--theme--dropdown-large--shadow);

    --fui-control-border-dashboard-color: var(--theme-control-border-dashboard-color, transparent);

    --fui-user-chat-message--background: var(--theme-user-chat-message--background);

    --fui-panel--border-radius: var(--theme--forms-radius, 0.5rem);
    --fui-panel--background: var(--theme-panel--background);
    --fui-panel-heading--text-color: var(--app--color);
    --fui-panel-heading--background: var(--fui-input--background);
    --fui-panel-heading--border-color: var(--fui-input--border-color);
    --fui-panel-heading-hover--background: var(--fui-input-hover--background);
    --fui-panel-heading-disabled--text-color: var(--fui-input-disabled--text-color);
    --fui-panel-heading-disabled--background: var(--fui-panel--background);
    --fui-panel-heading-disabled--border-color: var(--fui-input-disabled--border-color);
    --fui-panel-replication--background: var(--fui-input--background);
    --fui-panel-replication-hover--background: var(--fui-input-hover--background);
    --fui-panel-replication--text-color: var(--fui-input--text-color);
    --fui-alert-info--text-color: var(--app--color);
    --fui-alert-info--background: var(--theme-alert-info--background);
    --fui-alert-info--border-color: transparent;
    --fui-alert-warning--text-color: var(--app--color);
    --fui-alert-warning--background: var(--theme-alert-warning--background);
    --fui-alert-warning--border-color: transparent;
    --fui-alert-error--text-color: var(--app--color);
    --fui-alert-error--background: var(--theme-alert-error--background);
    --fui-alert-error--border-color: transparent;
    --fui-alert-success--text-color: var(--app--color);
    --fui-alert-success--background: var(--theme-alert-success--background);
    --fui-alert-success--border-color: transparent;
    --fui-pre--text-color: var(--app--color);
    --fui-pre--background: var(--theme-input--background);
    --fui-pre-border-color: var(--theme-pre-border-color);
    --fui-alert--border-radius: var(--theme--forms-radius);
    --fui-app-ui--border-radius: var(--theme--forms-radius);

    --gray-light-border: var(--app-separators) !important;

    --fui-alert_default-normal--width: auto;

    --fui-progress--border-radius: var(--theme-progress--border-radius);

    --fui-span-normal--border-color: transparent;
    --fui-span-normal--background: rgba(91, 192, 222, 0.4);
    --fui-span-hover--background: rgba(91, 192, 222, 1);

    --fui-btn-primary-hover--text-color: var(--theme-btn-primary-hover--text-color);
    --fui-btn-primary-hover--border-color: var(--fui-btn-primary-hover--text-color);
    --fui-btn-default-hover--border-color: var(--fui-btn-primary-hover--text-color);

    /* fui-popover component */
    --fui-popover--color: var(--app--color);
    --fui-popover--background: var(--theme-tooltip--background);
    --fui-popover--border-radius: var(--theme--radius);
    --fui-popover--box-shadow: var(--theme--dropdown-large--shadow);
    --fui-popover--max-height: var();
    --fui-popover--padding: var();
    --fui-popover--background: var();
    --fui-popover--padding: var();
}