body{
    font-size:13px;
    font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}
.logo
{
   margin-bottom:5px;
}

#datepicker {
 
  width: 100%;
  
}

.phntxt {
    font-size: 15px;
}

@media (max-width:480px) {
    /*.breadcrumb{
        margin-top:125px;
    }*/

    .phntxt {
        font-size: 15px;
    }

    h3.phntxt {
        font-size: 20px;
        font-weight: 900;
    }

    
    .phnmodecal
    {
        height:30px;
    }
    #sel1
    {
        height:30px;
       padding-left:20px;
       padding-top:1px;
       margin-top:2px;
    }
    .phnmodebtn
    {
        height:30px;
        padding:0px;
        margin-top:2px;
    }
    tr{
        
    }

    td{
        font-size:12px;
        
    }
    th
    {
        font-size:12px;
        font-weight:900;

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

    #ddlOutlet,#ddlvariancetype
    {
        height:32px;
      font-size:12px;  
    }
}
.loginfooter {
   position: fixed;
   left: 0;
   bottom: 0;
   width: 100%;
   background-color: #343a40;
   padding-top:20px;
   color:#ffffff;
   text-align: center;
}
/*pb 29/03/23*/

/*scrollbar design*/

::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

/* Track */
::-webkit-scrollbar-track {
    box-shadow: inset 0 0 2px grey;
    border-radius: 10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #C7C7C7;
    border-radius: 10px;
}

    /* Handle on hover */
    ::-webkit-scrollbar-thumb:hover {
        background: #A0A0A0;
    }

/*scrollbar design End*/
/*Added by Prasun Bairagi 26/10/22*/



/*Right*/
.modal.right.fade .modal-dialog {
    right: 0px;
    -webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
    -moz-transition: opacity 0.3s linear, right 0.3s ease-out;
    -o-transition: opacity 0.3s linear, right 0.3s ease-out;
    transition: opacity 0.3s linear, right 0.3s ease-out;
}

.modal.right.fade.in .modal-dialog {
    right: 0;
}
.modal.left .modal-dialog,
.modal.right .modal-dialog {
    position: fixed;
    margin: auto;
    width: 40vw;
    height: 100%;
    -webkit-transform: translate3d(0%, 0, 0);
    -ms-transform: translate3d(0%, 0, 0);
    -o-transform: translate3d(0%, 0, 0);
    transform: translate3d(0%, 0, 0);
}

.modal.left .modal-content,
.modal.right .modal-content {
    height: 100%;
    overflow-y: auto;
}

.modal.left .modal-body,
.modal.right .modal-body {
    padding: 15px 15px 80px;
}


/* ----- MODAL STYLE ----- */
.modal-content {
    border-radius: 0;
    border: none;
}

.modal-header {
    border-bottom-color: #EEEEEE;
    background-color: #FAFAFA;
}


.form-select {
    display: block;
    width: 100%;
    padding: .375rem 2.25rem .375rem .75rem;
    -moz-padding-start: calc(0.75rem - 3px);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right .75rem center;
    background-size: 16px 12px;
    border: 1px solid #ced4da;
    border-radius: .375rem;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

@media(prefers-reduced-motion: reduce) {
    .form-select {
        transition: none;
    }
}

.form-select:focus {
    border-color: #86b7fe;
    outline: 0;
    box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .25);
}

.form-select[multiple],
.form-select[size]:not([size="1"]) {
    padding-right: .75rem;
    background-image: none;
}

.form-select:disabled {
    background-color: #e9ecef;
}

.form-select:-moz-focusring {
    color: rgba(0, 0, 0, 0);
    text-shadow: 0 0 0 #212529;
}

.input-group > .form-control,
.input-group > .form-select {
    position: relative;
    flex: 1 1 auto;
    width: 1%;
    min-width: 0;
}

    .input-group > .form-control:focus,
    .input-group > .form-select:focus {
        z-index: 3;
    }

.was-validated .form-select:valid:not([multiple]):not([size]),
.was-validated .form-select:valid:not([multiple])[size="1"],
.form-select.is-valid:not([multiple]):not([size]),
.form-select.is-valid:not([multiple])[size="1"] {
    padding-right: 4.125rem;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"), url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
    background-position: right .75rem center, center right 2.25rem;
    background-size: 16px 12px, calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}

.was-validated .input-group .form-control:valid,
.input-group .form-control.is-valid,
.was-validated .input-group .form-select:valid,
.input-group .form-select.is-valid {
    z-index: 1;
}

    .was-validated .input-group .form-control:valid:focus,
    .input-group .form-control.is-valid:focus,
    .was-validated .input-group .form-select:valid:focus,
    .input-group .form-select.is-valid:focus {
        z-index: 3;
    }

.was-validated .form-select:invalid,
.form-select.is-invalid {
    border-color: #dc3545;
}

    .was-validated .form-select:invalid:not([multiple]):not([size]),
    .was-validated .form-select:invalid:not([multiple])[size="1"],
    .form-select.is-invalid:not([multiple]):not([size]),
    .form-select.is-invalid:not([multiple])[size="1"] {
        padding-right: 4.125rem;
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"), url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
        background-position: right .75rem center, center right 2.25rem;
        background-size: 16px 12px, calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
    }

    .was-validated .form-select:invalid:focus,
    .form-select.is-invalid:focus {
        border-color: #dc3545;
        box-shadow: 0 0 0 .25rem rgba(220, 53, 69, .25);
    }

textarea.form-control {
    min-height: calc(1.5em + 0.75rem + 2px);
}

/*Added by Prasun Bairagi 28/10/22*/
/*image upload*/
.avatar-upload {
    position: relative;
    max-width: 205px;
    margin: 50px auto;
}

    .avatar-upload .avatar-edit {
        position: absolute;
        right: 12px;
        z-index: 1;
        top: 10px;
    }

        .avatar-upload .avatar-edit input {
            display: none;
        }

            .avatar-upload .avatar-edit input + label {
                display: inline-block;
                width: 34px;
                height: 34px;
                margin-bottom: 0;
                border-radius: 8px;
                background: #FFFFFF;
                border: 1px solid transparent;
                box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.12);
                cursor: pointer;
                font-weight: normal;
                transition: all .2s ease-in-out;
            }

                .avatar-upload .avatar-edit input + label:hover {
                    background: #f1f1f1;
                    border-color: #d6d6d6;
                }

                .avatar-upload .avatar-edit input + label:after {
                    position: absolute;
                    top: 10px;
                    left: 0;
                    right: 0;
                    text-align: center;
                    margin: auto;
                }

    .avatar-upload .avatar-preview {
        width: 190px;
        height: 190px;
        position: relative;
        border-radius: 8px;
        border: 6px solid #F8F8F8;
        box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
    }

        .avatar-upload .avatar-preview > div {
            width: 100%;
            height: 100%;
            border-radius: 8px;
            background-size: cover;
            background-repeat: no-repeat;
            background-position: center;
        }

.input-group:not(.has-validation) > .dropdown-toggle:nth-last-child(n+3), .input-group:not(.has-validation) > .form-floating:not(:last-child) > .form-control, .input-group:not(.has-validation) > .form-floating:not(:last-child) > .form-select, .input-group:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.choices__inner {
    display: inline-block;
    vertical-align: top;
    width: 100%;
    background-color: #f9f9f9;
    padding: 7.5px 7.5px 3.75px;
    border: 1px solid #ddd;
    border-radius: 2.5px;
    font-size: 14px;
    min-height: 44px;
    overflow: hidden;
}

.crmTitleList {
    font-size: 8px !important;
}

.fs-5 {
    font-size: 1.25rem !important;
}

.closeBtn {
    background-color: red;
    color: white;
}

#saveBtn {
    background-color: #15a362;
    color: white;
}

#updateBtn {
    background-color: #15a362;
    color: white;
}

.imageContainer {
    width: 100%;
    height: 200px;
}

.itemImage {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.itemGroupName {
    font-size: 20px;
    font-weight: 700;
}

.itemName {
    font-size: 18px;
    font-weight: 700;
}

.pointer {
    cursor: pointer;
}

.itemGroupListName {
    font-size: 18px;
    font-weight: 700;
}

.itemGroupList {
    border-right: 2px solid #dee2e6;
    height: 440px;
    overflow-y: auto;
}



.itemCard {
    height: 100%;
    box-shadow: 0 0.25rem 0.375rem rgba(0, 0, 0, .075), 0 0.25rem 0.375rem rgba(0, 0, 0, .075) !important;
}

.itemsGroupContainer {
    /*height: 460px;
    overflow-y: auto;*/
}

.addNewImg {
    box-shadow: 0 0.25rem 0.375rem rgba(0, 0, 0, .075), 0 0.25rem 0.375rem rgba(0, 0, 0, .075) !important;
    background-color: #dee2e6;
}

.bannerImg {
    box-shadow: 0 0.25rem 0.375rem rgba(0, 0, 0, .075), 0 0.25rem 0.375rem rgba(0, 0, 0, .075) !important;
}


/*nav tabs*/
.nav-tabs {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: nowrap;
    border: none;
    border:0px !important;
}

    .nav-tabs .nav-item {
        margin-right: 0;
    }

    .nav-tabs .nav-link {
        background-color: #fff;
        color: #000;
        font-weight: 700;
        font-size: 16px;
        border:0px !important;
        border-bottom:2px solid #fff !important;
    }
   

        .nav-tabs .nav-link.active {
            background-color: #fff;
            color: #15a362;
            border-bottom:2px solid #15a362 !important;
            font-size: 18px;
            border:0px;
        }

@media only screen and (max-width:600px) {
    .nav-tabs {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        flex-wrap: nowrap;
        border: none;
    }
}

.customerName,.totalAmountPaid,.orderSourceName,.brandNameOrder,.orderStatus{
    font-size:15px;
    overflow:hidden;
    text-overflow:ellipsis;
    max-width:20ch;
}

.form-check {
    position: relative;
    display: block;
  
}

.categoryActive,
.itemGroupName:focus {
	box-shadow: 2px 2px 2px #dee2e6, -2px 2px 2px #dee2e6, 2px -2px 2px #dee2e6, -2px -2px 2px #dee2e6;

	color: #15a362 !important;
	font-size: .875rem;
}
.itemGroupName {

	color: black;
	font-size: .875rem;
}

.itemGroupName:hover {
	box-shadow: 2px 2px 2px #dee2e6, -2px 2px 2px #dee2e6, 2px -2px 2px #dee2e6, -2px -2px 2px #dee2e6;

	color: #15a362;
	font-size: .875rem;
}
.twoRowEllipsis{
    overflow: hidden;text-overflow: ellipsis;white-space: initial; display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;font-size: 14px;
}
.parentGroupText{
    font-size:15px;
    font-weight:700
}
.itemGroupNameStatic{
    font-size:18px;
    font-weight:700
}

[v-cloak] {
  display: none;
}

.showingItemsLine{
    font-size:14px;
    font-weight:500
}

/*table.dataTable thead .sorting_asc:after {
    opacity: 0 !important;
    content: "" !important;
}
table.dataTable thead .sorting_desc:after {
    opacity: 0 !important;
    content: "" !important;
}
table.dataTable thead .sorting:before, table.dataTable thead .sorting_asc:before, table.dataTable thead .sorting_desc:before, table.dataTable thead .sorting_asc_disabled:before, table.dataTable thead .sorting_desc_disabled:before {
    right: 1em;
    content: "" !important;
}
table.dataTable thead .sorting:before, table.dataTable thead .sorting_asc:before, table.dataTable thead .sorting_desc:before, table.dataTable thead .sorting_asc_disabled:before, table.dataTable thead .sorting_desc_disabled:before {
     right: 1em;
    content: "" !important;
}
table.dataTable thead .sorting:after {
 opacity: 0 !important;
    content: "" !important;
}*/

/*order tracking*/

.ordertracker {
	position: relative;
}



.hh-grayBox {
	margin-bottom: 20px;
	padding: 35px;
	margin-top: 20px;
}

.pt45 {
	padding-top: 45px;
}

.order-tracking {
	text-align: center;
	width: 25%;
	position: relative;
	display: block;
}

.order-tracking .is-complete {
	display: block;
	position: relative;
	border-radius: 50%;
	height: 30px;
	width: 30px;
	border: 0px solid #AFAFAF;
	background-color: #D1D1D1;
	margin: 0 auto;
	transition: background 0.25s linear;
	-webkit-transition: background 0.25s linear;
	z-index: 2;
}

.order-tracking .is-complete:after {
	display: block;
	position: absolute;
	content: '';
	height: 14px;
	width: 7px;
	top: -2px;
	bottom: 0;
	left: 5px;
	margin: auto 0;
	border: 0px solid #AFAFAF;
	border-width: 0px 2px 2px 0;
	transform: rotate(45deg);
	opacity: 0;
}

.order-tracking.completed .is-complete {
	border-color: #15a362;
	border-width: 0px;
	background-color: #15a362;
}

.order-tracking.completed .is-complete:after {
	border-color: #fff;
	border-width: 0px 3px 3px 0;
	width: 7px;
	left: 11px;
	opacity: 1;
}

.order-tracking p {
	color: #A4A4A4;
	font-size: 16px;
	margin-top: 8px;
	margin-bottom: 0;
	line-height: 20px;
}

.order-tracking p span {
	font-size: 14px;
}

.order-tracking.completed p {
	color: #000;
}

.order-tracking::before {
	content: '';
	display: block;
	height: 3px;
	width: calc(100% - 20px);
	/* width: calc(100% - 40px); */
	background-color: #D1D1D1;
	top: 13px;
	position: absolute;
	left: calc(-67% + 2px);

	/* left: calc(-50% + 20px); */
	z-index: 0;
}

.order-tracking:first-child:before {
	display: none;
}

.order-tracking.completed:before {
	background-color: #15a362;
}

.ordertfonts {
	font-size: 12px !important;
	font-weight: 700;

}

/*order tracking ends*/
.validationsyntax{
    font-size:10px;
    color:red;
}


.riderdnimp {
	color: #8c96a1;
	font-size: 11px;
}

.riderdimp {

	font-size: 11px;
	font-weight: 600;
}

.custname {
	color: black;
	font-size: 16px;
	font-weight: 700;
}

.custdetails {
	color: black;
	font-size: 14px;
	font-weight: 600;
}

.opdetails {
	color: black;
	font-size: 14px;
	font-weight: 600;
}

.opmode {
	color: black;
	font-size: 14px;
	font-weight: 700;
}

.calldetails {
	color: black;
	font-size: 12px;
	font-weight: 500;
}

.billheader {
	color: #8c96a1;
	font-size: 14px;
	font-weight: 600;
}

.billitem {
	color: black;
	font-size: 15px;
	font-weight: 600;
}

.subtotal {
	color: black;
	font-size: 14px;
	font-weight: 700;
}
.shadow{
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, .15) !important;
}
.rounded-2 {
    border-radius: 4px !important;
}

.tab-content .tab-pane {
  display: none;
}

.tab-content  .active {
  display: block;
}
/*.paginate_button.page-item:hover{
    background-color:yellow !important;

}*/

.modal.left .modal-dialog, .modal.right .modal-dialog{
    width:100vw;
}
div.dataTables_wrapper div.dataTables_filter input {
    width: 130px;
}
.activetab{
       
    color: #15a362 !important;
     border-bottom: 2px solid #15a362 !important;
}
.navTabs a{
   
    color: black;
   
    font-size: 18px;
}
.navTabs a:hover,.navTabs a:focus,.navTabs a:active{
    border-bottom: none !important;
}
.lineitemremarks{
    font-size: 13px;
    font-weight:300 !important;
}
.polaroidpb{
   box-shadow: 0 0px 2px 0 rgb(0 0 0 / 20%), 0 2px 8px 0 rgb(0 0 0 / 19%) !important;
}
a:hover{
    text-decoration:none !important ;
}
.tabdivs a{
   
    color: black;
   
    font-size: 16px;
}
.tabdivs a:hover,.tabdivs a:focus,.tabdivs a:active{
    border-bottom: none !important;
}
.tablinks {
    font-weight: 700;
   
    border: 0px !important;
    border-bottom: 2px solid #fff !important;
}
.activetab a{
     
    color: #15a362 !important;
    
    font-size: 18px !important;
}
@media only screen and (max-width:1000px){
.rightborderdivision{
    border-right: 0px solid white !important;
}
}
.rightborderdivision{
    border-right: 1px solid grey;
}
#filter-tabs .dropdown-item:hover,#filter-tabs .dropdown-item:active,#filter-tabs .dropdown-item:active{
    background-color:white !important;
    color:black;

}
.brandImage {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

#avatar-upload .avatar-preview > div {
    width: 100%;
    height: 100%;
    border-radius: 8px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}