/* ============================================================================
   Menu (single restaurant) view stylesheet — registered as
   com_deliveryplus.menu in joomla.asset.json, loaded by tmpl/menu/default.php.
   Anything here loads ONLY on the menu view.
   ============================================================================ */


/* -- Landing/header shape (menu arm of the shared `.main-landing` rule
   in template.min.css; landing arm kept there). */
.mainmenu-body .main-landing-shape{
  position:absolute;bottom:0;width:100%;
  height:var(--main-landing-shape-menu-height);
  z-index:1;
  filter:var(--main-landing-shape-filter);
}
.mainmenu-body .main-landing-shape .main-landing-shape-inner{
  display:flex;width:100%;height:100%;
}
.mainmenu-body .main-landing-shape svg{width:100%;}


/* -- Card tags (split from the shared 3-way comma rule in template.min.css
   — restaurants list copy lives in restaurants.css, .rest_coupon_header
   stays in template until coupon/redeem get their own per-view CSS). */
.mainmenu-body .tags{
  position:absolute;top:0;left:0;z-index:1;
  display:flex;height:1.5rem;
  margin-top:-.5rem;margin-left:.75rem;
}
.mainmenu-body .tags .tag{
  position:relative;z-index:2;
  display:flex;align-items:center;
  width:auto;height:100%;
  padding:0 .25rem;margin-right:.5rem;
  background-color:#09cc94;color:#fff;
  font-size:.65rem;line-height:.65rem;font-weight:500;
  border-radius:0 0 .125rem .125rem;
  box-shadow:.0625rem .0625rem .0625rem rgba(0,0,0,.2);
}
.mainmenu-body .tags .tag:before{
  content:"";position:absolute;top:0;left:0;z-index:0;
  width:0;height:0;
  border-bottom:.5rem solid #087556;
  border-left:.25rem solid transparent;
  margin-left:-.24rem;
}
.mainmenu-body .tag.coupon.redeem{background:#ff8600;}
.mainmenu-body .tag.coupon.redeem:before{border-bottom-color:#d16e00;}


/* ============================================================================
   Restaurant info card (menu hero) — same grid as the list-view card
   (mirrors restaurants.css), scoped to .mainmenu-infocard .oneitem. The hero
   chrome (.mainmenu-infocard-outer/-bg/-inner) lives further down; the card here
   carries no padding of its own (the .mainmenu-infocard-inner provides it).
   ============================================================================ */
.mainmenu-body .mainmenu-infocard .oneitem{
  display:grid;width:100%;box-sizing:border-box;
  /* Desktop: col1 = logo (spans 3 rows); col2 = name / address / opening-status;
     col3 = Πληροφορίες / reviews (reviews span rows 2-3 beside the status). Then
     cuisine, the info line and add-review full width. (Mobile drops opening-status
     to its own full-width row lower down — see the @media override.) */
  grid-template-columns:auto 1fr auto;
  grid-template-areas:
    "logo    name     info"
    "logo    address  rating"
    "logo    status   rating"
    "cuisine cuisine  cuisine"
    "rinfo   rinfo    rinfo"
    "addrev  addrev   addrev";
  column-gap:12px;row-gap:3px;align-items:start;
}
.mainmenu-body .mainmenu-infocard .oneitem > .img-container{
  grid-area:logo;align-self:start;justify-self:start;
  display:flex;width:80px;max-width:100%;border-radius:6px;overflow:hidden;
}
/* No logo → drop the logo column entirely (no empty gutter). */
.mainmenu-body .mainmenu-infocard .oneitem.no-logo{
  grid-template-columns:1fr auto;
  grid-template-areas:
    "name     info"
    "address  rating"
    "status   rating"
    "cuisine  cuisine"
    "rinfo    rinfo"
    "addrev   addrev";
}
.mainmenu-body .mainmenu-infocard .oneitem > .img-container img{width:100%;height:auto;opacity:0;}
.mainmenu-body .mainmenu-infocard .oneitem > .rest-name{grid-area:name;}
.mainmenu-body .mainmenu-infocard .oneitem > .moreinfo-toggler{grid-area:info;justify-self:end;}
.mainmenu-body .mainmenu-infocard .oneitem > .rest-address{grid-area:address;}
.mainmenu-body .mainmenu-infocard .oneitem > .review-rest-outer{grid-area:rating;justify-self:end;align-self:start;}
.mainmenu-body .mainmenu-infocard .oneitem > .rest-cuisine{grid-area:cuisine;margin-top:4px;}
.mainmenu-body .mainmenu-infocard .oneitem > .opening-status{grid-area:status;justify-self:start;}
.mainmenu-body .mainmenu-infocard .oneitem > .rest-info{grid-area:rinfo;margin-top:4px;}

/* typography */
.mainmenu-body .mainmenu-infocard .oneitem .rest-name{min-width:0;font-weight:700;font-size:1.0625rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mainmenu-body .mainmenu-infocard .oneitem .rest-address{font-size:.8rem;color:#444;}
.mainmenu-body .mainmenu-infocard .oneitem .rest-cuisine{color:#9b9b9b;font-size:.75rem;text-transform:capitalize;}

/* info line — plain inline text, middot-separated (unchanged) */
.mainmenu-body .mainmenu-infocard .oneitem .rest-info{color:#9b9b9b;font-size:.75rem;}
.mainmenu-body .mainmenu-infocard .oneitem .rest-info > div{display:inline;white-space:nowrap;}
.mainmenu-body .mainmenu-infocard .oneitem .rest-info > div:not(:last-child)::after{content:" · ";}
.mainmenu-body .mainmenu-infocard .oneitem .rest-info .value{margin:0 2px;}

/* reviews — line 2, right (under the Πληροφορίες button): horizontal stars + count. */
.mainmenu-body .review-rest-outer{display:inline-flex;}
.mainmenu-body .mainmenu-infocard .oneitem .review{
  display:flex;flex-direction:column;align-items:flex-end;gap:5px;color:inherit;cursor:pointer;
}
/* line 1 of the reviews block: stars with the count right after them
   (hero card + the more-info popup share this). */
.mainmenu-body .mainmenu-infocard .oneitem .review .rating-row,
.moreinfo-review-rest-outer .review .rating-row{display:inline-flex;align-items:center;gap:5px;}
.mainmenu-body .mainmenu-infocard .oneitem .review .howmany,
.moreinfo-review-rest-outer .review .howmany{font-size:.8rem;line-height:1;color:#6b6b6b;}
/* add-review — full-width button at the very end (icon + label), opening-status border. */
.mainmenu-body .mainmenu-infocard .oneitem > .add-review{
  grid-area:addrev;margin-top:8px;
  display:flex;align-items:center;justify-content:center;gap:8px;
  border:1px solid gray;border-radius:.25rem;padding:2px 8px;background:#fff;
  color:#555;font-size:.825rem;cursor:pointer;text-decoration:none;
  transition:background .15s ease,color .15s ease;
}
.mainmenu-body .mainmenu-infocard .oneitem > .add-review:hover{background:#f5f5f5;color:#111;}
.mainmenu-body .mainmenu-infocard .oneitem > .add-review[hidden]{display:none;}
.mainmenu-body .mainmenu-infocard .oneitem > .add-review svg{flex:0 0 auto;}
.mainmenu-infocard-outer .review-rest-outer .review-more{
  display:inline-flex;align-items:center;gap:5px;
  border:1px solid gray;border-radius:.25rem;padding:4px 8px;background:#fff;
  font-size:.825rem;line-height:1;color:#555;white-space:nowrap;cursor:pointer;
  transition:background .15s ease,color .15s ease;
}
.mainmenu-infocard-outer .review-rest-outer .review-more:hover{background:#f5f5f5;color:#111;}
.mainmenu-infocard-outer .review-rest-outer .review-more span{display:inline;white-space:nowrap;}
/* compact stars (5 × 14px = 70px) — slightly larger for legibility. */
.mainmenu-body .mainmenu-infocard .oneitem .star-rating,
.mainmenu-body .mainmenu-infocard .oneitem .star-rating:before,
.mainmenu-body .mainmenu-infocard .oneitem .star-rating > span{width:70px;height:14px;}
.mainmenu-body .mainmenu-infocard .oneitem .star-rating:before,
.mainmenu-body .mainmenu-infocard .oneitem .star-rating > span:before{background-size:14px;height:14px;}

/* opening-status pill — bordered so it reads as clickable (opens hours popover) */
.mainmenu-body .opt-status-pill{border:1px solid gray;border-radius:.25rem;padding:2px 8px;background:#fff;}
.mainmenu-body .opt-status-pill:hover{background:#f5f5f5;}

/* Order-status banner — top of .mainmenu-outer. Only renders when NOT open
   (the card's opening-status pill carries the "open until …" info). Two looks:
   .closed (neutral + red accent) and .preorder (blue, actionable). The
   "opens in …" countdown is the emphasised piece. */
.mainmenu-outer > .isopen{
  display:flex;align-items:center;gap:12px;
  margin:0 0 1rem;padding:12px 14px;
  background:#f3f4f6;border:1px solid #e5e7eb;
  border-radius:.5rem;overflow-wrap:anywhere;
}
.mainmenu-outer > .isopen .isopen-icon{
  flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;border-radius:50%;background:#fff;color:#6b7280;
}
.mainmenu-outer > .isopen .isopen-icon svg{width:18px;height:18px;}
.mainmenu-outer > .isopen .isopen-body{display:flex;flex-direction:column;gap:2px;min-width:0;}
.mainmenu-outer > .isopen .isopen-header{font-weight:700;font-size:.9rem;color:#1f2937;}
.mainmenu-outer > .isopen .isopen-header span{font-weight:600;font-size:.8rem;}
.mainmenu-outer > .isopen .isopen-text{
  display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px;
  font-size:.8rem;color:#6b7280;
}
.mainmenu-outer > .isopen .isopen-text-desc{font-weight:700;color:#374151;}

/* CLOSED → red icon + countdown draw the eye to "opens in …". */
.mainmenu-outer > .isopen.closed .isopen-icon,
.mainmenu-outer > .isopen.notaccept .isopen-icon{color:#ef4444;background:#fde8e8;}
.mainmenu-outer > .isopen.closed .isopen-text-desc{color:#dc2626;}

/* PREORDER (closed but accepts preorders) → blue, reads as actionable. */
.mainmenu-outer > .isopen.preorder{background:#eff5fe;border-color:#cfe0fb;}
.mainmenu-outer > .isopen.preorder .isopen-icon{color:#2f80ed;background:#dcebfd;}
.mainmenu-outer > .isopen.preorder .isopen-header span{color:#2f80ed;}
.mainmenu-outer > .isopen.preorder .isopen-text-desc{color:#2f80ed;}

@media (max-width:992px){
  .mainmenu-body .main-landing-shape{height:var(--main-landing-shape-menu-mobile-height);}
  .mainmenu-infocard-outer{height:var(--menu-slide-mobile-height);}
  /* Mobile keeps the 3-column shape but moves opening-status down (after the info
     line, before add-review) — shrink the logo + ellipsis the long lines. */
  .mainmenu-body .mainmenu-infocard .oneitem{
    grid-template-areas:
      "logo    name     info"
      "logo    address  rating"
      "cuisine cuisine  cuisine"
      "rinfo   rinfo    rinfo"
      "status  status   status"
      "addrev  addrev   addrev";
  }
  .mainmenu-body .mainmenu-infocard .oneitem.no-logo{
    grid-template-columns:1fr auto;
    grid-template-areas:
      "name     info"
      "address  rating"
      "cuisine  cuisine"
      "rinfo    rinfo"
      "status   status"
      "addrev   addrev";
  }
  .mainmenu-body .mainmenu-infocard .oneitem > .img-container{width:70px;}
  .mainmenu-body .rest-name,
  .mainmenu-body .rest-address,
  .mainmenu-body .rest-cuisine{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  /* opening-status reads as a full-width centred button on mobile. */
  .mainmenu-body .mainmenu-infocard .oneitem > .opening-status{justify-self:stretch;margin-top:8px;}
  .mainmenu-body .opt-status-pill{width:100%;box-sizing:border-box;padding:8px 8px;}
  .mainmenu-body .opt-status-pill-content{width:100%;text-align:center;display:flex;align-items:center;justify-content:center;}
}

@media (max-width:768px){
  .mainmenu-body .mainmenu-infocard{width:calc(100% - 30px);}
}
@media (max-width:680px){
  .mainmenu-body .mainmenu-infocard .mainmenu-infocard-inner{padding:1rem .75rem;}
}

/* Body-state overlays (dp-actas-mode / dp-edit-mode) hide the menu coupons
   widget + infocard while admin is impersonating / editing an order. */
body.dp-actas-mode .mainmenu_coupons_outer_wrapper,
body.dp-actas-mode .mainmenu-infocard-outer{display:none!important;}
body.dp-edit-mode .mainmenu_coupons_outer_wrapper{display:none!important;}


/* -- Restaurant info card (header section on the menu page) -- */
.mainmenu-infocard-outer{
  position:relative;
  display:flex;align-items:center;
  height:var(--menu-slide-height);
  overflow:hidden;
}

/* Inline blurred placeholder behind the hero image — same data URI used
   on the list view (.bg-img-container) so both surfaces share the asset. */
.mainmenu-infocard-bg{
  position:absolute;width:100%;height:100%;
  background-image:url('data:image/jpeg;base64,/9j/4QAYRXhpZgAASUkqAAgAAAAAAAAAAAAAAP/sABFEdWNreQABAAQAAABkAAD/7gAmQWRvYmUAZMAAAAABAwAVBAMGCg0AAAH2AAACKwAAAn0AAALU/9sAhAABAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAgICAgICAgICAgIDAwMDAwMDAwMDAQEBAQEBAQIBAQICAgECAgMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwP/wgARCAAKABQDAREAAhEBAxEB/8QApgAAAQUAAAAAAAAAAAAAAAAAAQQFBgcIAQACAwAAAAAAAAAAAAAAAAAEBgIDBRAAAQIEBQUAAAAAAAAAAAAAAwEEABECEhAhMUEyIjNDFBURAAEBBgcAAAAAAAAAAAAAAAABETFRAkIDcSKCEzNDBBIAAwEBAAAAAAAAAAAAAAAAACAhEWETAAICAQMFAQAAAAAAAAAAAAABETFBIWGREPBRgbFx/9oADAMBAAIRAxEAAAHEk84M2PACL3RBZVZ6tVrQX//aAAgBAQABBQL6L0AUenIKY/bBwe9nyf/aAAgBAgABBQKk1V4nF6Tzhlh//9oACAEDAAEFArOlaEnsThRrH//aAAgBAgIGPwLhi//aAAgBAwIGPwKkX//aAAgBAQEGPwJtq4qriLP6JsyxNxonLqcVOpO0/9oACAEBAwE/IY54+A8hDrIwiZv30CpD9Pdn/9oACAECAwE/IV5yF6gyDplnfT//2gAIAQMDAT8hT0msiKl5Z0//2gAMAwEAAhEDEQAAEByGP//aAAgBAQMBPxBqRSHK3vTJ9xOROq3Z+omrOuznlzK9jsFV9O72Qf/aAAgBAgMBPxBweCMiGcI8o3dYs5nJzR//2gAIAQMDAT8QkHEaWUeObSsG7vJjB//Z');
  background-repeat:no-repeat;background-size:cover;
}
.mainmenu-infocard-bg img{
  width:100%;height:100%;object-fit:cover;opacity:0;
}

.mainmenu-body .mainmenu-infocard{z-index:1;}
.mainmenu-body .mainmenu-infocard-inner{
  display:block;
  background:#fff;border-radius:.25rem;
}
.mainmenu-body .mainmenu-infocard .mainmenu-infocard-inner{padding:1rem;}



/* ============================================================================
   Coupons widget (rendered on the menu page header area)
   ============================================================================ */
.mainmenu_coupons_outer{
  display:inline-flex;width:100%;height:auto;
  overflow-x:scroll;overflow-y:hidden;
  padding:.5rem 0;
  -ms-overflow-style:none;scrollbar-width:none;
}
.mainmenu_coupons_outer::-webkit-scrollbar{display:none;}

/* -- title + loyalty "reward stickers" -- two badges leaning toward
   each other for an intentional playful strip. Same stamp DNA as the
   .main-cuisines .modul-header stamps (lives in mod_smartcuisines). */
.mainmenu_coupons_outer_title{
  display:flex;flex-wrap:wrap;align-items:center;
  gap:.35rem .15rem;
  padding:.9rem .75rem;margin-bottom:20px;
  color:var(--links-color);
  font-size:1.0625rem;font-weight:600;line-height:1.55;
  letter-spacing:-0.005em;
}
.mainmenu_coupons_outer_title #user_coupons,
.mainmenu_coupons_outer_title #user_points{
  display:inline-flex;align-items:center;justify-content:center;
  margin:0 .12rem;padding:5px 11px;
  border-radius:8px;
  background-color:#555;color:#fff;
  font-size:1.3rem;font-weight:900;line-height:.9;
  white-space:nowrap;
}
.mainmenu_coupons_outer_title #user_coupons{
  transform:rotate(-4deg);
  box-shadow:3px 3px 0 0 rgba(0,0,0,.10), 0 6px 14px -6px rgba(0,0,0,.30);
  animation-delay:.05s;
}
.mainmenu_coupons_outer_title #user_points{
  box-shadow:0 3px 0 0 rgba(0,0,0,.10), 0 6px 14px -6px rgba(0,0,0,.30);
  animation-delay:.16s;
}

/* Satisfying pulse when JS rewrites the values (toggle .dp-bump to replay). */
@keyframes dpStampIn{
  0%{opacity:0;transform:rotate(0) scale(.4);}
  70%{opacity:1;transform:rotate(0) scale(1.12);}
}
@keyframes dpValueBump{
  0%,100%{filter:brightness(1);}
  35%{transform:scale(1.18);filter:brightness(1.12);}
}
.mainmenu_coupons_outer_title #user_coupons.dp-bump,
.mainmenu_coupons_outer_title #user_points.dp-bump{
  animation:dpValueBump .45s ease;
}

@media (max-width:960px){
  .mainmenu_coupons_outer_title{
    padding:.75rem;font-size:.9375rem;line-height:1.6;
  }
  .mainmenu_coupons_outer_title #user_coupons,
  .mainmenu_coupons_outer_title #user_points{
    padding:4px 8px;font-size:1.1875rem;
  }
}
@media (prefers-reduced-motion:reduce){
  .mainmenu_coupons_outer_title #user_coupons,
  .mainmenu_coupons_outer_title #user_points,
  .mainmenu_coupons_outer_title #user_coupons.dp-bump,
  .mainmenu_coupons_outer_title #user_points.dp-bump{
    animation:none;transition:none;
  }
}

/* -- coupon cards -- */
.mainmenu_coupons_outer .coupon_item_outer{
  position:relative;
  display:inline-flex;flex-wrap:nowrap;white-space:nowrap;
  width:auto;margin-left:10px;
}
.mainmenu_coupons_outer .coupon_item_outer .coupon_item_outer{width:auto;}
.mainmenu_coupons_outer .coupon_item{
  position:relative;
  display:flex;
  margin:0;
  border:1px solid #f1f1f1;border-radius:.25rem;
  box-shadow:0 1px 1px 0 rgba(0,0,0,.13);
  cursor:pointer;
  transition:all .2s linear;
}
.mainmenu_coupons_outer .coupon_item:hover{
  color:initial;
  box-shadow:0 2px 4px 0 rgba(0,0,0,.13);
}
.mainmenu_coupons_outer .coupon_item_outer .coupon_container{
  display:flex;flex-direction:column;
  padding:1.5rem 1rem 1rem;
  text-align:center;
}
.mainmenu_coupons_outer .promo_outer{
  margin:5px 0 0;
  background:#f1f1f1;
  text-align:center;
}
.mainmenu_coupons_outer .promo_outer .promo{font-weight:bold;}
.mainmenu_coupons_outer .coupon_item_outer .coupon_item_discount_value{font-size:1.5rem;}
.mainmenu_coupons_outer .coupon_item_outer .coupon_item_uses_value,
.mainmenu_coupons_outer .coupon_item_outer .coupon_min_value{
  color:#9b9b9b;font-size:.825rem;
}

/* "Selected" state — outlined with the brand green + tick mark icon. */
.mainmenu_coupons_outer .coupon_item.active{box-shadow:0 0 5px 0 rgb(9,204,148);}
.mainmenu_coupons_outer .coupon_item.active::after{
  content:"";
  position:absolute;top:2px;right:5px;
  width:30px;height:30px;
  background-repeat:no-repeat;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512;'%3E%3Cpath style='fill:%2309cc94;' d='M433.139,67.108L201.294,298.953c-6.249,6.249-16.381,6.249-22.63,0L78.861,199.15L0,278.011 l150.547,150.549c10.458,10.458,24.642,16.333,39.431,16.333l0,0c14.788,0,28.973-5.876,39.43-16.333L512,145.968L433.139,67.108z' /%3E%3Cg style='opacity:0.1;'%3E%3Cpath d='M485.921,119.888L187.59,418.22c-8.254,8.253-18.633,13.882-29.847,16.391c9.363,6.635,20.608,10.28,32.235,10.28l0,0 c14.788,0,28.973-5.876,39.43-16.333L512,145.966L485.921,119.888z'/%3E%3C/g%3E%3C/svg%3E%0A");
}


/* ============================================================================
   MIGRATED from templates/delivery/css/template.min.css below.
   ============================================================================ */

/* ─── Restaurant Menu Items ────────────────────────────────────────────── */
/*******************************
 *
 * Restaurant Menu Items
 *
 ******************************/
/* tip */
.restaurant_tip {
    position: relative;
    display: flex;
    align-items: center;
    padding: 0.75rem;
    margin-bottom: 0.5rem;
    color: #5d5a5a;
    font-size: .875rem;
    box-shadow: 0px 1px 7px 0px rgba(0,0,0,.13);
}

.restaurant_tip_icon{
    display: flex;
    margin-right: 3px;
}

.restaurant_tip_title{
    text-shadow: .5px 0 0 currentColor;
}

/* menu */
.menublock{
    display: block;
    margin:1rem 0;
    line-height: 1.5em;
}
.menublock .menucat-block-outer{
    display: flex;
}

.menublock .menucat-block{
    display: flex;
    flex: 1;
    flex-direction: column;
}
.menublock .menucat-header {
    display: flex;
    flex: 1;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin: 0.5rem 0;
    padding: 0.75rem 1.5rem;
    border-radius: 0.25rem;
    box-shadow: 0 1px 1px 0px rgba(0,0,0,.13);
    background: #f2f2f2;
    cursor: pointer;
}

.menublock .menucat-header .angle-down-icon{
    display: flex;
    align-items: center;
}

.menublock .menucat-description{
    color: #5d5a5a;
    font-size: .875rem;
    margin: -0.5rem 0 0.5rem 0;
    padding: 0.5rem;
    border: 1px dotted #555;
    border-top-width: 0;
    border-radius: 0 0 3px 3px;
}

.menublock .menucat-content .so-onemenuitem {
    flex: 1;
}

.menublock .menucat-content .so-onemenuitem-outer {
    padding: 0.5rem 1.5rem;
    flex: 1;
    border: 1px solid transparent;
    border-radius: 4px;
    transition: border-color .3s ease-out;
    margin: 0 0 -1px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    position: relative;
}

.menublock .menucat-content .so-onemenuitem-outer:not(:last-child){
    border-bottom-color: #e4e4e4;
}

.menublock .menucat-content .so-onemenuitem-outer:hover{
    border-color: #e4e4e4;
    box-shadow: 0 2px 10px #2021250f;
}

/*.so-onemenuitem-outer {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  position: relative;
}*/

.so-onemenuitem.inCart::before {
    content: " ";
    position: absolute;
    background: var(--menu-addtocart-highlight-color);
    top: 1rem;
    left: 0;
    height: calc(100% - 2rem);
    border-radius: 4px;
    width: 4px;
}

.so-onemenuitem-outer .thumb_cont img.thumb{width: 100%;height: auto;object-fit: cover;}

.menublock .menucat-content .so-onemenuitem-upper {
    display: flex;
    flex-direction: row;
}
/*.menublock .menucat-content .so-onemenuitem-upper {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 10px;
}*/

.menublock .menucat-content .so-menuitemcontroller{
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    order: 3;
    flex-wrap: wrap;
    margin-left: auto;
}

.menublock .menucat-content .so-menuitemcontroller .so-menubutton{
    display: block;
    white-space: nowrap;
    color: var(--menu-addtocart-text-color);
    background-color: var(--menu-addtocart-color);
    font-weight: 500;
    border: 1px solid #dfdfdf82;
    border-radius: 4px;
    padding: .35rem .65rem;
    overflow: hidden;
    position: relative;
    cursor: pointer;
    font-size: 0.875rem;
}

.menublock .menucat-content .so-menuitemcontroller .so-menubutton.so-notinstock {filter: grayscale(1);cursor: default;}

.menublock .menucat-content .so-menuitemcontroller .so-menubutton.so-addnew,
.menublock .menucat-content .so-menuitemcontroller .so-menubutton.so-addtopping{
    order: 2;
}

.menublock .menucat-content .so-menuitemprice-desktop,
.menublock .menucat-content .so-menuitemprice,
.cart-outer .cart-mainblock .so-itemselect-price-label{
    width: 60px;
    text-align: right;
    white-space: nowrap;
    max-width: 15%;
    order: 4;
}

.menublock .menucat-content .so-menuitemprice{margin-left: auto;}
.menublock .menucat-content .so-menuitemcontroller ~ .so-menuitemprice{margin-left: unset;}

.so-menubutton.so-edittopping .so-menuitemprice{display: none;}
/*.menublock .menucat-content .so-menuitemprice{
	display: none;
}*/

.menublock .menucat-content .so-menuitemprice span.so-menuitemvirtualprice {
    -webkit-text-decoration-line: line-through;
    text-decoration-line: line-through;
}

.menublock .menucat-content .thumb_cont {
    order: -1;
    display: flex;
    align-items: center;
    border-radius: 8px;
    overflow: hidden;
    margin-right: 1.3rem;
    width: 210px;
}

.menublock .menucat-content .so-addmorebutton{
    margin: 0 5px;
    order: 1;
}

.menublock .menucat-content .so-addmorebutton-controlblock,
.cart-mainblock .so-oneitem-controlblock{
    display: flex;
    align-items: center;
}

.menublock .menucat-content .so-addmorebutton .so-addmore-text {
    margin: 0 5px;
    white-space: nowrap;
    font-size: .875rem;
}
.menublock .menucat-content .so-addmore-itembutton,
.cart-mainblock .so-oneitem-controlblock .so-itembutton{
    display: block;
    width: 35px;
    height: 35px;
    background-size: 15px 15px;
    background-repeat: no-repeat;
    background-position: center;
    background-color: #e9e9ed;
    border-radius: 50%;
    border: none;
    cursor: pointer;
}
.menublock .menucat-content .so-addmorebutton .so-menu-up,
.cart-mainblock .so-oneitem-controlblock .so-itembutton.so-up{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512;' xml:space='preserve'%3E%3Cg%3E%3Cpath d='M492,236H276V20c0-11.046-8.954-20-20-20c-11.046,0-20,8.954-20,20v216H20c-11.046,0-20,8.954-20,20s8.954,20,20,20h216 v216c0,11.046,8.954,20,20,20s20-8.954,20-20V276h216c11.046,0,20-8.954,20-20C512,244.954,503.046,236,492,236z'/%3E%3C/g%3E%3C/svg%3E");
}

.menublock .menucat-content .so-addmorebutton .so-menu-down,
.cart-mainblock .so-oneitem-controlblock .so-itembutton.so-down{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512;' xml:space='preserve'%3E%3Cg%3E%3Cg%3E%3Cpath d='M492,236H20c-11.046,0-20,8.954-20,20c0,11.046,8.954,20,20,20h472c11.046,0,20-8.954,20-20S503.046,236,492,236z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.menublock .menucat-content .so-addmorebutton .so-menu-delete,
.cart-mainblock .so-oneitem-controlblock .so-itembutton.so-delete{
    background-image: url("data:image/svg+xml,%3Csvg fill='%23333333' enable-background='new 0 0 512 512' viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cg%3E%3Cpath d='m424 64h-88v-16c0-26.51-21.49-48-48-48h-64c-26.51 0-48 21.49-48 48v16h-88c-22.091 0-40 17.909-40 40v32c0 8.837 7.163 16 16 16h384c8.837 0 16-7.163 16-16v-32c0-22.091-17.909-40-40-40zm-216-16c0-8.82 7.18-16 16-16h64c8.82 0 16 7.18 16 16v16h-96z'/%3E%3Cpath d='m78.364 184c-2.855 0-5.13 2.386-4.994 5.238l13.2 277.042c1.22 25.64 22.28 45.72 47.94 45.72h242.98c25.66 0 46.72-20.08 47.94-45.72l13.2-277.042c.136-2.852-2.139-5.238-4.994-5.238zm241.636 40c0-8.84 7.16-16 16-16s16 7.16 16 16v208c0 8.84-7.16 16-16 16s-16-7.16-16-16zm-80 0c0-8.84 7.16-16 16-16s16 7.16 16 16v208c0 8.84-7.16 16-16 16s-16-7.16-16-16zm-80 0c0-8.84 7.16-16 16-16s16 7.16 16 16v208c0 8.84-7.16 16-16 16s-16-7.16-16-16z'/%3E%3C/g%3E%3C/svg%3E");
    background-color: unset;
    background-size: 25px 25px;
    margin-left: 5px;
    transition: filter 0.25s linear;
}

/*.cart-mainblock .so-oneitem-controlblock .so-itembutton.so-cart-editnote{
	background-color: unset;
	background-size: 25px 25px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M448 0H64A64.06 64.06 0 0 0 0 64v288a64.06 64.06 0 0 0 64 64h96v84a12 12 0 0 0 19.1 9.7L304 416h144a64.06 64.06 0 0 0 64-64V64a64.06 64.06 0 0 0-64-64zM288 264a8 8 0 0 1-8 8H136a8 8 0 0 1-8-8v-16a8 8 0 0 1 8-8h144a8 8 0 0 1 8 8zm96-96a8 8 0 0 1-8 8H136a8 8 0 0 1-8-8v-16a8 8 0 0 1 8-8h240a8 8 0 0 1 8 8z' fill-opacity='0.4'/%3E%3Cpath d='M280 240H136a8 8 0 0 0-8 8v16a8 8 0 0 0 8 8h144a8 8 0 0 0 8-8v-16a8 8 0 0 0-8-8zm96-96H136a8 8 0 0 0-8 8v16a8 8 0 0 0 8 8h240a8 8 0 0 0 8-8v-16a8 8 0 0 0-8-8z' class='fa-primary'/%3E%3C/svg%3E");
}*/

.menublock .menucat-content .so-menubutton.so-edittopping .so-edittopping-icon{
    display: block;
    width: 25px;
    height: 25px;
    background-repeat: no-repeat;
    background-position: center;
}
.menublock .menucat-content .so-menubutton.so-edittopping .so-edittopping-icon,
.cart-mainblock .so-oneitem-controlblock .so-itembutton.so-cart-edittopping{
    background-color: unset;
    background-size: 25px 25px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M96 352H32l-16 64 80 80 64-16v-64H96zM498 74.26l-.11-.11L437.77 14a48.09 48.09 0 0 0-67.9 0l-46.1 46.1a12 12 0 0 0 0 17l111 111a12 12 0 0 0 17 0l46.1-46.1a47.93 47.93 0 0 0 .13-67.74z' fill-opacity='.4'/%3E%3Cpath d='M.37 483.85a24 24 0 0 0 19.47 27.8 24.27 24.27 0 0 0 8.33 0l67.32-16.16-79-79zM412.3 210.78l-111-111a12.13 12.13 0 0 0-17.1 0L32 352h64v64h64v64l252.27-252.25a12 12 0 0 0 .03-16.97zm-114.41-24.93l-154 154a14 14 0 1 1-19.8-19.8l154-154a14 14 0 1 1 19.8 19.8z'/%3E%3C/svg%3E");
}

.menublock .menucat-content .so-addmorebutton .so-menu-delete:hover,
.cart-mainblock .so-oneitem-controlblock .so-itembutton.so-delete:hover{
    filter: sepia(100%) hue-rotate(-50deg) saturate(1500%) contrast(0.7);
}

.so-menunote-block{margin-top: 10px;}

.so-menunote-block textarea,
.dp-contactblock-noteblock-wrapper textarea,
.addrate-onerow textarea{
    line-height: 1.5rem;
    resize: none;
    box-sizing: border-box;
    width: 100%;
    border-radius: 0.5rem;
    padding: 0.75rem 0.875rem;
    border: 2px solid rgba(32, 33, 37, 0.12);
    transition: border 0.2s linear 0s;
}

.so-menunote-block textarea:focus,
.so-menunote-block textarea:hover,
.dp-contactblock-noteblock-wrapper textarea:focus,
.dp-contactblock-noteblock-wrapper textarea:hover,
.addrate-onerow textarea:focus,
.addrate-onerow textarea:hover{
    outline: none !important;
    border: 2px solid var(--form-field-color);
}

.menublock .menucat-content .so-menudesc {
    font-style: italic;
    color: #5d5a5a;
    font-size: .875rem;
    text-indent: 12px;
    margin-top: 6px;
}

.menublock .menucat-content .so-onemenuitem .so-menuitem-title{
    width: auto;
    display: block;
    float: left;
    font-size: 1.0625rem;
    color: #333;
    order: 2;
    text-shadow: .1px 0 0 currentColor;
    /*flex:1 0 75%;*/
}

.menublock .menucat-content .so-onemenuitem.inCart .so-menuitem-title{
    /*font-weight: 450;*/
}
/*.menublock .menucat-content .so-onemenuitem .so-edittopping .so-menuitem-title{
	flex: 1;
}*/

/*.menublock .menucat-content .so-onemenuitem h3.menuitemhighlight{*/
/*text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.35);*/
/*}*/

.menublock .menucat-content .so-menubutton.so-edittopping{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    /*align-items: center;*/
    flex: 1;
    order: 2;
    margin-bottom: 8px;
}

/*.menublock .menucat-content .so-menuitem-title{
	flex: 1;
}*/

/*.menublock .menucat-content .so-menubutton.so-edittopping .so-menuitem-title{
	flex: unset;
}*/

.menublock .menucat-content .so-onemenuitem-upper .so-menuitem-extras,
.cart-outer .so-oneitem .so-itemselect-extras-label{
    width: 100%;
    font-size: .825rem;
    color: var(--menu-addtocart-toppings-color);
    order: 4;
    cursor: pointer;
}

.cart-outer .so-oneitem .so-itemselect-notes{
    font-size: .825rem;
    cursor: pointer;
}
/*.menublock .menucat-content .so-menubutton.so-edittopping:hover{
	background: #174ea614;
}*/

.menublock .menucat-content .so-menubutton.so-edittopping .so-edittopping-icon{
    display: flex;
    padding-left: 10px;
    order: 3;
}
/*******************************
 * END OF
 * Restaurant Menu Items
 *
 ******************************/

/* ─── Topping block of item ────────────────────────────────────────────── */
/*******************************
 *
 * Topping block of item
 *
 ******************************/

.so-menutopping-block {
    top:0;
    left:0;
    position:fixed;
    height:100%;
    width:100%;
    margin:0;
    z-index:55555;
    pointer-events:none
}
.so-menutopping-block--visible {
    pointer-events:auto
}
.so-menutopping-block-inner {
    top:0;
    left:0;
    position:relative;
    height:75%;
    width:40%;
    max-width: 750px;
    margin:15vh auto;
    background-color:#ffffff;
    z-index:55556;
    -webkit-transform:translateY(-125%);
    transform:translateY(-125%);
    display:flex;
    flex-direction:column;
    will-change:transform;
    pointer-events:auto;
    /*border: 1px solid #dadce0;*/
    box-shadow: rgba(0, 0, 0, 0.06) 0px 0px 1rem 0px, rgba(0, 0, 0, 0.12) 0px 1rem 1rem 0px;
    border-radius: 10px;
}
.so-menutopping-block--visible .so-menutopping-block-inner {
    -webkit-transform:none;
    transform:none
}
.first-menutopping-animation.so-menutopping-block--visible .so-menutopping-block-inner {
    -webkit-transform:none;
    transform:none
}
.menutopping--animatable .so-menutopping-block-inner {
    transition:all 130ms ease-in;
}
.so-menutopping-block--visible.menutopping--animatable .so-menutopping-block-inner {
    transition:all 330ms ease-out;
}
.so-menutopping-block-item-top {
    display:inline-flex;
    width:100%;
    height:65px;
    box-shadow:inset 0 -1px #dfdfdf;
    align-content:center
}
.so-menutopping-block-item-content {
    bottom:65px;
    top:65px;
    overflow-y:auto;
    position:absolute;
    width:100%;
    background: #f7f7f7;
}
.so-menutopping-block-item-bottom {
    height:65px;
    position:absolute;
    width:100%;
    bottom:0;
    left:0;
    display:inline-flex;
    align-content:center;
    box-shadow:inset 0 1px #dfdfdf;
    cursor: pointer;
}

.so-menutopping-block-item-img{display: block;opacity: 1;will-change: opacity;margin-bottom: 15px;}
.so-menutopping-block-item-img img{
    display: block;
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: 50% 50%;
    max-height: 350px;
}

.so-menutopping-block-item-content-inner{
    display: block;
    overflow: auto;
}

.so-menutopping-block-item-notes{
    display: block;
    margin: 10px 10px 0;
}

.so-menutopping-block-addmore-note {
    display: block;
    margin: 10px;
    text-align: center;
    font-size: 0.75rem;
    color: rgb(155, 155, 155);
    line-height: 1.4rem;
}

.so-menutopping-block-item-name {
    flex:1;
    margin-left:10px;
    font-size:1.2rem;
    align-self:center;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    line-height: 1.25rem;
}
.so-menutopping-block-item-price {
    width:15%;
    text-align:center;
    align-self:center;
    font-size: 0.875rem;
}
.so-menutopping-block-item-top .close-btn-outer{
    position: relative;
    display: flex;
    align-items: center;
    left: 0;
}
.so-menutopping-block-remove {
    width:auto;
    color:#cf1717;
    text-align:center;
    margin:0 5px;
    align-self:center;
    cursor: pointer;
}
.so-menutopping-block-remove-icon,
.so-menutopping-block-update-icon {
    display: flex;
    justify-content: center;
    align-items: center;
}
.so-menutopping-block-remove-text,
.so-menutopping-block-update-text{
    font-size: 0.825rem;
}
.so-menutopping-block-item-selections {
    align-self:center;
    flex:1;
    font-size: .825rem;
    height:62px;
    margin-top: 3px;
    margin-left:10px;
    overflow:auto;
    line-height: 1.15rem;
}
.so-menutopping-block-item-selections-title{
    text-shadow: .1px 0 0 currentColor;
}
.so-menutopping-block-update {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width:auto;
    color:#25c682;
    text-align:center;
    margin:0 5px
}
.so-menutopping-category {
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
    width:98%;
    overflow:auto;
    margin:0 auto;
    overflow:hidden
}
.so-menutopping-category .so-menutopping-category-text{
    font-size:1.125rem;
}

.so-menutopping-onetopping {
    display: flex;
    align-items: center;
    width:44%;
    height:auto;
    overflow:hidden;
    float:left;
    padding:0 1%;
    margin:5px 2%;
    background-color:#fff;
    box-shadow:0 2px 4px 0 rgba(0,0,0,.13);
    border-radius:4px;
    cursor: pointer;
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE10+/Edge */
    user-select: none; /* Standard */
}
.so-menutopping-block .so-menutopping-onetopping input {
    width:16px;
    height:16px;
}
/*.so-menutopping-block .so-menutopping-onetopping:has(> input:disabled) {
	cursor: not-allowed;
}*/
.so-menutopping-block .toppingcheckboxlabel {
    display: flex;
    flex: 1;
    overflow:auto;
    padding:10px 0;
}
.so-menutopping-block .toppingname {
    display:block;
    line-height:16px;
    padding: 0 8px;
    flex: 1;
}
.so-menutopping-block .toppingprice {
    display:block;
    line-height:16px;
}

.so-menutopping-block .max-selections{
    width: 100%;
    color: #5d5a5a;
    font-size: 0.875rem;
    line-height: 1.25rem;
}
/*.so-menutopping-block .required-alert::before {
 border-bottom:5px solid transparent;
 border-right:5px solid #c62828;
 border-top:5px solid transparent;
 content:"";
 display:inline-block;
 height:0;
 left:-5px;
 position:absolute;
 top:9px;
 width:0
}*/
.so-menutopping-block .required-alert {
    display: inline-flex;
    height: 23px;
    width:auto;
    max-width:250px;
    right:0;
    top:0;
    align-items: center;
    font-weight:400;
    background-color:#c62828;
    border-radius:2px;
    color:#fff;
    font-size:.875rem;
    margin-left:15px;
    padding:2px 6px;
    pointer-events:none;
    position:relative;
    white-space:nowrap;
    opacity:1;
    transition:all .2s linear
}

.so-menutopping-block .how-many-free {
    display: inline-flex;
    height: 23px;
    width:auto;
    max-width:250px;
    right:0;
    top:0;
    align-items: center;
    font-weight:400;
    background-color: #1e88e5;
    border-radius:2px;
    color:#fff;
    font-size:.875rem;
    margin-left:15px;
    padding:2px 6px;
    pointer-events:none;
    position:relative;
    white-space:nowrap;
    opacity:1;
    transition:all .2s linear
}

.so-menutopping-block .hide-alert {
    max-width:0;
    opacity:0;
    margin-left:0;
    padding: 0;
}
/*******************************
 * END OF
 * Topping block of item
 *
 ******************************/

/* ─── Restaurant Cart Block ────────────────────────────────────────────── */
/*******************************
 *
 * Restaurant Cart Block
 *
 ******************************/
.so-block-full {
    height: 100%;
    top: 0;
}
.so-block-full .cart-inner {
    height: 100%;
}

.so-block-full .cart-mainblock {
    height: 100%;
}

.cart-outer {
    margin:0;
    position:fixed;
    width:100%;
    height:auto;
    padding:0;
    bottom:0;
    left:0;
    z-index:55551;
    pointer-events:none;
    overflow:hidden;
    pointer-events:none
}

.cart--visible {
    pointer-events:auto;
    overflow:visible
}

.cart-inner {
    background-color:#fff;
    position:relative;
    width:100%;
    height:auto;
    -webkit-transform:translateY(100%);
    transform:translateY(100%);
    display:flex;
    flex-direction:column;
    will-change:transform;
    z-index:55552;
    pointer-events:auto;
    overflow: auto;
}

/* throws up just header of cart */
.cart-header--visible .cart-inner {
    -webkit-transform:translateY(calc(100% - 41px));
    transform:translateY(calc(100% - 41px))
}
@media (max-width :992px) {
    .cart-header--visible .cart-inner {
        -webkit-transform:translateY(calc(100% - 55px));
        transform:translateY(calc(100% - 55px))
    }
}

/*.cart-full .cart-inner {
	height: 100%;
}*/

.cart--visible .cart-inner {
    -webkit-transform: none;
    transform: none;
}

.cart--animatable .cart-inner {
    transition: transform 130ms ease-in;
}

.cart--visible.cart--animatable  .cart-inner {
    transition: transform 330ms ease-out;
}

/* upper block - cart header */
.cart-outer .cart-upperblock{
    display: inline-flex;
    align-items: center;
    overflow: hidden;
    color: var(--cart-upperblock-text-color);
    background-color: var(--cart-upperblock-color);
    height: 41px;
    margin-top: 0;
    cursor: pointer;
    padding: 0 15px;
    min-height: 41px;
}

.cart-outer #total-upperblock-icon-before {
    align-self:center;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.cart-outer #total-upperblock-items-counter {
    font-size:.75rem;
    background-image:linear-gradient(45deg,#c6282873,#c62828 ,#c62828);
    width:16px;
    line-height:16px;
    text-align:center;
    color:#fff;
    z-index:2;
    border-radius:50%;
    position:absolute;
    left: 16px;
    top: -6px;
}

.cart-outer .cart-upperblock .total-upperblock-text{
    flex: 1;
    margin:0 10px;
    display: flex;
    flex-direction: row;
}

.cart-outer .cart-upperblock .total-upperblock-soprice-outer{
    margin: 0 10px 0 5px;
    white-space: nowrap;
}

.cart-outer .cart-upperblock .so-total > span {
    white-space: nowrap;
}

.cart-outer .cart-upperblock .so-price{
    font-weight: 600;
}

.cart-outer #total-upperblock-icon{
    display: flex;
    align-items: center;
}
/* bottom block - cart footer */
.cart-outer .cart-bottomblock{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 5px 0;
    width: 100%;
    height: 50px;
    overflow: hidden;
    bottom: 0;
    background: #eee;
}

.cart-bottom{
    display: flex;
}

.cart-outer .so-itemselect,
.cart-outer .so-toppingselect,
.cart-outer .so-oneitem.default,
.cart-outer .so-onetopping {
    display: none;
}

.cart-outer .so-oneitem {
    display: flex;
    margin: 0px 15px;
    padding: 10px 0;
}

.cart-outer .so-oneitem:not(:first-child) {
    border-top: 1px solid #f4f4f4;
}

.cart-outer .so-oneitem .so-pcs{
    outline: none;
    border: none;
    width: 40px;
    text-align: center;
    margin: 0 5px;
}

.cart-outer .so-oneitem .so-itemselect-label-outer{
    flex: 1;
}

.cart-outer .cart-mainblock{
    overflow: auto;
}
.cart-outer .cart-mainblock .so-totalblock{
    display: flex;
    justify-content: space-between;
    flex-direction: row;
    align-items: center;
    padding: 10px 15px;
    position: relative;
}

.cart-outer .cart-mainblock .so-totalblock-left{
    flex: 1;
    display: flex
}

.cart-outer .cart-mainblock .so-totalblock-middle{
    display: flex
}

.cart-outer .cart-mainblock .so-totalblock-right{
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.cart-outer .cart-mainblock .so-totalblock .so-total {
    text-transform: uppercase;
    display: flex;
    flex-direction: row;
}

.cart-outer .cart-mainblock .so-totalblock .so-total .total-upperblock-soprice-outer{
    margin-right: 5px;
}

.cart-outer .cart-mainblock .so-totalblock .so-total .so-price{
    font-weight: bold;
}

.cart-outer .cart-mainblock .total-upperblock-platformfee-outer{
    font-size: 0.85rem;
    text-transform: uppercase;
}

.cart-outer .cart-mainblock .so-totalblock .so-notification{
    white-space: normal;
    text-align: center;
    background-color: #efefef;
    border-radius: 4px;
    font-size: .975rem;
    padding: .4rem 2rem;
    overflow: hidden;
    display: flex;
    align-items: center;
    flex-direction: row;
}

.cart-outer .cart-mainblock .so-totalblock .so-notification-sign {
    font-size: 1.75rem;
    line-height: 28px;
    color: #888;
    font-weight: 900;
}

.cart-outer .so-notification-text {
    margin-left: 10px;
}

.cart-outer .cart-contactblock{
    position: relative;
    padding: 30px 20px 35px;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.cart-outer .cart-contactblock::before,
.cart-outer .cart-contactblock::after {
    opacity: 0.6;
    background-image: linear-gradient(135deg, #fff 25%, transparent 25%), linear-gradient(225deg, #fff 25%, #0000 25%), linear-gradient(45deg, #fff 25%, transparent 25%), linear-gradient(315deg, #fff 25%, #e4e4e4 25%);
    background-position: 10px 0, 10px 0, 0 0, 0 0;
    background-size: 20px 20px;
    height: 20px;
    background-repeat: repeat-x;
    content: " ";
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
}

.cart-mainblock .so-totalblock{
    border-top: 1px solid #e4e4e4;
}

.cart-outer #so-ordernow{
    white-space: nowrap;
    color: var(--cart-ordernow-btn-text-color);
    background-color: var(--cart-ordernow-btn-color);
    font-weight: 500;
    border: 1px solid #dfdfdf82;
    border-radius: 4px;
    font-size: .975rem;
    padding: .6rem 2rem;
    overflow: hidden;
    position: relative;
    cursor: pointer;
}

.cart-outer #so-ordernow span.label{
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 50vw;
}

.cart-outer .dp-contactblock-inner{
    display: flex;
    flex-direction: row;
}

.cart-outer .dp-contactblock-fieldblock{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 60%;
}

.cart-outer .dp-contactblock-noteblock{
    flex: 1;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.cart-outer .dp-contactblock-noteblock .dp-contactblock-noteblock-wrapper{
    margin: 0 10px;
    padding: 15px 0;
    width: 100%;
}

.cart-outer .dp-contactblock-noteblock .form_group_wrapper_label{display: none;}

.cart-outer .dp-contactblock-noteblock .dp-contactblock-noteblock-wrapper textarea{
    height: 100%;
    border-radius: 4px;
}
.form_group_wrapper_label{
    font-weight: bold;
    font-size: 0.875rem;
}
.cart-outer .contact-row,
.cart-outer .form_group_wrapper,
.cart-outer .dp-register-hint,
.form_group_wrapper_label{
    width: 100%;
}
.cart-outer .form_group_wrapper{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin-top: 15px;
}
.cart-outer .contact-row.half-column{
    flex-basis:50%;
    flex-grow: 1;
}

.cart-outer .contact-row .form__group{
    margin: 0 10px;
}
.cart-outer .contact-row .list-select-outer{
    margin-top: 15px;
}
.cart-outer .contact-row .list-select-outer select{
    flex: 1;
}

#contact-address-wrapper {
    margin: 15px 10px 0 10px;
}

.contact-address {
    display: flex;
    align-items: center;
    flex-direction: row;
    padding: 10px 15px;
    background: #eee;
    cursor: pointer;
    border: 1px solid #d2d2d2;
    border-radius: 4px;
    transition: border-color 0.2s;
}

.contact-address.error {
    border-color: #d93025;
}

#so-change-address-icon{
    display: flex;
    margin-right: 10px;
}

.contact-address #so-change-address-icon svg.address-error-icon,
.contact-address.error #so-change-address-icon svg.address-ok-icon
{
    display: none;
}

.contact-address.error #so-change-address-icon svg.address-error-icon,
.contact-address #so-change-address-icon svg.address-ok-icon{
    display: block;
}

#so-change-address-label{
    flex: 1 1 0%;
    display: flex;
    flex-direction: column;
    width: calc(100% - 10px);
}

#so-change-address-label-header{
    flex: 1 1 0%;
    width: 100%;
    color: rgb(51, 51, 51) !important;
    font-size: 0.875rem;
    font-weight: 700;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

#so-change-address-label-desc{
    flex: 1 1 0%;
    width: 100%;
    color: rgb(155, 155, 155) !important;
    font-size: 0.75rem;
    font-weight: 400;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

/* coupon field */
#dp-contact-coupon-value{
    position: absolute;
    top: 42%;
    right: 15px;
    display: flex;
    font-weight: bold;
}
#dp-contact-coupon{
    background-repeat: no-repeat;
}

#dp-contact-coupon.checking {
    background-image: url("data:image/svg+xml;charset=UTF-8, %3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='xMidYMid'%3e%3ccircle cx='50' cy='50' fill='none' stroke='%23000000' stroke-width='6' r='35' stroke-dasharray='164.93361431346415 56.97787143782138'%3e%3canimateTransform attributeName='transform' type='rotate' repeatCount='indefinite' dur='1s' values='0 50 50;360 50 50' keyTimes='0;1'%3e%3c/animateTransform%3e%3c/circle%3e%3c/svg%3e");
    background-position: calc( 100% - 20px) 50%;
    background-size: 28px;
}
#dp-contact-coupon.checkingsuccess {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512;'%3E%3Cpath style='fill:%23A5EB78;' d='M433.139,67.108L201.294,298.953c-6.249,6.249-16.381,6.249-22.63,0L78.861,199.15L0,278.011 l150.547,150.549c10.458,10.458,24.642,16.333,39.431,16.333l0,0c14.788,0,28.973-5.876,39.43-16.333L512,145.968L433.139,67.108z' /%3E%3Cg style='opacity:0.1;'%3E%3Cpath d='M485.921,119.888L187.59,418.22c-8.254,8.253-18.633,13.882-29.847,16.391c9.363,6.635,20.608,10.28,32.235,10.28l0,0 c14.788,0,28.973-5.876,39.43-16.333L512,145.966L485.921,119.888z'/%3E%3C/g%3E%3C/svg%3E%0A");
    text-indent: 33px;
    background-position: 10px 50%;
    background-size: 26px;
}
#dp-contact-coupon.checkingerror {
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 365 365' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23f44336'%3E%3Cpath d='m356.339844 296.347656-286.613282-286.613281c-12.5-12.5-32.765624-12.5-45.246093 0l-15.105469 15.082031c-12.5 12.503906-12.5 32.769532 0 45.25l286.613281 286.613282c12.503907 12.5 32.769531 12.5 45.25 0l15.082031-15.082032c12.523438-12.480468 12.523438-32.75.019532-45.25zm0 0'/%3E%3Cpath d='m295.988281 9.734375-286.613281 286.613281c-12.5 12.5-12.5 32.769532 0 45.25l15.082031 15.082032c12.503907 12.5 32.769531 12.5 45.25 0l286.632813-286.59375c12.503906-12.5 12.503906-32.765626 0-45.246094l-15.082032-15.082032c-12.5-12.523437-32.765624-12.523437-45.269531-.023437zm0 0'/%3E%3C/g%3E%3C/svg%3E");
    background-position: calc( 100% - 20px) 50%;
    background-size: 20px;
}
#dp-contact-coupon.checkingexclamation {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M258.3,372h-4.5a55,55,0,0,1-54.9-51.8l-15.3-262A55.06,55.06,0,0,1,238.5,0h35.2a55.06,55.06,0,0,1,54.9,58.2l-15.3,262a55.17,55.17,0,0,1-55,51.8Z' style='fill:%23ff674f'/%3E%3Cpath d='M258.3,372a55,55,0,0,0,54.9-51.8l15.3-262a54.65,54.65,0,0,0-14.9-40.9A55.56,55.56,0,0,0,273.6,0H256V372Z' style='fill:%23f2472c'/%3E%3Cpath d='M256,512a55,55,0,1,1,55-55A55.1,55.1,0,0,1,256,512Z' style='fill:%23ff674f'/%3E%3Cpath d='M256,402V512a55,55,0,0,0,0-110Z' style='fill:%23f2472c'/%3E%3C/svg%3E");
    background-position: 10px 50%;
    background-size: 26px;
    text-indent: 26px;
}

.contact-when-info{
    display: none;
    position: absolute;
    top: 0px;
    right: 5px;
    background: #fff;
    padding: 0 3px;
    align-items: center;
}

.contact-when-info-msg{
    font-size: 0.7rem;
}

#dp-contact-when.error ~ .contact-when-info{
    display: flex;
    color: #d93025;
}

#dp-contact-when.info ~ .contact-when-info{
    display: flex;
}

#total-upperblock-icon svg,.angle-down-icon svg{transition: all 0.15s linear;}
.icon-rotate-180 svg{
    -webkit-transform : rotate(-180deg);
    -moz-transform : rotate(-180deg);
    -ms-transform : rotate(-180deg);
    transform : rotate(-180deg);
}
.icon-rotate180 svg{
    -webkit-transform : rotate(180deg);
    -moz-transform : rotate(180deg);
    -ms-transform : rotate(180deg);
    transform : rotate(180deg);
}

.so-thank-text{
    font-size:1rem;
    padding: 10px 5px 15px 5px;
    text-align: center;
}

.so-thank-head{
    font-size:1rem;
}
/*******************************
 * END OF
 * Restaurant Cart Block
 *
 ******************************/

/* ─── Check + Radio Boxes (cart toppings) ──────────────────────────────── */
/*******************************
 *
 * Check and Radio Boxes
 *
 ******************************/
.so-onemenuitem input[type="radio"] {
    /* Add if not using autoprefixer */
    -webkit-appearance: none;
    /* Remove most all native input styles */
    appearance: none;
    /* For iOS < 15 */
    /*background-color: var(--checkbox-color);*/
    /* Not removed via appearance */
    margin: 0;

    font: inherit;
    color: var(--checkbox-color);
    width: 22px !important;
    height: 22px !important;
    border: 0.15em solid var(--checkbox-color-before);
    border-radius: 50%;
    transform: translateY(-0.075em);

    display: grid;
    place-content: center;
    transition: 120ms all ease-in-out;
}

.so-onemenuitem input[type="radio"]::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    transform: scale(0);
    transition: 240ms transform ease-in-out;
    box-shadow: inset 1em 1em #fff;
    /* Windows High Contrast Mode */
    background-color: CanvasText;
}

/*.so-menutopping-onetopping:hover input[type="radio"]{
	border-color: var(--checkbox-color);
}*/

.so-onemenuitem input[type="radio"]:checked {
    border-color: var(--checkbox-color);
    background-color: var(--checkbox-color);
}

.so-onemenuitem input[type="radio"]:checked::before {
    transform: scale(1);
}

/*input[type="radio"]:focus {
  outline: max(2px, 0.15em) solid currentColor;
  outline-offset: max(2px, 0.15em);
}*/


.so-onemenuitem input[type="checkbox"] {
    /* Add if not using autoprefixer */
    -webkit-appearance: none;
    /* Remove most all native input styles */
    appearance: none;
    /* For iOS < 15 */
    /*background-color: var(--checkbox-color);*/
    /* Not removed via appearance */
    margin: 0;

    font: inherit;
    color: var(--checkbox-color);
    width: 22px !important;
    height: 22px !important;
    border: 0.15em solid var(--checkbox-color-before);
    border-radius: 0.15em;
    transform: translateY(-0.075em);
    transition: 120ms all ease-in-out;
    display: grid;
    place-content: center;
}

.so-onemenuitem input[type="checkbox"]::before {
    content: "";
    width: 12px;
    height: 12px;
    clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
    transform: scale(0);
    /*transform-origin: bottom left;*/
    transform-origin: center center;
    transition: 240ms all ease-in-out;
    box-shadow: inset 1em 1em #fff;
    /* Windows High Contrast Mode */
    background-color: CanvasText;
}

/*.so-menutopping-onetopping:hover input[type="checkbox"]{
border-color: var(--checkbox-color);
}*/

.so-onemenuitem input[type="checkbox"]:checked {
    border-color: var(--checkbox-color);
    background-color: var(--checkbox-color);
}

.so-onemenuitem input[type="checkbox"]:checked::before {
    transform: scale(1);
}

/*input[type="checkbox"]:focus {
  outline: max(2px, 0.15em) solid currentColor;
  outline-offset: max(2px, 0.15em);
}*/

.so-onemenuitem input[type="checkbox"]:disabled {
    --checkbox-color: var(--checkbox-color-disabled);
    color: var(--checkbox-color-disabled);
    background: rgba(32, 33, 37, 0.12);
    cursor: not-allowed;
}


/* Safari 9+, < 13.1 */
@supports (-webkit-marquee-repetition:infinite) and (object-fit:fill) {

    .so-onemenuitem input[type="checkbox"]:before {
        display: none;
    }

    .so-onemenuitem input[type="checkbox"]:checked {
        border-color: var(--checkbox-color);
        background-color: var(--checkbox-color);
        accent-color: var(--checkbox-color);

    }

    .so-onemenuitem input[type="checkbox"] {
        -webkit-appearance: checkbox;
        appearance: checkbox;
    }
}
/*******************************
 * END OF
 * Check and Radio Boxes
 *
 ******************************/


/* ─── Add rating / review popup ────────────────────────────────────────── */
/*******************************
 *
 * Add rating
 *
 ******************************/

/*******************************
 * Add rating (review popup) — grayscale + minimal.
 * Accent = template --form-field-color (same as other forms).
 * Stars keep their original .add-star-rating rules above.
 ******************************/
.addrate-container,
.feedback-container{
    --r-ink:#222; --r-mut:#7a7a7a; --r-line:#e2e2e2; --r-soft:#f6f6f6;
    --r-accent:var(--form-field-color,#1a73e8);
    color:var(--r-ink);
}
.addrate-container{ padding:6px 2px; margin:6px 0; }

.addrate-container-header{
    text-align:center; font-size:clamp(20px,4vw,26px);
    line-height:1.25; font-weight:700; color:var(--r-ink); margin-bottom:22px;
}
.addrate-container-header span{ display:block; margin-top:3px; color:var(--r-mut); font-weight:600; }

.addrate-onerow{
    display:flex; justify-content:center; margin-bottom:14px;
}

.addrate-container input[type="text"],
.addrate-container textarea,
.addrate-container select{
    width:100%; box-sizing:border-box; font:inherit; color:var(--r-ink);
    background:#fff; border:1.5px solid var(--r-line); border-radius:12px;
    padding:13px 16px; outline:0; transition:border-color .18s,box-shadow .18s;
}
.addrate-container textarea{ min-height:104px; resize:vertical; line-height:1.55; }
.addrate-container input[type="text"]::placeholder,
.addrate-container textarea::placeholder{ color:var(--r-mut); }
.addrate-container input[type="text"]:focus,
.addrate-container textarea:focus,
.addrate-container select:focus{
    border-color:var(--r-accent);
    box-shadow:0 0 0 3px rgba(0,0,0,.06);
}
.list-select-header{
    font-size:12px; font-weight:600; letter-spacing:.05em;
    text-transform:uppercase; color:var(--r-mut); margin-bottom:6px;
}

#send-review{
    display:flex; align-items:center; justify-content:center;
    width:100%; box-sizing:border-box; padding:14px 22px; cursor:pointer;
    font-weight:600; font-size:15px; color:#fff; background:var(--r-ink);
    border:0; border-radius:12px; white-space:nowrap;
    transition:background .15s,transform .12s;
}
#send-review:hover{ background:#000; }
#send-review:active{ transform:translateY(1px); }

/* Outlined button so it reads as a control; content perfectly centred
   (button-scoped so the inner chevron <span> isn't bordered/padded). */
button.reviewGoBack{
    display:inline-flex; align-items:center; justify-content:center; gap:6px;
    margin:8px auto 2px; padding:11px 22px; cursor:pointer;
    font:inherit; font-weight:600; line-height:1;
    color:#7a7a7a;
    background:#fff;
    border:1.5px solid #e2e2e2; border-radius:11px;
    transition:color .15s, border-color .15s, background .15s;
}
button.reviewGoBack:hover{
    color:#222;
    border-color:#c4c4c4;
    background:#f6f6f6;
}
span.reviewGoBack{
    display:inline-flex; align-items:center; justify-content:center;
    font-size:1.15rem; line-height:1; margin:0;
    padding:0; border:0; background:none;
}

.feedback-container{ display:none; }
.feedback-container .feedback{
    text-align:center; padding:26px 20px; line-height:1.5;
    background:var(--r-soft); border:1px solid var(--r-line); border-radius:14px;
}
.feedback-container .feedback p{ margin:0; }
/*******************************
 * END OF Add rating
 ******************************/



/* ─── so-thank + dp-contactblock-inner-ok ───────── */
/* NOTE: .so-loading-status-block* moved to template.css — it's injected by
   deliveryplus.js on EVERY page (order-status polling), not just the menu
   view, so its CSS must be global. */
.so-thank-outer{
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.dp-contactblock-inner-ok{
    display: flex;
    flex-direction: column;
    padding: 20px 10px 15px 10px;
    overflow:hidden;
}

.dp-contactblock-inner-ok-header{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

/* ─── Order-complete card polish: centered success + receipt store info ── */
.dp-contactblock-inner-ok{
    max-width: 440px;
    margin: 0 auto;
    gap: 2px;
}
.so-thank-head{
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.3;
    color: var(--dp-ink, #1f2937);
}
.so-thank-text{
    color: var(--dp-ink-soft, #6b7280);
    line-height: 1.5;
    max-width: 40ch;
    margin: 0 auto;
}
.dp-contactblock-inner-ok-store-info{
    margin-top: 10px;
    padding: 4px 16px;
    text-align: left;
    background: var(--dp-paper, #f4f4f5);
    border: 1px solid var(--dp-paper-edge, #d4d4d8);
    border-radius: .6rem;
    font-size: .95rem;
    line-height: 1.45;
    color: var(--dp-ink, #1f2937);
}
.dp-contactblock-inner-ok-store-info > div{
    padding: 9px 0;
    border-bottom: 1px solid var(--dp-paper-2, #e4e4e7);
}
.dp-contactblock-inner-ok-store-info > div:last-child{
    border-bottom: 0;
}
.dp-contactblock-inner-ok-store-info strong,
.dp-contactblock-inner-ok-store-info b{
    font-weight: 600;
    color: var(--dp-ink-soft, #6b7280);
}
.dp-contactblock-inner-ok-store-info a{
    color: var(--dp-pay-accent, #0e7c5b);
    text-decoration: none;
}
.dp-contactblock-inner-ok-store-info a:hover{
    text-decoration: underline;
}
.dp-contactblock-inner-ok-store-info .showOnMap{
    display: inline-block;
    margin-top: 3px;
    font-size: .85rem;
    font-weight: 600;
}
#order_done_total{
    font-weight: 700;
    color: var(--dp-pay-accent, #0e7c5b);
}


/* ─── Menu chrome (banners, dp-paysummary, dp-edit-mode, ghosts, etc.) ─── */
.menu-actas-banner{position:sticky;top:0;z-index:31;display:flex;align-items:center;gap:12px;padding:10px 14px;margin:0 0 14px 0;border-radius:.25rem;background:linear-gradient(135deg,#fde8e8 0%,#fbd0d0 100%);border:1px solid #e09b9b;box-shadow:0 1px 2px 0 rgba(0,0,0,.07);color:#7a1f1f}
.menu-actas-banner-icon{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:#c0392b;color:#fff}
.menu-actas-banner-text{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px;line-height:1.3}
.menu-actas-banner-text strong{font-size:13.5px;color:#5b1818;font-weight:700;text-transform:uppercase;letter-spacing:.04em;display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
.menu-actas-banner-text span{font-size:12.5px;color:#7a1f1f;font-variant-numeric:tabular-nums}
.menu-actas-banner-badge{display:inline-block;padding:2px 8px;font-size:10.5px;font-weight:700;letter-spacing:.06em;line-height:1.4;color:#fff;background:#c0392b;border-radius:999px;text-transform:uppercase;white-space:nowrap}
.menu-actas-banner--guest .menu-actas-banner-badge,
.menu-actas-banner-badge.menu-actas-banner-badge--guest{background:#c47a3a}
/* When the badge is rendered inside the consolidated edit banner
   (act-as-edit: one banner with "as <customer> [Badge]" suffix),
   `.menu-edit-banner-text span` (specificity 0,0,1,1) was stripping
   the badge's white color and pill background. Re-assert with a
   2-class selector that wins. */
.menu-edit-banner-text .menu-actas-banner-badge{color:#fff;background:#c0392b}
.menu-edit-banner-text .menu-actas-banner-badge--guest{background:#c47a3a}
.menu-edit-banner--join .menu-edit-banner-text .menu-actas-banner-badge{background:#1c5db8}
.menu-actas-banner--guest{background:linear-gradient(135deg,#f5e8e0 0%,#e8d2c2 100%);border-color:#c89070;color:#6b3a1a}
.menu-actas-banner--guest .menu-actas-banner-icon{background:#c47a3a}
.menu-actas-banner--guest .menu-actas-banner-text strong{color:#5a2f15}
.menu-actas-banner--guest .menu-actas-banner-text span{color:#6b3a1a}
.menu-actas-banner-cancel{flex:0 0 auto;display:inline-flex;align-items:center;padding:6px 12px;font-size:12.5px;font-weight:600;color:#7a1f1f;background:transparent;border:1px solid #c0392b;border-radius:4px;text-decoration:none;cursor:pointer;transition:background .18s ease,color .18s ease}
.menu-actas-banner-cancel:hover{background:#c0392b;color:#fff;text-decoration:none}
.menu-actas-banner--guest .menu-actas-banner-cancel{color:#6b3a1a;border-color:#c47a3a}
.menu-actas-banner--guest .menu-actas-banner-cancel:hover{background:#c47a3a;color:#fff}
/* .mainmenu_coupons_outer_wrapper + .mainmenu-infocard-outer arms moved to menu.css */
body.dp-actas-mode #dp-contact-coupon-wrapper,
body.dp-actas-mode #user_points,
body.dp-actas-mode .so-redeem,
body.dp-actas-mode .redeem-coupon,
body.dp-actas-mode .top-header,
body.dp-actas-mode #footer-inner{display:none!important}
.so-ghosts-block{margin:0 0 8px 0;padding:6px 8px 4px 8px;background:linear-gradient(180deg,#fef6f6 0%,#fdebeb 100%);border:1px dashed #d8a8a8;border-radius:.4rem}
.so-oneitem--ghost{display:flex;align-items:center;gap:10px;padding:6px 8px;background:rgba(255,255,255,.55);border:1px solid #e6cccc;border-radius:.25rem;font-size:13px;color:#7a3a3a;margin:0 0 4px 0}
.so-oneitem--ghost .so-itemselect-label-outer{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:1px}
.so-oneitem--ghost .so-ghost-name{font-weight:600;color:#5a2a2a;text-decoration:line-through;text-decoration-color:rgba(120,40,40,.45);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.so-oneitem--ghost .so-ghost-badge{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#a23030;line-height:1.2}
.so-oneitem--ghost .so-ghost-pcs{flex:0 0 auto;font-variant-numeric:tabular-nums;font-weight:700;color:#7a3a3a;min-width:30px;text-align:right}
.so-oneitem--ghost .so-ghost-remove{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:1px solid #c08080;border-radius:50%;background:transparent;color:#a23030;font-size:14px;font-weight:700;cursor:pointer;transition:background .15s ease,color .15s ease}
.so-oneitem--ghost .so-ghost-remove:hover{background:#a23030;color:#fff;border-color:#a23030}
/* dp-paysummary — receipt-style replacement for the legacy
   .so-total stack in customer add-only edit mode. Inherits the
   app's font family from the surrounding template (no extra
   fonts loaded). Neutral gray palette, single green accent for
   the active total, amber for the prior-unpaid notice. */
:root{--dp-paper:#f4f4f5;--dp-paper-2:#e4e4e7;--dp-paper-edge:#d4d4d8;--dp-ink:#1f2937;--dp-ink-soft:#6b7280;--dp-pay-accent:#0e7c5b;--dp-pay-warn:#b87800;--dp-pay-warn-soft:#fff7e6}
/* Reset the parent .so-total's flex-direction:row + uppercase
   rules so the card stacks vertically and labels render as-is. */
.cart-outer .cart-mainblock .so-totalblock .so-total.dp-paysummary{display:block;flex-direction:initial;text-transform:none}
.dp-paysummary{position:relative;background:var(--dp-paper);border:1px solid var(--dp-paper-edge);border-radius:6px;padding:10px 14px;color:var(--dp-ink);box-shadow:0 1px 0 rgba(0,0,0,.02),0 6px 18px -14px rgba(0,0,0,.12);overflow:hidden;width:100%}
/* Eyebrow + amount sit on the same row — eyebrow on the left,
   amount on the right (justify-content:space-between). */
.dp-paysummary__head{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.dp-paysummary__eyebrow{font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.14em;color:var(--dp-ink-soft);flex:0 0 auto}
.dp-paysummary__amount{display:flex;align-items:baseline;gap:3px;color:var(--dp-pay-accent);font-weight:700;font-feature-settings:'tnum' 1;font-variant-numeric:tabular-nums;flex:0 0 auto}
.dp-paysummary__digits{font-size:18px;line-height:1;letter-spacing:-.01em;transition:opacity .22s ease,transform .22s cubic-bezier(.5,0,.2,1);color:var(--dp-pay-accent)!important;font-weight:700}
.dp-paysummary__switch{position:relative;display:grid;grid-template-columns:1fr 1fr;background:var(--dp-paper-2);border:1px solid var(--dp-paper-edge);border-radius:.25rem;padding:2px;margin-top:10px;isolation:isolate}
.dp-paysummary__switch-opt{position:relative;z-index:1;background:transparent;border:0;padding:6px 10px;font-size:11.5px;font-weight:500;color:var(--dp-ink-soft);cursor:pointer;border-radius:.25rem;transition:color .2s ease;font-variant-numeric:tabular-nums;text-align:center}
.dp-paysummary__switch-opt.is-active{color:#fff}
.dp-paysummary__switch-pill{position:absolute;z-index:0;top:2px;bottom:2px;left:2px;width:calc(50% - 2px);background:var(--dp-ink);border-radius:.25rem;transition:transform .28s cubic-bezier(.5,0,.2,1)}
.dp-paysummary__switch[data-active="settle"] .dp-paysummary__switch-pill{transform:translateX(100%)}
.dp-paysummary__ledger{margin-top:10px;padding-top:8px;padding-bottom:0;border-top:1px dashed var(--dp-paper-edge);display:flex;flex-direction:column;gap:2px}
.dp-paysummary__row{display:flex;align-items:baseline;gap:6px;font-size:12px;line-height:1.35;color:var(--dp-ink);animation:dpRowFade .28s ease both}
@keyframes dpRowFade{from{opacity:0;transform:translateY(-2px)}to{opacity:1;transform:translateY(0)}}
.dp-paysummary__row.hidden{display:none}
.dp-paysummary__row-label{flex:0 0 auto;color:var(--dp-ink);font-weight:400}
.dp-paysummary__row::after{content:'';flex:1 1 auto;border-bottom:1px dotted var(--dp-paper-edge);position:relative;top:-3px;margin:0 4px}
.dp-paysummary__row-value{flex:0 0 auto;font-feature-settings:'tnum' 1;font-variant-numeric:tabular-nums;font-weight:500;color:var(--dp-ink);white-space:nowrap}
.dp-paysummary__row--negative .dp-paysummary__row-value{color:var(--dp-pay-accent)}
.dp-paysummary__row--sum{margin:6px -14px -10px;padding:7px 14px 9px;border-top:1px solid var(--dp-paper-edge);background:var(--dp-pay-warn-soft)}
.dp-paysummary__row--sum::after{display:none}
.dp-paysummary__row--sum .dp-paysummary__row-label{color:var(--dp-pay-warn);font-weight:600;font-size:11.5px;text-transform:uppercase;letter-spacing:.04em}
.dp-paysummary__row--sum .dp-paysummary__row-value{color:var(--dp-pay-warn);font-weight:700;font-size:13px}
@media (prefers-reduced-motion: reduce){.dp-paysummary__digits,.dp-paysummary__switch-pill,.dp-paysummary__row{transition:none;animation:none}}
/* In add-only edit mode the paysummary card lives inside the
   middle column (after .so-notification). The middle column is
   already centered by the parent's space-between flex on every
   viewport — no breakpoint-specific layout needed. We hide the
   redundant content inside the right column (the legacy TOTAL
   readout + platform-fee badge — both irrelevant in edit mode)
   but keep the right column itself visible as a flex:1 spacer
   so it balances with the left column and the middle truly
   centers between them. The legacy .so-total inside right is
   still where calculateTotal writes too — hidden visually but
   still receives writes silently. */
/* Edit-mode totalblock layout. Keep the three-column structure
   (left / middle / right) so the layout balances with the rest of
   the cart UI; just hide the inner content of the right column
   (legacy total + platform-fee) and the middle's notification
   that don't belong in edit mode.
   Centering: give middle the same `flex: 1` as its siblings so
   all three columns share width equally, making middle the actual
   geometric center. Paysummary inside is capped at 380px and
   horizontally centered by the column flex's `align-items: center`.
   On mobile (parent flips to flex-direction: column via the
   max-width:992px media query), the three children stack and
   parent's existing `align-items: center` handles centering. */
body.dp-edit-mode .cart-outer .cart-mainblock .so-totalblock-middle{flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;min-width:0}
body.dp-edit-mode .cart-outer .cart-mainblock .so-totalblock-middle .so-notification{display:none}
body.dp-edit-mode .cart-outer .cart-mainblock .so-totalblock-middle .dp-paysummary{width:100%;max-width:380px}
body.dp-edit-mode .cart-outer .cart-mainblock .so-totalblock-right > .so-total,
body.dp-edit-mode .cart-outer .cart-mainblock .so-totalblock-right > .total-upperblock-platformfee-outer{display:none}
body.dp-edit-mode-add-only .so-onemenuitem--existing-locked{position:relative}
body.dp-edit-mode-add-only .so-onemenuitem--existing-locked .so-addto,
body.dp-edit-mode-add-only .so-onemenuitem--existing-locked .so-menu-up,
body.dp-edit-mode-add-only .so-onemenuitem--existing-locked .so-menu-down,
body.dp-edit-mode-add-only .so-onemenuitem--existing-locked .so-menu-delete,
body.dp-edit-mode-add-only .so-onemenuitem--existing-locked .menupcs,
body.dp-edit-mode-add-only .so-onemenuitem--existing-locked .so-edittopping,
body.dp-edit-mode-add-only .so-onemenuitem--existing-locked .so-addtopping,
body.dp-edit-mode-add-only .so-onemenuitem--existing-locked .so-addmorebutton .so-menu-up,
body.dp-edit-mode-add-only .so-onemenuitem--existing-locked .so-addmorebutton .so-menu-down,
body.dp-edit-mode-add-only .so-onemenuitem--existing-locked .so-addmorebutton .so-menu-delete{pointer-events:none!important;opacity:.4!important;cursor:not-allowed!important;filter:grayscale(.4)}
body.dp-edit-mode-add-only .so-onemenuitem--existing-locked .so-addnew{opacity:1!important;pointer-events:auto!important;filter:none!important}
.so-oneitem.dp-locked .so-up,
.so-oneitem.dp-locked .so-down,
.so-oneitem.dp-locked .so-delete,
.so-oneitem.dp-locked .so-cart-edittopping,
.so-onetopping.dp-locked .so-up,
.so-onetopping.dp-locked .so-down,
.so-onetopping.dp-locked .so-delete,
.so-onetopping.dp-locked .so-cart-edittopping{pointer-events:none!important;opacity:.35!important;cursor:not-allowed!important;filter:grayscale(.6)}
.so-oneitem.dp-locked .so-pcs,
.so-onetopping.dp-locked .so-pcs{pointer-events:none!important;background:#f3f4f6!important;color:#6b7280!important;cursor:not-allowed!important}
.so-oneitem.dp-locked .so-itemselect-extras-label,
.so-oneitem.dp-locked .so-itemselect-notes,
.so-onetopping.dp-locked .so-itemselect-extras-label,
.so-onetopping.dp-locked .so-itemselect-notes{pointer-events:none!important;cursor:not-allowed!important;opacity:.7}
.so-existing-badge{display:inline-block;font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--menu-addtocart-toppings-color);background:transparent;border:1px solid var(--menu-addtocart-toppings-color);padding:0 7px;border-radius:.25rem;margin-left:8px;vertical-align:middle;line-height:1.5}
.so-existing-badge.so-existing-badge--edited{color:#1c5db8;border-color:#1c5db8;background:rgba(28,93,184,.08)}
.dp-guest-phone-notice{margin:6px 0 0;font-size:11.5px;line-height:1.4;color:#6b7280;font-style:italic}
/* .order-details-wrapper--editing + .od-editing-notice moved to media/com_deliveryplus/css/order-details.css */
.menu-dinein-banner{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:12px;padding:10px 14px;margin:0 0 14px 0;border-radius:.25rem;background:linear-gradient(135deg,#e6f5ef 0%,#d4ecdf 100%);border:1px solid #a4d4be;box-shadow:0 1px 2px 0 rgba(0,0,0,.07)}
.menu-dinein-banner-icon{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:#0e7c5b;color:#fff}
.menu-dinein-banner-text{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px;line-height:1.3}
.menu-dinein-banner-text strong{font-size:13.5px;color:#0e4a35;font-weight:700}
.menu-dinein-banner-text span{font-size:12.5px;color:#1a6d52}
.menu-dinein-banner.menu-dinein-banner--blocked{background:linear-gradient(135deg,#fdf3e8 0%,#f9e6cc 100%);border-color:#e6b87a}
.menu-dinein-banner.menu-dinein-banner--blocked .menu-dinein-banner-icon{background:#b87800}
.menu-dinein-banner.menu-dinein-banner--blocked .menu-dinein-banner-text strong{color:#6b4400}
.menu-dinein-banner.menu-dinein-banner--blocked .menu-dinein-banner-text span{color:#8a5a0e}
.menu-edit-banner{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:12px;padding:10px 14px;margin:0 0 14px 0;border-radius:.25rem;background:linear-gradient(135deg,#fff8e6 0%,#fff3d0 100%);border:1px solid #f3d27a;box-shadow:0 1px 2px 0 rgba(0,0,0,.07)}
.menu-edit-banner-icon{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:#f5b800;color:#fff}
.menu-edit-banner-text{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px;line-height:1.3}
.menu-edit-banner-text strong{font-size:13.5px;color:#5a4500;font-weight:700}
.menu-edit-banner-text span{font-size:12.5px;color:#7a5d12}
.menu-edit-banner-cancel{flex:0 0 auto;display:inline-flex;align-items:center;padding:6px 12px;font-size:12.5px;font-weight:600;color:#7a5d12;background:transparent;border:1px solid #d8a635;border-radius:4px;text-decoration:none;cursor:pointer;transition:background .18s ease,color .18s ease}
.menu-edit-banner-cancel:hover{background:#d8a635;color:#fff;text-decoration:none}
@media (max-width:560px){
.menu-edit-banner{flex-wrap:wrap;gap:10px;padding:10px 12px}
.menu-edit-banner-cancel{order:3;width:100%;justify-content:center;padding:8px 12px}
}
/* Act-as suffix inside the edit banner title — keeps the title
   compact and readable on the amber background, with the customer
   name doing the visual lifting. The wrapper sits inside <strong>,
   so we override the inherited bold weight on the helper words and
   only restore it on the customer-name span. */
.menu-edit-banner-actas{display:inline-flex;align-items:center;gap:6px;margin-left:10px;font-weight:400;font-size:.92em;vertical-align:baseline}
.menu-edit-banner-actas-sep{opacity:.4;font-weight:400}
.menu-edit-banner-actas-prep{opacity:.7;font-weight:500;text-transform:lowercase;letter-spacing:.02em}
.menu-edit-banner-actas-name{font-weight:700;color:inherit}
.menu-edit-banner.menu-edit-banner--join{background:linear-gradient(135deg,#eaf3ff 0%,#d8e8fc 100%);border-color:#7fa9e0}
.menu-edit-banner.menu-edit-banner--join .menu-edit-banner-icon{background:#1c5db8}
.menu-edit-banner.menu-edit-banner--join .menu-edit-banner-text strong{color:#0d3a78}
.menu-edit-banner.menu-edit-banner--join .menu-edit-banner-text span{color:#1a4d8e}
.dp-join-modal{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center}
.dp-join-modal[hidden]{display:none}
.dp-join-backdrop{position:absolute;inset:0;background:rgba(15,23,32,.55);backdrop-filter:blur(2px)}
.dp-join-card{position:relative;width:min(420px,calc(100vw - 32px));background:#fff;border-radius:.5rem;box-shadow:0 18px 40px -8px rgba(0,0,0,.35);padding:22px 22px 18px;animation:dp-join-pop .16s ease-out}
@keyframes dp-join-pop{0%{transform:scale(.95);opacity:0}100%{transform:scale(1);opacity:1}}
.dp-join-title{font-size:17px;font-weight:700;color:#1a2532;margin:0 0 6px;line-height:1.25}
.dp-join-body{font-size:14px;color:#445261;margin:0 0 16px;line-height:1.45}
.dp-join-pinrow{display:flex;justify-content:center;margin:0 0 12px}
.dp-join-pinrow input{width:160px;font-size:24px;font-weight:600;letter-spacing:6px;text-align:center;padding:10px 8px;border:1.5px solid #c8d2dc;border-radius:.375rem;background:#f6f8fa;color:#1a2532;font-family:inherit}
.dp-join-pinrow input:focus{outline:none;border-color:#1c5db8;background:#fff;box-shadow:0 0 0 3px rgba(28,93,184,.15)}
.dp-join-error{min-height:18px;font-size:12.5px;color:#b32424;margin:0 0 12px;text-align:center;display:none}
.dp-join-actions{display:flex;gap:10px;justify-content:flex-end}
.dp-join-actions button{padding:9px 16px;font-size:13.5px;font-weight:600;border-radius:.375rem;border:1px solid transparent;cursor:pointer;font-family:inherit;transition:background .15s ease,border-color .15s ease,color .15s ease}
.dp-join-cancel{color:#445261;background:#fff;border-color:#c8d2dc}
.dp-join-cancel:hover{background:#f3f5f8;border-color:#a8b6c4}
.dp-join-submit{color:#fff;background:#1c5db8;border-color:#1c5db8}
.dp-join-submit:hover{background:#15498f;border-color:#15498f}
.dp-join-submit:disabled{opacity:.6;cursor:not-allowed}
body.dp-join-modal-open{overflow:hidden}
body.dp-edit-mode .so-notification,
body.dp-edit-mode .total-upperblock-shippingmessage-outer,
body.dp-edit-mode .total-upperblock-platformfee-outer,
body.dp-edit-mode .shippingmessage,
body.dp-edit-mode .cart-upperblock .shipfee,
body.dp-edit-mode .so-totalblock .shipfee,
body.dp-edit-mode .cart-upperblock .minamount,
body.dp-edit-mode .so-totalblock .minamount,
/* .mainmenu_coupons_outer_wrapper arm moved to menu.css */
body.dp-edit-mode .rest-info{display:none!important}
/* Edit-mode contact-block hide list. Each row hidden here belongs to
   the original order (frozen — can't be re-edited) or doesn't apply
   to an addition. Rows NOT in this list (payment method, notes,
   address area) keep their natural display + width — same as in a
   new order. */
body.dp-edit-mode .cart-contactblock #list-select-dp-wrapper,
body.dp-edit-mode .cart-contactblock #dp-contact-table-input-wrapper,
body.dp-edit-mode .cart-contactblock #dp-contact-when-wrapper,
body.dp-edit-mode .cart-contactblock #dp-contact-coupon-wrapper,
body.dp-edit-mode .cart-contactblock #dp-contact-phone-wrapper,
body.dp-edit-mode .cart-contactblock #dp-contact-name-wrapper,
body.dp-edit-mode .cart-contactblock #dp-contact-email-wrapper,
body.dp-edit-mode .cart-contactblock #dp-contact-create-acount-notify-label,
body.dp-edit-mode .cart-contactblock #dp-contact-passwd-header-label,
body.dp-edit-mode .cart-contactblock #dp-contact-passwd-wrapper,
body.dp-edit-mode .cart-contactblock #dp-contact-passwd2-wrapper,
body.dp-edit-mode .cart-contactblock .form_group_wrapper:has(#dp-contact-name-wrapper),
body.dp-edit-mode .cart-contactblock .so-redeem,
body.dp-edit-mode .cart-contactblock .so-agreeterms{display:none!important}

/* Address-edit gate. When the order's status doesn't grant address
   edit to the active role, also hide the address slot + its wrapper.
   Otherwise leave them at their natural display so the cart looks
   identical to a new order: change-address button at full width,
   floor/doorbell paired side-by-side at 50% on desktop. */
body.dp-edit-mode:not(.dp-edit-mode-address) .cart-contactblock #contact-address-wrapper,
body.dp-edit-mode:not(.dp-edit-mode-address) .cart-contactblock #dp-contact-floor-wrapper,
body.dp-edit-mode:not(.dp-edit-mode-address) .cart-contactblock #dp-contact-doorbell-wrapper,
body.dp-edit-mode:not(.dp-edit-mode-address) .cart-contactblock .form_group_wrapper:has(#contact-address-wrapper){display:none!important}
/* Edit/join mode keeps the order-notes block visible — customer can
   read the existing note (rendered read-only above the textarea) and
   append more text. New text is sent as `unote_append` so the server
   concatenates instead of replacing. */
body.dp-edit-mode .cart-contactblock .dp-contactblock-noteblock{display:block!important}
.dp-contactblock-noteblock-existing{margin:6px 0 8px;padding:8px 10px;background:#f6f8fa;border:1px solid #e3e6ea;border-radius:4px;font-size:12.5px;color:#475569;line-height:1.4}
.dp-contactblock-noteblock-existing-label{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#64748b;margin-bottom:4px}
.dp-contactblock-noteblock-existing-text{white-space:pre-wrap;word-break:break-word}
.dp-contactblock-noteblock-existing-text+.dp-contactblock-noteblock-existing-text{margin-top:6px;padding-top:6px;border-top:1px dashed #d1d5db}


/* ============================================================================
   Responsive — migrated from template.min.css @media blocks.
   ============================================================================ */

@media (max-width:1200px){
  .so-menutopping-onetopping{width:92%;margin:5px 3%;}
}

@media (max-width:992px){
  /* Menu page chrome */
  .mainmenu-outer{padding:0;}

  /* Menublock — category + item rows reflow */
  .menublock .menucat-header{margin:.5rem .5rem;}
  .menublock .menucat-description{margin:-0.5rem .5rem .5rem;}
  .menublock .menucat-content .so-onemenuitem-outer{padding:1rem;}
  .menublock .menucat-content .so-onemenuitem h3{width:70%;order:1;}
  .menublock .menucat-content .so-addmorebutton{margin:0;}
  .menublock .menucat-content .so-addtopping{margin-right:5px;}
  .menublock .menucat-content .so-onemenuitem .so-menuitem-title{flex:1 0 75%;}
  .menublock .menucat-content .so-onemenuitem .so-edittopping .so-menuitem-title{flex:1;}
  .menublock .menucat-content .so-menubutton.so-edittopping .so-edittopping-icon{width:calc(15% - 10px);order:2;}
  .menublock .menucat-content .so-menuitemprice{order:2;width:15%;}
  .menublock .menucat-content .so-menuitemcontroller{flex:1;justify-content:flex-end;align-items:center;}
  .menublock .menucat-content .so-onemenuitem.inCart .so-onemenuitem-upper > span.so-menuitemprice{display:none;}
  .menublock .menucat-content .so-onemenuitem .so-edittopping .so-menuitemprice{display:block;color:initial;order:3;}
  .menublock .menucat-content .so-onemenuitem-upper,
  .so-menuitemcontroller{flex-wrap:wrap;}
  .menublock .menucat-content .so-menubutton.so-edittopping{order:-1;flex:0 0 100%;}
  .menublock .menucat-content .thumb_cont{order:3;width:120px;margin-right:.3rem;}

  /* Topping popup */
  .so-menutopping-block-inner{height:100%;width:100%;max-width:100%;margin:0 auto;}
  .so-menutopping-block-item-img img{max-height:300px;}

  /* Cart slide-up + items reflow */
  .cart-outer .cart-upperblock{height:55px;min-height:55px;padding:0 10px;}
  .so-block-header--visible .cart-inner{-webkit-transform:translateY(calc(100% - 55px));transform:translateY(calc(100% - 55px));}
  .cart-outer .cart-mainblock .so-totalblock{flex-direction:column;}
  .cart-outer .cart-upperblock .total-upperblock-soprice-outer{margin:0;}
  .cart-outer .cart-mainblock .so-totalblock .so-notification{padding:.4rem .9rem;}
  .cart-outer .cart-inner .shippingmessage{display:block;font-size:.7rem;}
  .cart-outer .cart-upperblock .total-upperblock-text{margin:0 15px;flex-direction:column;line-height:23px;}
  .cart-outer .so-oneitem{flex-wrap:wrap;}
  .so-itemselect-name-label{order:1;flex-basis:75%;}
  .cart-outer .cart-mainblock .so-totalblock-right{align-items:center;}
  .cart-outer .cart-mainblock .so-itemselect-price-label{order:2;flex-basis:25%;margin-left:0;}
  .cart-mainblock .so-oneitem-controlblock{order:3;flex-basis:100%;justify-content:flex-end;}
  .cart-outer .so-oneitem .so-itemselect-extras-label{width:calc(100% + 60px);font-size:.785rem;margin-left:-5px;}
  .cart-outer .cart-mainblock .so-totalblock .so-total{flex-direction:column;align-items:center;line-height:23px;margin-top:5px;}
  .cart-outer .dp-contactblock-inner{flex-direction:column;}
  .cart-outer .dp-contactblock-fieldblock{width:100%;}
  .cart-outer .contact-row.half-column{width:100%;flex-basis:100%;}
  .cart-outer .dp-contactblock-noteblock{margin-top:10px;}
  .cart-outer .dp-contactblock-noteblock .form_group_wrapper_label{display:block;}
  .list-select-outer select{width:100%;height:50px;}
  .contact-row .form__field{height:50px;}
  .so-cartblock-edit-note{left:10%;width:80%;}

  /* Restaurant tip box on menu page */
  .restaurant_tip{box-shadow:unset;}
  .restaurant_tip_icon{display:flex;margin-right:3px;position:absolute;right:5px;top:0;filter:invert(100%) sepia(4%) saturate(441%) hue-rotate(210deg) brightness(83%) contrast(90%);opacity:.5;}
  .restaurant_tip_icon svg{width:60px;height:60px;}
  .moreinfo-toggler{margin-left:auto;}
}

@media (max-width:768px){
  .so-onemenuitem.inCart::before{left:-1px;border-radius:0 8px 8px 0;}
}

@media (max-width:480px){
  .so-onemenuitem-upper .thumb_cont ~ .so-menuitemcontroller .so-addmorebutton-controlblock{margin-bottom:8px;}
}

@media (max-width:390px){
  .cart-outer .cart-upperblock .total-upperblock-text,
  .cart-outer .cart-mainblock .so-totalblock .so-notification{line-height:23px;font-size:.875rem;}
}

/* Cart slide-up close-X overlay — cart arm of the shared 3-way rule in
   template.min.css (login arm remains there). */
.cart-outer.cart--visible::before{
  content:" ";
  position:absolute;top:-60px;left:50%;transform:translateX(-50%);
  display:flex;align-items:center;justify-content:center;
  width:20px;height:20px;padding:10px;
  background-color:#fff;border-radius:50%;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cline stroke='%23707070' stroke-miterlimit='10'%0Astroke-width='10px' linecap='round' x1='0' y1='0' x2='100' y2='100'%3E%3C/line%3E%3Cline stroke='%23707070' stroke-miterlimit='10'%0Astroke-width='10px' linecap='round' x1='100' y1='0' x2='0' y2='100'%3E%3C/line%3E%3C/svg%3E");
  background-size:15px;background-repeat:no-repeat;background-position:center;
  color:#707070;
  opacity:0;pointer-events:none;
  -webkit-animation:fadeInOpacity .7s ease-out forwards;
  -moz-animation:fadeInOpacity .7s ease-out forwards;
  -o-animation:fadeInOpacity .7s ease-out forwards;
  animation:fadeInOpacity .7s ease-out forwards;
}


/* ============================================================================
   Reviews + Restaurant Info slide-out panels — menu-view only.
   Migrated from template.min.css. Shared `.close-btn-outer` + `.close-btn`
   and `.add-star-rating` stars stay in template (used elsewhere).
   ============================================================================ */

/* ─── Reviews slide-out ─── */
.reviews-wrapper{
    position:fixed;left:0;top:0;width:100%;height:100%;
    overflow:hidden;pointer-events:none;
    -ms-overflow-style:none;scrollbar-width:none;
    z-index:55601;
}
.reviews-wrapper--visible{pointer-events:auto;overflow:auto;}
.reviews-wrapper::-webkit-scrollbar,
.reviews::-webkit-scrollbar{width:0;height:0;}
.reviews-wrapper-inner{
    position:relative;
    -webkit-transform:translateX(103%);transform:translateX(103%);
    display:flex;flex-direction:column;
    align-items:center;justify-content:center;
    will-change:transform;pointer-events:auto;
    background:#f1f1f1;width:100%;max-width:800px;
    min-height:100%;float:right;z-index:55601;
}
.reviews-wrapper--visible .reviews-wrapper-inner{-webkit-transform:none;transform:none;}
.reviews-wrapper--animatable .reviews-wrapper-inner{transition:all 130ms ease-in;}
.reviews-wrapper--visible.reviews-wrapper--animatable .reviews-wrapper-inner{transition:all 330ms ease-out;}
.reviews{padding:0;max-width:1200px;width:100%;}
.reviews-wrapper:after{
    content:'';display:block;position:inherit;
    left:0;top:0;width:100%;height:100%;
    background:rgba(0,0,0,.4);opacity:0;will-change:opacity;pointer-events:none;
    transition:opacity .3s cubic-bezier(0,0,.3,1);
}
.reviews-wrapper--visible.reviews-wrapper:after{opacity:1;pointer-events:auto;}

/* Sticky header shared by .reviews-wrapper and .moreinfo-wrapper (both menu-only). */
.reviews .reviews-header,
.moreinfo-wrapper .moreinfo-header{
    position:sticky;top:0;height:var(--top-header-height);
    display:flex;align-items:center;justify-content:center;
    background-color:var(--top-header-bgcolor);color:var(--top-header-textcolor);
    box-shadow:0 1px 7px 0 rgba(0,0,0,.13);z-index:1;
}

.one-review{overflow:hidden;clear:both;padding:15px 0;}
.one-review-inner{background-color:#fff;padding:10px;margin:10px;border-radius:.4em;}
.one-review .stars{margin-bottom:5px;float:none;overflow:hidden;}
.one-review .from{color:#888;}
.one-review .text{}
.one-review .answer{
    position:relative;background:#fff;border-radius:.4em;
    padding:10px;margin:0 20px;width:auto;max-width:80%;float:right;
}
.one-review .answer:after{
    content:'';position:absolute;top:0;left:10%;width:0;height:0;
    border:.625em solid transparent;border-bottom-color:#fff;
    border-top:0;border-right:0;
    margin-left:-.312em;margin-top:-.6em;
}
.reviews-wrapper #backtomenu-outer{margin:15px 0;}


/* ─── Restaurant Info slide-out ─── */
/* "Πληροφορίες" toggler — chip with a leading info icon, bordered like the
   opening-status pill; always visible, top-right of the title bar. */
.moreinfo-toggler{
    display:inline-flex;align-items:center;gap:5px;flex:0 0 auto;
    border:1px solid gray;border-radius:.25rem;padding:4px 8px;background:#fff;
    color:#555;cursor:pointer;font-size:.825rem;line-height:1;white-space:nowrap;
    transition:background .15s ease,color .15s ease;
}
.moreinfo-toggler:hover{background:#f5f5f5;color:#111;}
/* Leading line-icons for the info / review chips — inherit the chip colour
   (so the hover-darken applies to the glyph too) and never shrink. */
.moreinfo-icon,.review-more-icon{flex:0 0 auto;display:block;opacity:.85;}
.moreinfo-toggler:hover .moreinfo-icon,
.review-rest-outer .review-more:hover .review-more-icon{opacity:1;}
.moreinfo-wrapper{
    position:fixed;left:0;top:0;width:100%;height:100%;
    overflow:hidden;pointer-events:none;
    -ms-overflow-style:none;scrollbar-width:none;
    z-index:55600;
}
.moreinfo-wrapper--visible{pointer-events:auto;overflow:auto;}
.moreinfo-wrapper::-webkit-scrollbar,
.moreinfo::-webkit-scrollbar{width:0;height:0;}
.moreinfo-wrapper-inner{
    position:relative;
    -webkit-transform:translateX(103%);transform:translateX(103%);
    display:flex;flex-direction:column;
    will-change:transform;pointer-events:auto;
    background:#f1f1f1;width:100%;max-width:800px;
    min-height:100%;float:right;z-index:55601;
}
.moreinfo-wrapper--visible .moreinfo-wrapper-inner{-webkit-transform:none;transform:none;}
.moreinfo-wrapper--animatable .moreinfo-wrapper-inner{transition:all 130ms ease-in;}
.moreinfo-wrapper--visible.moreinfo-wrapper--animatable .moreinfo-wrapper-inner{transition:all 330ms ease-out;}
.moreinfo-wrapper:after{
    content:'';display:block;position:inherit;
    left:0;top:0;width:100%;height:100%;
    background:rgba(0,0,0,.4);opacity:0;will-change:opacity;pointer-events:none;
    transition:opacity .3s cubic-bezier(0,0,.3,1);
}
.moreinfo-wrapper--visible.moreinfo-wrapper:after{opacity:1;pointer-events:auto;}

.moreinfo-wrapper-inner-div{
    display:flex;flex-direction:column;align-items:self-start;
    padding:0 10px;margin-top:20px;
}
.moreinfo-wrapper .moreinfo-title{display:block;font-size:1.25rem;font-weight:600;}
.moreinfo-wrapper-inner-div.rest-name{justify-content:center;align-items:center;margin-top:25px;}
.moreinfo-wrapper-inner-div.contact-details{margin-bottom:25px;}
.moreinfo-wrapper .rest-name .moreinfo-title{font-size:1.5rem;margin-bottom:8px;}
.moreinfo-wrapper .moreinfo-text{color:rgba(32,33,37,.64);}
.moreinfo-review-rest-outer{
    display:flex;flex-direction:column;
    justify-content:center;align-items:center;
}
.moreinfo-wrapper .moreinfo-openingtime-div{display:flex;justify-content:space-between;width:100%;}
.moreinfo-wrapper .opening-times .active{font-weight:bold;}
.moreinfo-wrapper .opening_hours_time{color:rgba(32,33,37,.64);}
.moreinfo-wrapper .review{display:flex;flex-direction:column;align-items:center;gap:7px;cursor:pointer;margin-top:5px;}
/* Reviews button in the info slide-out — match the bordered chip used on the
   info-card (the chip rule is scoped to .mainmenu-infocard-outer, which this
   panel sits outside of, so it's restated here). */
.moreinfo-review-rest-outer .review-more{
    display:inline-flex;align-items:center;gap:5px;
    border:1px solid #9b9b9b;border-radius:.25rem;padding:4px 8px;background:#fff;
    line-height:1;white-space:nowrap;cursor:pointer;
    transition:background .15s ease,color .15s ease;
}
/* Shared subtle hover for the three info-panel buttons so they behave alike. */
.moreinfo-wrapper .add-review-dupl:hover,
.moreinfo-wrapper .showOnMap:hover,
.moreinfo-review-rest-outer .review-more:hover{background:#f5f5f5;color:#111;}
.moreinfo-review-rest-outer .review-more:hover .review-more-icon{opacity:1;}
/* The reviews block is an <a>; its red link-hover must NOT tint the review-more
   button/label that sits inside it. Keep the anchor neutral on hover. */
.moreinfo-review-rest-outer a.review:hover{color:inherit;}
.moreinfo-wrapper .add-review-dupl,
.moreinfo-wrapper .showOnMap{
    border:1px solid #9b9b9b;padding:0 8px;border-radius:.25rem;background:#fff;cursor:pointer;
    transition:background .15s ease,color .15s ease;
}

/* "Add review" button — reviews slide-out (.add-review-dupl). The menu infocard's
   own .rest-right-col .add-review copy was removed with the grid refactor. */
.reviews-wrapper .add-review-dupl{
    border:1px solid #9b9b9b;
    padding:0 5px;border-radius:.25rem;
    margin-bottom:5px;cursor:pointer;
}
.reviews-wrapper .reviews-wrapper-add-reviews-outer{
    display:flex;justify-content:center;margin-top:25px;
}

/* Review stars — gray base layer + amber fill via inline width%. Shared
   widget; this is a per-view copy (template.min.css no longer hosts it). */
.star-rating{position:relative;width:100px;height:20px;}
.star-rating:before{
    content:"";display:block;position:absolute;inset:0;
    width:100px;height:20px;
    background-image:url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22929%22%20height%3D%22886%22%20viewBox%3D%220%200%20929%20886%22%3E%3Cstyle%3Epath%20%7B%20fill%3A%20%23888%20!important%20%7D%3C%2Fstyle%3E%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M929%20343c0%208-5%2017-15%2027L711%20567l48%20279c1%203%201%207%201%2012%200%2015-8%2027-22%2027-7%201-15-1-23-6L464%20747%20214%20879c-9%205-16%207-23%207-14%200-23-15-23-28%200-3%200-7%201-12l48-279L14%20370c-9-10-14-19-14-27%200-14%2010-23%2031-26l280-40L437%2023c7-15%2016-23%2027-23s20%208%2028%2023l125%20254%20280%2040c21%203%2032%2012%2032%2026z%22%2F%3E%3C%2Fsvg%3E)!important;
    background-repeat:repeat-x;background-size:20px;
}
.star-rating > span{
    display:block;position:absolute;overflow:hidden;
    width:100px;height:20px;text-indent:-10000px;
}
.star-rating > span:before{
    content:"";display:block;position:absolute;inset:0;height:20px;
    background-image:url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22929%22%20height%3D%22886%22%20viewBox%3D%220%200%20929%20886%22%3E%3Cstyle%3Epath%20%7B%20fill%3A%20%23ff981a%20%20!important%20%7D%3C%2Fstyle%3E%3Cpath%20fill%3D%22%23000000%22%20d%3D%22M929%20343c0%208-5%2017-15%2027L711%20567l48%20279c1%203%201%207%201%2012%200%2015-8%2027-22%2027-7%201-15-1-23-6L464%20747%20214%20879c-9%205-16%207-23%207-14%200-23-15-23-28%200-3%200-7%201-12l48-279L14%20370c-9-10-14-19-14-27%200-14%2010-23%2031-26l280-40L437%2023c7-15%2016-23%2027-23s20%208%2028%2023l125%20254%20280%2040c21%203%2032%2012%2032%2026z%22%2F%3E%3C%2Fsvg%3E)!important;
    background-repeat:repeat-x;background-size:20px;
    text-indent:10000px;
}


@media (max-width:992px){
  .star-rating,
  .star-rating:before,
  .star-rating > span{width:75px;height:15px;}
  .star-rating:before,
  .star-rating > span:before{background-size:15px;height:15px;}
}