
/** MODAL CSS */

#modal-desk-product {
	overflow: hidden;
}

#modal-desk-product .btn-close {
    cursor: pointer;
	top: 15px;
}

#modal-desk-product .modal-body {
  /*max-height: 70% !important;*/
}

#modal-desk-product .modal-dialog {
  max-width: 720px;
  align-items: normal;
  min-height: unset;
  margin-top: calc(38px);
  height: calc(100%);
}

/*

*/

#modal-mobi-halfhalf{
  overflow-y: hidden;
}

#modal-mobi-halfhalf .modal-body.halfhalf_mobile_custom{
    background-color: #efefef!important;
}

#modal-mobi-halfhalf .modal-content {
  /*max-height:500px;*/
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  height: 420px;
  max-width: 720px;
  transition:all 0.3s ease-out; 
}

#modal-mobi-halfhalf.halfhalf_mobile_products .modal-dialog,
#modal-mobi-halfhalf.halfhalf_mobile_custom .modal-dialog{
    height:calc(100%);c
}
#modal-mobi-halfhalf.halfhalf_mobile_products .modal-content {
    margin-top: calc(20px + .9rem);
    height: calc(100% - (33px + 1rem));
    transition:all 0.3s ease-out; 
}

c#modal-mobi-halfhalf.halfhalf_mobile_custom .modal-content {
    margin-top: calc(20px + .9rem);
    height: calc(100% - (33px + 1rem));
    transition:all 0.3s ease-out; 
}

/*#modal-mobi-halfhalf #halfhalf_mobile_custom{

}*/
#modal-mobi-halfhalf #halfhalf_mobile_custom .halfhalf-mobile-custom-container{
  transition: all 0.5s ease-out;
}

#modal-mobi-halfhalf #halfhalf_mobile_custom .halfhalf-mobile-custom-container.collapsed{
  height:100px;
  transition: all 0.5s ease-out;
}

#modal-desk-product .message{
    height: 50px !important;
    padding-left: 25px !important;
    resize: none;
    border-radius: 10px;
    width: 100%;
    padding: 10px 40px 10px 55px;
    border: none;
    background-color: #efeff4;
}





@media (min-width: 768px) {
  #modal-desk-product .modal-dialog {
    height: 70%;
    width: 55vw;
    top: unset;
    -webkit-transform: translate(0,25%);
    transform: translate(0,25%);
    align-items: center;
   /* margin: 10vh auto;*/
  }

  #modal-desk-product .modal-body {
    padding-bottom: 2rem;
    max-height: 70%;
      padding-top:0px;
  }

  #modal-desk-product .modal-content {
    /*height: auto;*/
      height:100%;
  }
}

@media (min-width: 768px) 
  and (min-resolution: 2dppx) {
    #modal-desk-product .modal-dialog {
        width: 80vw;        
    }

}

.modal-header-desk-product{
	background-color: #a57c58;
	border-top-left-radius: 0.5rem;
	border-top-right-radius: 0.5rem;
	color: white;
	padding: 1rem;
}

.modal-header-upsell{
	background-color: #a57c58;
	border-top-left-radius: 0.5rem;
	border-top-right-radius: 0.5rem;
	color: white;
	padding: 1rem;
}

.modal-header-upsell .modal-title{
    font-size: 1.5rem;
    margin: 0.5rem 0 -0.5rem 0;
    font-family: 'Montserrat-Medium' !important;
}

.modal-desc {
	font-size: 0.8rem;
	margin-bottom: 0;
	margin-top: 0.6rem;
}

.modal-dialog {
    max-width: 700px;
}

#modal-view-map .modal-dialog {
    max-width: 500px;
}
#modal-view-map .modal-dialog .modal-body{
    border-radius:8px;
}
/*
.modal-body {
	border-top-left-radius: 0!important;
	border-top-right-radius: 0!important;
}
*/
.section-title-wrap {
	/*margin-bottom: 1.5rem;*/
    margin:0 !important;
    margin-bottom: 10px !important;
}

.modal-desk-product-title,
.modal-desk-product-course-menu-title {
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	color: #000;
	font-size: 1rem;
    padding-bottom: 0.25rem;
    font-family: "Montserrat-SemiBold"
}

.btn-group-toggle {
	margin-top: 1rem;
}


.modal-desk {
    overflow-y: scroll;
}

#modal-notification {
    height: fit-content !important;
}

#modal-desk-added, #modal-notification {
    height: 200px;
    width: 300px;
background: linear-gradient(to right, rgba(255,255,255,.20), transparent);
    background-color: #5ae077;
	border-radius: 10px;
	padding-left: 0px;
	overflow: hidden;
}

.modal-header-added-product img {
	width: 100px;
}
.modal-desk-added-body {
	background: rgba(0,0,0,0);
	color: #fff;
}

/*.modal-header {overflow: hidden;}*/

#modal-desk-product .btn {
	padding-top: 2px;
	padding-bottom: 0px;
    margin-bottom: 0px;
    padding-right: 1.5rem;
}

#modal-desk-product .order-count-wrap .btn {
	font-size: 24px;
	/* padding: 0.35rem; */
	padding: 0;
	display: -webkit-inline-box;
    -webkit-box-pack: center;
    -webkit-box-align: center;
}

.modal-desk::-webkit-scrollbar {
    width: .5em;
}

 
.modal-desk::-webkit-scrollbar-thumb {
  background-color: none;
}

/** SIZE MODAL BUTTONS **/
.prod-desk-size-container {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  /* padding-left: 45pt; */
  padding-left: 2.5rem;
  position:relative;
  float:left;
  width:100%;
  margin-bottom:10px;
    padding-top: 0px;
    padding-bottom: 0px;
}

.prod-desk-size-container input {
	position: absolute;
    opacity: 0;
    cursor: pointer;
    display:none;
}

.gold-check {
	position: absolute;
    top: 0;
    /* left: 20px; */
	left: 0;
    height: 25px;
    width: 25px;
	cursor: pointer;
	border: solid 1px #d9d9d9;
  color: #fff;
  transition: .25s ease;
}

.gold-check:after {
    content: "";
    position: absolute;
    display: none;
}

.prod-desk-size-container input:checked ~ .gold-check {
    border: 0px;
    background-color: #A57C58;
    transition: .25s ease;
}

.prod-desk-size-container input:checked ~ .gold-check::before {
  content: "\f71E";
  position: absolute;
  padding: .25rem;
}

/** SIDE MODAL BUTTONS **/
.prod-desk-side-container {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  padding-left: 45pt;
  position:relative;
  float:left;
  width:100%;
  margin-bottom:20px;
}

.prod-desk-side-container input {
	position: absolute;
    opacity: 0;
    cursor: pointer;
}

.gold-check:after {
    content: "";
    position: absolute;
    display: none;
}

.prod-desk-side-container input:checked ~ .gold-check {
    background-image: url('../images/icon-selected.png');
	background-size: 100%;
    border: 0px;
}


label input.selectedoption[type="radio"] + p ,
label input[type="radio"]:checked + p ,
label input[type="checkbox"]:checked + p{
    color: #a57c58;
    font-family: "Montserrat-Medium";
    font-weight: 100;
}

#modal-desk-halfhalf label input[type="radio"]+ p , 
#modal-desk-halfhalf label input[type="checkbox"] + p,
#modal-desk-halfhalf label input[type="radio"]:checked + p , 
#modal-desk-halfhalf label input[type="checkbox"]:checked + p{
  margin-bottom: 0rem;
}

.price-add {
	right: 0;
}

/** DELETE INGREDIENT MODAL BUTTONS **/
.prod-desk-del-container {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  /* padding-left: 45pt; */
  padding-left: 2.5rem;
  position:relative;
  float:left;
  width:100%;
  margin-bottom:20px;
}

#modal-desk-halfhalf .prod-desk-del-container{
  margin-bottom:10px;
}

#modal-mobi-halfhalf .prod-desk-del-container{
    margin-bottom:10px;
    padding-top: 0;
}

#modal-mobi-halfhalf .prod-desk-size-container .size-title,
#modal-mobi-halfhalf .prod-desk-del-container .size-title,
#modal-mobi-halfhalf .prod-desk-del-container .inc-title,
#modal-mobi-halfhalf .prod-desk-del-container .extra-title{
    padding: 0;
    margin: 0;
    /*line-height: 18px;*/
}

/* Hide the browser's default checkbox */
.prod-desk-del-container input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    display:none;
}

/* Create a custom checkbox */
.gold-check-box {
    position: absolute;
    top: 0;
    /* left: 20px; */
	left: 0;
  transition: background .25s ease;
  width: 1.5rem;
  height: 1.5rem;
    background-color: #ffffff;
	cursor: pointer;
	border: solid 1px #d9d9d9;
}

/* When the checkbox is checked, add a blue background */
.prod-desk-del-container input.selectedoption ~ .gold-check-box,
.prod-desk-del-container input:checked ~ .gold-check-box {
    background-color: #b79469;
    color: #fff;
    border: none;
}

.prod-desk-del-container input.selectedoption ~ .gold-check-box:before,
.prod-desk-del-container input:checked ~ .gold-check-box:before {
  content: "\f71E";
  position: absolute;
  padding: .25rem;
}

/* Create the checkmark/indicator (hidden when not checked) */
.gold-check-box:after {
    content: "";
    position: absolute;
    display: none;
}

/**MODAL FOOTER**/
.product_mobile_footer.add-total {
    display: none !important;
}

.add-total {
  border-radius: .5rem;
	background: #ffffff;
	width: 100%;
	height: 100%;
}

.add-qty, .add-total-qty {
  width: 220px;
  position: relative;
  margin: auto;
  height: 28px;
}

.add-qty {
  border-right: solid 1px #d8d8d8;
}

.add-btn {
   width: 220px;
}

.add-btn button {
   cursor: pointer;
}

.btn-add-qty img {
    width: 50%;
	cursor: pointer;
	margin-top: -3px;
}

.btn-less-qty img {
    width: 43%;
	cursor: pointer;
}

.add-total h5 {
	color: #b79469;
	padding-top: 3px;
    margin-top: -1px;
}

.item-count {
    padding-top: 3px;
    margin-right: 3rem;
    font-size: 22px;
}

.btn-add-qty, .btn-less-qty, .halfhalf-plus-quantity, .halfhalf-minus-quantity{
    color: #a57c58;
    background-color: #F9F9FE!important;
    height: 2rem;
    width: 2rem;
    border-radius: 2rem;
}

.btn-add-qty{
    margin-right: 3rem;

}

.btn-less-qty{
    margin-right: 2.5rem;
}

@media (min-width: 768px) {
  #modal-login {
    background: rgba(0,0,0,0.6);
    font-size: 5px;
  }

  #modal-login .modal-header {
    /*height: 10rem !important;*/
  }

  #modal-login .modal-dialog {
    min-height: unset;
    max-height: unset;
    height: auto;
  }

  #modal-login .modal-dialog {
    margin: 0 auto;
    overflow: unset;
    width: 25vw !important;
  }

  #modal-login input {
    padding-left: 2.5rem !important;
    height: 2.5rem;
    font-size: 14px;
  }

  #modal-login .signup-section .btn-group-toggle .btn {
    width: auto !important;
    padding: 0.5rem 1.4rem;
  }

  #modal-login .forgot-section .modal-footer button,
  #modal-login .signup-section .modal-footer button {
    font-family: 'Montserrat-Black';
  }

  #modal-login .forgot-section p {
    /*font-size: 18px;*/
  }
}

/** ALERT MODAL **/
#modal-alert-resp, #modal-confirm-reorder , #modal-error-resp, #sso-modal-error-resp, #nfc-modal-error-resp{
	   /*width: 328px;*/
    /*padding-top: 10%;*/
    /*background: none;*/ /* Fix for extra overlay */
}

#modal-warning-resp .modal-content,
#modal-alert-resp .modal-content,
#modal-confirm-reorder .modal-content,
#modal-promo-resp .modal-content,
#modal-promo-resp-text .modal-content,
#modal-confirm-resp-text .modal-content,
#modal-error-resp .modal-content,
#sso-modal-error-resp .modal-content,
#nfc-modal-error-resp .modal-content
{
  width: 328px;
}

#modal-promo-resp .modal-content{
  width: 95%;
  height: 460px;
}

.modal-header-alert-resp, .modal-header-promo-resp-text, .modal-header-confirm-resp-text, .modal-header-error-resp {
	background: url('../images/modal-alert-bg.png') no-repeat, #fff;
	height: 150px;
}

.header-promo-resp, .modal-header-promo-resp {
    height: 120px;
}

.modal-header-error-resp {
	background: url('../images/modal-error-bg.png') no-repeat, #fff;
}

.modal-header-alert-resp  h5, .modal-header-error-resp h5, .modal-header-promo-resp h5, .modal-header-promo-resp-text h5 {
	color: #fff;
}

#modal-warning-resp #alert_ok,
#modal-alert-resp.cart-invalid #alert_ok,
#modal-promo-resp.cart-invalid #alert_ok,
#modal-alert-resp.abandoned-cart #alert_ok{
  width:100%;
  background-size:100%;
}

.alert-cancel, .alert-ok, .error-ok, .promo-ok-text, .confirm-ok-text{
    width: 130px;
    height: 40px;
    border-radius: 20px;
}

.alert-ok, .promo-ok-text, .confirm-ok-text{
	color: #fff;
	transition: all .5s;
    background-color: #a57c58;
}

.alert-cancel {
	background: #efeff4;
	color: #a57c58;
	transition: all .5s;
}

.error-ok  {
	background: #a57c58;
	color: #fff;
	transition: all .5s;
}

.error-ok:hover  {
	background: #efeff4;
	color: #a57c58;
}

/**.alert-ok:hover {
	background: #efeff4;
	color: #a57c58;
}	

.alert-cancel:hover {
	background-image: url('../images/gradient-bg-btn.png');
	color: #fff;
}**/
@media (max-width: 320px) {
	
#modal-login .no-btn {
    padding: .375rem .5rem !important;
}

#modal-desk-product .btn-less-qty img, .btn-add-qty img {
    width: 30%;
}

.modal-footer button {
    font-size: 10px;
}

.add-item .item-label {
    font-size: 12px;
}

.add-item .item-label:after {
    background-size: 70%;
    margin-left: 0px;
}

.modal-desk {
    height: 320px !important;
}

.item-count {
    padding-left: 0px;
    padding-right: 0px;
}

.add-total h5 {
    padding-left: 5px;
}

}


@media (max-width: 600px) {
    #modal-desk-product .modal-content {
        height: calc(100% - (33px + 1rem)) !important;

    }

.add-qty, .add-total-qty {
    width: unset;
}

.add-total {
    width: 390px;
}

.modal-footer button {
    /*font-size: 0.5rem !important;*/
	/*font-size: 18px !important;*/
}

.modal-desk {
    height: 18rem;
}

#modal-login .signup-newsletter .btn {
   width: auto !important;
}

#modal-login .no-btn {
    padding: .375rem 1.5rem;
}

#modal-promo-resp{
    padding-top: 0% !important;
}

.promo-dialog{
    padding-top: 20%;
}

}

@media (max-width: 414px) and (min-width: 411px) {

#modal-login .no-btn {
    padding: .375rem 3rem;
}

}

@media (max-width: 1024px) and (min-width: 900px) {
#modal-login .modal-dialog {
    width: 34vw !important;
}

}

@media (max-width: 899px) and (min-width: 667px) {
#modal-login .modal-dialog {
    width: 45vw !important;
}

}

@media (max-width: 375px) {

#modal-guest-info input, #modal-login input {
	padding: 0.3rem 1.2rem;
}

#modal-login .modal-content {
	top: -12px;
}

.add-total {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

}
