/* Osool Royal Menu V44 — responsive variable-product sheet + universal floating cart.
   Goal: product cards never expand when a variable dish is opened; mobile/iPad keep a stable grid. */

html.osrm44-choice-lock,
body.osrm44-choice-lock{
  overflow:hidden!important;
  overscroll-behavior:none!important;
}

/* Keep every card independent of the height of its neighbours. */
.osrm11.osrm11-direct-menu .osrm11-grid{
  align-items:start!important;
}
.osrm11.osrm11-direct-menu .osrm11-card{
  align-self:start!important;
  min-width:0!important;
}

/* V15's old inline variable panel is intentionally retired in V44.
   Variable products use the body-mounted accessible modal/bottom sheet in menu.js. */
.osrm11.osrm11-direct-menu .osrm15-inline-options{
  display:none!important;
}

/* ---------- Variable options: desktop ---------- */
.osrm11-var-modal{
  z-index:2147483000!important;
  padding:18px!important;
  background:rgba(20,27,17,.76)!important;
  backdrop-filter:blur(7px)!important;
  -webkit-backdrop-filter:blur(7px)!important;
}
.osrm11-var-modal .osrm11-var-panel{
  width:min(94vw,590px)!important;
  max-height:min(90dvh,820px)!important;
  overflow:auto!important;
  overscroll-behavior:contain!important;
  border-radius:28px!important;
  padding:26px 24px max(24px,env(safe-area-inset-bottom))!important;
  box-shadow:0 30px 90px rgba(12,18,10,.40)!important;
}
.osrm11-var-modal .osrm11-var-top{
  position:sticky!important;
  top:-26px!important;
  z-index:4!important;
  margin:-26px -24px 8px!important;
  padding:18px 24px 12px!important;
  background:rgba(244,222,198,.96)!important;
  backdrop-filter:blur(10px)!important;
  -webkit-backdrop-filter:blur(10px)!important;
  border-bottom:1px solid rgba(100,105,70,.16)!important;
}
.osrm11-var-modal .osrm11-var-close{
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  flex-basis:44px!important;
}
.osrm11-var-modal .osrm11-var-option{
  min-height:52px!important;
  touch-action:manipulation!important;
}
.osrm11-var-modal .osrm11-royal-confirm{
  min-height:58px!important;
}

/* ---------- iPad / tablet ---------- */
@media (min-width:641px) and (max-width:1180px){
  .osrm11-var-modal{
    padding:22px!important;
  }
  .osrm11-var-modal .osrm11-var-panel{
    width:min(88vw,650px)!important;
    max-height:88dvh!important;
    border-radius:30px!important;
    padding:28px 26px max(28px,env(safe-area-inset-bottom))!important;
  }
  .osrm11-var-modal .osrm11-var-top{
    top:-28px!important;
    margin:-28px -26px 8px!important;
    padding:19px 26px 13px!important;
  }
  .osrm11-var-modal .osrm11-var-title{
    font-size:30px!important;
  }
  .osrm11-var-modal .osrm11-var-option{
    min-height:56px!important;
    padding:14px 16px!important;
    font-size:14px!important;
  }
}

/* ---------- iPhone / Android ---------- */
@media (max-width:640px){
  .osrm11-var-modal{
    align-items:flex-end!important;
    justify-content:center!important;
    padding:0!important;
  }
  .osrm11-var-modal .osrm11-var-panel{
    width:100%!important;
    max-width:none!important;
    max-height:91dvh!important;
    border-radius:28px 28px 0 0!important;
    border-bottom:0!important;
    padding:19px 16px max(20px,calc(env(safe-area-inset-bottom) + 12px))!important;
    animation:osrm44SheetIn .24s cubic-bezier(.2,.75,.25,1) both!important;
  }
  .osrm11-var-modal .osrm11-var-top{
    top:-19px!important;
    margin:-19px -16px 8px!important;
    padding:14px 16px 10px!important;
    border-radius:28px 28px 0 0!important;
  }
  .osrm11-var-modal .osrm11-var-title{
    margin:10px 0 2px!important;
    font-size:24px!important;
  }
  .osrm11-var-modal .osrm11-var-hint{
    margin-bottom:13px!important;
    font-size:11px!important;
  }
  .osrm11-var-modal .osrm11-var-list{
    gap:8px!important;
    margin-bottom:15px!important;
  }
  .osrm11-var-modal .osrm11-var-option{
    min-height:50px!important;
    padding:11px 12px!important;
    border-radius:14px!important;
    font-size:12px!important;
  }
  .osrm11-var-modal .osrm11-royal-qty-group{
    padding:15px 8px 10px!important;
  }
  .osrm11-var-modal .osrm11-royal-prices{
    padding-top:13px!important;
    gap:8px!important;
  }
  .osrm11-var-modal .osrm11-royal-confirm{
    position:sticky!important;
    bottom:0!important;
    z-index:3!important;
    min-height:55px!important;
    box-shadow:0 -8px 20px rgba(244,222,198,.82)!important;
  }
}

@keyframes osrm44SheetIn{
  from{transform:translateY(24px);opacity:.55}
  to{transform:translateY(0);opacity:1}
}

/* ---------- Universal floating cart ----------
   Tracker stays on the right; cart stays on the left to avoid collision. */
.osrm11.osrm11-direct-menu .osrm11-mobile-cart.osrm44-floating-cart,
.osrm11.osrm11-direct-menu .osrm11-mobile-cart.osrm44-floating-cart.is-visible{
  position:fixed!important;
  left:max(14px,env(safe-area-inset-left))!important;
  right:auto!important;
  top:auto!important;
  bottom:max(14px,env(safe-area-inset-bottom))!important;
  inset-inline-start:auto!important;
  transform:none!important;
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  z-index:2147482400!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:9px!important;
  width:auto!important;
  min-width:176px!important;
  max-width:235px!important;
  min-height:58px!important;
  margin:0!important;
  padding:7px 10px 7px 8px!important;
  border:1px solid rgba(255,255,255,.40)!important;
  border-radius:999px!important;
  background:linear-gradient(135deg,#6f784b,#45502d)!important;
  color:#fff!important;
  box-shadow:0 14px 32px rgba(39,45,25,.28)!important;
  text-decoration:none!important;
  direction:rtl!important;
  font-family:'Cairo',Tahoma,Arial,sans-serif!important;
  -webkit-tap-highlight-color:transparent!important;
}
.osrm11.osrm11-direct-menu .osrm44-cart-icon{
  position:relative!important;
  display:grid!important;
  place-items:center!important;
  flex:0 0 42px!important;
  width:42px!important;
  height:42px!important;
  border-radius:50%!important;
  background:rgba(255,255,255,.14)!important;
  color:#fff!important;
}
.osrm11.osrm11-direct-menu .osrm44-cart-icon:before,
.osrm11.osrm11-direct-menu .osrm44-cart-icon:after{
  content:"";
  position:absolute;
  inset:-5px;
  border:1px solid rgba(235,216,193,.75);
  border-radius:50%;
  animation:osrm44CartPulse 2.2s ease-out infinite;
  pointer-events:none;
}
.osrm11.osrm11-direct-menu .osrm44-cart-icon:after{animation-delay:1.1s}
.osrm11.osrm11-direct-menu .osrm44-cart-icon svg{display:block!important;width:25px!important;height:25px!important;transform-origin:50% 68%;animation:osrm461CartSwing 2.8s ease-in-out infinite!important}
.osrm11.osrm11-direct-menu .osrm44-cart-icon i{
  position:absolute;
  top:2px;
  right:2px;
  width:9px;
  height:9px;
  border-radius:50%;
  background:#f0d49d;
  box-shadow:0 0 0 3px rgba(240,212,157,.16);
}
.osrm11.osrm11-direct-menu .osrm44-cart-copy{
  display:grid!important;
  min-width:0!important;
  flex:1 1 auto!important;
  text-align:right!important;
  line-height:1.25!important;
}
.osrm11.osrm11-direct-menu .osrm44-cart-copy b{
  color:#fff!important;
  font-size:13px!important;
  font-weight:900!important;
  white-space:nowrap!important;
}
.osrm11.osrm11-direct-menu .osrm44-cart-copy small{
  color:#f0e7d8!important;
  font-size:10px!important;
  font-weight:700!important;
  direction:ltr!important;
  unicode-bidi:isolate!important;
  white-space:nowrap!important;
}
.osrm11.osrm11-direct-menu .osrm44-floating-cart em{
  display:grid!important;
  place-items:center!important;
  flex:0 0 auto!important;
  min-width:24px!important;
  height:24px!important;
  padding:0 6px!important;
  border-radius:999px!important;
  background:#fff!important;
  color:#4b5431!important;
  font-style:normal!important;
  font-size:11px!important;
  font-weight:900!important;
  line-height:1!important;
}
.osrm11.osrm11-direct-menu .osrm44-floating-cart.is-cart-pop{
  animation:osrm44CartPop .56s cubic-bezier(.2,.8,.3,1)!important;
}
@keyframes osrm44CartPulse{
  0%{transform:scale(.86);opacity:.75}
  75%,100%{transform:scale(1.34);opacity:0}
}

@keyframes osrm461CartSwing{
  0%,100%{transform:translateY(0) rotate(0deg)}
  25%{transform:translateY(-2px) rotate(-4deg)}
  50%{transform:translateY(0) rotate(0deg)}
  75%{transform:translateY(-2px) rotate(4deg)}
}

@keyframes osrm44CartPop{
  0%{transform:scale(1)}
  36%{transform:scale(1.09)}
  72%{transform:scale(.98)}
  100%{transform:scale(1)}
}

/* iPad: slightly more breathing room, while the cart remains compact. */
@media (min-width:641px) and (max-width:1180px){
  .osrm11.osrm11-direct-menu .osrm11-mobile-cart.osrm44-floating-cart,
  .osrm11.osrm11-direct-menu .osrm11-mobile-cart.osrm44-floating-cart.is-visible{
    left:18px!important;
    bottom:18px!important;
    min-width:190px!important;
    max-width:240px!important;
  }
}

/* Phones: compact launcher that does not cover two-column food cards. */
@media (max-width:640px){
  .osrm11.osrm11-direct-menu .osrm11-menu-area{
    padding-bottom:96px!important;
  }
  .osrm11.osrm11-direct-menu .osrm11-mobile-cart.osrm44-floating-cart,
  .osrm11.osrm11-direct-menu .osrm11-mobile-cart.osrm44-floating-cart.is-visible{
    left:10px!important;
    bottom:max(10px,env(safe-area-inset-bottom))!important;
    min-width:158px!important;
    max-width:196px!important;
    min-height:54px!important;
    padding:6px 8px 6px 7px!important;
    gap:8px!important;
  }
  .osrm11.osrm11-direct-menu .osrm44-cart-icon{
    width:39px!important;
    height:39px!important;
    flex-basis:39px!important;
  }
  .osrm11.osrm11-direct-menu .osrm44-cart-copy b{font-size:12px!important}
  .osrm11.osrm11-direct-menu .osrm44-cart-copy small{font-size:9px!important}
  .osrm11.osrm11-direct-menu .osrm44-floating-cart em{
    min-width:22px!important;
    height:22px!important;
    font-size:10px!important;
  }
}

@media (max-width:360px){
  .osrm11.osrm11-direct-menu .osrm11-mobile-cart.osrm44-floating-cart,
  .osrm11.osrm11-direct-menu .osrm11-mobile-cart.osrm44-floating-cart.is-visible{
    min-width:146px!important;
    max-width:178px!important;
  }
}

@media (prefers-reduced-motion:reduce){
  .osrm11.osrm11-direct-menu .osrm44-cart-icon:before,
  .osrm11.osrm11-direct-menu .osrm44-cart-icon:after,
  .osrm11.osrm11-direct-menu .osrm44-cart-icon svg,
  .osrm11.osrm11-direct-menu .osrm44-floating-cart.is-cart-pop,
  .osrm11-var-modal .osrm11-var-panel{
    animation:none!important;
  }
}

/* V46.1 management build: the floating cart stays visible at every Smart Gateway phase. */
.osrm11.osrm11-direct-menu.os360-smart-gateway .osrm11-mobile-cart.osrm44-floating-cart{
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
}
