/**
    Written for DevExtreme 24.2.5
*/

:root {
    --border-color: #e5e8f0;
    --dx-color-primary: var(--primary-color);
    --dx-color-link: var(--primary-color);
}

/* Adapting buttons */
.dx-buttongroup .dx-button:not(:last-child) {
     border-right: 1px solid var(--border-color);
}

.dx-button.dx-button-button, .dx-button-mode-contained.dx-button-default {
    background-color: var(--primary-color);
    color: var(--primary-color-text);
}

    .dx-button.dx-button-button.dx-state-selected,
    .dx-button.dx-button-button.dx-state-selected i,
    .dx-button.dx-button-button.dx-state-selected svg,
    .dx-button.dx-button-button.dx-button-default.dx-state-selected,
    .dx-button.dx-button-button.dx-button-default.dx-state-selected i,
    .dx-button.dx-button-button.dx-button-default.dx-state-selected svg {
        background-color: var(--primary-color-dark-20);
        color: var(--primary-color-text);
    }

    .dx-button.dx-button-button.dx-state-hover,
    .dx-button.dx-button-button.dx-state-hover i,
    .dx-button.dx-button-button.dx-state-hover svg,
    .dx-button.dx-button-button.dx-button-default.dx-state-hover,
    .dx-button.dx-button-button.dx-button-default.dx-state-hover i,
    .dx-button.dx-button-button.dx-button-default.dx-state-hover svg {
        background-color: var(--primary-color-dark-20);
        color: var(--primary-color-text);
    }

    .dx-button.dx-button-button.dx-state-focused,
    .dx-button.dx-button-button.dx-state-focused i,
    .dx-button.dx-button-button.dx-state-focused svg,
    .dx-button.dx-button-button.dx-button-default.dx-state-focused,
    .dx-button.dx-button-button.dx-button-default.dx-state-focused i,
    .dx-button.dx-button-button.dx-button-default.dx-state-focused svg {
        background-color: var(--primary-color-dark-20);
        color: var(--primary-color-text);
    }

    .dx-button.dx-button-button.dx-state-active,
    .dx-button.dx-button-button.dx-state-active i,
    .dx-button.dx-button-button.dx-state-active svg,
    .dx-button.dx-button-button.dx-button-default.dx-state-active,
    .dx-button.dx-button-button.dx-button-default.dx-state-active i,
    .dx-button.dx-button-button.dx-button-default.dx-state-active svg {
        background-color: var(--primary-color);
        color: var(--primary-color-text);
    }

.dx-button-mode-text, .dx-button-mode-text.dx-button-default {
    background-color: transparent;
    color: var(--primary-color);
}

    .dx-button-mode-text.dx-state-selected,
    .dx-button-mode-text.dx-button-default.dx-state-selected,
    .dx-button-mode-text.dx-button-default.dx-state-selected i,
    .dx-button-mode-text.dx-button-default.dx-state-selected svg {
        background-color: var(--primary-color-light-90);
        color: var(--primary-color);
    }

    .dx-button-mode-text.dx-state-hover,
    .dx-button-mode-text.dx-button-default.dx-state-hover,
    .dx-button-mode-text.dx-button-default.dx-state-hover i,
    .dx-button-mode-text.dx-button-default.dx-state-hover svg {
        background-color: var(--primary-color-light-90);
        color: var(--primary-color);
    }

    .dx-button-mode-text.dx-state-focused,
    .dx-button-mode-text.dx-button-default.dx-state-focused,
    .dx-button-mode-text.dx-button-default.dx-state-focused i,
    .dx-button-mode-text.dx-button-default.dx-state-focused svg {
        background-color: var(--primary-color-light-90);
        color: var(--primary-color);
    }

    .dx-button-mode-text.dx-state-active,
    .dx-button-mode-text.dx-button-default.dx-state-active,
    .dx-button-mode-text.dx-button-default.dx-state-active i,
    .dx-button-mode-text.dx-button-default.dx-state-active svg {
        background-color: var(--primary-color);
        color: var(--primary-color-text);
    }

.dx-button-mode-outlined, .dx-button-mode-outlined.dx-button-default {
    border-color: var(--border-color);
    background-color: white;
    color: var(--text-color);
}

    .dx-button-mode-outlined.dx-state-selected,
    .dx-button-mode-outlined.dx-button-default.dx-state-selected,
    .dx-button-mode-outlined.dx-button-default.dx-state-selected i,
    .dx-button-mode-outlined.dx-button-default.dx-state-selected svg {
        background-color: var(--primary-color-light-90);
        color: var(--primary-color);
    }

    .dx-button-mode-outlined.dx-state-hover,
    .dx-button-mode-outlined.dx-button-default.dx-state-hover,
    .dx-button-mode-outlined.dx-button-default.dx-state-hover i,
    .dx-button-mode-outlined.dx-button-default.dx-state-hover svg {
        background-color: var(--primary-color-light-90);
        color: var(--primary-color);
    }

    .dx-button-mode-outlined.dx-state-focused,
    .dx-button-mode-outlined.dx-button-default.dx-state-focused,
    .dx-button-mode-outlined.dx-button-default.dx-state-focused i,
    .dx-button-mode-outlined.dx-button-default.dx-state-focused svg {
        background-color: var(--primary-color-light-90);
        color: var(--primary-color);
    }

    .dx-button-mode-outlined.dx-state-active,
    .dx-button-mode-outlined.dx-button-default.dx-state-active,
    .dx-button-mode-outlined.dx-button-default.dx-state-active i,
    .dx-button-mode-outlined.dx-button-default.dx-state-active svg {
        background-color: var(--primary-color);
        color: var(--primary-color-text);
    }

.dx-button .dx-icon {
    color: inherit;
}

.dx-dropdownbutton.dx-state-hover,
.dx-dropdownbutton.dx-button-default.dx-state-hover,
.dx-dropdownbutton.dx-button-default.dx-state-hover i,
.dx-dropdownbutton.dx-button-default.dx-state-hover svg {
    background-color: var(--primary-color-light-90);
    color: var(--primary-color);
    border-radius: 4px;
}

/* Adapting checkboxes */
.dx-checkbox-indeterminate .dx-checkbox-icon {
    border-color: var(--primary-color);
}

.dx-checkbox-indeterminate.dx-state-hover .dx-checkbox-icon {
    border-color: var(--primary-color-dark-20);
}

.dx-checkbox-indeterminate .dx-checkbox-icon::before {
    background-color: var(--primary-color);
}

.dx-checkbox-indeterminate.dx-state-hover .dx-checkbox-icon::before {
    background-color: var(--primary-color-dark-20);
}

.dx-checkbox-checked .dx-checkbox-icon {
    background-color: var(--primary-color-dark-70) !important;
    border-color: var(--primary-color-dark-70) !important;
}

.dx-checkbox-checked.dx-state-hover .dx-checkbox-icon {
    background-color: var(--primary-color-dark-20) !important;
    border-color: var(--primary-color-dark-20) !important;
}

/* Adapting text editors */
.dx-texteditor.dx-state-hover,
.dx-texteditor.dx-state-focused,
.dx-texteditor.dx-editor-outlined.dx-state-active,
.dx-texteditor.dx-editor-outlined.dx-state-focused,
.dx-texteditor.dx-editor-outlined.dx-state-hover {
    border-color: var(--primary-color) !important;
}

    .dx-texteditor.dx-editor-outlined.dx-state-active::before,
    .dx-texteditor.dx-editor-outlined.dx-state-hover::before,
    .dx-texteditor.dx-editor-outlined.dx-state-focused::before,
    .dx-texteditor.dx-editor-filled::before {
        border-bottom-color: var(--primary-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(--primary-color-light-80);
}

.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(--primary-color-light-80);
}

.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(--primary-color-light-50);
}

.dx-texteditor.dx-state-focused .dx-texteditor-label,
.dx-texteditor.dx-state-focused.dx-state-hover .dx-texteditor-label {
    color: var(--primary-color);
}

.dx-editor-outlined.dx-texteditor-with-floating-label.dx-dropdowneditor-active.dx-state-focused .dx-texteditor-label .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-dropdowneditor-active.dx-state-focused .dx-texteditor-label .dx-label-before,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-dropdowneditor-active.dx-state-focused.dx-state-hover .dx-texteditor-label .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-dropdowneditor-active.dx-state-focused.dx-state-hover .dx-texteditor-label .dx-label-before,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-state-focused .dx-texteditor-label .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-state-focused .dx-texteditor-label .dx-label-before,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-state-focused.dx-state-hover .dx-texteditor-label .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-state-focused.dx-state-hover .dx-texteditor-label .dx-label-before,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-textarea.dx-state-focused .dx-texteditor-label .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-textarea.dx-state-focused .dx-texteditor-label .dx-label-before,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-textarea.dx-state-focused.dx-state-hover .dx-texteditor-label .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-textarea.dx-state-focused.dx-state-hover .dx-texteditor-label .dx-label-before,
.dx-editor-outlined.dx-texteditor-with-label.dx-dropdowneditor-active.dx-state-focused .dx-texteditor-label .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-label.dx-dropdowneditor-active.dx-state-focused .dx-texteditor-label .dx-label-before,
.dx-editor-outlined.dx-texteditor-with-label.dx-dropdowneditor-active.dx-state-focused.dx-state-hover .dx-texteditor-label .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-label.dx-dropdowneditor-active.dx-state-focused.dx-state-hover .dx-texteditor-label .dx-label-before,
.dx-editor-outlined.dx-texteditor-with-label.dx-state-focused .dx-texteditor-label .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-label.dx-state-focused .dx-texteditor-label .dx-label-before,
.dx-editor-outlined.dx-texteditor-with-label.dx-state-focused.dx-state-hover .dx-texteditor-label .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-label.dx-state-focused.dx-state-hover .dx-texteditor-label .dx-label-before,
.dx-editor-outlined.dx-texteditor-with-label.dx-textarea.dx-state-focused .dx-texteditor-label .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-label.dx-textarea.dx-state-focused .dx-texteditor-label .dx-label-before,
.dx-editor-outlined.dx-texteditor-with-label.dx-textarea.dx-state-focused.dx-state-hover .dx-texteditor-label .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-label.dx-textarea.dx-state-focused.dx-state-hover .dx-texteditor-label .dx-label-before {
    border-color: var(--primary-color);
    border-style: solid;
    border-top: 1px solid var(--primary-color);
    border-bottom: 1px solid var(--primary-color);
    height: 100%;
}

.dx-editor-outlined.dx-texteditor-with-floating-label.dx-state-hover .dx-texteditor-label .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-floating-label.dx-state-hover .dx-texteditor-label .dx-label-before,
.dx-editor-outlined.dx-texteditor-with-label.dx-state-hover .dx-texteditor-label .dx-label-after,
.dx-editor-outlined.dx-texteditor-with-label.dx-state-hover .dx-texteditor-label .dx-label-before {
    border-color: var(--primary-color-light-60);
    border-style: solid;
    border-top: 1px solid var(--primary-color-light-60);
    border-bottom: 1px solid var(--primary-color-light-60);
    height: 100%;
}

/* Adapting menus */
.dx-menu-item.dx-state-focused,
.dx-menu-item.dx-state-hover {
    color: black;
    background-color: var(--primary-color-light-90);
}

.dx-menu-item.dx-state-active {
    color: black;
    background-color: var(--primary-color-light-80);
}

/* Adapting lists */
.dx-list-item.dx-list-item-selected,
.dx-list-item.dx-list-item-selected.dx-state-active,
.dx-list-item.dx-list-item-selected.dx-state-hover {
    color: black;
    background-color: var(--primary-color-light-90) !important;
}

.dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-active {
    color: black;
    background-color: var(--primary-color-light-90) !important;
}

.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::before,
.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::before {
    border-color: var(--primary-color-light-60) !important;
}

/* Adapting borders and shadows */
.dx-colorview-container-row.dx-colorview-alpha-channel-row {
    border-color: var(--primary-color);
}

.dx-colorview-hue-scale {
    background-image: linear-gradient(0deg, red 0, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, red 100%);
}

/* Adapting text colors */
.dx-texteditor.dx-state-focused .dx-texteditor-label {
    color: var(--primary-color);
}

/* Adapting invalid states */
.dx-invalid.dx-texteditor.dx-state-focused::before {
    border-bottom-color: #dc2828;
}

/* Adapting background colors */
.dx-editor-filled {
    background-color: var(--background-color);
}

/* Adapting borders */
.dx-border-color {
    border-color: var(--border-color);
}

/* Adapting Gantt chart */
.dx-gantt .dx-gantt-taskWrapper .dx-gantt-task.dx-gantt-parent.dx-gantt-cmpl::after {
    border-right-color: rgba(255, 255, 255, 0.2);
    border-top-color: rgba(255, 255, 255, 0.2);
}

.dx-gantt .dx-gantt-taskWrapper .dx-gantt-task.dx-gantt-parent .dx-gantt-task-edit-frame {
    height: 18px;
}

.dx-gantt .dx-gantt-taskWrapper .dx-gantt-titleIn {
    color: #fff;
    padding: 0 9px;
}

.dx-gantt .dx-gantt-taskRes {
    height: 20px;
    line-height: 20px;
    color: #fff;
    background-color: #999;
    border-radius: 4px;
    margin-left: 21px;
    padding-left: 4px;
    padding-right: 4px;
}

.dx-gantt .dx-gantt-titleOut {
    padding-right: 20px;
}

.dx-gantt .dx-gantt-milestone {
    background-color: #21293b;
    width: 14px;
    height: 14px;
}

.dx-gantt .dx-gantt-task-edit-wrapper {
    padding-top: 0;
    padding-left: 1px;
}

    .dx-gantt .dx-gantt-task-edit-wrapper .dx-gantt-task-edit-frame {
        height: 100%;
        border: 1px solid #542478;
        border-radius: 4px;
    }

        .dx-gantt .dx-gantt-task-edit-wrapper .dx-gantt-task-edit-frame .dx-gantt-task-edit-progress {
            border-color: transparent transparent #542478;
        }

            .dx-gantt .dx-gantt-task-edit-wrapper .dx-gantt-task-edit-frame .dx-gantt-task-edit-progress::before {
                width: 12px;
                height: 6px;
                bottom: -14px;
                border: 1px solid #542478;
            }

        .dx-gantt .dx-gantt-task-edit-wrapper .dx-gantt-task-edit-frame .dx-gantt-task-edit-progress-status {
            border-radius: 4px;
        }

.dx-gantt .dx-gantt-task-edit-wrapper-successor {
    padding-top: 0;
}

    .dx-gantt .dx-gantt-task-edit-wrapper-successor .dx-gantt-task-edit-frame-successor {
        height: 20px;
    }

.dx-gantt .dx-gantt-task-edit-dependency-l,
.dx-gantt .dx-gantt-task-edit-dependency-r,
.dx-gantt .dx-gantt-task-edit-successor-dependency-l,
.dx-gantt .dx-gantt-task-edit-successor-dependency-r {
    background: #fff;
    border: 1px solid #542478;
    width: 10px;
    height: 10px;
    margin: auto;
    top: 0;
    bottom: 0;
}

.dx-gantt .dx-gantt-task-edit-dependency-r,
.dx-gantt .dx-gantt-task-edit-successor-dependency-r {
    left: -11px;
}

.dx-gantt .dx-gantt-task-edit-dependency-l,
.dx-gantt .dx-gantt-task-edit-successor-dependency-l {
    right: -11px;
}

.dx-gantt .dx-gantt-task-edit-dependency-line {
    background-color: #21293b;
}

.dx-gantt .dx-gantt-sel {
    background-color: #f1eaf5;
}

.dx-gantt .dx-gantt-conn-v {
    border-left-color: #21293b;
}

.dx-gantt .dx-gantt-conn-h {
    border-top-color: #21293b;
}

.dx-gantt .dx-gantt-arrow {
    border: 5px solid #21293b;
}

.dx-gantt .dx-gantt-tm {
    border-left: 1px dashed #70309f;
}

.dx-gantt .dx-gantt-ti {
    border-left: 1px dashed #70309f;
    border-right: 1px dashed #70309f;
    background-color: rgba(112, 48, 159, 0.15);
}

.dx-gantt .dx-gantt-altRow,
.dx-gantt .dx-gantt-collapsable-row {
    background-color: #f2f2f2;
}

/* Adapting DataGrid */
.dx-datagrid {
    border: 1px solid var(--border-color);
}

.dx-datagrid-headers {
    border-bottom: 1px solid var(--border-color);
}

.dx-datagrid-header-panel {
    border-bottom: 1px solid var(--border-color);
}

.dx-datagrid-row {
    border-bottom: 1px solid var(--border-color);
}

    .dx-datagrid-row.dx-state-hover {
        background-color: var(--primary-color-light-90);
    }

    .dx-datagrid-row.dx-state-focused {
        background-color: var(--primary-color-light-80);
    }

    .dx-datagrid-row.dx-selection {
        background-color: var(--primary-color-light-70);
    }

        .dx-datagrid-row.dx-selection.dx-state-hover {
            background-color: var(--primary-color-light-60);
        }

        .dx-datagrid-row.dx-selection.dx-state-focused {
            background-color: var(--primary-color-light-50);
        }

.dx-datagrid-column-chooser {
    border: 1px solid var(--border-color);
}

.dx-datagrid-column-chooser-item {
    background-color: var(--background-color);
    border: 1px solid var(--border-color);
}

    .dx-datagrid-column-chooser-item.dx-state-hover {
        background-color: var(--primary-color-light-90);
    }

    .dx-datagrid-column-chooser-item.dx-state-focused {
        background-color: var(--primary-color-light-80);
    }

    .dx-datagrid-column-chooser-item.dx-selection {
        background-color: var(--primary-color-light-70);
    }

        .dx-datagrid-column-chooser-item.dx-selection.dx-state-hover {
            background-color: var(--primary-color-light-60);
        }

        .dx-datagrid-column-chooser-item.dx-selection.dx-state-focused {
            background-color: var(--primary-color-light-50);
        }

.dx-datagrid-pager {
    background-color: var(--background-color);
    border-top: 1px solid var(--border-color);
}

    .dx-datagrid-pager .dx-pages {
        background-color: var(--background-color);
    }

    .dx-datagrid-pager .dx-page {
        background-color: var(--background-color);
        border: 1px solid var(--border-color);
    }

        .dx-datagrid-pager .dx-page.dx-state-hover {
            background-color: var(--primary-color-light-90);
        }

        .dx-datagrid-pager .dx-page.dx-state-focused {
            background-color: var(--primary-color-light-80);
        }

        .dx-datagrid-pager .dx-page.dx-selection {
            background-color: var(--primary-color-light-70);
        }

            .dx-datagrid-pager .dx-page.dx-selection.dx-state-hover {
                background-color: var(--primary-color-light-60);
            }

            .dx-datagrid-pager .dx-page.dx-selection.dx-state-focused {
                background-color: var(--primary-color-light-50);
            }

    .dx-datagrid-pager .dx-page-size {
        background-color: var(--background-color);
        border: 1px solid var(--border-color);
    }

        .dx-datagrid-pager .dx-page-size.dx-state-hover {
            background-color: var(--primary-color-light-90);
        }

        .dx-datagrid-pager .dx-page-size.dx-state-focused {
            background-color: var(--primary-color-light-80);
        }

        .dx-datagrid-pager .dx-page-size.dx-selection {
            background-color: var(--primary-color-light-70);
        }

            .dx-datagrid-pager .dx-page-size.dx-selection.dx-state-hover {
                background-color: var(--primary-color-light-60);
            }

            .dx-datagrid-pager .dx-page-size.dx-selection.dx-state-focused {
                background-color: var(--primary-color-light-50);
            }

    .dx-datagrid-pager .dx-page-sizes {
        background-color: var(--background-color);
        border: 1px solid var(--border-color);
    }

        .dx-datagrid-pager .dx-page-sizes.dx-state-hover {
            background-color: var(--primary-color-light-90);
        }

        .dx-datagrid-pager .dx-page-sizes.dx-state-focused {
            background-color: var(--primary-color-light-80);
        }

        .dx-datagrid-pager .dx-page-sizes.dx-selection {
            background-color: var(--primary-color-light-70);
        }

            .dx-datagrid-pager .dx-page-sizes.dx-selection.dx-state-hover {
                background-color: var(--primary-color-light-60);
            }

            .dx-datagrid-pager .dx-page-sizes.dx-selection.dx-state-focused {
                background-color: var(--primary-color-light-50);
            }

        .dx-datagrid-pager .dx-page-sizes .dx-page-size {
            background-color: var(--background-color);
            border: 1px solid var(--border-color);
        }

            .dx-datagrid-pager .dx-page-sizes .dx-page-size.dx-state-hover {
                background-color: var(--primary-color-light-90);
            }

            .dx-datagrid-pager .dx-page-sizes .dx-page-size.dx-state-focused {
                background-color: var(--primary-color-light-80);
            }

            .dx-datagrid-pager .dx-page-sizes .dx-page-size.dx-selection {
                background-color: var(--primary-color-light-70);
            }

                .dx-datagrid-pager .dx-page-sizes .dx-page-size.dx-selection.dx-state-hover {
                    background-color: var(--primary-color-light-60);
                }

                .dx-datagrid-pager .dx-page-sizes .dx-page-size.dx-selection.dx-state-focused {
                    background-color: var(--primary-color-light-50);
                }


.dx-datagrid-rowsview .dx-row-focused.dx-group-row,
.dx-datagrid-rowsview .dx-row-focused.dx-group-row .dx-datagrid-group-closed, .dx-datagrid-rowsview .dx-row-focused.dx-group-row .dx-datagrid-group-opened, .dx-datagrid-rowsview .dx-row-focused.dx-group-row .dx-datagrid-summary-item,
.dx-datagrid-headers .dx-datagrid-table .dx-row > td:hover:not(.dx-command-select):not(.dx-command-expand):not(.dx-editor-cell):not(.dx-command-edit):not(.dx-datagrid-group-space),
.dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused) > td, .dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused) > tr > td, .dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused):hover > td, .dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused):hover > tr > td {
    background-color: var(--primary-color-light-90);
    color: var(--text-color);
}


.dx-datagrid-rowsview .dx-row-focused.dx-data-row .dx-command-edit .dx-link, .dx-datagrid-rowsview .dx-row-focused.dx-data-row > td:not(.dx-focused):not(.dx-cell-modified):not(.dx-datagrid-invalid),
.dx-datagrid-rowsview .dx-row-focused.dx-data-row .dx-command-edit .dx-link, .dx-datagrid-rowsview .dx-row-focused.dx-data-row > td:not(.dx-focused):not(.dx-cell-modified):not(.dx-datagrid-invalid) .dx-texteditor-input {
    background-color: var(--primary-color-light-20);
    color: var(--primary-color-text);
}

.dx-row-focused:not(.dx-row-lines), .dx-row-focused:not(.dx-row-lines) > td, .dx-row-focused:not(.dx-row-lines):after {
    border-color: var(--primary-color-light-20);
    border-bottom-color: var(--primary-color-light-20) !important;
}

.dx-datagrid-focus-overlay {
    border: var(--primary-color-light-20);
}

.dx-datagrid-focus-overlay::after {
    background-color: var(--primary-color-light-20);
}

.dx-datagrid-filter-panel .dx-datagrid-filter-panel-clear-filter, .dx-datagrid-filter-panel .dx-datagrid-filter-panel-text {
    color: var(--primary-color);
}

/* Load indicator */
.dx-loadindicator-segment-inner {
    border-color: var(--primary-color) var(--primary-color) transparent;
}

.dx-loadindicator-segment2 .dx-loadindicator-segment-inner {
    border-color: var(--primary-color-light-60);
}

/* Tabs */
.dx-tabs-styling-mode-secondary.dx-tab-indicator-position-bottom .dx-tab.dx-tab-selected .dx-tab-content::after, .dx-tabs-styling-mode-secondary.dx-tab-indicator-position-bottom .dx-tab.dx-tab-selected.dx-state-focused .dx-tab-content::after, .dx-tabs-styling-mode-secondary.dx-tab-indicator-position-top .dx-tab.dx-tab-selected .dx-tab-content::after, .dx-tabs-styling-mode-secondary.dx-tab-indicator-position-top .dx-tab.dx-tab-selected.dx-state-focused .dx-tab-content::after {
    background-color: var(--primary-color);
}

.dx-tabpanel.dx-state-focused .dx-tabpanel-tab.dx-state-focused::after {
    border-color: var(--primary-color);
}

/* Popups */
.dx-popup-wrapper .dx-state-focused.dx-overlay-content {
    border-color: var(--primary-color);
}

/* DatePicker */
.dx-calendar-navigator .dx-calendar-caption-button.dx-button .dx-button-content {
    color: var(--primary-color)
}

.dx-calendar-cell.dx-calendar-today span {
    border: 2px solid var(--primary-color);
}

.dx-calendar-cell.dx-state-hover span {
    color: var(--text-color);
}

.dx-calendar-cell.dx-calendar-selected-date span {
    color: var(--primary-color-text);
    background-color: var(--primary-color);
}

.dx-calendar-cell.dx-calendar-selected-date,
.dx-calendar-cell.dx-calendar-selected-date.dx-calendar-today,
.dx-calendar-cell.dx-calendar-selected-date.dx-calendar-contoured-date,
.dx-calendar-cell.dx-calendar-selected-date.dx-calendar-today.dx-calendar-contoured-date {
    box-shadow: inset 0 0 0 1px #bebebe, inset 0 0 0 1000px var(--primary-color);
}

/* Filter builder */
.dx-filterbuilder .dx-filterbuilder-group .dx-filterbuilder-text.dx-filterbuilder-item-field {
    background-color: var(--primary-color-light-40);
    color: var(--primary-color-text);
}

    .dx-filterbuilder .dx-filterbuilder-group .dx-filterbuilder-text.dx-filterbuilder-item-field:hover,
    .dx-filterbuilder .dx-filterbuilder-group .dx-filterbuilder-text.dx-filterbuilder-item-field.dx-state-active, .dx-filterbuilder .dx-filterbuilder-group .dx-filterbuilder-text.dx-filterbuilder-item-field:focus {
        background-color: var(--primary-color);
        color: var(--primary-color-text);
    }

/* Report editor */
.dx-designer-viewport .dx-accessibility-focus-border-accented, .dx-designer-viewport .dx-accessibility-focus-border-accented:focus {
    outline-color: var(--primary-color-light-20);
}

.dx-designer-viewport .dxd-back-contrast .dxd-back-highlighted:hover {
    background-color: var(--primary-color-light-20);
    color: var(--primary-color-text);
}
