/* One bounded scroll area; never clip purchase actions below the viewport. */
.hqx .hqx-modal-backdrop{
  padding:16px!important;align-items:center!important;overflow:hidden!important;
}
.hqx .hqx-modal-backdrop .hqx-modal{
  box-sizing:border-box!important;height:min(760px,calc(100vh - 32px))!important;
  height:min(760px,calc(100dvh - 32px))!important;max-height:calc(100dvh - 32px)!important;
  grid-template-rows:minmax(0,1fr)!important;min-height:0!important;padding:24px!important;
}
.hqx .hqx-modal-backdrop .hqx-modal-details{
  box-sizing:border-box!important;min-height:0!important;height:100%!important;max-height:100%!important;
  overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain;
  padding:4px 10px 20px 0!important;scrollbar-width:thin;scrollbar-gutter:stable;
  -webkit-overflow-scrolling:touch;
}
.hqx .hqx-modal-backdrop .hqx-modal-media{min-height:0!important;overflow-y:auto!important}
.hqx .hqx-modal-backdrop .hqx-modal-img{
  flex-shrink:0!important;height:clamp(240px,48vh,480px)!important;max-height:calc(100dvh - 150px)!important;
}
.hqx .hqx-modal-backdrop .hqx-modal h2{
  font-size:clamp(25px,2.5vw,36px)!important;line-height:1.12!important;margin:6px 40px 10px 0!important;
}
.hqx .hqx-modal-backdrop .hqx-modal-refill{margin:12px 0!important;padding:12px!important}
.hqx .hqx-modal-backdrop .hqx-refill-schedule{margin-block:12px!important}
.hqx .hqx-modal-backdrop .hqx-modal-qty-wrap{margin-block:12px!important}
.hqx .hqx-modal-backdrop .hqx-modal-actions{margin-top:12px!important}
.hqx .hqx-modal-backdrop .hqx-close{z-index:20!important}
body.hlmc-lang-ar .hqx .hqx-modal-backdrop .hqx-modal-details{padding:4px 0 20px 10px!important}
body.hlmc-lang-ar .hqx .hqx-modal-backdrop .hqx-modal h2{margin:6px 0 10px 40px!important}
@media(max-width:980px){
  .hqx .hqx-modal-backdrop{padding:8px!important}
  .hqx .hqx-modal-backdrop .hqx-modal{
    display:block!important;width:100%!important;max-width:720px!important;
    height:auto!important;max-height:calc(100vh - 16px)!important;max-height:calc(100dvh - 16px)!important;
    overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain;
    padding:16px 16px max(20px,env(safe-area-inset-bottom))!important;scrollbar-width:thin;
  }
  .hqx .hqx-modal-backdrop .hqx-modal-details{height:auto!important;max-height:none!important;overflow:visible!important;padding:16px 0 4px!important}
  .hqx .hqx-modal-backdrop .hqx-modal-media{overflow:visible!important}
  .hqx .hqx-modal-backdrop .hqx-modal-img{height:clamp(150px,27dvh,280px)!important;max-height:none!important}
  .hqx .hqx-modal-backdrop .hqx-close{
    position:sticky!important;top:0!important;inset-inline-end:0!important;float:right;
    margin-bottom:-44px!important;width:44px!important;height:44px!important;background:#fff!important;
  }
  body.hlmc-lang-ar .hqx .hqx-modal-backdrop .hqx-close{float:left}
  body.hlmc-lang-ar .hqx .hqx-modal-backdrop .hqx-modal-details{padding:16px 0 4px!important}
  .hqx .hqx-modal-backdrop .hqx-modal-actions.has-refill{grid-template-columns:minmax(0,1fr)!important}
}