html {
    color: #3b3a39;
}

:root {
    --primary-color: #0078d6;
    --secondary-color: #536390;
    --font-color: #333333;
    --header-color: #C8C8C8;
    --heading-color: #f3f2f1;
    --button-hover-color: #f3f2f1;
    --button-active-color: #edebe9;
    --light-gray: #D3D3D3;
    --bg-color: #eff6fc;
    --bg-image: linear-gradient(90deg, var(--dot-bg) calc(var(--dot-space) - var(--dot-size)), transparent 1%) center / var(--dot-space) var(--dot-space), linear-gradient(var(--dot-bg) calc(var(--dot-space) - var(--dot-size)), transparent 1%) center / var(--dot-space) var(--dot-space), var(--dot-color);
    --dot-bg: #eff6fc;
    --dot-color: #d7cfcf;
}

.e-appbar.e-dark {
    background: #3b3a39;
    color: #fff;
    border-color: #3b3a39;
}
    .e-appbar.e-dark .e-menu-wrapper.e-inherit, .e-appbar.e-dark .e-menu-container.e-inherit {
        background: #3b3a39;
        color: #fff;
        border-color: #b3b0ad;
    }

.popup-content-container {
    background-color: white !important;
}

.e-grid.e-gridhover .e-frozenhover:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover .e-row tr:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover:not(.e-rowdrag) .e-row:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowcollapse:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover:not(.e-rowdrag) .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-rtl .e-gridhover .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover .e-row.e-addedrow:not(.e-disable-gridhover):not(.e-detailrow):hover .e-dragindentcell:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowexpand:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell) {
    background-color: #f3f2f1;
    color: #201f1e;
}