/*! CSS Used from: https://checkout.xendit.co/assets/main-a08X0zbg.css */
*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:currentColor;}
:before,:after{--tw-content:"";}
html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:OpenSans,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;}
body{margin:0;line-height:inherit;}
hr{height:0;color:inherit;border-top-width:1px;}
h2,h3{font-size:inherit;font-weight:inherit;}
strong{font-weight:bolder;}
table{text-indent:0;border-color:inherit;border-collapse:collapse;}
button,input{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0;}
button{text-transform:none;}
button{-webkit-appearance:button;background-color:transparent;background-image:none;}
h2,h3,hr,p{margin:0;}
fieldset{margin:0;padding:0;}
ul{list-style:none;margin:0;padding:0;}
input::placeholder{opacity:1;color:#9ca3af;}
button{cursor:pointer;}
:disabled{cursor:default;}
img,svg{display:block;vertical-align:middle;}
img{max-width:100%;height:auto;}
[hidden]{display:none;}
*,:before,:after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59, 130, 246, .5);--tw-ring-offset-shadow:0 0 rgba(0,0,0,0);--tw-ring-shadow:0 0 rgba(0,0,0,0);--tw-shadow:0 0 rgba(0,0,0,0);--tw-shadow-colored:0 0 rgba(0,0,0,0);}
.fixed{position:fixed;}
.absolute{position:absolute;}
.relative{position:relative;}
.inset-0{top:0;right:0;bottom:0;left:0;}
.inset-x-0{left:0;right:0;}
.bottom-0{bottom:0;}
.left-0{left:0;}
.right-0{right:0;}
.top-full{top:100%;}
.z-10{z-index:10;}
.-mx-2{margin-left:-.5rem;margin-right:-.5rem;}
.mx-auto{margin-left:auto;margin-right:auto;}
.my-3{margin-top:.75rem;margin-bottom:.75rem;}
.-ml-px{margin-left:-1px;}
.mb-1{margin-bottom:.25rem;}
.mb-4{margin-bottom:1rem;}
.ml-2{margin-left:.5rem;}
.mr-2{margin-right:.5rem;}
.mt-1{margin-top:.25rem;}
.line-clamp-1{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;}
.block{display:block;}
.flex{display:flex;}
.inline-flex{display:inline-flex;}
.hidden{display:none;}
.h-10{height:2.5rem;}
.h-12{height:3rem;}
.h-16{height:4rem;}
.h-4{height:1rem;}
.h-6{height:1.5rem;}
.h-8{height:2rem;}
.h-full{height:100%;}
.max-h-44{max-height:11rem;}
.min-h-screen{min-height:100vh;}
.w-1\/2{width:50%;}
.w-2\/5{width:40%;}
.w-4{width:1rem;}
.w-48{width:12rem;}
.w-6{width:1.5rem;}
.w-8{width:2rem;}
.w-9{width:2.25rem;}
.w-full{width:100%;}
.w-max{width:-moz-max-content;width:-webkit-max-content;width:max-content;}
.max-w-screen-sm{max-width:640px;}
.max-w-sm{max-width:24rem;}
.flex-1{flex:1 1 0%;}
.flex-shrink-0{flex-shrink:0;}
.basis-1\/2{flex-basis:50%;}
.origin-top-left{transform-origin:top left;}
.scale-y-0{--tw-scale-y:0;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(0);transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));}
.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));}
.flex-col{flex-direction:column;}
.items-start{align-items:flex-start;}
.items-center{align-items:center;}
.items-baseline{align-items:baseline;}
.items-stretch{align-items:stretch;}
.justify-center{justify-content:center;}
.justify-between{justify-content:space-between;}
.gap-1{gap:.25rem;}
.gap-x-4{-moz-column-gap:1rem;column-gap:1rem;}
.space-x-1>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:0rem;margin-right:calc(.25rem * var(--tw-space-x-reverse));margin-left:calc(.25rem * (1 - var(--tw-space-x-reverse)));margin-left:.25rem;margin-left:calc(.25rem * calc(1 - var(--tw-space-x-reverse)));}
.space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:0rem;margin-right:calc(.5rem * var(--tw-space-x-reverse));margin-left:calc(.5rem * (1 - var(--tw-space-x-reverse)));margin-left:.5rem;margin-left:calc(.5rem * calc(1 - var(--tw-space-x-reverse)));}
.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.5rem * (1 - var(--tw-space-y-reverse)));margin-top:.5rem;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:0rem;margin-bottom:calc(.5rem * var(--tw-space-y-reverse));}
.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem * (1 - var(--tw-space-y-reverse)));margin-top:1rem;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:0rem;margin-bottom:calc(1rem * var(--tw-space-y-reverse));}
.divide-y-\.5>:not([hidden])~:not([hidden]){--tw-divide-y-reverse:0;border-top-width:calc(.5px * (1 - var(--tw-divide-y-reverse)));border-top-width:.5px;border-top-width:calc(.5px * calc(1 - var(--tw-divide-y-reverse)));border-bottom-width:0px;border-bottom-width:calc(.5px * var(--tw-divide-y-reverse));}
.divide-xen-gray-300>:not([hidden])~:not([hidden]){--tw-divide-opacity:1;border-color:#ebebeb;border-color:rgba(235,235,235,var(--tw-divide-opacity));}
.self-center{align-self:center;}
.overflow-hidden{overflow:hidden;}
.overflow-y-auto{overflow-y:auto;}
.rounded{border-radius:.25rem;}
.rounded-lg{border-radius:.5rem;}
.rounded-md{border-radius:.375rem;}
.rounded-sm{border-radius:.125rem;}
.rounded-l-none{border-top-left-radius:0;border-bottom-left-radius:0;}
.rounded-r-none{border-top-right-radius:0;border-bottom-right-radius:0;}
.border{border-width:1px;}
.border-\.5{border-width:.5px;}
.border-b{border-bottom-width:1px;}
.border-primary{border-color:#4573ff;border-color:var(--primary-color, #4573FF);}
.border-xen-gray-200{--tw-border-opacity:1;border-color:#f2f2f2;border-color:rgba(242,242,242,var(--tw-border-opacity));}
.border-xen-gray-300{--tw-border-opacity:1;border-color:#ebebeb;border-color:rgba(235,235,235,var(--tw-border-opacity));}
.border-xen-gray-400{--tw-border-opacity:1;border-color:#dbdbdb;border-color:rgba(219,219,219,var(--tw-border-opacity));}
.border-xen-gray-500{--tw-border-opacity:1;border-color:#ccc;border-color:rgba(204,204,204,var(--tw-border-opacity));}
.\!bg-white{--tw-bg-opacity:1!important;background-color:#fff!important;background-color:rgba(255,255,255,var(--tw-bg-opacity))!important;}
.bg-primary{background-color:#4573ff;background-color:var(--primary-color, #4573FF);}
.bg-white{--tw-bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--tw-bg-opacity));}
.bg-xen-gray-100{--tw-bg-opacity:1;background-color:#fafafa;background-color:rgba(250,250,250,var(--tw-bg-opacity));}
.bg-xen-gray-600{--tw-bg-opacity:1;background-color:#b8b8b8;background-color:rgba(184,184,184,var(--tw-bg-opacity));}
.object-contain{-o-object-fit:contain;object-fit:contain;}
.p-2{padding:.5rem;}
.p-4{padding:1rem;}
.px-1{padding-left:.25rem;padding-right:.25rem;}
.px-2{padding-left:.5rem;padding-right:.5rem;}
.px-4{padding-left:1rem;padding-right:1rem;}
.py-0\.5{padding-top:.125rem;padding-bottom:.125rem;}
.py-1{padding-top:.25rem;padding-bottom:.25rem;}
.py-2{padding-top:.5rem;padding-bottom:.5rem;}
.py-3{padding-top:.75rem;padding-bottom:.75rem;}
.py-4{padding-top:1rem;padding-bottom:1rem;}
.py-8{padding-top:2rem;padding-bottom:2rem;}
.pb-12{padding-bottom:3rem;}
.pb-4{padding-bottom:1rem;}
.pb-6{padding-bottom:1.5rem;}
.pr-1\.5{padding-right:.375rem;}
.pr-2{padding-right:.5rem;}
.pt-2{padding-top:.5rem;}
.pt-3{padding-top:.75rem;}
.pt-4{padding-top:1rem;}
.text-left{text-align:left;}
.text-center{text-align:center;}
.text-right{text-align:right;}
.text-3xl{font-size:24px;}
.text-5xl{font-size:40px;}
.text-\[11px\]{font-size:11px;}
.text-\[8px\]{font-size:8px;}
.text-base{font-size:14px;}
.text-lg{font-size:16px;}
.text-sm{font-size:12px;}
.text-xl{font-size:18px;}
.font-bold{font-weight:700;}
.font-light{font-weight:300;}
.font-medium{font-weight:500;}
.font-semibold{font-weight:600;}
.uppercase{text-transform:uppercase;}
.leading-10{line-height:2.5rem;}
.\!text-white{--tw-text-opacity:1!important;color:#fff!important;color:rgba(255,255,255,var(--tw-text-opacity))!important;}
.text-primary{color:#4573ff;color:var(--primary-color, #4573FF);}
.text-white{--tw-text-opacity:1;color:#fff;color:rgba(255,255,255,var(--tw-text-opacity));}
.text-xen-black-400{--tw-text-opacity:1;color:#323232;color:rgba(50,50,50,var(--tw-text-opacity));}
.text-xen-gray-600{--tw-text-opacity:1;color:#b8b8b8;color:rgba(184,184,184,var(--tw-text-opacity));}
.text-xen-gray-700{--tw-text-opacity:1;color:#7a7a7a;color:rgba(122,122,122,var(--tw-text-opacity));}
.text-xen-gray-900{--tw-text-opacity:1;color:#3d3d3d;color:rgba(61,61,61,var(--tw-text-opacity));}
.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
.placeholder-xen-gray-500::placeholder{--tw-placeholder-opacity:1;color:#ccc;color:rgba(204,204,204,var(--tw-placeholder-opacity));}
.placeholder-xen-gray-600::placeholder{--tw-placeholder-opacity:1;color:#b8b8b8;color:rgba(184,184,184,var(--tw-placeholder-opacity));}
.opacity-0{opacity:0;}
.opacity-20{opacity:.2;}
.opacity-50{opacity:.5;}
.shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:0 0 #0000,0 0 #0000,0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;box-shadow:var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)),var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)),var(--tw-shadow);}
.outline-none{outline:2px solid transparent;outline-offset:2px;}
.ring-primary{--tw-ring-color:var(--primary-color, #4573FF);}
.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-text-decoration-color,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-text-decoration-color,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;}
.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;}
.transition-colors{transition-property:color,background-color,border-color,fill,stroke,-webkit-text-decoration-color;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,-webkit-text-decoration-color;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;}
.transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;}
.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;}
.duration-100{transition-duration:.1s;}
.duration-200{transition-duration:.2s;}
.duration-100{animation-duration:.1s;}
.duration-200{animation-duration:.2s;}
strong{font-weight:600;}
.first\:mt-0:first-child{margin-top:0;}
.first\:rounded-t-md:first-child{border-top-left-radius:.375rem;border-top-right-radius:.375rem;}
.last\:rounded-b-md:last-child{border-bottom-right-radius:.375rem;border-bottom-left-radius:.375rem;}
.hover\:z-0:hover{z-index:0;}
.hover\:border-primary:hover{border-color:#4573ff;border-color:var(--primary-color, #4573FF);}
.hover\:border-xen-gray-600:hover{--tw-border-opacity:1;border-color:#b8b8b8;border-color:rgba(184,184,184,var(--tw-border-opacity));}
.hover\:\!bg-primary:hover{background-color:#4573ff!important;background-color:var(--primary-color, #4573FF)!important;}
.hover\:bg-xen-gray-200:hover{--tw-bg-opacity:1;background-color:#f2f2f2;background-color:rgba(242,242,242,var(--tw-bg-opacity));}
.hover\:text-white:hover{--tw-text-opacity:1;color:#fff;color:rgba(255,255,255,var(--tw-text-opacity));}
.hover\:brightness-110:hover{--tw-brightness:brightness(1.1);filter:var(--tw-blur) brightness(1.1) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);}
.focus\:z-0:focus{z-index:0;}
.focus\:border-primary:focus{border-color:#4573ff;border-color:var(--primary-color, #4573FF);}
.focus\:bg-xen-gray-100:focus{--tw-bg-opacity:1;background-color:#fafafa;background-color:rgba(250,250,250,var(--tw-bg-opacity));}
.focus\:ring-1:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),0 0 #0000;box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 rgba(0,0,0,0));}
.focus\:brightness-110:focus{--tw-brightness:brightness(1.1);filter:var(--tw-blur) brightness(1.1) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);}
.disabled\:bg-xen-gray-300:disabled{--tw-bg-opacity:1;background-color:#ebebeb;background-color:rgba(235,235,235,var(--tw-bg-opacity));}
.disabled\:bg-opacity-25:disabled{--tw-bg-opacity:.25;}
.disabled\:text-xen-gray-700:disabled{--tw-text-opacity:1;color:#7a7a7a;color:rgba(122,122,122,var(--tw-text-opacity));}
.data-\[state\=closed\]\:animate-accordion-up[data-state=closed]{animation:accordion-up .2s ease-out;}
.data-\[state\=closed\]\:animate-collapsible-up[data-state=closed]{animation:collapsible-up .3s ease-out;}
.data-\[state\=open\]\:animate-accordion-down[data-state=open]{animation:accordion-down .2s ease-out;}
.data-\[state\=open\]\:bg-xen-gray-100[data-state=open]{--tw-bg-opacity:1;background-color:#fafafa;background-color:rgba(250,250,250,var(--tw-bg-opacity));}
@media (min-width: 768px){
.md\:hidden{display:none;}
.md\:h-12{height:3rem;}
.md\:h-16{height:4rem;}
.md\:w-12{width:3rem;}
.md\:text-2xl{font-size:20px;}
}
@media (min-width: 1024px){
.lg\:ml-4{margin-left:1rem;}
.lg\:block{display:block;}
.lg\:flex{display:flex;}
.lg\:hidden{display:none;}
.lg\:h-16{height:4rem;}
.lg\:h-auto{height:auto;}
.lg\:w-16{width:4rem;}
.lg\:max-w-2xl{max-width:42rem;}
.lg\:max-w-screen-sm{max-width:640px;}
.lg\:border-xen-gray-400{--tw-border-opacity:1;border-color:#dbdbdb;border-color:rgba(219,219,219,var(--tw-border-opacity));}
.lg\:bg-transparent{background-color:#0000;}
.lg\:px-0{padding-left:0;padding-right:0;}
.lg\:px-8{padding-left:2rem;padding-right:2rem;}
.lg\:py-8{padding-top:2rem;padding-bottom:2rem;}
.lg\:pl-6{padding-left:1.5rem;}
.lg\:text-2xl{font-size:20px;}
.lg\:text-3xl{font-size:24px;}
.lg\:text-primary{color:#4573ff;color:var(--primary-color, #4573FF);}
}
@media (min-width: 1280px){
.xl\:w-1\/3{width:33.333333%;}
.xl\:px-8{padding-left:2rem;padding-right:2rem;}
}
.\[\&\[data-state\=open\]\>span\>\[data-role\=preview\]\]\:hidden[data-state=open]>span>[data-role=preview]{display:none;}
.\[\&\[data-state\=open\]\>span\>svg\>path\]\:first\:stroke-primary:first-child[data-state=open]>span>svg>path{stroke:#4573ff;stroke:var(--primary-color, #4573FF);}
.\[\&\[data-state\=open\]\>svg\]\:rotate-180[data-state=open]>svg{--tw-rotate:180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(180deg) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));}
/*! CSS Used keyframes */
@keyframes accordion-up{0%{height:var(--radix-accordion-content-height);}to{height:0;}}
@keyframes collapsible-up{0%{height:var(--radix-collapsible-content-height);}to{height:0;}}
@keyframes accordion-down{0%{height:0;}to{height:var(--radix-accordion-content-height);}}
/*! CSS Used fontfaces */
@font-face{font-family:OpenSans;src:url(https://checkout.xendit.co/fonts/OpenSans/OpenSans-Regular.ttf);font-display:swap;}
@font-face{font-family:OpenSans;font-weight:300;src:url(https://checkout.xendit.co/fonts/OpenSans/OpenSans-Light.ttf);font-display:swap;}
@font-face{font-family:OpenSans;font-weight:500;src:url(https://checkout.xendit.co/fonts/OpenSans/OpenSans-Medium.ttf);font-display:swap;}
@font-face{font-family:OpenSans;font-weight:600;src:url(https://checkout.xendit.co/fonts/OpenSans/OpenSans-SemiBold.ttf);font-display:swap;}
@font-face{font-family:OpenSans;font-weight:700;src:url(https://checkout.xendit.co/fonts/OpenSans/OpenSans-Bold.ttf);font-display:swap;}

/* ---- Checkout adapter additions ---- */
.cko-input{padding:0 .5rem;height:2.5rem;font-size:18px;color:#3d3d3d;background:#fff;border:1px solid #dbdbdb;border-radius:.25rem;outline:none;transition:border-color .15s;width:100%;}
.cko-input::placeholder{color:#b8b8b8;}
.cko-input:hover{border-color:#b8b8b8;}
.cko-input:focus{border-color:var(--primary-color,#4573ff);}
.cko-input:disabled{background:#ebebeb;color:#7a7a7a;cursor:default;}

/* Accordion collapsed by default; opens when .cko-open */
.cko-accordion > [data-cko-accordion-content]{display:none;}
.cko-accordion.cko-open > [data-cko-accordion-content]{display:block;background:#fafafa;}
.cko-accordion.cko-open > h3 > [data-cko-accordion-trigger] > svg.cko-accordion-chevron{transform:rotate(180deg);}
.cko-accordion.cko-open > h3 > [data-cko-accordion-trigger] .cko-method-preview{display:none;}
.cko-accordion.cko-open > h3 > [data-cko-accordion-trigger] > span > svg path:first-of-type,
.cko-accordion.cko-open > h3 > [data-cko-accordion-trigger] > span > svg rect:first-of-type{stroke:var(--primary-color,#4573ff);}
.cko-accordion-chevron{transition:transform .2s;}

/* Pay button — gray when disabled, brand when enabled */
.cko-pay-btn{background:#b8b8b8;cursor:not-allowed;border-color:transparent;}
.cko-pay-btn:not(:disabled){background:var(--primary-color,#4573ff);cursor:pointer;}
.cko-pay-btn:not(:disabled):hover{filter:brightness(1.08);}

/* Wallet tile + bank grid */
.cko-wallet-tile{background:#fff;transition:border-color .15s;}
.cko-wallet-tile:hover{border-color:var(--primary-color,#4573ff);}
.cko-bank-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;}
@media(max-width:480px){.cko-bank-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
.cko-bank-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.25rem;padding:.5rem;background:#fff;border:1px solid #dbdbdb;border-radius:.25rem;cursor:pointer;transition:border-color .15s,background .15s;}
.cko-bank-tile img{height:24px;max-width:100%;object-fit:contain;}
.cko-bank-tile span{font-size:11px;color:#3d3d3d;text-align:center;line-height:1.1;}
.cko-bank-tile:hover{border-color:var(--primary-color,#4573ff);}
.cko-bank-tile.cko-selected{border-color:var(--primary-color,#4573ff);background:#eef3ff;}

/* Overlay (processing + OTP) */
.cko-overlay{position:fixed;inset:0;background:rgba(20,20,20,.55);display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem;}
.cko-overlay[hidden]{display:none;}
.cko-processing-box{background:#fff;border-radius:.5rem;padding:2rem;width:100%;max-width:360px;display:flex;flex-direction:column;align-items:center;}
.cko-otp-box{background:#fff;border-radius:.5rem;padding:1.5rem;width:100%;max-width:380px;}
.cko-otp-bank-name{font-size:14px;font-weight:600;color:var(--primary-color,#4573ff);text-align:center;margin-bottom:.75rem;text-transform:uppercase;letter-spacing:.5px;}
.cko-otp-desc{font-size:13px;color:#3d3d3d;text-align:center;margin-bottom:1rem;line-height:1.5;}
.cko-otp-amount{text-align:center;font-size:14px;margin-bottom:1rem;padding:.5rem;background:#f7f9ff;border-radius:.25rem;}
.cko-otp-input{text-align:center;font-size:24px;letter-spacing:.5em;padding-left:.5em;}
.cko-otp-msg{margin-top:.5rem;text-align:center;color:#d6353e;font-size:13px;min-height:18px;}
.cko-otp-resend{text-align:center;margin-top:.75rem;font-size:12px;color:#7a7a7a;}
.cko-otp-resend a{color:var(--primary-color,#4573ff);text-decoration:none;}

/* Spinner */
.cko-spinner{width:48px;height:48px;border:4px solid #ebebeb;border-top-color:var(--primary-color,#4573ff);border-radius:50%;animation:cko-spin 0.9s linear infinite;margin-bottom:1rem;}
@keyframes cko-spin{to{transform:rotate(360deg);}}