/** Generated by the DevExpress ThemeBuilder
* Version: 23.2.6
* http://js.devexpress.com/ThemeBuilder/
*/

.dx-theme-generic-typography {
    background-color: var(--gr-typography-bg);
    color: var(--gr-typography-color);
    font-family: var(--gr-typography-font-family);
}

    .dx-theme-generic-typography input,
    .dx-theme-generic-typography textarea {
        font-family: var(--gr-typography-font-family);
    }

    .dx-theme-generic-typography a {
        color: var(--gr-typography-link-color);
    }

.dx-widget {
    color: var(--gr-typography-color);
    font-family: var(--gr-typography-font-family);
}

    .dx-widget input,
    .dx-widget textarea {
        font-family: var(--gr-typography-font-family);
    }

.dx-surface {
    background-color: var(--gr-base-bg);
}

.dx-card {
    background-color: var(--gr-base-bg);
    border-color: var(--gr-base-border-color);
}

.dx-field-label {
    color: var(--gr-field-label-color);
}

.dx-field {
    color: var(--gr-fieldset-field-label-color);
    font-family: var(--gr-base-font-family);
}

    .dx-field input,
    .dx-field textarea {
        font-family: var(--gr-base-font-family);
    }

.dx-field-value.dx-attention {
    color: var(--gr-fieldset-field-value-invalid-color);
}

    .dx-field-value.dx-attention::before {
        background-color: var(--gr-fieldset-field-value-invalid-color);
        color: var(--gr-typography-bg);
    }

.dx-theme-accent-as-text-color {
    color: var(--gr-base-accent) !important;
}

.dx-theme-text-color {
    color: var(--gr-base-text-color) !important;
}

.dx-theme-background-color-as-text-color {
    color: var(--gr-base-bg) !important;
}

.dx-theme-border-color-as-text-color {
    color: var(--gr-base-border-color) !important;
}

.dx-theme-accent-as-background-color {
    background-color: var(--gr-base-accent) !important;
    fill: var(--gr-base-accent) !important;
}

.dx-theme-text-color-as-background-color {
    background-color: var(--gr-base-text-color) !important;
    fill: var(--gr-base-text-color) !important;
}

.dx-theme-background-color {
    background-color: var(--gr-base-bg) !important;
    fill: var(--gr-base-bg) !important;
}

.dx-theme-typography-background-color {
    background-color: var(--gr-typography-bg) !important;
}

.dx-theme-border-color-as-background-color {
    background-color: var(--gr-base-border-color) !important;
    fill: var(--gr-base-border-color) !important;
}

.dx-theme-accent-as-border-color {
    border-color: var(--gr-base-accent) !important;
}

.dx-theme-text-color-as-border-color {
    border-color: var(--gr-base-text-color) !important;
}

.dx-theme-background-color-as-border-color {
    border-color: var(--gr-base-bg) !important;
}

.dx-theme-border-color {
    border-color: var(--gr-base-border-color) !important;
}

.dx-button-mode-contained {
    background-color: var(--gr-button-normal-bg);
    border-color: var(--gr-button-normal-border-color);
    color: var(--gr-button-normal-color);
}

    .dx-button-mode-contained .dx-icon {
        color: var(--gr-button-normal-color);
    }

    .dx-button-mode-contained.dx-state-selected {
        background-color: var(--gr-button-normal-contained-bg-selected);
    }

    .dx-button-mode-contained.dx-state-hover {
        background-color: var(--gr-button-normal-contained-bg-hover);
    }

    .dx-button-mode-contained.dx-state-focused {
        background-color: var(--gr-button-normal-contained-bg-focused);
    }

    .dx-button-mode-contained.dx-state-active {
        background-color: var(--gr-button-normal-contained-bg-active);
        color: var(--gr-button-normal-color);
    }

    .dx-button-mode-contained.dx-button-danger {
        background-color: var(--gr-button-danger-bg);
        color: var(--gr-button-danger-color);
    }

        .dx-button-mode-contained.dx-button-danger .dx-icon {
            color: var(--gr-button-danger-color);
        }

        .dx-button-mode-contained.dx-button-danger.dx-state-selected {
            background-color: var(--gr-button-danger-contained-bg-selected);
        }

        .dx-button-mode-contained.dx-button-danger.dx-state-hover {
            background-color: var(--gr-button-danger-contained-bg-hover);
        }

        .dx-button-mode-contained.dx-button-danger.dx-state-focused {
            background-color: var(--gr-button-danger-contained-bg-focused);
        }

        .dx-button-mode-contained.dx-button-danger.dx-state-active {
            background-color: var(--gr-button-danger-contained-bg-active);
            color: var(--gr-button-danger-color);
        }

    .dx-button-mode-contained.dx-button-success {
        background-color: var(--gr-button-success-bg);
        color: var(--gr-button-success-color);
    }

        .dx-button-mode-contained.dx-button-success .dx-icon {
            color: var(--gr-button-success-color);
        }

        .dx-button-mode-contained.dx-button-success.dx-state-selected {
            background-color: var(--gr-button-success-contained-bg-selected);
        }

        .dx-button-mode-contained.dx-button-success.dx-state-hover {
            background-color: var(--gr-button-success-contained-bg-hover);
        }

        .dx-button-mode-contained.dx-button-success.dx-state-focused {
            background-color: var(--gr-button-success-contained-bg-focused);
        }

        .dx-button-mode-contained.dx-button-success.dx-state-active {
            background-color: var(--gr-button-success-contained-bg-active);
            color: var(--gr-button-success-color);
        }

    .dx-button-mode-contained.dx-button-default {
        background-color: var(--gr-button-default-bg);
        color: var(--gr-button-default-color);
    }

        .dx-button-mode-contained.dx-button-default .dx-icon {
            color: var(--gr-button-default-color);
        }

        .dx-button-mode-contained.dx-button-default.dx-state-selected {
            background-color: var(--gr-button-default-contained-bg-selected);
        }

        .dx-button-mode-contained.dx-button-default.dx-state-hover {
            background-color: var(--gr-button-default-contained-bg-hover);
        }

        .dx-button-mode-contained.dx-button-default.dx-state-focused {
            background-color: var(--gr-button-default-contained-bg-focused);
        }

        .dx-button-mode-contained.dx-button-default.dx-state-active {
            background-color: var(--gr-button-default-contained-bg-active);
            color: var(--gr-button-default-color);
        }

.dx-button-mode-outlined {
    border-color: var(--gr-button-normal-border-color);
    color: var(--gr-button-normal-color);
}

    .dx-button-mode-outlined .dx-icon {
        color: var(--gr-button-normal-color);
    }

    .dx-button-mode-outlined.dx-state-active {
        color: var(--gr-button-normal-color);
    }

    .dx-button-mode-outlined.dx-button-danger {
        background-color: transparent;
        border-color: var(--gr-button-danger-border-color);
        color: var(--gr-button-danger-border-color);
    }

        .dx-button-mode-outlined.dx-button-danger .dx-icon {
            color: var(--gr-button-danger-border-color);
        }

        .dx-button-mode-outlined.dx-button-danger.dx-state-selected {
            background-color: var(--gr-button-danger-outlined-bg-selected);
        }

        .dx-button-mode-outlined.dx-button-danger.dx-state-focused,
        .dx-button-mode-outlined.dx-button-danger.dx-state-hover {
            background-color: var(--gr-button-danger-outlined-bg-hover);
        }

        .dx-button-mode-outlined.dx-button-danger.dx-state-active {
            background-color: var(--gr-button-danger-outlined-bg-active);
            color: var(--gr-button-danger-border-color);
        }

    .dx-button-mode-outlined.dx-button-success {
        background-color: transparent;
        border-color: var(--gr-button-success-border-color);
        color: var(--gr-button-success-border-color);
    }

        .dx-button-mode-outlined.dx-button-success .dx-icon {
            color: var(--gr-button-success-border-color);
        }

        .dx-button-mode-outlined.dx-button-success.dx-state-selected {
            background-color: var(--gr-button-success-contained-bg-selected);
        }

        .dx-button-mode-outlined.dx-button-success.dx-state-focused,
        .dx-button-mode-outlined.dx-button-success.dx-state-hover {
            background-color: var(--gr-button-success-outlined-bg-focused);
        }

        .dx-button-mode-outlined.dx-button-success.dx-state-active {
            background-color: var(--gr-button-success-outlined-bg-active);
            color: var(--gr-button-success-border-color);
        }

    .dx-button-mode-outlined.dx-button-default {
        border-color: var(--gr-button-default-border-color);
        color: var(--gr-button-default-border-color);
    }

        .dx-button-mode-outlined.dx-button-default .dx-icon {
            color: var(--gr-button-default-border-color);
        }

        .dx-button-mode-outlined.dx-button-default.dx-state-selected {
            background-color: var(--gr-button-default-outlined-bg-selected);
        }

        .dx-button-mode-outlined.dx-button-default.dx-state-focused,
        .dx-button-mode-outlined.dx-button-default.dx-state-hover {
            background-color: var(--gr-button-default-outlined-bg-focused);
        }

        .dx-button-mode-outlined.dx-button-default.dx-state-active {
            background-color: var(--gr-button-default-outlined-bg-active);
            color: var(--gr-button-default-border-color);
        }

.dx-button-mode-text {
    color: var(--gr-button-normal-color);
}

    .dx-button-mode-text .dx-icon {
        color: var(--gr-button-normal-color);
    }

    .dx-button-mode-text.dx-state-selected {
        background-color: var(--gr-button-normal-text-bg-selected);
    }

    .dx-button-mode-text.dx-state-hover {
        background-color: var(--gr-button-normal-text-bg-hover);
    }

    .dx-button-mode-text.dx-state-focused {
        background-color: var(--gr-button-normal-text-bg-focused);
    }

    .dx-button-mode-text.dx-state-active {
        background-color: var(--gr-button-normal-text-bg-active);
        color: var(--gr-button-normal-color);
    }

    .dx-button-mode-text.dx-button-danger {
        color: var(--gr-button-danger-border-color);
    }

        .dx-button-mode-text.dx-button-danger .dx-icon {
            color: var(--gr-button-danger-border-color);
        }

        .dx-button-mode-text.dx-button-danger.dx-state-selected {
            background-color: var(--gr-button-danger-text-bg-selected);
        }

        .dx-button-mode-text.dx-button-danger.dx-state-focused,
        .dx-button-mode-text.dx-button-danger.dx-state-hover {
            background-color: var(--gr-button-danger-text-bg-focused);
        }

        .dx-button-mode-text.dx-button-danger.dx-state-active {
            background-color: var(--gr-button-danger-text-bg-active);
            color: var(--gr-button-danger-border-color);
        }

    .dx-button-mode-text.dx-button-success {
        color: var(--gr-button-success-border-color);
    }

        .dx-button-mode-text.dx-button-success .dx-icon {
            color: var(--gr-button-success-border-color);
        }

        .dx-button-mode-text.dx-button-success.dx-state-selected {
            background-color: var(--gr-button-success-text-bg-selected);
        }

        .dx-button-mode-text.dx-button-success.dx-state-focused,
        .dx-button-mode-text.dx-button-success.dx-state-hover {
            background-color: var(--gr-button-success-text-bg-focused);
        }

        .dx-button-mode-text.dx-button-success.dx-state-active {
            background-color: var(--gr-button-success-text-bg-active);
            color: var(--gr-button-success-border-color);
        }

    .dx-button-mode-text.dx-button-default {
        color: var(--gr-button-default-border-color);
    }

        .dx-button-mode-text.dx-button-default .dx-icon {
            color: var(--gr-button-default-border-color);
        }

        .dx-button-mode-text.dx-button-default.dx-state-selected {
            background-color: var(--gr-button-default-text-bg-selected);
        }

        .dx-button-mode-text.dx-button-default.dx-state-focused,
        .dx-button-mode-text.dx-button-default.dx-state-hover {
            background-color: var(--gr-button-default-text-bg-focused);
        }

        .dx-button-mode-text.dx-button-default.dx-state-active {
            background-color: var(--gr-button-default-text-bg-active);
            color: var(--gr-button-default-border-color);
        }

.dx-checkbox.dx-state-readonly .dx-checkbox-icon {
    border-color: var(--gr-checkbox-readonly-border-color);
    background-color: var(--gr-checkbox-readonly-bg);
}

.dx-checkbox.dx-state-hover .dx-checkbox-icon {
    border: 1px solid var(--gr-checkbox-hover-border-color);
}

.dx-checkbox.dx-state-focused .dx-checkbox-icon {
    border: 1px solid var(--gr-checkbox-border-color-focused);
}

.dx-checkbox.dx-state-active .dx-checkbox-icon {
    background-color: var(--gr-checkbox-active-icon-bg);
}

.dx-checkbox-icon {
    border: 1px solid var(--gr-checkbox-border-color);
    background-color: var(--gr-checkbox-bg);
}

.dx-checkbox-checked .dx-checkbox-icon {
    color: var(--gr-checkbox-checked-color);
}


.dx-checkbox-indeterminate .dx-checkbox-icon {
    color: var(--gr-checkbox-indeterminate-bg);
}

    .dx-checkbox-indeterminate .dx-checkbox-icon::before {
        background-color: var(--gr-checkbox-checked-color);
    }

.dx-invalid .dx-checkbox-container .dx-checkbox-icon {
    border: 1px solid var(--gr-checkbox-invalid-faded-border-color);
}

.dx-invalid.dx-state-focused .dx-checkbox-container .dx-checkbox-icon {
    border-color: var(--gr-checkbox-invalid-focused-border-color);
}

.dx-switch-container {
    border: 1px solid var(--gr-switch-border-color);
    background: var(--gr-switch-bg);
}

.dx-switch.dx-state-readonly .dx-switch-container {
    border-color: var(--gr-switch-readonly-border-color);
    background-color: var(--gr-switch-container-readonly-bg);
}

.dx-switch.dx-state-active .dx-switch-handle::before {
    background-color: var(--gr-switch-handle-active-bg);
}

.dx-switch.dx-state-active .dx-switch-container {
    border-color: var(--gr-switch-active-border-color);
    background-color: var(--gr-switch-container-active-bg);
}

.dx-switch.dx-state-hover .dx-switch-handle::before {
    background-color: var(--gr-switch-handle-bg);
}

.dx-switch.dx-state-hover .dx-switch-container {
    background-color: var(--gr-switch-hover-bg);
    border-color: var(--gr-switch-hover-border-color);
}

.dx-switch.dx-state-focused .dx-switch-container {
    border-color: var(--gr-switch-focused-border-color);
}

.dx-switch.dx-state-focused .dx-switch-handle::before {
    background-color: var(--gr-switch-handle-bg);
}

.dx-switch.dx-state-focused.dx-state-active .dx-switch-handle::before {
    background-color: var(--gr-switch-handle-active-bg);
}

.dx-switch-off {
    color: var(--gr-switch-off-color);
}

.dx-switch-on {
    color: var(--gr-switch-on-color);
}

.dx-switch-handle::before {
    background-color: var(--gr-switch-handle-off-bg);
}

.dx-switch-on-value .dx-switch-handle::before {
    background-color: var(--gr-switch-handle-bg);
}


.dx-invalid.dx-switch .dx-switch-container {
    border-color: var(--gr-base-invalid-faded-border-color);
}

.dx-invalid.dx-state-focused .dx-switch-container,
.dx-invalid.dx-state-hover .dx-switch-container {
    border-color: var(--gr-base-invalid-color);
}

.dx-invalid.dx-state-focused .dx-switch-handle::before,
.dx-invalid.dx-state-hover .dx-switch-handle::before,
.dx-invalid.dx-switch-on-value .dx-switch-handle::before {
    background-color: var(--gr-base-invalid-color);
}

.dx-invalid .dx-switch-handle::before {
    background-color: var(--gr-base-invalid-faded-border-color);
}

.dx-tabs-wrapper {
    background-color: var(--gr-tabs-tab-bg);
}

.dx-tab {
    background-color: var(--gr-tabs-tab-bg);
    color: var(--gr-tabs-tab-color);
}

    .dx-tab.dx-state-hover {
        background-color: var(--gr-tabs-tab-hover-bg);
    }

    .dx-tab.dx-tab-selected {
        background-color: var(--gr-tabs-tab-selected-bg);
        color: var(--gr-tabs-tab-selected-color);
    }

        .dx-tab.dx-tab-selected .dx-icon,
        .dx-tab.dx-tab-selected .dx-tab-text {
            color: var(--gr-tabs-tab-icon-color);
        }

    .dx-tab.dx-state-active {
        background-color: var(--gr-tabs-tab-active-bg);
        color: var(--gr-tabs-tab-selected-color);
    }

        .dx-tab.dx-state-active .dx-icon,
        .dx-tab.dx-state-active .dx-tab-text {
            color: var(--gr-tabs-tab-active-bg);
        }

    .dx-tab .dx-icon {
        color: var(--gr-tabs-tab-icon-selected-color);
    }

.dx-tabs {
    color: var(--gr-tabs-border-color);
}

.dx-tabs-nav-button {
    background-color: var(--gr-tabs-tab-bg);
    color: var(--gr-tabs-border-color);
    border-color: var(--gr-tabs-border-color);
}

    .dx-tabs-nav-button.dx-state-active {
        background-color: var(--gr-tabs-tab-active-bg);
    }

        .dx-tabs-nav-button.dx-state-active .dx-icon {
            color: var(--gr-tabs-tab-selected-color);
        }


    .dx-tabs-nav-button.dx-state-hover {
        background-color: var(--gr-tabs-tab-hover-bg);
    }

.dx-tabs-vertical .dx-tabs-nav-button {
    border-color: var(--gr-tabs-border-color);
}

    .dx-tabs-vertical .dx-tabs-nav-button.dx-tabs-nav-button-left {
        border-right: 1px solid var(--gr-tabs-border-color);
    }

    .dx-tabs-vertical .dx-tabs-nav-button.dx-tabs-nav-button-right {
        border-left: 1px solid var(--gr-tabs-border-color);
    }

.dx-overlay-wrapper {
    color: var(--gr-typography-color);
    font-family: var(--gr-base-font-family);
}

.dx-overlay-shader {
    background-color: var(--gr-overlay-shader-bg);
}

.dx-overlay-wrapper input,
.dx-overlay-wrapper textarea {
    font-family: var(--gr-base-font-family);
}

.dx-validationsummary-item {
    color: var(--gr-validation-summary-color);
}

.dx-invalid-message > .dx-overlay-content {
    color: var(--gr-validation-message-color);
    background-color: var(--gr-validation-message-background-color);
}

.dx-placeholder {
    color: var(--gr-texteditor-placeholder-color);
}

.dx-texteditor.dx-editor-outlined {
    background: var(--gr-texteditor-bg);
    border: 1px solid var(--gr-texteditor-border-color);
}

.dx-texteditor.dx-editor-underlined {
    border-bottom: 1px solid var(--gr-texteditor-border-color);
}

.dx-texteditor.dx-editor-filled {
    background: var(--gr-texteditor-filled-bg);
}

.dx-texteditor.dx-state-readonly.dx-editor-filled {
    background-color: var(--gr-texteditor-filled-readonly-bg)
}

    .dx-texteditor.dx-state-readonly.dx-editor-filled.dx-state-focused {
        background-color: var(--gr-texteditor-filled-readonly-focused-bg);
    }

    .dx-texteditor.dx-state-readonly.dx-editor-filled.dx-state-hover {
        background-color: var(--gr-texteditor-filled-hover-bg);
    }

.dx-texteditor.dx-state-hover {
    border-color: var(--gr-texteditor-hover-border-color);
}

    .dx-texteditor.dx-state-hover.dx-editor-filled {
        background-color: var(--gr-texteditor-filled-hover-bg);
    }

    .dx-texteditor.dx-state-hover.dx-invalid.dx-editor-filled,
    .dx-texteditor.dx-state-hover.dx-invalid.dx-editor-outlined {
        border-color: var(--gr-base-invalid-color);
    }

.dx-texteditor.dx-state-focused .dx-texteditor-label {
    color: var(--gr-base-accent);
}

.dx-texteditor.dx-state-focused.dx-invalid .dx-texteditor-label {
    color: var(--gr-base-invalid-color);
}

.dx-texteditor.dx-texteditor-label-outside .dx-texteditor-label {
    color: var(--gr-base-text-color);
}

.dx-texteditor.dx-texteditor-label-outside.dx-invalid .dx-texteditor-label {
    color: var(--gr-base-invalid-color);
}

.dx-texteditor.dx-state-active.dx-editor-filled,
.dx-texteditor.dx-state-active.dx-editor-outlined,
.dx-texteditor.dx-state-active.dx-editor-underlined,
.dx-texteditor.dx-state-focused.dx-editor-filled,
.dx-texteditor.dx-state-focused.dx-editor-outlined,
.dx-texteditor.dx-state-focused.dx-editor-underlined {
    border-color: var(--gr-texteditor-focused-border-color);
}

.dx-show-clear-button .dx-icon-clear {
    color: var(--gr-texteditor-button-clear-icon-color);
}

.dx-texteditor-input {
    color: var(--gr-texteditor-color);
}

.dx-texteditor-label {
    color: var(--gr-texteditor-label-color);
}

.dx-invalid .dx-texteditor-label {
    color: var(--gr-base-invalid-color);
}

.dx-editor-outlined .dx-label {
    border-top-color: var(--gr-texteditor-border-color);
    border-bottom-color: var(--gr-texteditor-border-color);
}

.dx-editor-outlined .dx-label-before {
    border-top-color: var(--gr-texteditor-border-color);
    border-bottom-color: var(--gr-texteditor-border-color);
    border-inline-start-color: var(--gr-texteditor-border-color);
}

.dx-editor-outlined .dx-label-after {
    border-top-color: var(--gr-texteditor-border-color);
    border-bottom-color: var(--gr-texteditor-border-color);
    border-inline-end-color: var(--gr-texteditor-border-color);
}

.dx-editor-outlined.dx-texteditor-with-floating-label.dx-daterangebox .dx-label::before,
.dx-editor-outlined.dx-texteditor-with-label:not(.dx-texteditor-label-outside).dx-daterangebox .dx-label::before {
    background-color: var(--gr-base-bg);
}

.dx-editor-outlined.dx-texteditor-with-floating-label.dx-state-readonly .dx-label,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-state-readonly .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-state-readonly .dx-label-before,
.dx-editor-outlined.dx-texteditor-with-label.dx-state-readonly .dx-label,
.dx-editor-outlined.dx-texteditor-with-label.dx-state-readonly .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-label.dx-state-readonly .dx-label-before {
    border-color: var(--gr-texteditor-readonly-border-color);
}

.dx-editor-outlined.dx-texteditor-with-floating-label.dx-state-disabled .dx-label,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-state-disabled .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-state-disabled .dx-label-before,
.dx-editor-outlined.dx-texteditor-with-label.dx-state-disabled .dx-label,
.dx-editor-outlined.dx-texteditor-with-label.dx-state-disabled .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-label.dx-state-disabled .dx-label-before {
    border-color: var(--gr-texteditor-disabled-border-color);
    border-bottom-color: var(--gr-texteditor-disabled-border-color);
}

.dx-editor-outlined.dx-texteditor-with-floating-label.dx-invalid .dx-label,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-invalid .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-invalid .dx-label-before,
.dx-editor-outlined.dx-texteditor-with-label.dx-invalid .dx-label,
.dx-editor-outlined.dx-texteditor-with-label.dx-invalid .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-label.dx-invalid .dx-label-before {
    border-color: var(--gr-texteditor-invalid-faded-border-color);
    border-bottom-color: var(--gr-texteditor-invalid-faded-border-color);
}

.dx-editor-outlined.dx-texteditor-with-floating-label.dx-invalid.dx-state-focused .dx-label,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-invalid.dx-state-focused .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-invalid.dx-state-focused .dx-label-before,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-invalid.dx-state-hover .dx-label,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-invalid.dx-state-hover .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-invalid.dx-state-hover .dx-label-before,
.dx-editor-outlined.dx-texteditor-with-label.dx-invalid.dx-state-focused .dx-label,
.dx-editor-outlined.dx-texteditor-with-label.dx-invalid.dx-state-focused .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-label.dx-invalid.dx-state-focused .dx-label-before,
.dx-editor-outlined.dx-texteditor-with-label.dx-invalid.dx-state-hover .dx-label,
.dx-editor-outlined.dx-texteditor-with-label.dx-invalid.dx-state-hover .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-label.dx-invalid.dx-state-hover .dx-label-before {
    border-color: var(--gr-texteditor-invalid-focused-border-color);
}

.dx-editor-outlined.dx-texteditor-with-floating-label.dx-state-hover .dx-label,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-state-hover .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-state-hover .dx-label-before,
.dx-editor-outlined.dx-texteditor-with-label.dx-state-hover .dx-label,
.dx-editor-outlined.dx-texteditor-with-label.dx-state-hover .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-label.dx-state-hover .dx-label-before {
    border-color: var(--gr-texteditor-hover-border-color);
    border-bottom-color: var(--gr-texteditor-hover-border-color);
}

.dx-editor-outlined.dx-texteditor-with-floating-label.dx-state-focused .dx-label,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-state-focused .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-state-focused .dx-label-before,
.dx-editor-outlined.dx-texteditor-with-label.dx-state-focused .dx-label,
.dx-editor-outlined.dx-texteditor-with-label.dx-state-focused .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-label.dx-state-focused .dx-label-before {
    border-color: var(--gr-texteditor-focused-border-color);
}

.dx-editor-outlined.dx-texteditor-with-floating-label.dx-texteditor-empty.dx-dropdowneditor-active .dx-label::before,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-texteditor-empty.dx-state-focused .dx-label::before {
    background-color: var(--gr-base-bg);
}

.dx-invalid.dx-texteditor {
    border-color: var(--gr-texteditor-invalid-faded-border-color);
}

    .dx-invalid.dx-texteditor.dx-editor-filled.dx-state-focused,
    .dx-invalid.dx-texteditor.dx-editor-filled.dx-state-hover,
    .dx-invalid.dx-texteditor.dx-editor-outlined.dx-state-focused,
    .dx-invalid.dx-texteditor.dx-editor-outlined.dx-state-hover,
    .dx-invalid.dx-texteditor.dx-editor-underlined.dx-state-focused,
    .dx-invalid.dx-texteditor.dx-editor-underlined.dx-state-hover {
        border-color: var(--gr-texteditor-invalid-focused-border-color);
    }

    .dx-invalid.dx-texteditor.dx-editor-filled.dx-show-invalid-badge .dx-texteditor-input-container::after,
    .dx-invalid.dx-texteditor.dx-editor-outlined.dx-show-invalid-badge .dx-texteditor-input-container::after,
    .dx-invalid.dx-texteditor.dx-editor-underlined.dx-show-invalid-badge .dx-texteditor-input-container::after {
        background-color: var(--gr-base-danger);
        color: var(--gr-base-inverted-text-color);
    }

    .dx-invalid.dx-texteditor.dx-editor-filled {
        background-color: var(--gr-texteditor-filled-invalid-background);
    }

.dx-valid.dx-texteditor.dx-editor-filled .dx-texteditor-input-container::after,
.dx-valid.dx-texteditor.dx-editor-outlined .dx-texteditor-input-container::after,
.dx-valid.dx-texteditor.dx-editor-underlined .dx-texteditor-input-container::after {
    color: var(--gr-base-success);
}

.dx-searchbox .dx-icon-search {
    color: var(--gr-textbox-search-icon-color);
}

    .dx-searchbox .dx-icon-search::before {
        color: var(--gr-textbox-search-icon-color);
    }

.dx-dropdowneditor-icon {
    color: var(--gr-dropdowneditor-icon-color);
}

.dx-dropdowneditor.dx-state-active .dx-dropdowneditor-icon,
.dx-dropdowneditor.dx-state-hover:not(.dx-custom-button-hovered) .dx-dropdowneditor-icon {
    background-color: var(--gr-dropdowneditor-button-hover-bg);
}

.dx-editor-filled.dx-dropdowneditor.dx-state-active .dx-dropdowneditor-icon,
.dx-editor-filled.dx-dropdowneditor.dx-state-hover:not(.dx-custom-button-hovered) .dx-dropdowneditor-icon {
    background-color: var(--gr-dropdowneditor-filled-button-active-bg);
}

.dx-dropdowneditor-button.dx-state-active .dx-dropdowneditor-icon,
.dx-dropdowneditor.dx-dropdowneditor-active .dx-dropdowneditor-icon {
    background-color: var(--gr-dropdowneditor-button-active-bg);
    color: var(--gr-dropdowneditor-icon-active-color);
}

.dx-editor-filled .dx-dropdowneditor-button.dx-state-active .dx-dropdowneditor-icon,
.dx-editor-filled .dx-dropdowneditor.dx-dropdowneditor-active .dx-dropdowneditor-icon,
.dx-editor-filled.dx-dropdowneditor-button.dx-state-active .dx-dropdowneditor-icon,
.dx-editor-filled.dx-dropdowneditor.dx-dropdowneditor-active .dx-dropdowneditor-icon {
    background-color: var(--gr-dropdowneditor-filled-button-active-bg);
}

.dx-state-hover.dx-invalid.dx-dropdowneditor.dx-editor-filled .dx-dropdowneditor-icon {
    background-color: var(--gr-dropdowneditor-filled-button-invalid-hover-bg);
}

.dx-dropdowneditor-active.dx-invalid.dx-dropdowneditor.dx-editor-filled .dx-dropdowneditor-icon,
.dx-state-active.dx-invalid.dx-dropdowneditor.dx-editor-filled .dx-dropdowneditor-icon {
    background-color: var(--gr-dropdowneditor-filled-button-invalid-active-bg);
}

.dx-list-item-chevron {
    color: var(--gr-list-item-chevron-icon-color);
}

.dx-list.dx-list-select-decorator-enabled .dx-list-item.dx-state-hover .dx-checkbox-icon,
.dx-list.dx-list-select-decorator-enabled .dx-list-item.dx-state-hover .dx-radiobutton-icon,
.dx-list.dx-list-select-decorator-enabled .dx-list-select-all.dx-state-hover .dx-checkbox-icon,
.dx-list.dx-list-select-decorator-enabled .dx-list-select-all.dx-state-hover .dx-radiobutton-icon {
    border-color: var(--gr-checkbox-hover-border-color);
}

.dx-list.dx-list-select-decorator-enabled .dx-list-item.dx-state-focused .dx-checkbox-icon,
.dx-list.dx-list-select-decorator-enabled .dx-list-item.dx-state-focused .dx-radiobutton-icon,
.dx-list.dx-list-select-decorator-enabled .dx-list-select-all.dx-state-focused .dx-checkbox-icon,
.dx-list.dx-list-select-decorator-enabled .dx-list-select-all.dx-state-focused .dx-radiobutton-icon {
    border: 1px solid var(--gr-checkbox-border-color-focused);
}

.dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-hover {
    background-color: var(--gr-list-item-hover-bg);
    color: var(--gr-list-item-hover-color);
}

    .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-hover .dx-list-item-icon-container .dx-icon {
        color: var(--gr-list-item-hover-color);
    }

.dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-list-item-selected {
    background-color: var(--gr-list-item-selected-bg);
    color: var(--gr-list-item-selected-color);
}

    .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-list-item-selected .dx-list-item-icon-container .dx-icon {
        color: var(--gr-list-item-selected-color);
    }

    .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-list-item-selected.dx-state-hover:not(.dx-state-focused) {
        background-color: var(--gr-list-item-selected-hover-bg);
        color: var(--gr-list-item-color);
    }

.dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused {
    background-color: var(--gr-list-focused-bg);
    color: var(--gr-list-item-focus-color)
}

    .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused .dx-list-item-icon-container .dx-icon {
        color: var(--gr-list-item-focus-color);
    }

    .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused .dx-list-item-chevron {
        border-color: var(--gr-list-chevron-focus-color);
    }

    .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused.dx-list-item-selected {
        background-color: var(--gr-list-item-focused-selected-bg);
        color: var(--gr-base-inverted-text-color);
    }

.dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-active {
    background-color: var(--gr-list-item-active-bg);
    color: var(--gr-list-item-active-color);
}

    .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-active .dx-list-item-icon-container .dx-icon {
        color: var(--gr-list-item-active-color);
    }

    .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-active .dx-list-slide-item-content {
        background-color: var(--gr-list-item-active-bg);
        color: var(--gr-list-item-active-color);
    }

    .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item .dx-list-static-delete-button .dx-icon,
    .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-active .dx-list-static-delete-button .dx-icon,
    .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused .dx-list-static-delete-button .dx-icon {
        color: var(--gr-list-icon-color);
    }

.dx-list-group-header {
    border-top: 1px solid var(--gr-list-border-color);
    border-bottom: 2px solid var(--gr-list-group-header-border-bottom);
    background: var(--gr-list-group-header-bg);
    color: var(--gr-list-group-color);
}

.dx-list-group-collapsed .dx-list-group-header-indicator .dx-list-group-header::before {
    border-bottom-color: var(--gr-list-group-color);
}

.dx-list-collapsible-groups .dx-list-group-header .dx-list-group-header-indicator::before {
    border-color: var(--gr-list-group-color) transparent transparent;
}

.dx-list-group-collapsed .dx-list-group-header .dx-list-group-header-indicator::before {
    border-bottom-color: var(--gr-list-group-color);
}

.dx-list-item.dx-list-item-ghost-reordering.dx-state-focused.dx-state-hover {
    color: var(--gr-list-item-ghost-color);
    background: var(--gr-list-item-ghost-bg);
    border-top: 1px solid var(--gr-list-item-ghost-border-top-color);
    border-bottom: 1px solid var(--gr-list-item-ghost-border-bottom-color);
    box-shadow: 0 0 1px var(--gr-list-item-ghost-box-shadow-1-color), 0 1px 3px var(--gr-list-item-ghost-box-shadow-2-color);
}

.dx-list .dx-empty-message,
.dx-list-item {
    border-top: 1px solid var(--gr-list-border-color);
    color: var(--gr-list-normal-color);
}

.dx-list-border-visible {
    border: 1px solid var(--gr-list-border-color);
}

    .dx-list-border-visible .dx-list-select-all {
        border-bottom: 1px solid var(--gr-list-border-color);
    }

.dx-list-select-all {
    border-bottom: 1px solid var(--gr-list-border-color);
}

.dx-list-slide-menu-button-delete {
    color: var(--gr-list-menu-button-delete-color);
    background-color: var(--gr-list-menu-button-delete-bg);
}

.dx-list-slide-menu-button-menu {
    color: var(--gr-list-menu-button-default-color);
    background-color: var(--gr-list-menu-button-default-bg);
}

.dx-list-context-menucontent {
    background-color: var(--gr-list-holdmenu-bg);
    border: 1px solid var(--gr-list-holdmenu-border-color);
}

.dx-numberbox-spin-up-icon {
    color: var(--gr-numberbox-spin-icon-color);
}

.dx-numberbox-spin-down-icon {
    color: var(--gr-numberbox-spin-icon-color);
}

.dx-state-hover.dx-numberbox-spin-button .dx-numberbox-spin-down-icon,
.dx-state-hover.dx-numberbox-spin-button .dx-numberbox-spin-up-icon {
    background-color: var(--gr-numberbox-spin-hover-bg);
}

.dx-state-active.dx-numberbox-spin-button .dx-numberbox-spin-down-icon,
.dx-state-active.dx-numberbox-spin-button .dx-numberbox-spin-up-icon {
    background-color: var(--gr-numberbox-spin-active-bg);
    color: var(--gr-numberbox-spin-active-color);
}

.dx-calendar {
    background-color: var(--gr-calendar-bg);
}

.dx-calendar-body thead th {
    color: var(--gr-calendar-header-color);
}

.dx-calendar-week-number-cell {
    color: var(--gr-calendar-week-number-cell-color);
}

    .dx-calendar-week-number-cell span {
        background-color: var(--gr-calendar-week-number-cell-bg);
    }

.dx-calendar-cell {
    color: var(--gr-calendar-color);
}

.dx-calendar.dx-invalid {
    border-color: var(--gr-calendar-invalid-faded-border-color);
}

    .dx-calendar.dx-invalid.dx-state-focused {
        border-color: var(--gr-calendar-invalid-focused-border-color);
    }

.dx-calendar-navigator .dx-button,
.dx-calendar-navigator .dx-button .dx-icon {
    color: var(--gr-calendar-navigator-text-color);
}

.dx-calendar-cell.dx-calendar-today span {
    border: 2px solid var(--gr-base-accent);
}

.dx-calendar-cell.dx-state-hover span {
    background-color: var(--gr-calendar-hover-bg);
    color: var(--gr-calendar-cell-hover-color);
}

.dx-calendar-cell.dx-state-active span {
    background-color: var(--gr-calendar-cell-active-bg);
}

.dx-calendar-cell.dx-calendar-selected-date span {
    color: var(--gr-calendar-cell-selected-color);
    background-color: var(--gr-calendar-cell-selected-bg);
}

.dx-calendar-cell.dx-calendar-empty-cell,
.dx-calendar-cell.dx-calendar-empty-cell.dx-state-active span,
.dx-calendar-cell.dx-calendar-empty-cell.dx-state-hover span,
.dx-calendar-cell.dx-calendar-other-view,
.dx-calendar-cell.dx-calendar-other-view.dx-state-active span,
.dx-calendar-cell.dx-calendar-other-view.dx-state-hover span {
    color: var(--gr-calendar-cell-other-color);
}

    .dx-calendar-cell.dx-calendar-empty-cell.dx-calendar-selected-date span,
    .dx-calendar-cell.dx-calendar-other-view.dx-calendar-selected-date span {
        color: var(--gr-calendar-cell-selected-color);
    }

    .dx-calendar-cell.dx-calendar-other-view.dx-calendar-cell-in-range.dx-state-active span,
    .dx-calendar-cell.dx-calendar-other-view.dx-calendar-cell-in-range.dx-state-hover span,
    .dx-calendar-cell.dx-calendar-other-view.dx-calendar-cell-range-hover.dx-state-active span,
    .dx-calendar-cell.dx-calendar-other-view.dx-calendar-cell-range-hover.dx-state-hover span,
    .dx-calendar-cell.dx-calendar-other-view.dx-calendar-range-end-date.dx-state-active span,
    .dx-calendar-cell.dx-calendar-other-view.dx-calendar-range-end-date.dx-state-hover span,
    .dx-calendar-cell.dx-calendar-other-view.dx-calendar-range-start-date.dx-state-active span,
    .dx-calendar-cell.dx-calendar-other-view.dx-calendar-range-start-date.dx-state-hover span {
        color: var(--gr-calendar-cell-other-hover-color);
    }

    .dx-calendar-cell.dx-calendar-other-view.dx-calendar-cell-in-range.dx-state-hover span,
    .dx-calendar-cell.dx-calendar-other-view.dx-calendar-cell-range-hover.dx-state-hover span,
    .dx-calendar-cell.dx-calendar-other-view.dx-calendar-range-end-date.dx-state-hover span,
    .dx-calendar-cell.dx-calendar-other-view.dx-calendar-range-start-date.dx-state-hover span {
        background-color: var(--gr-calendar-cell-hover-color);
    }

    .dx-calendar-cell.dx-calendar-other-view.dx-calendar-cell-in-range.dx-state-active span,
    .dx-calendar-cell.dx-calendar-other-view.dx-calendar-cell-range-hover.dx-state-active span,
    .dx-calendar-cell.dx-calendar-other-view.dx-calendar-range-end-date.dx-state-active span,
    .dx-calendar-cell.dx-calendar-other-view.dx-calendar-range-start-date.dx-state-active span {
        background-color: var(--gr-calendar-cell-active-bg);
    }

    .dx-calendar-cell.dx-calendar-other-view.dx-calendar-cell-in-range span,
    .dx-calendar-cell.dx-calendar-other-view.dx-calendar-cell-range-hover span,
    .dx-calendar-cell.dx-calendar-other-view.dx-calendar-range-end-date span,
    .dx-calendar-cell.dx-calendar-other-view.dx-calendar-range-start-date span {
        color: var(--gr-calendar-cell-other-color);
    }

.dx-calendar-cell.dx-calendar-empty-cell {
    color: var(--gr-calendar-cell-empty-color);
}

    .dx-calendar-cell.dx-calendar-empty-cell.dx-state-active.dx-calendar-selected-date span,
    .dx-calendar-cell.dx-calendar-empty-cell.dx-state-hover.dx-calendar-selected-date span {
        background-color: var(--gr-calendar-cell-selected-bg);
    }

.dx-calendar-cell-in-range::before {
    background-color: var(--gr-calendar-hover-bg);
    border-color: var(--gr-calendar-cell-hover-border-color) transparent;
}

.dx-calendar-cell-in-range.dx-calendar-range-start-date::before {
    border-inline-start-color: var(--gr-calendar-cell-hover-border-color);
}

.dx-calendar-cell-in-range.dx-calendar-range-end-date::before {
    border-inline-end-color: var(--gr-calendar-cell-hover-border-color);
}

.dx-calendar-cell-in-range.dx-calendar-cell-start-in-row::before {
    border-inline-start-color: var(--gr-calendar-cell-hover-border-color);
}

.dx-calendar-cell-in-range.dx-calendar-cell-end-in-row::before {
    border-inline-end-color: var(--gr-calendar-cell-hover-border-color);
}

.dx-calendar-cell-in-range.dx-calendar-cell-start::before {
    border-inline-start-color: var(--gr-calendar-cell-hover-border-color);
}

.dx-calendar-cell-in-range.dx-calendar-cell-start.dx-calendar-range-end-date::before {
    border-inline-end-color: var(--gr-calendar-cell-hover-border-color);
}

.dx-calendar-cell-in-range.dx-calendar-cell-end::before {
    border-inline-end-color: var(--gr-calendar-cell-hover-border-color);
}

.dx-calendar-cell-range-hover::after {
    border-color: var(--gr-calendar-cell-hover-border-color) transparent;
}

.dx-calendar-cell-range-hover.dx-calendar-cell-range-hover-start::after {
    border-inline-start-color: var(--gr-calendar-cell-hover-border-color);
}

.dx-calendar-cell-range-hover.dx-calendar-cell-range-hover-end::after {
    border-inline-end-color: var(--gr-calendar-cell-hover-border-color);
}

.dx-calendar-cell-range-hover.dx-calendar-cell-start-in-row::after {
    border-inline-start-color: var(--gr-calendar-cell-hover-border-color);
}

.dx-calendar-cell-range-hover.dx-calendar-cell-end-in-row::after {
    border-inline-end-color: var(--gr-calendar-cell-hover-border-color);
}

.dx-calendar-cell-range-hover.dx-calendar-cell-start::after {
    border-inline-start-color: var(--gr-calendar-cell-hover-border-color);
}

.dx-calendar-cell-range-hover.dx-calendar-cell-start.dx-calendar-cell-range-hover-end::after {
    border-inline-end-color: var(--gr-calendar-cell-hover-border-color);
}

.dx-calendar-cell-range-hover.dx-calendar-cell-end::after {
    border-inline-end-color: var(--gr-calendar-cell-hover-border-color);
}

.dx-dateview-item {
    color: var(--gr-dateview-color);
}

.dx-dateviewroller-hours::after {
    color: var(--gr-dateview-color);
}

.dx-dateview-item-selected-frame::before {
    border-bottom: 1px solid var(--gr-dateview-border-color);
}

.dx-dateview-item-selected-frame::after {
    border-top: 1px solid var(--gr-dateview-border-color);
}

.dx-datebox-datetime-time-side {
    background-color: var(--gr-timeview-bg);
}

.dx-daterangebox-separator {
    color: var(--gr-texteditor-label-color);
}

.dx-daterangebox .dx-texteditor.dx-state-hover::before {
    border-bottom-color: var(--gr-texteditor-hover-border-color);
}

.dx-daterangebox .dx-texteditor.dx-state-hover.dx-invalid::before {
    border-bottom-color: var(--gr-texteditor-invalid-faded-border-color);
}

.dx-daterangebox .dx-texteditor.dx-state-focused::before {
    border-bottom-color: var(--gr-texteditor-focused-border-color);
}

.dx-daterangebox .dx-texteditor.dx-state-focused.dx-invalid::before {
    border-bottom-color: var(--gr-texteditor-invalid-focused-border-color);
}

.dx-daterangebox.dx-invalid .dx-texteditor.dx-state-hover::before {
    border-bottom-color: var(--gr-texteditor-invalid-faded-border-color);
}

.dx-daterangebox.dx-invalid .dx-texteditor.dx-state-focused::before {
    border-bottom-color: var(--gr-texteditor-invalid-focused-border-color);
}

.dx-loadindicator-icon .dx-loadindicator-segment {
    background: var(--gr-loadindicator-bg);
}

.dx-treeview-item.dx-state-hover {
    background-color: var(--gr-treeview-hover-bg);
    color: var(--gr-treeview-item-hover-color);
}

.dx-state-selected > .dx-treeview-item {
    color: var(--gr-treeview-item-selected-color);
}

.dx-treeview-toggle-item-visibility {
    color: var(--gr-treeview-spin-icon-color);
}

.dx-treeview-item-with-checkbox .dx-treeview-item {
    color: var(--gr-base-text-color);
}

.dx-treeview-item-without-checkbox.dx-state-selected > .dx-treeview-item {
    color: var(--gr-treeview-item-selected-color);
    background-color: var(--gr-treeview-item-selected-bg);
}

.dx-treeview-item-without-checkbox.dx-state-focused > .dx-treeview-item {
    background-color: var(--gr-treeview-focused-bg);
    color: var(--gr-treeview-focus-color);
}

.dx-treeview-item-with-checkbox.dx-state-focused > .dx-treeview-item .dx-checkbox .dx-checkbox-icon {
    border: 1px solid var(--gr-checkbox-border-color-focused);
}

.dx-treeview-item-without-checkbox.dx-state-focused > .dx-treeview-item .dx-treeview-node-loadindicator .dx-loadindicator-icon .dx-loadindicator-segment {
    background: var(--gr-generic-treeview-focused-row-load-indicator-color);
}

.dx-menu-base {
    color: var(--gr-base-text-color);
    font-family: var(--gr-base-font-family)
}

.dx-menu-item {
    color: var(--gr-menu-color);
}

    .dx-menu-item a {
        color: var(--gr-base-link-color);
    }

    .dx-menu-item.dx-state-hover {
        color: var(--gr-menu-item-hovered-color);
        background-color: var(--gr-menu-item-hovered-bg);
    }

    .dx-menu-item.dx-state-focused {
        background-color: var(--gr-menu-item-focused-bg);
        color: var(--gr-base-inverted-text-color);
    }

        .dx-menu-item.dx-state-focused a {
            color: var(--gr-base-inverted-text-color);
        }

.dx-menu-item-selected {
    background-color: var(--gr-menu-item-selected-bg);
    color: var(--gr-menu-item-selected-color);
}

    .dx-menu-item-selected.dx-state-focused {
        background-color: var(--gr-menu-item-focused-selected-bg);
        color: var(--gr-base-inverted-text-color);
    }

.dx-menu-item-expanded {
    color: var(--gr-menu-item-expanded-color);
    background-color: var(--gr-menu-item-hover-bg);
}

.dx-menu-base input,
.dx-menu-base textarea {
    font-family: var(--gr-base-font-family);
}

.dx-context-menu-container-border {
    border: 1px solid var(--gr-menu-container-shadow-color);
}

.dx-menu-adaptive-mode .dx-treeview-node-container:first-child > .dx-treeview-node {
    border-bottom: 1px solid var(--gr-menu-popup-border-color);
}

.dx-context-menu-content-delimiter::before {
    background-color: var(--gr-menu-popup-bg);
}

.dx-menu .dx-menu-item-expanded {
    color: var(--gr-menu-color);
    background-color: var(--gr-menu-popup-bg);
}

.dx-menu-adaptive-mode {
    background-color: var(--gr-menu-popup-bg);
}

    .dx-menu-adaptive-mode .dx-treeview {
        border: 1px solid var(--gr-menu-popup-border-color);
    }

    .dx-menu-adaptive-mode .dx-treeview-node.dx-state-focused .dx-treeview-toggle-item-visibility {
        color: var(--gr-menu-popup-bg);
    }

.dx-selectbox-popup-wrapper .dx-list {
    background-color: var(--gr-selectbox-list-bg);
}

.dx-toolbar {
    background-color: var(--gr-toolbar-bg);
    color: var(--gr-toolbar-color);
}

.dx-toolbar-background {
    background-color: var(--gr-toolbar-bg);
}

.dx-toolbar-menu-section {
    border-bottom: 1px solid var(--gr-base-border-color);
}

    .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button {
        color: var(--gr-button-normal-color);
    }

        .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button .dx-icon {
            color: var(--gr-button-normal-color);
        }

        .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button.dx-state-active {
            color: var(--gr-button-normal-color);
        }

        .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button.dx-button-danger {
            color: var(--gr-button-danger-color);
        }

            .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button.dx-button-danger .dx-icon {
                color: var(--gr-button-danger-color);
            }

            .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button.dx-button-danger.dx-state-selected {
                background-color: var(--gr-button-danger-text-bg-selected);
            }

            .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button.dx-button-danger.dx-state-focused,
            .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button.dx-button-danger.dx-state-hover {
                background-color: var(--gr-button-danger-text-bg-focused);
            }

            .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button.dx-button-danger.dx-state-active {
                background-color: var(--gr-button-danger-text-bg-active);
                color: var(--gr-button-danger-color);
            }

        .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button.dx-button-success {
            color: var(--gr-button-success-color);
        }

            .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button.dx-button-success .dx-icon {
                color: var(--gr-button-success-color);
            }

            .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button.dx-button-success.dx-state-selected {
                background-color: var(--gr-button-success-text-bg-selected);
            }

            .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button.dx-button-success.dx-state-focused,
            .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button.dx-button-success.dx-state-hover {
                background-color: var(--gr-button-success-text-bg-focused);
            }

            .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button.dx-button-success.dx-state-active {
                background-color: var(--gr-button-success-text-bg-active);
                color: var(--gr-button-success-color);
            }

        .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button.dx-button-default {
            color: var(--gr-button-default-color);
        }

            .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button.dx-button-default .dx-icon {
                color: var(--gr-button-default-color);
            }

            .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button.dx-button-default.dx-state-selected {
                background-color: var(--gr-button-default-text-bg-selected);
            }

            .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button.dx-button-default.dx-state-focused,
            .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button.dx-button-default.dx-state-hover {
                background-color: var(--gr-button-default-text-bg-focused);
            }

            .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button.dx-button-default.dx-state-active {
                background-color: var(--gr-button-default-text-bg-active);
                color: var(--gr-button-default-color);
            }

.dx-dialog-root .dx-overlay-shader {
    background-color: var(--gr-overlay-shader-bg);
}

.dx-popup-wrapper > .dx-overlay-content {
    border: 1px solid var(--gr-overlay-border-color);
    background: var(--gr-overlay-content-bg);
}

.dx-popup-wrapper .dx-state-focused.dx-overlay-content {
    border: 1px solid var(--gr-base-accent);
}

.dx-popup-title {
    border-bottom: 1px solid var(--gr-popup-title-border-color);
    color: var(--gr-popup-title-color);
    background-color: var(--gr-popup-title-bg);
}

.dx-popup-bottom {
    color: var(--gr-popup-bottom-color);
    background-color: var(--gr-popup-bottom-bg);
}

.dx-toast-content {
    color: var(--gr-toast-color);
    -moz-box-shadow: 0 2px 3px 0 var(--gr-toast-shadow-color);
    -webkit-box-shadow: 0 2px 3px 0 var(--gr-toast-shadow-color);
    box-shadow: 0 2px 3px 0 var(--gr-toast-shadow-color);
}

.dx-toast-info {
    background-color: var(--gr-toast-info-bg);
}

.dx-toast-warning {
    background-color: var(--gr-toast-warning-bg);
}

.dx-toast-error {
    background-color: var(--gr-toast-error-bg);
}

.dx-toast-success {
    background-color: var(--gr-toast-success-bg);
}

.dx-popover-wrapper.dx-position-bottom .dx-popover-arrow::after {
    background: var(--gr-popover-arrow-bg);
}

.dx-popover-wrapper .dx-popover-arrow::after,
.dx-popover-wrapper.dx-popover-without-title .dx-popover-arrow::after {
    background: var(--gr-overlay-content-bg);
}

.dx-popover-arrow::after {
    border: 1px solid var(--gr-texteditor-border-color);
}

.dx-progressbar-container {
    border: var(--gr-generic-progress-bar-border);
    background-color: var(--gr-progressbar-bg);
}

.dx-progressbar-range {
    border: 1px solid var(--gr-progressbar-range-border-color);
    background-color: var(--gr-progressbar-range-bg);
}

.dx-progressbar-animating-container {
    background-color: var(--gr-progressbar-bg);
    border: var(--gr-generic-progress-bar-border);
    background-image: linear-gradient(var(--gr-generic-progressbar-interdeterminate-state-gradient));
}

.dx-state-disabled .dx-progressbar-range {
    background-color: var(--gr-progressbar-range-disabled-bg);
}

.dx-rtl .dx-progressbar .dx-progressbar-animating-container,
.dx-rtl.dx-progressbar .dx-progressbar-animating-container {
    background-image: linear-gradient(var(--gr-generic-progressbar-interdeterminate-state-gradient));
}

.dx-tooltip-wrapper .dx-overlay-content {
    border: 1px solid var(--gr-tooltip-border-color);
    background-color: var(--gr-tooltip-bg);
    color: var(--gr-tooltip-color);
    -moz-box-shadow: 0 2px 4px var(--gr-tooltip-shadow-color);
    -webkit-box-shadow: 0 2px 4px var(--gr-tooltip-shadow-color);
    box-shadow: 0 2px 4px var(--gr-tooltip-shadow-color);
}

.dx-tooltip-wrapper.dx-popover-wrapper .dx-popover-arrow::after {
    border: 1px solid var(--gr-tooltip-border-color);
    background: var(--gr-tooltip-bg);
}

.dx-slider .dx-state-active.dx-slider-handle {
    border: 1px solid var(--gr-slider-handle-border-color);
    background: var(--gr-slider-handle-active-bg);
}

.dx-slider .dx-state-focused.dx-slider-handle:not(.dx-state-active),
.dx-slider .dx-state-hover.dx-slider-handle:not(.dx-state-active) {
    border: 1px solid var(--gr-slider-handle-border-color);
    background: var(--gr-slider-handle-hover-bg);
}

.dx-slider-range.dx-slider-range-visible {
    border: 1px solid var(--gr-slider-range-border-color);
    background: var(--gr-slider-range-bg);
}

.dx-slider-handle {
    border: 1px solid var(--gr-slider-handle-border-color);
    background-color: var(--gr-slider-handle-bg);
}

.dx-invalid .dx-slider-handle {
    background-color: var(--gr-base-invalid-color);
}

.dx-invalid .dx-slider-range-visible {
    background-color: var(--gr-base-invalid-color);
    border-color: var(--gr-base-invalid-color);
}

.dx-invalid .dx-slider-bar {
    background-color: var(--gr-slider-invalid-bar-bg);
}

.dx-invalid .dx-state-focused.dx-slider-handle:not(.dx-state-active),
.dx-invalid .dx-state-hover.dx-slider-handle:not(.dx-state-active) {
    background: var(--gr-slider-invalid-handle-accent-bg);
}

.dx-gallery .dx-gallery-nav-button-next.dx-state-hover::after,
.dx-gallery .dx-gallery-nav-button-prev.dx-state-hover::after {
    background-color: var(--gr-gallery-navbutton-hover-color);
}

.dx-gallery .dx-gallery-nav-button-next.dx-state-active::after,
.dx-gallery .dx-gallery-nav-button-prev.dx-state-active::after {
    background-color: var(--gr-gallery-navbutton-active-color);
}

.dx-gallery .dx-gallery-nav-button-next::before,
.dx-gallery .dx-gallery-nav-button-prev::before {
    color: var(--gr-gallery-nav-arrow-color);
}

.dx-gallery-indicator-item {
    border: 1px solid var(--gr-gallery-indicator-item-border-color);
    background: var(--gr-gallery-indicator-bg);
}

.dx-gallery-indicator-item-active,
.dx-gallery-indicator-item-selected {
    background: var(--gr-gallery-indicator-item-selected-bg);
    border: 2px solid var(--gr-gallery-indicator-selected-border-color);
}

.dx-state-focused.dx-gallery {
    border-color: var(--gr-base-accent);
}

    .dx-state-focused.dx-gallery .dx-gallery-indicator-item-selected {
        background: var(--gr-gallery-indicator-focused-bg);
    }

.dx-lookup-arrow {
    color: var(--gr-lookup-icon-color);
}

.dx-dropdowneditor-active .dx-lookup-arrow {
    color: var(--gr-lookup-icon-color-active);
}

.dx-lookup-empty .dx-lookup-field {
    color: var(--gr-texteditor-placeholder-color);
}

.dx-invalid.dx-lookup .dx-lookup-field::after {
    background-color: var(--gr-base-invalid-color);
    color: var(--gr-base-inverted-text-color);
}

.dx-valid.dx-lookup .dx-lookup-field::after {
    color: var(--gr-base-success);
}

.dx-loadpanel-content {
    border: 1px solid var(--gr-loadpanel-border-color);
    background: var(--gr-loadpanel-content-bg);
    box-shadow: 0 6px 12px var(--gr-loadpanel-content-shadow-color);
}

.dx-radiobutton-icon .dx-radiobutton-icon-dot {
    border-color: var(--gr-radiogroup-bg);
}

.dx-radiobutton-icon-checked .dx-radiobutton-icon-dot {
    background-color: var(--gr-radiogroup-checked-bg);
}

.dx-radiobutton-icon {
    border: 1px solid var(--gr-radiogroup-border-color);
    background-color: var(--gr-radiogroup-bg);
}

.dx-radiobutton.dx-state-readonly .dx-radiobutton-icon {
    border-color: var(--gr-radiogroup-readonly-border-color);
}

.dx-radiobutton.dx-state-hover .dx-radiobutton-icon {
    border-color: var(--gr-radiogroup-hover-border-color);
}

.dx-radiobutton.dx-state-active .dx-radiobutton-icon {
    background-color: var(--gr-radiobutton-active-bg);
}

.dx-radiobutton.dx-state-active .dx-radiobutton-icon-dot {
    border-color: var(--gr-radiogroup-border-color);
}

.dx-radiobutton.dx-state-focused .dx-radiobutton-icon {
    border-color: var(--gr-radiobutton-focused-border-color);
}

.dx-invalid .dx-radiobutton-icon {
    border-color: var(--gr-radiobutton-invalid-faded-border-color);
}

.dx-invalid .dx-state-focused.dx-radiobutton .dx-radiobutton-icon,
.dx-invalid .dx-state-hover.dx-radiobutton .dx-radiobutton-icon {
    border-color: var(--gr-radiobutton-invalid-focused-border-color);
}

.dx-state-readonly .dx-radiobutton-icon {
    border-color: var(--gr-radiogroup-readonly-border-color);
}

.dx-tabpanel-tab.dx-state-focused::after {
    border-color: #ddd;
}

.dx-tabpanel.dx-state-focused .dx-tabpanel-tab.dx-state-focused::after {
    border-color: var(--gr-tabs-focused-border-color);
}

.dx-tabpanel.dx-state-focused .dx-tabpanel-tab.dx-state-focused.dx-state-disabled::after {
    border-color: var(--gr-tabs-focused-disabled-border-color);
}

.dx-tabpanel .dx-multiview-wrapper {
    border: 1px solid var(--gr-tabs-border-color);
}

.dx-tabpanel.dx-state-focused .dx-multiview-wrapper.dx-state-focused {
    border-color: var(--gr-tabs-focused-border-color);
}

.dx-form-group-with-caption > .dx-form-group-content {
    border-top: 1px solid var(--gr-form-group-border-color);
}

.dx-field-item-help-text {
    color: var(--gr-form-field-item-color);
}

.dx-field-item-label-text {
    color: var(--gr-form-field-item-color);
}

.dx-field-item-optional .dx-label > span::after,
.dx-field-item-optional-mark {
    color: var(--gr-form-field-mark-color);
}

.dx-field-item-required .dx-label > span::after,
.dx-field-item-required-mark {
    color: var(--gr-form-field-required-color);
}

.dx-fa-button.dx-fa-button-main .dx-overlay-shader {
    background-color: var(--gr-speed-dial-action-shading-color);
}

.dx-fa-button.dx-fa-button-main .dx-overlay-content {
    background-color: var(--gr-button-default-bg);
    color: var(--gr-button-default-color);
    box-shadow: var(--gr-speed-dial-action-shadow);
}

    .dx-fa-button.dx-fa-button-main .dx-overlay-content.dx-state-hover {
        background-color: var(--gr-button-default-contained-bg-hover);
    }

    .dx-fa-button.dx-fa-button-main .dx-overlay-content.dx-state-active {
        background-color: var(--gr-button-default-contained-bg-selected);
    }

    .dx-fa-button.dx-fa-button-main .dx-overlay-content .dx-fa-button-label-wrapper .dx-fa-button-label {
        color: var(--gr-button-default-color);
    }

.dx-fa-button .dx-overlay-content {
    color: var(--gr-speed-dial-action-color);
}

    .dx-fa-button .dx-overlay-content.dx-state-hover .dx-fa-button-icon {
        background-color: var(--gr-speed-dial-action-hover-bg);
    }

    .dx-fa-button .dx-overlay-content.dx-state-active .dx-fa-button-icon {
        background-color: var(--gr-speed-dial-action-active-bg);
    }

    .dx-fa-button .dx-overlay-content .dx-fa-button-label-wrapper .dx-fa-button-label {
        background-color: var(--gr-speed-dial-action-bg);
        color: var(--gr-speed-dial-action-color);
    }

    .dx-fa-button .dx-overlay-content .dx-fa-button-icon {
        background-color: var(--gr-speed-dial-action-bg);
        box-shadow: var(--gr-speed-dial-action-shadow);
    }