/*--------LOADING OVERRIDE---------*/
.spinner-border {
    border: .2em solid var(--sprinttek-load-secondary);
    border-right-color: transparent;
}

#loadingBackground img.loading-image {
    width: 140px !important;
    height: 140px !important;
    border-radius: 300px;
}

#loadingBackground img.loading-image {
    width: 140px !important;
    height: 140px !important;
    border-radius: 300px;
}

.loading-items-center > .bg-primary {
    background-color: var(--sprinttek-tertiary);
    background: var(--sprinttek-tertiary-custombg) !important;
}

.loading-items-center > .border-primary {
    border-color: var(--sprinttek-tertiary) !important;
}

html, body {
    height: 100%;
    font-size: 0.875rem;
}

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

.header-logo {
    flex-shrink: 0;
    background-color: currentColor;
    background: url('DynamicLogoHandler');
    background-position: left;
    background-repeat: no-repeat;
    background-size: contain;
    width: 250px;
    height: 35px;
}

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

.dxbl-modal > .dxbl-modal-root > .dxbl-popup > .dxbl-modal-content > .dxbl-modal-body {
    padding: var(--dxbl-popup-body-padding-y) var(--dxbl-popup-body-padding-x) !important;
    -webkit-box-flex: 1 !important;
    -webkit-flex: 1 1 auto !important;
    -ms-flex: 1 1 auto !important;
    flex: 1 1 auto !important;
}

    .dxbl-modal > .dxbl-modal-root > .dxbl-popup > .dxbl-modal-content > .dxbl-modal-body > .dxbl-fl.dxbl-fl-with-paddings {
        --dxbl-fl-padding-x: 0 !important;
        --dxbl-fl-padding-y: 0 !important;
    }

.dxbl-scheduler .dxbl-week-button {
    display: inline-flex !important;
}

/* STek Custom styles */
.addressDetailPopup {
    max-width: 800px !important;
}

.hidden-item {
    display: none;
}

.block-item {
    display: block;
}

.loading-caption {
    display: none;
    color: transparent;
    background: url(../images/SprintTek-txt.png) center center no-repeat;
    background-size: contain;
    width: 100%;
    height: 50px;
}

.dxbl-accordion-item-text-container a:focus .xaf-navigation-link-click-area {
    border-color: transparent !important;
}
/*-----Dynamic Logo-----*/
.header-logo {
    flex-shrink: 0;
    background-color: currentColor;
    background: url('DynamicLogoHandler');
    background-position: left;
    background-repeat: no-repeat;
    background-size: contain;
    width: 250px;
    height: 35px;
}

.dx-icon-delivery-process {
    font-size: 100px;
    color: #252525;
    margin-top: 30px;
}

.driver-app-delivery-process-icon-container {
    margin: auto;
    height: 160px;
    border: 1px solid darkgray;
    border-radius: 5px;
}

.dx-icon-delivery-process-attachment-action {
    font-size: 22px;
    color: #ffffff;
    background-color: #252525;
    float: right;
    position: relative;
    padding: 10px;
    margin-top: 10px;
    margin-right: 10px;
}

.driver-app-delivery-process-signature-container {
    margin: auto;
    width: 100%;
    height: 160px;
    border: 1px solid darkgray;
    border-radius: 5px;
}

/* Google Places autocomplete fix for modal */
div.pac-container {
    z-index: 99999999999 !important;
}

/*---------------------SprintTek Override------------------------*/
/*-------General Override-----*/
*:not(.dxbl-image, .dxbl-image::before) {
    font-family: var(--sprinttek-fontfamily) !important;
}

html, body {
    font-family: var(--sprinttek-fontfamily) !important;
    font-weight: 400;
    /*font-size: 0.9rem;*/
}

.align-items-center {
    align-items: center;
    display: flex;
}

.row {
    display: flex;
    flex-wrap: wrap;
}

.col, .col-md {
    flex: 1 0 0%;
    padding: 0px 6px;
}

.xaf-loading-content > .spinner-border {
    border-color: var(--sprinttek-primary);
    border-left-color: transparent !important;
}

.components-rejoining-animation div {
    color: var(--sprinttek-primary) !important;
}
/*-------Form Override-----*/
.filter-wrapper {
    border-radius: 10px;
}
.dx-filtereditor .dx-filtereditor-tree {
    border-radius: 6px;
}
/*.dxbl-text-edit:has(textarea) {
    border: 1px solid var(--sprinttek-lightgrey) !important;
    padding: 5px;
    border-radius: 5px;
}*/
table tr td .dxbl-text-edit > .dxbl-text-edit-input,
table tr td .dxbl-text-edit > .dxbl-text-edit-template,
table tr td .dxbl-text-edit > .dxbl-text-edit-template .dxbl-text-edit-input,
table tr td .dxbl-text-edit > textarea,
table tr td .dxbl-text-edit.xaf-combobox-with-template .dxbl-text-edit-template {
    padding: 2px 6px 2px 6px;
}

.progress-bar {
    background-color: var(--sprinttek-greendiamond);
    background: var(--sprinttek-green-custombg) !important;
}

.dxbl-list-box-render-container > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > ul > li.dxbl-list-box-item-selected:not(.dxbl-list-box-item-disabled)::before, .dxbl-list-box > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > ul > li.dxbl-list-box-item-selected:not(.dxbl-list-box-item-disabled)::before {
    background: var(--sprinttek-primary-custombg);
}
/*-----GRID OVERRIDE-------*/
.dxbl-grid-group-panel-container dxbl-grid-header-content.dxbl-grid-header-content {
    margin-top: 5px;
}

.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;
}

.dxbl-grid .dxbl-grid-table > tbody > tr:not(.dxbl-grid-edit-row):not(.dxbl-grid-empty-row):not(.dxbl-grid-filter-row):not([dxbl-top-virtual-spacer-element]):not([dxbl-bottom-virtual-spacer-element]) > td:not(.dxbl-grid-indent-cell):not(.dxbl-grid-expand-button-cell):not(.dxbl-grid-row-drag-anchor-cell):not(.dxbl-grid-empty-cell):not(.dxbl-grid-empty-data-area):not(.dxbl-grid-edit-form):not(.dxbl-grid-detail-cell) {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
}

.dxbl-grid.DispatchDashboard_View .dxbl-grid-table > tbody > tr:not(.dxbl-grid-edit-row):not(.dxbl-grid-empty-row):not(.dxbl-grid-filter-row):not([dxbl-top-virtual-spacer-element]):not([dxbl-bottom-virtual-spacer-element]) > td:not(.dxbl-grid-indent-cell):not(.dxbl-grid-expand-button-cell):not(.dxbl-grid-row-drag-anchor-cell):not(.dxbl-grid-empty-cell):not(.dxbl-grid-empty-data-area):not(.dxbl-grid-edit-form):not(.dxbl-grid-detail-cell) {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
}

.dxbl-grid .dxbl-grid-table > tbody > tr.dxbl-grid-editor-inplace-container > td .dxbl-text-edit::after {
    border-bottom: 2px solid var(--sprinttek-primary) !important;
}

/*.app.collapse-toggle table.dxbl-grid-table {
    overflow: auto;
}*/
/*table.dxbl-grid-table {
    overflow: hidden;
   
}*/
.nested-content > .grid-content.grid-virtual-scrolling-mode dxbl-grid.DispatchDashboard_View {
    max-height: calc(78vh - 50px);
}

#main-view-content:has(.dxbl-group[expanded-state="False"]) .nested-content > .grid-content.grid-virtual-scrolling-mode dxbl-grid.DispatchDashboard_View {
    max-height: calc(90vh - 120px);
}
/*-----ORDER OVERRIDE-----*/
.order-notes .dxbl-memo-edit {
    /*height: 130px;*/
}

.order-composite-pickup .dxbl-memo-edit,
.order-composite-delivery .dxbl-memo-edit,
.order-composite-start .dxbl-memo-edit,
.order-composite-group .dxbl-memo-edit {
    min-height: 165px;
}

.order-composite-start {
}

.order-composite-group .dxbl-memo-edit {
}

.nameadd-head {
    margin-bottom: 10px;
}

.box-nameadd {
    min-height: 140px;
}

.btn-nameadd {
    height: 20px;
    font-size: .6rem;
    text-transform: uppercase;
    font-weight: 700;
    padding-left: 5px;
    padding-right: 5px;
}
/*------SprintTek Branding------*/
.logon-template-header .header-logo {
    flex-shrink: 0;
    background-color: currentColor;
    background: url('../images/sprinttek-logo-main.svg');
    background-position: left;
    background-repeat: no-repeat;
    background-size: contain;
    width: 250px;
    height: 35px;
    filter: brightness(0) invert(1);
}


.logon-template-header .header-logo {
    background-position: left;
    width: 100%;
    height: 60px;
}

.circle-bg .loading-image {
    width: 100%;
    height: 100%;
}

.loading-image {
    width: 120px !important;
    height: 120px !important;
}
/*---------------------------------------Theme CSS Override START---------------------------------------------*/
/*-----BRANDING OVERRIDE-----------*/
/*html:has(head link#xaf-current-theme[href='sprinttek-light.css']) {background: red !important;}*/
.company-logo-main .xaf-image-container {
    background-color: var(--sprinttek-lighttext);
    background: var(--sprinttek-lighttext-custombg) !important;
}

.logo-tabs {
    padding-left: 0px;
}

.company-logo-alt .xaf-image-container {
    background-color: var(--sprinttek-darkgrey);
    background: var(--sprinttek-darkgrey-custombg) !important;
}

    .company-logo-main .xaf-image-container img, .company-logo-alt .xaf-image-container img {
        border-radius: 0px;
    }

.logo-darkmode {
    background-color: var(--sprinttek-darkgrey);
    background: var(--sprinttek-darkgrey-custombg) !important;
}

    .logo-darkmode .img-thumbnail, .logo-darkmode .xaf-image-overlay.xaf-image-clickable-overlay {
        background: transparent;
        border: 0px;
    }

    .logo-darkmode .xaf-image.xaf-preview-image-detail-view {
        background: #FFFFFF !important;
    }

@media only screen and (min-width: 1100px) {
    .sprinttek-company-logos {
        width: 25%;
    }

    .sprinttek-company-details {
        width: 75%;
    }
}
/*--------LOADING OVERRIDE---------*/
.spinner-border {
    border: .2em solid var(--sprinttek-secondary);
    border-right-color: transparent;
}

.border-primary {
    border-color: var(--sprinttek-primary) !important;
}

.bg-primary {
    background-color: var(--sprinttek-primary) !important;
    background: var(--sprinttek-primary-custombg) !important;
}

.loading-floated-circle {
    border-color: var(--sprinttek-primary) !important;
}
/*------ICON OVERRIDE-----------*/
/*.xaf-caption-icon, .xaf-toolbar-item-icon:not(.dxbl-btn-primary .xaf-toolbar-item-icon), .xaf-layout-tab-icon, .xaf-layout-group-icon, .xaf-combobox-icon {
    filter: invert(0%) sepia(100%) saturate(400%) hue-rotate(180deg) brightness(86%) contrast(170%);
}*/
.xaf-sidebar .dxbl-image.xaf-nav-menu-item-icon,
.dxbl-tabs-text-container .dxbl-image.xaf-layout-tab-icon {
    filter: var(--icon-filter) !important;
    max-width: 18px;
    max-height: 18px;
    width: 18px;
    height: 18px;
}

.xaf-caption-icon, .xaf-toolbar-item-icon:not(.dxbl-btn-primary .xaf-toolbar-item-icon),
.xaf-layout-tab-icon, .xaf-layout-group-icon,
.xaf-combobox-icon,
.dxbl-btn.dxbl-btn-text-secondary .dxbl-image,
.xaf-action.xaf-inline-action button img,
.dxbl-btn.dxbl-btn-primary.dxbl-disabled img {
    filter: grayscale(100%);
}


.dxbl-btn:hover:not(.dxbl-disabled):not(:disabled) .xaf-caption-icon,
.dxbl-btn:hover:not(.dxbl-disabled):not(:disabled) .xaf-toolbar-item-icon:not(.dxbl-btn-primary .xaf-toolbar-item-icon),
.dxbl-btn:hover:not(.dxbl-disabled):not(:disabled) .xaf-layout-tab-icon,
.dxbl-btn:hover:not(.dxbl-disabled):not(:disabled) .xaf-layout-group-icon,
.dxbl-btn:hover:not(.dxbl-disabled):not(:disabled) .xaf-combobox-icon,
.dxbl-btn.dxbl-btn-text-secondary:hover .dxbl-image,
.xaf-action.xaf-inline-action button:hover img,
.dxbl-btn.dxbl-btn-primary img,
.dxbl-btn[data-action-name="New"] img {
    filter: invert(50%) sepia(100%) saturate(400%) hue-rotate(290deg) brightness(290%) contrast(100%) !important;
}
/*------LOGIN OVERRIDE------*/
.sprinttek-login {
    height: 100vh;
    /*background: url(../images/st-login-bg3.jpg) 0 0 no-repeat;*/
    background-size: cover;
}

    .sprinttek-login::before {
        content: "";
        height: 100vh;
        width: 100vw;
        /*background: linear-gradient(0deg, rgba(var(--secondary),.5) 0%, rgba(var(--primary),.5) 100%);*/
        mix-blend-mode: color;
        display: block;
        position: fixed;
    }

    .sprinttek-login .row {
        height: 100vh;
        position: absolute;
        z-index: 1;
        width: 100%;
        height: 100vh;
        /*background: rgba(0,0,0,0.35);*/
    }

    .sprinttek-login .login-form .app {
        background: transparent !important;
    }

.login-logo img {
    max-width: 230px;
    margin: 0 auto;
    display: block;
}

.logon-template-body {
    padding: 5px;
}

.login-form {
    padding: 0px;
    padding-top: 30px;
    margin: auto;
    background: #FFF;
    color: var(--sprinttek-darktext);
    box-shadow: 0 0px 40px 40px rgba(var(--darkgrey),0.1);
    border-radius: 20px;
    max-width: 450px;
    width: 100%;
}

.logon-main {
    max-width: 410px;
    width: 100%;
    box-shadow: none !important;
    border-radius: 0 !important;
    border: 0px;
}

    .logon-main.card .logon-toolbar .dxbl-toolbar {
        min-width: 100% !important;
    }

    .logon-main.card .card-header {
        background: rgba(var(--lightgrey), 0);
        font-size: 1.4rem;
        font-weight: 700;
        padding: 1.5rem 2rem 1.5rem 2rem;
    }

    .logon-main.card .card-body {
        padding: 2rem 2rem;
    }

    .logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-toolbar {
        display: block;
    }

    .logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group {
        display: block;
        margin: 0px 0px 20px 0px;
    }

    .logon-main.card .dxbl-text-edit-input {
        font-size: 1.2rem;
        height: 30px;
    }
    /*Hide Register Button*/
    .logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group:has(button[data-action-name="Register"]),
    .logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Register"] {
        display: none;
    }

    .logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group:has(button[data-action-name="Reset Password"]) {
        margin-bottom: 0px;
    }

.logon-bottom-toolbar.dxbl-toolbar.dxbl-toolbar-adaptive.dxbl-loaded:last-child .dxbl-btn-toolbar > .dxbl-btn-group.dxbl-toolbar-group button {
    padding: 10px 15px !important;
    font-size: 1rem;
    font-weight: 700;
}

    .logon-bottom-toolbar.dxbl-toolbar.dxbl-toolbar-adaptive.dxbl-loaded:last-child .dxbl-btn-toolbar > .dxbl-btn-group.dxbl-toolbar-group button[title="Google"] {
    }

    .logon-bottom-toolbar.dxbl-toolbar.dxbl-toolbar-adaptive.dxbl-loaded:last-child .dxbl-btn-toolbar > .dxbl-btn-group.dxbl-toolbar-group button[title="Microsoft"] {
        background: rgb(0, 103, 184);
        border-color: rgb(0, 103, 184);
        color: #FFF;
    }

    .logon-bottom-toolbar.dxbl-toolbar.dxbl-toolbar-adaptive.dxbl-loaded:last-child .dxbl-btn-toolbar > .dxbl-btn-group.dxbl-toolbar-group button span {
        display: none !important;
    }

.logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Log In"], .logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Ok"] {
    height: 50px;
    font-weight: 700;
    font-size: 1.5rem;
    text-transform: uppercase;
    border: 0px;
}
.dxbl-btn:not(.dxbl-disabled):not(:disabled):focus-visible {
    border-color: rgba(var(--primary), 0.5);
    outline: none;
}

.logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Register"] {
    padding: 5px;
    font-size: 1.2rem;
}

.logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Reset Password"], .logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Cancel"] {
    border: 0px;
    display: block;
}

    .logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Register"] img, .logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Reset Password"] img, .logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Cancel"] img {
        display: none;
    }

    .logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Reset Password"] span, .logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Cancel"] span {
        display: inline;
        margin: 0px;
        text-decoration: underline;
        color: var(--sprinttek-primary);
        font-weight: 700;
    }

    .logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Register"]:hover span, .logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Reset Password"]:hover span, .logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Cancel"]:hover span {
        color: var(--sprinttek-darkgrey);
    }

.login-form .logon-template-header, #logon-template-component .logon-template-header {
    display: none !important
}

#logon-template-component:not(.sprinttek-login #logon-template-component) {
    /*background: linear-gradient(to bottom, rgba(0,0,0,1) 0%,rgba(26,54,137,1) 41%,rgba(26,54,137,1) 41%,rgba(26,54,137,1) 53%,rgba(0,0,0,1) 100%);*/
    background: url(../images/st-login-bg3.jpg) 0 0 no-repeat;
    background-size: cover;
}

    #logon-template-component:not(.sprinttek-login #logon-template-component) .logon-template-body {
        overflow: hidden;
    }

#logon-template-component:has(.xaf-item-newpassword) {
    background: url(../images/pw-change-bg.jpg) 0 0 repeat !important;
}

    #logon-template-component:has(.xaf-item-newpassword) .logon-main-container {
        backdrop-filter: blur(3px);
        width: 101%;
        margin-left: -6px;
        margin-top: -6px;
        margin-bottom: -6px;
    }

    #logon-template-component:has(.xaf-item-newpassword) .logon-main {
        max-width: 410px;
        width: 410px;
        box-shadow: 0 0px 40px 40px rgba(var(--darkgrey),0.1) !important;
        border-radius: 20px !important;
    }

.login-form label:not(.stek-register label) {
    font-weight: 700;
    display: none;
}

#logon-template-component .card-body .logon-main-container button {
    height: 50px;
    font-weight: 700;
    font-size: 1.5rem;
    text-transform: uppercase;
}

.login-form input:-webkit-autofill, .login-form input:-webkit-autofill:focus {
    transition: background-color 600000s 0s, color 600000s 0s;
}

.logon-main.card input:-webkit-autofill::first-line {
    font-size: 1.2rem !important;
    border: 2px solid red;
}

.login-form input, .login-form input:focus {
}

.login-form .xaf-static-text.white-space-pre-line {
    width: 100%;
    font-weight: 500;
}

.login-form h1 {
    text-align: center;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 1.5rem;
    margin-bottom: 10px;
    display: none;
}

.login-form .dxbl-fl-ctrl dxbl-input-editor#UserName, .login-form .dxbl-fl-ctrl dxbl-input-editor#Password {
    border-radius: 4px;
    padding: 10px 14px;
    border: 1px solid rgba(26,32,29,0.2)
}

.login-form .dxbl-fl-ctrl .xaf-validation-message-container input,
.login-form .dxbl-fl-ctrl .xaf-validation-message-container input.dxbl-text-edit-input,
.login-form .dxbl-fl-ctrl .xaf-validation-message-container input:-webkit-autofill,
.login-form .dxbl-fl-ctrl .xaf-validation-message-container input:-webkit-autofill:focus {
    background: transparent !important;
    font-size: 1.1rem;
}
/*.login-form .dxbl-fl-ctrl .xaf-validation-message-container .dxbl-text-edit > .dxbl-btn.dxbl-edit-btn-clear {
        position: absolute;
        right: 10px;
        top: 15px;
    }*/

.login-form button[title="Log In"] {
    font-weight: 700;
    border-radius: 4px;
    text-transform: uppercase;
    font-size: 1.3rem;
    box-shadow: 0 2px 2px 0px rgba(var(--darkgrey),0.4);
}

.login-form .dxbl-fl-cpt {
    z-index: 1;
}

.login-form .logon-toolbar {
    padding-top: 1rem;
}

.toolbar-language-switcher-wrapper {
    min-width: 180px;
}

.sprinttek-login .video-wrap {
    position: absolute;
    z-index: 0;
    width: 100%;
    left: 0px;
    top: 0px;
    overflow: hidden;
    height: 100vh;
    min-width: 100%;
    min-height: 100%;
    opacity: 1
}

    .sprinttek-login .video-wrap video {
        width: 100%;
    }

        .sprinttek-login .video-wrap video.vid-contain {
            height: 100% !important;
            width: auto;
        }

/*--LOGIN DARK THEME--*/
.logon-main {
}

    .logon-main .card-body .logon-viewsite .dxbl-text-edit {
        color: var(--sprinttek-darktext);
        padding: 5px 13px;
        margin-bottom: 5px;
    }

    .logon-main .card-body .logon-viewsite .dxbl-group {
        background: transparent;
        border: 0px;
    }

        .logon-main .card-body .logon-viewsite .dxbl-group .dxbl-group-header {
            display: none;
        }

    .logon-main .card-body .logon-viewsite .dxbl-text-edit input.dxbl-text-edit-input:not(.stek-register input),
    .logon-main .card-body .logon-viewsite .dxbl-text-edit input.dxbl-text-edit-input:-internal-autofill-selected:not(.stek-register input) {
        color: var(--sprinttek-darktext) !important;
    }

.xaf-language-switcher-text-container {
    padding: 2px 10px !important;
}

    .xaf-language-switcher-text-container span {
        color: var(--sprinttek-darktext);
        height: 17px;
        font-size: .8rem;
    }

    .xaf-language-switcher-text-container:hover span {
        color: var(--sprinttek-lighttext);
        height: 17px;
        font-size: .8rem;
    }

.logon-main .dxbl-dropdown-body ul li button span {
    font-size: .8rem !important;
}

.logon-main .card-body .dxbl-btn-group.dxbl-btn-group-right .dxbl-btn {
    border: 0px;
}

.logon-main .card-body .dxbl-spin-btns.dxbl-btn-group-vertical.dxbl-btn-group-right,
.logon-main .card-body .dxbl-spin-btns.dxbl-btn-group-vertical.dxbl-btn-group-right .dxbl-btn {
    background: transparent !important;
}

    .logon-main .card-header .xaf-language-switcher-text-container .dxbl-image.dxbl-toolbar-dropdown-toggle use,
    .logon-main .card-body .dxbl-btn-group.dxbl-btn-group-right .dxbl-btn.dxbl-btn-outline-secondary.dxbl-edit-btn-dropdown .dxbl-image use,
    .logon-main .card-body .dxbl-spin-btns.dxbl-btn-group-vertical.dxbl-btn-group-right .dxbl-btn .dxbl-image use {
        color: var(--darktek-lighttext);
    }

.logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Log In"]:hover {
    background: rgba(var(--lightgrey), 0.3);
}

.logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Register"],
.logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Ok"] {
    background: rgba(var(--lightgrey), 0.1);
    border: 1px solid rgba(var(--lightgrey), 0.3);
    padding: 5px;
    color: var(--sprinttek-lighttext);
}

.logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Reset Password"] span,
.logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Cancel"] span {
    color: var(--sprinttek-lightgrey) !important;
}

.logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Reset Password"],
.logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Cancel"],
.logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Reset Password"]:hover::after,
.logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Cancel"]:hover::after {
    background: transparent !important;
}

    .logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Reset Password"]:hover span,
    .logon-main.card .logon-toolbar .dxbl-toolbar .dxbl-btn-group button[data-action-name="Cancel"]:hover span {
        color: var(--sprinttek-lighttext) !important;
    }

.logon-main .card-body .logon-viewsite .dxbl-text-edit .dxbl-btn-group,
.logon-main .card-body .logon-viewsite .dxbl-text-edit .dxbl-btn-group.dxbl-btn-group-right .dxbl-btn.dxbl-btn-outline-secondary.dxbl-edit-btn-dropdown {
    background: transparent !important;
}
/*------SANDBOX MODAL OVERRIDE-----------*/
.div-sandbox-warning {
    background-color: var(--sprinttek-red);
    padding-left: 15px;
    padding-right: 15px;
    margin-left: 20px;
    margin-right: 20px;
    border-radius: 5px;
    margin-top: 0px;
    right: 290px;
    float: inline-end;
    display: block;
    position: absolute;
    height: 35px !important;
    z-index: 3;
}

    .div-sandbox-warning.host {
        /*right: 160px;*/
    }

    .div-sandbox-warning:hover {
        background-color: var(--sprinttek-tertiary);
        background: var(--sprinttek-tertiary-custombg) !important;
    }


#sandboxModal {
    background: rgba(46, 12, 24, 0.4) !important;
    display: none;
    position: absolute;
    height: 100vh;
    width: 100vw;
    left: 0;
    top: 0;
    z-index: 9;
}

    #sandboxModal .modal-dialog {
        margin: auto;
        max-width: 500px;
    }

    #sandboxModal .modal-content {
        background-color: #fc3878 !important;
        color: var(--sprinttek-lighttext) !important;
        border-radius: 10px !important;
        border-width: 0px !important;
        padding: 20px;
    }

        #sandboxModal .modal-content .modal-header {
            border-bottom: 0px;
            text-align: right;
        }

            #sandboxModal .modal-content .modal-header h5 {
                display: none;
            }

            #sandboxModal .modal-content .modal-header .btn-close {
                filter: invert(100%);
                opacity: 0.85 !important;
                border: 0px;
                width: 16px;
                height: 16px;
                cursor: pointer;
            }

                #sandboxModal .modal-content .modal-header .btn-close::before {
                    content: "+";
                    font-size: 24px;
                    transform: rotate(45deg);
                    display: block;
                    margin: -12px;
                }

        #sandboxModal .modal-content .modal-body {
            text-align: center;
        }

.div-sandbox-warning a.btn.sandbox-remain {
    border: 0px;
    background-color: transparent;
    margin-top: 4px;
    display: block;
    color: #FFF;
}


/*------DROPDOWN OVERRIDE------*/
.dxbl-calendar .dxbl-calendar-content .dxbl-calendar-today {
    border-color: var(--sprinttek-primary)
}

.dxbl-listbox div.dxbl-listbox-item-selected::before, .dxbl-listbox tr.dxbl-listbox-item-selected > td::before {
    background-color: var(--sprinttek-primary);
    background: var(--sprinttek-primary-custombg) !important;
}

.dxbl-listbox:not(.dxbl-disabled):not(:disabled):not(.dxbl-readonly) div.dxbl-listbox-item:not(.dxbl-disabled):not(:disabled):hover.dxbl-listbox-item-selected:not(.dxbl-listbox-item-disabled):not(.dxbl-listbox-empty-data-item):not(tr)::before, .dxbl-listbox:not(.dxbl-disabled):not(:disabled):not(.dxbl-readonly) div.dxbl-listbox-item:not(.dxbl-disabled):not(:disabled):hover.dxbl-listbox-item-selected:not(.dxbl-listbox-item-disabled):not(.dxbl-listbox-empty-data-item) > td::before, .dxbl-listbox:not(.dxbl-disabled):not(:disabled):not(.dxbl-readonly) tr.dxbl-listbox-item:not(.dxbl-disabled):not(:disabled):hover.dxbl-listbox-item-selected:not(.dxbl-listbox-item-disabled):not(.dxbl-listbox-empty-data-item):not(tr)::before, .dxbl-listbox:not(.dxbl-disabled):not(:disabled):not(.dxbl-readonly) tr.dxbl-listbox-item:not(.dxbl-disabled):not(:disabled):hover.dxbl-listbox-item-selected:not(.dxbl-listbox-item-disabled):not(.dxbl-listbox-empty-data-item) > td::before {
    background-color: var(--sprinttek-primary);
    background: var(--sprinttek-primary-custombg) !important;
}

@media only screen and (max-width: 500px) {

    .profile-avatar .img-thumbnail {
        margin: 10px auto 0px auto;
    }

    .customer_account_label div,
    .customer_address_label div,
    .customer_contact_label div,
    .customer_todaysdate_label div {
        text-align: center;
    }

    .customer_todaysdate_label label {
        font-size: .875rem;
    }

    .col, .col-md {
        flex: 100%;
        padding: 0px 6px;
    }

        .col-md.kpi-box {
            flex: 50%;
        }

    .dxbl-accordion .dxbl-accordion-group .dxbl-accordion-item:not(.dxbl-accordion-group) > .dxbl-accordion-item-content {
        height: 2.5rem
    }

    .dxbl-toolbar-dropdown-item {
        height: 50px;
    }

    .dxbl-toolbar-dropdown.dxbl-dropdown-dialog .dxbl-dropdown-body {
        padding: 0px 10px;
    }

    .dxbl-dropdown-body ul li {
        height: 50px;
    }

    .dxbl-calendar .dxbl-calendar-content[view="0"] > table > tbody > tr > td, .dxbl-calendar .dxbl-calendar-content[view="0"] > table > tbody > tr > th {
        padding: 10px
    }

    .div-sandbox-warning span:not(.sandbox-remain),
    .div-sandbox-warning i {
        display: none !important;
    }

    .div-sandbox-warning {
        position: absolute;
        margin-top: 365px;
        left: -72px;
        padding: 5px;
        transform: rotate(-90deg);
    }

        .div-sandbox-warning a.sandbox-remain {
            margin-top: 0px !important;
        }
}

/*------BUTTON OVERRIDE---------*/
.dxbl-btn.dxbl-disabled:hover img,
.dxbl-btn.dxbl-btn-text-secondary:hover .dxbl-image {
    filter: grayscale(100%) !important;
}
.dxbl-btn-standalone.dxbl-btn-text-primary {
    color: var(--sprinttek-primary)
}
.btn-hamburger.dxbl-btn[title="Hide Navigation Pane"] {
    position: absolute;
    left: 280px;
    z-index: 9;
    transition: 0s;
}

.btn-hamburger.dxbl-btn[title="Show Navigation Pane"] {
    position: absolute;
    left: 10px;
    z-index: 9;
    transition: 0s;
}

.btn-hamburger.dxbl-btn .xaf-image {
    -webkit-mask: url('../../IImageService/Coding.sidebar') !important;
    mask: url('../../IImageService/Coding.sidebar') !important;
}

.dxbl-btn {
    font-weight: 500;
    font-size: .875rem;
}

    .dxbl-btn-primary,
    .dxbl-btn[data-action-name="New"] {
        background-color: var(--sprinttek-primary);
        background: var(--sprinttek-primary-custombg) !important;
        border-color: var(--sprinttek-primary);
        color: var(--sprinttek-lighttext);
    }

    .dxbl-btn:not(.dxbl-disabled):not(:disabled):not(.xaf-image-overlay):hover {
        background-color: var(--sprinttek-secondary);
        background: var(--sprinttek-secondary-custombg) !important;
        border-color: var(--sprinttek-secondary) !important;
        color: var(--sprinttek-lighttext) !important;
    }

.dxbl-btn-primary.dxbl-btn.dxbl-disabled, .dxbl-btn-primary.dxbl-btn:disabled {
    background-color: var(--dxbl-btn-disabled-bg);
    border-color: var(--dxbl-btn-secondary-disabled-border-color);
    color: var(--dxbl-btn-disabled-color);
}

.dxbl-context-menu.dxbl-context-menu-dropdown > .dxbl-dropdown-body ul li:not(.dxbl-context-menu-separator) > .dxbl-context-menu-item:not(.dxbl-disabled):not(:disabled):active {
    background-color: var(--sprinttek-primary) !important;
}


.dxbl-checkbox.dxbl-checkbox-switch.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-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: var(--sprinttek-primary);
    background: var(--sprinttek-primary-custombg) !important;
}

    .dxbl-checkbox.dxbl-checkbox-switch:not(.dxbl-disabled):not(:disabled):not(.dxbl-readonly).dxbl-checkbox-checked .dxbl-checkbox-check-element:not(.dxbl-disabled):not(:disabled):hover, .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:not(.dxbl-disabled):not(:disabled):hover, .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:not(.dxbl-disabled):not(:disabled):hover {
        background-color: var(--sprinttek-secondary);
        background: var(--sprinttek-secondary-custombg) !important;
    }

.dxbl-checkbox.dxbl-checkbox-checked .dxbl-checkbox-check-element:focus-within, .dxbl-checkbox.dxbl-checkbox-checked .dxbl-checkbox-check-element:has(:focus), .dxbl-checkbox.dxbl-checkbox-indeterminate .dxbl-checkbox-check-element:focus-within, .dxbl-checkbox.dxbl-checkbox-indeterminate .dxbl-checkbox-check-element:has(:focus), .dxbl-checkbox.dxbl-checkbox-unchecked .dxbl-checkbox-check-element:focus-within, .dxbl-checkbox.dxbl-checkbox-unchecked .dxbl-checkbox-check-element:has(:focus) {
    box-shadow: 0 0 var(--sprinttek-secondary);
}

.dxbl-checkbox.dxbl-checkbox-display-view-checked > div > .dxbl-image, .dxbl-checkbox.dxbl-checkbox-display-view-indeterminate > div > .dxbl-image, .dxbl-checkbox.dxbl-checkbox-display-view-unchecked > div > .dxbl-image {
    fill: var(--sprinttek-primary);
}

/*.dxbl-btn-toolbar > .dxbl-btn-group > .dxbl-toolbar-item > .dxbl-btn.dxbl-btn-secondary:not(.dxbl-disabled):not(:disabled).dxbl-active {
    color: var(--sprinttek-lighttext);
}*/

.btn-primary {
    color: #fff;
    background: var(--sprinttek-primary);
    background: var(--sprinttek-primary-custombg) !important;
    border-color: var(--sprinttek-primary);
}

    .btn-primary:hover {
        color: #fff;
        background-color: var(--sprinttek-primary);
        background: var(--sprinttek-secondary-custombg) !important;
        border-color: var(--sprinttek-secondary);
    }

.dxbl-pager-page-btn.dxbl-btn.dxbl-disabled, .dxbl-pager-page-btn.dxbl-btn:disabled {
    background-color: var(--sprinttek-default);
    background: var(--sprinttek-default-custombg) !important;
}

.dxbl-btn.dxbl-grid-filter-menu-funnel-btn.dxbl-grid-filter-menu-funnel-btn-filled {
    color: var(--sprinttek-secondary);
}

    .dxbl-btn.dxbl-grid-filter-menu-funnel-btn.dxbl-grid-filter-menu-funnel-btn-filled:hover {
        color: var(--sprinttek-secondary);
    }
/*---SIDEBAR OVERRIDE----*/
.xaf-navmenu {
    padding: 0px;
}

.xaf-sidebar.sidebar .dxbl-group:nth-child(2),
.xaf-sidebar.sidebar .dxbl-group:nth-child(3) {
    padding: 20px 0px !important;
}
.xaf-sidebar.sidebar .dxbl-group:nth-child(2) .dxbl-accordion-group-header .xaf-nav-link span {
    color: var(--sprinttek-primary) !important;
}
.xaf-sidebar.sidebar .dxbl-group:nth-child(2) .dxbl-accordion-group-header .dxbl-image {
    filter: var(--icon-filter) !important;
}
.xaf-sidebar.sidebar .dxbl-group:nth-child(3) .dxbl-accordion-group-header .xaf-nav-link span {
    color: var(--sprinttek-green) !important;
}
.xaf-sidebar.sidebar .dxbl-group:nth-child(3) .dxbl-accordion-group-header .dxbl-image {
    filter: invert(64%) sepia(18%) saturate(1266%) hue-rotate(96deg) brightness(91%) contrast(91%) !important;
}
/*.xaf-navmenu .dxbl-group.dxbl-accordion-item:first-child .dxbl-accordion-group-header .xaf-nav-link span {
        color: var(--sprinttek-red) !important;
        text-transform: uppercase !important;
    }*/

/*.xaf-navmenu .xaf-nav-menu-item-icon {
        display: none;
    }*/

.dxbl-treeview > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > .dxbl-treeview-items-container {
    padding-right: 0px;
}

.clickable-xaf-nav-item > a .xaf-nav-link, .clickable-xaf-nav-item > div > a .xaf-nav-link {
    text-decoration: none;
}

.dxbl-accordion-group-header .xaf-nav-link {
    font-weight: 400;
    font-size: .875rem;
}

.dxbl-accordion .dxbl-accordion-group .dxbl-accordion-item-content .dxbl-accordion-item-text-container.dxbl-accordion-item-text-tmpl > .dxbl-text {
    font-size: .875rem;
}

.dxbl-group.dxbl-accordion-group .dxbl-accordion-item.has-children.xaf-nav-item {
    padding-left: 20px;
}

.dxbl-accordion-group:not(.dxbl-disabled).dxbl-active > .dxbl-accordion-group-header::before {
    opacity: .04;
}

.dxbl-group > .dxbl-group-header::before {
    opacity: 0;
}

.dxbl-accordion-group:not(.dxbl-disabled).dxbl-active:hover > .dxbl-accordion-group-header::before, .dxbl-group:hover > .dxbl-group-header::before {
    opacity: .05 !important;
}

.dxbl-accordion-group.dxbl-group {
    --dxbl-group-border-width: 0px;
}

/*.dxbl-accordion-group.dxbl-group:first-child {
        border-bottom: 1px solid rgba(var(--darktext), 0.2) !important;
    }
*/
.dxbl-accordion-items-container {
}

.header {
    border-bottom: 1px solid rgba(var(--midgrey), 0.3);
    box-shadow: none !important;
}

    .header .header-left-side {
        border-right: 1px solid rgba(var(--lightgrey), 0.6);
        background: rgba(var(--midgrey), 0.15);
        padding-left: 0px;
    }

.sidebar {
    border-right: 1px solid rgba(var(--lightgrey), 0.6);
    background: rgba(var(--midgrey), 0.15);
    box-shadow: none !important;
}

.dxbl-scroll-viewer-vert-scroll-bar.dxbl-active {
    opacity: .65 !important;
    right: 3px !important;
}

.w-100[role="main"],
.header .header-right-side {
    box-shadow: -2px 0 2px 0 rgba(var(--midgrey), 0.3);
}

.header .header-right-side {
    padding-left: 50px;
}

.xaf-sidebar.sidebar .dxbl-group {
    border: 0px;
    background: transparent;
}

.xaf-sidebar.sidebar .dxbl-btn.dxbl-btn-tool.dxbl-group-expand-btn {
    width: 25px;
    height: 25px;
}

.xaf-sidebar.sidebar .dxbl-accordion-group-expand-btn-container {
    width: 31px;
}

.xaf-sidebar.sidebar .dxbl-accordion-item-indent,
.dxbl-accordion .dxbl-accordion-group > .dxbl-accordion-group-body .dxbl-accordion-item .dxbl-accordion-item-indent,
.dxbl-accordion .dxbl-accordion-group > .dxbl-accordion-group-body .dxbl-accordion-item .dxbl-accordion-item-indent-end {
    width: 0px !important;
}

.xaf-sidebar.sidebar .dxbl-btn.dxbl-btn-tool.dxbl-group-expand-btn .dxbl-image {
    width: 9px;
}

.xaf-sidebar.sidebar .has-children.dxbl-accordion-item .dxbl-group-expand-btn.dxbl-btn-tool {
    border-radius: 15px;
}

.xaf-sidebar.sidebar .dxbl-scroll-viewer > .dxbl-scroll-viewer-hor-scroll-bar:not(.dxbl-disabled):not(:disabled).dxbl-active,
.xaf-sidebar.sidebar .dxbl-scroll-viewer > .dxbl-scroll-viewer-vert-scroll-bar:not(.dxbl-disabled):not(:disabled).dxbl-active {
    display: none;
}

.xaf-sidebar.sidebar:hover .dxbl-scroll-viewer > .dxbl-scroll-viewer-hor-scroll-bar:not(.dxbl-disabled):not(:disabled).dxbl-active,
.xaf-sidebar.sidebar:hover .dxbl-scroll-viewer > .dxbl-scroll-viewer-vert-scroll-bar:not(.dxbl-disabled):not(:disabled).dxbl-active {
    display: flex;
}
/*nav .dxbl-text-edit:has(:hover), nav .dxbl-text-edit:has(:focus) {border-bottom: 0px;}*/
.xaf-sidebar.sidebar .dxbl-navigation-filter.dxbl-text-edit,
.xaf-sidebar.sidebar .dxbl-navigation-filter.dxbl-text-edit:has(:focus),
.xaf-sidebar.sidebar .dxbl-navigation-filter.dxbl-text-edit:has(:hover) {
    border: 1px solid rgba(var(--darkgrey), 0.15);
    border-radius: 5px;
    background: var(--sprinttek-lighttext);
    padding: 5px;
    margin: 10px;
    font-size: .875rem;
}

.xaf-sidebar .btn-hamburger {
    background: transparent;
}

nav .dxbl-accordion-filter {
    border-bottom: 1px dashed var(--sprinttek-midgrey) !important;
}

    nav .dxbl-accordion-filter:has(:hover), nav .dxbl-accordion-filter:has(:focus) {
        border-bottom: 1px solid var(--sprinttek-primary) !important;
    }

nav .dxbl-group-header > .dxbl-btn > .dxbl-image {
    width: .8rem;
    height: .8rem;
}

nav .dxbl-expandable-container { /*background: rgba(3,3,3,0.05)*/
}
/*.dxbl-accordion .dxbl-accordion-group:not(.dxbl-disabled):not(:disabled):not(.dxbl-accordion-filter):not(.dxbl-disabled):not(:disabled).dxbl-active > .dxbl-accordion-group-header,*/
.dxbl-accordion .dxbl-accordion-group:not(.dxbl-disabled):not(:disabled):not(.dxbl-accordion-filter):not(.dxbl-disabled):not(:disabled).dxbl-active > .dxbl-accordion-group-header::before,
.dxbl-accordion .dxbl-accordion-group .dxbl-accordion-item:not(.dxbl-accordion-group):not(.dxbl-disabled):not(:disabled).dxbl-active > .dxbl-accordion-item-content::before {
    background-color: rgba(var(--secondary), 0.25);
    opacity: 1 !important;
    margin: 0 10px;
    border-radius: 10px;
}

.dxbl-accordion .dxbl-accordion-group:not(.dxbl-disabled):not(:disabled):not(.dxbl-accordion-filter) > .dxbl-accordion-group-header:hover::before,
.dxbl-accordion .dxbl-accordion-group .dxbl-accordion-item:not(.dxbl-accordion-group):not(.dxbl-disabled):not(:disabled):not(.dxbl-active) > .dxbl-accordion-item-content:hover::before {
    background-color: var(--sprinttek-secondary);
    opacity: .25 !important;
    margin: 0 10px;
    border-radius: 10px;
}

.dxbl-accordion .dxbl-accordion-group .dxbl-accordion-group-header > .dxbl-accordion-item-content,
.dxbl-accordion .dxbl-accordion-group .dxbl-accordion-item:not(.dxbl-accordion-group) > .dxbl-accordion-item-content {
    color: var(--sprinttek-primary) !important;
}

.settings-bar .themes-menu li > a > .image {
    border-radius: 50%;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    background-color: var(--sprinttek-primary);
    background: var(--sprinttek-primary-custombg) !important;
}

.dxbl-treeview .dxbl-treeview-item > .dxbl-treeview-item-content > .dxbl-treeview-item-container:not(.dxbl-disabled):not(:disabled).dxbl-active::before, .dxbl-treeview .dxbl-treeview-item > .dxbl-treeview-item-content > .dxbl-treeview-item-container:not(.dxbl-disabled):not(.dxbl-active):hover::before {
    background-color: transparent;
    color: inherit;
}

.dxbl-treeview .dxbl-treeview-item > .dxbl-treeview-item-content {
    padding: 5px 0px;
}

    .dxbl-treeview .dxbl-treeview-item > .dxbl-treeview-item-content > .dxbl-treeview-item-container:not(.dxbl-disabled):not(:disabled).dxbl-active {
        color: inherit;
    }

.dxbl-treeview-item .dxbl-treeview-item-content:hover {
    background-color: rgba(0,0,0,0.1)
}

.dxbl-treeview-item.dxbl-active > .dxbl-treeview-item-content {
    background-color: rgba(0,0,0,0.1)
}

.dxbl-treeview .dxbl-treeview-item > .dxbl-treeview-item-content > .dxbl-treeview-item-container:not(.dxbl-disabled):not(:disabled).dxbl-active {
    font-weight: 600;
}

.dxbl-pager > .dxbl-btn.dxbl-btn-outline-secondary.dxbl-pager-active-page-btn {
    background-color: var(--sprinttek-primary);
    background: var(--sprinttek-primary-custombg) !important;
}

.dxbl-pager > .dxbl-btn.dxbl-btn-outline-secondary.dxbl-pager-page-btn:not(.dxbl-disabled):not(:disabled):hover {
    background-color: var(--sprinttek-secondary);
    background: var(--sprinttek-secondary-custombg) !important;
}

.dxbl-accordion .dxbl-accordion-group:not(:first-of-type) {
    border-bottom: 0px;
}
/*-----TABLE/GRID OVERRIDE-------*/
.dxbl-grid-header-row {
    background-color: rgba(var(--lightgrey), 0.3);
}

.dxbl-grid .dxbl-grid-table > tbody > tr > td, .dxbl-grid .dxbl-grid-table > thead > tr > th {
    padding: 5px !important;
    font-weight: 400;
}

    .dxbl-grid .dxbl-grid-table > thead > tr > th::before {
        background: #FFFFFF !important;
    }

.dxbl-grid-table tbody tr:nth-of-type(even) {
    /*    background-color: rgba(var(--lightgrey), 0.15);*/
}

.dxbl-grid .dxbl-grid-table .dxbl-grid-empty-cell, .dxbl-grid .dxbl-grid-table .dxbl-grid-indent-cell {
    background-color: #FFFFFF;
    border-right-color: #ced4da;
}

.dxbl-grid.grid-for-dark .dxbl-grid-table .dxbl-grid-empty-cell, .dxbl-grid.grid-for-dark .dxbl-grid-table .dxbl-grid-indent-cell {
    background-color: #37353d;
    border-right-color: #615f63;
}

.dxbl-grid .dxbl-grid-table tr:not(.dxbl-grid-footer-row):not(.dxbl-grid-filter-row) .dxbl-grid-indent-cell {
    border-right-width: 1px;
}

td.xaf-action {
    cursor: pointer;
}

tdxaf-action .dxbl-checkbox.dxbl-checkbox-display-view-checked {
    display: block !important;
    margin: 0px auto !important;
    width: fit-content;
}

.dxbl-checkbox:not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio).dxbl-checkbox-unchecked .dxbl-checkbox-check-element {
    background: rgba(var(--primary), 0);
    border: 1px solid rgba(var(--primary), 1);
    border-radius: 5px;
}

    .dxbl-checkbox:not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio).dxbl-checkbox-unchecked .dxbl-checkbox-check-element:hover {
        background: rgba(var(--secondary), 0);
    }

.img-thumbnail .xaf-image-container .dxbl-btn:not(.dxbl-disabled):not(:disabled):hover {
    background-color: transparent !important;
}

.img-thumbnail:hover .xaf-image-container .xaf-image {
    opacity: .9 !important;
}
/*------DISPATCH OVERRIDE------*/
.dxbl-grid-detail-cell.test-detail-cell-class {
    opacity: 1 !important;
}

td .addresses {
    height: 31px;
    margin-top: -9px;
    border-bottom: 1px solid #ced4da;
    margin-left: -10px;
    margin-right: -10px;
}

    td .addresses div.pickup, td .addresses div.delivery {
        width: 38%;
        max-width: 38%;
        /*        padding: 3px 20px 3px 10px;*/
        /*        border-radius: 0 50px 50px 0;*/
        font-weight: 500;
        display: inline-block;
        position: relative;
        /*        border: 3px solid #FFF;*/
        border-left: 0px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    td .addresses div.pickup {
        /*        background: var(--sprinttek-lightgreen);*/
        /*background: linear-gradient(90deg, var(--sprinttek-green) 0%, var(--sprinttek-lightgreen) 4%);*/
        z-index: 2;
        margin: 0px 15px -4px 56px;
        /* color: var(--sprinttek-darkgreen); */
        border-right: 1px solid;
        border-color: var(--dxbl-grid-border-color);
        height: 30px;
        padding-top: 8px;
    }


    td .addresses div.delivery {
        /*        background: var(--sprinttek-lightred);*/
        /*background: linear-gradient(90deg, var(--sprinttek-red) 1%, var(--sprinttek-lightred) 5%);*/
        margin: 5px -3px -3px 0px;
        padding-left: 15px;
        z-index: 1;
        /*        color: var(--sprinttek-darkred);*/
    }

    td .addresses div.pickup::before {
        content: 'Pickup:';
        color: var(--sprinttek-darktext);
        margin-right: 10px;
        font-weight: 600;
    }

    td .addresses div.delivery::before {
        content: 'Delivery:';
        color: var(--sprinttek-darktext);
        margin-right: 10px;
        font-weight: 600;
    }

.order-stage, .lead-stage {
    width: 100%;
    border-radius: 20px;
    text-align: center;
    padding: 1px 10px;
    border-width: 1px;
    border-style: solid;
    border-color: rgba(255, 255, 255, 0.65);
    font-weight: 700;
    font-size: .75rem;
    box-shadow: inset 0 0 0px 50px rgba(255, 255, 255, 0.85);
    /*text-shadow: 0px 1px 1px rgba(0,0,0,0.25)*/
}

.driver-codes {
    min-width: 300px;
    /*background: red;*/
    min-height: 20px;
    display: block;
}

.dispatch-head {
    display: table;
}

    .dispatch-head .dispatch-left,
    .dispatch-head .dispatch-right {
        display: table-cell;
    }

    .dispatch-head .dispatch-left {
        width: 20px;
    }

    .dispatch-head .dispatch-right {
        text-align: left;
    }

    .dispatch-head .dispatch-progress {
        height: 6px !important;
        width: 24px;
        transform: rotate(-0.25turn);
        margin-right: -10px;
        display: grid;
        border-radius: 3px;
        margin-top: 10px;
    }

    .dispatch-head .dispatch-route {
        font-weight: 700;
        margin-bottom: -8px;
        color: var(--sprinttek-darktext);
        line-height: 1.15;
    }

    .dispatch-head .dispatch-location {
        font-size: .7rem;
        display: inline-block;
        margin-right: 5px;
    }

    .dispatch-head .dispatch-status {
        font-size: .5rem;
        text-transform: uppercase;
        font-weight: 700;
        display: inline-block;
    }

    .dispatch-head .dispatch-status-value {
        margin-right: 4px;
    }

.dxbl-grid-table:has(.dispatch-head) tr td,
.dxbl-grid-table:has(.dispatch-head) tr th {
    border-left: 0px !important;
}

.dxbl-grid-table:has(.dispatch-head) tr th {
    border-left: 0px !important;
    text-align: center;
}

.dxbl-grid-table tr td:has(.dispatch-head) {
    text-align: left;
}

/*--PREVIEW ROW---*/
.DispatchDashboard_View table tr td,
.DispatchDashboard_View table tr th {
    font-size: 0.75rem;
}

.DispatchDashboard_View .dxbl-scroll-viewer-content,
.Route_DetailListView .dxbl-scroll-viewer-content {
    padding-left: 5px;
}

.DispatchDashboard_View tr th:first-child,
.Route_DetailListView tr th:first-child {
    border-left: 1px solid rgb(211, 211, 210) !important;
    border-radius: 0 0 0 10px;
}

.DispatchDashboard_View .dxbl-grid-footer-row td:first-child,
.Route_DetailListView .dxbl-grid-footer-row td:first-child {
    border-left: 1px solid rgb(211, 211, 210) !important;
    border-radius: 10px 0 0 0;
}

.DispatchDashboard_View.dxbl-grid .dxbl-grid-table > tbody > tr:not(tr.xaf-prevent-contextmenu),
.Route_DetailListView.dxbl-grid .dxbl-grid-table > tbody > tr:not(tr.xaf-prevent-contextmenu) {
    /*display: none;*/
    border-top: 0px;
    border-left: 0px;
    padding-top: 0px !important;
}

    .DispatchDashboard_View.dxbl-grid .dxbl-grid-table > tbody > tr:not(tr.xaf-prevent-contextmenu) td,
    .Route_DetailListView.dxbl-grid .dxbl-grid-table > tbody > tr:not(tr.xaf-prevent-contextmenu) td {
        padding-top: 0px !important;
        /*padding-bottom: 0px !important;*/
    }

    .DispatchDashboard_View.dxbl-grid .dxbl-grid-table > tbody > tr:not(tr.xaf-prevent-contextmenu):has(.dp-value),
    .Route_DetailListView.dxbl-grid .dxbl-grid-table > tbody > tr:not(tr.xaf-prevent-contextmenu):has(.dp-value) {
        display: table-row !important;
    }

        .DispatchDashboard_View.dxbl-grid .dxbl-grid-table > tbody > tr:not(tr.xaf-prevent-contextmenu):has(.dp-value) td.dxbl-grid-detail-cell,
        .Route_DetailListView.dxbl-grid .dxbl-grid-table > tbody > tr:not(tr.xaf-prevent-contextmenu):has(.dp-value) td.dxbl-grid-detail-cell {
            border-radius: 0 0 0 10px;
            border-width: 0px;
            border-top-width: 0px;
            border-right-width: 0px;
            padding: 0px !important;
        }

            .DispatchDashboard_View.dxbl-grid .dxbl-grid-table > tbody > tr:not(tr.xaf-prevent-contextmenu):has(.dp-value) td.dxbl-grid-detail-cell > div,
            .Route_DetailListView.dxbl-grid .dxbl-grid-table > tbody > tr:not(tr.xaf-prevent-contextmenu):has(.dp-value) td.dxbl-grid-detail-cell > div {
                border-radius: 0 0 0 10px;
                border: 1px solid rgb(211, 211, 210);
                border-top-width: 0px;
                border-right-width: 0px;
                padding: 5px 5px 0px 5px;
                margin-bottom: 5px;
            }

.DispatchDashboard_View tr.cursor-pointer.xaf-prevent-contextmenu > td.dxbl-grid-selection-cell,
.Route_DetailListView tr.cursor-pointer.xaf-prevent-contextmenu > td.dxbl-grid-selection-cell {
    border-radius: 10px 0 0 0;
    border-left-width: 1px !important;
    /*border-top-width: 2px;*/
}

.DispatchDashboard_View tr.cursor-pointer.xaf-prevent-contextmenu td:not(.dxbl-grid-indent-cell),
.Route_DetailListView tr.cursor-pointer.xaf-prevent-contextmenu td:not(.dxbl-grid-indent-cell),
.DispatchDashboard_View .dxbl-grid-table > thead > tr > th {
    border-bottom-width: 1px;
    /*font-size: .75rem;*/
}

.DispatchDashboard_View tr.cursor-pointer.xaf-prevent-contextmenu td:last-child,
.Route_DetailListView tr.cursor-pointer.xaf-prevent-contextmenu td:last-child {
}

.DispatchDashboard_View.dxbl-grid .dxbl-grid-table tr:not(.dxbl-grid-footer-row):not(.dxbl-grid-filter-row) .dxbl-grid-indent-cell,
.Route_DetailListView.dxbl-grid .dxbl-grid-table tr:not(.dxbl-grid-footer-row):not(.dxbl-grid-filter-row) .dxbl-grid-indent-cell {
    border-right-width: 0px;
}

.DispatchDashboard_View.dxbl-grid .dxbl-grid-table tr:not(.dxbl-grid-footer-row):not(.dxbl-grid-filter-row) .dxbl-grid-indent-cell,
.Route_DetailListView.dxbl-grid .dxbl-grid-table tr:not(.dxbl-grid-footer-row):not(.dxbl-grid-filter-row) .dxbl-grid-indent-cell {
    border-left: 1px solid rgb(211, 211, 210);
}

    .DispatchDashboard_View.dxbl-grid .dxbl-grid-table tr:not(.dxbl-grid-footer-row):not(.dxbl-grid-filter-row) .dxbl-grid-indent-cell:nth-child(1),
    .Route_DetailListView.dxbl-grid .dxbl-grid-table tr:not(.dxbl-grid-footer-row):not(.dxbl-grid-filter-row) .dxbl-grid-indent-cell:nth-child(1) {
        border-left: 0px !important;
    }

.dxbl-grid-detail-cell.xaf-prevent-contextmenu {
    opacity: 1 !important;
}

.dispatch-preview-driver,
.dispatch-preview-mileage,
.dispatch-preview-proximity,
.dispatch-preview-arrival-violation,
.dispatch-preview-blind-count,
/*.dispatch-preview-os,*/
.dispatch-preview-idle,
.dispatch-preview-delayed,
.dispatch-preview-expedited,
.img-attach,
.dp-order-notes {
    display: inline-block;
    margin-right: 20px;
    padding-left: 24px;
    margin-bottom: 5px;
}

.dispatch-preview-driver {
    background: url(../images/icons-driver.png) 0 0 no-repeat;
    background-size: 18px;
    color: var(--sprinttek-midgreen);
}

.dispatch-preview-mileage {
    background: url(../images/icons-mileage.png) 0 0 no-repeat;
    background-size: 18px;
    color: var(--sprinttek-lightblue);
}

.dispatch-preview-proximity {
    background: url(../images/icons-proximity.png) 0 0 no-repeat;
    background-size: 18px;
    color: var(--sprinttek-orange);
}

.dispatch-preview-blind-count {
    background: url(../images/icons-blindcount.png) 0 0 no-repeat;
    background-size: 18px;
    color: var(--sprinttek-darkgrey);
}

.dispatch-preview-arrival-violation {
    background: url(../images/icons-arrivalviolation.png) 0 0 no-repeat;
    background-size: 18px;
    color: var(--sprinttek-red);
}

.dispatch-preview-os {
    /*background: url(../images/icons-os.png) 0 0 no-repeat;*/
    background-size: 18px;
    color: var(--sprinttek-darktext);
    padding-left: 0px;
}

.dispatch-preview-idle {
    background: url(../images/icons-idle.png) 0 0 no-repeat;
    background-size: 18px;
    color: var(--sprinttek-darkred);
}

.dispatch-preview-delayed {
    background: url(../images/icons-delay.png) 0 0 no-repeat;
    background-size: 18px;
    color: var(--sprinttek-purple);
}

.dispatch-preview-expedited {
    background: url(../images/icons-expedite.png) 0 0 no-repeat;
    background-size: 18px;
    color: var(--sprinttek-blue2);
}

.dp-order-notes {
    background: url(../images/icons-order-note.png) 0 0 no-repeat;
    background-size: 18px;
    color: var(--sprinttek-orange);
}

    .dispatch-preview-driver .dp-label,
    .dispatch-preview-mileage .dp-label,
    .dispatch-preview-proximity .dp-label,
    .dispatch-preview-blind-count .dp-label,
    .dispatch-preview-arrival-violation .dp-label,
    .dispatch-preview-os .dp-label,
    .dispatch-preview-delayed .dp-label,
    .dispatch-preview-expedited .dp-label,
    .img-attach .dp-label,
    .dp-order-notes .dp-label {
        display: inline-block;
        margin-right: 3px;
        color: var(--sprinttek-darktext);
    }

    .dp-order-notes .dp-label {
        display: none !important;
    }

.dispatch-preview-os .dp-label:nth-child(1) {
    display: none;
}

.dispatch-preview-driver .dp-value,
.dispatch-preview-mileage .dp-value,
.dispatch-preview-proximity .dp-value,
.dispatch-preview-blind-count .dp-value,
.dispatch-preview-arrival-violation .dp-value,
.dispatch-preview-os .dp-value,
.dispatch-preview-delayed .dp-value,
.dispatch-preview-expedited .dp-value,
.img-attach .dp-value,
.dp-order-notes .dp-value {
    display: inline-block;
    font-weight: 700;
}

.dispatch-preview-delayed .dp-value {
    color: var(--lightpurple) !important;
    /*background-color: var(--sprinttek-lightpurple);*/
    /*background: linear-gradient(to right, rgba(var(--lightpurple),1) 0%,rgba(var(--lightpurple),1) 80%,rgba(var(--lightpurple),0) 100%);
    border-radius: 15px 0 0 15px;*/
    /*padding: 0px 20px 0px 10px;*/
    font-size: 0.8rem;
}

.dispatch-preview-expedited .dp-value {
    color: var(--lightblue2) !important;
    /*background-color: var(--sprinttek-lightblue2);*/
    /*background: linear-gradient(to left, rgba(var(--lightblue2),1) 0%,rgba(var(--lightblue2),1) 80%,rgba(var(--lightblue2),0) 100%);
    border-radius: 0 15px 15px 0;
    padding: 0px 10px 0px 20px;*/
    font-size: 0.8rem;
}

.dp-order-notes .dp-value {
    background-color: var(--sprinttek-warning);
    background: var(--sprinttek-warning-custombg) !important;
    color: var(--sprinttek-darktext) !important;
    padding: 1px 5px;
    font-weight: 400 !important;
    border: 1px solid var(--sprinttek-midgrey);
    font-size: .8rem;
    border-radius: 5px;
}

.no-loading-indicator.grid-cell-object-link {
    color: var(--sprinttek-primary) !important;
    text-decoration: underline;
}

    .no-loading-indicator.grid-cell-object-link:hover {
        color: var(--sprinttek-secondary) !important;
        text-decoration: underline;
    }
/*------TAB OVERRIDE------*/
.dxbl-tabs {
    --dxbl-tabs-tab-border-width: 0px;
    --dxbl-tabs-tab-selected-color: inherit !important;
}

.dxbl-tabs-item img.dxbl-image.xaf-layout-tab-icon {
    /*display: none !important;*/
}

.dxbl-tabs > .dxbl-tabs-tablist > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > ul {
    border-bottom: 1px solid var(--sprinttek-midgrey);
    padding: 0px;
}

    .dxbl-tabs > .dxbl-tabs-tablist > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > ul > li > .dxbl-tabs-text-overflow {
        font-weight: 300;
    }

    .dxbl-tabs > .dxbl-tabs-tablist > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > ul > li > .dxbl-tabs-item::after {
        background-color: rgba(var(--midgrey), 0);
        height: 2px !important;
        width: 100%;
        margin-bottom: -1px;
        left: 0px;
        transition: .3s;
    }

    .dxbl-tabs > .dxbl-tabs-tablist > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > ul > li > .dxbl-tabs-item:hover::after {
        background-color: rgba(var(--midgrey), 0.8);
        width: 120%;
        left: -10px;
        transition: .3s;
    }

    .dxbl-tabs > .dxbl-tabs-tablist > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > ul > li > .dxbl-tabs-item.dxbl-active::after {
        background-color: var(--sprinttek-primary);
        background: var(--sprinttek-primary-custombg) !important;
        height: 2px !important;
        width: 100%;
        margin-bottom: -1px;
        left: 0px;
        transition: .3s;
    }

    .dxbl-tabs > .dxbl-tabs-tablist > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > ul > li > .dxbl-tabs-item.dxbl-active:hover::after {
        width: 120%;
        left: -10px;
        transition: .3s;
    }

.dxbl-tabs-item {
    background-color: rgba(187, 187, 187, 0.0);
    transition: all 0.5s ease-in;
}

    .dxbl-tabs-item::before {
        opacity: 0% !important;
    }

        .dxbl-tabs-item::before:hover {
            opacity: 0% !important
        }
/*------MODAL OVERRIDE-----*/
.dxbl-modal {
    --dxbl-popup-border-width: 0px;
    --dxbl-popup-header-padding-x: 20px;
    --dxbl-popup-header-padding-y: 20px;
    --dxbl-popup-footer-padding-x: 20px;
    --dxbl-popup-footer-padding-y: 20px;
    --dxbl-popup-body-padding-x: 20px;
    --dxbl-popup-body-padding-y: 0px;
    --dxbl-popup-border-radius: 1rem;
    --dxbl-popup-shadow: 0 0px 200px 0 rgba(0, 0, 0, 0.6);
    --dxbl-popup-back-bg: #000000;
    --dxbl-popup-back-opacity: 0.5;
}

    .dxbl-modal > .dxbl-modal-root > .dxbl-popup > .dxbl-modal-content .dxbl-popup-header > .dxbl-modal-header::before, .dxbl-modal > .dxbl-modal-root > .dxbl-popup > .dxbl-modal-content > .dxbl-modal-header::before, .dxbl-modal > .dxbl-modal-root > .dxbl-popup > .dxbl-modal-content > .dxbl-modal-footer::before {
        background: transparent !important;
    }

    .dxbl-modal > .dxbl-modal-root > .dxbl-popup > .dxbl-modal-content .dxbl-popup-header > .dxbl-modal-header .dxbl-popup-header-button, .dxbl-modal > .dxbl-modal-root > .dxbl-popup > .dxbl-modal-content > .dxbl-modal-header .dxbl-popup-header-button {
        width: 30px;
        height: 30px;
        margin: -10px;
    }
/*.dxbl-modal-header*/ .xaf-caption-icon-container {
    display: none;
}
/*.dxbl-modal-header */ .xaf-caption-container {
    max-width: 100% !important;
}

/*----------IMAGE OVERRIDE----------*/
.img-thumbnail {
    width: 100% !important;
}

.company-main-logo .img-thumbnail {
    background: #FFF;
}

.company-alt-logo .img-thumbnail {
    background-color: var(--sprinttek-darkgrey);
    background: var(--sprinttek-darkgrey-custombg) !important;
}

/*-----KPI DASHBOARD STYLES-------*/
.dxbl-group-body-content:has(.kpi-box ) {
    padding-bottom: 0px !important;
}

.indicator-tb {
    width: 100%;
    text-align: left;
    /*margin-bottom: 10px;*/
}

    .indicator-tb .row.indicator-tr-label {
        margin: 0px;
        display: block;
    }

.kpi-box {
    display: inline-block;
    width: fit-content;
    padding-left: 6px;
    padding-right: 6px;
}

    .kpi-box .card {
        padding: 6px 10px 2px;
        border-radius: 5px;
        overflow: hidden;
        display: inline-block !important;
        width: fit-content;
        /*for icon bg*/
        background-repeat: no-repeat !important;
        background-position-x: 7px !important;
        background-position-y: center !important;
        background-size: 16px !important;
    }

        .kpi-box .card:hover {
            box-shadow: 0px 0px 0px 4px rgba(var(--primary),0.25) !important;
            transition: .3s;
        }

        .kpi-box .card::before {
            content: '';
            background-image: url('../../IImageService/Editing.grid');
            background-repeat: no-repeat !important;
            background-size: 16px !important;
            display: inline-block;
            width: 16px;
            height: 16px;
            opacity: 0.6;
            margin-right: 10px;
        }

        .kpi-box .card[alt="20LATEROUTE"]::before {
            background-image: url('../../IImageService/Alert.triangle-exclamation') !important;
        }

        .kpi-box .card[alt="30LATEROUTE"]::before {
            background-image: url('../../IImageService/Security.diamond-exclamation') !important;
        }

        .kpi-box .card[alt="UNASSIGNEDROUTE"]::before {
            background-image: url('../../IImageService/People.user-block') !important;
        }

        .kpi-box .card[alt="UNASSIGNEDADHOC"]::before {
            background-image: url('../../IImageService/People.user-block') !important;
        }

        .kpi-box .card[alt="NOTSTARTED"]::before {
            background-image: url('../../IImageService/Time.clock-minus') !important;
        }

        .kpi-box .card[alt="COMPLETEDORDER"]::before {
            background-image: url('../../IImageService/Editing.hexagon-check') !important;
        }

        .kpi-box .card[alt="COMPLETEDROUTE"]::before {
            background-image: url('../../IImageService/Maps.location-check') !important;
        }

        .kpi-box .card[alt="COMPLETEDADHOC"]::before {
            background-image: url('../../IImageService/Calendar.calendar-check') !important;
        }

        .kpi-box .card[alt=" STANDARDUNASSIGNEDORDER"]::before {
            background-image: url('../../IImageService/People.user-block') !important;
        }

        .kpi-box .card[alt=" STANDARDCOMPLETIONRATE"]::before {
            background-image: url('../../IImageService/Editing.hexagon-check') !important;
        }

        .kpi-box .card[alt=" STANDARDVEHICLES"]::before {
            background-image: url('../../IImageService/Automotive.truck') !important;
        }

        .kpi-box .card[alt=" STANDARDPICKEDUPORDERS"]::before {
            background-image: url('../../IImageService/Package.package-check') !important;
        }

        .kpi-box .card[alt=" INCIDENTS"]::before {
            background-image: url('../../IImageService/Maps.location-exclamation') !important;
        }

        .kpi-box .card[alt=" STANDARDTOTALSTOPS"]::before {
            background-image: url('../../IImageService/Maps.location-pin-alt') !important;
        }

        .kpi-box .card[alt=" STANDARDREMAININGPICKUPS"]::before {
            background-image: url('../../IImageService/Package.package') !important;
        }

        .kpi-box .card[alt=" STANDARDDELIVEREDORDERS"]::before {
            background-image: url('../../IImageService/Files.file-check-alt') !important;
        }


        .kpi-box .card[alt="20LATEROUTE"]:not([data-value="0"]),
        .kpi-box .card[alt="30LATEROUTE"]:not([data-value="0"]) {
            animation: smooth-pulse 2s infinite ease-in-out, smooth-shimmer 2s infinite ease-in-out;
        }

@keyframes smooth-pulse {
    0% {
        box-shadow: 0px 0px 0px 0px rgba(var(--red),0.0), inset 0px 0px 0px 0px rgba(var(--lighttext),0.0);
    }

    10% {
        box-shadow: 0px 0px 0px 3px rgba(var(--red),0.35), inset 0px 0px 5px 5px rgba(var(--yellow),0.35);
    }

    20% {
        box-shadow: 0px 0px 0px 6px rgba(var(--red),0.35), inset 0px 0px 0px 0px rgba(var(--lighttext),0.0);
    }

    21%, 100% {
        box-shadow: 0px 0px 0px 0px rgba(var(--red),0.0), inset 0px 0px 0px 0px rgba(var(--lighttext),0.0);
    }
}

/*.kpi-box .card::after {
        content: '';
        position: absolute;
        top: 0;
        left: -150%;
        width: 150%;
        height: 100%;
        background: linear-gradient( 90deg, transparent 0%, rgba(255, 255, 255, 0.6) 50%, transparent 100% );
        animation: smooth-shimmer 12s infinite ease-in-out;
    }

    @keyframes smooth-shimmer {
        0% {  
        left: -150%;
        opacity: 0;
    }

    16.67% {  
        left: -150%;
        opacity: .75;
    }

    33.33% {  
        left: 100%;
        opacity: 1;
    }

    33.34%, 100% {  
left: 100%;
    }
}*/

.kpi-box .card::after {
    content: "";
    background: linear-gradient(135deg, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0.3) 100%);
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
border-radius: 15px;
z-index: 1;
    mix-blend-mode: overlay;
}

.kpi-value {
    text-align: start;
    display: inline-block;
    /*padding: 0px 15px;
    font-size: 2.5rem;*/
    font-weight: 700;
    font-size: 1.2rem;
    line-height: .5;
    /*color: var(--sprinttek-lighttext);*/
    opacity: 1;
    /*text-shadow: 0 2px 2px rgba(0,0,0,0.6);*/
    /*position: absolute;
    width: 100%;
    bottom: 10px;
    left: 0;*/
    position: relative;
    top: -2px;
    left: 3px;
}

.kpi-label {
    /*font-weight: 700;*/
    /*color: var(--sprinttek-lighttext);*/
    /*text-shadow: 0 1px 1px rgba(0,0,0,0.6);*/
    /* border-radius: 13px 13px 0px 0px;*/
    z-index: 3;
    /*margin: -15px;
    padding: 6px 12px;*/
    font-size: .875rem;
    text-align: start;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    display: inline-block;
}

/*-----COLLAPSIBLE GROUP OVERRIDE-----*/

dxbl-form-layout-group.dxbl-fl-group.minimal-hide {
    margin-top: 20px;
    margin-bottom: 0px;
}

    dxbl-form-layout-group.dxbl-fl-group.minimal-hide:has(.dxbl-group.expanded) {
        margin-bottom: 20px;
    }
    /*dxbl-form-layout-group.dispatch-kpi.minimal-hide .dxbl-fl-ctrl {
    margin: 0px !important;
    height: 120px;
}*/

    dxbl-form-layout-group.dxbl-fl-group.minimal-hide .dxbl-group > .dxbl-group-header::before {
        background-color: var(--sprinttek-lightgrey);
    }

    dxbl-form-layout-group.dxbl-fl-group.minimal-hide .dxbl-group-header .dxbl-text {
        font-weight: 700;
    }

    dxbl-form-layout-group.dxbl-fl-group.minimal-hide .dxbl-group.expanded {
        border: 1px solid transparent;
        margin-bottom: -20px;
        border-radius: 10px;
        box-shadow: 0 0px 0px 0px rgba(var(--lightgrey),0.25);
    }

        dxbl-form-layout-group.dxbl-fl-group.minimal-hide .dxbl-group.expanded:has(.dxbl-group-header .dxbl-group-expand-btn:hover ) {
            border: 1px solid rgba(var(--midgrey),0.35);
            box-shadow: 0 0px 3px 3px rgba(var(--lightgrey),0.55);
            transition: 0.3s;
        }

        dxbl-form-layout-group.dxbl-fl-group.minimal-hide .dxbl-group.expanded .dxbl-group-header {
            height: 20px;
            border: 0px !important;
            padding: 0px;
        }

            dxbl-form-layout-group.dxbl-fl-group.minimal-hide .dxbl-group.expanded .dxbl-group-header .dxbl-image.xaf-layout-group-icon {
                display: none;
            }

            dxbl-form-layout-group.dxbl-fl-group.minimal-hide .dxbl-group.expanded .dxbl-group-header::before {
                height: 10px;
                margin-top: 10px;
                opacity: 1 !important;
                background-color: transparent;
                border-top: 1px solid rgba(var(--midgrey), 0.25) !important;
                border-radius: 0px;
            }

        dxbl-form-layout-group.dxbl-fl-group.minimal-hide .dxbl-group.expanded:has(.dxbl-group-expand-btn:hover ) .dxbl-group-header::before {
            opacity: 0 !important;
        }

        dxbl-form-layout-group.dxbl-fl-group.minimal-hide .dxbl-group.expanded .dxbl-group-header .dxbl-group-expand-btn {
            margin: 0 auto;
            height: 20px;
            width: 60px;
            border-radius: 10px;
            border: 1px solid var(--sprinttek-lightgrey);
            background-color: var(--sprinttek-lighttext);
            transition: 0s;
        }

            dxbl-form-layout-group.dxbl-fl-group.minimal-hide .dxbl-group.expanded .dxbl-group-header .dxbl-group-expand-btn:hover {
                box-shadow: none !important;
                width: 100% !important;
                border-radius: 10px 10px 0 0;
                background-color: rgba(var(--lightgrey), 0) !important;
                color: var(--sprinttek-lighttext) !important;
                border-color: transparent !important;
                transition: 0.3s;
            }

                dxbl-form-layout-group.dxbl-fl-group.minimal-hide .dxbl-group.expanded .dxbl-group-header .dxbl-group-expand-btn:hover::before {
                    background-color: rgba(var(--lightgrey), 0.25) !important;
                }

            dxbl-form-layout-group.dxbl-fl-group.minimal-hide .dxbl-group.expanded .dxbl-group-header .dxbl-group-expand-btn svg.dxbl-image {
                transform: rotate(180deg);
                color: var(--sprinttek-darktext);
            }

            dxbl-form-layout-group.dxbl-fl-group.minimal-hide .dxbl-group.expanded .dxbl-group-header .dxbl-group-expand-btn::after {
                content: "HIDE";
                display: inline-block;
                font-size: 12px;
                font-weight: 700;
                margin-left: 6px;
            }

    dxbl-form-layout-group.dxbl-fl-group.minimal-hide .dxbl-group[expanded-state="False"] > .dxbl-group-header > .dxbl-btn.dxbl-group-expand-btn:not(.dxbl-disabled):not(:disabled),
    dxbl-form-layout-group.dxbl-fl-group.minimal-hide .dxbl-group[expanded-state="False"] > .dxbl-group-header > .dxbl-btn.dxbl-group-expand-btn:not(.dxbl-disabled):not(:disabled):hover {
        position: absolute;
        width: calc(100% - 10px);
        border-radius: 0;
        background: transparent !important;
        background-color: transparent !important;
        box-shadow: none !important;
        border: 0px;
        display: block;
        padding-right: 20px;
        text-align: end;
    }

    dxbl-form-layout-group.dxbl-fl-group.minimal-hide .dxbl-group[expanded-state="False"] > .dxbl-group-header:hover {
        background-color: var(--sprinttek-lightgrey);
    }

    dxbl-form-layout-group.dxbl-fl-group.minimal-hide .dxbl-group[expanded-state="False"] > .dxbl-group-header > .dxbl-group-expand-btn > svg.dxbl-image,
    dxbl-form-layout-group.dxbl-fl-group.minimal-hide .dxbl-group[expanded-state="False"] > .dxbl-group-header > .dxbl-btn.dxbl-group-expand-btn:not(.dxbl-disabled):not(:disabled):hover > svg.dxbl-image {
        transform: rotate(90deg);
        color: var(--sprinttek-darktext);
        opacity: 1;
        display: inline;
        filter: none;
    }

    dxbl-form-layout-group.dxbl-fl-group.minimal-hide .dxbl-group[expanded-state="False"] > .dxbl-group-header > .dxbl-btn.dxbl-group-expand-btn:not(.dxbl-disabled):not(:disabled)::after,
    dxbl-form-layout-group.dxbl-fl-group.minimal-hide .dxbl-group[expanded-state="False"] > .dxbl-group-header > .dxbl-btn.dxbl-group-expand-btn:not(.dxbl-disabled):not(:disabled):hover::after {
        content: "UNHIDE";
        display: inline;
        font-size: 12px;
        font-weight: 700;
        margin-left: 6px;
        color: var(--sprinttek-darktext);
    }

    dxbl-form-layout-group.dxbl-fl-group.minimal-hide .dxbl-group.expanded .dxbl-group-body {
        border: 0px !important;
    }

    dxbl-form-layout-group.dxbl-fl-group.minimal-hide .dxbl-group.expanded .dxbl-group-header .dxbl-text {
        display: none;
    }

    dxbl-form-layout-group.dxbl-fl-group.minimal-hide .dxbl-group-body-content > .dxbl-row > .dxbl-col {
        margin-top: 0px !important;
        margin-bottom: 0px !important;
        padding: 0px;
    }

dxbl-form-layout-group.dxbl-fl-group.entice-tip .dxbl-group-header,
dxbl-form-layout-group.dxbl-fl-group.entice-tip .dxbl-group-body {
    background-color: rgba(var(--yellow), 0.05);
}

dxbl-form-layout-group.dxbl-fl-group.entice-tip:has(.dxbl-group[expanded-state="False"]) {
    margin: 0px;
}

dxbl-form-layout-group.dxbl-fl-group.entice-tip > .dxbl-group[expanded-state="False"] {
    width: 50px;
    position: absolute;
    right: -20px;
    margin-top: 10px;
    border-radius: 50px 0 0 50px;
    z-index: 20;
}

    dxbl-form-layout-group.dxbl-fl-group.entice-tip > .dxbl-group[expanded-state="False"]:hover {
        right: -10px;
    }

    dxbl-form-layout-group.dxbl-fl-group.entice-tip > .dxbl-group[expanded-state="False"] .dxbl-group-header .dxbl-group-expand-btn {
        rotate: 180deg;
        width: 20px;
        height: 20px;
        padding: 5px;
        background: url(../../IImageService/ycon-Info) center center no-repeat;
        filter: var(--icon-filter);
    }

        dxbl-form-layout-group.dxbl-fl-group.entice-tip > .dxbl-group[expanded-state="False"] .dxbl-group-header .dxbl-group-expand-btn:hover {
            background-color: transparent !important;
            filter: none !important;
        }

        dxbl-form-layout-group.dxbl-fl-group.entice-tip > .dxbl-group[expanded-state="False"] .dxbl-group-header .dxbl-group-expand-btn .dxbl-image {
            display: none;
        }

    dxbl-form-layout-group.dxbl-fl-group.entice-tip > .dxbl-group[expanded-state="False"] .dxbl-group-header .dxbl-image.xaf-layout-group-icon {
        opacity: 0;
        margin-right: -15px;
    }

    dxbl-form-layout-group.dxbl-fl-group.entice-tip > .dxbl-group[expanded-state="False"] .dxbl-group-header .dxbl-text {
        display: none;
    }

.dxbl-group > .dxbl-group-header::before {
    opacity: 0 !important;
}

/*-----------DEVEXTREME DASHBOARD--------*/

.dx-widget-viewer-container .dx-flex-card-layout .dx-flex-card-layout-content .dx-flex-card-layout-row-element,
.dx-dashboard-typography, .dx-dashboard-typography .dx-widget, .dx-dashboard-typography .dx-widget input, .dx-dashboard-typography .dx-widget textarea, g.dxg-elements text, g.dxg-title text, g.dxc-labels text {
    font-family: var(--sprinttek-fontfamily) !important;
}

.dx-dashboard-loading-container .dx-dashboard-surface .dx-layout-item-wrapper .dx-layout-item-container, .dx-dashboard-widget-container .dx-dashboard-surface .dx-layout-item-wrapper .dx-layout-item-container {
    border-radius: 15px;
}

.dx-datagrid-headers {
    color: var(--sprinttek-darktext);
    font-weight: 700;
}

.xaf-dashboard-container.border {
    border-radius: 20px;
    overflow: hidden;
}

.dx-datagrid-rowsview .dx-row {
    border-top: 1px solid transparent;
    border-bottom: 3px solid transparent;
    font-weight: 700;
}
/*----------DRIVER ORDER LIST----------*/
.driverlist-orders {
    background: rgba(0,0,0,0.15);
    padding: 15px 0px 0px;
}

.driverlist-card {
    border-radius: 10px;
    margin-bottom: 15px;
    padding: 20px 10px;
    box-shadow: 0 4px 4px 0 rgba(0,0,0,0.2);
}

.row.order-details {
    margin: 0px;
}

.driverlist-card hr {
    margin: 10px 0px;
}

.driverlist-order-contact {
    overflow: hidden;
}

    .driverlist-order-contact .dol-firstname {
        font-size: 1.2rem;
        font-weight: 700;
        display: block;
        padding: 5px 0px;
        width: 100%;
        background: #FFF;
    }
    /*.driverlist-order-contact .dol-midname {font-size: 0.8rem; font-weight: 700;}
.driverlist-order-contact .dol-lastname {font-size: 0.8rem; font-weight: 700;}*/
    .driverlist-order-contact .dol-email {
        font-size: 0.95rem;
        font-weight: 700;
    }

    .driverlist-order-contact .dol-phone {
        font-size: 0.95rem;
        font-weight: 700;
        color: var(--sprinttek-primary);
        text-decoration: none;
    }
/*.driverlist-order-docnum {text-align: right; font-size: 0.8rem; font-weight: 700;padding: 3px 0px 3px 0px}
.driverlist-order-address {margin-bottom: 10px; font-size: 1rem; font-weight:500;}*/
.routesheet-data-main .dxbl-text-edit {
    border-radius: 10px;
    border: 1px solid var(--sprinttek-midgrey);
}

.driver-app-delivery-process-icon-container, .dol-status {
    margin-bottom: 30px;
}
/*.dol-fields-container {height: calc(100vh - 80px);}*/
.dol-btns-container {
    height: 80px;
}

.dol-label {
    border: 1px solid var(--sprinttek-midgrey);
    padding: 2px 10px;
    border-radius: 20px;
    background: #FFF;
    width: fit-content;
    margin: 0 0 -12px 10px;
    position: relative;
    z-index: 3;
    font-size: .8rem;
    font-weight: 700;
}

.dol-btns {
    text-align: center;
    width: 100%;
}

.dol-fields-container {
    height: calc(100vh - 160px);
    display: block;
    position: absolute;
    width: 96%;
    max-width: 500px;
}

.dol-btns-container {
    height: 80px;
    display: block;
    position: absolute;
    bottom: 0px;
    width: 96%;
    max-width: 500px;
}

.dol-btns .popup-button {
    font-size: 1.25rem;
    font-weight: 700;
    padding: 15px 25px;
    border-radius: 0px;
    width: 45%;
}

    .dol-btns .popup-button.dol-back {
        background-color: var(--sprinttek-darkgrey);
        background: var(--sprinttek-darkgrey-custombg) !important;
        border-color: var(--sprinttek-darkgrey);
    }

    .dol-btns .popup-button.dol-next {
    }

.dol-card-btn {
    width: 100%;
    font-weight: 700;
    font-size: 0.875rem;
    text-transform: uppercase;
    margin-top: 20px;
    padding: 20px 10px;
}

.btn-secondaty-outline.dol-card-btn {
    border: 1px solid var(--sprinttek-midgrey)
}

.transition-visible {
    max-height: 0px;
}

    .transition-visible.show {
        max-height: 500px;
        animation-name: growing;
        animation-duration: 1s;
        border-top: 1px solid var(--sprinttek-midgrey);
    }

    .transition-visible.transition-collapsed {
        max-height: 0px;
        animation-name: shrinking;
        animation-duration: 1s
    }

    .transition-visible.show.dol-dtls {
        margin-top: 15px;
        padding-top: 15px;
    }

.table.dol-table > :not(:first-child) {
    border-top: 1px solid var(--sprinttek-midgrey);
}

td.dol-dtls-lbl {
    font-size: .7rem;
    font-weight: 700;
}

td.dol-dtls-val {
    text-align: right;
    font-weight: 700;
}

.dol-stop {
    padding: 3px 8px;
    border-radius: 0 20px 20px 0px;
    text-transform: uppercase;
    font-weight: 700;
    color: #FFF;
    text-shadow: 0 1px 2px rgba(0,0,0,0.7);
}

    .dol-stop.stop-pickup {
        background: linear-gradient(to right, var(--sprinttek-darkgreen) 0%,var(--sprinttek-green) 100%);
    }

    .dol-stop.stop-delivery {
        background: linear-gradient(to right, var(--sprinttek-darkred) 0%,var(--sprinttek-red) 100%);
    }

.dol-eta {
    background-color: var(--sprinttek-darkgrey);
    background: var(--sprinttek-darkgrey-custombg) !important;
    border-radius: 20px 0px 0px 20px;
    font-weight: 700;
    margin-left: -10px;
    padding: 3px 15px 3px 20px;
    color: #FFF;
    text-shadow: 0 1px 2px rgba(0,0,0,0.7);
    position: absolute;
    right: 0;
    width: auto;
    text-align: right;
    max-width: 53%;
}

    .dol-eta.dol-eta-tooearly {
        background-color: var(--sprinttek-orange)
    }

    .dol-eta.dol-eta-ontime {
        background-color: var(--sprinttek-green)
    }

    .dol-eta.dol-eta-late {
        background-color: var(--sprinttek-darkred)
    }

@keyframes growing {
    from {
        max-height: 0px;
    }

    to {
        max-height: 300px;
    }
}

@keyframes shrinking {
    from {
        max-height: 300px;
    }

    to {
        max-height: 0px;
    }
}

/*--------------MEDIA QUERY----------------*/
@media only screen and (max-width: 1550px) {


    .dp-label {
        display: none !important;
    }

    .dispatch-preview-os .dp-label:nth-child(2) {
        display: inline-block !important;
    }
}


@media only screen and (max-width: 1200px) and (max-height: 800px) {
    /*KPI*/
    .kpi-value {
        font-size: 4.5vw;
    }

    .kpi-label {
        font-size: 1.25vw;
    }
}

@media only screen and (max-width: 1000px) and (max-height: 500px) {
}

@media only screen and (max-width: 1000px) {
    /*LOGIN*/
    .sprinttek-login .row .col-spacer {
        display: none;
    }

    .login-form {
        border-radius: 0px !important;
    }

        .login-form #logon-template-component {
            position: relative !important;
        }

    .login-logo {
        position: relative;
    }
    /*KPI*/
    .kpi-box .card {
        margin-bottom: 10px;
    }

    /*.kpi-value {
        font-size: 3.4em;
    }*/

    .kpi-label {
        font-size: .9rem;
    }

    dxbl-form-layout-group.dispatch-kpi.minimal-hide .dxbl-fl-ctrl {
        height: auto !important;
    }
}

@media only screen and (max-width: 800px) {

    /*KPI*/
    /*.kpi-box .card {
        margin-bottom: 20px;
    }*/

    .main-toolbar.kpi-toolbar {
        top: 40px !important;
    }
}

@media only screen and (max-width: 500px) {
    /*LOGIN*/
    .sprinttek-login .video-wrap video {
        height: 100vh !important;
        width: auto !important;
        margin-left: -150% !important;
    }

    .sprinttek-login .login-form div[role="heading"] {
        font-size: 1.1rem;
    }

    /*NAVIGATION*/
    .xaf-sidebar.sidebar {
        min-width: 100%;
        width: 100%;
    }

    .xaf-navmenu .xaf-nav-link {
        font-size: 1rem;
    }

    .xaf-navmenu .dxbl-group > .dxbl-group-header {
        border-bottom: 0px;
    }

    .collapse-toggle .sidebar-sm-shadow {
        left: 100%
    }

    .dxbl-treeview .dxbl-treeview-item > .dxbl-treeview-item-content {
        padding: 15px 0px
    }

        .dxbl-treeview .dxbl-treeview-item > .dxbl-treeview-item-content > .dxbl-treeview-item-container {
            font-size: 1rem;
        }
}
/*Tracking*/
.t-search-div {
    margin-left: 10px;
    margin-right: 10px;
}

.t-div {
    margin-left: 8px;
    margin-right: 8px;
    margin-top: 8px;
}

.t-div-row {
    margin-top: 5px;
}

.t-div-col {
    height: 100%;
}

.t-div-col-border {
    border-right: 2px solid #eee;
}

.t-stage-caption-gray {
    color: #bbbbbb
}

.t-table {
    width: 100%;
}

/*.t-table-head {
    background-color: #f2f2f2;
}

.t-table-bordered {
    border: 2px solid #eee;
}*/

.t-td {
    padding: 0.8rem;
    /*border-bottom: 1px solid #ddd;*/
}

.t-td-align-right {
    text-align: right;
}

.t-td150 {
    width: 150px;
    vertical-align: top
}

.t-td-col1 {
    padding-left: 2.5rem;
}

.t-tr-clickable {
    cursor: pointer;
}

.t-initialmsg {
    padding-top: 10px
}
/* Style the tab */
.tab {
    overflow: hidden;
    /*margin-left: 19px;*/
    border-bottom: 1px solid #eee;
}

    /* Style the buttons that are used to open the tab content */
    .tab button {
        background-color: inherit;
        float: left;
        border: none;
        outline: none;
        cursor: pointer;
        padding: 14px 16px;
        transition: 0.3s;
    }

        /* Change background color of buttons on hover */
        .tab button:hover {
            background-color: #ddd;
        }

        /* Create an active/current tablink class */
        .tab button.active {
            color: #FE7109;
            border-bottom: 1px solid #FE7109;
        }

/* Style the tab content */
.tabcontent {
    display: none;
    /*padding: 6px 12px;
    border: 1px solid #ccc;*/
    border-top: none;
}

.tabcontent-initial {
    display: block;
}

.tab2 {
    overflow: hidden;
    /*margin-left: 19px;*/
    border-bottom: 1px solid #eee;
}

    /* Style the buttons that are used to open the tab content */
    .tab2 button {
        background-color: inherit;
        float: left;
        border: none;
        outline: none;
        cursor: pointer;
        padding: 14px 16px;
        transition: 0.3s;
    }

        /* Change background color of buttons on hover */
        .tab2 button:hover {
            background-color: #ddd;
        }

        /* Create an active/current tablink class */
        .tab2 button.active {
            color: #FE7109;
            border-bottom: 1px solid #FE7109;
        }

/* Style the tab content */
.tab2content {
    display: none;
    /*padding: 6px 12px;
    border: 1px solid #ccc;*/
    border-top: none;
}

.tab2content-initial {
    display: block;
}

.bold {
    font-weight: bold;
    font-size: 1rem;
}

.note-height {
    height: 90px;
}

.subtext {
    font-size: .8rem;
}

.time {
    position: absolute;
    left: -110px;
    text-align: right;
    font-size: .8rem;
    color: var(--sprinttek-darktext);
    display: none;
}

.map-position {
    position: relative;
}

.map-display {
    display: none
}

.is-done .time {
    color: var(--sprinttek-primary);
    display: block !important;
}

.timeline-wrapper {
    padding-left: 80px;
    /*min-width: 400px;*/
    font-family: inherit;
    font-size: 14px;
}

.timeline-map-parent {
    position: relative;
    width: 54vw !important;
    height: 100%;
    flex: 1;
    min-height: 35vw;
}

.StepProgress {
    position: relative;
    padding-left: 45px;
    list-style: none;
}

    .StepProgress::before {
        display: inline-block;
        content: '';
        position: absolute;
        top: 0;
        left: 15px;
        width: 10px;
        height: 100%;
        border-left: 2px solid #CCC;
    }

.StepProgress-item {
    position: relative;
    counter-increment: list;
}

    .StepProgress-item:not(:last-child) {
        padding-bottom: 20px;
    }

    .StepProgress-item::before {
        display: inline-block;
        content: '';
        position: absolute;
        left: -30px;
        height: 100%;
        width: 10px;
    }

    .StepProgress-item::after {
        content: '';
        display: inline-block;
        position: absolute;
        top: 0;
        left: -37px;
        width: 15px;
        height: 15px;
        border: 2px solid var(--sprinttek-midgrey);
        border-radius: 50%;
        background-color: var(--sprinttek-midgrey);
        background: var(--sprinttek-midgrey-custombg) !important;
    }

    .StepProgress-item.is-done::before {
        border-left: 2px solid var(--sprinttek-primary);
    }

    .StepProgress-item.is-done::after {
        /*content: "?";*/
        font-size: 10px;
        color: #FFF;
        text-align: center;
        border: 2px solid var(--sprinttek-primary);
        background-color: var(--sprinttek-primary);
        background: var(--sprinttek-primary-custombg) !important;
    }

ul.StepProgress li.StepProgress-item:nth-child(1)::after {
    font-size: 20px;
    color: #FFF;
    text-align: center;
    width: 32px;
    height: 32px;
    margin-left: -9px;
    margin-top: -5px;
}

ul.StepProgress li.StepProgress-item:nth-child(1) .time {
    position: absolute;
    left: -115px;
}

ul.StepProgress li.StepProgress-item:nth-child(1).cancelled::after {
    content: "\2716";
    border: 2px solid var(--sprinttek-danger);
    background-color: var(--sprinttek-danger);
    background: var(--sprinttek-danger-custombg) !important;
}

ul.StepProgress li.StepProgress-item:nth-child(1).successful::after {
    content: "\2714";
    border: 2px solid var(--sprinttek-success);
    background-color: var(--sprinttek-success);
    background: var(--sprinttek-success-custombg) !important;
}

ul.StepProgress li.StepProgress-item:nth-child(1).unsuccessful::after {
    content: "\26A0";
    border: 2px solid var(--sprinttek-darkgrey);
    background-color: var(--sprinttek-darkgrey);
    background: var(--sprinttek-darkgrey-custombg) !important;
}

.StepProgress strong {
    display: block;
}

.StepProgress .progress-time {
    display: block;
    color: var(--sprinttek-darkgrey)
}

.StepProgress .progress-time-abbr {
    margin: 0px !important;
}


/*Dispatch*/
.address-pop {
    left: 15px;
    position: absolute;
    top: -10px;
    background: #99e7bf;
    border-radius: 10px;
    padding: 1px 5px;
    font-size: 10px;
    display: none;
}


.pickup-row-bg {
    background-color: var(--sprinttek-success);
    background: var(--sprinttek-success-custombg) !important;
}

.delivery-row-bg {
    background-color: var(--sprinttek-danger);
    background: var(--sprinttek-danger-custombg) !important;
}

.dispatch-group-header {
    background-color: var(--sprinttek-midgrey);
    background: var(--sprinttek-midgrey-custombg) !important;
    border: 1px solid #ccc;
    max-height: 85px;
    display: block;
    overflow-x: hidden;
    overflow-y: auto;
    width: -webkit-fill-available;
}

.dispatch-border-l-row {
    border-left: none !important;
}

.dispatch-w-100 {
    width: 100%;
}

.dispatch-w-10 {
    width: 10%;
}

.dispatch-w-35 {
    width: 35%;
}

.dispatch-w-40 {
    width: 40%;
}

.dispatch-w-20 {
    width: 20%;
}

.dispatch-w-5 {
    width: 5%;
}

.dispatch-w-15 {
    width: 15%;
}

.dispatch-row {
    display: table-cell;
    border-left: 1px solid var(--sprinttek-midgrey);
    vertical-align: middle;
}

.dispatch-row-container {
    display: table;
    width: 100%;
    background: var(--sprinttek-lighttext);
    border-radius: 15px;
    box-shadow: 1px 5px 6px 0px var(--sprinttek-midgrey);
    cursor: pointer;
}

.dispatch-row-order-container-top {
    border-radius: 15px 15px 0px 0px !important;
}

.dispatch-row-order-container-bottom {
    border-radius: 0px 0px 15px 15px !important;
    border-top: 1px solid var(--sprinttek-midgrey);
}

    .dispatch-row-order-container-bottom:hover .address-pop {
        display: block !important;
    }

.dispatch-stage-container {
    display: table-cell;
    width: 10%;
    vertical-align: middle;
    border-radius: 0px 15px 15px 15px;
    background-color: var(--sprinttek-darktext);
    background: var(--sprinttek-darktext-custombg) !important;
    color: var(--sprinttek-lighttext);
    text-align: center;
    position: relative;
    z-index: 3;
}

.dispatch-pickupaddress-container {
    display: table-cell;
    width: 40%;
    vertical-align: middle;
    background-color: var(--sprinttek-success);
    background: var(--sprinttek-success-custombg) !important;
    border-radius: 0px 15px 15px 0px;
    position: relative;
    left: -10px;
    z-index: 2;
    box-shadow: 5px 0px 0px var(--sprinttek-darkpink);
}

.dispatch-deliveryaddress-container {
    display: table-cell;
    width: 40%;
    vertical-align: middle;
    background-color: var(--sprinttek-danger);
    background: var(--sprinttek-danger-custombg) !important;
    border-radius: 0px 15px 15px 0px;
    position: relative;
    left: -22px;
    z-index: 1;
}

.dispatch-blank-row-space {
    display: table-cell;
    width: 10%;
    vertical-align: middle;
    width: 100%;
    background: var(--sprinttek-lighttext);
    border-radius: 0px 0px 15px 15px;
}

.dispatch-pl-10 {
    padding-left: 10px
}

.dispatch-pl-20 {
    padding-left: 20px
}

.row-checkbox > .dxbl-checkbox {
    padding: 0px !important;
    display: inline-block !important;
    float: left;
    border: none !important;
    height: 20px;
    margin-right: 10px;
    margin-top: -2px;
    margin-left: 5px;
}

.dispatch-items-bar {
    transition: width 200ms;
    right: 0;
    width: 0px;
    height: 0px;
    overflow: hidden;
    position: fixed;
    box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.24);
    top: 3.2rem;
}

.dispatch-items-bar-modal-backdrop {
    opacity: 0.5;
    display: none;
}

.dispatch-route-list.show-details > .dispatch-items-bar {
    width: 300px;
    height: calc(100% - 3.2rem);
    overflow-y: auto;
    overflow-x: hidden;
    z-index: 1100;
}

.dispatch-item-details {
    float: right;
    font-size: 22px;
    font-weight: bolder;
}

    .dispatch-item-details:hover, dispatch-item-details:active {
        background-color: var(--sprinttek-midgrey);
        background: var(--sprinttek-midgrey-custombg) !important;
        border-radius: 20px;
    }

.dispatch-sidebar-row {
    border-bottom: 1px solid var(--sprinttek-midgrey);
    vertical-align: middle;
    padding: 10px;
    width: 100%;
}

.dispatch-sidebar-row-header {
    vertical-align: middle;
    padding: 10px;
    width: 100%;
}

.item-clickable:hover {
    text-decoration: underline;
}

.clear-icon {
    color: #9e9e9e !important;
}

.edit-icon {
    color: #555555 !important;
}

/* #region GoBack Feature */
table tr.arrowback-bg {
    background-color: rgba(var(--yellow), 0.35);
    position: relative;
}

table tr.arrowback-bg {
    background-image: url(../images/go-back.png);
    background-size: auto 120px;
    background-repeat: no-repeat;
    background-position-y: center;
    animation-name: goback-anim;
    animation-duration: 10s;
    animation-iteration-count: infinite;
}

@keyframes goback-anim {
    0% {
        background-position-x: 105%;
    }

    100% {
        background-position-x: -5%;
    }
}
/* #endregion */
/*.go-back {
    background-color: #FC3;
    background-image: url(../images/goback-arrow.png);
    background-position: center center;
    background-repeat: repeat-x;
    background-clip: padding-box;
}

.go-back a {
    cursor: pointer !important;
    pointer-events: auto;
}*/
/*[data-item-name="OrderSummaryMessage"] + label::before {
    content: "Order Summary";
    font-weight: bold;
    display: block;
    margin-bottom: 4px;
}*/
[data-item-name="OrderSummaryMessage"] + label {
    background-color: #e9f5ff;
    border-left: 5px solid var(--sprinttek-primary);
    padding: 12px 16px;
    font-size: 14px;
    border-radius: 4px;
    display: block;
    color: #004085;
    white-space: normal;
    word-break: break-word;
}

[data-item-name="HolidayCustomMessage"] + label {
    background-color: #e9f5ff;
    border-left: 5px solid var(--sprinttek-primary);
    padding: 12px 16px;
    font-size: 14px;
    border-radius: 4px;
    display: block;
    color: #004085;
    white-space: normal;
    word-break: break-word;
}

/* #region Edit Count */
.edit-count-banner {
    background-color: var(--sprinttek-danger);
    background: var(--sprinttek-danger-custombg) !important;
    padding: 2px 10px;
    color: var(--sprinttek-lighttext);
    border-radius: 20px 6px 6px 20px;
    box-shadow: inset 0 0 0 100px rgba(var(--darkgrey), 0.4);
    border: 3px solid transparent;
    display: block;
    align-items: center;
    gap: 4px;
    margin-right: 5px;
}

.edit-count-icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    text-align: center;
    background-color: var(--sprinttek-danger);
    background: var(--sprinttek-danger-custombg) !important;
    border-radius: 20px;
    font-weight: 700;
    margin-left: -5px;
    line-height: 20px;
}

.edit-count-user,
.edit-count-date {
    margin: 0;
}

.view-notes-btn {
    border-style: dashed !important;
    border-width: 1px;
    border-color: currentColor;
    background: transparent;
    padding: 5px;
    height: 22px;
    color: var(--sprinttek-lighttext);
    cursor: pointer;
}

.grid-edit-spin {
    border: 1px solid var(--sprinttek-red);
    border-radius: 4px;
    padding: 2px;
}
/* #endregion */

.custom-map-container {
    width: 100% !important;
    height: calc(95.5vh - 100px) !important;
    max-height: 100%;
    border: 2px solid #ccc !important;
    border-radius: 8px !important;
    box-sizing: border-box;
}

.splitter {
    height: 100%;
    background-color: #ccc;
    cursor: col-resize;
}

.splitter-left {
    margin-right: 5px;
}

.splitter-right {
    margin-left: 5px;
}

/* HTML marker styles */
.pickup-marker, .delivery-marker, .pickup-customer-marker {
    width: 50px;
    text-align: center;
    opacity: 0.95;
}

.driver-marker {
    width: 50px;
    text-align: center;
    vertical-align: central;
}

.pickup-marker .pm-flag {
    border: 2px solid var(--sprinttek-tertiary);
    height: 20px;
    padding: 1px 1px;
    min-width: 20px;
    text-align: center;
    color: #FFF;
    width: auto;
    font-weight: 700;
    font-size: 12px;
    display: inline-block;
    text-shadow: -1px 0 rgba(0,0,0,0.5), 0 1px rgba(0,0,0,0.5), 1px 0 rgba(0,0,0,0.5), 0 -1px rgba(0,0,0,0.5);
    border-radius: 7px;
    box-shadow: 0 0 0 3px rgba(var(--green),.65);
}

    .pickup-marker .pm-flag span {
        display: block;
    }

.pickup-marker .pm-leg {
    width: 2px;
    background-color: var(--sprinttek-tertiary);
    background: var(--sprinttek-tertiary-custombg) !important;
    height: 20px;
    margin: 0px auto;
}

.delivery-marker .dm-flag {
    border: 2px solid var(--sprinttek-tertiary);
    height: 20px;
    padding: 1px 1px;
    min-width: 20px;
    text-align: center;
    color: #FFF;
    width: auto;
    font-weight: 700;
    font-size: 13px;
    display: inline-block;
    border-radius: 20px;
    text-shadow: -1px 0 rgba(0,0,0,0.5), 0 1px rgba(0,0,0,0.5), 1px 0 rgba(0,0,0,0.5), 0 -1px rgba(0,0,0,0.5);
    box-shadow: 0 0 0 3px rgba(var(--red),.45);
}

    .delivery-marker .dm-flag span {
        display: block;
    }

.delivery-marker .dm-leg {
    width: 2px;
    background-color: var(--sprinttek-tertiary);
    background: var(--sprinttek-tertiary-custombg) !important;
    height: 20px;
    margin: 0px auto;
}

.speech-bubble {
    color: var(--sprinttek-lighttext);
    border-radius: 50%;
    min-width: 22px;
    padding: 2px 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 10px;
    line-height: 1;
    white-space: nowrap;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.4);
    border: 1px dashed rgba(0, 0, 0, 0.3);
    z-index: 1000;
    position: absolute;
    transform: translate(-50%, -50%);
    box-shadow: inset 0 0 0 20px rgba(0, 0, 0, 0.3);
}

.triangle-border {
    position: relative;
    width: 0;
    height: 0;
    border-left: 22px solid transparent;
    border-right: 22px solid transparent;
    border-bottom: 31px solid red;
}

/* Inner yellow triangle inside the red border */
.triangle-fill {
    position: absolute;
    top: 5px;
    left: -17px;
    width: 0;
    height: 0;
    border-left: 17px solid transparent;
    border-right: 17px solid transparent;
    border-bottom: 23px solid yellow;
}

    /* Exclamation mark inside */
    .triangle-fill::after {
        content: "!";
        position: absolute;
        top: 0px;
        left: 50%;
        transform: translateX(-50%);
        font-weight: bold;
        font-size: 24px;
        color: red;
        font-family: Arial, sans-serif;
        user-select: none;
    }


.circle-resumed {
    width: 24px;
    height: 24px;
    background-color: #28a745;
    border: 2px solid #1e7e34;
    border-radius: 50%;
    color: var(--sprinttek-lighttext);
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    line-height: 24px;
}

.speech-bubble span, .speech-bubble-idle span {
    color: #fff;
}

.idle-legend {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border-style: dashed;
    border-color: #ff0000;
    background-color: #369;
    text-align: center;
    color: #fff;
}

    .idle-legend span {
        display: block;
        padding-top: 6px;
        font-weight: 700;
    }

.driver-icon {
    background: url(../images/courier-driver.png);
    background-size: cover;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border-style: solid;
    border-color: black;
}



.driver-legends:hover {
    cursor: pointer; /* Change the mouse cursor to a pointer (hand) on hover */
}


.pill-height {
    border-radius: 20px !important;
    height: 6px;
    line-height: 1.1;
}

.dispatch-timezone {
    font-weight: 600;
    font-size: .75rem;
    margin: 2px;
    background-color: var(--sprinttek-success);
    background: var(--sprinttek-success-custombg) !important;
    padding: 1px 6px;
    border-radius: 20px;
    color: var(--sprinttek-lighttext);
    /*border: 2px solid transparent;*/
    box-shadow: inset 0 0 0px 50px rgba(0, 0, 0, 0.1);
}

.dispatch-progress {
    position: relative;
    background-color: rgba(var(--midgrey), 0.1);
    /*box-shadow: inset 0 0 0px 50px rgba(0, 0, 0, 0.3);*/
    overflow: clip;
    /*border: 2px solid transparent;*/
}

.editor-progress {
    position: relative;
    background-color: rgba(var(--darkgrey), 0.3) !important;
    box-shadow: inset 0 0 0px 50px rgba(0, 0, 0, 0.3);
    border: 5px #c9d6df solid;
    overflow: clip;
}

    .dispatch-progress .progress-bar, .editor-progress .progress-bar {
        background-color: var(--sprinttek-primary);
        background: var(--sprinttek-primary-custombg) !important;
        font-size: 12px;
        height: -webkit-fill-available;
    }

.progress-inner-bar {
    width: -webkit-fill-available;
    width: -moz-available;
    text-align: center;
    position: absolute;
    vertical-align: middle;
    font-weight: 700;
    line-height: .9;
    top: 2px;
    color: var(--sprinttek-darktext);
    /*text-shadow: 0px 0px 2px black;*/
}

    .progress-inner-bar.editor-text-left {
        text-align: left !important;
        margin-left: 10px;
        margin-top: 3px;
    }

    .progress-inner-bar.editor-text-right {
        text-align: right !important;
        margin-right: 10px;
        margin-top: 3px;
    }

span.eta {
    width: 100%;
    display: block;
    color: var(--sprinttek-primary);
    text-decoration: underline;
}

    span.eta:hover {
        width: 100%;
        display: block;
        color: var(--sprinttek-primary);
        text-decoration: underline;
    }

.unfreeze-btn {
    background: rgba(var(--red), 0.1);
    border-color: rgba(var(--red), 0.5);
}

.delay-div {
    margin-top: -6%;
    text-align: center;
    background-color: #bc3c75;
    border-radius: 0px 0px 10px 10px;
}

.expedite-div {
    margin-top: -4%;
    text-align: center;
    background-color: #f26421;
    border-radius: 0px 0px 10px 10px;
}

.delay-expedite-span {
    font-size: x-small;
    color: var(--sprinttek-lighttext);
    font-weight: 600;
}

.delay-border-top {
    position: absolute;
    height: 2px;
    background: #bc3c75;
    width: 100%;
    left: 0;
    margin-top: -5px;
}

.expedite-border-top {
    position: absolute;
    height: 2px;
    background: #f26421;
    width: 100%;
    left: 0;
    margin-top: -5px;
}

.strikethrough-opacity {
    opacity: 0.50;
}

.leaflet-pm-icon-zone {
    background-image: url("/images/zone.svg");
    background-size: 65% 65%;
    background-repeat: no-repeat;
    background-position: center;
    background-color: transparent;
}

.leaflet-pm-icon-clear {
    background-image: url("/images/map-reset-layout.svg");
    background-size: 65% 65%;
    background-repeat: no-repeat;
    background-position: center;
    background-color: transparent;
}

.leaflet-pm-icon-map-criteria {
    background-image: url("/images/map-filter-icon.svg");
    background-size: 65% 65%;
    background-repeat: no-repeat;
    background-position: center;
    background-color: transparent;
}

.custom-icon .pickup-customer-marker {
    transition: transform 0.2s ease;
}

.custom-icon.selected .pickup-customer-marker {
    transform: scale(1.5);
}

.leaflet-popup-content {
    padding: 8px;
    max-width: 280px;
}

.popup-routing-rule {
    font-size: 1rem;
    font-weight: 700;
    color: #d63384;
    text-transform: uppercase;
    margin-bottom: 0.5rem;
}

.popup-customer-name {
    font-size: .90rem;
    font-weight: bold;
    color: #343a40;
    margin-bottom: 0.3rem;
}

.popup-customer-address {
    font-size: 0.875rem;
    font-style: italic;
    color: #495057;
}


.popup-message-container {
    background-color: var(--sprinttek-lighttext);
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 15px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    width: 758px;
    position: absolute;
    bottom: 10px;
    left: 50%;
    z-index: 1000;
    margin-left: 0px !important;
}

.popup-message-content {
    font-size: 14px;
    position: relative;
}

.close-btn {
    position: absolute;
    top: 5px;
    right: 10px;
    font-size: 20px;
    cursor: pointer;
    line-height: 1;
}

    .close-btn:hover {
        color: #d32f2f;
    }

.pickup-customer-marker .pm-shortleg {
    width: 2px;
    background: #000;
    height: 20px;
    opacity: 0.50;
}

.combobox-item-template {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    line-height: 1.2;
}

.delete-btn {
    background: none;
    border: none;
    color: #777;
    cursor: pointer;
    padding: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.2s, filter 0.2s;
}

.rt-bldr-floating-btn {
    width: 60px;
    height: 60px;
    border-radius: 30px;
    border: 0px;
    background: rgba(0, 0, 0, 0.3);
    position: absolute;
    right: 20px;
    top: calc(50% - 30px);
    z-index: 1000;
    transition: 0.3s;
}

    .rt-bldr-floating-btn:hover {
        width: 70px;
        height: 70px;
        border-radius: 35px;
        border: 0px;
        background: rgba(0, 0, 0, 0.5);
        position: absolute;
        right: 15px;
        top: calc(50% - 32.5px);
        z-index: 1000;
        transition: 0.3s;
    }

    .rt-bldr-floating-btn:before {
        content: "";
        display: block;
        width: 20px;
        height: 20px;
        border-left: 4px solid rgba(255,255,255, 0.5);
        border-bottom: 4px solid rgba(255,255,255, 0.5);
        rotate: 45deg;
        margin-left: 16px;
        transition: 0.3s;
    }

    .rt-bldr-floating-btn:hover:before {
        border-left: 4px solid rgba(255,255,255, 1);
        border-bottom: 4px solid rgba(255,255,255, 1);
        margin-left: 20px;
        transition: 0.3s;
    }
/* #region Revert this for Route Builder pins style */

.pickup-customer-marker .pm-flag {
    border: 2px solid var(--sprinttek-tertiary);
    height: 20px;
    padding: 1px 1px;
    min-width: 20px;
    text-align: center;
    color: #FFF;
    width: auto;
    font-weight: 700;
    font-size: 12px;
    display: inline-block;
    text-shadow: -1px 0 rgba(0,0,0,0.5), 0 1px rgba(0,0,0,0.5), 1px 0 rgba(0,0,0,0.5), 0 -1px rgba(0,0,0,0.5);
    border-radius: 7px;
    box-shadow: 0 0 0 3px rgba(var(--green),.65);
}

    .pickup-customer-marker .pm-flag span {
        display: block;
        margin: -1px auto;
        padding: 0px 2px;
    }
/* #endregion */
.pickup-customer-marker .pm-flag {
    box-shadow: 0 0 0 2px rgba(0,0,0,.5);
    height: 26px;
    padding: 1px;
    min-width: 26px;
    text-align: center;
    color: #FFF;
    width: auto;
    font-weight: 700;
    font-size: 12px;
    display: inline-block;
    text-shadow: -1px 0 rgba(0,0,0,0.5), 0 1px rgba(0,0,0,0.5), 1px 0 rgba(0,0,0,0.5), 0 -1px rgba(0,0,0,0.5);
    border-radius: 7px;
}

    .pickup-customer-marker .pm-flag span {
        display: block;
        margin: 3px auto;
    }

.pickup-customer-marker .pm-leg {
    width: 2px;
    background: #000;
    height: 20px;
    margin: 0px auto;
}

.no-select {
    user-select: none;
}

.dxbl-row {
    transition: all 0.3s ease;
}

.dxbl-form-layout-item {
    transition: all 0.3s ease;
}

[data-item-name="BuilderOrderTemplate_List"] {
    min-width: 250px;
}

.driver-status-btn {
    padding: 2px;
    border: none;
}

.driver-code {
    padding: 3px 8px;
}

.lbl {
    display: block;
    font-weight: 700;
    text-transform: uppercase;
    font-size: .6em;
}

.val {
    display: block;
    font-size: 14px;
    font-weight: 700;
    height: 16px;
    margin-top: -5px;
    text-align: center;
}

.lbl-val {
    min-width: 68px;
    text-align: center;
    border-radius: 8%;
    padding: 5px;
    margin-right: 5px;
}

.lbl-proximity {
    background-color: #ebebeb;
}

.lbl-blindCount {
    background-color: #fddddf;
    margin-right: 5px;
}

.driver-status {
    display: flex;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    /* Position the tooltip */
    position: absolute;
    z-index: 1;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
}

.div-btn {
    margin-left: 10px;
}

.div-btn-device {
    border: none;
    padding: 5px
}

.flex-container {
    display: flex;
    flex-wrap: nowrap;
}

.driver-div {
    display: flex;
}

.btn-driver {
    width: 23px;
    height: 23px;
}

.img-device,
.img-device-outdated {
    width: 18px;
    height: 18px;
    position: relative;
    top: 4px;
}

.driver-name {
    vertical-align: middle;
    padding: 6px 5px 6px 0px;
}

.status-icon-active {
    background-color: var(--sprinttek-success);
    background: var(--sprinttek-success-custombg) !important;
}

.status-icon-inactive {
    background-color: var(--sprinttek-midgrey);
    background: var(--sprinttek-midgrey-custombg) !important;
}

.status-icon {
    width: .6em;
    height: .6em;
}
/*ReportSchedulerRazor*/
.table-report-scheduler-razor {
    width: 100%
}

    .table-report-scheduler-razor td {
        padding-bottom: 10px
    }

.table-report-scheduler-razor-td1 {
    width: 8%
}

/*DashboardItems vertically alligned*/
.dxbl-fl-ctrl {
    margin-top: 3px !important;
}


.font-white-warning {
    color: white !important;
}

.size-title-warning {
    font-weight: bold;
}

.size-info {
    font-size: 12px;
}

.icon-size-warning {
    font-size: 25px !important;
}

.valign-middle-warning {
    vertical-align: middle !important;
}


.start-call-btn {
    background-color: var(--sprinttek-success);
    background: var(--sprinttek-success-custombg) !important;
    color: var(--sprinttek-lighttext);
}

.end-call-btn {
    background-color: var(--sprinttek-danger);
    background: var(--sprinttek-danger-custombg) !important;
    color: var(--sprinttek-lighttext);
}


.lead-convert-to-customer-btn {
    background-color: #43a064;
    color: var(--sprinttek-lighttext);
}

/* File upload css */
.custom-drop-zone {
    padding: 0 !important;
    border-style: dashed;
    border-width: 2px !important;
    height: 230px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: rgba(183, 183, 183, 0.1);
}

    .custom-drop-zone.custom-drop-zone-hover {
        border-style: solid;
    }

    .custom-drop-zone svg {
        width: 42px;
        height: 42px;
    }

    .custom-drop-zone > *:not(#overviewDemoSelectButton) {
        pointer-events: none;
    }

.drop-file-icon {
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: #ADB5BD;
    width: 48px;
    height: 48px;
    -webkit-mask-image: url("../images/icons/drop-file.svg");
    mask-image: url("../images/icons/drop-file.svg");
}

.drop-file-label {
    font-weight: 500;
    font-size: 1rem;
}

/*----ORYA css----*/
.dxbl-chatui-empty-icon {
    display: none;
}

.dxbl-chatui-empty-text-title::before {
    content: "";
    display: block;
    width: 100px;
    height: 100px;
    border-radius: 50px;
    position: relative;
    background: url(../images/orya-anim.gif) center center no-repeat;
    background-size: contain;
}

.dxbl-chatui-messages .dxbl-chatui-message {
    border-radius: 10px !important;
    transition: 0.3s;
    border: 1px solid transparent;
}

.dxbl-chatui-messages .dxbl-chatui-message-container:last-child .dxbl-chatui-message.dxbl-chatui-message-assistant {
    border: 1px solid rgba(0, 174, 239, 1);
    box-shadow: 0 0 0 rgba(0, 174, 239, 1);
    animation: pulse 2s infinite;
}

@-webkit-keyframes pulse {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(0, 174, 239, 0.4);
    }

    70% {
        -webkit-box-shadow: 0 0 0 10px rgba(0, 174, 239, 0);
    }

    100% {
        -webkit-box-shadow: 0 0 0 0 rgba(0, 174, 239, 0);
    }
}

@keyframes pulse {
    0% {
        -moz-box-shadow: 0 0 0 0 rgba(0, 174, 239, 0.4);
        box-shadow: 0 0 0 0 rgba(0, 174, 239, 0.4);
    }

    70% {
        -moz-box-shadow: 0 0 0 10px rgba(0, 174, 239, 0);
        box-shadow: 0 0 0 10px rgba(0, 174, 239, 0);
    }

    100% {
        -moz-box-shadow: 0 0 0 0 rgba(0, 174, 239, 0);
        box-shadow: 0 0 0 0 rgba(0, 174, 239, 0);
    }
}

.dxbl-chatui-messages .dxbl-chatui-message-container:has(.dxbl-chatui-message.dxbl-chatui-message-assistant)::before {
    content: "";
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    position: relative;
    top: 15px;
    left: -10px;
    background: url(../images/orya-still.gif) center center no-repeat;
    background-size: contain;
}

.dxbl-chatui-messages .dxbl-chatui-message-container:has(.dxbl-chatui-message.dxbl-chatui-message-assistant):last-child::before {
    content: "";
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    position: relative;
    top: 15px;
    left: -10px;
    background: url(../images/orya-anim.gif) center center no-repeat !important;
    background-size: contain !important;
}


/*address editor*/
.dropdown-popup-container {
    width: 100%; /* Match parent width */
    border: 1px solid #d7d7d7;
    position: absolute;
    z-index: 1999999999999 !important;
}

.dropdown-popup {
    background: var(--sprinttek-lighttext);
    overflow-y: auto; /* Vertical scroll only if needed */
    max-height: 200px; /* Limit height */
    width: 100%; /* Take full container width */
    position: relative;
    z-index: 1999999999999 !important;
}

.dropdown-item {
    padding: 8px 12px;
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%; /* Take full width of popup */
    box-sizing: border-box; /* Include padding in width calculation */
}

    .dropdown-item:hover {
        background-color: #f5f5f5;
    }

.clear-button {
    color: #ff5722;
}

    .clear-button:hover {
        color: #e64a19;
    }

.address-status {
    margin-top: 8px;
    font-size: 0.9em;
}

.badge {
    padding: 4px 8px;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.bg-success {
    background-color: #d4edda;
    color: #155724;
}

.bg-warning {
    background-color: #fff3cd;
    color: #856404;
}

.dx-icon-spindown, .dx-icon-edit {
    font-size: 22px;
}

.dropdown-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 999; /* Below dropdown */
    background: transparent;
}
/*end address editor*/

.preview-delimeter {
    display: none;
}
/* End File Upload css */
.dp-order-notes {
    opacity: .75;
}

    .dp-order-notes .dp-label {
        display: inline-block;
        margin-right: 3px;
        /*color: var(--sprinttek-darktext);*/
    }

    .dp-order-notes .dp-value, {
        display: inline-block;
        /*font-weight: 700;*/
    }

.dxbl-btn-group:has(button[data-action-name="Assign Driver"]),
.dx-button-container:has(button[data-action-name="Assign Driver"]) {
    display: none !important;
}

tr:has(.order-stage[data-stage="delivered"]) button[data-action-id="Set Complete"] {
    display: none !important;
}

tr:has(.order-stage:not([data-stage="delivered"])) button[data-action-id="RollBack Complete"] {
    display: none !important;
}

td.xaf-action:has(div.dispatch_event_hide) {
    display: none !important;
    width: 0 !important;
}

th.dxbl-grid-header:has(.dispatch_event_hide) {
    display: none !important;
    width: 0 !important;
}

dxbl-date-edit.parametrized-action-wrapper {
    width: 140px;
}

.DispatchDashboard_View .cursor-pointer a {
    cursor: pointer;
}

.DispatchDashboard_View .cursor-pointer:not(:has(a)), .DispatchDashboard_View td.xaf-action:not(:has(a)) {
    cursor: default !important;
}

#legend {
    right: 10px !important;
}

    #legend > .legend-nav {
        font-size: 0.875rem;
        background-color: #fff;
        border-radius: 0.5rem;
    }

        #legend > .legend-nav > .nav > .nav-item {
            padding-bottom: 15px;
        }

.timeline-pointer {
    cursor: pointer;
    text-decoration: underline;
}

.xaf-alert-settings-container .xaf-alert-inner-settings-container {
    width: 100% !important;
}

.dispatch-preview-attachment {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    color: #007bff;
}

    .dispatch-preview-attachment:hover {
        text-decoration: underline;
    }

.img-attach {
    background: url(../images/paper-clip.png) 0 0 no-repeat;
    background-size: 18px;
    color: var(--sprinttek-yellow);
    cursor: pointer;
}

/*---CUSTOMER PROFILE----*/
.profile-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(var(--tertiary), 0.1);
    font-family: var(--sprinttek-fontfamily);
}

.profile-avatar {
    height: 150px;
    font-size: 14px;
    font-weight: 600;
}

    .profile-avatar .img-thumbnail {
        height: 150px !important;
        width: 150px !important;
    }

        .profile-avatar .img-thumbnail .xaf-component-image {
        }

.profile-info {
    margin-top: 40px;
    font-weight: 700;
}

.customer_account_label, .customer_todaysdate_label {
    font-size: 1.2rem;
    font-weight: 700;
}

.profile-info-card {
    margin-top: 40px;
    border-left: 1px dashed rgba(var(--tertiary), 0.2);
}

    .profile-info-card dxbl-form-layout-item.dxbl-fl-item {
        display: block !important;
    }

.customer_account_label, .customer_address_label, .customer_contact_label, .customer_todaysdate_label {
    margin-top: 1px;
}


.customer_address_label {
    font-weight: 500;
}

.customer_contact_label {
    font-weight: 500;
}

.customer_todaysdate_label {
    padding: 10px 25px 10px 15px;
    border-radius: 20px;
    text-align: right;
    margin-top: 15px;
}

/*google auto complete resutl*/
.place-autocomplete-element-place-name {
    display: block;
    font-size: 14px;
    font-weight: 500;
    line-height: 16px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.place-autocomplete-element-place-details {
    font-weight: 400;
    font-size: 12px;
}

.composite-view-clickable-link {
    text-decoration: underline;
    cursor: pointer;
}

.composite-view-dx-memo {
    white-space: pre-wrap;
    border: 1px solid #ccc;
    border-radius: 6px;
    padding: 8px;
    height: 167px;
    overflow-y: auto;
    resize: vertical;
}

.dxbl-text-edit-template {
    padding-left: 0px !important
}

.styled-textbox input {
    text-decoration: underline;
    cursor: pointer !important;
}



/* Base InfoWindow Styles */
.gm-info-window {
    font-family: var(--bs-body-font-family);
    max-width: 400px;
    position: relative;
    padding: 8px;
}

.gm-style-iw-d {
    overflow: auto !important;
}
/* Header Styles */
.info-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 8px;
    margin-bottom: 8px;
    border-bottom: 1px solid #eee;
}

.info-title {
    margin: 0;
    font-size: 16px;
    font-weight: bold;
}

.info-close-button {
    background: none;
    border: none;
    font-size: 18px;
    cursor: pointer;
    padding: 0 4px;
    color: #70757a;
}

    .info-close-button:hover {
        color: #202124;
    }

/* Table Styles */

.gm-ui-hover-effect {
    display: none !important;
}

.info-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 8px;
}

    .info-table tr:not(:last-child) {
        border-bottom: 1px solid #f1f3f4;
    }
    /* Table header styles */
    .info-table th {
        text-align: left;
        padding: 8px;
        background: #f8f9fa;
        border-bottom: 2px solid #e0e0e0;
    }

.label-cell {
    font-weight: bold;
    padding: 6px 8px;
    vertical-align: top;
    white-space: nowrap;
}

.value-cell {
    padding: 6px 8px;
    vertical-align: top;
    word-break: break-word;
}

.button-cell {
    padding: 6px 8px;
    vertical-align: top;
    word-break: break-word;
}

/* Warning Styles */
.warning-cell {
    color: #d32f2f;
    font-weight: bold;
}

/* Status Indicators */
.status-indicator {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-right: 6px;
}

.status-active {
    background-color: #34a853;
}

.status-idle {
    background-color: #fbbc04;
}

.status-warning {
    background-color: #d32f2f;
}

.action-buttons {
    display: flex;
    justify-content: space-between;
    margin-top: 15px;
    padding-top: 10px;
    border-top: 1px solid #eee;
}


/* gradient-picker */
.gradient-picker {
    display: flex;
    flex-wrap: wrap; /* allow wrapping on small screens */
    gap: 0.5rem;
}

.gradient-picker-combo {
    width: 80px;
}

.gradient-picker-spinner {
    flex: 1 1 80px;
    width: 80px;
}

.gradient-color {
    width: 40px;
    height: 38px;
    padding: 0;
    border: 1px solid #ddd;
    flex-shrink: 0; /* prevent shrinking too much */
}

.gradient-preview {
    flex: 1 1 100px;
    min-width: 80px;
    height: 38px;
    border-radius: 4px;
    border: 1px solid #ddd;
}

.dxbl-checkbox input {
    top: auto !important;
    left: auto !important;
}

/*Photo Gallery*/
.photo-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 16px; /* space between photos */
    padding: 8px;
}

.photo-card {
    display: flex;
    flex-direction: column;
    background-color: var(--neutralBackground1);
    border: 1px solid var(--neutralStroke1);
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

    .photo-card:hover {
        transform: scale(1.03);
        box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    }

.photo-placeholder {
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--neutralBackground2);
    color: var(--neutralForeground3);
    font-size: 14px;
}

.photo-img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    display: block;
}

.photo-caption {
    text-align: center;
    padding: 8px;
    font-size: 13px;
    color: var(--neutralForeground1);
    background-color: var(--neutralBackground1);
    border-top: 1px solid var(--neutralStroke2);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.grid-list-editor-customization {
    height: 600px;
}

.dp-label:has(.img-device-outdated)::before {
    content: "";
    background: url(../images/warning-triangle.png);
    background-size: cover;
    width: 14px;
    height: 14px;
    color: black;
    display: block;
    font-size: 10px;
    font-weight: bold;
    line-height: 1.05;
    position: absolute;
    z-index: 23;
    margin-left: -6px;
}

.Progress-text {
    font-size: 10px;
}
/*---------------------------------------Theme CSS Override END---------------------------------------------*/