/* LI GAMING — premium EPS payment chooser v7 */
#orderModal#orderModal .payment-instruction { display: none !important; }
#orderModal#orderModal .eps-payment-pro-panel {
  position: relative; isolation: isolate; overflow: hidden;
  margin: 12px 0 14px; padding: 18px;
  border: 1px solid rgba(135, 173, 218, .18); border-radius: 21px;
  background: radial-gradient(120% 110% at 0% 0%, rgba(53, 113, 193, .18), transparent 46%),
              radial-gradient(95% 90% at 100% 100%, rgba(33, 211, 146, .09), transparent 49%),
              linear-gradient(150deg, #121d2d 0%, #0c1421 65%, #0b1320 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045);
}
#orderModal#orderModal .eps-payment-pro-panel::before {
  content: ""; position: absolute; z-index: -1; inset: 0; pointer-events: none;
  background: linear-gradient(125deg, rgba(255,255,255,.045), transparent 28%, transparent 72%, rgba(255,255,255,.025));
}
#orderModal#orderModal .eps-payment-pro-head { display: flex; align-items: center; justify-content: center; gap: 0; margin-bottom: 16px; padding: 0 0 13px; border-bottom: 1px solid rgba(145,190,246,.16); text-align: center; }
#orderModal#orderModal .eps-payment-pro-title { width: 100%; text-align: center; }
#orderModal#orderModal .eps-payment-pro-title h3 { margin: 0; color: #f5f9ff; font: 700 clamp(17px, 2.6vw, 20px)/1.3 Arial,Helvetica,sans-serif; letter-spacing: 0; }
#orderModal#orderModal .eps-payment-pro-title h3::after { content: ""; display: block; width: 54px; height: 3px; margin: 9px auto 0; border-radius: 999px; background: linear-gradient(90deg,#f8c12a,#39d9a6); box-shadow: none; }
#orderModal#orderModal .eps-payment-pro-title p { margin: 5px 0 0; color: #95a9c1; font: 500 11px/1.55 Inter,system-ui,sans-serif; }
#orderModal#orderModal .eps-payment-pro-group { margin-top: 17px; }
#orderModal#orderModal .eps-payment-pro-group-title { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; color: #b6c8dc; font: 800 10px/1.3 Inter,system-ui,sans-serif; text-transform: uppercase; letter-spacing: .12em; }
#orderModal#orderModal .eps-payment-pro-group-title i { height: 1px; flex: 1; background: linear-gradient(90deg, rgba(131,166,210,.25), transparent); }
#orderModal#orderModal .eps-brand-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
#orderModal#orderModal .eps-brand-card {
  min-width: 0; min-height: 65px; padding: 6px 3px 5px; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 7px; text-align: center;
  border: 0; border-radius: 0; background: transparent; box-shadow: none; cursor: default;
  transition: none;
}
#orderModal#orderModal .eps-brand-card:hover { transform: none; border-color: transparent; background: transparent; }
#orderModal#orderModal .eps-brand-mark { display: grid; place-items: center; width: 38px; height: 29px; border-radius: 8px; color: #fff; font: 900 15px/1 Outfit,Inter,system-ui,sans-serif; letter-spacing: -.05em; box-shadow: inset 0 1px rgba(255,255,255,.22); }
#orderModal#orderModal .eps-brand-name { display: block; max-width: 100%; color: #dce8f6; font: 750 10px/1.2 Inter,system-ui,sans-serif; letter-spacing: -.015em; overflow-wrap: anywhere; }
#orderModal#orderModal .eps-brand-bkash .eps-brand-mark { color: #fff; background: linear-gradient(145deg,#ed197a,#b40b59); font-size: 14px; }
#orderModal#orderModal .eps-brand-nagad .eps-brand-mark { background: linear-gradient(145deg,#ff8736,#e14c20); border-radius: 10px 7px 10px 7px; font-style: italic; }
#orderModal#orderModal .eps-brand-upay .eps-brand-mark { background: linear-gradient(145deg,#774de7,#5030a9); }
#orderModal#orderModal .eps-brand-rocket .eps-brand-mark { background: linear-gradient(145deg,#9a4bec,#5c29b0); border-radius: 50% 50% 9px 9px; }
#orderModal#orderModal .eps-brand-sheba .eps-brand-mark { background: linear-gradient(145deg,#00bfa4,#007f8e); border-radius: 9px 15px 9px 15px; }
#orderModal#orderModal .eps-brand-ok .eps-brand-mark { color: #083f2b; background: linear-gradient(145deg,#aaf278,#56d786); font-size: 12px; }
#orderModal#orderModal .eps-brand-mcash .eps-brand-mark { background: linear-gradient(145deg,#16a66b,#08794b); font-size: 13px; }
#orderModal#orderModal .eps-brand-iwallet .eps-brand-mark { background: linear-gradient(145deg,#1cae86,#087d70); font-size: 12px; }
#orderModal#orderModal .eps-brand-meghna .eps-brand-mark { background: linear-gradient(145deg,#4b9efe,#2460c9); }
#orderModal#orderModal .eps-brand-visa .eps-brand-mark { width: 48px; color: #123a87; background: linear-gradient(180deg,#fff,#dce9ff); font: italic 1000 14px/1 Arial,sans-serif; letter-spacing: -.04em; }
#orderModal#orderModal .eps-brand-mastercard .eps-brand-mark { position: relative; width: 48px; background: #fff; }
#orderModal#orderModal .eps-mastercard-mark i, #orderModal#orderModal .eps-mastercard-mark b { position: absolute; top: 6px; width: 17px; height: 17px; border-radius: 50%; }
#orderModal#orderModal .eps-mastercard-mark i { left: 8px; background: #eb001b; }
#orderModal#orderModal .eps-mastercard-mark b { left: 20px; background: #f79e1b; mix-blend-mode: multiply; }
#orderModal#orderModal .eps-brand-amex .eps-brand-mark { color: #fff; background: linear-gradient(145deg,#3e9bf5,#0753a5); font: 900 10px/1 Inter,system-ui,sans-serif; letter-spacing: .03em; }
#orderModal#orderModal .eps-brand-other .eps-brand-mark { color: #d7e7ff; background: linear-gradient(145deg,#334967,#182a41); }
#orderModal#orderModal .eps-other-mark svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
#orderModal#orderModal .eps-payment-pro-note { display: flex; align-items: flex-start; gap: 8px; margin: 16px 0 0; padding: 10px 11px; border: 1px solid rgba(75,175,146,.14); border-radius: 11px; background: rgba(10,45,44,.25); color: #91b7b6; font: 500 10px/1.5 Inter,system-ui,sans-serif; }
#orderModal#orderModal .eps-payment-pro-note-dot { flex: 0 0 6px; width: 6px; height: 6px; margin-top: 4px; border-radius: 50%; background: #3ad6a1; box-shadow: none; }
#orderModal#orderModal .eps-direct-pay-button { margin-top: 10px; }
#orderModal#orderModal #epsPayButton.is-opening {
  position: relative !important;
  overflow: hidden !important;
  filter: saturate(1.12) brightness(1.04) !important;
  animation: epsContinuePulse .8s ease-in-out infinite alternate !important;
}
#orderModal#orderModal #epsPayButton.is-opening::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  top: -8% !important;
  bottom: -8% !important;
  left: -38% !important;
  width: 28% !important;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.34), transparent) !important;
  transform: skewX(-18deg) !important;
  pointer-events: none !important;
  animation: epsContinueSweep .68s ease-in-out infinite !important;
}
#orderModal#orderModal #epsPayButton.is-opening .pp-i {
  transform-origin: center !important;
  animation: epsContinueArrow .55s ease-in-out infinite alternate !important;
}
@keyframes epsContinuePulse { from { box-shadow: none; } to { box-shadow: none; } }
@keyframes epsContinueSweep { to { left: 118%; } }
@keyframes epsContinueArrow { to { transform: translateX(4px); } }
@media (prefers-reduced-motion: reduce) {
  #orderModal#orderModal #epsPayButton.is-opening,
  #orderModal#orderModal #epsPayButton.is-opening::after,
  #orderModal#orderModal #epsPayButton.is-opening .pp-i { animation-duration: 1.8s !important; }
}
#orderModal#orderModal .eps-payment-footnote { color: #8092a9; font-size: 10px; line-height: 1.5; text-align: center; margin: 10px 8px 0; }
@media (min-width: 560px) {
  #orderModal#orderModal .eps-brand-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 390px) {
  #orderModal#orderModal .eps-payment-pro-panel { padding: 13px; border-radius: 17px; }
  #orderModal#orderModal .eps-payment-pro-head { gap: 0; margin-bottom: 15px; }
  #orderModal#orderModal .eps-brand-grid { gap: 6px; }
  #orderModal#orderModal .eps-brand-card { min-height: 61px; padding: 7px 4px; gap: 6px; }
  #orderModal#orderModal .eps-brand-name { font-size: 9px; }
  #orderModal#orderModal .eps-brand-mark { transform: scale(.93); }
}
@media (prefers-reduced-motion: reduce) { #orderModal#orderModal .eps-brand-card { transition: none; } }


/* v8 checkout corrections: single simple font, centered steps, authentic logos and a fixed CTA. */
#orderModal#orderModal,
#orderModal#orderModal * {
  font-family: Arial, Helvetica, sans-serif !important;
  font-synthesis: none !important;
}
#orderModal#orderModal .op-head {
  align-items: stretch !important;
  gap: 11px !important;
}
#orderModal#orderModal .custom-step-indicator {
  width: min(100%, 340px) !important;
  max-width: 100% !important;
  align-self: center !important;
  justify-content: center !important;
  margin: 0 auto !important;
}
#orderModal#orderModal .op-top {
  align-self: stretch !important;
  padding-right: 42px !important;
}
#orderModal#orderModal #orderTitle {
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-shadow: none !important;
}
#orderModal#orderModal .eps-brand-card {
  min-height: 68px !important;
  padding: 5px 2px !important;
  gap: 6px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  cursor: default !important;
}
#orderModal#orderModal .eps-brand-logo {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 38px !important;
  min-width: 0 !important;
  padding: 3px !important;
  overflow: hidden !important;
  border-radius: 6px !important;
  background: #fff !important;
}
#orderModal#orderModal .eps-brand-logo img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 78px !important;
  object-fit: contain !important;
  object-position: center !important;
}
#orderModal#orderModal .eps-wordmark-logo {
  color: #18334a !important;
  font: 700 13px/1 Arial, Helvetica, sans-serif !important;
  letter-spacing: -.3px !important;
  white-space: nowrap !important;
}
#orderModal#orderModal .eps-brand-name {
  color: #26354a !important;
  font: 600 10px/1.15 Arial, Helvetica, sans-serif !important;
  letter-spacing: 0 !important;
  overflow-wrap: anywhere !important;
}
#orderModal#orderModal .eps-brand-other .eps-brand-logo { color: #31425a !important; }
#orderModal#orderModal .eps-other-mark svg { width: 28px !important; height: 24px !important; stroke-width: 1.7 !important; }
#orderModal#orderModal .eps-payment-pro-note { display: none !important; }
#orderModal#orderModal.payment-step-active .op-body {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding-bottom: max(8px, env(safe-area-inset-bottom)) !important;
}
#orderModal#orderModal.payment-step-active #orderSummary { flex: 0 0 auto !important; }
#orderModal#orderModal.payment-step-active #paymentStep {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  min-height: 0 !important;
  overflow: hidden !important;
}
#orderModal#orderModal.payment-step-active #paymentStep .eps-payment-pro-panel {
  display: block !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  -webkit-overflow-scrolling: touch !important;
  margin: 0 0 8px !important;
  padding: 13px !important;
}
#orderModal#orderModal.payment-step-active #paymentStep .eps-direct-pay-button {
  position: relative !important;
  bottom: auto !important;
  z-index: 8 !important;
  display: flex !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  min-height: 58px !important;
  margin: 0 !important;
  padding: 12px 18px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6) !important;
}
#orderModal#orderModal #epsPayButton::after,
#orderModal#orderModal #epsPayButton::before { content: none !important; display: none !important; }
#orderModal#orderModal #epsPayButton .pp-i { flex: 0 0 auto !important; width: 21px !important; height: 21px !important; margin-left: 8px !important; }
#orderModal#orderModal.payment-step-active #paymentStep .eps-payment-error {
  flex: 0 0 auto !important;
  max-height: 70px !important;
  overflow-y: auto !important;
  margin: 0 0 7px !important;
  font: 400 12px/1.4 Arial, Helvetica, sans-serif !important;
}
#orderModal#orderModal.payment-step-active #paymentStep .eps-payment-footnote {
  flex: 0 0 auto !important;
  margin: 7px 4px 0 !important;
  padding-bottom: 2px !important;
  font: 400 10px/1.4 Arial, Helvetica, sans-serif !important;
}
@media (max-height: 720px) {
  #orderModal#orderModal .op-panel { max-height: calc(100dvh - 16px) !important; }
  #orderModal#orderModal .op-head { padding: 11px 13px 9px !important; }
  #orderModal#orderModal .custom-step-indicator { padding: 6px 10px !important; }
  #orderModal#orderModal.payment-step-active #paymentStep .eps-direct-pay-button { min-height: 52px !important; }
}
@media (max-width: 390px) {
  #orderModal#orderModal .eps-brand-card { min-height: 68px !important; }
  #orderModal#orderModal .eps-brand-logo { height: 33px !important; }
  #orderModal#orderModal .eps-brand-name { font-size: 9px !important; }
}

#orderModal#orderModal .eps-brand-logo.eps-logo-fallback { color: #26354a !important; font: 600 11px/1.2 Arial, Helvetica, sans-serif !important; text-align: center !important; overflow-wrap: anywhere !important; }

/* v11: payment brands are a logo display, not separate selectable buttons. */
#orderModal#orderModal .eps-brand-card {
  min-height: 66px !important;
  padding: 3px 2px !important;
  gap: 5px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  cursor: default !important;
  pointer-events: none !important;
  transform: none !important;
  transition: none !important;
}
#orderModal#orderModal .eps-brand-card:hover,
#orderModal#orderModal .eps-brand-card:active {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}
#orderModal#orderModal .eps-brand-logo {
  height: 42px !important;
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
#orderModal#orderModal .eps-brand-logo img {
  max-width: 112px !important;
  width: auto !important;
  max-height: 40px !important;
  height: auto !important;
  object-fit: contain !important;
  object-position: center !important;
  background: transparent !important;
}
#orderModal#orderModal .eps-brand-name {
  color: #dce8f6 !important;
  font: 400 10px/1.2 Arial, Helvetica, sans-serif !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}
#orderModal#orderModal .eps-wordmark-logo {
  width: auto !important;
  max-width: 100% !important;
  font: 700 13px/1 Arial, Helvetica, sans-serif !important;
  color: #f2f6fb !important;
}
#orderModal#orderModal .eps-brand-other { display: none !important; }
#orderModal#orderModal .eps-card-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
@media (max-width: 390px) {
  #orderModal#orderModal .eps-brand-card { min-height: 56px !important; padding: 2px 1px !important; }
  #orderModal#orderModal .eps-brand-logo { height: 34px !important; }
  #orderModal#orderModal .eps-brand-logo img { max-height: 32px !important; }
}


/* v16: mandatory paid-order details gate and clean account-info mode. */
#liPaidOrderGateChecking { position:fixed; inset:0; z-index:1002; display:flex; align-items:center; justify-content:center; padding:22px; background:rgba(3,8,18,.97); color:#eef5ff; font-family:Arial,Helvetica,sans-serif; pointer-events:auto; }
#liPaidOrderGateChecking .li-paid-gate-card { width:min(100%,390px); display:flex; flex-direction:column; align-items:center; gap:12px; padding:28px 22px; border:1px solid rgba(100,177,255,.24); border-radius:22px; background:linear-gradient(150deg,#18263a,#0b1423); box-shadow:none; text-align:center; }
#liPaidOrderGateChecking .li-paid-gate-mark { display:grid; place-items:center; width:54px; height:54px; border-radius:16px; background:linear-gradient(145deg,#ffe785,#f5ae00); color:#1b2230; font-weight:900; font-size:20px; }
#liPaidOrderGateChecking strong { font-size:18px; line-height:1.3; }
#liPaidOrderGateChecking p { margin:0; color:#aebdd0; font-size:13px; line-height:1.55; }
#liPaidOrderGateChecking .li-paid-gate-loader { width:34px; height:34px; border:3px solid rgba(255,255,255,.16); border-top-color:#39ddb0; border-radius:50%; animation:liPaidGateSpin .8s linear infinite; }
@keyframes liPaidGateSpin { to { transform:rotate(360deg); } }
#orderModal.show { z-index:1004 !important; }
#orderModal.account-info-active .op-head { display:none !important; }
#orderModal.account-info-active .op-body { padding-top:12px !important; }
#orderModal#orderModal .account-payment-success { display:flex; align-items:center; gap:12px; margin:0 0 14px; padding:14px; border:1px solid rgba(44,207,144,.28); border-radius:14px; background:linear-gradient(135deg,rgba(15,112,79,.22),rgba(13,35,48,.92)); color:#edfdf6; font-family:Arial,Helvetica,sans-serif; }
#orderModal#orderModal .account-payment-success.hidden { display:none !important; }
#orderModal#orderModal .account-payment-success-mark { flex:0 0 34px; display:grid; place-items:center; width:34px; height:34px; border-radius:50%; background:#20bc76; color:#fff; font-size:22px; font-weight:800; }
#orderModal#orderModal .account-payment-success strong { display:block; margin-bottom:4px; font-size:16px; line-height:1.3; }
#orderModal#orderModal .account-payment-success small { display:block; color:#b4d4ca; font-size:12px; line-height:1.5; }
#orderModal#orderModal .credential-title, #orderModal#orderModal .credential-sub { display:none !important; }
#orderModal#orderModal .credential-panel { margin-top:0 !important; }
#orderModal#orderModal .credential-option { display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:center !important; gap:8px !important; min-height:96px !important; padding:10px 6px !important; background:#fff !important; color:#1b2a3b !important; border:1px solid #dce4ed !important; border-radius:14px !important; box-shadow:none !important; font:700 12px/1.2 Arial,Helvetica,sans-serif !important; }
#orderModal#orderModal .credential-option.active { background:#fff !important; color:#14243a !important; border:2px solid #f5b900 !important; box-shadow:0 0 0 3px rgba(245,185,0,.14) !important; }
#orderModal#orderModal .credential-option .co-ico { display:grid !important; place-items:center !important; width:48px !important; height:48px !important; padding:5px !important; border-radius:10px !important; background:#fff !important; color:#1673ce !important; }
#orderModal#orderModal .credential-option .co-ico svg { display:block !important; width:100% !important; height:100% !important; }
#orderModal#orderModal .paid-details-required { display:flex; flex-direction:column; gap:8px; margin:12px 0; padding:13px; border:1px solid rgba(255,191,35,.32); border-radius:13px; background:linear-gradient(145deg,rgba(82,57,10,.45),rgba(25,30,43,.95)); color:#fff4cf; }
#orderModal#orderModal .paid-details-required strong { font-size:13px; line-height:1.4; }
#orderModal#orderModal .paid-details-required span { color:#d7d8df; font-size:12px; line-height:1.5; }
#orderModal#orderModal .paid-details-required button { align-self:flex-start; border:0; border-radius:9px; padding:9px 12px; background:linear-gradient(135deg,#ffe37a,#f5b400); color:#251c06; font:700 12px Arial,Helvetica,sans-serif; cursor:pointer; }
.customer-order-card.needs-account-details { border-color:rgba(255,190,36,.55) !important; }
.customer-order-card .status-pill.details-needed { background:linear-gradient(135deg,#ffe78f,#ffbd24) !important; color:#322400 !important; white-space:normal; text-align:center; }
@media (prefers-reduced-motion:reduce) { #liPaidOrderGateChecking .li-paid-gate-loader { animation-duration:2s; } }


/* v18: keep the paid-order requirement actionable if order verification/form loading fails. */
#liPaidOrderGateChecking .li-paid-gate-loader.hidden { display:none !important; }
#liPaidOrderGateChecking .li-paid-gate-actions { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:10px; margin-top:8px; }
#liPaidOrderGateChecking .li-paid-gate-actions button, #liPaidOrderGateChecking .li-paid-gate-actions a { display:inline-flex; align-items:center; justify-content:center; min-height:40px; border-radius:10px; padding:10px 14px; font:700 13px/1.2 Arial,Helvetica,sans-serif; text-decoration:none; cursor:pointer; }
#liPaidOrderGateChecking .li-paid-gate-actions button { border:0; background:linear-gradient(135deg,#ffe785,#f5ae00); color:#241b05; }
#liPaidOrderGateChecking .li-paid-gate-actions button:disabled { opacity:.65; cursor:wait; }
#liPaidOrderGateChecking .li-paid-gate-actions a { border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.06); color:#eef5ff; }