.dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview {
    height: calc(100% - 50px) !important;
    bottom: 0;
    right: 0;
    position: absolute;
    margin: 0;
    border-radius: 0;
	border: 1px solid rgba(var(--midgrey), 0.25);
  box-shadow: 0 0 20px 20px rgba(0,0,0,0.2);
    animation: open-qv .6s ease;
}

/* LARGE */
.dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview.quickview-large:not(.mapview-flyout) {
    width: 1500px ;
    max-width: 1500px ;
    width: min(1500px, 100%) ;
    animation: open-large .5s ease;
}

/* MEDIUM */
.dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview-medium:not(.mapview-flyout) {
    width: 1000px ;
    max-width: 1000px;
    width: min(1000px, 100%);
    animation: open-medium .5s ease ;
}

/* SMALL */
.dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview-small:not(.mapview-flyout) {
    width: 500px !important;
    max-width: 520px !important;
    width: min(520px, 100%) !important;
    animation: open-small .5s ease !important;
}

/* XSMALL */
.dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview-xsmall:not(.mapview-flyout){
    width: 360px ;
    max-width: 360px ;
    width: min(360px, 100%) ;
    animation: open-xsmall .5s ease ;
}

body .dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview > .dxbl-modal-content > .dxbl-modal-header/*, 
 body .dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview > .dxbl-modal-content > .dxbl-modal-footer */ {
	min-height: 46px;
	height: 46px;
}
.dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview .dxbl-popup-header {
    position: fixed;
    background: var(--bs-body-bg);
    z-index: 2;
    border-bottom: 1px solid rgba(var(--midgrey), .5);
}

.dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview.quickview-large .dxbl-popup-header {
    width: 1500px;
}
.dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview.quickview-medium .dxbl-popup-header {
    width: 1000px;
}
.dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview.quickview-small .dxbl-popup-header {
    width: 520px;
}
.dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview.quickview-xsmall .dxbl-popup-header {
    width: 340px !important;
}
    .dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview .quickview-body {
        height: calc(100% - 93px) !important;
    }

    .dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview .dxbl-modal-body {
        margin-top: 60px;
		padding-left: 10px;
		padding-right: 10px;
        animation-name: open-qv-body;
        animation-duration: .6s;
    }
	.dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview .dxbl-modal-body:has(.summary-view-top) {
		/* background-color:rgba(var(--midgrey), 0.15); */
    }

    .dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview > .dxbl-modal-content {
        border-radius: 0px;
    }

    .dxbl-modal:has(.quickview) > .dxbl-modal-back {
        display: none !important;
    }
    /* opening animation code */
@keyframes open-xsmall {
    0% {
        width: 0px;
    }

    90% {
        width: 370px !important;
    }

    100% {
        width: 340px;
    }
}
    @keyframes open-small {
        0% {
            width: 0px !important;
        }

        90% {
            width: 520px !important;
        }

        100% {
            width: 500px !important;
        }
    }

    @keyframes open-medium {
        0% {
            width: 0px;
        }

        90% {
            width: 1020px !important;
        }

        100% {
            width: 1000px;
        }
    }

    @keyframes open-large {
        0% {
            width: 0px;
        }

        90% {
            width: 1520px !important;
        }

        100% {
            width: 1500px;
        }
    }

    @keyframes open-qv-body {
        0% {
            opacity: 0;
        }

        50% {
            opacity: 0;
        }

        75% {
            opacity: .5
        }

        100% {
            opacity: 1;
        }
    }

    .dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview .dxbl-modal-header .dxbl-toolbar .dxbl-btn-toolbar {
        padding-right: 20px;
    }
	.dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview .dxbl-modal-header 
	.dxbl-btn-toolbar button.dxbl-toolbar-btn, 
	.dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview .dxbl-modal-header .dxbl-btn-split button {
		padding: 0px 10px;
		min-height: 32px;
	}
	.dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview .dxbl-modal-header 
	.dxbl-btn-toolbar button:hover {
		background-color: var(--site-secondary) !important;
		color: white !important;
		border-color:  var(--site-secondary) !important;
	}
	
		.dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview:not(.mapview-flyout) .dxbl-modal-content > .dxbl-modal-header button[data-qa-selector="dx-popup-close-button"] {
		position: absolute;
		margin-left: -70px;
		background: var(--site-secondary);
		border: 1px solid rgba(var(--midgrey), 0.5);
		width: 40px;
		height: 40px;
		color: white;
	}
	.dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview:not(.mapview-flyout) .dxbl-modal-content > .dxbl-modal-header button[data-qa-selector="dx-popup-close-button"]:hover {
		position: absolute !important;
		margin-left: -70px !important;
		border: 1px solid rgba(var(--primary), 0.5) !important;
		background-color: var(--site-primary) !important;
		cursor: pointer;
		color: white;
	}

.dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview > .dxbl-modal-content .dxbl-popup-header > .dxbl-modal-header .dxbl-popup-header-button:not(.dxbl-disabled):not(:disabled):hover, 
.dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview > .dxbl-modal-content > .dxbl-modal-header .dxbl-popup-header-button:not(.dxbl-disabled):not(:disabled):hover	{
		background-color: var(--site-secondary) !important;
	}
    /*.dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview .dxbl-modal-content > .dxbl-modal-header .dxbl-btn {
    border: 0px;
}*/

    .dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview .dxbl-modal-content > .dxbl-modal-header .dxbl-btn .dxbl-image.image {
        width: 16px;
        height: 16px;
        filter: grayscale(100%);
    }

    .dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview .dxbl-modal-content > .dxbl-modal-header .dxbl-btn:hover .dxbl-image.image {
        filter: invert(50%) sepia(100%) saturate(400%) hue-rotate(290deg) brightness(290%) contrast(100%) !important;
    }
	

	
.ssqv-main .ssqv-view {
	width: 100%;
	transition: .3s;
}
.ssqv-main .ssqv-view .dxbl-fl-gd:not(.ssqv-main .ssqv-view .dxbl-fl-gd:first-child) {
	margin-top: 0px !important;
}

.ssqv-main .ssqv-view .dxbl-fl-item:not(:has(.xaf-image-container)) {
	margin-top: 0px;
}
.ssqv-main .ssqv-view label span.tev-required {
	display:none;
}
.ssqv-view.dxbl-fl-group .dxbl-row > .dxbl-fl-item:not(:has(.dxbl-text-edit.dxbl-memo-edit)):not(:has(.img-thumbnail)):not(:has(.media-thumbnail-wrapper)):not(:has(.nested-frame)) {
	display: flex !important;
	border-bottom: 1px dashed rgba(var(--midgrey), 0.5);
	padding: 0px !important;
	margin-right: 12px;
	margin-left: 12px;
	margin-top: 4px;
	width: calc(100% - 24px) !important;
	flex-direction: row;
}
.ssqv-view .dxbl-fl-item:not(:has(.dxbl-text-edit.dxbl-memo-edit)):not(:has(.img-thumbnail)):not(:has(.media-thumbnail-wrapper)) > .dxbl-fl-cpt {
	width: 40% !important;
	display: block;
  margin-top: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
	margin-top: 4px;
}
.ssqv-view .dxbl-fl-item:not(:has(.dxbl-text-edit.dxbl-memo-edit)):not(:has(.img-thumbnail)):not(:has(.media-thumbnail-wrapper)):not(:has(.nested-frame)) > .dxbl-fl-ctrl {
	display: flex !important;
	border-bottom: transparent;
	width: 60% !important;
	justify-content: flex-end;
}
.ssqv-main .ssqv-view .xaf-combobox-item:not(td .xaf-combobox-item) {
	flex-direction: row-reverse;
}
.ssqv-main .ssqv-view .xaf-combobox-item .dxbl-image.xaf-combobox-icon {
	margin-left: 5px;
}
.ssqv-view .dxbl-fl-item:not(:has(.nested-frame)) > .dxbl-fl-ctrl .dxbl-text-edit:not(.dxbl-text-edit.dxbl-memo-edit):not(:focus) {
	border-bottom: 1px solid transparent;
}
.ssqv-view .dxbl-fl-item:not(:has(.nested-frame)) > .dxbl-fl-ctrl .dxbl-text-edit:not(.dxbl-text-edit.dxbl-memo-edit):hover  {
	border-bottom: 1px solid rgba(var(--primary), 0) !important;
    box-shadow: 0px 0px 0px 0px rgba(var(--primary), .4) !important;
	transition: none !important;
}
.ssqv-view .dxbl-fl-item:not(:has(.nested-frame)) > .dxbl-fl-ctrl .dxbl-text-edit:not(.dxbl-text-edit.dxbl-memo-edit) input,
.ssqv-view .dxbl-fl-item:not(:has(.nested-frame)) > .dxbl-fl-ctrl .dxbl-text-edit.dxbl-disabled .dxbl-text-edit-template {
	text-align: right;
	justify-content: end;
}
.ssqv-view .dxbl-fl-item:not(:has(.nested-frame)) > .dxbl-fl-ctrl .dxbl-text-edit > .dxbl-text-edit-template:not(:first-child) {
	justify-content: end;
}
.ssqv-view .dxbl-fl-item :not(:has(.nested-frame))> .dxbl-fl-ctrl .dxbl-text-edit.dxbl-disabled .dxbl-text-edit-template {
	justify-content: end;
}
.ssqv-view .dxbl-fl-item:not(:has(.nested-frame)) > .dxbl-fl-ctrl .dxbl-text-edit.dxbl-disabled::before, 
.ssqv-view .dxbl-fl-item:not(:has(.nested-frame)) > .dxbl-fl-ctrl .dxbl-text-edit:disabled::before {
	background: none !important;
}
.ssqv-view .dxbl-fl-item:not(:has(.nested-frame)) > .dxbl-fl-ctrl .dxbl-text-edit.dxbl-disabled input,
.ssqv-view .dxbl-fl-item:not(:has(.nested-frame)) > .dxbl-fl-ctrl .dxbl-text-edit.dxbl-disabled .dxbl-text-edit-template {
	padding-right: 0px;
}
.ssqv-view .dxbl-fl-ctrl .dxbl-btn-group.dxbl-btn-group-right button, 
.ssqv-view .dxbl-fl-ctrl .dxbl-btn-group.dxbl-btn-group-right a, 
.ssqv-view .dxbl-fl-ctrl .dxbl-edit-btn-clear,
.ssqv-view .dxbl-fl-ctrl:has(.dxbl-text-edit.dxbl-disabled):hover .dxbl-btn-group.dxbl-btn-group-right button,
.ssqv-view .dxbl-fl-ctrl:has(.dxbl-text-edit.dxbl-disabled):hover .dxbl-btn-group.dxbl-btn-group-right a {
	display: none;
}
.ssqv-view .dxbl-fl-ctrl:hover .dxbl-btn-group.dxbl-btn-group-right button, 
.ssqv-view .dxbl-fl-ctrl:hover .dxbl-btn-group.dxbl-btn-group-right a, 
.ssqv-view .dxbl-fl-ctrl:hover .dxbl-edit-btn-clear {
	display: flex;
}
.ssqv-view .dxbl-fl-ctrl:hover button.dxbl-edit-btn-clear {
	display: none !important;
}
.ssqv-main .ssqv-view .dxbl-text-edit.dxbl-disabled::after, 
.ssqv-main .ssqv-view .dxbl-text-edit:disabled::after{
	background: transparent !important;
}
.ssqv-view > .dxbl-group.expanded > .dxbl-expandable-container.dxbl-group-body .dxbl-fl-group {
	margin-bottom: 0px;
}

.ssqv-main .ssqv-view .ssqv-summary .dxbl-group-header {
	
}
.ssqv-view > .dxbl-group.expanded > .dxbl-group-header .dxbl-btn,
.ssqv-main .ssqv-view .dxbl-group .dxbl-group[expanded-state="False"].dxbl-group-header .dxbl-btn {
	border: 1px solid rgba(var(--midgrey), 0.35) !important;
}
.ssqv-view .dxbl-group-header .dxbl-btn.dxbl-group-expand-btn:hover svg {
	filter: var(--icon-filter-white);
}
.ssqv-view > .dxbl-group.expanded > .dxbl-group-header .dxbl-btn .dxbl-image {
	transform: rotate(-90deg);
	transition: .3s;
}
.ssqv-main .ssqv-view .dxbl-group .dxbl-group[expanded-state="False"].dxbl-group-header .dxbl-btn .dxbl-image {
	transform: rotate(180deg);
	transition: .3s;
}
.ssqv-main .ssqv-view .dxbl-group .dxbl-group[expanded-state="False"].dxbl-group-header {
	height: calc(100vh - 158px);
	transition: .3s;
	flex-direction: row !important;
	writing-mode: vertical-lr;
	padding: 4px 2px !important;
	width: 40px !important;
}
.ssqv-main .ssqv-view > .dxbl-group.expanded >  .dxbl-group-header {
	border-bottom-width: 2px;
}
.ssqv-main .ssqv-view .dxbl-group-header .dxbl-text {
	font-weight: 700;
	opacity: .85;
}
.ssqv-main .ssqv-view .dxbl-group .dxbl-group[expanded-state="False"].dxbl-group-header .dxbl-text {
	margin: 0px;
}
.ssqv-main .ssqv-view .dxbl-group .dxbl-group[expanded-state="False"]{
	width: 58px !important;
	transition: .3s;
}
.ssqv-main:has(.ssqv-view .dxbl-group[expanded-state="False"]:not(.ssqv-view .dxbl-group .dxbl-group[expanded-state="False"])) .hybrid-left-side {
	width: calc(100% - 58px) !important;
	transition: .3s;
}
.ssqv-main .ssqv-view .dxbl-group[expanded-state="False"]:not(.ssqv-view .dxbl-group .dxbl-group[expanded-state="False"]) {
	border-radius: 10px;
  box-shadow: 0px 0px 1px 0px rgba(var(--midgrey), 0.15);
  overflow: hidden;
  margin: 2px;
}
.ssqv-main .ssqv-view .xaf-inline-action-template:has(button[data-action-id="QuickViewEditDetail"]) {
	display:none;
}
.ssqv-main .ssqv-view tr td:has(button[data-action-id="QuickViewEditDetail"]) {
	display:none;
}
.ssqv-main .ssqv-view table:has(button[data-action-id="QuickViewEditDetail"]) thead th:nth-child(2){
	display:none;
}

/*----------- PHOTO -----------*/
.ssqv-main .ssqv-view .img-thumbnail,
.ssqv-main .ssqv-view .media-thumbnail-wrapper {
            height: 60px !important;
			width: 60px !important;
			margin: 0 auto;
			border-radius: 40px;
        }
		.ssqv-main .ssqv-view .img-thumbnail button {
            border-radius: 10px;
			
        }
		.ssqv-main .ssqv-view .summary-view-photo {
			min-height: 60px;
		}
		.ssqv-main .ssqv-view .summary-view-photo:not(.route-driver-photo) {
			min-height: 60px;
			margin-top: -35px !important;
		}

        .ssqv-main .ssqv-view .xaf-image-editor,
        .ssqv-main .ssqv-view .media-thumbnail-wrapper {
            width: 60px !important;
			margin: 10px auto;
			border: 0px;
        }
		.ssqv-main .ssqv-view .xaf-image-editor,
		.ssqv-main .ssqv-view .xaf-image-editor .img-thumbnail,
		.ssqv-main .ssqv-view .xaf-image-editor .img-thumbnail button,
		.ssqv-main .ssqv-view .media-thumbnail-wrapper {
			border-radius: 55px !important;
		}
		.ssqv-main .ssqv-view .xaf-image-editor .img-thumbnail button,
		.ssqv-main .ssqv-view .media-thumbnail-wrapper		{
			height: 60px;
			border: 0px;
		}
		.ssqv-main .ssqv-view .media-thumbnail-wrapper .thumbnail-image {
			height: 60px;
			width: 60px;
		}
		.ssqv-main .ssqv-view .media-thumbnail-wrapper .icon-upload,
		.ssqv-main .ssqv-view .media-thumbnail-wrapper .thumbnail-image img {
			opacity: 0;
		}
		.ssqv-main .ssqv-view .media-thumbnail-wrapper .media-actions,
		.ssqv-main .ssqv-view .media-thumbnail-wrapper .file-overlay		{
			display:none;
		}
		.ssqv-main .ssqv-view .media-thumbnail-wrapper:has(.icon-upload) {
			background: url(../../../IImageService/camera-slash) center center no-repeat !important;
			background-size: 40px 40px !important;
			mask: none !important;
			background-color: transparent !important;
			opacity: .25;
			box-shadow: none !important;
			border: 1px solid rgba(var(--midgrey), .5);
		}
		.dxbl-theme-dark .ssqv-main .ssqv-view .media-thumbnail-wrapper:has(.icon-upload) {
			filter: var(--icon-filter-white);
		}
		
		.ssqv-main .ssqv-view .img-thumbnail .xaf-image.xaf-preview-image-detail-view {
			background: url(../../../IImageService/camera-slash) center center no-repeat;
	background-size: 40px 40px;
	mask: none !important;
	background-color: transparent !important;
			
		}

        .ssqv-main .ssqv-view .img-thumbnail .xaf-image {
            mask-size: 42px !important;
        }

        .ssqv-main .ssqv-view .img-thumbnail :has(.xaf-component-image) {
            padding: 0px;
        }

        .ssqv-main .ssqv-view .img-thumbnail .xaf-image-button {
            opacity: 0;
        }

        .ssqv-main .ssqv-view .img-thumbnail:hover .xaf-image-button {
            opacity: 1;
        }

        .ssqv-main .ssqv-view .xaf-image-container img {
            border-radius: 50px;
			width: 100%;
        }
		
		
		
/* -------------- EXPANDED LISTVIEW  ------------------ */

/* XSMALL 
.dxbl-modal > .dxbl-modal-root > .dxbl-popup.quickview-xsmall:has(.ssqv-listviews > .dxbl-group.expanded) {
	width: 1000px !important ;
    max-width: 1000px !important ;
    width: min(1000px, 100%) !important;
    animation: open-xsmall .5s ease ;
}*/
.ssqv-view.dxbl-fl-group .ssqv-listviews .dxbl-toolbar {
	margin-top: 10px;
}
/*.ssqv-view.dxbl-fl-group .ssqv-listviews thead,
.ssqv-view.dxbl-fl-group .ssqv-listviews tbody{
	flex-direction: row-reverse;
 } */


@media screen and (max-width:550px) {
    .quickview,
    .quickview .dxbl-popup-header {
        width: 100% !important;
        max-width: 100% !important;
    }
}

@media screen and (max-width:850px) {
    .quickview.quickview-medium,
    .quickview.quickview-medium .dxbl-popup-header,
	.quickview.quickview-large,
    .quickview.quickview-large .dxbl-popup-header	{
        width: 100% !important;
        max-width: 100% !important;
    }
}

@media screen and (max-width:1200px) {
	.quickview.quickview-large,
    .quickview.quickview-large .dxbl-popup-header	{
        width: 100% !important;
        max-width: 100% !important;
    }
}

@media screen and (max-width:1400px) {
	
.ssqv-main .hybrid-left-side {
	width: 70%;
}
.ssqv-main .ssqv-view {
	width: 30%;
}
}
@media screen and (max-width:1000px) {
	
.ssqv-main .hybrid-left-side {
	width: 100%;
}
.ssqv-main .ssqv-view {
	padding-left: 14px;
	width: 100%;
}
.ssqv-view .dxbl-fl-item:not(:has(.dxbl-text-edit.dxbl-memo-edit)):not(:has(.img-thumbnail)) > .dxbl-fl-cpt {
	margin-top: 10px;
	margin-bottom: -20px;
}
/* .ssqv-view .dxbl-fl-item:not(:has(.dxbl-text-edit.dxbl-memo-edit)):not(:has(.img-thumbnail)) > .dxbl-fl-cpt, */
.ssqv-view .dxbl-fl-item:not(:has(.dxbl-text-edit.dxbl-memo-edit)):not(:has(.img-thumbnail)) > .dxbl-fl-ctrl {
	width: 100% !important;
}
}