/*--------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);
}

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

html, body {
    height: 100%;
}

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-----*/
.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) !important;
    background: var(--sprinttek-greendiamond) !important;
}
/*-----GRID OVERRIDE-------*/
.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 {
    font-size: 0.85rem;
}

.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 {
    max-height: calc(75vh - 140px);
}
/*-----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: var(--sprinttek-lighttext);
}

.logo-tabs {
    padding-left: 0px;
}
.company-logo-alt .xaf-image-container {
    background: var(--sprinttek-darkgrey);
}

    .company-logo-main .xaf-image-container img, .company-logo-alt .xaf-image-container img {
        border-radius: 0px;
    }
.logo-darkmode {
    background: var(--sprinttek-darkgrey);
}

    .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: var(--sprinttek-primary) !important;
    background-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-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 {
    filter: invert(50%) sepia(100%) saturate(400%) hue-rotate(290deg) brightness(290%) contrast(100%);
}
/*------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: 300px;
    margin: 0 auto;
    display: block;
}
.logon-template-body {
    padding: 5px;
}
.login-form {
    padding: 0px;
    margin: auto;
}

.logon-main {
    border-radius: 10px;
    max-width: 450px;
    width: 100%;
}

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

        .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;
}
.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 {
    background: #FFF;
    border: 1px solid rgba(var(--lightgrey), 0.8);
    color: var(--sprinttek-darktext);
    box-shadow: 0 2px 2px 0px rgba(var(--darkgrey),0.4);
}
    .logon-main .card-body .logon-viewsite .dxbl-text-edit {
        
        color: var(--sprinttek-darktext);
        
        padding: 5px;
        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;
    }
.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) !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: 1px;
    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)
}

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

@media only screen and (max-width: 500px) {
    .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: initial;
    }
        .div-sandbox-warning  a.sandbox-remain {
            margin-top: 0px !important;
        }
}

/*------BUTTON OVERRIDE---------*/
/*.dxbl-btn {
    font-weight: 500;
}
.dxbl-btn-primary {
    background-color: var(--sprinttek-primary);
    border-color: var(--sprinttek-primary);
    color: var(--sprinttek-lighttext);
}

    .dxbl-btn-primary.dxbl-btn.dxbl-disabled:hover, .dxbl-btn-primary.dxbl-btn:disabled:hover {
        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(--sprinttek-primary);
    border-color: var(--sprinttek-primary);
    color: var(--sprinttek-lighttext);
}*/

.dxbl-btn {
    font-weight: 500;
}

.dxbl-btn-primary {
    background-color: var(--sprinttek-primary);
    border-color: var(--sprinttek-primary);
    color: var(--sprinttek-lighttext);
}

.dxbl-btn:not(.dxbl-disabled):not(:disabled):hover {
    background-color: var(--sprinttek-secondary) !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-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);
}

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

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

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

    .btn-primary:hover {
        color: #fff;
        background-color: var(--sprinttek-secondary);
        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)
}

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

.xaf-navmenu {
    padding: 0px;
}
    .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: .85rem;
}

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

.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(248, 249, 250, 0.3);
}

.sidebar {
    border-right: 1px solid rgba(248, 249, 250, 0.3);
}

nav .dxbl-group {
    border: 0px;
}
.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;
}
/*nav .dxbl-text-edit:has(:hover), nav .dxbl-text-edit:has(:focus) {border-bottom: 0px;}*/
.dxbl-navigation-filter.dxbl-text-edit, nav .dxbl-navigation-filter.dxbl-text-edit:has(:focus), nav .dxbl-navigation-filter.dxbl-text-edit:has(:hover) {
    border-top-width: 0px;
    border-left-width: 0px;
    border-right-width: 0px;
    border-bottom-width: 1px;
}

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::before {
    background: var(--sprinttek-primary)
}

.dxbl-accordion .dxbl-accordion-group .dxbl-accordion-item:not(.dxbl-accordion-group):not(.dxbl-disabled):not(:disabled).dxbl-active > .dxbl-accordion-item-content::before {
    opacity: 7%;
}

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

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    background: var(--sprinttek-primary)
}

.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);
}
.dxbl-pager > .dxbl-btn.dxbl-btn-outline-secondary.dxbl-pager-page-btn:not(.dxbl-disabled):not(:disabled):hover {
    background-color: var(--sprinttek-lightblue);
}
/*-----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;
}
.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;
    background: rgba(var(--darkgrey), 0.2);
    padding: 0px 10px;
    color: #FFF !important;
    text-shadow: 0 2px 2px rgba(0, 0, 0, 0.5);
    box-shadow: inset 0 0 0px 50px rgba(0, 0, 0, 0.3);
    border: 2px solid transparent;
}
.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 .dxbl-scroll-viewer-content,
.RouteDetailModel_ListView .dxbl-scroll-viewer-content {
    padding-left: 5px;
}
.DispatchDashboard_View tr th:first-child,
.RouteDetailModel_ListView 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,
.RouteDetailModel_ListView .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),
.RouteDetailModel_ListView.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,
    .RouteDetailModel_ListView.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),
    .RouteDetailModel_ListView.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,
        .RouteDetailModel_ListView.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,
            .RouteDetailModel_ListView.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,
.RouteDetailModel_ListView tr.cursor-pointer.xaf-prevent-contextmenu > td.dxbl-grid-selection-cell {
    border-radius: 10px 0 0 0;
    border-left-width: 1px;
    /*border-top-width: 2px;*/
}

.DispatchDashboard_View tr.cursor-pointer.xaf-prevent-contextmenu td:not(.dxbl-grid-indent-cell),
.RouteDetailModel_ListView tr.cursor-pointer.xaf-prevent-contextmenu td:not(.dxbl-grid-indent-cell) {
    border-bottom-width: 1px;
    /*border-top-width: 2px;*/
}

.DispatchDashboard_View tr.cursor-pointer.xaf-prevent-contextmenu td:last-child,
.RouteDetailModel_ListView 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,
.RouteDetailModel_ListView.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,
.RouteDetailModel_ListView.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),
    .RouteDetailModel_ListView.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: var(--sprinttek-lightyellow);
    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);
    text-decoration: underline;
}
.no-loading-indicator.grid-cell-object-link:hover {
    color: var(--sprinttek-secondary);
    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);
        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: var(--sprinttek-darkgrey);
}

/*-----KPI DASHBOARD STYLES-------*/

.indicator-tb {
    width: 100%;
    text-align: center;
    min-height: 130px;
    margin-bottom: 10px;
}

.kpi-box .card {
    padding: 15px;
    border-radius: 15px;
    min-height: 130px;
    border: 2px solid transparent;
}
    .kpi-box .card::before {
        content: "";
        background: linear-gradient(350deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0) 50%);
        position: absolute;
        height: 85px;
        width: 100%;
        bottom: 0px;
        right: 0px;
        margin: 0px;
        border-radius: 10px;
        z-index: 2;
    }
    .kpi-box .card::after {
        content: "";
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.4) 85%);
        position: absolute;
        height: 130px;
        width: 100%;
        top: 0;
        left: 0;
        border-radius: 15px;
        z-index: 1;
        mix-blend-mode: overlay;
    }

.kpi-value {
    /*font-size: 3.4em;*/
    font-size: 2.55vw;
    font-weight: 400;
    color: var(--sprinttek-lighttext);
    text-shadow: 0 2px 2px rgba(0,0,0,0.6);
    position: absolute;
    width: 100%;
    bottom: 45px;
    left: 0;
    z-index: 3;
}

.kpi-label {
    font-weight: 700;
    color: var(--sprinttek-lighttext);
    background: rgba(0, 0, 0, 0.4);
    /* box-shadow: inset 0 0 20px 0 rgba(0,0,0,0.5); */
    border-bottom: 1px solid rgba(255, 255, 255, 0.4);
    text-shadow: 0 1px 1px rgba(0,0,0,0.6);
    border-radius: 13px 13px 0px 0px;
    z-index: 3;
    margin: -15px;
    padding: 7px;
    font-size: .78vw;
}
/*-----------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: var(--sprinttek-darkgrey);
        border-color: var(--sprinttek-darkgrey);
    }

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

.dol-card-btn {
    width: 100%;
    font-weight: 700;
    font-size: 0.85rem;
    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);
    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 #logon-template-component {
        position: relative !important;
    }

    .login-logo {
        position: relative;
    }
    /*KPI*/
    .kpi-box .card {
        margin-bottom: 20px;
    }
    .kpi-value {
        font-size: 3.4em;
    }
    .kpi-label {
        font-size: .9rem;
    }
 }

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

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

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

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

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-red);
    background-color: var(--sprinttek-red);
}

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

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

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

.delivery-row-bg {
    background-color: var(--sprinttek-pink);
}

.dispatch-group-header {
    background: var(--sprinttek-grey);
    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: var(--sprinttek-darktext);
    color: var(--sprinttek-lighttext);
    text-align: center;
    position: relative;
    z-index: 3;
}

.dispatch-pickupaddress-container {
    display: table-cell;
    width: 40%;
    vertical-align: middle;
    background: var(--sprinttek-lightgreen);
    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: var(--sprinttek-pink);
    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: var(--sprinttek-midgrey);
    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;
}
.go-back {
    background-color: #FC3;
    background-image: url(../images/goback-arrow.png);
    background-position: center center;
    background-repeat: repeat-x;
}
/*[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;
}

.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: 26px;
    padding: 4px 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-marker .pm-flag span {
        display: block;
    }

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

.delivery-marker .dm-flag {
    border: 2px solid var(--sprinttek-tertiary);
    height: 26px;
    padding: 4px 1px;
    min-width: 26px;
    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);
}

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

.delivery-marker .dm-leg {
    width: 2px;
    background: var(--sprinttek-tertiary);
    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: 23px;
    line-height: 1.1;
}
.dispatch-timezone {
    font-weight: 600;
    font-size: .75rem;
    margin: 2px;
    background-color: var(--sprinttek-lightgreen);
    padding: 1px 6px;
    border-radius: 20px;
    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(--darkgrey), 0.3) !important;
    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-green);
     
        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: bolder;
    line-height: .9;
/*    font-size: larger;*/
    top: 2px;
    color: #ffffff;
    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: var(--sprinttek-delay);
    border-radius: 0px 0px 10px 10px;
}
.expedite-div {
    margin-top: -4%;
    text-align: center;
    background-color: var(--sprinttek-expedite);
    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: var(--sprinttek-delay);
    width: 100%;
    left: 0;
    margin-top: -5px;
}
.expedite-border-top {
    position: absolute;
    height: 2px;
    background: var(--sprinttek-expedite);
    width: 100%;
    left: 0;
    margin-top: -5px;
}
.strikethrough-opacity {
    opacity: 0.50;
}


.custom-icon .pickup-customer-marker {
    transition: transform 0.3s 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.85rem;
    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;
    }

.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: var(--sprinttek-green);
}
.status-icon-inactive {
    background: var(--sprinttek-midgrey);
}
.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: var(--sprinttek-midgreen);
    color: var(--sprinttek-lighttext);
}
.end-call-btn {
    background: var(--sprinttek-midred);
    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;
}

.profile-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px;
    border-radius: 8px;
    /*background-color: #f5f6fa;*/
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    font-family: var(--sprinttek-fontfamily);
}

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

    .profile-avatar .img-thumbnail {
        height: 100% !important;
        width: 100% !important;
    }
.profile-info {
    /* font-size: 20px; */
    color: #777;
    font-weight: 650;
}
.customer_account_label, .customer_todaysdate_label {
    font-size: 30px;
    font-weight: 650;
    color: #777;
}
.customer_account_label, .customer_address_label, .customer_contact_label, .customer_todaysdate_label {
    margin-top: 1px;
}
.profile-info-card {
    /*padding-top: 20px;*/
}
.profile-card {
    padding: 25px;
}
.customer_address_label {
    font-weight: 500;
}
.customer_contact_label {
    font-weight: 500;
}
.customer_todaysdate_label {
    text-align: right;
}
/*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;
}

    /*---------------------------------------Theme CSS Override END---------------------------------------------*/