:root,
[data-bs-theme=light] {
    --dxbl-group-header-bg: #6c2a2a;
    --dxbl-fl-group-header-bg: #804242;
    --dxbl-group-header-color: white;
    --dxbl-window-body-backcolor: #e9e4e4;
    --dxbl-window-header-bg: #976d57;
    --tabs-backcolor: #b5b5b5;
    --tabs-backcolor-selected: #ededed;
    --tabs-color: #212529;
    --dxbl-group-header-color: white;
    --menu-backcolor: #ffdada !important;
}

[data-bs-theme=dark] {
    --dxbl-group-header-bg: #412020;
    --dxbl-fl-group-header-bg: #3e1f1f;
    --dxbl-window-body-backcolor: #363b42;
    --dxbl-window-header-bg: #5f3e0f;
    --tabs-backcolor: #3e4246;
    --tabs-backcolor-selected: #212529;
    --dxbl-group-header-color: white;
    --tabs-color: white;
    --menu-backcolor: #3b2b2b !important;
}



.dxbl-window > .dxbl-window-dialog {
    min-height: 200px;
    max-height: 800px;
    width: 95% !important;
}

@media (min-width: 992px) {
    .dxbl-fl .dxbl-fl-item > .dxbl-fl-cpt {
        white-space: normal !important;
    }

    .dxbl-window > .dxbl-window-dialog {
        max-width: 1200px;
    }
}

@media (max-width: 991px) {
    .dxbl-window > .dxbl-window-dialog {
        min-width: 400px;
    }
}


.dxbl-checkbox:not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio).dxbl-readonly.dxbl-checkbox-checked .dxbl-checkbox-check-element, .dxbl-checkbox:not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio).dxbl-readonly.dxbl-checkbox-indeterminate .dxbl-checkbox-check-element {
    /*background-color: white !important;*/
    --dxbl-checkbox-check-element-checked-bg: white !important;
    /*color: white !important;*/
}

.dxbl-accordion {
    width: 100% !important;
}





dxbl-form-layout {
    margin: 20px;
}

dxbl-form-layout-item > label {
    font-weight: bold !important;
}

dxbl-form-layout-item > div {
    font-size: 1rem;
}

.main-gridlayout {
    margin: auto;
    width: 100% !important;
    height: auto;
}

    .main-gridlayout .dxbl-gridlayout-root {
        align-content: center;
        justify-content: center;
    }

.gridlayout-item-fullwidth > div {
    width: 100% !important;
}


dxbl-list-box {
    max-width: 400px !important;
}

dxbl-combo-box {
    max-width: 400px !important;
}

dxbl-date-edit {
    max-width: 200px !important;
}

dxbl-spinedit {
    max-width: 200px !important;
}

.edit-form, .dxbl-window-body {
    background-color: var(--dxbl-window-body-backcolor) !important;
    width: 100%;
    height: 100%;
}

.dxbl-popup-header, .dxbl-window-footer {
    background-color: var(--dxbl-window-header-bg) !important;
}


.edit-form > dxbl-form-layout > dxbl-row {
    padding-bottom: 12px !important;
}


.dxbl-group-header {
    background-color: var(--dxbl-group-header-bg) !important;
    color: white !important;
    
}

.dxbl-fl-group-header-tmpl {
    font-weight: bold !important;
}

.dxbl-menu-item, .dxbl-toolbar-dropdown-item, .dxbl-dropdown-body {
    background-color: var(--menu-backcolor:);
}



.dxbl-tabs-item {
    background-color: var(--tabs-backcolor);
}

    .dxbl-tabs-item.dxbl-active {
        background-color: var(--tabs-backcolor-selected) !important;
        color: var(--tabs-color) !important;
        font-weight: 600 !important;
    }


.dxbl-group-body {
    background-color: var(--group-bg) !important;
}

.dxbl-accordion-group-header:hover {
    color: white !important;
    font-weight:600;
}