@import url('https://fonts.googleapis.com/css2?family=Poppins&display=swap');

* {
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
    font-family: 'Poppins', sans-serif;
    /* font-family: Cambria, Cochin, Georgia, Times, "Times New Roman", serif; */
}

[dir="rtl"] title {
    text-align: right;
}

.flex-jc-fe{
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.flex-jc-sb{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.hide-on-mobile {
    display: block;
}

.flex-jc-fs{
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.desktop{
    display: block;
}

.mobile{
    display: none;
}

.hidden {
    display: none !important;
}

.noitemfound{
	padding: 20px 52px;
    color: red;
}

:root{
	--bg-color-1 : #ffffff; /* #ffffff & #000000*/
	--bg-color-2 : #f6faff; /*#f6faff & #000000*/
	--bg-color-3 : #ff5959; /*#ff5959 & #bc906b*/
	--bg-color-4 : #ffffff; /*#ffffff & #bc906b*/

	--text-color-1 : #000000; /* #000000 & #ffffff*/
	--text-color-2 : #000000; /* #000000 & #d9d9d9 */
	--text-color-3 : #ffffff; /* #fffff & #000000*/
	--text-color-4 : #908585; /* #908585 & #5e5b5b*/
	--text-color-5 : #767472; /* #767472 & #bc906b*/
	--text-color-6 : #ff5959; /* #ff5959 & #000000*/
	--text-color-7 : #585858; /* #808080 & #ffffff*/
	--text-color-8 : #ff5959; /* #ff5959 & #fff705*/

	--accent-color-1 : #bc906b; /* #bc906b & #bc906b */

	--border-color-1 : #000000; /* #000000 & #000000*/
	--border-color-2 : #ffffff; /*#ffffff & #30425a */
	--border-color-3 : #d3d3d3; /* #d3d3d3 & #ffffff*/
	--border-color-4 : #ff5959; /* #ff5959 & #ffffff*/  /* Mobile - item add button*/
	--border-color-5 : #ff5959; /* #ff5959 & #000000*/  /* Desktop - item add button*/
}

/* Dark - Mode */
.dark-mode{
	--bg-color-1 : #bc906b;
	--bg-color-2 : #000000;
	--bg-color-3 : #000000;
	--bg-color-4 : #bc906b;

	--text-color-1 : #ffffff;
	--text-color-2 : #d9d9d9;
	--text-color-3 : #000000;
	--text-color-4 : #5e5b5b;
	--text-color-5 : #bc906b;
	--text-color-6 : #000000;
	--text-color-7 : #ffffff;
	--text-color-8 : #fff705;

	--accent-color-1 : #bc906b;

	--border-color-1 : #000000;
	--border-color-2 : #30425a;
	--border-color-3 : #ffffff;
	--border-color-4 : #ffffff;
	--border-color-5 : #000000;
}


@media only screen and (max-width: 768px) {
    .mobile{
        display: block;
    }
}

/* Google style input -- START -- */
    .gstyle-div-splitter{
        padding-bottom: 7px;
    }

    .gstyle-div{
        position: relative;
        padding-bottom: 5px;
        margin-top: 5px;
    }

    .gstyle-div input{
        font-size: 16px;
        padding: 13px 16px;
        width: 100%;
        border: 1px solid #ccc;
        border-radius: 5px;
        transition: border-color 0.2s ease;
        height: 60px;
    }

    .gstyle-div input:focus{
        outline: none;
        border-color: #007bff;
    }

    .gstyle-div label{
        position: absolute;
        top: 19px;
        left: 10px;
        pointer-events: none;
        transition: top 0.2s;
        color: #939393;
        font-size: 13px;
        padding: 2px 7px;
        background-color: white;
    }

    [dir="rtl"] .gstyle-div label{
        right: 10px;
        left: unset;
    }

    .gstyle-div input:focus + label{ 
        top: -12px;
        color: #939393;
        
    }
/* Google style input -- END -- */

/* Comman toggle ---- START --- */
    .comman-toggle .toggle-div{
        display: flex;
        flex-direction:row;
        align-items:center;
        padding:1px;
        cursor: pointer;
    }

    .comman-toggle .toggle-div.active{
        background-color: var(--bg-color-2) !important;
    }
    .comman-toggle .toggle-body{
        background-color:lightgrey;
        border:1px solid grey;
        width:40px;
        border-radius:20px;
        box-shadow:inset 0 2px 4px 0 rgba(0,0,0,0.1);
        transition:all 0.2s ease;
    }   

    .comman-toggle .toggle-head{
        width:20px; 
        height:20px;
        background-color:white;
        border-radius:50%;
        box-shadow : 0 2px 4px 0 rgba(0,0,0,0.25);
        border: 1px solid gray;
        box-sizing:border-box;
        transition : all 0.1s ease;
    }

    .comman-toggle .toggle-div.active .toggle-body{
        background-color:#2ca760;
    }

    .comman-toggle .egg-block.active .toggle-body{
        background-color: #ffff00;
    }

    .comman-toggle .toggle-div.active .toggle-body .toggle-head{
        transform : translateX(100%);
    }

    [dir="rtl"] .comman-toggle .toggle-div.active .toggle-body .toggle-head{
        transform : translateX(-100%);
    }

    .comman-toggle .toggle-div label{
        font-size: 0.9375rem;
        margin:0rem 0.5313rem 0px 0.5313rem;
    }

    .comman-toggle .toggle-div input[type=checkbox]{
        display:none;
    }

/* Comman toggle ---- END --- */

/* Custom Flashmsg  -- START --- */
    .custom-flashmsg {
        position: fixed;
        bottom: 30px;
        left: 5%;
        transform: translate(-5%);
        z-index: 2000;
        border-radius: 10px;
    }

    .custom-flashmsg .alert{
        padding: 14px 30px;
        margin-bottom: 0px;
        border-radius: 10px;
        border: none;
        font-size: 17px;
    }

    .custom-flashmsg .alert .fa{
        padding-right: 15px;
    }

    .custom-flashmsg .alert-success{
        background-color: #4cb050;
        color: white;
    }

    .custom-flashmsg .alert-danger{
        background-color: #f44236;
        color: white;
    }

    .custom-flashmsg .alert-warning{
        background-color: #ff9602;
        color: white;
    }

    .custom-flashmsg .alert-info{
        background-color: #3f51b5;
        color: white;
    }

    @media only screen and (max-width: 768px){
        .custom-flashmsg{
            bottom: 30px;
            left: 50%;
            transform: translateX(-50%);
            width: max-content;
            max-width: 80%;
        }
    }
/* Custom Flashmsg --- END -- */

/* Loading css Starts */

.lds-roller-main {
    position: fixed;
    height: 100%;
    width: 100%;
    background-color: #1b1b1bd4;
    z-index: 1600;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.lds-roller {
    display: inline-block;
    /* position: relative; */
    width: 80px;
    height: 80px;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transform: -webkit-translate(-50%, -50%);
    transform: -moz-translate(-50%, -50%);
    transform: -ms-translate(-50%, -50%);
    color: darkred;
    z-index: 1601;
}

.lds-roller div {
    animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    transform-origin: 40px 40px;
}
.lds-roller div:after {
    content: " ";
    display: block;
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #ff5959;
    margin: -4px 0 0 -4px;
}

.lds-roller div:nth-child(1) {
    animation-delay: -0.036s;
}
.lds-roller div:nth-child(1):after {
    top: 63px;
    left: 63px;
}
.lds-roller div:nth-child(2) {
    animation-delay: -0.072s;
}
.lds-roller div:nth-child(2):after {
    top: 68px;
    left: 56px;
}
.lds-roller div:nth-child(3) {
    animation-delay: -0.108s;
}
.lds-roller div:nth-child(3):after {
    top: 71px;
    left: 48px;
}
.lds-roller div:nth-child(4) {
    animation-delay: -0.144s;
}
.lds-roller div:nth-child(4):after {
    top: 72px;
    left: 40px;
}
.lds-roller div:nth-child(5) {
    animation-delay: -0.18s;
}
.lds-roller div:nth-child(5):after {
    top: 71px;
    left: 32px;
}
.lds-roller div:nth-child(6) {
    animation-delay: -0.216s;
}
.lds-roller div:nth-child(6):after {
    top: 68px;
    left: 24px;
}
.lds-roller div:nth-child(7) {
    animation-delay: -0.252s;
}
.lds-roller div:nth-child(7):after {
    top: 63px;
    left: 17px;
}
.lds-roller div:nth-child(8) {
    animation-delay: -0.288s;
}
.lds-roller div:nth-child(8):after {
    top: 56px;
    left: 12px;
}
@keyframes lds-roller {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.font-12{
    font-size: 12px;
    color: grey;
}

/* Custom 1 */
.lds-roller-1 {
    display: inline-block;
    /* position: relative; */
    width: 80px;
    height: 80px;
    position: absolute;
    /* top: 30%; */
    left: 40%;
    /* transform: translate(-30%, -40%); */
    transform: -webkit-translate(-50%, -50%);
    transform: -moz-translate(-50%, -50%);
    transform: -ms-translate(-50%, -50%);
    color: darkred;
    z-index: 1601;
    margin-top: 150px;
}

.lds-roller-1 div {
    animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    transform-origin: 40px 40px;
}

.lds-roller-1 div:after {
    content: " ";
    display: block;
    position: absolute;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: white;
    /* background: #2b2b2b; */
    margin: -4px 0 0 -4px;
}

.lds-roller-1 div:nth-child(1) {
    animation-delay: -0.036s;
}
.lds-roller-1 div:nth-child(1):after {
    top: 63px;
    left: 63px;
}
.lds-roller-1 div:nth-child(2) {
    animation-delay: -0.072s;
}
.lds-roller-1 div:nth-child(2):after {
    top: 68px;
    left: 56px;
}
.lds-roller-1 div:nth-child(3) {
    animation-delay: -0.108s;
}
.lds-roller-1 div:nth-child(3):after {
    top: 71px;
    left: 48px;
}
.lds-roller-1 div:nth-child(4) {
    animation-delay: -0.144s;
}
.lds-roller-1 div:nth-child(4):after {
    top: 72px;
    left: 40px;
}
.lds-roller-1 div:nth-child(5) {
    animation-delay: -0.18s;
}
.lds-roller-1 div:nth-child(5):after {
    top: 71px;
    left: 32px;
}
.lds-roller-1 div:nth-child(6) {
    animation-delay: -0.216s;
}
.lds-roller-1 div:nth-child(6):after {
    top: 68px;
    left: 24px;
}
.lds-roller-1 div:nth-child(7) {
    animation-delay: -0.252s;
}
.lds-roller-1 div:nth-child(7):after {
    top: 63px;
    left: 17px;
}
.lds-roller-1 div:nth-child(8) {
    animation-delay: -0.288s;
}
.lds-roller-1 div:nth-child(8):after {
    top: 56px;
    left: 12px;
}
@keyframes lds-roller-1 {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* Loading css ends */

@media only screen and (max-width: 768px) {
    .hide-on-mobile {
        display: none;
    }
}
.justify-flex-end {
    justify-content: flex-end;
}

.primary-color {
    background-color: #30425a;
    color: white;
    border-color: #30425a;
}

.btn-outline-primary-color {
    color: #30425a;
    background-color: white;
    border-color: #30425a;
}

/* Margin */

.m-b-5 {
    margin-bottom: 5px;
}

/* Padding CSS */
.p-0 {
    padding: 0px;
}

.p-l-5 {
    padding-left: 5px;
}

.p-r-5 {
    padding-right: 5px;
}

.p-r-7 {
    padding-right: 7px;
}
.p-r-8 {
    padding-right: 8px;
}

.p-r-24 {
    padding-right: 24px;
}

.p-b-5 {
    padding-bottom: 5px;
}
/* Font Size CSS */

.rem-1 {
    font-size: 1rem;
}
.f-s-14 {
    font-size: 14px;
}

/* Borders */
.b-b-1 {
    border-bottom: 1px solid lightgrey;
}

/* Color */
.color-red {
    color: red;
    font-weight: bold;
}

/************************************************************************************************** Customer Order Page ******************************************************************************************/

/* Branch list popup : START */
.branchList{
	position: fixed;
    top: 50%;
    height: 100%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 500px;
    height: 490px;
    z-index: 1201;
    background-color: white;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
	padding: 45px 20px;
	border-radius: 10px;
	display: none;
}

.branchList .branchDiv{
	height: calc(100% - 40px);
	width: 100%;
	overflow: auto;
	padding: 18px 10px;
}

.branchList .cityList{
	padding-bottom: 12px;
}

.branchList .cityList select{
	border: 1px solid #ff5959;
}

.branchList .cityList select:focus{
	box-shadow: none;
}

.branchList .tk-div{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 10px 40px 10px 20px;
    margin-bottom: 15px;
    cursor: pointer;
    border-radius: 10px;
    background-color: white;
    box-shadow: 0 0 10px rgb(0 0 0 / 20%);
}

.branchList .tk-div .tk-img-div{
	padding-right: 17px;
}

.branchList .tk-div .tk-img-div img{
	border-radius: 50%;
}

.branchList .tk-div .tk-detail{
	text-transform: capitalize;
}

.branchList .tk-div .tk-branch{
	font-weight: 600;
    font-size: 14px;
}

.branchList .tk-div .tk-state{
	font-size: 12px;
}

/* Branch list popup : END */

.caps-camel {
    text-transform: lowercase;
    display: inline-block;
}
  
.caps-camel::first-line {
    text-transform: capitalize;
}

#addCustomizationButton{
    background-color: #ff5959;
    color: white;
    height: 44px;
}

.shadow1 {
    position: absolute;
    width: 100%;
    bottom: -12px;
    box-shadow: 0 -2px 5px 0 rgb(40 44 63 / 10%);
    height: 10px;
}
/* modifier */
.selectedSize,
.selectedModifier {
    background-color: #30425a;
    color: white;
    border-color: #30425a;
}

#desktop-logout {
    display: flex;
}

#mobile-logout {
    display: none;
}

.login-page-or-text {
    text-align: center;
    color: black;
    padding: 8px 0px;
}

.code_style {
    padding-top: 0px;
    padding-bottom: 0px;
    color: darkslategrey;
    margin-bottom: 0px;
    margin-top: 0px;
    font-weight: 600;
    text-transform: capitalize;
}

#repeatlast{
    background-color: #ff5959;
    color: white;
}

.header_style {
    color: #ff5959;
    padding-top: 1px;
    padding-bottom: 1px;
    margin-bottom: 2px;
    margin-top: 2px;
}

.check-item {
    margin-right: 10px;
    margin-left: 10px;
}

.modifierItemList {
    display: flex;
	align-items: center;
    font-size: 14px;
    margin-bottom: 0px;
    line-height: 1.5rem;
    border: 1px solid lightgrey;
    border-radius: 5px;
    padding: 3px 10px;
    margin: 5px 5px;
    cursor: pointer;
	text-transform: capitalize;
}

#panelclose{
	font-size: 20px;
}

.modifierItemList input {
    margin-right: 5px;
    margin-left: 5px;
}

.modifierItemList .col-12{
	display: flex;
	align-items: center;
	text-transform: capitalize;
}

#panel-additional label{
    display: block;
}

#panel-additional button {
    padding: 3px 8px 3px 8px;
}

.branch-branchname {
    font-size: 16px;
    word-break: break-word;
}

.order-subheader{
    justify-content:space-between;
    padding-left:0px;
    padding-top: 20px;
}

#foodstall{
    position: relative;
    display: flex;
    flex-wrap: wrap;
    padding-bottom: 80px;
}

/* Tabbed Menu */
	.tabbed-menu{
		padding-bottom: 30px;
		display: flex;
		flex-wrap: wrap;
		gap: 12px;
		text-align: center;
		justify-content: center;
		text-transform: capitalize;
	}

	.tabbed-menu .tab-item{
		padding: 4px;
		color: #393f52;
		cursor: pointer;
	}

	.tabbed-menu .tab-item:hover{
		color: #ff5959;
	}

	.tabbed-menu .separator{
		color: #aaa;
		padding: 4px;
	}
/* tabbed menu end */

.page-overlay{
    z-index: 1200;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #110707;
    opacity: .6;
    overflow: hidden;
}

.strict-overlay{
    z-index: 1031;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #110707;
    opacity: .7;
    overflow: hidden;
}
/* login and registration page  -- START -- */
.slide-login,.slide-register{
    position: fixed;
    top: 0;
    height: 100%;
    overflow-y: hidden;
    background: #ffffff;
    transition: width 0.3s ease-out, transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.3s ease-out;;
    left: auto;
    right: 0;
    z-index: 1201;
    width: 0;
    transform: translateX(100%);
    visibility: hidden;
}

.slide-login .section1,.slide-register .section1{
    height: calc(100% - 60px);
    overflow-x: hidden;
    overflow-y: auto;
    padding: 40px 45px;
}

.slide-login-show,.slide-register-show{
    width: 480px;
    visibility: visible;
    transform: translateX(0%);
}

.slide-login .close-slide,.slide-register .close-slide{
    color: rgb(37, 37, 37);
    font-size: 24px;
    padding-bottom: 5px;
    width: 35px;
    cursor: pointer;
}

.slide-login .close-reset-slide{
    color: rgb(37, 37, 37);
    font-size: 15px;
    padding-bottom: 5px;
    width: fit-content;
    cursor: pointer;
}

.slide-login .close-reset-slide i{
    padding-right: 6px;
}

.slide-register .register-response{
    text-align: center;
    padding: 5px;
    font-weight: 700;
}

.slide-login .reset-email-success,.slide-register .register-success{
    color: green;
    padding: 1px;
    font-size: 14px;
}

.slide-login .headtxt,.slide-register .headtxt{
    font-size: 24px;
    color: black;
    padding-bottom: 15px;
}
[dir="rtl"] .slide-login .headtxt,
[dir="rtl"] .slide-register .headtxt{
    text-align: right;
}

.slide-login .subtext,.slide-register .subtext
{
    font-size: 13px;
    color: #ff5959;
    text-decoration: underline;
    cursor: pointer;
}

.slide-login .mobileemaillabel{
    display: flex;
    align-items: center;
    cursor: pointer;
    position: absolute;
    background-color: white;
    font-size: 12px;
    left: 15px;;
}

.slide-login .mobileemaillabel div{
    padding: 3px 6px;
    margin: 0px;
    color: #939393;
    transition: background-color 0.3s, color 0.3s;
    cursor: pointer;
}

.slide-login .mobileemaillabel .active {
    background-color: #ff5959;
    color: white;
    border-radius: 5px;
    box-shadow: 0 6px 12px 0 rgb(155 153 153 / 20%);
}

.slide-login .content-div,.slide-register .content-div{
    padding-bottom: 15px;
}

.slide-register .otp-header{
    font-size: 24px;
    color: black;
    padding-bottom: 15px;
}

.slide-register .otp-subheader{
    font-size: 13px;
    padding-bottom: 20px;
}

.slide-register .otpinput{
    font-size: 16px;
    padding: 13px 16px;
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 5px;
    height: 45px;
}

.slide-register #verifyotp{
    background-color: #ff5959;
    height: 60px;
    color: white;
    border-radius: 5px;
    font-size: 16px;
    width: 100%;
    margin-top: 25px;
}

.slide-register .otp-expire{
    padding: 15px 0;
}

.slide-register #resetotp{
    color: #ff5959;
    text-decoration: underline;
    cursor: pointer;
    width: max-content;
    display: none;
}

.slide-login .content-div .errorspan,.slide-register .content-div .errorspan, .slide-register .register-error{
    color: red;
    font-size: 13px;
    padding: 1px;
}

.slide-login .content-div #lgwotp-error{
    color: red;
    font-size: 13px;
    padding: 1px;
}

.slide-login .content-div #lgwotp-success{
    color: green;
    font-size: 13px;
    padding: 1px;
}

.slide-login .subsection,.slide-register .subsection{
    display: flex;
    align-items: center;
    padding-top: 30px;
    padding-bottom: 14px;
    justify-content: center;
}

.slide-login .subsection span,.slide-register .subsection span{
    color: black;
    font-size: 15px;
    padding: 0 4px;
}

.slide-login .subsection .subtxt,.slide-register .subsection .subtxt{
    color: #ff5959;
    font-size: 15px;
    cursor: pointer;
}

.slide-login .getotp-btn,
.slide-login .lgpwd-btn,
.slide-login .verify-lotp,
.slide-login .sendemail,
.slide-login .verifymobile,
.slide-register .register-btn{
    background-color: #ff5959;
    height: 60px;
    color: white;
    border-radius: 5px;
    font-size: 16px;
}

.slide-login .comman-error{
    padding-bottom: 20px;
}

.slide-login .sight{
    color: black;
    position: absolute;
    top: 17px;
    right: 10px;
    cursor: pointer;
    padding: 0 15px;
}

[dir="rtl"] .slide-login .sight{
    left: 10px;
    right: unset;
}

.slide-login .seen{
    color: #ff5959;
}

.slide-login .lgdiv{
    color: #272525;
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 5px;
}

.slide-login .divider{
    padding-left: 5px;
    padding-right: 5px;
    color: gray;
}

.slide-register .lgdiv{
    color: #959595;
    font-size: 12px;
    padding-bottom: 12px;
}

.slide-login .lgdiv span:first-child,
.slide-login .lgdiv span:last-child,
.slide-register .lgdiv span:first-child,
.slide-register .lgdiv span:last-child{
    color: blue;
}

.slide-login .lgdiv span:hover,
.slide-register .lgdiv span:hover{
    cursor: pointer;
}

.slide-login .lg-control{
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: black;
    font-size: 13px;
    padding-top: 13px;
}

.slide-login .rmb-check{
    cursor: pointer;
}

.slide-login .rmb-check input{
    margin: 0 5px;
    cursor: pointer;
}

.slide-login .rmb-check label{
    cursor: pointer;
}

.slide-login .rmb-check label:hover{
    color: #ff5959;
}

.slide-login .fpwd{
    cursor: pointer;
}

.slide-login .fgpwd-div{
    color: black;
    font-size: 24px;
    display: none;
}

.slide-login .fgpwd-div .reset-pwd-div{
    padding-top: 25px;
    padding-bottom: 15px;
}

.slide-login .fgpwd-div #reset-email-check{
    padding-left: 110px;
}

.slide-login .section2,.slide-register .section2{
    position: fixed;
    bottom: 0;
    height: 60px;
    overflow-y: hidden;
    background: #ffffff;
    transition: transform .5s ease-out;
    left: auto;
    right: 0;
    transform: translate(0%, 0px);
    z-index: 2;
}

.slide-login .ftn-btn{
    padding-top: 5px;
}

.slide-login .otp-div{
    padding-top: 10px;
}

.slide-register .gstyle-div input{
    height: 45px;
}

.slide-register .gstyle-div #rname{
    text-transform: capitalize;
}

.slide-register .gstyle-div label{
    top: 11px;
}

.slide-login .cntry-flagcode{
    position: absolute;
    color: black;
    top: 18px;
    left: 15px;
    font-size: 16px;
    cursor: pointer;
}

.slide-register .cntry-flagcode{
    position: absolute;
    color: black;
    top: 13px;
    left: 15px;
    font-size: 13px;
    cursor: pointer;
}

.slide-login .cntry-flagcode .cntry-flag,
.slide-register .cntry-flagcode .cntry-flag{
    padding-right: 3px;
}

.slide-login #lgpwd-mobile_email{
    padding-left: 16px;
}

.slide-register input::placeholder {
    font-size: 9px;
}

/* Vendor-specific prefixes for better browser support */
.slide-register input::-webkit-input-placeholder {
    font-size: 13px;
}

.slide-register input:-ms-input-placeholder {
    font-size: 13px;
}

.slide-register input::-ms-input-placeholder {
    font-size: 13px;
}


#lgpwd-mobile_email::placeholder {
    font-size: 13px; /* Adjust the font size as needed */
}

/* Vendor-specific prefixes for older browser support */
#lgpwd-mobile_email::-webkit-input-placeholder {
    font-size: 13px;
}

#lgpwd-mobile_email:-ms-input-placeholder {
    font-size: 13px;
}

#lgpwd-mobile_email::-ms-input-placeholder {
    font-size: 13px;
}

#lgpwd-mobile_email::placeholder {
    font-size: 13px;
}

.slide-login .cntry-flagcode i,
.slide-register .cntry-flagcode i{
    padding-left: 3px;
}

.slide-register #rmobile{
    padding-left: 105px;
}

.loginpoweredby{
    width: 480px;
    padding: 5px 20px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loginpoweredby span{
    color: black;
    font-size: 13px;
    padding-top: 9px;
    padding-right: 5px;
}

.slide-login #lgotp-mobile{
    padding-left: 120px;
}

.slide-login .mbl-div label{
    top: -12px;
    color: rgb(147, 147, 147);
}

.slide-register .help-block{
    color: red;
    text-align: left;
    margin-bottom: 0;
    font-size: 12px;
}

/* Flag and phone code */
.phone-code{
    position: absolute;
    background-color: white;
    width: 100%;
    max-height: 320px;
    overflow: hidden;
    border: 1px solid lightgray;
    display: none;
    z-index: 1;
}

.phone-code .cntry-search{
    height: 40px;
    border-radius: 0;
    position: absolute;
    top: 0;
    padding: 13px 40px 13px 16px;
}

.phone-code .cntry-search-clear{
    position: absolute;
    right: 15px;
    top: 9px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
}

.phone-code .phonecode-list{
    overflow: auto;
    height: 280px;
    padding: 20px 10px;
    margin-top: 40px;
}

.phone-code .code{
    padding: 5px;
    font-size: 15px;
}

.phone-code .code:hover{
    background-color: whitesmoke;
    cursor: pointer;
}

.phone-code .idd{
    padding: 0 5px;
}

.popover{
	z-index: 1350;
    text-transform: capitalize;
    font-size: 12px;
    background-color: #ff5959;
}

.popover .popover-body{
	color: #ffffff;
}

.bs-popover-right .arrow::after{
	border-right-color: red;
}
/* login and registration page  -- END -- */


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

    /* login and registration page --- START -- */
    .slide-login-show, .slide-register-show{
        width: 100%;
    }
    
    .slide-login .section1, .slide-register .section1{
        padding: 30px 20px;
        height: 100%;
    }

    .slide-login .section2, .slide-register .section2{
        display: none;
    }

    /* login and registration page --- END -- */


    .lds-roller-main{
        background-color: white;
    }

    .lds-roller-1 div:after{
        background-color: #000000;
    }

    #desktop-logout {
        display: none;
    }

    #mobile-logout {
        display: flex;
    }

    .login-page-or-text {
        text-align: center;
        color: white;
        padding: 8px 0px;
    }

    .modifierItemList {
        width: 100%;
        /* width: 47%; */
        font-size: 12px;
        padding: 3px 5px;
    }

    #panel-additional p {
        font-size: 12.5px;
    }

    .branch-branchname {
        font-size: 13px;
        word-break: break-word;
    }

    .order-subheader{
        padding:10px 20px;
        align-items: center;
        height: 58px;
    }

    #foodstall{
        padding-bottom: 40px;
        gap: 16px;
    }

    .filterbutton:not(:disabled):not(.disabled).active:focus, .filterbutton:not(:disabled):not(.disabled):active:focus, .show>.filterbutton.dropdown-toggle:focus,.filterbutton:focus
    {
        box-shadow: none;
    }
}

.ripple {
    width: 0;
    height: 0;
    border-radius: 50%;
    background: rgb(105, 103, 103);
    transform: scale(0);
    position: absolute;
    opacity: 1;
}
.rippleEffect {
    animation: rippleDrop 0.4s linear;
}

@keyframes rippleDrop {
    100% {
        transform: scale(2);
        opacity: 0;
    }
}

[type="search"] {
    border: 1px solid #ced4da;
    padding-left: 5px;
    height: 33px;
    margin-top: 0px;
}

/* ================================================================================================= Customer History Page ==================================================================== */

.custhistorysection1 .dataTables_wrapper .dataTables_filter,
.custhistorysection2 .dataTables_wrapper .dataTables_filter {
    float: left;
    text-align: right;
    margin-left: 0px;
}

.custhistorysection1 .dataTables_wrapper .dataTables_filter input,
.custhistorysection2 .dataTables_wrapper .dataTables_filter input {
    margin-left: 0;
}

/* ratings  */

.review,
.reviewed {
    cursor: pointer;
}

.display-star {
    color: hsl(55deg 100% 50%);
    -webkit-text-stroke-width: 1px;
}

#reviewmodal .reviewfooter{
    padding: 7px 0;
}

.rating,
.show-rating {
    padding: 16px;
}

.rating ul,
.show-rating ul {
    list-style-type: none;
    padding: 0px;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    text-align: center;
}

.rating ul > li,
.show-rating ul > li {
    display: inline-block;
    font-size: 1.4375rem;
}

.rating ul > li.star.hover > i.fa {
    color: hsl(55deg 100% 50%);
}

.rating ul > li.star.selected > i.fa,
.show-rating ul > li.show-star.selected {
    color: hsl(55deg 100% 50%);
}

/* rating ending */

#reviewmodal textarea,
#show-reviewmodal textarea {
    border: 1px solid lightgrey;
    width: 100%;
    padding: 0.625rem;
}

#reviewmodal .review-submit {
    color: white;
    background-color: #ff5959;
    border: none;
    border-radius: 6px;
    padding: 7px 35px;
}

#feedback-error-div p {
    color: red;
    font-size: 0.875rem;
}
.bg-clicked {
    background-color: lightgrey;
}

body,
html {
    height: 100%;
}

a:hover {
    text-decoration: none;
    color: #57b846;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0px;
    display: flex;
}

.alert-danger {
    color: #000000;
    background-color: #f1e342;
    border-color: #f1e342;
}

p {
    /* font-family: Raleway-Regular; */
    /* font-family: Cambria, Cochin, Georgia, Times, "Times New Roman", serif; */
    font-size: 14px;
    line-height: 1.6;
    color: #666666;
    margin: 0px;
}

ul,
li {
    margin: 0px;
    list-style-type: none;
}

input {
    outline: none;
    border: none;
}

textarea {
    outline: none;
    border: none;
}

input:focus::-webkit-input-placeholder {
    color: transparent;
}
input:focus:-moz-placeholder {
    color: transparent;
}
input:focus::-moz-placeholder {
    color: transparent;
}
input:focus:-ms-input-placeholder {
    color: transparent;
}

textarea:focus::-webkit-input-placeholder {
    color: transparent;
}
textarea:focus:-moz-placeholder {
    color: transparent;
}
textarea:focus::-moz-placeholder {
    color: transparent;
}
textarea:focus:-ms-input-placeholder {
    color: transparent;
}

input::-webkit-input-placeholder {
    color: #999999;
}
input:-moz-placeholder {
    color: #999999;
}
input::-moz-placeholder {
    color: #999999;
}
input:-ms-input-placeholder {
    color: #999999;
}

textarea::-webkit-input-placeholder {
    color: #999999;
}
textarea:-moz-placeholder {
    color: #999999;
}
textarea::-moz-placeholder {
    color: #999999;
}
textarea:-ms-input-placeholder {
    color: #999999;
}

label {
    display: flex;
    /* display: block; */
    margin: 0;
}

button {
    outline: none !important;
    border: none;
    background: transparent;
}

button:hover {
    cursor: pointer;
}

iframe {
    border: none !important;
}

.txt1 {
    font-family: Cambria, Cochin, Georgia, Times, "Times New Roman", serif;
    font-size: 13px;
    color: #bc906b;
    line-height: 1.4;
    text-transform: uppercase;
}

#defaultmodal .modal-footer {
    padding: 7px 15px;
}

#defaultmodal .modal-footer button {
    width: 15%;
}

.guest-login {
    display: none !important;
}

@media only screen and (max-width: 768px) {
    #defaultmodal .modal-footer button {
        width: 20%;
    }

    .guest-login {
        display: block !important;
        padding-top: 25px;
    }
}
.txt2 {
    font-family: Raleway-Regular;
    font-size: 13px;
    color: #999999;
    line-height: 1.4;
}

.txt3 {
    /* font-family: Raleway-Regular; */
    font-family: 'Poppins', sans-serif;
    font-size: 13px;
    color: #555555;
    line-height: 1.4;
}

/* --------------------------------------------------------------- Login page customer section-------------------------------------------------------- */

.limiter {
    width: 100%;
    margin: 0 auto;
}

.help-block {
    color: red;
    text-align: center;
    margin-bottom: 11px;
}

.container-login100 {
    width: 100%;
    min-height: 100vh;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    padding: 15px;
    background-color: #ebebeb;
}

.wrap-login100 {
    width: 430px;
    border-radius: 10px;
    position: relative;
    padding: 25px 25px 15px 25px;
    background-color: #ffffff;
    box-shadow: 0 0 10px rgb(0 0 0 / 20%);
}

.login100-form {
    width: 100%;
}

.login100-form-title {
    font-family: 'Poppins', sans-serif;
    font-size: 30px;
    color: #555555;
    line-height: 1.2;
    text-transform: uppercase;
    text-align: center;

    width: 100%;
    display: block;
}

.wrap-input100 {
    width: 100%;
    position: relative;
    border: 1px solid #e6e6e6;
    border-radius: 2px;
}

.input100 {
    /* font-family: Raleway-Medium; */
    font-family: 'Poppins', sans-serif;
    color: #555555;
    line-height: 1.2;
    font-size: 15px;
    display: block;
    width: 100%;
    background: white;
    height: 35px;
    padding: 0 35px 0px 45px;
}

.wrap-login100 .wrap-input100 .symbol-input100{
    position: absolute;
    bottom: 0;
    left: 0;
    display: flex;
    align-items: center;
    font-size: 16px;
    height: 100%;
    padding-left: 15px;
    color: gray;
}

.wrap-login100 .rf{
    padding-top: 10px;
}

.wrap-login100 .lg-text{
    padding-bottom: 20px;
    font-size: 18px;
    font-weight: 600;
    font-family: 'Poppins', sans-serif;
    text-align: center;
}

.input100::placeholder{
    font-size: 14px;
}

.container-login100 .separator, .lg-div .separator {
    display: flex;
    align-items: center;
    text-align: center;
    color: black;
    padding: 20px;
    font-family: 'Poppins', sans-serif;
}

.container-login100 .separator::before,
.container-login100 .separator::after ,
.lg-div .separator::before,
.lg-div .separator::after{
    content: '';
    flex: 1;
    border-bottom: 1px solid black;
}

.container-login100 .separator:not(:empty)::before,
.lg-div .separator:not(:empty)::before {
    margin-right: .25em;
}

.container-login100 .separator:not(:empty)::after,
.lg-div .separator:not(:empty)::after {
margin-left: .25em;
}

.focus-input100 {
    position: absolute;
    display: block;
    width: calc(100% + 2px);
    height: calc(100% + 2px);
    top: -1px;
    left: -1px;
    pointer-events: none;
    border-bottom: 1px solid #57b846;
    border-radius: 3px;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all 0.4s;
    -o-transition: all 0.4s;
    -moz-transition: all 0.4s;
    transition: all 0.4s;
    -webkit-transform: scaleX(1.1) scaleY(1.3);
    -moz-transform: scaleX(1.1) scaleY(1.3);
    -ms-transform: scaleX(1.1) scaleY(1.3);
    -o-transform: scaleX(1.1) scaleY(1.3);
    transform: scaleX(1.1) scaleY(1.3);
}

.input100:focus + .focus-input100 {
    visibility: visible;
    opacity: 1;

    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

.eff-focus-selection {
    visibility: visible;
    opacity: 1;

    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

.btn-show-pass {
    font-size: 15px;
    color: #999999;

    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    position: absolute;
    height: 100%;
    top: 0;
    right: 12px;
    padding: 0 5px;
    cursor: pointer;
    -webkit-transition: background 0.4s;
    -o-transition: background 0.4s;
    -moz-transition: background 0.4s;
    transition: background 0.4s;
}

.language-switch {
    color: #bc906b;
    font-size: 0.875rem;
    letter-spacing: 0.0625rem;
    font-weight: 900;
    position: absolute;
    top: 30px;
    right: 30px;
    font-family: 'Poppins', sans-serif;
}

@media only screen and (max-width: 768px) {
    .language-switch {
        top: 0px;
    }
}

.input-checkbox100 {
    display: none;
}

.label-checkbox100 {
    /* font-family: Raleway-Regular; */
    font-family: 'Poppins', sans-serif;
    font-size: 13px;
    color: black;
    line-height: 1.4;

    display: block;
    position: relative;
    padding-left: 26px;
    cursor: pointer;
}

.label-checkbox100::before {
    content: "\f00c";
    font-family: FontAwesome;
    font-size: 13px;
    color: transparent;

    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    width: 18px;
    height: 18px;
    border-radius: 2px;
    background: #fff;
    border: 1px solid #6c757d;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.input-checkbox100:checked + .label-checkbox100::before {
    color: #57b846;
}

.container-login100-form-btn {
    width: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
}

.login100-form-btn {
    /* font-family: Raleway-Bold; */
    font-size: 14px;
    color: #fff;
    line-height: 1.2;
    font-family: 'Poppins', sans-serif;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 20px;
    min-width: 150px;
    height: 40px;
    background-color: #bc906b;
    border-radius: 27px;

    -webkit-transition: all 0.4s;
    -o-transition: all 0.4s;
    -moz-transition: all 0.4s;
    transition: all 0.4s;
}

.login100-form-btn:focus {
    outline: none;
    box-shadow: none;
    color: white;
}

.login100-form-btn:hover {
    color: white;
}

.validate-input {
    position: relative;
}

.alert-validate .btn-show-pass {
    visibility: hidden;
}

.alert-validate::before {
    content: attr(data-validate);
    position: absolute;
    max-width: 70%;
    background-color: #fff;
    border: 1px solid #c80000;
    border-radius: 3px;
    padding: 4px 25px 5px 10px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 12px;
    pointer-events: none;

    font-family: Raleway-Medium;
    color: #c80000;
    font-size: 14px;
    line-height: 1.4;
    text-align: left;

    visibility: hidden;
    opacity: 0;

    -webkit-transition: opacity 0.4s;
    -o-transition: opacity 0.4s;
    -moz-transition: opacity 0.4s;
    transition: opacity 0.4s;
}

.alert-validate::after {
    content: "\f12a";
    font-family: FontAwesome;
    display: block;
    position: absolute;
    color: #c80000;
    font-size: 18px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 18px;
}

.alert-validate:hover:before {
    visibility: visible;
    opacity: 1;
}

.help-block1 {
    color: red;
    text-align: center;
    margin-bottom: 11px;
    letter-spacing: 0.5px;
}

.lg-div .help-block1{
    margin-bottom: 0;
    padding-top: 5px;
}

.powered_by{
	color: black;
	white-space: nowrap;
    font-size: 13px;
    font-family: 'Poppins', sans-serif;
}

.cm-logo{
	display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 15px;
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
}

.cm-logo img{
	margin-bottom: 7px;
	padding-left: 6px;
}

.wrap-login100 .cwl{
    color:black;
    background-color:white;
    border:1px solid lightgray;
    margin-top: 30px;
}

.wrap-login100 .splitter{
    text-align: center;
    padding: 10px;
    font-size: 17px;
}

.wrap-login100 .ctnlogin{
    width: 100%;
    padding: 0 20px;
    height: 40px;
    background-color: #bc906b;
    color: white;
    border-radius: 27px;
    margin-bottom: 8px;
    margin-top: 8px;
}

.wrap-login100 .ctnlogin:hover{
    background-color: #dda87a;
}

.wrap-login100 .login-section{
    height: 0;
    overflow: hidden;
    margin-top: 5px;
    margin-bottom: 10px;
    opacity: 0;
    transition: height 0.4s, opacity 0.4s;
}

.wrap-login100 .login-section.show{
    height: 230px;
    opacity: 1;
    display: block;
}

.wrap-login100 .new-login-section{
    margin-top: 8px;
    margin-bottom: 8px;
}

.wrap-login100 .new-login-section a:hover{
    color: #083b66;
}

.wrap-login100 .alert-register{
    width: 100%;
    text-align: center;
    font-size: 14px;
    padding: 5px;
    margin-bottom: 10px;
}

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

    .cust-addre-set2 .brmn{
        display: flex;
        align-items: center;
    }

    .cust-addre-set2 .brmn .sopen{
        padding: 0 5px;
    }

    .cust-addre-set2 .brmn h5{
        font-size: 17px;
        padding-left: 10px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .cust-btn{
        background-color: transparent !important;
        border: 1px solid whitesmoke !important;
    }

    .label-checkbox100 {
        /* color: #acb6c2; */
        color: #bc906b;
    }

    .help-block {
        color: red;
        text-align: center;
        margin-bottom: 11px;
        background-color: #ecebeb;
        border: 1px solid red;
    }

    /* .help-block1 {
        color: #f9f871;
        text-align: center;
        margin-bottom: 11px;
        letter-spacing: 0.5px;
    } */

    .container-login100 {
        background-color: #ffffff;
        align-items: flex-start;
        padding-top: 50px;
    }
    .wrap-login100 {
        width: 95%;
        background: none;
        border-radius: 10px;
        position: relative;
        margin: auto;
        box-shadow: none;
    }
    .p-l-85,
    .p-r-85,
    .p-t-55,
    .p-b-55 {
        padding: 0px;
    }
    .mobile-custlogin-input {
        background-color: white;
        border: 1px solid white;
    }
    .wrap-input100 {
        border: none;
        padding-top: 10px;
    }

    .cust-login-text-clr {
        color: #bc906b;
        font-weight: 600;
    }

    .cust-login-btn {
        background-color: #bc906b;
    }

    .input100 {
        height: 45px;
        border-radius: 27px;
    }

    .container-login100 .separator {
        color: white;
    }

    .container-login100 .separator::before,
    .container-login100 .separator::after{
        border-bottom: 1px solid white;
    }
    .wrap-login100 .lg-text{
        color: #212529;
    }

    .wrap-login100 .wrap-input100 .symbol-input100{
        padding-top: 12px;
        padding-left: 20px;
        font-size: 20px;
    }
    
    .powered_by{
        color: white;
    }

    .btn-show-pass{
        padding-top: 10px;
    }

    .wrap-login100 .cwl{
        color: black;
        background-color: white;
        border: 1px solid lightgray;
    }

    .wrap-login100 .login-section.show{
        height: 275px;
    }

    .wrap-login100 .splitter{
        color: #bc906b;
    }
}

@media (max-width: 992px) {
    .alert-validate::before {
        visibility: visible;
        opacity: 1;
    }
}

/* ------------------------------------------------ customer branch showing page ------------------------------------ */

.custbranchsection1 {
    height: 105px;
    border-bottom: 1px solid #30425a;
    background-color: #30425a;
    color: white;
}

.custbranchsection3 {
    padding-top: 2px;
    padding-left: 57px;
    padding-bottom: 20px;
}

.custbranchsection4 {
    width: 100%;
    height: 15%;
    display: flex;
    align-items: center;
    margin-bottom: 15px;
    margin-top: 15px;
}

.custbranchsection5 {
    width: 100%;
}

.custbranchsection5::-webkit-scrollbar {
    display: none;
    -ms-overflow-style: none;
}
.custbaranchsection6 {
    margin: 5px 5px 5px 5px;
    float: left;
    width: 187px;
    justify-content: center;
    height: 220px;
    cursor: pointer;
}

.custbaranchsection7 {
    text-align: left;
    padding-left: 15px;
}

.custbaranchsection8 {
    width: 40%;
}

.custbranchsection9 {
    width: 15%;
    height: 100%;
    padding: 1px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.custbranchsection10 {
    width: 70%;
    height: 100%;
    padding: 10px;
    display: flex;
    align-items: center;
}

.custbranchsection11 {
    text-align: center;
    width: 15%;
    justify-content: flex-end;
}

.select2 {
    width: 100% !important;
}

.select2-selection {
    border-top: 0px !important;
    border-left: 0px !important;
    border-right: 0px !important;
    border-bottom: 1px solid whitesmoke !important;
}

.select2-selection:focus {
    border: none !important;
}

.branch,
.flashmsg-branch-icon {
    cursor: pointer;
}
.branch-card-body {
    height: 35px;
}
.cust-branch-state {
    padding: 10px 2px 10px 10px;
}

.branch .branch-card-body{
    padding : 5px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.cust-branch-outlet-text {
    padding-left: 50px;
    padding-top: 15px;
    padding-bottom: 20px;
    margin-top: 105px;
}

.branch-card-img {
    border: none;
}

.branch-card-img:hover {
    border: 1px solid rgba(0, 0, 0, 0.125);
    box-shadow: 0 4px 7px 0 rgba(218, 220, 230, 0.6);
}

.branch1 {
    padding-right: 24px;
    font-size: 21px;
    color: lightgrey;
}

#flashmsg-branch {
    padding: 10px 30px;
    display: flex;
    justify-content: space-between;
    margin-bottom: 15px;
    align-items: center;
}

.flashmsg-branch-icon {
    padding-left: 10px;
}

.order-main-section h5{
    margin: 0;
    padding: 1px;
    color: black;
}

.order-main-section-sub .fa-times{
    font-size: 24px;
    color: #605353;
}

.order-main-section-sub .fa-times:hover{
    cursor: pointer;
}

.order-content{
    height: calc(100vh - 110px);
    overflow: auto;
    background-color: #1f2326;
    margin: 0 auto;
    box-sizing: border-box;
}

.order-main-section{
    background-color: #fafbff;
    border-radius: 10px;
    padding: 20px;
    width: 500px;
    margin: 0 auto;
    position: fixed;
    top: 35%;
    left: 50%;
    z-index: 1200;
    display: none;
    height: 520px;
}

.order-main-section-sub {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 10px 10px 5px;
}

.order-main-section input[type="radio"]{
    position: fixed;
    opacity: 0;
    pointer-events: none;
}

.order-main-section .active{
    box-shadow: none !important;
    background-color: #e7e5e59c;
}

.order-main-section .modecheck, .order-main-section input,.order-main-section label{
    cursor: pointer;
}

.order-main-section .item-div:hover{
    background-color: #ababab9c;
}

.order-main-section .item-div{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    border: 1px solid whitesmoke;
}

.order-main-section ul li{
    color: rgb(24, 23, 23);
}

.order-main-section .city-selection{
    padding-top: 5px;
}

.order-main-section .location-selection{
    padding-top: 20px;
    display: none;
}

.order-main-section .city-selection{
    display: none;
}

.selected-sliptype{
    display: flex;
    color: white;
    font-size: 17px;
    align-items: baseline;
    justify-content: center;
}

.selected-sliptype label{
    padding-right: 2px;
}

.selected-sliptype .service{
    color: white;
    margin-bottom: 0;
    font-size: 17px;
}

.selected-sliptype .change-service{
    font-size: 14px;
    color: white;
    padding-left: 11px;
    text-decoration: underline;
    cursor: pointer;
}

.location-selection-error{
    width: 99%;
    display: flex;
    margin-top: 16px;
}

.location-selection-error h6{
    color: red;
}

.newLoc{
    height: max-content;
    overflow: auto;
    background-color: #ffffff;
    margin-top: 20px;
    border-radius: 10px;
}

.loc-head{
    color: black;
    padding: 20px 30px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.loc-head i{
    padding-right: 10px;
    padding-left: 10px;
    padding-bottom: 20px;
}

.loc-head:hover{
    background-color: #fcf9f9;
    cursor: pointer;
}

.loc-head .div1{
    font-size: 17px;
    margin-bottom: 3px;
    color: black;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.loc-head .div2{
    font-size: 14px;
    color: #8d8686;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.location-search-bar-div{
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    padding-top: 20px;
    padding-bottom: 20px;
}

.location-search-bar-div .search-input-div{
    position: relative; 
    flex: 1;   
}

.location-search-bar-div .search-bar-input{
    border-radius: 10px;
    padding: 0.375rem 3.8rem 0.375rem 1.5rem;
    border-color: #ff5959;
    line-height: 1.8;
}

.location-search-bar-div .search-bar-input:focus{
    box-shadow: none;
    outline: 0;
    border-color: #f74242;
}

.location-search-bar-div .search-clear{
   color: #ff5959;
   position: absolute;
   top: 10px;
   right: 24px;
   border-radius: 50%;
   width: 25px;
   height: 25px;
   display: flex;
   align-items: center;
   justify-content: center;
}

.location-search-bar-div .search-clear:hover{
    cursor: pointer;
}

.branch-error{
    color: #ff5959;
    font-size: 14px;
    padding: 15px 50px;
    text-indent: 11px;
    text-align: center;
}

.location-search-bar-div .search-clear:hover{
    background-color: whitesmoke;
}

.branch-selection{
    overflow: auto;
    height: calc(445px - 170px);
    display: none;
}

.branch-selection .br-div{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding : 10px 40px 10px 20px;
    margin-bottom: 15px;
    cursor: pointer;
    border-radius: 10px;
    background-color: #ffffff;
    box-shadow: 0 0 10px rgb(0 0 0 / 20%);
}

.branch-selection .br-div .detail-div{
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.branch-selection .br-div .br-name{
    font-weight: 600;
    font-size: 15px;
}

.branch-selection .br-div .br-loc{
    font-size: 13px;
}

.branch-selection .br-div .br-image{
    padding-right: 17px;
}

.branch-selection .br-div .br-image img{
    border-radius: 50%;
}

.branch-selection .br-div .lgpin{
    padding: 10px;
    border-radius: 50%;
    cursor: pointer;
}

.branch-selection .br-div .lgpin:hover{
    background-color: whitesmoke;
}

.branch-selection #mapModal{
    z-index: 2060;
}

.mapSection{
    background-color: white;
    border-radius: 10px;
    padding: 20px;
    width: 499px;
    margin: 0 auto;
    position: fixed;
    top: 53%;
    left: 50%;
    z-index: 1202;
    transform: translate(-50%, -50%);
    height: 321px;
    display: none;
}

.autoResent{
    padding: 0;
    width: 100%;
    border-radius: 4px;
    visibility: visible;
    opacity: 1;
    overflow: auto;
    height: calc(100% - 123px);
    display: inherit;
}

.autoResent::-webkit-scrollbar{
    display:none; 
    -ms-overflow-style : none;
}

.autoResent {
    scrollbar-width: none;
}

.autoResent .custaddress{
    border-top: 1px solid whitesmoke;
    padding-top: 10px;
}

.autoResent .custaddress .line-div{
    display: flex;
    align-items: center;
}

.autoResent .custaddress .address-error{
    text-align: center;
    color: red;
    background-color: white;
    padding: 15px;
    border-radius: 10px;
}

.autoResent .custaddress .line{
    flex: 1;
    height: 1px;
    background-color: whitesmoke;
}

.autoResent .custaddress .addr-div:hover{
   cursor: pointer;
}

.custaddress .addr-div:not(:last-child){
    margin-bottom: 20px;
}

.custaddress .addr-div{
    padding: 20px;
    font-size: 14px;
    text-align: left;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    box-shadow: 0 0 2px 0 rgba(3, 0, 0, 0.1);
    border-radius: 10px;
    background-color: white;
}

[dir="rtl"] .custaddress .addr-div p{
    text-align: right;
}

.custaddress .addr-div i{
    padding-right: 10px;
    padding-left: 10px;
    font-size: 19px;
    padding-bottom: 20px;
}

.custaddress .addr-div .cust-name{
    font-size: 15px;
    text-align: left;
    font-weight: 600;
    padding-top: 0;
}

.custaddress .addressTxt{
    font-size: 20px;
    padding: 27px 20px;
}

.autoResenthide{
    padding: 0;
    background-color: white;
    width: 100%;
    border-radius: 4px;
    box-shadow: rgb(1 1 1 / 13%) 0px 2px 8px;
    display: none;
}

.autoloc{
    padding: 20px;
    border-radius: 10px;
    background-color: white;
}

.autoloc:hover{
    cursor: pointer;
}

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

.autoloc .autXXz i{
    color: #ff5959;
    padding: 0 10px;
}

.autoloc .autXXz p{
    font-size: 17px;
    padding-left: 8px;
    color: #ff5959;
}

.autoloc .gpsTxt{
    font-size: 14px;
    padding-left: 24px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.addAddress-div{
    padding: 20px;
    border-radius: 10px;
    background-color: white;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-top: 10px;
    cursor: pointer;
}

.addAddress-div i{
    color: #ff5959;
    font-size: 24px;
    padding: 0 5px;
}

.addAddress-div p{
    color: #ff5959;
    font-size: 17px;
    padding-left: 8px;
}

.login-prompt{
    background-color: white;
    padding: 20px 25px;
    display: flex;
    margin-top: 10px;
}

.login-prompt .pmt-txt1{
    padding: 0 6px;
    color: #ff5959;
    text-decoration: underline;
    cursor: pointer;
}

.autoResent .resentLocTxt{
    font-size: 20px;
    padding : 27px 20px;
}

.recentLoc{
    height: auto;
    overflow: auto;
    padding-top: 10px;
    padding-bottom: 20px;
}

.recentLoc .line-div{
    display: flex;
    align-items: center;
}

.recentLoc .line{
    flex: 1;
    height: 1px;
    background-color: whitesmoke;
}



.recentLocCnt:hover{
    background-color: whitesmoke;
    cursor: pointer;
}

.recentLoc .recentLocCnt{
    padding: 20px;
    font-size: 14px;
    display: flex;
    align-items: center;
    background-color: white;
    border-radius: 10px;
    margin-bottom: 20px;
    box-shadow: 0 0 2px 0 rgba(3, 0, 0, 0.1);
}

.recentLoc .recentLocCnt i{
    color: #564343;
    padding : 0 20px;
}

.recentLoc .recentLocCnt:hover i{
    color: #ff5959;
}

[dir="rtl"] .recentLocCnt-txt{
    text-align: right;
}

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

    .branch-selection .br-div{
        padding: 20px 40px 20px 20px;
    }

    .order-main-section h5{
        font-size: 24px;
    }

    .order-main-section{
        width: 99%;
        margin-top: 0px;
        border-radius: 2px;
        min-height: 100%;
        padding: 20px;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
    }

    .current-location{
        padding: 2px 0px;
    }

    .current-location .change{
        font-size: 13px;
    }

    .current-location p{
        font-size: 13px;
    }

    .order-content{
        height: calc(100vh - 60px);
    }

    .selected-sliptype label{
       font-size: 12px;
    }

    .selected-sliptype .service {
        font-size: 12px;
    }

    .selected-sliptype .change-service {
        font-size: 12px;
        padding-left: 4px;
    }

    .branch-card-img {
        border: 1px solid rgba(0, 0, 0, 0.125);
    }

    #branch {
        padding-left: 1px;
        padding-bottom: 4px;
        padding-top: 15px;
        height: calc(100% - 170px);
    }

    .cust-branch-outlet-text {
        padding-left: 1px;
        padding-top: 20px;
        padding-bottom: 5px;
        margin-top: 49px;
    }
    .cust-branch-state {
        padding: 10px 2px 5px 10px;
    }

    .cust-branch-int {
        font-size: 1.3rem;
    }
    .custbranchsection1 {
        height: 65px;
    }

    .custbranchsection2 {
        padding-top: 15px;
    }

    .custbranchsection3 {
        padding-top: 15px;
        padding-left: 0px;
        padding-bottom: 1px;
    }

    .custbranchsection4 {
        margin-bottom: 10px;
    }
    .custbaranchsection6 {
        width: 200px;
        height: 230px;
    }
    .custbaranchsection7 {
        padding-left: 5px;
    }
    .custbranchsection9 {
        width: 110px;
        height: 100px;
    }

    .custbranchsection10 {
        width: 70%;
        height: 56px;
    }

    .custbranchsection11 {
        text-align: center;
        width: 30%;
    }

    .branch-card-body {
        height: 45px;
        padding: 6px;
        display: flex;
        align-items: center;
    }

    .location-search-bar-div .search-bar-input{
        height: 50px;
    }

    .location-search-bar-div .search-clear{
        top: 13px;
        font-size: 20px;
    }
}

/* !---------------------------------------------------------- Customer order page -------------------------------------------------------------- */

/* Popupads */
.close-popupads {
    font-size: 15px;
    float: right;
    border: 1px solid white;
    border-radius: 100%;
    background: #312f2f;
    color: white;
    text-shadow: 0 1px 0 #fff;
    width: 25px;
}

.modal-header-popupads {
    padding: 0px;
    min-height: 1px;
    background: #6b242400;
}

.popup-body {
    width: 100%;
    height: 440px;
    padding: 0px;
}

.modal-content-popupads {
    background-color: transparent !important;
    margin-top: 15vh;
}

.orderBdy{
    background-color:var(--bg-color-2);
}

.cartopen{
	font-weight:500;
	padding:0px 8px 0px 8px;
	justify-content:center;
}

.cartopen h6{
    position: relative;
	padding-right:5px;
	padding-left:5px;
	color: var(--text-color-1);
	font-size: 17.5px;
}

.mobilesearch h6{
	font-weight:500;
	font-size:18px;
	color: var(--text-color-1);
}

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

    .cartopen .lblCartCount{
        bottom: 8px;
        right: -10px;
        padding: 2px 7px;
    }

    .popup-body {
        height: 420px;
    }
    .popup-dialog {
        width: auto;
        margin: 30px;
    }

    .orderBdy{
        background-color: #ffffff;
    }
}
@media (min-width: 576px) {
    .popup-dialog {
        max-width: 420px;
    }
}

/* ? toggle start */

.menuclose {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#flashmsg-order {
    position: relative;
    width: 370px;
    bottom: 0px;
    left: 0px;
    z-index: 1040;
    transform: translate(0%);
    box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.2);
    padding: 6px 45px 6px 15px;
    background-color: #fff705;
}

.flashmsg-order-icon {
    position: absolute;
    bottom: 7%;
    right: 5%;
    z-index: 999;
}

.flashmsg-order-icon {
    cursor: pointer;
}

.ordersearch {
    /* margin-top: 36px;
    padding-left: 6px;
    justify-content: flex-end;
    padding-right: 5%; */
	margin-top: 36px;
    padding-left: 24px;
    justify-content: flex-end;
    padding-right: 13%;
    margin-bottom: 25px;
}

.ordersearch .comman-toggle .toggle-div label{
    color: var(--text-color-1);
    text-transform: capitalize;
    cursor: pointer;
}

.searchinput {
    width: 85%;
    height: 90%;
}

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

.ordersearch .filter .veg-only,
.ordersearch .filter .nonveg-only,
.ordersearch .filter .available-items{
    padding-right: 40px;
}

.ordersearch .filter-status{
	padding: 4px 20px;
	margin-left: 40px;
	border-radius: 50px;
	position: relative;
	font-size: 21px;
}

.ordersearch .filter-status .count-span{
	position: absolute;
    top: -6px;
    font-size: 14px;
    background-color: #ff5959;
    width: 23px;
    height: 23px;
    border-radius: 50%;
    color: white;
    margin: auto;
    left: 30px;
    text-align: center;
}

.ordersearch .filter-status .clear{
	padding-left: 10px;
    font-size: 15px;
	cursor: pointer;
}

.ordersearch .searchinput:focus {
    outline: 1px solid lightgrey;
    box-shadow: none;
}

.ordersearch button {
	width: 15%;
    height: 90%;
    background-color: #f8f8f8;
    color: #333;
    border: 1px solid var(--border-color-3);
    border-radius: 0;
	border-top-right-radius: 12px;
	border-bottom-right-radius: 12px;
}

[dir="rtl"] .ordersearch button{
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
	border-top-left-radius: 12px;
	border-bottom-left-radius: 12px;
}

.ordersearch button:hover {
    background-color: #dfdfdf;
    color: rgb(37, 37, 37);
    border: 1px solid lightgrey;
}

.ordersearch button:focus {
    box-shadow: none;
}

.filter a {
    display: flex;
    align-items: center;
    font-size: 15px;
    color: darkslategray;
    line-height: 35px;
 
}

.filter button {
    width: 25%;
    height: 90%;
}

.filter button:hover {
    background-color: #dfdfdf;
    color: rgb(37, 37, 37);
    border: 1px solid lightgrey;
}

.filter button:focus {
    background-color: #dfdfdf !important;
    color: rgb(37, 37, 37) !important;
    border: 1px solid lightgrey !important;
    box-shadow: none !important;
}

.filter button:active {
    background-color: #dfdfdf !important;
    color: rgb(37, 37, 37) !important;
    border: 1px solid lightgrey !important;
    box-shadow: none !important;
}

.switchorder {
    position: relative;
    display: inline-block;
    width: 35px;
    height: 16px;
}

.switchorder input {
    opacity: 0;
    width: 0;
    height: 0;
}

.sliderorder {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

.sliderorder:before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: -5px;
    bottom: -1px;
    background-color: white;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

input:checked + .sliderorder {
    background-color: #2196f3;
}

input:focus + .sliderorder {
    box-shadow: 0 0 1px #2196f3;
}

input:checked + .sliderorder:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

.sliderorder.round {
    border-radius: 34px;
}

.sliderorder.round:before {
    border-radius: 50%;
}

/* ? toggle ends */

.ccrt1 {
    display: flex;
    align-items: center;
    transition: 0.3s;
    background-color: whitesmoke;
    padding: 0px 10px;
}

.ccrt2 {
    width: 75%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.ccrtph {
    font-size: 28px;
    font-weight: 600;
}

#clearcart {
    margin-left: 30px;
    height: 28px;
}

/* Profile for order page */

.profile-dropdown {
    display: none;
    position: absolute;
    top: 50px;
    right: 26px;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 8px 12px 0 rgba(0, 0, 0, 0.2);
    z-index: 1052;
}

.profile-dropdown a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 5px 5px !important;
    color: darkslategrey;
    width: max-content;
}

.profile-dropdown li {
    padding: 5px 18px;
}

.profile-dropdown li:hover {
    background: whitesmoke;
}
/* .profile-dropdown::before {
    content: "";
    position: absolute;
    top: -20px;
    left: 85%;
    transform: translateX(-50%);
    border: 10px solid;
    border-color: transparent transparent #fff transparent;
} */

.profile-dropdown-show {
    display: block;
}

.profile-dropdown i {
    margin-right: 10px;
}

.language-switcher {
    padding: 0rem 0.4375rem;
    text-decoration: underline;
}

#editaddressmodal .help-block{
    text-align: left;
}

@media only screen and (max-width: 768px) {
    
    .profile-dropdown {
        display: none;
        position: absolute;
        top: 50px;
        right: 24px;
        background: #fff;
        border-radius: 5px;
        box-shadow: 0 8px 12px 0 rgba(0, 0, 0, 0.2);
        z-index: 1052;
    }

    .profile-dropdown::before {
        content: "";
        position: absolute;
        top: -20px;
        left: 86%;
        transform: translateX(-50%);
        border: 10px solid;
        border-color: transparent transparent #fff transparent;
    }

    .profile-dropdown-show {
        display: block;
    }


    .ccrtph {
        font-size: 25px;
        font-weight: 600;
    }
}

/* profile for order page end */

/* filter drop down */

.filter-dropdown {
    display: none;
    position: absolute;
    top: 40px;
    left: 15px;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 8px 12px 0 rgba(0, 0, 0, 0.2);
    z-index: 1052;
    width: 215px;
}

.filter-dropdown-show {
    display: block;
}

.filter-dropdown ul{
    padding: 5px 12px;
}

@media only screen and (max-width: 768px) {
    .filter-dropdown {
        top: 56px;
        right: 20px;
        left: auto;
        width: 240px;
    }
}

/* profile for others */

#inter-login{
    font-size: 20px;
    color: lightgrey;
}

#inter-login i{
    padding-right: 5px;
}

.profile1-div {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    flex-direction: row;
    cursor: pointer;
    color: lightgrey;
    text-align: center;
    position: relative;
    width: 115px;
}

.profile1-dropdown {
    display: none;
    position: absolute;
    top: 45px;
   right: 70px;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 8px 12px 0 rgba(0, 0, 0, 0.2);
    z-index: 1052;
    width: 180px;
    border-radius: 10px;
}

[dir="rtl"] .profile1-dropdown{
    left: 70px;
    right: unset;
}

.profile1-dropdown a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 5px 5px !important;
    color: darkslategrey;
    margin: auto;
    font-size: 15px;
    transition: color 0.3s ease;
}

.profile1-dropdown a i{
    color: white;
    transition: color 0.3s ease;
}

.profile1-dropdown a:hover i {
    color: #ff5959; /* Color on hover for the icon */
}

.profile1-dropdown ul{
    padding: 15px 0;
}

.profile1-dropdown li {
    padding: 5px 25px;
}

.profile1-dropdown p:hover, .profile1-dropdown a:hover, .profile1-dropdown li:hover{
    color: #ff5959;
}

.profile1-dropdown li:hover {
   font-weight: 600;
   color: #ff5959;
}
.profile1-dropdown::before {
    content: "";
    position: absolute;
    top: -20px;
    border: 10px solid;
    border-color: transparent transparent #fff transparent;
    right: 10px;
}

.profile1-dropdown-show {
    display: block;
}

.profile1-dropdown i {
    margin-right: 5px;
}

@media only screen and (max-width: 768px) {
    .profile1-div {
        justify-content: flex-end;
        cursor: pointer;
        color: lightgrey;
        padding-right: 1px;
        text-align: right;
        padding-right: 18px;
    }

    .profile1-dropdown {
        display: none;
        position: absolute;
        top: 50px;
        left: -51px;
        right: 4px;
        background: #fff;
        border-radius: 5px;
        box-shadow: 0 8px 12px 0 rgb(0 0 0 / 20%);
        z-index: 1055;
        margin: auto;
        max-width: max-content;
    }

    .profile1-dropdown::before {
        content: "";
        position: absolute;
        top: -20px;
        left: 86%;
        transform: translateX(-50%);
        border: 10px solid;
        border-color: transparent transparent #fff transparent;
    }

    .profile1-dropdown-show {
        display: block;
    }
}

/* profile others end */

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

.orderbd1 {
    border-bottom: 0px;
}

.orderbdrad-1 {
    border-radius: 6px;
}

.ordermargin1 {
    margin-left: 4px;
}

.orderpad1 {
    padding: 8px 2px;
    /* padding: 13px 20px; */
    display: flex;
    width: 160px;
}

.orderpad2 {
    padding: 8px 10px 10px 8px;
    background-color: #dae6ea;
}

.orderweight1 {
    font-weight: 500;
}
.orderset1 {
    display: flex;
    width: 100%;
    height: 100%;
}

#imagepopupmodal-body{
    width: 100%;
    height: 100%;
    padding: 0.5rem;
}
/* 
#imagepopupmodal-modal-dialog{
    width: 470px;
    height: 300px;
    align-items: flex-end;
} */

#imagepopupmodal-modal-content{
    width: 470px;
    height: 300px;
    align-items: flex-end;
    animation-name: zoom;
    animation-duration: 0.7s;
}

@keyframes zoom {
    from {transform:scale(0)}
    to {transform:scale(1)}
  }

.orderset2 {
    width: 200px;
    /* padding: 8px 2px 4px 2px; */
    align-items: center;
    justify-content: center;
    display: flex;
}

.orderset-2-1{
    width: calc(100% - 200px);
	position: relative;
}

.orderset-2-1 .chLng{
	position: absolute;
    font-size: 18px;
}

[dir="ltr"] .orderset-2-1 .chLng {
    right: 30px;
    left: auto;
}

[dir="rtl"] .orderset-2-1 .chLng {
    left: 10px;
    right: auto;
	top: 5px;
	font-size: 15px;
}

[dir="rtl"] .orderset-2-1 .chLng a{
	color: red;
}

.orderset3 {
    padding: 8px 50px 4px 2px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 60px;
}

[dir="rtl"] .orderset3{
    padding: 8px 20px 4px 50px;
}

.orderset3 .minamt{
    white-space: nowrap;
    overflow: hidden;
    padding-top: 5px;
    padding-left: 30px;
}

.orderset3 .chLng a,
.profile1-div .chLng a{
    color: #ff5959;
    font-weight: 600;
    padding: 5px 30px;
    border-radius: 6px;
    /* background-color: #ffffff;
    border: 1px solid #ff5959; */
}

.orderset4 {
    padding: 8px 2px;
    display: flex;
    align-items: center;
    width: 200px;
    overflow: hidden;
    justify-content: center;
}

.orderset4 .fa-store{
    padding-right: 4px;
}

.orderset4 .cartopen{
    cursor: pointer;
}

.orderset5 {
    padding-left: 7px;
}
.orderset6 {
    width: 100px;
    border-radius: 0px;
}

.orderset7 {
    text-align: left;
    color: var(--text-color-1);
    display: flex;
    align-items: center;
    font-size: 14px;
    padding-left: 20px;
    gap: 5px;
    flex: 1;
    display: flex;
    min-width: 0;
}

.orderset7 .fa-location-arrow{
	padding-right: 11px;
}

.orderset7 .fa-chevron-down{
    padding: 0 10px;
}

.orderset7 .fa-location-dot{
    padding: 0 9px;
}

.locdel i{
    color: white;
}

.orderset7 .delLoc{
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    padding-left: 0px;
    flex: 1;
}

.orderset7:hover{
    color: #ff4949;
    cursor: pointer;
} 

.orderset8 {
    background-color: #30425a;
    width: 100%;
    color: white;
    padding: 0px 3px 0px 3px;
    height: 28px;
}

.orderset9 {
    padding-top: 5px;
    color: red;
    font-weight: 700;
}

.orderset10 {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 5%;
    cursor: pointer;
    color: white;
}

.orderset11 {
    font-size: 18px;
    color: white;
    position: relative;
    padding-right: 12px;
}

.orderset12 {
    padding-right: 7px;
    padding-left: 5px;
    border-right: 1px solid white;
    font-size: 18px;
    color: white;
    font-weight: 600;
}

.orderset13 {
    font-size: 18px;
    color: var(--text-color-7);
    font-weight: 600;
    padding: 0 10px 0 5px;
}

.orderset14 {
    font-size: 26px;
    color: lightgrey;
}

.orderset15 {
    padding-left: 18px;
    line-height: 2.5rem;
    border-radius: 10px;
    margin-right: 10px;
}

#menu-center > p:nth-of-type(n){
    border-top: 0.5px solid #bc906b;

}

.orderset16 {
    background-color: white;
    margin-bottom: 5px;
    margin-top: 10px;
    color: black;
    font-size: 24px;
    font-weight: 600;
    width: 100%;
}

.orderset17 {
    width: 240px;
    margin: 20px 25px;
    float: left;
    max-height: 330px;
    height: 330px;
	border-radius: 10px;
    background-color: var(--bg-color-1);
	box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.2);
	position: relative;
}

.orderset17 .ftype{
    padding: 0 4px;
}

.food-icon{
	width: 15px;
    height: 15px;
    /* display: inline-block; */
    background-size: contain;
    background-repeat: no-repeat;
    margin-right: 3px;
	margin-top: 0;
}

.food-veg {
    background-image: url('/images/vegicon.png');
}

.food-egg {
    background-image: url('/images/eggicon.png');
}

.food-nonveg {
    background-image: url('/images/nonvegicon.png');
}

#discountstall .orderset17{
    flex: 0 0 240px;
}

.amount-details .dVal span{
	text-decoration:line-through;
	padding-left:4px;
	font-size:14px;
	color: gray;
	text-decoration-color: #ff5959;
	text-decoration-thickness: 1.5px
}

.cutheight{
    height: 250px;
}

.clearfix{
	min-height:0;
	clear:both;
	display:block;
}

.orderset17:hover {
    box-shadow: 0 8px 12px 0 rgba(0, 0, 0, 0.2);
}
.orderset18 {
    margin-right: 3px;
    height: 15px;
    width: 15px;
    margin-bottom: 3px;
}

.orderset19 {
    margin-bottom: 3px;
    line-height: 17px;
    height: 82px;
    color: var(--text-color-4);
    padding: 3px 13px;
	word-break: break-all;
}

[dir="rtl"] .orderset19{
    text-align: right;
}

.orderset20 {
    font-size: 12px;
    color: red;
    margin-left: auto;
    width: 50%;
    text-align: center;
}

.orderset21 {
    top: 80px;
    right: 250px;
}

.orderset22 {
    width: 100%;
    padding-left: 20px;
}

.orderset23 {
    width: 25%;
    padding-right: 15px;
    font-size: 25px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

[dir="rtl"] .orderset23{
    padding-left: 15px;
}

.orderset24 {
    display: flex;
    height: auto;
    /* height: 51px; */
    transition: 0.3s;
    align-items: center;
    padding: 5px 0px 5px 0px;
}

.orderset24 .wtd{
    width: 58%;
}

.orderset25 {
    width: 50%;
    font-size: 26px;
    display: flex;
    justify-content: flex-start;
}

.orderset26 {
    width: 50%;
    text-align: right;
    font-size: 26px;
    color: #30425a;
    justify-content: flex-end;
    padding-right: 13px;
}

.orderset27 {
    padding-left: 7px;
    padding-right: 5px;
    font-size: 18px;
    color: var(--text-color-7);
    font-weight: 600;
    border-left: 1px solid #8f8f8f;
    /* border-left: 1px solid whitesmoke; */
}

.orderset28{
    padding: 3px 10px;
    display: flex;
    justify-content: space-between;
    height: 95px;
    flex-wrap: wrap;
}

.orderset28-1{
    display: flex;
    justify-content: space-between;
    min-width: 0;
    flex: 1 1 300px;
    gap: 10px;
}

.orderset28-1 .loc-div{
    flex: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 200px;
}

.orderset28-2{
    display: flex;
    justify-content:flex-end;
    min-width: 0;
    flex: 1 1 300px;
    gap: 10px;
}

.orderset28 .brpref {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 0px;
    padding-bottom: 8px;
}

.change-br{
	font-size: 11px;
    padding-top: 4px;
    padding-left: 11px;
    text-decoration: underline;
    color: #ff5959;
    cursor: pointer;
}

.br-name{
	text-overflow: ellipsis;
    width: max-content;
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
}

.orderset28 .brpref h6{
	color: var(--text-color-1);
}

.orderset28 .brpref .fa-store{
    padding: 0 9px;
}

.orderset28 .delmint{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.orderset28 .dellocc{
	display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.orderset28 .slip-div{
    cursor: pointer;
    position: relative;
	/* new change */
	display: flex;
    align-items: center;
	flex: 1;
	min-width: 150px;
}

.orderset28 .slip-div span{
    font-size: 15px;
    padding: 0 5px;
}

.custom-select{
	position: relative;
	width: 170px;
	cursor: pointer;
	border: none;
	height: 68px;
	background: none;
}

[dir="rtl"] .custom-select {
	width: 200px;
}

.custom-select .selected{
	padding: 10px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: white;
}

.custom-select .selected img{
	height: 35px;
	width: 35px;
	margin-right: 6px;
}

.custom-select .options{
	display: none;
	position: absolute;
	width: 100%;
	border: 1px solid #ccc;
	background: white;
	list-style: none;
	padding: 0;
	margin: 0;
	top: 53px;
	right: 1px;
	border-radius: 10px;
}

.custom-select .options li img{
	width: 24px;
	height: 24px;
	margin-right: 10px;
}

.custom-select .options li:hover{
	background: #f0f0f0;
}

.custom-select ul li{
	padding: 7px;
	text-align: center;
	font-size: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.top-ribbon .minamt{
    flex: 1;
}

.top-ribbon{
    color: white;
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* background-color: #212121; */
    padding: 2px 40px;
    height: 0px;
    /* height: 45px; */
    position: fixed;
    width: 100%;
    right: 0;
    left: 0;
    z-index: 10;
    /* border-bottom: 1px solid #655f5f; */
    top: 154px;
    border-top: 1px solid white;
}

.orderpad1 #pp-drop,
.cust-addre-set2 #pp-drop{
    color: var(--text-color-1);
    display: flex;
    align-items: center;
}

.orderpad1 .profile1-div .customer-name h5,
.cust-addre-set2 #pp-drop h5{
    color: var(--text-color-1);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 150px;
    padding-right: 10px;
    font-size: 16px;
}


.orderpad1 .profile1-dropdown{
    left: -60px;
    top: 30px;
}

[dir="rtl"] .orderpad1 .profile1-dropdown{
    right: -60px;
    left: unset;
    top: 36px;
}

[dir="rtl"] .orderpad1 .profile1-dropdown::before{
    right: unset;
    left: 20px;
}

.orderset29 {
    color: var(--text-color-8);
    font-size: 12px;
    line-height: 15px;
}
.fa-out {
    margin-left: 4px;
    padding-top: 4px;
}

#body-overlay {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100vw;
    background-color: rgb(16 16 16 / 73%);
    content: " ";
    z-index: 1200;
    display: none;
}

#profile-overlay {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100vw;
    background-color: transparent;
    content: " ";
    z-index: 1;
    display: none;
}

.dellocation {
    padding: 0px 10px 0px 10px;

    border-left: 2px solid lightgrey;
    border-right: 2px solid lightgrey;
    cursor: pointer;
}
.custordermodal {
    font-size: 15px;
    font-weight: 500;
    color: #5656bb !important;
}

.cust-order-modalitems {
    padding-top: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid whitesmoke;
}

.custdeliveryto {
    border: none;
    padding-top: 3px;
}

.custaddaddress {
    padding: 3px 16px;
    font-size: 1rem;
    border-radius: 9px;
    border: 1px solid #ff5959;
    padding: 10px 20px;
    background-color: white;
    color: #ff5959;
    font-weight: 600;
}

.custaddaddress i{
    padding: 0 5px;
}

.custaddaddress:focus {
    outline: none !important;
    box-shadow: none !important;
}
.custdeliveryto:focus {
    outline: 0px transparent !important;
}

.changeoutlet {
    cursor: pointer;
    padding: 0px 150px 0px 0px;
}

.itemimage {
    transition: transform 0.2s;
}

.custordersection1 {
    height: 95px;
    /* height: 155px; */
    position: fixed;
    top: 0;
    background-color: var(--bg-color-1);
    color: var(--text-color-1);
    padding: 5px;
    /* border-bottom: 2px solid #3e3e3e; */
	box-shadow: 0 4px 6px -2px rgba(128, 128, 128, 0.5);
}

.custordersection1 .guest-lg{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-left: auto;
    height: 100%;
    margin-right: 75px;
}

.custordersection1 .signin{
    cursor: pointer;
    color: var(--text-color-7);
    padding: 0;
    border-radius: 6px;
}

.custordersection1 .signin .fa-regular{
	padding-right: 5px;
}

.order-company-name{
	color: var(--text-color-1);
}

.item-body{
    margin-top: 100px;
    /* margin-top: 160px; */
}

.item-body.theme2{
    padding: 0 60px;
}

.profile-p {
    line-height: 2rem;
}
.profile-p:hover {
    color: blue;
}

.category-sidemenu{
    width: 250px;
}

.custordersection2 {
    height: calc(100vh - 137px);
    overflow-y: scroll;
    overflow-x: hidden;
    width: 250px;
    text-align: left;
    padding-left: 15px;
    padding-top: 10px;
    cursor: pointer;
    top: 175px;
    position: fixed;
    padding-bottom: 50px;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}

.font-size-13 {
    font-size: 15px;
}
.custordersection2::-webkit-scrollbar {
    display: none;
    -ms-overflow-style: none;
}

.custordersection3 {
    flex: 1;
    background-color: var(--bg-color-2);
    padding: 0 30px;
    min-width: 0;
}

.custordersection3::-webkit-scrollbar {
    display: none;
    -ms-overflow-style: none;
}

.custordersection4 {
    padding: 7px 10px 10px 10px;
    position: fixed;
    top: 0px;
    right: 0px;
    width: 490px;
    background: white;
    height: 100vh;
    z-index: 1349;
    visibility: hidden;
    transition: all 0.1s cubic-bezier(0.215, 0.61, 0.355, 1);
    transform: translateX(100%);
}

.item-card:hover {
    box-shadow: 0 8px 12px 0 rgba(0, 0, 0, 0.2);
}

.showcart {
    visibility: visible;
    transform: translateX(0);
}

.profile {
    top: 60px;
    background-color: white;
    right: 13px;
    z-index: 1360;
    position: fixed;
    height: 98px;
    width: 85px;
    box-shadow: 0 8px 12px 0 rgba(0, 0, 0, 0.2);
    visibility: hidden;
    transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
    transform: translateX(100%);
}

.profile:before {
    width: 10px;
    height: 10px;
    position: absolute;
    border-top: 2px solid white;
    border-right: 0px solid blue;
    border-bottom: 0px solid blue;
    border-left: 2px solid white;
    top: 0%;
    left: 77%;
    margin-left: -5px;
    content: "";
    transform: rotate(45deg);
    margin-top: -5px;
    background-color: white;
}

.showprofile {
    visibility: visible;
    transform: translateX(0);
}

.veg-div {
    cursor: pointer;
    font-weight: 600;
    color: black;
    padding-left: 20px;
    font-size: 15px;
    width: 80%;
    height: 28px;
    letter-spacing: 0.5px;
}

.veg-div:hover {
    color: green;
}
.custhgt1 {
    height: 66%;
    overflow: auto;
}

#cart{
    padding: 6px 7px;

}

#cart .itemname{
    text-transform: capitalize;
    font-size: 15px;
	color: #000000;
}

#cart .itemprice{
    font-weight: 600;
    padding: 0 5px;
    display: flex;
    justify-content: flex-end;
    font-weight: 600;
}


.custhgt2 {
    height: 6%;
}
.custhgt3 {
    height: 8%;
    border-bottom: 1px solid whitesmoke;
}
.custhgt4 {
    height: 10%;
    display: flex;
    transition: 0.3s;
    align-items: center;
    padding-top: 15px;
    box-shadow: -3px -10px 10px -10px rgba(169, 169, 169, 0.5);
}

.custhgt5 {
    height: 5%;
}

.custhgt5 p{
    font-size: 12px;
    color: #000000;
    text-align: right;
}

.close-cart{
    display: none;
    height: 0;
}

.bd1 {
    border-top: 1px solid lightgrey;
    border-right: 1px solid lightgrey;
    border-bottom: 1px solid lightgrey;
    border-left: 1px solid lightgrey;
}

.bd2 {
    border-top: 1px solid lightgrey;
    border-right: 1px solid lightgrey;
    border-bottom: 1px solid lightgrey;
    border-left: 1px solid lightgrey;
}

.value-control:focus {
    outline: none;
    box-shadow: none;
}

#ordersubmit{
    background-color: #ff5959;
    color: white;
    height: 50px;
}

.wrapper {
    display: flex;
    width: 100%;
    align-items: stretch;
    /* background-color: #fbfbfb; */
}

.menu-float-menu {
    line-height: 36px;
}

.bg-lightgreen {
    background-color: green !important;
}
/* ? mobile view */

.item {
    font-size: 14px;
    font-weight: 700;
    color: var(--text-color-2);
	display: flex;
	align-items: center;
}

.spice-div{
	font-size: 14px;
    display: flex;
    position: absolute;
    right: 10px;
    top: 122px;
    z-index: 1000;
    background-color: #ffffff;
    border-radius: 7px 7px 0 7px;
	padding: 5px 10px;
}

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

.mobile-address {
    width: 100%;
    border: none;
    background-color: #009a9a;
}

.order-mobile-pd1 {
    height: 100px;
    background-color: var(--bg-color-1);
    padding: 10px 5px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 5;
    flex-direction: column;
	box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
}

.order-mobile-pd1 .brdel{
    display: flex;
    align-items: center;
    width: 100%;
    padding: 2px 0px;
    height: 65px;
}

.order-mobile-pd1 .chLng{
    padding: 0 10px;
}

.custaddsection1 .chLng a,
.brdel .chLng a{
    color: #ff5959 !important;
    font-weight: 600;
    padding: 5px 25px !important;
    border-radius: 6px;
    /* background-color: #ffffff;
    border: 1px solid #ff5959; */
}

.custaddsection1 .signin{
    cursor: pointer;
    color: var(--text-color-7);
    padding: 8px 25px;
    border-radius: 6px;
}

.custaddsection1 .signin .fa-user{
	padding-right: 7px;
}

.order-mobile-pd1 .locdel{
    display: flex;
    align-items: center;
    width: 100%;
    padding: 5px 0px;
    padding-left: 22px;
    height: 35px;
}

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

.order-mobile-pd2 {
    padding-bottom: 15px;
}
.order-mobile-set1 {
    height: 40px;
}

.order-mobile-set2 {
    margin-bottom: 3px;
    line-height: 17px;
    height: 72px;
    font-size: 0.9rem;
    padding-left: 6px;
}

.order-mobile-set3 {
    display: flex;
}

.order-mobile-set5 {
    margin-top: 55px;
    display: grid;
    margin-bottom: 70px;
    /* background-color: whitesmoke; */
}

.order-mobile-set6 {
    width: 100%;
}

.sliderorder-mobile {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}
.sliderorder-mobile:before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: -5px;
    bottom: -1px;
    background-color: white;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    border: 1px solid lightgray;
}

input:checked + .sliderorder-mobile {
    background-color: #2196f3;
}

input:focus + .sliderorder-mobile {
    box-shadow: 0 0 1px #2196f3;
}

input:checked + .sliderorder-mobile:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

.sliderorder-mobile.round {
    border-radius: 34px;
}

.sliderorder-mobile.round:before {
    border-radius: 50%;
}

.item-card-mobile {
    width: 48%;
    height: 273px;
    float: left;
    padding: 6px 3px 6px 3px;
    margin: 1%;
    background-color: white;
}

#sidebarmobile {
    color: #000000;
    transition: all 0.3s;
}

#modalmenu {
    top: auto;
    bottom: 150px;
    outline: none;
    max-height: 400px;
    height: auto;
    overflow: hidden;
    width: 60%;
    right: 23px;
    left: auto;
}

#modalmenu .modal-content{
    border-radius: 10px;
}

#modalmenu .modal-body{
    max-height: 260px;
    height: auto;
    border-radius: 10px;
    overflow: auto;
    background-color: #ffffff;
}

.custmobile-h1 {
    color: white;
}

.custmobile-h2 {
    color: black;
}

#sidebarmobile ul p {
    color: black;
    padding: 1px;
}

.mob-itemname {
    height: 40px;
    padding-left: 4px;
    padding-top: 2px;
}

.mobile-branch-name {
    font-size: 16px;
    padding: 0 30px 5px 15px;
    flex: 1;
	color: var(--text-color-1);
}

[dir="rtl"] .mobile-branch-name{
    text-align: right;
}

.mobile-grp-name {
    font-weight: 600;
}

.order-mobile-set7 {
    display: none;
}

#panel-subAmount button {
    padding: 2px 8px 3px 8px;
}

.one-edge-shadow {
    -webkit-box-shadow: 0 8px 12px -8px black;
    -moz-box-shadow: 0 8px 12px -8px black;
    box-shadow: 0 8px 12px -8px lightgrey;
}

.customize-btn {
    background-color: #bc906b;
}

.customer-modifier-panel {
    position: fixed;
    top: 0;
    left: 0;
    width: 70%;
    background: white;
    height: auto;
    z-index: 1500;
    visibility: hidden;
    transform: translate(calc(50vw - 50%), calc(50vh - 50%));
}

.showmod {
    visibility: visible;
}

#item-modifier{
	font-size: 14px;
}

.panel-header {
    border-bottom: 1px solid whitesmoke;
    height: 50px;
    background-color: whitesmoke;
    margin-bottom: 10px;
    padding: 0px 10px 0px 15px;
}

.panel-header .txt1{
    justify-content: center;
    padding-left:0px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.panel-header .txt2{
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

#panel-size .sizetext,
#panel-modifier .modifiertext,
#panel-additional .additionaltext{
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

#panel-size .sizeradio,
#panel-modifier .modifierradio{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
	padding: 2px 20px;
}

.mod-split{
	display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.panel-body {
    height: auto;
    max-height: 74vh;
    overflow: auto;
    padding: 0px 15px 5px 15px;
}
.panel-footer {
    height: 70px;
    color: black;
    align-items: center;
    padding: 10px 0px 10px 0px;
    cursor: pointer;
    border-top: 1px solid grey;
    box-shadow: 0px 0 10px rgb(0 0 0 / 23%);
}

#panel-subAmount {
    padding: 5px 0px 5px 0px;
    background-color: aliceblue;
}

#panel-additional{
    padding-top: 10px;
}

#modifier-addtocart .item-total{
    padding-right: 20px;
}

.order-custom-flashmsg {
    position: fixed;
    /* bottom: 30px;
    left: 5%; */
	top: 76px;
    right: 10%;
    transform: translate(-5%);
    z-index: 1047;
    border-radius: 10px;
    box-shadow: 0 8px 12px 0 rgba(0, 0, 0, 0.2);
}

.order-custom-flashmsg .alert {
    padding: 14px 30px;
    margin-bottom: 0px;
    border-radius: 10px;
    border: none;
    font-size: 17px;
}

.order-custom-flashmsg .alert i{
    padding: 0 10px;
}

.order-custom-flashmsg .alert-warning{
    background-color: #ff9602;
    color: white;
    margin-bottom: 0px;
    border-radius: 10px;
    border: none;
    font-size: 17px;
    padding: 11px 60px;
}

.order-custom-flashmsg .alert-success{
    background-color: #ff5959;
    color: white;
    margin-bottom: 0px;
    border-radius: 10px;
    border: none;
    font-size: 17px;
    padding: 11px 40px;
}
.actionButton {
    display: flex;
    width: 5.8rem;
    border: 1px solid var(--border-color-5);
    border-radius: 0.6rem;
}

.itRmd{
	background-color: #000000;
	color: #ffffff;
}

.actionButton1 {
    border: 1px solid #ff5959;
    border-radius: 0.6rem;
    width: 25%;
}

.actionButton1 .plus-btn,.actionButton1 .minus-btn{
	color: #ff5959;
}

.actionButton input,
.actionButton1 input {
    border-radius: 0px;
	background-color: #ffffff !important;
}

.sizeContent{
    font-size:12px;
    color: #808080;
    line-height:16px;
    text-transform: capitalize;
    display: flex;
    justify-content: flex-start;
	padding-bottom: 5px;
}   

.customContent{
    font-size: 10px;
    line-height:1;
    color:#999;
    text-transform: capitalize;
    display: flex;
    justify-content: flex-start;
}

.actionButton .minus-btn {
    border-top-left-radius: 0.6rem;
    border-bottom-left-radius: 0.6rem;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.actionButton .plus-btn{
    border-top-right-radius: 0.6rem;
    border-bottom-right-radius: 0.6rem;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

[dir="rtl"] .actionButton .minus-btn{
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: 0.6rem;
    border-bottom-right-radius: 0.6rem;
}

[dir="rtl"] .actionButton .plus-btn{
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-top-left-radius: 0.6rem;
    border-bottom-left-radius: 0.6rem;
}

#repeatModal .close{
    padding: 0;
    margin: 0;
}

#repeatModal .modal-footer{
    gap: 30px;
}

#repeatModal .modal-title{
    text-align: right;
}

#repeat{
    display: flex;
    align-items: center;
    justify-content: flex-start;
	text-transform: capitalize;
}

#body-overlay-mobile {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100vw;
    background-color: rgb(16 16 16 / 73%);
    content: " ";
    z-index: 1200;
    display: none;
}

#panel-amt {
    padding-left: 3px;
    font-size: 1rem;
}

.color-green {
    color: green;
}
#panel-item {
    font-size: 1.2rem;
}

.selected-item:hover {
    background-color: white;
    color: white;
    cursor: pointer;
}

.cust-addre-set1 {
    height: 100%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cust-addre-set3 {
    display: none;
}

.cust-addre-set4 {
    color: #fff;
    text-align: left;
}

.cust-addre-set4 h4{
    text-transform: uppercase;
    color: black;
}

.cust-addre-set5 {
    color: #fff;
    text-align: right;
}

.cust-addre-set5 a{
    padding: 6px 30px;
    border-radius: 3px;
}

#item-modifier:focus {
    box-shadow: none;
}

.infostyle {
	font-size: 11px;
    border: 1px solid #ffffff;
    border-radius: 20px;
    padding: 2px 8px;
    margin-left: 8px;
    font-style: italic;
    cursor: pointer;
    background-color: #ff5959;
    color: white !important;
}

.loading {
    position: fixed;
    top: 50%;
    left: 50%;
    right: 0;
    bottom: 0;
    content: " ";
    z-index: 2200;
    visibility: hidden;
    transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
    transform: translateY(100%);
}

.loading-show {
    visibility: visible;
    transform: translateY(0);
}

#panel-extras {
    margin-top: 15px;
    margin-bottom: 1px;
}
#panel-info {
    margin-top: 10px;
    margin-bottom: 15px;
}

.pad-panel {
    padding-bottom: 5px;
    padding-top: 5px;
}

#showcode {
    padding: 4px 15px 4px 13px;
    margin-left: 5px;
    margin-top: 6px;
    margin-bottom: 7px;
    font-size: 26px;
    font-weight: 700;
    width: 100%;
    background-color: var(--bg-color-2);
    color: var(--text-color-5);
	display: flex;
	align-items: center;
	text-transform: uppercase;
}

#showcode .clear-search{
	padding-left: 16px;
    font-size: 26px;
    padding-top: 3px;
    cursor: pointer;
    color: #ff5959;
}

[dir="rtl"] #showcode{
    text-align: right;
}

.amt {
    padding-left: 2px;
    font-weight: 600;
    color: var(--text-color-2);
}

.aed {
    padding: 0 3px;
    font-weight: 600;
    color: var(--text-color-2);
}

.item-name {
    padding-top: 5px;
    height: 50px;
    overflow: hidden;
    color: white;
    padding-left: 10px;
    padding-right: 10px;
}

.amount-details{
    padding-left: 10px;
    padding-right: 10px;
    color: #ffffff;
}

.itemimage {
    height: 140px;
    border-radius: 7px 7px 0px 0px;
    cursor: pointer;
}

.imageheight {
    height: 140px;
	position: relative;
}

.mobile-compname {
    font-size: 33px;
}

.profile-adjust {
    top: 12vh;
    right: 58px;
}

#ordersubmit:focus {
    box-shadow: none;
}

.searchinput {
    padding: 0px;
    display: flex;
}

.flexpanel {
    justify-content: flex-end;
}

.blur {
    height: 0px;
    width: 100%;
    border: 1px solid #20202087;
    box-shadow: 0px 1px 10px 0px rgb(50 50 50);
    -webkit-box-shadow: 0px 1px 10px 0px rgb(50 50 50);
    -moz-box-shadow: 0px 1px 10px 0px rgb(50 50 50);
}

.close-dialog{
    display: none;
}

.actionButton .qtyinput{
    background-color: var(--bg-color-1);
    color: var(--text-color-1);
	font-weight: 700;
}

.customer-modifier-panel .actionButton .qtyinput{
    color: #000000;
}

.customer-modifier-panel .actionButton .minus-btn,
.customer-modifier-panel .actionButton .plus-btn{
    background-color: #ffffff;
}

.actionButton .minus-btn,.actionButton .plus-btn{
    padding: 3px 8px 2px 8px;
    background-color: var(--bg-color-4);
    color: var(--text-color-6);
}

.actionButton .minus-btn .fa-minus,.actionButton .plus-btn .fa-plus{
	font-weight: 600;
}

.searchinput input{
    background-color: var(--bg-color-2);
    color: var(--text-color-1);
	border: 1px solid var(--border-color-3);
	border-radius: 0;
	border-top-left-radius: 12px;
	border-bottom-left-radius: 12px;
	font-size: 14px;
}

[dir="rtl"] .searchinput input{
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;
	border-top-right-radius: 12px;
	border-bottom-right-radius: 12px;
}

@media only screen and (max-width: 1178px) {
    .order-company-name {
        font-size: 24px;
    }
}
@media only screen and (max-width: 768px) {

    [dir="rtl"] .locdel i{
        padding-right: 6px;
    }

    .custaddsection1 .chLng a,
    .brdel .chLng a{
        padding: 5px 10px !important;
    }
    .orderset7{
        padding: 0 30px 0 9px;
        font-size: 13px;
        width: 100%;
    }

    [dir="rtl"] .orderset7{
        padding: 0 10px;
    }

    .item-body {
        margin-top: 116px;
    }

    .item-body.theme2{
        padding: 0 5px;
    }

    .custaddsection1 .SideMenu_topNav__311Av{
        padding-left: 1px;
    }

    .SideMenu_topNav__311Av span{
        padding-left: 11px;
    }

    .actionButton .qtyinput{
        background-color: whitesmoke;
        color: #ff5959;
        font-weight: 600;
    }

    .actionButton .minus-btn,.actionButton .plus-btn{
        background-color: white;
        color: #000000;
        height: 2.3rem;
    }

    .actionButton .minus-btn .fa-minus,
    .actionButton .plus-btn .fa-plus{
        font-size: 17px;
		font-weight: 400;
    }

    .orderset24 .itemname{
        text-transform: capitalize;
    }
    .order-mobile-set7 {
        display: flex;
        align-items: center;
        justify-content: space-around;
        flex: 1;
        height: 65px;
        background-color: var(--bg-color-1);
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        z-index: 1;
		box-shadow: 0px -4px 10px rgba(0, 0, 0, 0.2);
    }

    .order-mobile-set7 .signin{
        color: var(--text-color-1);
        font-size: 17px;
    }

    .footer-font.display_total{
        font-size: 17px;
    }

    .ordersearch .filter{
        justify-content: space-between;
		padding: 0;
    }

    .ordersearch .filter .veg-only, .ordersearch .filter .egginclude, .ordersearch .filter .available-items{
        padding-right: 0px;
    }

    .ordersearch{
        padding: 25px 10px;
        /* position: fixed; */
        top: 75px;
        right: 0;
        left: 0;
        /* z-index: 5; */
        background-color: white;
		margin-top: 0;
		padding-top: 0;
    }

    .comman-toggle .toggle-div.active{
        background-color: white !important;
        box-shadow: none !important;
    }

    .ordersearch .comman-toggle .toggle-div label{
        color: black;
        font-size: 0.6rem;
    }

    .orderset25{
        font-size: 21px;
    }

    .orderset26 h5{
        font-size: 21px;
    }
	
    .amount-details .aed,.amount-details .amt{
        font-size: 0.8rem;
        color: #000000;
    }

    .cust-addre-set5 a{
        padding: 6px 10px;
    }

    .customer-name{
        display: none;
    }
    
    /* #imagepopupmodal-modal-content,#imagepopupmodal-modal-dialog{
        width: 100%;
        height: 12.5rem;
        align-items: center;
        margin-left: 5px;
        margin-right: 15px;
    } */

    .flexpanel {
        justify-content: flex-start;
    }

    .desktop {
        display: none;
    }
    .order-custom-flashmsg {
        top: 86%;
        left: 50%;
        transform: translate(-50%);
        width: 70%;
        display: none;
    }

    #searchtext:focus {
        outline: none;
        border: none;
        box-shadow: none;
    }

    .profile-dropdown {
        display: none;
        position: absolute;
        top: 50px;
        right: 24px;
        background: #fff;
        border-radius: 5px;
        box-shadow: 0 8px 12px 0 rgba(0, 0, 0, 0.2);
        z-index: 1052;
    }

    .profile-dropdown::before {
        content: "";
        position: absolute;
        top: -20px;
        left: 86%;
        transform: translateX(-50%);
        border: 10px solid;
        border-color: transparent transparent #fff transparent;
    }

    .profile-dropdown-show {
        display: block;
    }

    .filter {
        display: none;
    }

	.ordersearch .filter-status{
		padding: 4px 11px;
		margin-right: 11px;
		font-size: 0.6rem;
	}

    .searchinput {
        margin: 0px;
        padding: 0px;
        position: fixed;
        bottom: 0px;
        left: 0px;
        height: 50px;
        z-index: 10;
        width: 100%;
        background-color: #30425a;
        display: none;
        box-shadow: 0px 0 10px rgb(220 220 220 / 80%)
    }

    .searchinput input {
        width: 100%;
        height: 100%;
        background-color: white;
        color: black;
    }

    .searchinput button {
        width: 20%;
        height: 100%;
    }
    #flashmsg-order {
        position: fixed;
        bottom: 40%;
        left: 50%;
        z-index: 1050;
        width: 80%;
        transform: translate(-50%);
        box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.2);
        padding: 28px 2px;
        font-size: 16px;
        background-color: white !important;
        display: flex;
        flex-direction: column;
        align-items: center;
        border-radius: 15px;
    }

    #flashmsg-order h6 {
        font-size: 14.5px;
        text-align: center;
        color: black;
    }

    .flashmsg-order-icon {
       display: none;
    }

    .close-dialog{
        display: block;
        width: 100px;
        margin-top: 18px;
        padding: 7px 8px;
        border-radius: 0.6rem;
    }

    .order-info{
        font-size: 14px;
        padding-top: 5px;
        color: green;
    }

    #flashmsg-time {
        position: fixed;
        bottom: 55%;
        left: 50%;
        z-index: 1050;
        width: 100%;
        transform: translate(-50%);
        box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.2);
        padding: 15px 25px;
        font-size: 16px;
    }

    #flashmsg-time h6 {
        font-size: 13.6px;
    }

    .flashmsg-time-icon {
        position: absolute;
        top: 13%;
        right: 5%;
        z-index: 999;
        font-size: 25px;
    }

    .custbranchsection9 {
        display: none;
    }

    .profile-adjust {
        top: 60px;
        right: 25px;
    }

    .imageheight {
        height: 95px;
    }

    .itemimage {
        height: 100px;
		border-radius: 10px 10px 0 0;
    }
    .item-name {
        height: 50px;
        padding-top: 2px;
        padding-left: 5px;
        padding-right: 5px;
        color: #000000;
        align-items: center;
    }

    .amount-details{
        padding-left: 11px !important;
        padding-right: 8px;
        color: #000000;
    }

    .orderset18 {
        margin-right: 5px;
        height: 11px;
        width: 10px;
        display: flex;
        align-items: flex-start;
        margin-top: 3px;
    }

    .orderset14 {
        margin-left: 3px;
    }

    .orderset17 {
        max-height: 283px;
        border: 0;
        background-color: #ffffff;
        flex: 1 1 calc(50% - 8px);
        margin: 0;
        padding: 0;
        max-width: 50%;
        margin-bottom: 10px;
    }

    .cutheight{
        height: 200px;
    }
	
    .orderset19 {
        height: 80px;
        font-size: 11px;
        padding: 3px 14px;
        text-align: justify;
    }

    .flex1 {
        height: 36px;
        padding-left: 2px;
    }

    .amt {
        padding-left: 1px;
        font-weight: 500;
        color: hsl(0, 0%, 100%);
        /* changed */
        /* color: green; */
    }

    .aed {
        padding-right: 1px;
        font-weight: 500;
        color: hsl(0, 0%, 100%);
        /* changed */
        /* color: green; */
    }

    .actionButton {
        display: flex;
        width: 5.3rem;
        border: 1px solid #30425a;
        border-radius: 0.6rem;
    }

    #showcode {
        font-size: 17px;
        font-weight: 600;
        padding: 0px;
        margin-top: 0;
        margin-bottom: 0px;
        margin-left: 0px;
        width: 100%;
        background-color: #ffffff;
        color: var(--text-color-5);
        padding-bottom: 20px;
        padding-top: 10px;
    }

    .custordersection3 {
        margin-top: 17px;
        display: grid;
        width: 100%;
        background-color: #ffffff;
        padding: 0 14px;
    }

    .pad-panel {
        padding-bottom: 10px;
        padding-top: 10px;
    }

    #panel-extras {
        margin-top: 15px;
        margin-bottom: 15px;
    }
    #panel-info {
        margin-top: 15px;
        margin-bottom: 15px;
    }

    .cust-addre-set3 {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        color: #fff;
    }
    .cust-addre-set3 p {
        font-size: 13px;
        padding-left: 10px;
        padding-bottom: 3px;
        color: #000000;
    }

    .cust-addre-set3 .signin{
        color: white;
        font-size: 15px;
    }

    .changeoutlet {
        font-size: 12px;
    }

    .item {
        font-size: 0.78rem;
        font-weight: 600;
        color: black;
    }

    .order-mobile-set2 {
        height: 80px;
        font-size: 11px;
        padding-top: 12px;
        text-align: justify;
    }

    #panel-qty {
        border-right: 1px solid white;
        padding-right: 5px;
        font-size: 1.1rem;
    }

    #panel-amt {
        padding-left: 5px;
        font-size: 1.1rem;
    }
    .customer-modifier-panel {
        position: fixed;
        top: auto;
        bottom: 0px;
        left: 0px;
        right: 0px;
        width: 100%;
        background: white;
        height: auto;
        z-index: 1500;
        visibility: hidden;
        transition: all 0.1s cubic-bezier(0.215, 0.61, 0.355, 1);
        transform: translateY(100%);
    }

    #body-overlay-mobile {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        width: 100vw;
        background-color: rgba(0, 0, 0, 0.5);
        content: " ";
        z-index: 1200;
        display: none;
    }
    .showmod {
        visibility: visible;
        transform: translateY(0);
    }

    #panel-item {
        font-size: 1rem;
    }
    #panel-barcode {
        padding-top: 0px;
    }

    .panel-header {
        border-bottom: 1px solid whitesmoke;
        height: 60px;
        background-color: whitesmoke;
        margin-bottom: 10px;
        padding: 0px 10px 0px 15px;
    }

    .panel-body {
        height: auto;
        max-height: calc(100vh - 100px);
        overflow-y: auto;
        padding: 0px 15px 5px 15px;
    }
    .panel-footer {
        height: 60px;
        /* background-color: darkslategrey; */
        color: black;
        align-items: center;
        padding: 0px 10px 0px 15px;
        cursor: pointer;
    }

    .panel-footer p {
        color: red;
    }

    .panel-header .txt2{
        font-size: 26px;
    }

    .mobile-compname {
        font-size: 13px;
        word-break: break-word;
    }

    .orderset21 {
        position: absolute;
        top: 5px;
        width: 100%;
        height: 50vh;
    }

    .custordersection4 {
        width: 100%;
    }

    .custhgt1 {
        padding-top: 6px;
        padding-bottom: 6px;
        height: 61% !important;
    }

    .mobile-cart-font {
        font-size: 0.8rem;
    }

    .mobile-address {
        font-size: 1rem;
    }

    .orderset29 {
        color: var(--text-color-8);
        font-size: 10px;
        padding-right: 4px;
        line-height: 12px;
    }

    .close-cart{
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 13px;
        height: 5%;
        font-weight: 600;
    }

    .mobile-branch-name .fa-store{
        padding-right: 6px;
    }

    [dir="rtl"] .mobile-branch-name .fa-store{
        padding-left: 6px;
    }

    [dir="rtl"] .mobile-branch-name{
        padding: 0 3px 5px 15px;
    }

    .orderset7 .fa-location-dot{
        padding-right: 16px;
    }
}

@media only screen and (max-width: 396px) {
    .item {
        font-size: 0.85rem;
        font-weight: 600;
        color: #000000;
    }

    .order-mobile-set2 {
        height: 85px;
        font-size: 10px;
        padding-top: 12px;
    }
    .mob-itemname {
        height: 40px;
        margin-top: 3px;
    }
    .mobile-branch-name,
    .mobile-address {
        font-size: 0.8rem;
    }

    .mobile-branch-name .fa-store{
        padding-right: 6px;
    }

    .orderset7 .fa-location-dot{
        padding-right: 16px;
    }

    .addtocart {
        /* background: linear-gradient(to right, black 50%, white 50%); */
        background-size: 200% 100%;
        background-position: right bottom;
        /* transition: all 0.5s ease-out; */
        margin-left: auto;
        border-radius: 5px;
        border: 1px solid #30425a;
        padding: 5px 10px 5px 10px !important;
        height: 2.3rem;
        width: 100%;
    }
    .mobile-cart-font {
        font-size: 0.9rem;
    }
}

@media only screen and (max-width: 400px) {
    .item {
        font-size: 0.8rem;
        font-weight: 500;
    }

	.spice-div{
		font-size: 12px;
	}

    .changeoutlet {
        font-size: 0.7rem;
    }

    .order-mobile-set2 {
        height: 43px;
        font-size: 12px;
    }

    .mobile-compname {
        font-size: 1.4rem;
    }
    .mob-itemname {
        height: 40px;
        padding-top: 8px;
    }
    .mobile-branch-name,
    .mobile-address {
        font-size: 0.8rem;
		display: flex;
		align-items: center;
		justify-content: center;
    }
    .amt {
        font-size: 12px;
    }

    .footer-font {
        font-size: 15px;
    }

    .mobile-cart-font {
        font-size: 0.8rem;
    }
}
#sidebarmobile a {
    padding: 1px;
    display: block;
    color: black;
}

#sidebarmobile ul li a:hover {
    color: #7386d5;
    background: #fff;
}

#content {
    width: 100%;
    padding: 20px;
    min-height: 100vh;
    transition: all 0.3s;
}

#fixedbutton {
    position: fixed;
    bottom: 100px;
    right: 37px;
    width: 90px;
    border-radius: 12px;
    height: 50px;
    z-index: 10;
    border: none;
    background-color: #ff5959;
    color: #ffffff;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

#closemobilemenu {
   position: fixed;
    bottom: 90px;
    right: 40px;
    width: 97px;
    border-radius: 12px;
    height:57px;
    z-index: 1063;
    border: none;
    background-color: #ff5959;
    color: #ffffff;
}

#sidebar {
    width: 100%;
    color: #fff;
    transition: all 0.3s;
}

#sidebar.active {
    margin-left: -250px;
}

#sidebar .sidebar-header {
    padding: 20px;
    background: #6d7fcc;
}

#sidebar ul p {
    color: black;
    padding: 1px;
}

#sidebar ul li a {
    padding: 10px;
    font-size: 1.1em;
    display: block;
    color: #999;
    margin-bottom: 7px;
}

#sidebar ul li a:hover {
    color: #7386d5;
    background: #fff;
}

.header-li {
    border-bottom: 1px solid rgb(243, 243, 243);
}

a[data-toggle="collapse"] {
    position: relative;
}

.dropdown-toggle::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    display: none;
}

ul ul a {
    font-size: 0.9em !important;
    padding-left: 30px !important;
}

h5 {
    color: black;
}

.sidemenu {
    color: #999;
}

.sidemenu p:hover {
    background-color: rgb(46, 45, 45);
    color: blue;
}
a:hover {
    text-decoration: none;
}
.font-size-12 {
    font-size: 12px;
}

p {
    margin-bottom: 0px;
}

.selected-dept {
    background-color: rgb(46, 45, 45);
    font-weight: 600;
}

.selected-menu {
    color: blue;
    font-weight: 600;
    border-bottom: 2px solid blue !important;
    background-color: white;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 14px 16px;
    transition: 0.3s;
    font-size: 17px;
}

.tab {
    overflow: hidden;
}

.qtyinput {
    border-left: 0px;
    border-right: 0px;
}

.qtyinput:focus {
    outline: none;
    box-shadow: none;
}
.readonly {
    background-color: white;
}

.readonly,
.readonly:focus {
    outline: none;
    border: none;
    box-shadow: none;
}
.custorderselect {
    border-top: 0px;
    border-right: 0px;
    border-left: 0px;
    border-bottom: 0px;
    text-align: center;
    width: 20%;
}

.custorderselect:focus {
    outline: none;
}

.custorderaddr1 {
    text-align: center;
    margin-left: 30px;
    width: 15%;
}

.menuclose p {
    color: var(--text-color-5) !important;
}

.addtocart {
    background-color: var(--bg-color-3);
    color: var(--text-color-3);
    background-size: 200% 100%;
    background-position: right bottom;
    /* transition: all 0.5s ease-out; */
    margin-left: auto;
    border-radius: 0.6rem;
    border: 1px solid var(--border-color-2);
    padding: 3px 20px 3px 20px;
}

.addtocart:focus {
    outline: none !important;
    box-shadow: none !important;
}

.addtocart:hover {
    background-position: left bottom;
}

.addtocart:disabled {
    opacity: initial;
}

#clearcart:focus {
    outline: none !important;
    box-shadow: none !important;
}

.cart-info-show {
    color: black;
    text-align: center;
    font-weight: 600;
    background-color: #f1e342;
}

.badge {
    padding-left: 9px;
    padding-right: 9px;
    -webkit-border-radius: 9px;
    -moz-border-radius: 9px;
    border-radius: 9px;
}

.label-warning[href],
.badge-warning[href] {
    background-color: #c67605;
}

.lblCartCount {
    font-size: 13px;
    background: #ff5959;
    color: #fff;
    padding: 4px 6px;
    position: absolute;
    top: 0;
    right: 2px;
}

.offer-bg{
	width: 75px;
    height: 26px;
    border-radius: 7px;
    text-align: center;
    position: absolute;
    top: 7px;
    left: 11px;
    z-index: 0;
    font-size: 10px;
    color: white;
    display: flex;
    padding: 3px 0;
    background-size: 100%;
    background: linear-gradient(to right, #ffff00, #ffff00);
    /* background: linear-gradient(to right, #fffc77, #f0ff09); */
    align-items: center;
    justify-content: center;
    color: black;
    box-shadow: 1px 0px 20px 0px #343a40, 0px 0px 0px #ff2929;
}

.offer-bg span{
    font-size: 12px;
}

/* promotional banner */
.promotional-banner{
    margin-top: 50px;
    margin-bottom: 10px;
    position: relative;
    overflow: hidden;
}

.promotional-banner .carousels-inner{
    display: flex;
    transition: transform 0.5s ease;
}

.promotional-banner .carousels-inner:hover{
    cursor: pointer;
}

.promotional-banner .carousels-inner img{
    width: 100%;
    height: clamp(20rem,46vh,39rem);
    flex-shrink: 0;
	border-radius: 20px;
}

.promotional-banner button{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    color: white;
    font-size: 30px;
    cursor: pointer;
    padding: 10px 15px;
    height: 100%;
    width: 70px;
}

.promotional-banner .banner-prev{
    /* left: 10px; */
    background: linear-gradient(to right, #ffffff21, #ffffff00);
}

.promotional-banner .banner-next{
    right: 0px;
    background: linear-gradient(to left, #ffffff21, #ffffff00);
}

/* Round style category  */
.round-category-md{
    position: relative;
    padding: 20px 0 60px;
}

.round-category-md .header{
    color: var(--text-color-5);
    padding: 60px 0 50px 26px;
    font-size: 26px;
	text-transform: capitalize;
}

.round-category-md .category-list{
    display: flex;
    overflow: hidden;
	flex-wrap: wrap;
}

.round-category-md .category-list .list-element{
	/* flex: 0 0 214px; */
	text-align: center;
	padding: 0 21px;
	cursor: pointer;
	margin: 12px;
	width: 180px;
}

.round-category-md .category-list .img-div{
    width: 115px;
    height: 115px;
    overflow: hidden;
    border-radius: 50%;
}

.round-category-md .category-list .img-div img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    top: 0;
    left: 0;
}

.round-category-md .category-list .cat-name{
    font-size: 17px;
    color: var(--text-color-1);
    padding-top: 23px;
	justify-content: center;
	text-transform: uppercase;
}

.deals-items{
	position: relative;
}

.deals-section{
	padding: 20px 20px 90px;
}

.deals-section h4{
	color: var(--text-color-5);
    padding: 0px 0 50px 1px;
    font-size: 26px;
    text-transform: capitalize;
}

.deals-div {
    display: flex;
    width: 100%;
    max-width: 100%;
	overflow: hidden;
}

.deals-div .deals-li {
	flex: 0 0 25%;
    box-sizing: border-box;
    padding-right: 25px;
	/* scroll-snap-align: start; */
}

.deals-div img {
	width: 100%;
	height: auto;
    border-radius: 20px;
    display: block;
}

/* @media (min-width: 1200px) {
    .deals-div .deals-li {
        flex: 0 0 20%;
    }
} */


.promotional-items{
    margin-bottom: 30px;
}

.promotional-items .rows{
    display: flex;
    position: relative;
}

.promotional-items .scroll-container{
    display: flex;
    overflow: hidden;
    width: 100%;
	padding: 0;
}

.promotional-items .browse{
    display: flex;
    color: white;
    justify-content: space-between;
    align-items: center;
    text-transform: uppercase;
    padding-bottom: 20px;
}

.promotional-items .browse .header{
    font-size: 26px;
    font-weight: 700;
    color: var(--text-color-5);
    padding: 4px 15px 4px 13px;
}

.round-category-md .slideleft,
.round-category-md .slideright,
.promotional-items .slideleft,
.promotional-items .slideright,
.deals-items .slideleft,
.deals-items .slideright{
    position: absolute;
    color: black;
    display: flex;
    align-items: center;
    width: 48px;
    z-index: 1;
    top: 50%;
    height: 48px;
    justify-content: center;
    border-radius: 50%;
    box-shadow: 0px 4px 8px rgb(10 8 26 / 42%);
    transform: translate(-50%,-50%);
    background: #ffffff;
    font-size: 20px;
    cursor: pointer;
}

.round-category-md .slideleft,
.promotional-items .slideleft ,
.deals-items .slideleft{
    left: 0;
}

.round-category-md .slideright,
.promotional-items .slideright ,
.deals-items .slideright{
    right: -50px;
}

/* -------------------------------------------------------- Customer address page ----------------------------------------------------------- */

/* customer profile default toggle bar start */

#flashmsg-address {
    position: fixed;
    bottom: 5%;
    left: 50%;
    z-index: 999;
    transform: translate(-50%);
    box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.2);
    padding: 15px 45px 15px 45px;
}

.flashmsg-address-icon {
    position: absolute;
    bottom: 20%;
    right: 5%;
    z-index: 999;
}

.flashmsg-address-icon {
    cursor: pointer;
}

#del_time_minutes{
    padding-left: 3px;
}

#flashmsg-appx-time {
    position: fixed;
    top: 74px;
    right: 34px;
    z-index: 1031;
    box-shadow: 0 5px 12px 0 rgb(0 0 0 / 20%);
    padding: 2px 28px 2px 9px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.flashmsg-appx-time-icon {
    position: absolute;
    bottom: 10%;
    right: 3%;
    z-index: 999;
    display: flex;
}

.flashmsg-appx-time-icon {
    cursor: pointer;
}

.switch-profile {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 20px;
}
.switch-profile input {
    opacity: 0;
    width: 0;
    height: 0;
}

.slider-profile {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

.slider-profile:before {
    position: absolute;
    content: "";
    height: 16px;
    width: 16px;
    left: 2px;
    bottom: 2px;
    background-color: white;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

input:checked + .slider-profile {
    background-color: #2196f3;
}

input:focus + .slider-profile {
    box-shadow: 0 0 1px #2196f3;
}

input:checked + .slider-profile:before {
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
}

.slider-profile.round {
    border-radius: 34px;
}

.slider-profile.round:before {
    border-radius: 50%;
}

/* customer profile default toggle bar end */

.default-address {
    box-sizing: border-box;
    appearance: none;
    background: white;
    outline: none;
    border: 3px solid white;
    width: 16px;
    height: 16px;
    margin-right: 5px;
}

.default-address:checked {
    background: rgb(32, 36, 235);
}

.inputGroup {
    background-color: whitesmoke;
    display: block;
    margin: 10px 0;
    position: relative;
    border-radius: 10px;
}
.inputGroup .circle {
    padding: 12px 30px;
    width: 100%;
    display: block;
    text-align: left;
    color: #3c454c;
    cursor: pointer;
    position: relative;
    z-index: 2;
    -webkit-transition: color 200ms ease-in;
    transition: color 200ms ease-in;
    overflow: hidden;
}

[dir="rtl"] .inputGroup .circle{
    display: flex;
}

.inputGroup .circle:before {
    width: 2%;
    height: 10px;
    border-radius: 50%;
    content: "";
    background-color: #cdf2fb;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) scale3d(1, 1, 1);
    transform: translate(-50%, -50%) scale3d(1, 1, 1);
    -webkit-transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);
    transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);
    opacity: 0;
    z-index: -1;
}
.inputGroup .circle:after {
    width: 32px;
    height: 32px;
    content: "";
    border: 2px solid #d1d7dc;
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.414 11L4 12.414l5.414 5.414L20.828 6.414 19.414 5l-10 10z' fill='%23fff' fill-rule='nonzero'/%3E%3C/svg%3E ");
    background-repeat: no-repeat;
    background-position: 2px 3px;
    border-radius: 50%;
    z-index: 2;
    position: absolute;
    right: 30px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    cursor: pointer;
    -webkit-transition: all 200ms ease-in;
    transition: all 200ms ease-in;
}

[dir="rtl"] .inputGroup .circle:after{
    left: 30px;
    right: unset;
}

.inputGroup .demo-text {
    padding: 12px 30px;
    width: 100%;
    display: flex;
    align-items: center;
    text-align: left;
    color: #3c454c;
    position: relative;
    z-index: 2;
    -webkit-transition: color 200ms ease-in;
    transition: color 200ms ease-in;
    overflow: hidden;
}

.inputGroup .demo-msg {
    color: red;
    margin-left: auto;
}

.inputGroup input:checked ~ label {
    color: #000000;
}
.inputGroup input:checked ~ label:before {
    -webkit-transform: translate(-50%, -50%) scale3d(56, 56, 1);
    transform: translate(-50%, -50%) scale3d(56, 56, 1);
    opacity: 1;
}
.inputGroup input:checked ~ label:after {
    background-color: #54e0c7;
    border-color: #54e0c7;
}
.inputGroup input {
    width: 32px;
    height: 32px;
    -webkit-box-ordinal-group: 2;
    order: 1;
    z-index: 2;
    position: absolute;
    right: 30px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    cursor: pointer;
    visibility: hidden;
}

.switch {
    position: relative;
    width: 60px;
    height: 34px;
}
.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

.slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

input:checked + .slider {
    background-color: #2196f3;
}

input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

.slider.round {
    border-radius: 34px;
}

.slider.round:before {
    border-radius: 50%;
}

/* Customer header */
.header-bg{
    background-color: white;
}

.custaddsection1 {
    height: 95px;
    display: flex;
    align-items: center;
    background-color: #ffffff;
    border-top: 1px solid lightgray;
    box-shadow: 0 4px 6px -2px rgba(128, 128, 128, 0.5);
}

.custaddsection1 #pp-drop{
    display: flex;
    align-items: center;
}

.custaddsection1 #pp-drop h5{
    color: black;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 150px;
    padding-right: 10px;
    font-size: 16px;
}

.custaddsection1 #pp-drop .fa-angle-down{
    color: #000000;
}

.custaddsection2 {
    margin-top: 105px;
    text-align: center;
    display: flex;
    justify-content: space-between;
    gap: 30px;
    padding: 30px 20px;
}

.custaddr1 {
    height: 78%;
    overflow: auto;
    padding: 0px 15px 0px 15px;
}
.custaddr2 {
    height: 10%;
}
.custaddr3 {
    height: 10%;
    border-bottom: 1px solid whitesmoke;
    display: flex;
    align-items: center;
    padding: 26px 5px;
    background-color: #e6e6e6;
}

.custaddr3 .headText{
    width: 50%;
    text-align:left;
    padding-left:10px;
}

.custaddr3 .headText p{
    font-size: 28px;
}

.custaddr3 .bkmenu{
    width:50%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.custaddr3 .bkmenu a{
    padding: 1px 6px 1px 6px;
    margin-right:5px;
    color: #ff5959;
}

.custaddr4 {
    height: 10%;
    background-color: #ff5959;
    color: white;
    align-items: center;
    box-shadow: 0px 0 7px rgba(0, 0, 0, 0.8);
    display: flex;
    padding: 0 20px;
}

.custaddr5 {
    height: 5%;
    border-bottom: 1px solid whitesmoke;
    text-align: left;
    padding-left: 15px;
}

.custaddr6 {
    display: none;
}
.custaddsection3 {
    width: 60%;
    height: 100%;
}

.custaddsection4 {
    width: 100%;
    min-height: 15%;
    display: flex;
    align-items: center;
    margin-bottom: 17px;
    justify-content: space-between;
}

.custaddsection4 button{
    padding: 3px 16px;
    font-size: 1rem;
    border-radius: 9px;
    border: 1px solid #ff5959;
    padding: 10px 20px;
    background-color: white;
    color: #ff5959;
}

.custaddsection5 {
    width: 100%;
    min-height: 40px;
}

.custaddsection5::-webkit-scrollbar {
    display: none;
    -ms-overflow-style: none;
}

.custaddsection6 {
    width: 38%;
    height: calc(100vh - 150px);
    padding: 0px 0px 0px 0px;
    border-left: 1px solid whitesmoke;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: 10px;
    box-shadow: 0 0 10px rgb(0 0 0 / 20%);
}

.custaddsection6 .cart-size{
    font-size: 11px !important;
    color: #999999;
    text-transform: lowercase;
}

.custaddsection7 {
    margin-top: 15px;
    border-radius: 10px;
    box-shadow: 0 0 10px rgb(0 0 0 / 20%);
}

.custaddsection7 .card{
    padding: 30px 20px 40px;
}

.custaddsection8 {
    margin-top: 20px;
}

.custaddsection9 {
    margin-top: 20px;
    height: 20px;
    padding-bottom: 80px;
}

.custaddsection10 {
    margin-bottom: 10px;
    display: flex;
    align-items: center;
}

.custaddsection11 {
    margin-bottom: 0px;
    margin-top: 0px;
    height: auto;
    width: 100%;
    text-align: left;
    padding: 30px 20px 40px;
    border-radius: 10px;
    box-shadow: 0 0 10px rgb(0 0 0 / 20%);
}

.custaddr1 .tr{
    display: flex;
    padding: 8px 5px;
    align-items: center;
}

.custaddr1 .tr .tr-div{
    width: 54%;
    /* display: flex; */
    align-items: center;
    justify-content: flex-start;
}


.custaddr1 .tr .tr-div p {
    font-size: 13px;
    line-height: 16px;
    text-align: left;
}

[dir="rtl"] .custaddr1 .tr .tr-div p{
    text-align: right;
}

.custaddr1 .itemname{
    text-transform: capitalize;
}

.card-content {
    border: 1px solid #ccc;
    border-radius: 10px;
    padding: 20px;
    text-align: left;
    height: 100%;
}

.card-content .cust-name{
    font-size: 14px;
    font-weight: 600;
    padding-bottom: 6px;
}

.card-content * {
    cursor: pointer;
}

[dir="rtl"] .card-content p{
    text-align: right;
}

.card-wrapper {
    position: relative;
    width: 100%;
    height: fit-content;
    float: left;
    margin-right: 0px;
    padding: 6px 0px 6px 0px;
    margin-bottom: 15px;
}

.unavailable .blank{
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
    width: 100%;
    height: 100%;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    text-align: center;
    z-index: 2;
    pointer-events: none;
}

.c-card {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    visibility: hidden;
}
.c-card ~ .card-content {
    transition: all 500ms ease-out;
}

.card-content-selected {
    position: absolute !important;
    top: 3px !important;
    right: -2px !important;
    z-index: 0 !important;
    width: 59px !important;
    height: 52px !important;
    background-position: 0 0;
    border-radius: 10px;
    transition: all 100ms ease-out !important;
    background: linear-gradient(to top right, #f5f5f500 0%, #f5f5f500 50%, #ff5959 53%, #ff5959 100%) !important;
}

.card-selected1 {
    border: 1px dotted blue;
}
.card-state-icon {
    position: absolute;
    top: 6px;
    right: 6px;
    z-index: 0;
    width: 54px;
    height: 52px;
    background-position: 0 0;
    transition: all 100ms ease-out;
    background: linear-gradient(
        to top right,
        #f5f5f500 0%,
        #f5f5f500 50%,
        #0000ff00 53%,
        #0000ff00 100%
    );
}

.card-content {
    /* border-top: 1px solid lightgrey;
    border-bottom: 1px solid lightgrey;
    border-left: 1px solid lightgrey;
    border-right: 1px solid lightgrey; */
    background-color: white;
}

#addressmodal label {
    padding-top: 7px;
}

.self-textarea {
    width: 100%;
}

#errormsg {
    height: 30px;
    margin-bottom: 5px;
}

#confirmorder {
    background-color: #ff5959;
    color: white;
    height: 60px;
}

#confirmorder:focus {
    outline: none;
    box-shadow: none;
}

.address-toggle {
    font-size: 24px;
}

.cart-payamt-text {
    width: 50%;
    font-size: 20px;
    text-align: left;
    font-weight: 600;
    display: flex;
    justify-content: flex-start;
}

.cart-payamt {
    width: 50%;
    text-align: right;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.cart-text1 {
    font-size: 20px;
    color: #ffffff;
    padding-right: 5px;
    font-weight: 600;
}

.cust-addr-text1 {
    font-size: 22px;
}

.suggestion-text {
    padding-bottom: 30px;
    font-size: 24px;
}

.error-bg {
    box-shadow: inset 0 -40px 0 -1px red !important;
    color: white !important;
}

.custaddsection12 {
    margin-top: 15px;
    padding: 25px 20px;
    border-radius: 10px;
    box-shadow: 0 0 10px rgb(0 0 0 / 20%);
}

#addressmodal input:focus,
#addressmodal select:focus {
    outline: none;
    box-shadow: none;
}

#editaddressmodal input:focus,
#editaddressmodal select:focus {
    outline: none;
    box-shadow: none;
}

.delv-radio {
    padding-left: 0px;
}

.dot {
    height: 15px;
    width: 15px;
    border-radius: 50%;
    display: inline-block;
    margin-right: 8px;
    margin-left: 8px;
}

.status {
    border-radius: 5px;
    margin-bottom: 0px;
    font-size: 13px;
    padding: 1px 4px 1px 4px;
    display: flex;
    align-items: center;
}

.qtyerror {
    cursor: pointer;
}

.custadd-deladdr {
    font-size: 24px;
}

.modifier-span-list{
    font-size: 11px !important;
    line-height:1;
    color:#999;
}

.modifier-span-list span:not(:last-child)::after{
    content: ", ";
}

.custadd-payment {
    font-size: 24px;
    text-align: left;
}

.custaddr6 p {
    font-size: 24px;
    padding-left: 10px;
}

.terms_condition{
    margin-left: 15px;
}

.terms_condition label{
    padding-left: 7px;
}

.policy_error{
    margin-left: 35px;
}

.policy_error p {
    color: red;
}

.rl{
    height: auto;
    background-color: white;
    padding: 20px;
    text-align: left;
    box-shadow: 0 0 10px rgb(0 0 0 / 20%);
}

.rl-h3{
    font-size: 24px;
}

.rl .tgr-btn{
    background-color: #ff5959;
    color: white;
    font-size: 18px;
    height: 60px;
    margin-top: 37px;
    border-radius: 5px;
}

.rl-button-group{
    margin-top: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.rl-old{
    border : 1px solid #bc906b;
    color: #bc906b;
    text-align: center;
    padding: 10px 60px;
    margin-right: 30px;
    cursor: pointer;
}

.rl-old .old11,.rl-new .old11{
    font-size: 13px;
    letter-spacing: 0.9px;
}

.rl-old .old12,.rl-new .old12{
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.9px;
}

.rl-new{
    background-color: #bc906b;
    color: white;
    padding: 10px 60px;
    text-align: center;
    cursor: pointer;
}

.rl-old:hover,.rl-new:hover{
    box-shadow: 0 0 10px rgb(0 0 0 / 20%);
}

.lg-div{
    display: flex;
    flex-direction: column;
}

.lg-mn{
    width: 350px;
}

.lg-change{
    margin-top: 15px;
    margin-bottom: 15px;
}

.lg-div-input{
    border: 1px solid lightgray;
    height: 50px;
    padding: 8px 17px;
    margin-bottom: 10px;
}

.lg-rmfg{
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #bc906b;
}

.lg-rmfg .lg-rmb{
    color: #bc906b;
    cursor: pointer;
}

.lg-rmfg .lg-rmb:hover{
    font-weight: 600;
}

.lg_ext,.sign-ext,.fp_ext,.rqt-otp{
    width: 100%;
    background: #bc906b;
    color: white;
    margin-top: 15px;
    padding: 11px;
}

.lg_ext:hover,.fp_ext:hover{
    box-shadow: 0 0 10px rgb(0 0 0 / 20%);
}

.lgotp-div{
    width: 350px;
}

.lgotp-input-div{
    display: flex;
    flex-direction: column;
}

.lg-rmfg span .rm{
    padding-left: 3px;
}

.usepwd{
    text-align: center;
    color: #bc906b;
    padding: 7px;
    cursor: pointer;
}

.lg-change-clr{
    color: #bc906b;
    cursor: pointer;
}

.sign-div-input{
    border: 1px solid lightgray;
    height: 50px;
    padding: 8px 17px;
    margin-bottom: 10px;
    width: 100%;
}

.sign-s{
    width: 73px;
}

.sign-s1{
    width: calc(350px - 73px);
}

.sign-p1{
    padding-left:5px;
}

.sign_mb{
    display: flex;
}

.t-c{
    text-decoration: underline;
    color: #418ca5;
    cursor: pointer;
}

#privacypolicyModal{
    z-index: 1300;
}

#privacypolicyModal p{
    padding: 10px 0;
}

#privacypolicyModal .heading{
    font-weight: 600;
}

#privacypolicyModal h2{
    padding: 20px 0;
}

#privacypolicyModal .modal-dialog{
    max-width: 60%;
}

#privacypolicyModal .modal-body{
    padding: 24px 45px;
    height: 70vh;
    overflow: auto;
}

.fp-mn{
    width: 350px;
}

.fp-change{
    margin-top: 15px;
    margin-bottom: 15px;
}

.fp-change-clr{
    color: #bc906b;
    cursor: pointer;
}

.fp-div{
    display: flex;
    flex-direction: column;
}

.fp-div-input{
    border: 1px solid lightgray;
    height: 50px;
    padding: 8px 17px;
    margin-bottom: 10px;
}

.r_relative{
    position: relative;
}

.r_relative .p-viewer{
    position: absolute;
    right: 25px;
    top: 15px;
    cursor: pointer;
}

#lgotp-mobile-error{
    color: red;
    text-align: center;
}

.otpEn{
    width: 350px;
}

.otpEn .otp-header{
    font-size: 20px;
    margin-bottom: 10px;
}

.otpEn .otp-subheader{
    font-size: 15px;
    margin-bottom: 5px;
}

.otpEn .otpinput,.lgotp-div .otpinput{
border: none;
   width: 6ch;
   background:  repeating-linear-gradient(90deg, dimgrey 0, dimgrey 1ch, transparent 0, transparent 1.5ch) 0 100%/100% 2px no-repeat;
   color: dimgrey;
   letter-spacing: 0.5ch;
   font: 4ch consolas, monospace;
   margin: auto;
   display: flex;
   align-items: center;
   justify-content: center;
   height: 50px;
}

.r_comman_error{
    padding: 10px;
    text-align: center;
    color: red;
}

.r_otp_errors{
    padding: 15px;
    color: red;
    text-align: center;
}

.lg-error{
    text-align: center;
}

.lg-error p{
    padding: 1px 10px;
    color: red;
    font-size: 15px;
}
.otpEn .otp-resend{
    font-size: 14px;
    color: #bc906b;
    cursor: pointer;
    display: none;
}

.otpEn .otp-expire{
    padding-top: 10px;
}

.lgotp{
    width: 100%;
    color: black;
    padding: 11px;
    border :1px solid black;
}

.lgotp:hover{
    background-color: hsla(225,3%,73%,.08);
    border-color: #b9babd;
}

#email_send_msg,#user_not_found_msg{
    color:red;
    padding-top: 10px;
    text-align: center;
    font-size: 14px;
}

.mobile-addresscontainer{
    background-color: #f6faff;
}

.signin:hover{
    font-weight: 600;
}

.addr-mobile-body{
    background-color: var(--bg-color-2);
}

/* footer */
.footer{
    background-color: #393f52;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    text-align: center;
    position: relative;
    padding: 3.5rem 2.5rem 5.5rem;
    border-top: 1px solid black;
}

.footer ul{
    list-style: none;
    padding-bottom: 30px;
}

.footer ul li{
    display: inline-block;
    padding: 0 4.8rem;
}

.footer ul li a{
    text-decoration: none;
    color: #ffffff;
    text-transform: capitalize;
}

.footer ul li a:hover{
    text-decoration: underline;
}

.footer .socialmedia-handles ul li{
    padding: 0 2rem;
}

.footer .reserved{
    color: #ffffff;
}

.footer .footer-info-tab{
	color: white;
    max-width: 830px;
    text-align: center;
    padding: 10px;
    align-items: center;
    margin: auto;
    padding-bottom: 25px;
	font-size: 14px;
	color: #beb8b8;
}

.footer .footer-comman-options{
    display: flex;
    justify-content: center;
}

.footer .footer-comman-options ul li {
    padding : 0 3.8rem;
}

/* Store locations */
.storeLocationDiv{
    margin-top: 150px;
    background-color: white;
    padding: 50px 120px;
    height: calc(100vh - 150px);
    margin-bottom: 100px;
}

.storeLocationDiv .header{
    padding-bottom: 32px;
    font-weight: 600;
}

.storeLocationDiv .content{
    display: flex;
    gap: 30px;
}

.storeLocationDiv .details{
    flex: 1;
    height: calc(100vh - 210px);
    overflow: auto;
    padding: 20px;
    background-color: whitesmoke;
    border-radius: 10px;
}

.storeLocationDiv .store-detail{
    box-shadow: 0 0 10px rgb(0 0 0 / 20%);
    border-radius: 10px;
    padding: 15px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 15px;
    background-color: white;
}

.storeLocationDiv .store-detail img{
    border-radius: 10px;
}

.storeLocationDiv .store-detail .sub-detail{
    padding-left: 18px;
}

.storeLocationDiv .store-detail .br-name{
    font-size: 15px;
    font-weight: 600;
}

.storeLocationDiv .store-detail .del{
    font-size: 14px;
    padding-top: 7px;
}

.storeLocationDiv .store-detail .hours{
    font-size: 14px;
    padding-top: 4px;
    color: #ff5959;
    font-weight: 600;
}

.storeLocationDiv .map{
    width: 630px;
    height: calc(100vh - 210px);
}

.storeLocationDiv #map{
    width: 100%;
    height: 100%;
    border-radius: 10px;
    box-shadow: 0 0 10px rgb(0 0 0 / 20%);
}

/* about Us */
.aboutusDiv{
    margin-top: 150px;
    padding: 30px 200px 100px;
}

.aboutusDiv .watermark,
.tcDiv .watermark{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    pointer-events: none;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
    opacity: 0.04;
}

.aboutusDiv .h1block{
    display: flex;
    justify-content: center;
}

.aboutusDiv .heading1{
    padding-bottom: 15px;
    font-weight: 600;
    padding-top: 25px;
    justify-content: center;
    display: inline-block;
    border-bottom: 1px solid #ff5959;
    margin-bottom: 30px;
}

.aboutusDiv .heading2{
    align-items: center;
    justify-content: center;
    padding-bottom: 30px;
    padding-top: 20px;
}

.aboutusDiv .heading3{
    align-items: center;
    justify-content: center;
    padding-bottom: 30px;
    padding-top: 30px;
}

.aboutusDiv .text1,
.aboutusDiv .text2,
.aboutusDiv .text3,
.aboutusDiv .text4{
    text-align: center;
    font-size: 15px;
    padding-bottom: 30px;
}

/* terms and condition */
.tcDiv{
    margin-top: 130px;
    padding: 100px 200px;
}

.tcDiv .h1block{
    display: flex;
    justify-content: center;
}

.tcDiv h2{
    padding-bottom: 15px;
    font-weight: 600;
    padding-top: 25px;
    justify-content: center;
    display: inline-block;
    border-bottom: 1px solid #ff5959;
    margin-bottom: 30px;
}

.tcDiv .heading{
    padding: 20px 0;
    font-size: 15px;
    font-weight: 600;
}

.tcDiv p{
    line-height: 2.5;
}

/* contact Us */
.contactUsDiv{
    margin-top: 170px;
    padding: 0px 80px 40px;
}

.contactUsDiv .h1block{
    display: flex;
    justify-content: center;
}

.contactUsDiv h3{
    padding-bottom: 15px;
    font-weight: 600;
    padding-top: 25px;
    justify-content: center;
    display: inline-block;
    border-bottom: 1px solid #ff5959;
    margin-bottom: 0px;
}

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

.contactUsDiv .imgDiv{
    flex: 0 0 40%;
}

.contactUsDiv .cnDiv{
    flex: 1;
    padding: 0 120px;
}

.contactUsDiv label{
    padding: 12px 0px;
}

.contactUsDiv input[type="text"]{
    text-transform: capitalize;
}

.contactUsDiv button{
    color: white;
    margin-top: 25px;
    padding: 15px 0;
    font-size: 17px;
    border-radius: 10px;
    background-color: #ff5959;
}

.contactUsDiv .msg div{
        padding: 10px 0;
        text-align: center;
        font-weight: 600;
}

.contactUsDiv .msg .ss{
    color: green;
}

.contactUsDiv .msg .err{
    color: red;
}

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

    .contactUsDiv .imgDiv{
        display: none;
    }

    .contactUsDiv .cnDiv{
        padding: 0 20px;
    }

    .contactUsDiv{
        padding: 0px 10px 40px;
        margin-top: 130px;
    }

    .tcDiv{
        margin-top: 50px;
        padding: 90px 50px;
        text-align: justify;
    }

    .aboutusDiv{
        padding: 10px 50px 100px;
        margin-top: 125px;
    }

    .storeLocationDiv{
        padding: 10px 0;
        height: auto;
        margin-top: 115px;
        margin-bottom: 10px;
    }

    .storeLocationDiv .content{
        flex-direction: column;
    }

    .storeLocationDiv .map{
        width: 100%;
        padding: 0 20px;
        border-radius: 0;
    }

    .storeLocationDiv .details{
        border-radius: 0;
        background-color: white;
    }

    .storeLocationDiv .header{
        padding: 20px;
    }

    .storeLocationDiv #map{
        border-radius: 0;
    }

    .footer{
        background-color: #393f52;
        border-top: 1px solid #c7c7c7;
        gap: 1rem;
        padding: 25px;
        padding-bottom: 180px;
    }

    .footer ul{
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .footer ul li{
        display: block;
        padding: 0 10px;
    }

    .footer .footer-comman-options ul li{
        padding: 0 12px;
    }

	.tabbed-menu{
		gap: 2px;
	}

    .footer a{
        font-size: 12px;
    }

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

	.tabbed-menu .tab-item{
		font-size: 12px;
	}

    .footer .reserved{
        font-size: 12px;
    }

    .footer .footer-comman-options{
        display: block;
    }

    .addr-mobile-body .footer{
        padding-bottom: 60px;
    }
    .signin{
        font-size: 13px;
    }

    .inputGroup{
        border-radius: 10px;
    }

    .custaddsection5 .card-content{
        box-shadow: 1px 1px 6px rgba(18,18,18,.15);
        padding: 30px 20px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        border-radius: 10px;
    }

    #privacypolicyModal .modal-dialog{
        max-width: 80%;
    }

    #privacypolicyModal .modal-footer{
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .rl-h3{
        font-size: 17px;
        font-weight: 600;
    }

    .rl-old .old11,.rl-new .old11{
        font-size: 12px;
    }

    .rl-old,.rl-new{
        padding: 10px 20px;
    }

    .card-content-selected {
        right: 4px !important;
    }

    #flashmsg-address {
        position: fixed;
        bottom: 77%;
        left: 50%;
        z-index: 999;
        width: 100%;
        transform: translate(-50%);
        box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.2);
        padding: 15px 25px;
        font-size: 16px;
    }

    #flashmsg-address h6 {
        font-size: 13.6px;
    }

    .flashmsg-address-icon {
        position: absolute;
        top: 20%;
        right: 5%;
        z-index: 999;
    }

    #flashmsg-appx-time {
        position: fixed;
        top: 67px;
        right: 0;
        z-index: 999;
        width: 100%;
        box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.2);
        padding: 10px 25px;
        font-size: 16px;
    }

    #flashmsg-appx-time h6 {
        font-size: 13.6px;
    }

    .flashmsg-appx-time-icon {
        position: absolute;
        top: 20%;
        right: 5%;
        z-index: 999;
    }

    .status {
        border-radius: 5px;
        margin-bottom: 0px;
        font-size: 13px;
        padding: 1px 4px 1px 4px;
        display: block;
        align-items: center;
    }
    .delv-radio {
        padding-left: 15px;
    }

    .card-wrapper {
        padding: 6px 6px 6px 6px;
    }
    #addressmodal {
        top: 7px;
    }
    .suggestion-text {
        font-size: 1.3rem;
        padding: 10px;
        margin-bottom: 10px;

    }
    .cust-addr-text1 {
        font-size: 15px;
    }

    .cart-text1 {
        font-size: 15px;
        color: white;
        font-weight: 600;
    }

    .custaddr1 {
        height: 74%;
        overflow: auto;
        padding: 10px 8px 25px 8px;
    }

    .custaddsection1 {
        height: 60px;
        display: flex;
        align-items: center;
        padding: 0px 20px 0px 20px;
    }

    .custaddsection2 {
        margin-top: 52px;
        flex-direction: column;
        padding: 5px 0;
        gap: 10px;
    }

    .addr-mobile-body {
        background-color: whitesmoke;
    }

    #errormsg {
        display: none;
    }

    .error-bg {
        box-shadow: inset 0 -40px 0 -1px red !important;
        color: white !important;
    }

    .mobile-addresscontainer {
        padding: 0px;
        background-color: whitesmoke;
    }

    .mobile-item-style {
        text-transform: capitalize;
    }
    .cart-payamt-text {
        padding-left: 10px;
        font-size: 17px;
        color: #ffffff;
    }
    .coupon-icon{
        color: #ff5959;
    }

    .cart-payamt {
        font-size: 17px;
        padding-right: 10px;
    }

    .inputGroup .demo-text{
        padding: 12px 15px;
    }

    .inputGroup .circle{
        padding: 12px 15px;
    }

    .custaddr3 {
        display: none;
    }

    .custaddr6 {
        margin : 0px;
        display: flex;
        padding: 5px 0px;
        background-color: whitesmoke;
        align-items: center;
    }

    .custaddr6 .txt1{
        text-align: left;
    }

    .custaddr6 .txt2{
        text-align: right;
    }

    [dir='rtl'] .custaddr6 .txt1{
        text-align: right;
    }

    [dir='rtl'] .custaddr6 .txt2{
        text-align: left;
    }

    .custaddr6 p {
        font-size: 1.2rem;
        padding-left: 0;
    }

    .custaddr4 {
        padding: 4px 4px 4px 4px;
        background-color: #ff5959;
        font-weight: 600;
        color: white;
        height: 2.4rem;
        margin: 0px 13px;
        box-shadow: none;
        border-radius: 5px;
    }

    .custaddr5 {
        padding-left: 0px;
        border-bottom: 1px dotted whitesmoke;
    }
    .custaddsection3 {
        padding-left: 0px;
        width: 100%;
        order: 2;
    }

    .custaddsection6 {
        width: 100%;
        right: 0px;
        height: fit-content;
        position: unset;
        margin-top: 10px;
        margin-bottom: 0px;
        border-left: none;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        min-width: 0;
        border: none;
        word-wrap: break-word;
        background-color: #fff;
        background-clip: border-box;
        border-radius: 0px;
        padding: 0px 0px 30px 0px;
        order: 1;
        box-shadow: none;
    }

    .custaddsection6 .loyalty{
        padding: 0px 13px 20px 13px;
    }

    .custaddsection7 {
        width: 100%;
        position: relative;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        min-width: 0;
        word-wrap: break-word;
        background-color: #fff;
        background-clip: border-box;
        border-radius: 0px;
        padding: 0px;
        margin-top: 10px;
        margin-bottom: 0px;
    }

    .custaddsection7 .card{
        border-bottom: none;
    }

    .custaddsection8 {
        padding: 0px;
        margin-top: 3px;
    }
    .custaddsection9 {
        margin-top: 0px;
        width: 100%;
        height: 150px;
        margin-bottom: 0px;
        position: relative;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        min-width: 0;
        word-wrap: break-word;
        background-color: white;
        background-clip: border-box;
        border-radius: 0px;
        padding: 15px 10px 20px 10px;
    }

    .custaddsection10 {
        background-color: white;
    }

    .custaddsection11 {
        width: 100%;
        height: 160px;
        margin-bottom: 0px;
        margin-top: 0px;
        position: relative;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        min-width: 0;
        word-wrap: break-word;
        background-color: #fff;
        background-clip: border-box;
        border-radius: 0px;
        padding: 10px 10px 10px 10px;
        box-shadow: none;
    }

    .custaddsection12 {
        position: relative;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        min-width: 0;
        word-wrap: break-word;
        background-color: #fff;
        background-clip: border-box;
        border-radius: 0;
        padding: 20px 10px;
        margin-top: 10px;
        border-top: none;
        box-shadow: none;
    }
    .custadd-deladdr {
        font-size: 1.3rem;
        padding: 10px 10px 0px 10px;
        box-shadow: inset 0 0px 0 -1px red;
        transition: box-shadow 0.15s ease-in-out;
    }

    #confirmorder {
        background-color: #ff5959;
        height: 55px;
        font-weight: 600;
    }
    .address-toggle {
        font-size: 1.3rem;
    }

    .custadd-payment {
        font-size: 1.3rem;
        padding: 10px 10px;
        box-shadow: inset 0 0px 0 -1px red;
        transition: box-shadow 0.15s ease-in-out;
    }

    .inputGroup .demo-msg{
        text-align: right;
    }

    .inputGroup .demo-text img{
        display: none;
    }

    .inputGroup label:after {
        width: 20px;
        height: 20px;
        background-position: -4px -3px;
        background-image: url("data:image/svg+xml,%3Csvg width='32' height='24' viewBox='0 -5 36 35' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.414 11L4 12.414l5.414 5.414L20.828 6.414 19.414 5l-10 10z' fill='%23fff' fill-rule='nonzero'/%3E%3C/svg%3E ");
    }

    .self-textarea {
        width: 100%;
    }

    .switch {
        width: 46px;
        height: 20px;
    }

    .slider:before {
        height: 20px;
        width: 20px;
        left: 0px;
        bottom: 0px;
    }

    .cust-name {
        font-size: 1rem;
    }

    /* Customer header */
    .header-bg{
        background-color: #f7fbff;
        padding: 0;
    }

    .header-bg .footer{
        padding-bottom: 60px;
    }
}

@media only screen and (max-width: 396px) {
    .custadd-deladdr {
        font-size: 1.2rem;
    }

    .custadd-payment {
        font-size: 1.3rem;
    }

    .custaddaddress {
        font-size: 0.8rem;
    }

    .card-wrapper,
    .card-content {
        height: 130px;
    }

    .address-toggle {
        font-size: 1.1rem;
    }
}

@media only screen and (max-width: 400px) {
    .custadd-deladdr {
        font-size: 1.1rem;
    }

    .address-toggle {
        font-size: 0.9rem;
    }

    .custadd-payment {
        font-size: 1.1rem;
    }

    .custaddaddress {
        font-size: 0.7rem;
    }

    .card-wrapper,
    .card-content {
        height: 130px;
    }

    .actionButton{
        width: 4.3rem;
    }

    .amount-details .aed, .amount-details .amt{
        font-size: 11px;
    }

	.actionButton .minus-btn, .actionButton .plus-btn{
		padding: 2px 5px;
		font-size: 12px;
	}

	#panel-subAmount .actionButton{
		width: 6.3rem;
	}
}

.custprofilesection1 {
    height: 70px;
    position: fixed;
    top: 0;
    background-color: white;
    color: #5a5a5a;
    z-index: 100;
}

.custprofilesection2 {
    height: 45px;
    position: fixed;
    top: 94px;
    background-color: #ff5959;
    color: white;
    width: 100%;
    padding: 10px 20px 10px 20px;
    z-index: 100;
    box-shadow: 0 4px 6px -2px rgba(128, 128, 128, 0.5);
}
.custprofilesection2 .barlinks{
    display: flex;
    margin-right:16px;
    color:white;
    margin-left:9%;
    flex-direction:row;
}

.custprofilesection2 .nav-link {
    color: white !important;
    text-wrap: nowrap;
}

.custprofilesection3 {
    margin-top: 160px;
    padding: 20px 15%;
    width: 100%;
}

.custprofilesection3 .subhead{
    padding: 30px;
    background-color: #ffffff;
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: 0 0 10px rgba(128, 128, 128, 0.5);
}

.custprofilesection3 .subhead .detailhead{
    display: flex;
    font-size: 16px;
}

.custprofilesection3 .subhead .detailhead span{
    padding: 0px 9px;
}

.custprofilesection3 .subhead .user-edit{
    background-color: #ff5959;
    padding: 10px 45px;
    color: white;
    border-radius: 7px;
    font-size: 15px;
}

.custprofilesection3 .subhead .user-edit .fa-edit{
    padding-right: 5px;
}

.custprofilesection3 label {
    margin-bottom: 5px;
    margin-top: 10px;
}

.custprofilesection3 h4 {
    padding-bottom: 10px;
    font-weight: 600;
}

.custprofilesection3 .custreadonly {
    background-color: #f3f3f3;
}
.custprofilesection3 input {
    border-top: none;
    border-left: none;
    border-right: none;
    border-radius: 0px;
    background-color: #f3f3f3;
}

.custprofilesection3 input:focus {
    box-shadow: none;
    outline: none;
}

.custprofilesection4 {
    min-height: 40px;
    width: 100%;
    position: relative;
    display: flex;
    flex-wrap: wrap;
}

.custprofilesection5 {
    margin-top: 170px;
    width: 100%;
    background-color: white;
    padding: 35px;
    border-radius: 10px;
    box-shadow: 0 0 10px rgb(0 0 0 / 20%);
}

.custprofilesection6 {
    margin-bottom: 40px;
    padding: 35px;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 0 10px rgb(0 0 0 / 20%);
}

.custprofilesection6 h4{
    padding-bottom: 20px;
    font-weight: 600;
    font-size: 17px;
}

.custprofilesection6 .change-pwd{
    margin-top: 10px;
    padding: 10px 60px;
    background-color: #ff5959;
    border: white;
    border-radius: 6px;
}

.custprofilesection7 {
    margin-top: 45px;
    margin-bottom: 70px;
    background-color: white;
    padding: 35px;
    border-radius: 10px;
    box-shadow: 0 0 10px rgb(0 0 0 / 20%);
}

.body-padding{
    padding: 10px 15%;
    padding-bottom: 230px;
}

.custprofilesection7 .delete-text{
    margin-bottom: 15px;
}

.custprofilesection7 .delete-text h4{
    font-size: 18px;
    font-weight: 600;
}

.custprofilesection7 .delete-description p{
    font-size: 15px;
    display: inline;
}

[dir="rtl"] .custprofilesection7 .delete-description div{
    text-align: right;
}

.custprofilesection7 .delete-btn{
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.custprofilesection7 .delete-btn button{
    background-color: white;
    color: #ff5959;
    font-weight: bold;
    margin-top: 28px;
    padding: 10px 60px;
    border: 1px solid #ff5959;
    border-radius: 8px;
}

.custprofilesection7 .delete-btn button:hover{
    background-color: #f3eeee;
}

#accountDeleteModal .modal-body h4{
    font-size: 17px;
    font-weight: 600;
}

#accountDeleteModal .modal-body input{
    border: 1px solid lightgray;
    height: 35px;
    border-radius: 5px;
    padding: 2px 13px;
}

#accountDeleteModal .modal-dialog{
    max-width: 630px;
}

#accountDeleteModal .modal-body{
    padding: 33px 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#accountDeleteModal .modal-footer{
    border-top: none;
    padding: 1rem 30px 33px 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#accountDeleteModal .confirm-deletion{
    background-color: whitesmoke;
    border: 1px solid red;
    color: red;
    font-weight: bold;
    padding: 8px 32px;
    border-radius: 5px;
}

#accountDeleteModal .cancel-deletion{
    border: 1px solid gray;
    padding: 8px 20px;
}

#accountDeleteModal .acct-delete-pass:focus{
    border: 1px solid red;
}

.profile-card-footer {
    color: #ff5959;
    display: flex;
    justify-content: space-between;
    padding-top: 15px;
    font-size: 14px;
}

.profile-card-footer i{
    padding: 0 5px;
}

.chg-pad1 {
    padding-top: 3px;
    padding-bottom: 8px;
}

.chg-pad1 label {
    padding-bottom: 10px;
    font-size: 14px;
}

.pwd:focus {
    outline: none;
    box-shadow: none;
}

.pwd::placeholder {
    padding-top: 2px;
}
.profile-card-wrapper {
    width: 100%;
    position: relative;
    -webkit-box-flex: 0;
    flex-grow: 0;
    flex-shrink: 0;
    max-width: 50%;
    padding: 10px;
}

.profile-card-wrapper .card-content span:not(:last-child)::after {
    content: ", ";
}

.profileset1 {
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
}

.profileset2 {
    width: 7%;
    height: 100%;
    text-align: right;
    align-items: center;
}

.profileset3 {
    width: 100%;
    height: 83px;
    display: flex;
    align-items: center;
    padding-left: 5px;
}

.profileset4 {
    padding-left: 5px;
    margin-left: 30px;
    padding-right: 5px;
    font-size: 21px;
    color: lightgrey;
}

.profileset5 {
    width: 10%;
}

.profile-selected {
    border-bottom: 2px solid white;
}

.profileaddress {
    display: flex;
    align-items: center;
    padding-bottom: 20px;
    justify-content: space-between;
}

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

#editaddressmodal input:focus {
    box-shadow: none;
    outline: none;
}

.editaddr,
.deleteaddr {
    cursor: pointer;
    color: #ff5959;
}

.custhistorysection1 {
    margin-top: 27vh;
    padding: 1px 33% 1px 15%;
}

.custhistorysection2 {
    margin-top: 5vh;
    padding : 1px 33% 1px 15%;
    margin-bottom: 130px;
}

.history-h1 {
    margin-bottom: 15px;
}

.history-h1 h4{
    padding-bottom: 25px;
    font-weight: 600;
}

.history-h1 .order-block{
    padding: 25px;
    border: 1px solid lightgray;
    margin-bottom: 20px;
    border-radius: 7px;
}

.history-h1 .order-primdetail{
    display: flex;
    justify-content: space-between;
    padding-bottom: 25px;
}

.history-h1 .order-sub-detail{
    display: flex;
    align-items: center;
}

.history-h1 .order-sub-detail .type-img{
    padding: 0 20px;
}

.history-h1 .outlet-order-info{
    padding-left: 24px;
}

.history-h1 .itemname{
    font-weight: 600;
    font-size: 15px;
    padding-bottom: 3px;
    text-transform: capitalize;
    display: flex;
}

.history-h1 .id-date{
    font-size: 14px;
}

.history-h1 .id-date .divider{
    padding: 0 4px;
}

.history-h1 .order-status{
    display: flex;
    align-items: flex-start;
    font-size: 14px;
    font-weight: 600;
    background-color: #f5f5f575;
    height: max-content;
    padding: 3px 10px;
    border: 1px solid #ff595970;
}

.history-h1 .order-status p{
    padding-left: 8px;
    display: flex;
    align-items: center;
}

.history-h1 .order-footer{
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-transform: capitalize;
    font-size: 14px;
}

.history-h1 .order-moredetail button{
    background: #ff5959;
    color: white;
    border-radius: 6px;
    padding: 5px 27px;
    text-transform: capitalize;
}

.history-h1 .order-empty{
	padding-left: 20px;
    font-size: 15px;
    color: black;
}

.history-h1 .additional {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid grey;
    text-transform: capitalize;
    padding-top: 20px;
    margin-top: 30px;
    font-size: 14px;
}

.history-h1 .additional .comptime{
    text-wrap: nowrap;
}

.history-h1 .additional .cancel-reason{
    font-size: 13px;
    padding: 0 3px 0 50px;
}

.history-h1 .showmore{
    padding-bottom: 100px;
}

.history-h1 .showmore button{
    padding: 20px;
    border: 1px solid #ff5959;
    text-transform: capitalize;
    font-weight: 600;
}

.history-h1 .showmore button:hover{
    background-color: #ff5959;
    color: white;
}

.history-h1 .ratings{
    cursor: pointer;
}

.history-h1 .ratings .review .fa-star{
    padding-right: 5px;
}

.history-h1 .ratings .show-feedback{
    padding-left: 5px;
}

.history-h1 .feedback h5{
    font-size: 14px;
    padding-right: 5px;
}

.history-h1 .feedback{
    padding: 15px 0 0px;
    font-size: 14px;
    text-transform: capitalize;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    display: none;
}

/* Skeleton loading -- START --- */
    .skllds{
        height: max-content;
        padding: 25px;
        border: 1px solid lightgray;
        margin-bottom: 20px;
        border-radius: 7px;
    }

    .skeleton {
        animation: skeleton-loading 1s linear infinite alternate;
        margin: 10px 0;
    }

    @keyframes skeleton-loading {
        0% {
            background-color: hsl(200, 20%, 88%);
        }
        100% {
            background-color: hsl(200, 20%, 96%);
        }
    }

    .skeleton-text {
        width: 100%;
        height: 0.7rem;
        margin-bottom: 0.5rem;
        border-radius: 0.25rem;
    }

    .skeleton-text-small{
        height: 30px;
        border-radius: 10px;
    }

    .skeleton-text-large{
        height: 60px;
        border-radius: 10px;
    }

/* Skeleton loading -- END --- */

#myTable th,
td {
    padding-left: 15px;
    padding-right: 15px;
    white-space: nowrap;
}

#myTable1 th,
td {
    padding-left: 15px;
    padding-right: 15px;
    white-space: nowrap;
}

#myTable tr td {
    padding-left: 5px;
}

#myTable1 th,
td {
    padding-left: 15px;
    padding-right: 15px;
}
#myTable1 tr td {
    padding-left: 5px;
}

.view {
    cursor: pointer;
}

.nav-item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0px 25px;
}

.custhistorysection3 {
    margin-top: 110px;
    display: none;
}

.custhistorysection4 {
    display: none;
}

.itemdetails {
    position: fixed;
    top: 0;
    height: 100%;
    overflow-y: auto;
    background: #ffffff;
    transition: width 0.1s ease-out, transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.3s ease-out;
    left: auto;
    right: 0;
    z-index: 1232;
    width: 0;
    transform: translateX(100%);
    visibility: hidden;
    padding: 40px;
}

.itemdetails.show{
    width: 500px;
    visibility: visible;
    transform: translateX(0%);
}

.itemdetails .header{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-bottom: 2px;
    font-size: 16px;
    font-weight: 600;
}

.itemdetails .header .fa-times{
    font-size: 24px;
    cursor: pointer;
    padding: 0 15px 0 5px;
}

.itemdetails .remarks-div{
    padding: 0 0 20px;
}

.itemdetails .remarks-div h5{
    font-size: 13px;
    color: #747474;
    font-weight: 600;
    text-transform: capitalize;
}

.itemdetails .remarks-div .remark-text{
    color: #5c5c5c;
    font-size: 13px;
    padding: 5px 0;
    text-transform: capitalize;
}

.itemdetails .delivery-address{
    text-transform: capitalize;
    font-size: 13px;
    padding: 0 0 20px;
}

.itemdetails .delivery-address h5{
    font-size: 13px;
    color: #747474;
    font-weight: 600;
}

[dir="rtl"] .itemdetails .delivery-address .addr{
    text-align: right;
}

.itemdetails .delivery-address .addr{
    padding: 6px 0;
    color: #5c5c5c;
}
.itemdetails .delivery-address .addr span{
    padding-right: 6px;
}

.itemdetails .itemline-detail h5 span{
    padding-right: 6px;
}

.itemdetails .delivery-address .addr span:not(:last-child)::after {
    content: ",";
}

.itemdetails .itemline-detail h5 span:not(:last-child)::after{
    content: ",";
}

.itemdetails .orderid{
    padding-left: 24px;
}

.itemdetails .head{
    padding: 16px 0 5px;
    font-size: 14px;
    text-transform: capitalize;
}

.itemdetails .itemline{
    padding: 6px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.itemdetails .itemline .detailtxt{
    padding: 0 5px;
}

.itemdetails .itemline .itemline-detail{
    padding: 1px 0;
}

.itemdetails .itemline .itemline-detail h4{
    font-size: 13.5px;
    font-weight: 600;
    color: #000000;
}

.itemdetails .itemline .itemline-detail span{
    text-transform: capitalize;
}

.itemdetails .itemline .itemline-detail h5{
    font-size: 11.5px;
    padding: 5px 0;
    text-transform: capitalize;
}

.itemdetails .itemline .itemline-detail h6{
    font-size: 12px;
    text-transform: inherit;
    padding: 2px 0;
}

.itemdetails .itemline-amt{
    padding: 5px;
    font-size: 13px;
}

.itemdetails .additional-section{
    border-top: 1px solid lightgray;
    border-bottom: 1px solid lightgray;
    padding: 15px 0;
}

.itemdetails .additional-section .totalamt,
.itemdetails .additional-section .extras{
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-transform: capitalize;
    font-size: 13.5px;
    padding: 1px 0;
}

.itemdetails .totalpaid{
    font-size: 13.5px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0;
    text-transform: capitalize;
    font-weight: 700;
    border-bottom: 1px solid lightgray;
    color: #ff5959;
    margin-bottom: 25px;
}

.displaynone {
    display: none !important;
}

.bordernone {
    border: none;
}

#cart-empty {
    align-items: center;
    justify-content: center;
    height: 60%;
    padding-bottom: 0;
}

.cart-error{
    position: absolute;
    bottom: 190px;
    right: 50%;
    transform: translate(50%);
    width: 332px;
}

.cart-info-show{
    color: black;
    text-align: center;
    font-weight: 600;
    background-color: #f1e342;
    padding: 16px 56px;
    border-radius: 7px;
}

.loading1,
.loading2 {
    display: none;
    position: fixed;
    z-index: 1062;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
}

.loader-view {
    display: block;
    overflow: hidden;
    background: rgba(241, 241, 241, 0.8) url(../images/loader-lg.svg) 50% 50%
        no-repeat;
}

.loadgif1 {
    position: inherit;
    z-index: 1062;
    top: 137px;
    left: 241px;
    height: calc(100vh - 249px);
    width: 100%;
    overflow: hidden;
    background: rgba(241, 241, 241, 0.8) url(../images/loader-lg.svg) 50% 50%
        no-repeat;
}

.coupon-main-div {
    height: 12.1%;
    padding: 6px 0px;
    margin: 5px 0px 5px 0px;
}

.coupon-div {
    border: 1px dashed green;
    display: flex;
    align-items: center;
    cursor: pointer;
    padding: 0 15px;
    color: green;
    height: 100%;
    font-weight: 500;
    margin: 0px 0px 0px 0px;
}

.coupon-icon {
    padding: 0 10px;
}

.coupon-div:hover {
    box-shadow: 0 3px 8px #e9e9eb;
}

.deactive {
    background-color: whitesmoke;
}

.active {
    /* box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.2); */
    background-color: #30425a9c;
    color: white;
}

/* coupon panel */

.Cpps {
    position: sticky;
    top: 0px;
    z-index: 1;
}
.coupon-close {
    padding-left: 50px;
    padding-top: 16px;
    background-color: #f5f4f4;
    font-size: 25px;
}

#coupon-overlay {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100vw;
    background-color: rgba(0, 0, 0, 0.5);
    content: " ";
    z-index: 1034;
    display: none;
}
.coupon-hide {
    cursor: pointer;
}
.coupon-main {
    position: fixed;
    height: 100vh;
    top: 0;
    right: 0;
    width: 0px;
    visibility: hidden;
    background-color: #fcf9f9;
    z-index: 1035;
    overflow-y: scroll;
}

.coupon-main-show {
    width: 430px;
    visibility: visible;
}

@media only screen and (max-width: 768px) {
    .coupon-main-show {
        width: 100%;
        visibility: visible;
    }

    .coupon-main-div {
        margin: 5px 0px 10px 0px;
        padding: 0px 13px;
    }

    .coupon-div {
        padding: 3px 10px;
        margin-bottom: 8px;
    }
}
.coupon-enabled {
    overflow: hidden;
}
.coupon-header {
    height: 54px;
    background-color: #f5f4f4;
    padding-bottom: 0px;
    display: flex;
    text-align: center;
    justify-content: space-around;
}

#coupon-error {
    background-color: #f5f4f4;
    -webkit-box-shadow: 0 8px 6px -6px #d6d4d4;
    -moz-box-shadow: 0 8px 6px -6px #d6d4d4;
    box-shadow: 0 8px 6px -6px #d6d4d4;
    padding-left: 50px;
    letter-spacing: 1px;
    padding-bottom: 10px;
}
.coupon-header input {
    height: 33px;
    width: 50%;
    margin: auto 0px auto 50px;
}

.coupon-header button {
    background-color: #2f6d2a;
    color: #ffffff;
    height: 33px;
    margin: auto;
}

.coupon-body {
    background-color: #fcf9f9;
    padding-left: 50px;
}

.coupon-ph {
    font-size: 15px;
    padding-top: 20px;
    font-weight: 500;
    padding-bottom: 10px;
}

.coupons {
    height: 100%;
}

.coup1 {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    text-align: left;
}
.coupon-remove {
    text-transform: uppercase;
    cursor: pointer;
    margin-left: 8px;
    font-weight: 600;
    color: #282c3f;
    font-size: 14px;
    margin-left: auto;
}

.coupon-card {
    padding: 23px;
    width: 312px;
    margin-bottom: 42px;
    box-shadow: 0 8px 12px 0 rgba(0, 0, 0, 0.2);
}

.coupon-card:hover {
    box-shadow: 0 8px 12px 0 rgba(0, 0, 0, 0.2);
    cursor: pointer;
}
.coupon_b1 {

    background-color: #808b9a;
    height: 47px;
    width: 36%;
    background: linear-gradient(-135deg, #30425a 5px, transparent 0) 0 5px,
        linear-gradient(135deg, #30425a 5px, #fff 0) 0 5px;
    background-color: #30425a;
    background-position: left bottom;
    background-repeat: repeat-x;
    background-size: 10px 10px;
    color: white;
}

.coupon_b1:active,
.coupon_b1:focus {
    outline: none;
    box-shadow: none;
    border: none;
}
.coupon_p1 {
    font-size: 15px;
    padding-top: 20px;
    font-weight: bold;
    width: 174px;
    line-height: 16.41px;
}

.coupon_p2 {
    font-size: 12px;
    line-height: 13px;
    padding-bottom: 20px;
    width: 225px;
    padding-top: 5px;
}

.coupon_b2 {
    width: 109px;
    height: 31px;
    background: #ffffff;
    border: 1px solid #4a34ce;
    box-sizing: border-box;
    color: #30425a;
    font-weight: bold;
}

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

    .body-padding{
        padding: 0 0 4px 0;
    }

    .loader-view {
        display: block;
        overflow: hidden;
        background: rgba(241, 241, 241, 0.8) url(../images/loader-sm.svg) 50%
            50% no-repeat;
    }

    .loadgif1 {
        position: inherit;
        z-index: 1062;
        top: 137px;
        left: 241px;
        height: calc(100vh - 249px);
        width: 100%;
        overflow: hidden;
        background: rgba(241, 241, 241, 0.8) url(../images/loader-sm.svg) 50%
            50% no-repeat;
    }

    #cart-empty {
        align-items: center;
        justify-content: center;
        height: 90%;
        padding-bottom: 10%;
    }

    .custhistorysection3 {
        display: block;
        background-color: white;
        padding: 50px 20px;
        box-shadow: 0 0 10px rgb(0 0 0 / 20%);
    }

    .custhistorysection3 .row:not(:first-child){
        padding: 7px 0;
    }

    .custhistorysection3 .fr-div,
    .custhistorysection4 .fr-div{
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }

    .custhistorysection3 .sen-div,
    .custhistorysection4 .sen-div{
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }

    .custhistorysection4 {
        display: block;
    }

    .custhistorysection4 .row:not(:first-child){
        padding: 7px 0;
    }

    .custhistorysection4 .reviewstate{
        margin-bottom: 0px;
        padding: 10px 0;
        font-weight: 800;
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }

    .custhistorysection4 .reviewstate .starspan{
        padding: 0 10px;
    }

    .custhistorysection4 .preorderblock{
        padding: 20px 0;
    }

    .preorderblock .view i{
        padding: 0 5px;
    }

    .custhistorysection4 .preorderblock:not(:last-child){
        border-bottom: 1px solid lightgray;
    }   

    .custhistorysection4 .cancel-reason{
        display: flex;
        align-items: center;
        justify-content: flex-start;
        margin-bottom: 10px;
        padding: 15px 0;
        font-weight: 800;
    }

    .custhistorysection3 .splitter{
        text-align: right;
        padding-right: 0;
    }

    .custhistorysection3 .norder{
        font-weight: 600;
    }

    .custhistorysection3 .rnorders{
        padding: 20px 0;
    }

    .custhistorysection3 .rnorders .orno,
    .custhistorysection4 .preorderblock .orno{
        font-weight: 600;
    }

    .custhistorysection3 .rnorders:not(:last-child){
        border-bottom: 1px solid lightgray;
    }

    .nav-item {
        margin-right: 12px;
    }
    .custprofilesection3 {
        padding-left: 0px;
        padding-right: 0px;
        margin-top: 90px;
    }


    .custprofilesection5 {
        padding-left: 0;
        padding-right: 0;
        padding-top: 27px;
        box-shadow: none;
        margin-top: 90px;
    }

    .profileaddress{
        display: flex;
        align-items: center;
        padding-bottom: 20px;
        justify-content: space-between;
        padding: 2px 15px 20px 15px;
    }

    .profile-card-wrapper{
        max-width: 100%;
    }

    .custprofilesection6 {
       padding: 30px;
        border-radius: 0;
        margin-bottom: 20px;
    }

    .custprofilesection6 .flex-jc-fe{
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .custprofilesection7{
        margin-top: 0;
        margin-bottom: 0;
        border-radius: 0;
    }

    .custprofilesection7 .delete-btn{
        justify-content: center;
    }

    #accountDeleteModal .modal-body h4{
        margin-bottom: 26px;
    }

    #accountDeleteModal .modal-body input{
        width: 100%;
    }

    #accountDeleteModal .modal-body{
        display: block;
    }

    #accountDeleteModal .modal-footer{
        display: flex;
        flex-direction: column-reverse;
    }

    #accountDeleteModal .cancel-deletion{
        margin-top: 25px;
        width: 100%;
    }

    .custhistorysection1 {
        margin-top: 16vh;
        padding-left: 0px;
        padding-right: 0px;
    }

    .custhistorysection2 {
        padding-left: 0px;
        padding-right: 0px;
        display: none;
    }

    .custhistorysection1 {
        display: none;
    }
    .mobile-scroll {
        overflow-x: auto;
    }

    .custprofilesection2 {
        height: 55px;
        position: fixed;
        top: 50px;
        background-color: #ff5959;
        color: white;
        width: 100%;
        padding: 10px 0px 10px 0px;
        z-index: 100;
    }

    .custhistorysection4 {
        margin-top: 13px;
        padding: 50px 20px;
        background-color: white;
    }

    .custhistorysection4 .porderdiv:not(:last-child) {
        border-bottom: 1px solid black;
    }

    .custhistorysection4 .showmore{
        padding-bottom: 60px;
    }

    .custhistorysection4 .show-more-btn{
        padding: 20px;
        border: 1px solid #ff5959;
        text-transform: capitalize;
        font-weight: 600;
        cursor: pointer;
    }

    .custprofilesection3 h4 {
        margin-top: 10px;
    }
}

/* Loyalty section user */

.redpt,
.redamt {
    padding: 0px 2px;
}
.custloyaltysection1 {
    margin-top: 180px;
    padding-left: 15%;
    padding-right: 15%;
    width: 100%;
}

.custloyaltysection1 .summery{
    box-shadow: 0 0 10px rgb(0 0 0 / 20%);
    padding: 30px 35px;
    border-radius: 7px;
    display: flex;
    justify-content: space-between;
}

.custloyaltysection1 label {
    margin-bottom: 5px;
    margin-top: 10px;
}

.custloyaltysection1 h4 {
    margin-top: 10px;
}

.custloyaltysection1 .custreadonly {
    background-color: #f3f3f3;
}
.custloyaltysection1 input {
    border-top: none;
    border-left: none;
    border-right: none;
    border-radius: 0px;
    background-color: #f3f3f3;
}

.custloyaltysection1 input:focus {
    box-shadow: none;
    outline: none;
}

.custloyaltysection2 {
    margin-top: 30px;
    padding-left: 15%;
    padding-right: 15%;
    width: 100%;
    padding-bottom: 150px;
}

.custloyaltysection2 .detail-block{
    box-shadow: 0 0 10px rgb(0 0 0 / 20%);
    padding: 30px 35px;
    border-block: 7px;
}

.custloyaltysection2 h5{
    padding: 17px 0 30px 0;
    font-weight: 600;
}

.custloyaltysection2 label {
    margin-bottom: 5px;
    margin-top: 10px;
}

.custloyaltysection4 {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.custloyaltysection4 .contain{
    padding: 0 5px;
}

.custloyaltysection4 h5{
    padding-bottom: 13px;
    font-weight: 600;
}

.custloyaltysection4 .earned-pts,
.custloyaltysection4 .available-pts,
.custloyaltysection4 .expired-pts{
    font-size: 15px;
    display: flex;
}

/* .custloyaltysection4 .earned-pts span:first-child{
    padding-right: 35px;
}

.custloyaltysection4 .available-pts span:first-child{
    padding-right: 20px;
}

.custloyaltysection4 .expired-pts span:first-child{
    padding-right: 37px;
} */


.custloyaltysection4 .earned-pts span:first-child,
.custloyaltysection4 .available-pts span:first-child,
.custloyaltysection4 .expired-pts span:first-child{
    padding: 0 10px;
}


.custloyaltysection4 .earned-pts span:last-child,
.custloyaltysection4 .available-pts span:last-child,
.custloyaltysection4 .expired-pts span:last-child{
    padding: 0 10px;
}

.loyalty-div {
    border: 1px dashed #a9abb2;
    display: flex;
    align-items: center;
    cursor: pointer;
    padding: 0 15px;
    height: 40px;
    font-weight: 500;
    margin: 5px 0px 2px 0px;
    box-shadow: 0 3px 8px #e9e9eb;
    background-color: #cdf2fb;
}

.loyalty1 {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    text-align: left;
}

/* Loyalty toggle button */

.switch-set1 {
    position: relative;
    display: inline-block;
    width: 55px;
    height: 30px;
    margin-left: auto;
}

.switch-set1 input {
    display: none;
}

.slider-set1 {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ff0000;
    -webkit-transition: 0.2s;
    transition: 0.2s;
    margin: 7px 10px;
    min-height: 14.5px;
    border: 0px;
    padding: 0px;
    border-radius: 30px !important;
}

.slider-set1:before {
    position: absolute;
    content: "";
    height: 19px;
    width: 19px;
    left: -1px;
    bottom: -2px;
    background-color: rgb(225, 221, 230);
    -webkit-transition: 0.2s;
    transition: ease-in-out 0.2s;
    border-radius: 50%;
}

#loyaltybtn:checked + .slider-set1 {
    background-color: #2ab934;
}

#loyaltybtn:focus + .slider-set1 {
    box-shadow: 0 0 1px #2196f3;
}

#loyaltybtn:checked + .slider-set1:before {
    -webkit-transform: translateX(19px);
    -ms-transform: translateX(19px);
    transform: translateX(19px);
}

.on {
    display: none;
}

.on,
.off {
    color: white;
    position: absolute;
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
    font-size: 10px;
    font-family: Verdana, sans-serif;
}

#loyaltybtn:checked + .slider-set1 .on {
    display: block;
}
#loyaltybtn:checked + .slider-set1 .off {
    display: none;
}

.slider-set1.round-set1 {
    border-radius: 34px;
}

.slider-set1.round-set1:before {
    border-radius: 50%;
}

.card-slide {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
}

.loyalty_card_1 {
    background-color: #2e6eab;
    border-radius: 10px;
    color: white;
    width: 290px;
    border: 1px solid gray;
	background: linear-gradient(to right, #a79300, #ffd700);
}

.summery .card-head,
.user-additional .card-head{
    padding: 16px 16px 8px 16px;
}

.summery .cardbody,
.user-additional .cardbody{
    display: flex;
    justify-content: space-between;
    padding: 12px 0px 0px;
    align-items: center;
}

.summery .cardbody .detail h5,
.user-additional .cardbody .detail h5{
    font-size: 14px;
    padding-bottom: 3px;
	color: white;
	text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5), 0 0 5px rgba(255, 255, 255, 0.8);
}

.summery .cardbody .detail h6,
.user-additional  .cardbody .detail h6{
    font-size: 13px;
	text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5), 0 0 5px rgba(255, 255, 255, 0.8);
}

.card-slide::-webkit-scrollbar {
    display: none;
}

.card-slide {
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}

.loyt-p1 {
    padding: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50px;
}

.loyt-footer {
    font-size: 10px;
    text-align: center;
    padding: 8px 16px 8px 16px;
    border-top: 1px solid lightgray;
	text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5), 0 0 5px rgba(255, 255, 255, 0.8);
}

.loyt-head {
    font-size: 16px;
    font-weight: 600;
	text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5), 0 0 5px rgba(255, 255, 255, 0.8);
}

.loyt-body {
    height: 73px;
    border-bottom: 1px solid #e6d47a;
    display: flex;
    justify-content: space-around;
    align-items: center;
}

.loyt-body h5 {
    font-size: 16px;
}

.loyt-body h6 {
    margin-top: 5px;
    font-size: 13px;
}

.history_span {
    display: flex;
    justify-content: space-between;
}

.lyt_line {
    display: flex;
    align-items: center;
    padding: 5px 0px;
    margin-bottom: 15px;
}

.custloyaltysection3 {
    margin-top: 7px;
    display: none;
}

.custloyaltysection2 {
    display: block;
}

.lty-slider-footer {
    text-align: center;
    padding-top: 15px;
}

.lty-slider-footer p {
    display: inline-flex;
    width: 1rem;
    height: 1rem;
    background: #8c8b8b;
    text-decoration: none;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    margin: 0 0 0.5rem 0;
    position: relative;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
}

.lty-slider-footer a:active {
    top: 1px;
}
.lty-slider-footer a:focus {
    background-color: #000;
}

.jump_link_active {
    background-color: blueviolet !important;
}

@supports (scroll-snap-type) {
    .lty-slider-footer > a {
        display: none;
    }
}

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

    .user-additional{
        width: 100%;
    }

    .custloyaltysection1 .summery{
        box-shadow: none;
        flex-direction: column;
        padding: 30px 20px;
    }

    .custloyaltysection1 {
        margin-top: 90px;
        padding-left: 0px;
        padding-right: 0px;
    }

    .custloyaltysection4 {
        padding-left: 0px;
        padding-right: 0px;
        margin-top: 6px;
    }

    .lty-align {
        text-align: right;
    }

    .lty-slider{
        padding-top: 40px;
    }

    .custloyaltysection2 {
        display: none;
    }

    .custloyaltysection3 {
        display: block;
    }

    .loyalty_card_1 {
        max-width: 100%;
        min-width: 100%;
        width: 100%;
        height: 180px;
        min-height: 180px;
        max-height: 180px;
        margin-left: 0px;
    }

    .loyt-body {
        height: 96px;
    }
}

.branch-card-img {
    background-color: black;
}

.branch-card-img h6 {
    color: white;
}


/*===============================  Order Success Page =============================*/
   
.order-success-wrapper{
    display: flex;
    justify-content: center;
    height: 100%;
    background-image:none;
    background-color: #fafafa;
}

.order-success-wrapper .inner-wrapper h3{
    color: black;
    font-size: 20px;
    font-weight: 400;
    text-align: center;
    padding: 25px;
    font-family: 'Open Sans', sans-serif;
    margin-top: 20px;
    letter-spacing: 1.5px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.order-success-wrapper .inner-wrapper p{
    font-size: 17px;
    text-align: center;
    color: #423e3e;
    font-family: 'Open Sans', sans-serif;
}

.order-success-wrapper .inner-wrapper{
    background-color: #ffffff;
    margin: 70px;
    padding-top: 50px;
    box-shadow:  0 8px 12px 0 rgba(0,0,0,0.2);
    padding-left:  25px;
    padding-right:  25px;
    border-radius: 5px;
}

.order-success-wrapper .inner-wrapper img{
    margin: auto;
    display: flex;
}

.order-success-wrapper .inner-wrapper a{
    padding: 10px 15px;
    border-radius: 5px;
    font-size: 16px;
    font-family: 'Open Sans', sans-serif;
    display: block;
    text-align: center;
    text-decoration: none;
    max-width: 165px;
    background-color: #ff5959;
    color: white;
    width: 160px;
}

.order-success-wrapper .inner-wrapper a i {
    padding-left: 8px;
}

.track-order-close{
   background-color: white !important;
   color: black !important;
}

.track-div{
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    padding-top: 60px;
}

.preference-div .del-div,
.preference-div .tak-div{
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    cursor: pointer;
}

.preference-div .del-div{
    border-left: 2px solid #655f5f;
}

.preference-div span{
    font-size: 13px;
}    

.selected-pref{
    background-color: #ff5959;
    transition: background-color 0.3s ease;
    font-weight: 600;
}

.preference-div input[type="radio"]{
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    position: fixed;
}

.preference-div{
    color: white;
    top: 44px;
    right: 0px;
    border-radius: 5px;
    text-align: center;
    padding: 10px 5px;
    width: 250px;
    display: flex;
    align-items: center;
    margin-right: 150px;
}

[dir="rtl"] .preference-div{
    margin-right: 0;
    margin-left: 150px;
}

.preference-div .sltype{
    padding: 14px 19px;
}

.preference-div .sltype:hover{
    background-color: #ff5959;
    color: white;
}

/* sidebar */
.SideMenu_topNav__311Av{
    padding-left: 11px;
}

.sidebar{
    position: fixed;
    top: 0;
    height: 100%;
    left: 0;
    z-index: 1201;
    background: rgba(0, 0, 0, 0.5);
    width: 0;
    display: none;
}

.sidebar .sidebarDiv{
    height: 100%;
    overflow: auto;
    width: 300px;
    overflow-y: hidden;
    transition: width 0.3s ease-out, transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.3s ease-out;
    padding: 10px 0;
    background-color: #ffffff;
}

.sidebar.show{
    width: 100%;
    display: block;
}

.sidebarDiv .login{
    padding: 10px 24px;
    background-color: #ff5959;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.sidebarDiv .login:hover{
    cursor: pointer;
}

.sidebarDiv .login p{
    font-size: 16px;
    color: white;
    font-weight: 600;
}

.sidebarDiv .lg-options,
.sidebarDiv .comman-options,
.sidebarDiv .changeLngsb-div{
    padding: 10px 0;
}

.sidebarDiv .lg-options li,
.sidebarDiv .comman-options li,
.sidebarDiv .changeLngsb-div li{
    padding: 10px 22px;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #ff5959;
}

.sidebarDiv .lg-options li .fa-arrow-right,
.sidebarDiv .comman-options li .fa-arrow-right,
.sidebarDiv .changeLngsb-div li .fa-arrow-right{
    color: white;
}

.sidebarDiv .lg-options li:hover,
.sidebarDiv .comman-options li:hover{
    background-color: whitesmoke;
    cursor: pointer;
    font-weight: 600;
}

.sidebarDiv .lg-options li:hover i,
.sidebarDiv .comman-options li:hover i,
.sidebarDiv .changeLngsb-div li:hover i {
    color: #ff5959;
}

.sidebarDiv .lg-options a,
.sidebarDiv .comman-options a,
.sidebarDiv .changeLngsb-div a
{
    padding: 0 8px;
}


.sidebarDiv .lg-options .prDiv1{
    font-size: 15px;
    flex: 1;
    display: flex;
    align-items: center;
}

.sidebarDiv .lg-options .prDiv1 a{
    color: black;
    padding-left: 10px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}


.sidebarDiv .comman-options a,
.sidebarDiv .changeLngsb-div a{
    color: black;
}

.sidebarDiv .changeLngsb-div .prLi{
    display: block;
}

.sidebarDiv .changeLngsb-div .prLi .dropdown-toggle{
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
}

.sidebarDiv .changeLngsb-div .prLi #switch{
    padding-top: 12px;
}

.sidebarDiv .changeLngsb-div .prLi #switch li:hover{
    font-weight: 600;
}

.sidebarDiv .changeLngsb-div .prLi #switch a{
    display: block;
    width: 100%;
}

.sidebarDiv hr{
    margin-top: 5px;
    margin-bottom: 5px;
}

.sidebarDiv .logout{
    padding: 10px 15px;
}

.sidebarDiv .logout a{
    color: black;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 0 8px;
}

.sidebarDiv .logout:hover{
    cursor: pointer;
    background-color: whitesmoke;
    font-weight: 600;
}

.sidebarDiv .cmp-logo{
    display: flex;
    align-items: center;
    justify-content: center;
    height: 130px;
    padding-top: 10px;
    padding-bottom: 15px;
    border-bottom: 1px solid lightgray;
}

/* address customizer */
.addressCustomize{
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1200;
    display: none;
}

.addressCustomize .addressSection{
    max-height: 650px;
    background-color: white;
    position: relative;
    bottom: 0;
    left: 0;
    right: 0;
    height: max-content;
    overflow: auto;
    padding: 30px 20px;
    width: 500px;
}

.addressCustomize.show{
    height: 100%;
    display: block;
    display: flex;
    align-items: center;
    justify-content: center;
}

.addressCustomize .addrlabel label span{
    margin-left: auto;
    padding-right: 15px;
    font-size: 23px;
}

.addressCustomize .addrlabel label span i{
    font-size: 25px;
}

.addressCustomize .addrlabel input[type="radio"]{
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    position: fixed;
}

.addressCustomize .addrlabel .addrlabelInput{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 25px 0;
}

.addressCustomize .addrlabel .addrlabelInput label{
    padding: 5px 15px;
    border: 1px solid #ff5959;
    border-radius: 5px;
    margin: auto;
    cursor: pointer;
}

.addressCustomize .gstyle-div{
    margin-top: 12px;
}

.addressCustomize .gstyle-div input{
    border-radius: 10px;
}

.addressCustomize .addr-saveBtn button{
    height: 60px;
    background-color: #ff5959;
    margin-top: 20px;
    color: white;
    font-size: 20px;
    border-radius: 10px;
}

.addressCustomize .addrlabelInput label.selected{
    background-color: #ff5959;
    color: white;
}

.addressCustomize #addr-locality-error{
    color: red;
    display: block;
    padding-top: 4px;
}

.addressLocationpicker{
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1201;
    display: none;
}

.addressLocationpicker.show{
    height: 100%;
    display: block;
    display: flex;
    align-items: center;
    justify-content: center;
}

.delunavailablepopup{
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1202;
    display: none;
}

.delunavailablepopup.show{
    height: 100%;
    display: block;
    display: flex;
    align-items: center;
    justify-content: center;
}

.delunavailablepopup .popupSection{
    max-height: 220px;
    background-color: #f5f9ff;
    position: relative;
    bottom: 0;
    left: 0;
    right: 0;
    height: max-content;
    overflow: auto;
    padding: 35px 30px;
    width: 528px;
    border-radius: 10px;
}

.delunavailablepopup h5{
    font-size: 15px;
    line-height: 1.5;
}

.delunavailablepopup button{
    font-size: 16px;
    padding: 6px 20px;
    border-radius: 10px;
}

.delunavailablepopup .continueBtn{
    color: white;
    background-color: #ff5959;
    margin-right: 15px;
}

.delunavailablepopup .popupSection div{
    padding-top: 15px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.addressLocationpicker .locationSection{
    max-height: 650px;
    background-color: #f5f9ff;
    position: relative;
    bottom: 0;
    left: 0;
    right: 0;
    height: 650px;
    overflow: auto;
    padding: 30px 20px;
    width: 500px;
}

.locationSection .curLocationPicker{
    background-color: white;
    padding: 16px 20px;
    border-radius: 13px;
    cursor: pointer;
    margin-top: 40px;
}

.locationSection .curLocationPicker .txt1{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-size: 20px;
    color: #ff5959;
}

.locationSection .curLocationPicker .txt1 i{
    padding: 0 10px;
}

.locationSection .curLocationPicker .txt1 p{
    font-size: 17px;
    color: #ff5959;
    text-transform: capitalize;
}

.addressLocationpicker .locationSection .orspan{
    text-align: center;
    display: block;
    padding: 15px;
}

.addressLocationpicker .locationSection .curLocationSearch{
    position: relative;
}

.addressLocationpicker .locationSection .curLocationSearchInput{
    border-radius: 10px;
    padding: 0.375rem 3.8rem 0.375rem 1.5rem;
    border-color: #ff5959;
    line-height: 1.8;
    height: 50px;
}

.addressLocationpicker .locationSection .search-clear{
    color: #ff5959;
    position: absolute;
    width: 25px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 14px;
    right: 20px;
    cursor: pointer;
}

.addressLocationpicker .locationSection .curLocationSearch .curLocationSearchList{
    background-color: white;
    padding: 12px;
    border-radius: 10px;
    max-height: 370px;
    height: max-content;
    overflow: auto;
    display: none;
    margin-top: 8px;
}

.addressLocationpicker .locationSection .curLocationSearchList .SearchListResult{
    display: flex;
    align-items: baseline;
    justify-content: flex-start;
    padding: 12px 8px;
}

.addressLocationpicker .locationSection .curLocationSearchList .SearchListResult:hover{
    cursor: pointer;
}

.addressLocationpicker .locationSection .curLocationSearchList .SearchListResult i{
    padding: 0 10px;
}

.SearchListResult .text1,
.SearchListResult .text2{
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

#changeServiceModal{
    z-index: 1032;
}

#changeServiceModal .clearcart{
    background-color: #ff5959;
    color: white;
}

#changeServiceModal .cancel-clearcart{
    border: 1px solid #ff5959;
    color: black;
}

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

    .order-success-wrapper{
        background-color: #ff5959;
    }

    .order-success-wrapper .inner-wrapper{
        padding-top: 30px;
        background-color: transparent;
        box-shadow: none;
    }

    .order-success-wrapper .inner-wrapper h3{
        color: white;
        font-weight: 600;
    }
    
    .order-success-wrapper .inner-wrapper p{
        color: #ffffff
    }

    .order-success-wrapper .inner-wrapper a{
        background-color: white;
        color: blue;
        margin: 30px auto;
    }

    .track-div{
        display: block;
    }

    .promotional-banner{
        margin-top: 0;
        margin-bottom: 25px;
    }

    .promotional-items .slideleft {
        left: 24px;
        display: none;
    }

    .promotional-items .slideright {
        right: -24px;
        display: none;
    }

    .promotional-items{
        width: 100%;
        overflow: hidden;
    }

    #discountstall .orderset17{
        border: none;
    }

    .promotional-items .scroll-container{
        padding: 0 20px;
        overflow: auto;
    }

    .recentLoc{
        height: auto;
    }

    .autoResent{
        box-shadow: none;
        box-shadow: none;
        overflow: auto;
        height: calc(100% - 160px);
    }

    .custaddress .addr-div{
        padding: 20px;
    }

    .custaddress .addr-div .cust-name{
        font-size: 15px;
        text-align: left;
        font-weight: 600;
        padding-top: 0;
    }

    .preference-div{
        width: 250px;
        margin-right: 0;
    }

    .top-ribbon{
        top: 100px;
        padding: 2px 10px;
    }

    .lngSwitch{
        padding: 0 10px;
    }

    .promotional-banner .carousels-inner img{
        height: auto;
    }

    
    .custprofilesection3 .subhead{
        flex-direction: column;
        border-radius: 0;
    }

    .profileheader{
        padding-bottom: 40px;
    }

    .itemdetails.show{
        width: 100%;
    }

    .loyaltySection{
        padding-left: 15px;
        padding-right: 15px;
    }

    .addressCustomize .addressSection{
        width: auto;
        margin: auto;
        position: absolute;
    }

    .addressLocationpicker .locationSection{
        width: auto;
        margin: auto;
        position: absolute;
    }

	.addtocart {
        padding: 4px 5px 4px 5px !important;
        background-color: transparent !important;
        color: var(--bg-color-3) !important;
		width: 60px;
		height: 30px;
		border: 1px solid var(--border-color-4);
		border-radius: 1.6rem;
    }

	.custom-select{
		width: max-content;
		padding: 0;
		height: auto;
	}

	.custom-select .type-grp{
		align-items: center;
		display: flex;
		flex-direction: column;
		padding-right: 8px;
	}

	.custom-select .selected{
		padding: 4px 9px;
		background: transparent;
	}

	.custom-select .selected img{
		margin-right: 0;
	}

	.custom-select #selected-text{
		display: none;
	}

	.custom-select .options{
		width: 160px;
		top: 41px;
		right: 9px;
	}

	.locdel i{
		color: #000000
	}

	.change-br{
		padding-top: 0;
	}

	.br-name{
		width: 130px;
	}

	.mobile-branch-name,
    .mobile-address {
        font-size: 0.8rem;
		display: flex;
		align-items: center;
		justify-content: flex-start;
    }
} 

@media only screen and (max-width: 380px) {
    .track-div{
        padding-top: 10px;
    }

    .order-success-wrapper .inner-wrapper{
        margin: 50px;
    }
}

@media (min-width: 768px) {
    .order-main-section {
        transform: translate(-50%, -35%);
    }
}

@media (max-width: 768px) {
	.deals-section h4{
		font-size: 17px;
		padding: 0px 0 20px 1px;
	}

	.deals-items .slideleft{
		    left: 26px;
			height: 80px;
			border-radius: 0;
			font-size: 30px;
			color: white;
			background-color: transparent;
			box-shadow: none;
			top: 55%;
	}

	.deals-items .slideright{
		right: -16px;
		height: 80px;
		border-radius: 0;
		font-size: 30px;
		color: white;
		background-color: transparent;
		box-shadow: none;
		top: 55%;
	}

	.deals-div{
		display: flex;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        scroll-behavior: smooth;
        gap: 7px;
        padding-left: 3.5px; /* Ensure space on both ends */
        padding-right: 3.5px;

		scrollbar-width: none; /* Firefox */
        -ms-overflow-style: none;  /* IE and Edge */
	}

	.deals-div::-webkit-scrollbar {
        display: none; /* Chrome, Safari */
    }

    .deals-div .deals-li {
		flex: 0 0 calc(50% - 3.5px); /* 2 items + 7px gap total */
        scroll-snap-align: start;
		padding-right: 0;
    }

	.deals-section{
		/* padding: 20px 20px 25px; */
		padding: 20px 2px 25px;
	}

	.ordersearch .filter .nonveg-only{
		padding-right: 0;
	}

	.ordersearch .filter-status .count-span{
		left: 17px;
		font-size: 12px;
		width: 15px;
		height: 18px;
		top: -2px;
	}

	.branchList{
		width: 80%;
	}

	.ordersearch .filter-status .clear{
		padding-left: 17px;
	}
}