[data-mode=dark] html {
    background: #141414;
}


[data-mode=dark] body {
    --bs-body-bg: #1F1F1F;
    --bs-body-color: #F8F8F8;
}

[data-mode=dark] p {
    --tw-text-opacity: 1;
    color: rgb(169 169 169);
}

[data-mode=dark] .icon-container:hover {
    background-color: #4c4c4c;
}
[data-mode=dark] .text-black {
    color: #cdcdcd;
}

[data-mode=dark] .sidebar ul.sub-menu li a:hover {
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity));
}

[data-mode=dark] .sidebar .nav-item > a.active {
    color: white;
}
[data-mode=dark] .sidebar ul.sub-menu li a.active {
   color:white;
}



[data-mode=dark]  .dx-datagrid {
    color: #fff;
}
[data-mode=dark] .dx-datebox-date .dx-dropdowneditor-icon{
    color: #dedede;
}

[data-mode=dark]  .dx-datagrid-table {
    background-color: #4d4d4d; 
    color: #fff;
}
/* [data-mode=dark] .dx-datagrid>.dx-datagrid-headers {
    background-color: #2a2a2a;
} */

[data-mode=dark]  .dx-datagrid .dx-row-alt > td {
    background-color: #343434;
}

[data-mode=dark]  .dx-datagrid .dx-row {
    /* background-color: #2a2a2a; */
    background-color: #2a2a2a;
}
[data-mode=dark] .dx-editor-cell .dx-texteditor .dx-texteditor-input {
    background-color: #343331;
    color: #fff;
}

[data-mode=dark] .dx-editor-cell .dx-dropdowneditor {
    background-color: #343434;
    color: #fff;
}

[data-mode=dark] .dx-calendar {
    background-color: #343434;
}
[data-mode=dark] .dx-calendar-navigator .dx-button {
    color: white;
}
[data-mode=dark] .dx-calendar-navigator .dx-button .dx-icon{
    color: white;
}


[data-mode=dark] .dx-datagrid .dx-column-lines>td {
    border-left: 1px solid #4d4d4d;
    border-left-width: 1px;
    border-left-style: solid;
    border-left-color: rgb(77, 77, 77);
    border-right: 1px solid #4d4d4d;
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: rgb(77, 77, 77);
}

[data-mode=dark].dx-datagrid-borders .dx-datagrid-rowsview, .dx-datagrid-headers+.dx-datagrid-rowsview, .dx-datagrid-rowsview.dx-datagrid-after-headers {
    border-top: 1px solid #4d4d4d;
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: rgb(77, 77, 77);
}
[data-mode=dark].dx-datagrid-rowsview .dx-row {
    border-top: 1px solid #4d4d4d;
    border-bottom: 1px solid #4d4d4d;
}


[dark-mode=dark] .dx-datagrid > .dx-datagrid-headers{
    border-top: 1px solid #4d4d4d;
    border-bottom: 1px solid #4d4d4d;
    border-left: 1px solid #4d4d4d;
    border-right: 1px solid #4d4d4d;
}


[data-mode=dark] .dx-datagrid-borders > .dx-datagrid-rowsview{
    border-top: 1px solid #4d4d4d;
    border-bottom: 1px solid #4d4d4d;
    border-left: 1px solid #4d4d4d;
    border-right: 1px solid #4d4d4d;
    
}

[data-mode=dark] .dx-datagrid-borders > .dx-datagrid-headers{
    border-top: 1px solid #4d4d4d;
    border-bottom: 1px solid #4d4d4d;
    border-left: 1px solid #4d4d4d;
    border-right: 1px solid #4d4d4d;
    
}

[data-mode=dark] .dx-datagrid-rowsview{
    border-top: 1px solid #4d4d4d;
    border-bottom: 1px solid #4d4d4d;  
    border-left: 1px solid #4d4d4d;
    border-right: 1px solid #4d4d4d;
}

[data-mode=dark] .dx-datagrid-borders .dx-datagrid-rowsview, [data-mode=dark].dx-datagrid-headers , [data-mode=dark].dx-datagrid-rowsview
{
    
    border-top: 1px solid #4d4d4d;
}
[data-mode=dark] .dx-texteditor-input {
    background: #4d4d4d;
    color: #fff;
}


[data-mode=dark] .dx-texteditor.dx-editor-outlined {
    border-color: #4d4d4d;
    background: #4d4d4d;
}
[data-mode=dark] .dx-button-mode-contained {
    border-color: #4d4d4d;
    color: #fff;
    background: #4d4d4d;
}
[data-mode=dark] .dx-button-mode-contained.dx-state-hover {
    border-color: #4d4d4d;
    color: #4d4d4d;
    background:white;
}

[data-mode=dark] .sidebar ul.sub-menu li a.active,
[data-sidebar=dark] .sidebar ul.sub-menu li a.active {
    color: #fff9;
}


[data-mode=dark] .dxbl-scheduler-color {
    --dxbl-scheduler-light-color: #4a4a4a;
}

[data-mode=dark] .sidebar ul.sub-menu li a.active:before {
    background-color: rgb(153 153 153);
}

[data-mode=dark] .sidebar ul.sub-menu li a:hover:before {
    background-color: rgb(255 255 255);
}