html{scrollbar-gutter:stable}

/* Checkout QRIS: no overlap, normal scan size, and fully responsive. */
#checkoutPaymentBoxV18{
  grid-template-columns:minmax(190px,220px) minmax(0,1fr)!important;
  gap:20px!important;
  align-items:center!important;
  overflow:hidden!important;
}
#checkoutQrisWrap{
  width:100%!important;
  max-width:220px!important;
  aspect-ratio:1/1!important;
  padding:8px!important;
  justify-self:center!important;
  overflow:hidden!important;
}
#checkoutQrisWrap img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  border-radius:10px!important;
}
#checkoutQrisWrap::after{display:none!important}
#checkoutPaymentBoxV18>div:last-child{min-width:0!important;overflow-wrap:anywhere}
#checkoutPaymentList{min-width:0!important}

/* Manual transfer reminder replacing proof upload. */
.transfer-reminder-v23{
  display:grid!important;
  grid-template-columns:46px minmax(0,1fr)!important;
  align-items:center!important;
  gap:14px!important;
  border-style:solid!important;
  border-color:rgba(65,232,255,.18)!important;
  background:linear-gradient(135deg,rgba(65,232,255,.07),rgba(139,92,246,.06))!important;
}
.transfer-reminder-v23 strong{display:block;color:#fff;font-size:.92rem;margin-bottom:5px}
.transfer-reminder-v23 p{margin:0;color:#c7c7d8;font-size:.79rem;line-height:1.65}
.transfer-reminder-icon-v23{
  width:46px;height:46px;border-radius:14px;display:grid;place-items:center;
  color:var(--cyan);background:rgba(65,232,255,.08);border:1px solid rgba(65,232,255,.18)
}
#proofInput,#proofPreview,#shareProof{display:none!important}

/* Product/catalog interactions: smooth and stationary, no tap jump or shaking. */
#produk .product-card,
.redeem-item-card{
  transform:none!important;
  transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease,filter .2s ease!important;
  backface-visibility:hidden;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
}
#produk .product-card:hover,
#produk .product-card:active,
.redeem-item-card:hover,
.redeem-item-card:active{
  transform:none!important;
}
#produk .btn,
#produk .icon-btn,
.redeem-item-card .btn,
.redeem-item-card .icon-btn{
  transform:none!important;
  transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease,opacity .18s ease!important;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
}
#produk .btn:hover,
#produk .btn:active,
#produk .icon-btn:hover,
#produk .icon-btn:active,
.redeem-item-card .btn:hover,
.redeem-item-card .btn:active,
.redeem-item-card .icon-btn:hover,
.redeem-item-card .icon-btn:active{
  transform:none!important;
}
#produk .btn::before,
#produk .icon-btn::before,
.redeem-item-card .btn::before,
.redeem-item-card .icon-btn::before{display:none!important}
#produk .ripple,.redeem-item-card .ripple{display:none!important}

@media(max-width:720px){
  #checkoutPaymentBoxV18{
    grid-template-columns:1fr!important;
    text-align:left!important;
  }
  #checkoutQrisWrap{
    width:min(100%,300px)!important;
    max-width:300px!important;
    justify-self:center!important;
  }
  #checkoutPaymentList{grid-template-columns:1fr!important}
  .transfer-reminder-v23{grid-template-columns:42px minmax(0,1fr)!important}
  .transfer-reminder-icon-v23{width:42px;height:42px}
}

@media(prefers-reduced-motion:reduce){
  #produk .product-card,.redeem-item-card,#produk .btn,.redeem-item-card .btn{transition:none!important}
}