html, body {
    height: 100%;
}

body {
    background-color: #F5F8F8 !important;
}

app {
    display: block;
    height: 100%;
}

p {
    font-family: inherit !important;
}

.dx-toolbar-before {
    display: flex;
}

.cllime-text {
    color: #E6FF53;
}

.cllime-bg {
    background-color: #E6FF53;
}

.clblack-text {
    color: #19242A;
}

.clblack-bg {
    background-color: #19242A;
}

.clpurple-text {
    color: #6941C6;
}

.clpurple-bg {
    background-color: #F9F5FF;
}

.header-logo {
    flex-shrink: 0;
    /*background-color: currentColor;
    -webkit-mask: url('../images/Logo.svg');
    mask: url('../images/Logo.svg');
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;*/
    background-image: url('../images/Logo.svg');
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 20px;
    border-top: 1px solid #EAECF0;
}

.header-left-side {
    display: none !important;
}

.hideGridHeader .dxbl-grid-header-row {
    display: none;
}

#blazor-error-ui {
    background: inherit;
    bottom: 0;
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 100001;
}

.drop-file-icon {
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    width: 42px;
    height: 42px;
    -webkit-mask-image: url(../images/DropFile.svg);
    mask-image: url(../images/DropFile.svg);
}

.custom-center {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: stretch;
    justify-content: space-around;
    align-items: center;
}

.custom-drag-over {
    background-color: #868A8D;
}

.dxbl-btn {
    padding: 8px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
}

.btn:hover {
    color: #212529 !important;
    background-color: transparent !important;
    border-color: transparent !important;
}

.btn:active {
    color: #212529 !important;
    background-color: transparent !important;
    border-color: transparent !important;
}

.NewBtn {
    background-color: #cbd5e1;
    border-radius: 6px;
    color: #fff;
    font-weight: 600;
    padding: 8px 12px;
}

/*.dxbl-text-edit > input, .dxbl-text-edit > textarea {
    padding: 8px 12px !important;
}*/

.header {
    box-shadow: none !important;
    background-color: #FFF;
}

.main {
    border: 1px solid transparent;
    border-radius: 10px;
}

.main-content {
    border: 1px solid transparent;
    border-radius: 10px;
    background-color: #fff;
    padding-top: 20px;
    margin: 0px 15px;
}

/*.xaf-image-overlay {
    position: relative !important;
}*/

.xaf-sidebar {
    /*background-color: rgba(2,27,27,.88);*/
    background-color: #FFF;
}

.sidebar {
    box-shadow: none !important;
}

.collapse-toggle .header-logo {
    display: block !important;
}

.xaf-nav-item {
    background-color: transparent !important;
    color: #344054 !important;
    font-weight: 600 !important;
    margin: 5px !important;
}

.dxbl-group-header.dxbl-accordion-group-header {
    background-color: #FFF;
}

.dxbl-accordion .dxbl-accordion-group .dxbl-accordion-group-header > .dxbl-btn.dxbl-group-expand-btn {
    border: 0;
}

/*.bg-primary {
    background-color: #000 !important;
}*/

.save-btn {
    background-color: #7F56D9;
    color: #fff;
    font-weight: 600;
}

.basic-btn {
    background-color: #7F56D9 !important;
    padding: 10px 20px !important;
    border: 2px solid #7F56D9 !important;
    color: #fff !important;
    font-weight: 600;
    font-size: 16px;
}

.cashbook-btn {
    background-color: #7F56D9 !important;
    padding: 10px 20px !important;
    border: 2px solid #7F56D9 !important;
    color: #fff !important;
    font-weight: 600;
    font-size: 16px;
}

.cash-btn {
    background-color: #47d2a5 !important;
    padding: 10px 20px !important;
    border: 2px solid #47d2a5 !important;
    color: #fff !important;
    font-weight: 600;
    font-size: 16px;
}

.card-btn {
    background-color: #a568bc !important;
    padding: 10px 20px !important;
    border: 2px solid #a568bc !important;
    color: #fff !important;
    font-weight: 600;
    font-size: 16px;
}

.voucher-btn {
    background-color: #1db9ca !important;
    padding: 10px 20px !important;
    border: 2px solid #1db9ca !important;
    color: #fff !important;
    font-weight: 600;
    font-size: 16px;
}

.invoice-btn {
    background-color: #3D4C66 !important;
    padding: 10px 20px !important;
    border: 2px solid #3D4C66 !important;
    color: #fff !important;
    font-weight: 600;
    font-size: 16px;
}

.dxbl-pager-active-page-btn {
    background-color: #7F56D9 !important;
}

.dxbl-checkbox.dxbl-checkbox-switch.dxbl-checkbox-checked .dxbl-checkbox-check-element {
    background-color: #7F56D9 !important;
}

.dxbl-checkbox:not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio):not(.dxbl-disabled):not(:disabled):not(.dxbl-readonly).dxbl-checkbox-checked .dxbl-checkbox-check-element, .dxbl-checkbox:not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio):not(.dxbl-disabled):not(:disabled):not(.dxbl-readonly).dxbl-checkbox-indeterminate .dxbl-checkbox-check-element {
    background-color: #7F56D9 !important;
}
/*.dxbl-accordion-item-content .dxbl-active {
    background-color: #4dc779 !important;
    border-radius: 10px !important;
}*/
.dxbl-accordion .dxbl-accordion-group .dxbl-accordion-item:not(.dxbl-accordion-group):not(.dxbl-disabled):not(:disabled).dxbl-active > .dxbl-accordion-item-content {
    /*background-color: #4dc779 !important;*/
    /*background-color: #cbd5e1 !important;*/
    background-color: #F9FAFB;
    border-radius: 2px;
    /*border-radius: 10px !important;*/
}

.dxbl-group > .dxbl-group-header > .dxbl-btn.dxbl-group-expand-btn > svg.dxbl-image {
    color: #98A2B3 !important;
    width: 12px;
}

.dxbl-accordion .dxbl-accordion-group:not(.dxbl-disabled):not(:disabled):not(.dxbl-accordion-filter) > .dxbl-accordion-group-header:hover {
    background-color: #F9FAFB;
}

.dxbl-accordion .dxbl-accordion-group .dxbl-accordion-item-content > .dxbl-image:not(:last-child) {
    margin-right: 0.8rem !important;
}

.xaf-nav-menu-item-icon {
    width: 20px;
    height: 20px;
    max-width: 20px;
    max-height: 20px;
}

.dxbl-group {
    border: 0 !important;
}

    .dxbl-group > .dxbl-group-header {
        border-bottom: 1px solid #EAECF0 !important;
        background-color: #FFF;
    }

    .dxbl-group:not(.expanded):not([is-animating]) > .dxbl-group-header {
        border-bottom: none !important;
    }

.dxbl-accordion .dxbl-accordion-group:not(.dxbl-accordion-filter) > .dxbl-accordion-group-header {
    border-bottom: none !important;
}

.clickable-xaf-nav-item > a .xaf-nav-link, .clickable-xaf-nav-item > div > a .xaf-nav-link {
    text-decoration: none !important;
    color: #344054;
}
.xaf-nav-link {
    color: #344054;
    font-weight: 500;
}
/*.dxbl-text-edit > input, .dxbl-text-edit > textarea {
    color: #111827 !important;
    font-size: .875rem !important;
    line-height: 1.25rem;
    padding: .625rem;
}
.dxbl-text-edit {
    border-radius: 8px !important;
}*/
.dxbl-btn-primary .dxbl-btn-secondary {
    padding-top: .625rem;
    padding-bottom: .625rem;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}

.btn-primary {
    color: #fff !important;
    background-color: #7F56D9 !important;
    border-color: #7F56D9 !important;
}

.dxbl-btn-primary {
    background-color: #7F56D9 !important;
}

.dxbl-spin-btn-inc {
    padding: 0 !important;
}

.btn-link {
    color: #7F56D9 !important;
    background-color: transparent !important;
    font-weight: 600;
}

.dxbl-grid {
    border: 0 !important;
}

    .dxbl-grid .dxbl-grid-table > tbody > tr, .dxbl-grid .dxbl-grid-table > tfoot > tr, .dxbl-grid .dxbl-grid-table > thead > tr {
        background-color: #fff !important;
    }

        .dxbl-grid .dxbl-grid-table > tbody > tr > td, .dxbl-grid .dxbl-grid-table > tbody > tr > th, .dxbl-grid .dxbl-grid-table > tfoot > tr > td, .dxbl-grid .dxbl-grid-table > tfoot > tr > th, .dxbl-grid .dxbl-grid-table > thead > tr > td, .dxbl-grid .dxbl-grid-table > thead > tr > th {
            border-left-width: 0px !important;
            padding: 10px !important;
        }

    .dxbl-grid .dxbl-grid-table > thead .dxbl-grid-header-row > th:not(.dxbl-grid-empty-cell) {
        color: #111827 !important;
    }

.table-bordered > :not(caption) > * > * {
    border-width: 0 !important;
}

.table-sm > :not(caption) > * > * {
    padding: 8px 12px;
}

/*.dxbl-grid > .dxbl-grid-bottom-panel, .dxbl-grid > .dxbl-grid-top-panel {
    display: none;
}*/

.CustomerName {
    color: purple;
}

.CustomerAddress {
    color: aquamarine;
    font-size: 16px;
    font-weight: 600;
}

/*.dxbl-image:not(.dxbl-image-fill) {
    fill: #2797E8 !important;
}*/