/* BILSTORE_VISUAL_V1 — maroon/berry theme; all images served by the website itself. */
a.whatsapp-float.bil-cs-roblox {
  --cs-berry:#c92049; --cs-maroon:#6a0d25;
  display:flex;flex-direction:column;align-items:center;justify-content:flex-end;
  position:fixed;right:20px;bottom:20px;bottom:calc(16px + env(safe-area-inset-bottom,0px));
  z-index:35;width:178px;max-width:40vw;height:auto;min-height:0;
  padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;
  color:#fff;text-align:center;text-decoration:none;line-height:1.15;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-size:12px;isolation:isolate;transition:transform .18s ease;
}
a.whatsapp-float.bil-cs-roblox:hover{transform:translateY(-3px)}
a.whatsapp-float.bil-cs-roblox:focus-visible{outline:3px solid #ffabc2;outline-offset:5px;border-radius:12px}
.bil-cs-roblox .bil-cs-bubble {
  position:relative;z-index:2;box-sizing:border-box;display:block;width:100%;
  padding:10px 5px 11px;border:1.5px solid #d94a6c;border-radius:13px;
  background:linear-gradient(155deg,#411326,#190e17 82%);color:#fff;
  box-shadow:0 0 0 3px #c9204910,0 0 16px #c9204955,0 8px 18px #0007;
}
.bil-cs-roblox .bil-cs-bubble::after {
  content:'';position:absolute;bottom:-7px;left:calc(50% - 7px);width:12px;height:12px;
  background:#23101a;border-right:1.5px solid #d94a6c;border-bottom:1.5px solid #d94a6c;transform:rotate(45deg);
}
.bil-cs-roblox .bil-cs-question{display:block;font-size:12px;font-weight:850;letter-spacing:-.25px;white-space:nowrap}
.bil-cs-roblox .bil-cs-invite{display:block;margin-top:3px;color:#fff5f8;font-size:18px;font-weight:950;letter-spacing:-.55px;white-space:nowrap}
.bil-cs-roblox .bil-cs-avatar {
  display:block;width:94%;height:auto;max-width:none;object-fit:contain;position:relative;
  margin:7px 0 -5px;filter:drop-shadow(0 0 7px #c92049a6);
  -webkit-mask-image:linear-gradient(#000 86%,transparent 100%);mask-image:linear-gradient(#000 86%,transparent 100%);
}
.bil-cs-roblox .bil-cs-cue{position:relative;z-index:3;margin-top:-4px;padding:5px 11px;border:1px solid #9a3351;border-radius:99px;background:#301523;color:#ffd6e2;font-size:10px;line-height:1.2;letter-spacing:.2px}
/* Preserve each amount's exact text. The icon is decorative, to its left. */
.bil-v-coin{display:inline-flex!important;align-items:center;gap:.24em;vertical-align:baseline;white-space:nowrap}
.bil-v-coin::before{content:'';display:inline-block;flex:none;width:1.05em;height:1.05em;min-width:16px;min-height:16px;background:url('/assets/bils-coin-v1.png') center/contain no-repeat}
#coinPriceV5 .bil-v-coin::before{width:19px;height:19px}
#coinBalanceV5 .bil-v-coin::before{width:15px;height:15px;min-width:15px;min-height:15px}
/* This is ONLY the wordmark area, not a replacement for the payable QR code.
   The crop matches BILSTORE_QRIS_BRAND_LOGO_V1 in the supplied topup-six.css. */
.bil-v-qris {
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  width:70px;min-width:0;max-width:100%;height:30px;vertical-align:middle;
  border:0!important;border-radius:5px!important;background:#fff!important;
  padding:2px 4px!important;color:transparent!important;font-size:0!important;line-height:0!important;
  overflow:hidden!important;box-sizing:border-box;
}
.bil-v-qris::before,
body .purchase-route .six-payment input[name="purchasePayment"][value="qris"] + .six-payment-brand.bil-v-qris::before {
  content:''!important;display:block!important;flex:0 0 auto!important;
  width:100%!important;height:auto!important;aspect-ratio:210/86!important;
  background-image:url('/assets/qris-dana-bill-store.png')!important;
  background-repeat:no-repeat!important;background-color:#fff!important;
  background-size:540.95238095% auto!important;
  background-position:6.69546436% 3.96301189%!important;
}
.bil-v-qris > *{display:none!important}
body .purchase-route .six-payment input[name="purchasePayment"][value="qris"] + .six-payment-brand.bil-v-qris{width:100%;height:32px!important;min-width:0}
body .purchase-route.topup-maroon-v1 .six-payment.bil-v-qris-row,
.six-payment.bil-v-qris-row{grid-template-columns:18px 64px minmax(0,1fr) auto}
#qrisHeading .bil-v-qris{width:98px;height:40px;margin-left:4px;vertical-align:middle}
.bil-v-selected-method{display:flex;align-items:center;gap:6px;min-height:34px;margin:8px 0;color:inherit;font-size:13px;font-weight:650}
.bil-v-selected-method[hidden]{display:none!important}
.bil-v-selected-method>img{display:block;object-fit:contain}
@media(max-width:1024px){
 body .purchase-route.topup-maroon-v1 .six-payment.bil-v-qris-row,.six-payment.bil-v-qris-row{grid-template-columns:18px 60px minmax(0,1fr)}
 body .purchase-route.topup-maroon-v1 .six-payment.bil-v-qris-row > b,.six-payment.bil-v-qris-row > b{grid-column:3;justify-self:start}
}
@media(max-width:600px){
 a.whatsapp-float.bil-cs-roblox{right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));width:126px;max-width:36vw}
 .bil-cs-roblox .bil-cs-bubble{padding:7px 3px 8px;border-radius:10px}
 .bil-cs-roblox .bil-cs-question{font-size:8.4px;letter-spacing:-.25px}
 .bil-cs-roblox .bil-cs-invite{font-size:12.6px;letter-spacing:-.45px;margin-top:3px}
 .bil-cs-roblox .bil-cs-cue{font-size:8px;padding:4px 7px}
 body.purchase-route-active a.whatsapp-float.bil-cs-roblox{bottom:calc(92px + env(safe-area-inset-bottom,0px));width:110px}
 body.purchase-route-active .bil-cs-roblox .bil-cs-question{font-size:7.4px}
 body.purchase-route-active .bil-cs-roblox .bil-cs-invite{font-size:11.2px}
}
/* Below modal dialogs and hidden while a fullscreen form is open. */
body:has(.modal.open) a.whatsapp-float.bil-cs-roblox,
body:has(dialog[open]) a.whatsapp-float.bil-cs-roblox{visibility:hidden;pointer-events:none}
@media(prefers-reduced-motion:reduce){a.whatsapp-float.bil-cs-roblox{transition:none}a.whatsapp-float.bil-cs-roblox:hover{transform:none}}
@media print{a.whatsapp-float.bil-cs-roblox{display:none!important}}