/* alternate row colours on the grid dxbl-grid-focused-row */
.DxGrids table tr:nth-child(even):not(.dxbl-grid-empty-row, .dxbl-grid-focused-row),
.DxGridsWPreview > .dxbl-scroll-viewer table tbody tr:not(.dxbl-grid-empty-row, .dxbl-grid-focused-row):nth-of-type(4n+1) {
    /*     background-color: var(--bs-primary-light); */
    /*     background-color: var(--bs-gray-100); */
    background-color: aliceblue;
}

html {
    --bs-success-subtle: #d7ffd0;
}

.form-check-input[type="checkbox"] {
    width: 1.4em;
    height: 1.4em;
}

.form-check .form-check-label {
    padding-top: 0.2em
}

/* DX Firefox fix */
/*
.DXGrids .dxbl-grid-empty-row {
    display: table-row !important;
}
*/

.dx-htmleditor-content img {
    vertical-align: middle;
    padding-right: 10px;
}
/* Associated with the HTML editor, not sure why?
.options {
    margin-top: 20px;
    padding: 20px;
    background-color: rgba(191, 191, 191, 0.15);
    box-sizing: border-box;
    width: 100%;
}
*/

/* Give the group header a bit of color */
.dxbl-fl-group .dxbl-group-header .dxbl-text, .card .card-header > span {
    color: var(--bs-primary);
    font-weight: 500;
}

/* override hyperlink to not underline as per previous bootstrap */
a {
    text-decoration: none;
}

.child-text-decoration-none > * {
    text-decoration: none !important;
}

/* change checkbox colour */
.dxbl-checkbox:not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio):not(.dxbl-disabled).dxbl-checkbox-checked .dxbl-checkbox-check-element,
.dxbl-checkbox:not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio):not(.dxbl-disabled).dxbl-checkbox-indeterminate .dxbl-checkbox-check-element {
    background-color: var(--bs-primary-light);
}

/* remove background from dxtabs */
.dxbl-tabs {
    background: inherit;
}

    .dxbl-tabs > .dxbl-tabs-tablist {
        background-color: inherit !important;
    }

    .dxbl-tabs.dxbl-tabs-top > .dxbl-tabs-tablist > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > ul > li > .dxbl-tabs-item:not(.dxbl-tabs-tmpl):not(.dxbl-disabled):not(:disabled).dxbl-active, .dxbl-tabs.dxbl-tabs-top > .dxbl-tabs-tablist > ul > li > .dxbl-tabs-item:not(.dxbl-tabs-tmpl):not(.dxbl-disabled):not(:disabled).dxbl-active {
        color: var(--bs-primary);
        font-weight: 600;
    }

    .dxbl-tabs.dxbl-tabs-top > .dxbl-tabs-tablist > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > ul > li > .dxbl-tabs-item:not(.dxbl-tabs-tmpl), .dxbl-tabs.dxbl-tabs-top > .dxbl-tabs-tablist > ul > li > .dxbl-tabs-item:not(.dxbl-tabs-tmpl) {
        color: var(--bs-primary-light);
    }

/* Add a space between button in the modal footer! */
.dxbl-modal-footer .btn {
    margin-left: 0.2rem;
    margin-right: 0.2rem;
}

/* Tick for a dropdown item, used in client */
.dropdown-item-checked::before {
    position: absolute;
    left: .4rem;
    content: '\f00c';
    font-family: 'FontAwesome';
    font-weight: 600;
}

.components-reconnect-hide {
    display: none;
}

#components-reconnect-modal:not(.components-reconnect-show) .hide.show,
#components-reconnect-modal:not(.components-reconnect-failed) .hide.failed,
#components-reconnect-modal:not(.components-reconnect-rejected) .hide.rejected {
    display: none !important;
}

.recoDialog {
    width: 95%;
    max-width: 25rem;
    margin-top: -10rem;
    transition: all 1s;
}

#components-reconnect-modal:not(.components-reconnect-hide) .recoDialog {
    margin-top: 1.5rem;
}

.upload_noprogress .dxuc-file-view {
    display: none;
}

.txtunderline-onhover:hover {
    text-decoration: underline;
    cursor: pointer;
}

.w-75px {
    width: 75px;
}

/* Capitalize input fields */
/*
.dxbs-form-control {
    text-transform: capitalize;
}
::-webkit-input-placeholder {
    text-transform: none;
}
:-moz-placeholder {
    text-transform: none;
}
::-moz-placeholder {
    text-transform: none;
}
:-ms-input-placeholder {
    text-transform: none;
}*/

/*@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');*/


/* replace the no data to display message */
.DxGrids .dxbl-grid-empty-data > span {
    display: none;
}
/*
.DxGrids .dxbl-grid-empty-data::after {
    content: '<No data to display>';
}*/

.DxGrids .dxbl-grid-command-cell .dxbl-grid-header-content > span,
.DxGridsWPreview .dxbl-grid-command-cell .dxbl-grid-header-content > span {
    width: 100%;
}

.DxGrids .dxbl-grid-command-cell > a.fa,
.DxGridsWPreview .dxbl-grid-command-cell > a.fa,
.DxGrids .dxbl-grid-command-cell > a.fa-duotone,
.DxGridsWPreview .dxbl-grid-command-cell > a.fa-duotone {
    text-decoration: none;
    cursor: pointer;
}

.DxGrids .dxbl-grid-selected-row .dxbl-grid-command-cell > a.fa,
.DxGridsWPreview .dxbl-grid-selected-row .dxbl-grid-command-cell > a.fa,
.DxGrids .dxbl-grid-selected-row .dxbl-grid-command-cell > a.fa-duotone,
.DxGridsWPreview .dxbl-grid-selected-row .dxbl-grid-command-cell > a.fa-duotone {
    color: inherit;
}

.header_text h5 {
    font-size: 0.90rem
}

.dxgrid-editform-popup .dxbl-grid-edit-form-buttons .btn-secondary {
    color: #fff;
    background-color: var(--danger);
    border-color: var(--danger);
}

.dxgrid-nowrap tbody td {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dxbl-grid .dropdown .btn-link {
    color: inherit;
}

hr {
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
    padding: 0 !important;
    /*mt-0 mb-3 p-0*/
}

.caption {
    font-weight: 600;
    font-size: 0.875rem;
    padding-top: calc(0.25rem + 1px);
    padding-bottom: calc(0.25rem + 1px);
    line-height: 1.5;
}

.login_box {
    margin-top: -15%
}

.combobox-item-template {
    display: flex;
    align-items: center;
}

    .combobox-item-template > img {
        border-radius: 50%;
        width: 2rem;
        height: 2rem;
    }

    .combobox-item-template > i {
        width: 0.8rem;
        height: 1rem;
    }

img + .combobox-item-template-text, i + .combobox-item-template-text {
    margin-left: 0.8rem;
}

.combobox-item-template-text {
    display: flex;
    flex-flow: column;
}

.combobox-item-template-secondary-text {
    opacity: 0.65;
    width: max-content;
}


.dx-chart-title {
    font-size: 1.2em;
}

.form-lbl-dark {
    font-weight: 600;
}

.log_txt {
    color: var(--bs-blue) !important;
    display: inline-block;
    max-height: 50px;
    overflow-y: hidden;
    text-overflow: ellipsis;
}

.fa-provider img {
    width: 100%;
    max-width: 10rem;
}


#login-div form.login-form.login-state-ShowInstructions {
    display: none;
}



.readonly_richedit {
    height: 340px;
    overflow: auto;
}

    .readonly_richedit .rte-toolbar {
        display: none;
    }

.starchecked {
    color: gold;
}

.starunchecked {
    color: var(--bs-secondary);
}

.fas.starchecked,
.fas.starunchecked {
    width: 1.3rem;
}

.font-weight-medium {
    font-weight: 600 !important;
}

.rightmodal {
    right: 0;
    top: 0;
    margin: 0 !important;
    transform: none;
}

h1, h2, h3, h4, h5, h6, p {
    margin: 0;
    padding-top: 0.3em;
    padding-bottom: 0.3em;
}

h1, h2 {
    padding: 0rem 1.2rem;
    line-height: 3.3rem;
    text-transform: uppercase;
}

h2 {
    padding: 0;
}

.job-board-iframe {
    width: 100%;
}


/* ios fixes */
a[type="button"] {
    -webkit-appearance: initial;
}






.outline-none {
    outline: none;
}



dxbl-dropdown > .dxbl-dropdown-dialog.dropdown-max-height {
    max-height: 75vh;
}



.cli_reqdfields {
    background-color: seashell;
}

.postcode-tb {
    max-width: 10em !important;
    min-width: 10em !important;
}

.h-100-input input {
    height: 100% !important;
}

.h-initial-input input {
    height: initial !important;
}

.col-auto-override {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: 100% !important;
}

.col-spacer {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
    padding: 0 !important;
}

dxbl-date-time-edit {
    min-width: 10em !important;
}

.modal-body.dxbl-modal-body .container-fluid,
.dxbl-modal-body.dxbl-modal-body .container-fluid,
/* 25/11/22 DJA  */
.dxbl-modal-body.dxbl-modal-body .container {
    padding: 0;
}

.modal-body.dxbl-modal-body .preview-pane .container-fluid,
.dxbl-modal-body.dxbl-modal-body .preview-pane .container-fluid {
    padding: inherit;
}

.modal-body.dxbl-modal-body .container-fluid.p-col,
.dxbl-modal-body.dxbl-modal-body .container-fluid.p-col,
.dxbl-modal-body.dxbl-modal-body .container.p-col {
    padding-left: 1rem;
    padding-right: 1rem;
}

.modal-body.dxbl-modal-body .container-fluid.padded-verts .row,
.dxbl-modal-body.dxbl-modal-body .container-fluid.padded-verts .row,
.modal-body.dxbl-modal-body .container.padded-verts .row,
.dxbl-modal-body.dxbl-modal-body .container.padded-verts .row,
.container.padded-vert-cols .row > .col,
.container-fluid.padded-vert-cols .row > .col {
    padding-bottom: 1em;
}

    .modal-body.dxbl-modal-body .container-fluid.padded-verts .row:last-child,
    .modal-body.dxbl-modal-body .container.padded-verts .row:last-child,
    .dxbl-modal-body.dxbl-modal-body .container-fluid.padded-verts .row:last-child,
    .dxbl-modal-body.dxbl-modal-body .container.padded-verts .row:last-child,
    .container.padded-vert-cols .row:last-child > .col {
        padding-bottom: 0;
    }

.modal-body.dxbl-modal-body .dxbl-toolbar,
.dxbl-modal-body.dxbl-modal-body .dxbl-toolbar {
    margin-top: 0.5rem !important;
}

.modal-body.dxbl-modal-body .container-fluid .row,
.modal-body.dxbl-modal-body .container .row,
.modal-body.dxbl-modal-body .undo-margin {
    margin-left: -1rem;
    margin-right: -1rem;
}

    .modal-body.dxbl-modal-body .undo-margin:first-child {
        margin-top: -1rem;
    }

.reset-edit-form-padding .dxbl-grid-edit-form {
    padding: 0 !important;
    padding-top: 15px !important;
}

.reset-edit-form-padding .dxbl-grid-edit-form-buttons {
    padding: 0 15px 15px 15px;
}

.cover-div,
.mm-progress-bar[Mode="Modal"] {
    position: fixed;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 1010;
    background: rgba(0,0,0,0.5) !important;
}

    .cover-div.grid-cover-div {
        top: 0;
        bottom: 0;
        height: auto;
        position: absolute;
        background: rgba(220,220,220,0.5) !important;
    }

.disable-div {
    pointer-events: none;
    opacity: 0.4;
}

.mm-progress-bar[Mode="Modal"] {
    position: fixed;
}

.cover-div-js {
    z-index: 1051;
}

.info-header {
    border: 1px solid lightgray;
}

    .info-header li:first-of-type {
        background-color: var(--bs-gray-300);
        font-size: 0.875rem;
        /*font-size: 1.09375rem;*/
        font-weight: 500;
        line-height: 1.2;
    }

.custom-drop-zone {
    padding: 0 !important;
    border-style: dashed !important;
    border-width: 2px !important;
    height: 230px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.preview_image {
    width: 75px;
    height: 75px;
    border: 1px solid;
    background-color: var(--bs-white);
}

.pageheader_preview_image {
    width: 40px;
    height: 40px;
    border: 1px solid;
    /*    background-color: var(--bs-white); */
}

.record_image {
    width: 50px;
    height: 50px;
    border: 1px solid;
    background-color: var(--bs-white);
}

.record_image_large {
    width: 300px;
    height: 300px;
    border: 1px solid;
    background-color: var(--bs-white);
}


.shifts-grid .row > div:nth-child(1) {
    flex: 0 0 50%;
    max-width: 50%;
}

.shifts-grid .row > div {
    flex: 0 0 16.66666667%;
    max-width: 16.66666667%;
    padding-right: 15px;
    padding-left: 15px;
}



.ql-editor {
    background: var(--bs-white);
}


.inrec_gridcontainer {
    min-height: 450px
}
/*
.fl_edit .nav-item {
    outline: 1px solid #26b050;
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}
*/

/* fa icon in a button, apply spacing */
.dx-btn .fa,
.dx-btn .fa-duotone,
.dx-btn .fa-regular {
    width: 1.5rem;
}

.btn.fa,
.btn.fa-duotone,
.btn.fa-regular {
    font-weight: 900;
}

.classfications-container .form-group.row {
    height: 100%;
}

.tr_alt {
    background-color: var(--bs-gray-100);
}

.in-button {
    width: 2rem;
    margin-left: 0.5rem;
    font-size: 1.4rem;
    cursor: pointer;
    vertical-align: middle;
    line-height: 1.5 !important;
}

.peoTitle {
    max-width: 20%;
}

.peoForename {
    max-width: 40%;
}

.colBGGreen {
    background-color: green;
    color: var(--bs-white);
}

.text-green {
    color: green;
}
/* Change the grid colours when the grid is highlighted, for check and crosses */
.dxbl-grid-selected-row .fa-check.text-green, .dxbl-grid-focused-row .fa-check.text-green, .text-lime {
    color: lime !important;
}

.dxbl-grid-selected-row .fa-times.text-danger, .dxbl-grid-focused-row .fa-times.text-danger {
    color: red !important;
}

/* Syncfusion overrides */
.e-grid .e-altrow {
    background-color: var(--bs-gray-100);
}

/*.e-grid .e-headercelldiv, */
.e-grid .e-rowcell,
.e-grid .e-summarycell,
.e-grid .e-row .e-input-group .e-input.e-field, .e-grid .e-headertext {
    font-size: 0.8em !important;
}

xxxxtd.e-rowcell {
    white-space: pre-wrap !important;
}

.e-grid .e-rowcell {
    font-size: 0.8em !important;
}

.e-btn .e-btn-icon {
    font-size: 0.9rem !important;
}

.e-toolbar .e-tbar-btn .e-tbar-btn-text {
    font-size: 0.8rem !important;
    padding: 2px !important;
}

/*
.e-grid .e-headercelldiv, .e-grid .e-headertext {
    font-size: 0.9em !important; 
}

.e-checkbox-wrapper .e-frame, .e-css.e-checkbox-wrapper .e-frame {
    width: 18px !important;
    height: 18px !important; 
}
*/
/* DX Override column chooser padding */
/*
.column-chooser-element-container.list-group-item {
    padding-top: 0.6em;
    padding-bottom: 0.6em;
}
*/
/* DXGrid Settings */
.DxGrids, .DxGridsWPreview, .batch-avail-grid {
    /*    font-size: 0.8rem; */
}

    .DxGrids.hide-edit-form-overflow .dxbl-grid-edit-form {
        overflow-x: hidden;
    }
/* workaround for always showing the menu if overflow is currently hidden */
.dxbl-grid-command-cell {
    overflow: visible !important;
}

/* Change grid selection colour? */
.DxGrids .dxbl-grid-selected-row, .DxGridsWPreview .dxbl-grid-selected-row {
    background-color: var(--bs-primary, inherit) !important;
    color: var(--bs-white);
}

    .DxGrids .dxbl-grid-selected-row .dropdown.grid-dropdown .btn-link,
    .DxGridsWPreview .dxbl-grid-selected-row .dropdown.grid-dropdown .btn-link,
    .DxGrids .dxbl-grid-focused-row .dropdown.grid-dropdown .btn-link {
        color: var(--bs-white);
    }

.DxGrids .HidePreview + tr, .DxGridsWPreview .HidePreview + tr, .DxGridsWPreview .dxbl-grid-empty-cell {
    display: none;
}

/* 15/02/2022, remove checkbox padding where used in a normal cell. */
.DxGrids td:not(.dxbl-grid-selection-cell) .dxbl-checkbox .dxbl-checkbox-check-element {
    margin-top: 0;
    margin-bottom: 0;
}

/* 12/12/2022 DJA, Remove line padding on the grid*/
.DxGrids td.dxbl-grid-command-cell, .DxGridsWPreview td.dxbl-grid-command-cell, batch-avail-grid td.dxbl-grid-command-cell,
.DxGrids td.dxbl-grid-selection-cell, .DxGridsWPreview td.dxbl-grid-selection-cell, batch-avail-grid td.dxbl-grid-selection-cell {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.DxGrids .table-sm, .DxGrids td, .DxGrids .dxbl-grid-header,
.DxGrids td, .DxGrids th,
.DxGridsWPreview .table-sm, .DxGridsWPreview .table-sm td, .DxGridsWPreview .table-sm th,
.DxGridsWPreview td, .DxGridsWPreview th,
.batch-avail-grid .table-sm, .batch-avail-grid .table-sm td, .batch-avail-grid .table-sm th,
.batch-avail-grid td .batch-avail-grid th {
    /*    font-size: 0.85rem !important; */
}
    /* Reduce button sizes in grids e.g Edit */
    .DxGrids th .btn, .DxGrids td .btn,
    .DxGridsWPreview th .btn, .DxGridsWPreview td .btn {
        /*        padding: 0; */
    }
/* 21/11/2022 DJA */
.DxGrids .btn, .DxGridsWPreview .btn {
    padding: 2px 0 2px 0;
}

/* Alter font size for any button images */
.DxGrids .grid-dropdown i, .DxGridsWPreview .grid-dropdown i {
    font-size: 1rem !important;
}
/* when user hovers over the command button then popout a little? */
/*
.DxGrids .grid-dropdown i:hover, .DxGridsWPreview .grid-dropdown i {
    font-size:1.2rem !important; 
*/
} /* *** */

.DxGrids .dx-grid-header-content > :first-child, .DxGridsWPreview .dx-grid-header-content > :first-child,
.DxGrids .dxbl-grid-header-content > :first-child, .DxGridsWPreview .dxbl-grid-header-content > :first-child {
    margin-right: 0;
}

/* remove table borders, amended to just the left/right borders */
.DxGrids > .dxbl-scroll-viewer table tbody tr td, .DxGridsWPreview > .dxbl-scroll-viewer table tbody tr td {
    /*border: 0;*/
    border-left: 0;
    border-right: 0;
}
/*
.DxGrids:not(.DxGridsWPreview) > .dxbl-scroll-viewer table tbody tr:not(.dxbl-grid-empty-row):nth-child(2n),
.batch-avail-grid:not(.DxGridsWPreview) > .card table tbody tr:not(.dxbl-grid-empty-row):nth-child(2n),
.DxGridsWPreview > .dxbl-scroll-viewer table tbody tr:not(.dxbl-grid-empty-row):nth-of-type(4n+1) {
    background-color: var(--bs-gray-100);
}

.dxbl-grid > .dxbl-scroll-viewer table tbody tr.grid-row-even:not(.dxbl-grid-selected-row),
.dxbl-grid > .dxbl-scroll-viewer table tbody tr.grid-row-even:not(.dxbl-grid-selected-row) + tr:not([data-visible-index]):not(.grid-row-odd):not(.dxbl-grid-empty-row) {
    background: var(--bs-white) !important;
}
.dxbl-grid > .dxbl-scroll-viewer table tbody tr.grid-row-odd:not(.dxbl-grid-selected-row),
.dxbl-grid > .dxbl-scroll-viewer table tbody tr.grid-row-odd:not(.dxbl-grid-selected-row) + tr:not([data-visible-index]):not(.grid-row-even):not(.dxbl-grid-empty-row) {
    background: var(--bs-gray-100) !important;
}
*/
.dxbl-grid > .dxbl-scroll-viewer table tbody tr.dxbl-grid-selected-row,
.dxbl-grid > .dxbl-scroll-viewer table tbody tr.dxbl-grid-selected-row.grid-row-odd + tr:not([data-visible-index]):not(.grid-row-odd):not(.grid-row-even):not(.dxbl-grid-empty-row),
.dxbl-grid > .dxbl-scroll-viewer table tbody tr.dxbl-grid-selected-row.grid-row-even + tr:not([data-visible-index]):not(.grid-row-odd):not(.grid-row-even):not(.dxbl-grid-empty-row) {
    background-color: var(--bs-primary, inherit) !important;
    color: var(--bs-white) !important;
}

    .dxbl-grid > .dxbl-scroll-viewer table tbody tr.dxbl-grid-selected-row label.log_txt,
    .dxbl-grid > .dxbl-scroll-viewer table tbody tr.dxbl-grid-selected-row + tr:not([data-visible-index]):not(.grid-row-odd) label.log_txt {
        color: black !important;
    }

.DxGridsWPreview .dxbl-grid-detail-cell {
    /*    background-color:lightgrey; */
    background-color: rgb(245,245,245);
    padding: 0.5rem !important;
    opacity: 0.75;
}

.DxGridsWPreview > .dxbl-scroll-viewer table tbody tr.dxbl-grid-selected-row label.log_txt,
.DxGridsWPreview > .dxbl-scroll-viewer table tbody tr.dxbl-grid-selected-row + tr:not([data-visible-index]):not(.grid-row-odd) label.log_txt {
    color: black !important;
}


.DxGrids.card-fill > .card,
.DxGrids.h-100 > .card {
    height: 100%;
}

.max-w-100-child-tabs + .dx-tabs-content-panel {
    width: 100%;
}

/* Lots of CSS to reduce padding on formlayout! */

.fl_edit {
    /*    padding-left: calc(-.5 * var(--dxbl-row-item-spacing-x));
    padding-right: calc(-.5 * var(--dxbl-row-item-spacing-x)); */
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}

.dxbl-fl.dxbl-fl-limit-width .dxbl-fl-tab-content {
}

/*
@media (min-width: 576px) {
    .dxbl-fl.dxbl-fl-limit-width .dxbl-fl-tab-content:not(.w-100) {
        max-width: 540px;
    }
}
@media (min-width: 768px) {
    .dxbl-fl.dxbl-fl-limit-width .dxbl-fl-tab-content:not(.w-100) {
        max-width: 720px;
    }
}
@media (min-width: 992px) {
    .dxbl-fl.dxbl-fl-limit-width .dxbl-fl-tab-content:not(.w-100) {
        max-width: 960px;
    }
}
@media (min-width: 1200px) {
    .dxbl-fl.dxbl-fl-limit-width .dxbl-fl-tab-content:not(.w-100) {
        max-width: 1140px;
    }
}
*/
@media (min-width: 1350px) {
    .dxbl-fl.dxbl-fl-limit-width .dxbl-fl-tab-content:not(.w-100) {
        max-width: 1350px;
    }
}


.dxbl-modal .fl_edit {
    /*
    padding-left: 0 !important;
    padding-right: 0 !important;
    */
}

.dxbl-modal-body .fl_edit .dxbl-fl-group {
    padding-left: 0.75rem;
}

.dxbl-popup.dxbl-popup-guide {
    max-width: 50vw !important;
}

    .dxbl-popup.dxbl-popup-guide ul {
        margin-bottom: 0;
    }

    .dxbl-popup.dxbl-popup-guide .dxbl-modal-content {
        border: 0 !important;
    }

    .dxbl-popup.dxbl-popup-guide .dxbl-modal-body {
        padding: 0 !important;
    }

.fl_edit .dxbl-fl-group {
    /*
    padding-left:0;
    */
}
/*.fl_edit .dxbl-fl-group {
    padding-right:0;
}*/

.fl_edit .dxbl-row {
    /*    padding-top: 0.2em !important; */
}

    .fl_edit .dxbl-row .form-group,
    .fl_edit .dxbl-group-body-content {
        margin-bottom: 0.4em;
        padding-bottom: 0.2rem !important;
    }

.fl_edit .dxbl-group-header {
    padding-top: 0.2em !important;
    padding-bottom: 0.2em !important;
}

.fl_edit .tab-content {
    padding-top: 0 !important;
}

.dxbl-fl .dxbl-fl-gd {
    margin-bottom: 0 !important;
}

.fl_edit .dxbl-fl .dxbl-fl-gd .dxbl-fl .dxbl-fl-gt {
    margin-bottom: 0 !important;
}

.fl_edit .dxbl-tabs {
    margin-top: 0.4rem;
}

/* Remove padding at bottom of the tab, to avoid scrolling */
.fl_edit .dxbl-fl-tab-content {
    padding-bottom: 0;
}

.padded-tabs .dxbl-tabs {
    padding-left: 15px;
    padding-right: 15px;
}

.fl_edit .dxbl-fl-gt {
    margin-top: 0.6em !important;
    /*    margin: 0 !important;  
    padding: 0 !important; */
}

.dxbl-fl-item-no-top-padding .dxbl-fl-group > .card > .dxbl-row,
.dxbl-fl-item-no-top-padding .dxbl-fl-group .dxbl-row {
    padding-top: 0.5rem !important;
}
/* DJA Test */
.fl_edit .dxbl-row {
    padding-bottom: 0 !important;
}

.fl_edit .dxbl-col {
    margin-top: 0.6rem;
}

.toolbar-dropdown-scrollable {
    max-height: 22rem !important;
}

.main .preview-pane .dxbl-toolbar,
.main .top-row .dxbl-toolbar {
    /*    margin-bottom: 0rem; */
    background: initial;
}

/* To change font family and font size */
.e-richtexteditor .e-rte-content .e-content,
.e-richtexteditor .e-source-content .e-content {
    font-size: 0.8rem;
    font-family: Segoe ui;
}

/* To change font color and content background */
.e-richtexteditor .e-rte-content,
.e-richtexteditor .e-source-content {
    background: seashell;
    color: blue;
}

.content-with-ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.btn .fa + span,
.btn .fa-duotone + span,
.btn .fa-solid + span,
.btn .fa-regular + span,
.btn .fa-kit + span {
    /* width: 1rem; */
    margin-left: 0.5em;
}

.row-reduced-padding {
    /*
    padding-left: 10px;
    padding-right: 10px;
    */
    margin-left: calc(var(--bs-gutter-x) * -0.5);
    margin-right: calc(var(--bs-gutter-x) * -0.5);
    padding-left: calc(var(--bs-gutter-x) * 0.25);
    padding-right: calc(var(--bs-gutter-x) * 0.25);
}

    .row-reduced-padding > div[class^="col"] {
        padding-left: 5px;
        padding-right: 5px;
        padding-left: calc(var(--bs-gutter-x) * 0.25);
        padding-right: calc(var(--bs-gutter-x) * 0.25);
    }




a, .btn-link {
    color: var(--bs-primary);
}

.top-row {
    background-color: var(--bs-gray-100);
    border-bottom: 1px solid var(--bs-gray-300);
    /*    justify-content: flex-end; */
    white-space: nowrap;
    z-index: 1000;
}

.content {
    padding-top: 1.1rem;
}

.navbar-toggler {
    background-color: rgba(255, 255, 255, 0.1);
}

.valid.modified:not([type=checkbox]) {
    /* outline: 1px solid #26b050; */
}

.cand_reqdfields input {
    background: var(--light);
}

.invalid {
    /* outline: 1px solid red; */
}

.validation-message {
    color: var(--bs-danger);
}

.colour-picker {
    border: 1px solid var(--bs-border-color, var(--bs-gray-400, #ced4da));
    aspect-ratio: 1;
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }


/*.dxbs-checkbox .custom-control.custom-switch > .custom-control-label::before {
    width: 2.4rem;
}
*/


@media (max-width: 767.98px) {
    html {
        -webkit-text-size-adjust: none;
        touch-action: pan-y; /*prevent user scaling*/
    }

    .main .top-row.auth {
        justify-content: space-between;
    }

    .main .top-row a, .main .top-row .btn-link {
        margin-left: 0;
    }
}

/* top menu */
.top-row {
    display: none !important;
}


.nav-item > div {
    z-index: 1010;
}

.transform-initial {
    transform: initial !important;
}

.dxbl-grid-table {
    moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -o-user-select: none;
    --dx-grid-selection-color: var(--bs-primary);
}


.mm-awr {
    height: 1.5rem;
    top: 0.2em !important;
    position: absolute;
    -webkit-mask: url(/images/icons/mm-awr.svg) no-repeat center;
    mask: url(/images/icons/mm-awr.svg) no-repeat center;
    background: var(--bs-dark);
}

.mm-icon:before {
    content: "";
    background-repeat: no-repeat;
    height: 1em;
    width: 1em;
    display: inline-block;
    margin-bottom: -0.1em;
}

svg.mm-icon {
    height: 1.4em;
    width: 1.4em;
    margin-bottom: -0.1em;
}

.validation-summary-holder .validation-errors {
    margin: 0;
    padding: 0;
}

.validation-summary-holder .validation-message {
    list-style: none;
}

.dxbl-grid-edit-form .dxbl-grid-edit-form-buttons .btn {
    padding: 0.4em 0.8em !important;
}

/* custom spinner - start */
.arrow-up {
    width: 0;
    height: 0;
    border-left: 5em solid transparent;
    border-right: 5em solid transparent;
    border-bottom-width: 8em;
    border-bottom-style: solid;
    border-bottom-color: var(--bs-black);
}

.arrow-up-red {
    border-bottom-color: rgb(230,44,46);
}
/* custom spinner - finish */


.notification-div {
    font-size: 1.1em;
}

    .notification-div:last-child {
        border-bottom: none !important;
    }

    .notification-div .fa-calendar-day,
    .notification-div .fa-user,
    .notification-div .fa-building,
    .notification-div .fa-briefcase {
        width: 1.2em;
    }

    .notification-div.task-div .btn-sm {
        --bs-btn-font-size: 0.9em;
        --bs-btn-padding-y: 0.1em;
        --bs-btn-padding-x: 0.5em;
    }

.merge-fields-dropdown {
    max-height: 50vh;
    overflow-y: auto;
}

@media (max-width: 575px) {
    .cover-div-js {
        display: none;
    }

    nav.bg-header-grad,
    .main-navX {
        /*
        position: absolute;
        z-index: 9999;
        top: 4rem !important;
        */
        position: sticky;
        top: 0;
        width: 100vw;
        z-index: 1021;
    }
}


.integration-card {
    position: relative;
}

    .integration-card .card-title {
        height: 4rem;
    }

    .integration-card .integration-card-icon {
        height: 4rem;
        position: absolute;
        top: 2rem;
        left: 2rem;
        background-color: white;
    }

    .integration-card .card-text {
        padding-top: 2rem;
        padding-bottom: 2rem;
        padding-left: 2rem;
        padding-right: 2rem;
        align-items: flex-end;
    }

        .integration-card .card-text .h1 {
            line-height: 1em;
            margin: 0;
            padding-top: 0.5em;
        }

.integration-preview .caption {
    font-size: inherit;
    padding-top: 0;
    padding-bottom: 0;
    font-weight: 500;
}

.integration-preview {
    font-size: 1.3em;
}

/* The switch - the box around the slider */
.switch {
    position: relative;
    display: inline-block;
    padding: 0.1em 1em;
}

    /* Hide default HTML checkbox */
    .switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

    /* The slider */
    .switch .slider {
        position: absolute;
        cursor: pointer;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: #ccc;
        -webkit-transition: .4s;
        transition: .4s;
        border-radius: 100em;
    }

        .switch .slider:before {
            position: absolute;
            content: "";
            height: calc(100% - 0.4em);
            bottom: 0.2em;
            background-color: white;
            -webkit-transition: .4s;
            transition: .4s;
            border-radius: 100em;
            aspect-ratio: 1;
            left: 0.2em;
        }

    .switch input:checked + .slider:before {
        left: calc(100% - 1.5em);
    }

    .switch input:checked + .slider {
        background-color: var(--bs-primary);
    }

    .switch input:focus + .slider {
        box-shadow: 0 0 1px var(--bs-primary);
    }