@nowramp/form 0.1.35 → 0.1.37

package/dist/index.js

@@ -4,127 +4,127 @@
   if(document.getElementById(id))return;
   var s=document.createElement('style');
   s.id=id;
-  s.textContent=`@layer nowramp-form{.theme-dark{--t-bg: #000000;--t-surface: rgba(255,255,255,.1);--t-surface-hover: rgba(255,255,255,.14);--t-text: #ffffff;--t-text-secondary: rgba(255,255,255,.4);--t-text-tertiary: rgba(255,255,255,.3);--t-text-muted: rgba(255,255,255,.5);--t-border: rgba(255,255,255,.2);--t-border-focus: rgba(255,255,255,.5);--t-pill-bg: rgba(255,255,255,.1);--t-pill-hover: rgba(255,255,255,.15);--t-badge-bg: rgba(255,255,255,.15);--t-divider: rgba(255,255,255,.2);--t-close-bg: rgba(255,255,255,.1);--t-close-hover: rgba(255,255,255,.2);--t-icon-stroke: rgba(255,255,255,.4);--t-icon-close: rgba(255,255,255,.6);--t-accent: #0077FF;--t-cta-bg: var(--t-accent);--t-cta-text: #ffffff;--t-cta-hover: rgba(255,255,255,.9);--t-cta-active: rgba(255,255,255,.8);--t-modal-bg: #000000;--t-chain-border: #000000;--t-skeleton-from: rgba(255,255,255,.06);--t-skeleton-mid: rgba(255,255,255,.12);--t-scrollbar: rgba(255,255,255,.15);--t-card-icon-bg: rgba(255,255,255,.1);--t-card-icon-stroke: rgba(255,255,255,.6);--t-success: #10b981;--t-error: #EF4444}.theme-light{--t-bg: #F2F3F5;--t-surface: rgba(0,0,0,.05);--t-surface-hover: rgba(0,0,0,.08);--t-text: #111111;--t-text-secondary: rgba(0,0,0,.45);--t-text-tertiary: rgba(0,0,0,.3);--t-text-muted: rgba(0,0,0,.5);--t-border: rgba(0,0,0,.12);--t-border-focus: rgba(0,0,0,.3);--t-pill-bg: rgba(0,0,0,.06);--t-pill-hover: rgba(0,0,0,.1);--t-badge-bg: rgba(0,0,0,.08);--t-divider: rgba(0,0,0,.1);--t-close-bg: rgba(0,0,0,.06);--t-close-hover: rgba(0,0,0,.12);--t-icon-stroke: rgba(0,0,0,.35);--t-icon-close: rgba(0,0,0,.5);--t-accent: #0077FF;--t-cta-bg: var(--t-accent);--t-cta-text: #ffffff;--t-cta-hover: #222222;--t-cta-active: #333333;--t-modal-bg: #F2F3F5;--t-chain-border: #F2F3F5;--t-skeleton-from: rgba(0,0,0,.04);--t-skeleton-mid: rgba(0,0,0,.08);--t-scrollbar: rgba(0,0,0,.12);--t-card-icon-bg: rgba(0,0,0,.06);--t-card-icon-stroke: rgba(0,0,0,.5);--t-success: #10b981;--t-error: #EF4444}.custom-scroll::-webkit-scrollbar{width:4px}.custom-scroll::-webkit-scrollbar-track{background:transparent}.custom-scroll::-webkit-scrollbar-thumb{background:var(--t-scrollbar);border-radius:2px}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton{background:linear-gradient(90deg,var(--t-skeleton-from) 25%,var(--t-skeleton-mid) 50%,var(--t-skeleton-from) 75%);background-size:200% 100%;animation:shimmer 1.5s ease-in-out infinite;border-radius:4px}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.tab-fade-in{animation:fadeIn .3s ease-out both}.digit-slot{display:inline-block;overflow:hidden;vertical-align:top}.digit-slot-inner{transition:transform .35s cubic-bezier(.33,1,.68,1)}@keyframes nramp-spin{to{transform:rotate(360deg)}}.nramp-spinner{width:40px;height:40px;border:3px solid var(--t-border);border-top-color:var(--t-accent);border-radius:50%;animation:nramp-spin .8s linear infinite;margin:0 auto}.nramp-spinner-large{width:60px;height:60px;border-width:4px}.nramp-spinner-inline{width:16px;height:16px;border-width:2px;display:inline-block}.container{width:100%}@media (min-width: 640px){.container{max-width:640px}}@media (min-width: 768px){.container{max-width:768px}}@media (min-width: 1024px){.container{max-width:1024px}}@media (min-width: 1280px){.container{max-width:1280px}}@media (min-width: 1536px){.container{max-width:1536px}}.visible{visibility:visible}.static{position:static}.absolute{position:absolute}.relative{position:relative}.inset-0{top:0;right:0;bottom:0;left:0}.left-0{left:0}.right-3{right:.75rem}.top-0{top:0}.top-1\\/2{top:50%}.top-\\[3px\\]{top:3px}.z-20{z-index:20}.mx-5{margin-left:1.25rem;margin-right:1.25rem}.mb-1\\.5{margin-bottom:.375rem}.mb-2{margin-bottom:.5rem}.mb-2\\.5{margin-bottom:.625rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.mr-0\\.5{margin-right:.125rem}.mr-3{margin-right:.75rem}.mt-0\\.5{margin-top:.125rem}.mt-1{margin-top:.25rem}.mt-1\\.5{margin-top:.375rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.mt-\\[2px\\]{margin-top:2px}.block{display:block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.hidden{display:none}.h-\\[640px\\]{height:640px}.h-full{height:100%}.min-h-\\[640px\\]{min-height:640px}.w-0{width:0px}.w-full{width:100%}.min-w-0{min-width:0px}.max-w-\\[390px\\]{max-width:390px}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.-translate-y-1\\/2{--tw-translate-y: -50%;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))}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.flex-col{flex-direction:column}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-center{align-items:center}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:.25rem}.gap-1\\.5{gap:.375rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-3\\.5{gap:.875rem}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem * var(--tw-space-y-reverse))}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.rounded-full{border-radius:9999px}.border{border-width:1px}.border-white\\/20{border-color:#fff3}.bg-black{--tw-bg-opacity: 1;background-color:rgb(0 0 0 / var(--tw-bg-opacity, 1))}.bg-transparent{background-color:transparent}.bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.p-12{padding:3rem}.p-8{padding:2rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-8{padding-left:2rem;padding-right:2rem}.px-\\[18px\\]{padding-left:18px;padding-right:18px}.px-\\[2px\\]{padding-left:2px;padding-right:2px}.py-0\\.5{padding-top:.125rem;padding-bottom:.125rem}.py-10{padding-top:2.5rem;padding-bottom:2.5rem}.py-12{padding-top:3rem;padding-bottom:3rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-3\\.5{padding-top:.875rem;padding-bottom:.875rem}.py-5{padding-top:1.25rem;padding-bottom:1.25rem}.pb-1{padding-bottom:.25rem}.pb-2\\.5{padding-bottom:.625rem}.pb-5{padding-bottom:1.25rem}.pb-\\[14px\\]{padding-bottom:14px}.pb-\\[18px\\]{padding-bottom:18px}.pt-3{padding-top:.75rem}.pt-5{padding-top:1.25rem}.pt-6{padding-top:1.5rem}.pt-\\[12px\\]{padding-top:12px}.pt-\\[14px\\]{padding-top:14px}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.text-\\[11px\\]{font-size:11px}.text-\\[12px\\]{font-size:12px}.text-\\[13px\\]{font-size:13px}.text-\\[14px\\]{font-size:14px}.text-\\[15px\\]{font-size:15px}.text-\\[16px\\]{font-size:16px}.text-\\[17px\\]{font-size:17px}.text-\\[18px\\]{font-size:18px}.text-\\[20px\\]{font-size:20px}.text-\\[48px\\]{font-size:48px}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-semibold{font-weight:600}.lowercase{text-transform:lowercase}.leading-tight{line-height:1.25}.text-black{--tw-text-opacity: 1;color:rgb(0 0 0 / var(--tw-text-opacity, 1))}.text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.underline{text-decoration-line:underline}.shadow{--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.outline-none{outline:2px solid transparent;outline-offset:2px}.outline{outline-style:solid}.filter{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)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,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,text-decoration-color,fill,stroke;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-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.hover\\:opacity-70:hover{opacity:.7}
+  s.textContent=`@layer nowramp-form{.theme-dark{--t-bg: #000000;--t-surface: rgba(255,255,255,.1);--t-surface-hover: rgba(255,255,255,.14);--t-text: #ffffff;--t-text-secondary: rgba(255,255,255,.4);--t-text-tertiary: rgba(255,255,255,.3);--t-text-muted: rgba(255,255,255,.5);--t-border: rgba(255,255,255,.2);--t-border-focus: rgba(255,255,255,.5);--t-pill-bg: rgba(255,255,255,.1);--t-pill-hover: rgba(255,255,255,.15);--t-badge-bg: rgba(255,255,255,.15);--t-divider: rgba(255,255,255,.2);--t-close-bg: rgba(255,255,255,.1);--t-close-hover: rgba(255,255,255,.2);--t-icon-stroke: rgba(255,255,255,.4);--t-icon-close: rgba(255,255,255,.6);--t-accent: #0077FF;--t-cta-bg: var(--t-accent);--t-cta-text: #ffffff;--t-cta-hover: rgba(255,255,255,.9);--t-cta-active: rgba(255,255,255,.8);--t-modal-bg: #000000;--t-chain-border: #000000;--t-skeleton-from: rgba(255,255,255,.06);--t-skeleton-mid: rgba(255,255,255,.12);--t-scrollbar: rgba(255,255,255,.15);--t-card-icon-bg: rgba(255,255,255,.1);--t-card-icon-stroke: rgba(255,255,255,.6);--t-success: #10b981;--t-error: #EF4444}.theme-light{--t-bg: #F2F3F5;--t-surface: rgba(0,0,0,.05);--t-surface-hover: rgba(0,0,0,.08);--t-text: #111111;--t-text-secondary: rgba(0,0,0,.45);--t-text-tertiary: rgba(0,0,0,.3);--t-text-muted: rgba(0,0,0,.5);--t-border: rgba(0,0,0,.12);--t-border-focus: rgba(0,0,0,.3);--t-pill-bg: rgba(0,0,0,.06);--t-pill-hover: rgba(0,0,0,.1);--t-badge-bg: rgba(0,0,0,.08);--t-divider: rgba(0,0,0,.1);--t-close-bg: rgba(0,0,0,.06);--t-close-hover: rgba(0,0,0,.12);--t-icon-stroke: rgba(0,0,0,.35);--t-icon-close: rgba(0,0,0,.5);--t-accent: #0077FF;--t-cta-bg: var(--t-accent);--t-cta-text: #ffffff;--t-cta-hover: #222222;--t-cta-active: #333333;--t-modal-bg: #F2F3F5;--t-chain-border: #F2F3F5;--t-skeleton-from: rgba(0,0,0,.04);--t-skeleton-mid: rgba(0,0,0,.08);--t-scrollbar: rgba(0,0,0,.12);--t-card-icon-bg: rgba(0,0,0,.06);--t-card-icon-stroke: rgba(0,0,0,.5);--t-success: #10b981;--t-error: #EF4444}.custom-scroll::-webkit-scrollbar{width:4px}.custom-scroll::-webkit-scrollbar-track{background:transparent}.custom-scroll::-webkit-scrollbar-thumb{background:var(--t-scrollbar);border-radius:2px}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton{background:linear-gradient(90deg,var(--t-skeleton-from) 25%,var(--t-skeleton-mid) 50%,var(--t-skeleton-from) 75%);background-size:200% 100%;animation:shimmer 1.5s ease-in-out infinite;border-radius:4px}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.tab-fade-in{animation:fadeIn .3s ease-out both}.digit-slot{display:inline-block;overflow:hidden;vertical-align:top}.digit-slot-inner{transition:transform .35s cubic-bezier(.33,1,.68,1)}@keyframes nramp-spin{to{transform:rotate(360deg)}}.nramp-spinner{width:40px;height:40px;border:3px solid var(--t-border);border-top-color:var(--t-accent);border-radius:50%;animation:nramp-spin .8s linear infinite;margin:0 auto}.nramp-spinner-large{width:60px;height:60px;border-width:4px}.nramp-spinner-inline{width:16px;height:16px;border-width:2px;display:inline-block}.container{width:100%}@media (min-width: 640px){.container{max-width:640px}}@media (min-width: 768px){.container{max-width:768px}}@media (min-width: 1024px){.container{max-width:1024px}}@media (min-width: 1280px){.container{max-width:1280px}}@media (min-width: 1536px){.container{max-width:1536px}}.visible{visibility:visible}.static{position:static}.absolute{position:absolute}.relative{position:relative}.inset-0{top:0;right:0;bottom:0;left:0}.left-0{left:0}.right-3{right:.75rem}.top-0{top:0}.top-1\\/2{top:50%}.top-\\[3px\\]{top:3px}.z-20{z-index:20}.mx-5{margin-left:1.25rem;margin-right:1.25rem}.mb-1\\.5{margin-bottom:.375rem}.mb-2{margin-bottom:.5rem}.mb-2\\.5{margin-bottom:.625rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.mr-0\\.5{margin-right:.125rem}.mr-3{margin-right:.75rem}.mt-0\\.5{margin-top:.125rem}.mt-1{margin-top:.25rem}.mt-1\\.5{margin-top:.375rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.mt-\\[2px\\]{margin-top:2px}.block{display:block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.hidden{display:none}.h-\\[640px\\]{height:640px}.h-full{height:100%}.min-h-\\[640px\\]{min-height:640px}.w-0{width:0px}.w-full{width:100%}.min-w-0{min-width:0px}.max-w-\\[390px\\]{max-width:390px}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.-translate-y-1\\/2{--tw-translate-y: -50%;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))}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.flex-col{flex-direction:column}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-center{align-items:center}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:.25rem}.gap-1\\.5{gap:.375rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-3\\.5{gap:.875rem}.gap-4{gap:1rem}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem * var(--tw-space-y-reverse))}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.rounded-full{border-radius:9999px}.border{border-width:1px}.border-white\\/20{border-color:#fff3}.bg-black{--tw-bg-opacity: 1;background-color:rgb(0 0 0 / var(--tw-bg-opacity, 1))}.bg-transparent{background-color:transparent}.bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.p-12{padding:3rem}.p-8{padding:2rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-8{padding-left:2rem;padding-right:2rem}.px-\\[18px\\]{padding-left:18px;padding-right:18px}.px-\\[2px\\]{padding-left:2px;padding-right:2px}.py-0\\.5{padding-top:.125rem;padding-bottom:.125rem}.py-10{padding-top:2.5rem;padding-bottom:2.5rem}.py-12{padding-top:3rem;padding-bottom:3rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-3\\.5{padding-top:.875rem;padding-bottom:.875rem}.py-5{padding-top:1.25rem;padding-bottom:1.25rem}.pb-1{padding-bottom:.25rem}.pb-2\\.5{padding-bottom:.625rem}.pb-5{padding-bottom:1.25rem}.pb-\\[14px\\]{padding-bottom:14px}.pb-\\[18px\\]{padding-bottom:18px}.pt-3{padding-top:.75rem}.pt-5{padding-top:1.25rem}.pt-6{padding-top:1.5rem}.pt-\\[12px\\]{padding-top:12px}.pt-\\[14px\\]{padding-top:14px}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.text-\\[11px\\]{font-size:11px}.text-\\[12px\\]{font-size:12px}.text-\\[13px\\]{font-size:13px}.text-\\[14px\\]{font-size:14px}.text-\\[15px\\]{font-size:15px}.text-\\[16px\\]{font-size:16px}.text-\\[17px\\]{font-size:17px}.text-\\[18px\\]{font-size:18px}.text-\\[20px\\]{font-size:20px}.text-\\[48px\\]{font-size:48px}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-semibold{font-weight:600}.lowercase{text-transform:lowercase}.leading-tight{line-height:1.25}.text-black{--tw-text-opacity: 1;color:rgb(0 0 0 / var(--tw-text-opacity, 1))}.text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.underline{text-decoration-line:underline}.shadow{--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.outline-none{outline:2px solid transparent;outline-offset:2px}.outline{outline-style:solid}.filter{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)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,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,text-decoration-color,fill,stroke;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-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.hover\\:opacity-70:hover{opacity:.7}
 }`;
   document.head.appendChild(s);
 })();
-import { jsx as e, jsxs as o, Fragment as le } from "react/jsx-runtime";
-import Ue, { useState as C, useRef as U, useCallback as $, useEffect as H, useMemo as X, useReducer as St, useContext as wt, createContext as Tt } from "react";
-import { RampApi as ke } from "@nowramp/sdk";
-function Rt(t, a) {
-  const [n, l] = C(null), [r, d] = C(!0), [u, m] = C(null), c = U(null);
-  (!c.current || c.current !== t) && (c.current = new ke({ apiKey: "", ...t }));
-  const i = $(async () => {
+import { jsx as e, jsxs as l, Fragment as J } from "react/jsx-runtime";
+import ke, { useState as N, useRef as D, useCallback as _, useEffect as U, useMemo as F, useReducer as Rt, useContext as kt, createContext as Lt } from "react";
+import { RampApi as Me } from "@nowramp/sdk";
+function It(t, a) {
+  const [n, s] = N(null), [r, u] = N(!0), [m, i] = N(null), o = D(null);
+  (!o.current || o.current !== t) && (o.current = new Me({ apiKey: "", ...t }));
+  const d = _(async () => {
     if (!t.projectId) {
-      m(new Error("projectId is required")), d(!1);
+      i(new Error("projectId is required")), u(!1);
       return;
     }
-    d(!0), m(null);
+    u(!0), i(null);
     try {
-      const p = await c.current.getSupported(a);
-      l(p);
-    } catch (p) {
-      m(p instanceof Error ? p : new Error("Failed to fetch config"));
+      const h = await o.current.getSupported(a);
+      s(h);
+    } catch (h) {
+      i(h instanceof Error ? h : new Error("Failed to fetch config"));
     } finally {
-      d(!1);
+      u(!1);
     }
   }, [t.projectId, a]);
-  return H(() => {
-    i();
-  }, [i]), { config: n, loading: r, error: u, refetch: i };
+  return U(() => {
+    d();
+  }, [d]), { config: n, loading: r, error: m, refetch: d };
 }
-function kt(t, a) {
-  const [n, l] = C(null), [r, d] = C(!1), [u, m] = C(null), c = U(null), i = U(""), p = `${t.apiUrl}|${t.projectId}`;
-  (!c.current || i.current !== p) && (c.current = new ke({ apiKey: "", ...t }), i.current = p);
-  const f = U(0);
-  H(() => {
+function Mt(t, a) {
+  const [n, s] = N(null), [r, u] = N(!1), [m, i] = N(null), o = D(null), d = D(""), h = `${t.apiUrl}|${t.projectId}`;
+  (!o.current || d.current !== h) && (o.current = new Me({ apiKey: "", ...t }), d.current = h);
+  const f = D(0);
+  U(() => {
     const g = ++f.current;
     if (!a || !t.projectId) {
-      l(null), d(!1);
+      s(null), u(!1);
       return;
     }
-    d(!0), m(null), c.current.getQuotes(a).then(
-      (h) => {
-        f.current === g && (l(h), d(!1));
+    u(!0), i(null), o.current.getQuotes(a).then(
+      (p) => {
+        f.current === g && (s(p), u(!1));
       },
-      (h) => {
-        f.current === g && (m(h instanceof Error ? h : new Error("Failed to fetch quotes")), l(null), d(!1));
+      (p) => {
+        f.current === g && (i(p instanceof Error ? p : new Error("Failed to fetch quotes")), s(null), u(!1));
       }
     );
   }, [t.projectId, a == null ? void 0 : a.fiatCurrency, a == null ? void 0 : a.fiatAmount, a == null ? void 0 : a.cryptoAmount, a == null ? void 0 : a.cryptoCurrency, a == null ? void 0 : a.network, a == null ? void 0 : a.paymentMethodId, a == null ? void 0 : a.country, a == null ? void 0 : a.orderType]);
-  const x = $(async () => {
+  const x = _(async () => {
     if (!(!a || !t.projectId)) {
-      d(!0), m(null);
+      u(!0), i(null);
       try {
-        const g = await c.current.getQuotes(a);
-        l(g);
+        const g = await o.current.getQuotes(a);
+        s(g);
       } catch (g) {
-        m(g instanceof Error ? g : new Error("Failed to fetch quotes"));
+        i(g instanceof Error ? g : new Error("Failed to fetch quotes"));
       } finally {
-        d(!1);
+        u(!1);
       }
     }
   }, [t.projectId, a]);
-  return { quotes: n, loading: r, error: u, refetch: x };
+  return { quotes: n, loading: r, error: m, refetch: x };
 }
-function Lt(t) {
-  const [a, n] = C(null), [l, r] = C(!1), [d, u] = C(null), m = U(null), c = U(""), i = `${t.apiUrl}|${t.projectId}`;
-  (!m.current || c.current !== i) && (m.current = new ke({ apiKey: "", ...t }), c.current = i);
-  const p = $(async (x) => {
-    r(!0), u(null);
+function Bt(t) {
+  const [a, n] = N(null), [s, r] = N(!1), [u, m] = N(null), i = D(null), o = D(""), d = `${t.apiUrl}|${t.projectId}`;
+  (!i.current || o.current !== d) && (i.current = new Me({ apiKey: "", ...t }), o.current = d);
+  const h = _(async (x) => {
+    r(!0), m(null);
     try {
-      const g = await m.current.createCheckoutIntent(x);
+      const g = await i.current.createCheckoutIntent(x);
       return n(g), g;
     } catch (g) {
-      const h = g instanceof Error ? g : new Error("Failed to create checkout intent");
-      throw u(h), h;
+      const p = g instanceof Error ? g : new Error("Failed to create checkout intent");
+      throw m(p), p;
     } finally {
       r(!1);
     }
-  }, []), f = $(() => {
-    n(null), u(null);
+  }, []), f = _(() => {
+    n(null), m(null);
   }, []);
-  return { order: a, loading: l, error: d, createOrder: p, reset: f };
+  return { order: a, loading: s, error: u, createOrder: h, reset: f };
 }
-function It(t, a, n) {
-  const [l, r] = C(null), [d, u] = C(!1), [m, c] = C(null), i = U(null);
-  i.current || (i.current = new ke({ apiKey: "", projectId: "", ...t }));
-  const p = $(async () => {
+function Ot(t, a, n) {
+  const [s, r] = N(null), [u, m] = N(!1), [i, o] = N(null), d = D(null);
+  d.current || (d.current = new Me({ apiKey: "", projectId: "", ...t }));
+  const h = _(async () => {
     if (a) {
-      u(!0), c(null);
+      m(!0), o(null);
       try {
-        const f = await i.current.getTransaction(a);
+        const f = await d.current.getTransaction(a);
         r(f);
       } catch (f) {
-        c(f instanceof Error ? f : new Error("Failed to fetch status"));
+        o(f instanceof Error ? f : new Error("Failed to fetch status"));
       } finally {
-        u(!1);
+        m(!1);
       }
     }
   }, [a]);
-  return H(() => {
+  return U(() => {
     if (!a) return;
     const f = (n == null ? void 0 : n.initialDelay) ?? 0;
     if (f > 0) {
-      const x = setTimeout(p, f);
+      const x = setTimeout(h, f);
       return () => clearTimeout(x);
     }
-    p();
-  }, [p, a, n == null ? void 0 : n.initialDelay]), H(() => {
-    if (!a || !(n != null && n.pollInterval) || !l || ["completed", "failed", "cancelled", "expired", "refunded"].includes(l.status))
+    h();
+  }, [h, a, n == null ? void 0 : n.initialDelay]), U(() => {
+    if (!a || !(n != null && n.pollInterval) || !s || ["completed", "failed", "cancelled", "expired", "refunded"].includes(s.status))
       return;
-    const x = setInterval(p, n.pollInterval);
+    const x = setInterval(h, n.pollInterval);
     return () => clearInterval(x);
-  }, [a, n == null ? void 0 : n.pollInterval, l == null ? void 0 : l.status, p]), { status: l, loading: d, error: m, refetch: p };
+  }, [a, n == null ? void 0 : n.pollInterval, s == null ? void 0 : s.status, h]), { status: s, loading: u, error: i, refetch: h };
 }
-function rt(t, a) {
+function lt(t, a) {
   if (!t) return t;
   const n = t.indexOf(".");
   if (n === -1) return t;
-  let l = t;
-  return l.length - n - 1 > a && (l = l.slice(0, n + a + 1)), l = l.replace(/0+$/, "").replace(/\.$/, ""), l;
+  let s = t;
+  return s.length - n - 1 > a && (s = s.slice(0, n + a + 1)), s = s.replace(/0+$/, "").replace(/\.$/, ""), s;
 }
-const mt = {
+const ht = {
   step: "amount",
   flowType: "buy",
   fiatCurrency: "USD",
@@ -142,7 +142,7 @@ const mt = {
   country: "",
   errorMessage: null
 };
-function Bt(t, a) {
+function Pt(t, a) {
   switch (a.type) {
     case "SET_STEP":
       return { ...t, step: a.step, errorMessage: null };
@@ -152,6 +152,7 @@ function Bt(t, a) {
         flowType: a.flowType,
         fiatAmount: "",
         cryptoAmount: "",
+        paymentMethodId: "",
         selectedQuote: null,
         selectedProvider: null,
         errorMessage: null
@@ -191,799 +192,193 @@ function Bt(t, a) {
     case "CLEAR_ERROR":
       return { ...t, errorMessage: null };
     case "RESET":
-      return mt;
+      return ht;
     default:
       return t;
   }
 }
-const ht = Tt(null);
-function Mt({
+const ft = Lt(null);
+function Ht({
   projectId: t,
   apiUrl: a = "https://api.nowramp.com",
   assetBaseUrl: n = "",
-  flowType: l = "buy",
+  flowType: s = "buy",
   customerId: r = "",
-  defaultFiatCurrency: d = "USD",
-  defaultCryptoCurrency: u = "BTC",
-  defaultNetwork: m = "",
-  defaultFiatAmount: c = "",
-  defaultCryptoAmount: i = "",
-  defaultWalletAddress: p = "",
+  defaultFiatCurrency: u = "USD",
+  defaultCryptoCurrency: m = "BTC",
+  defaultNetwork: i = "",
+  defaultFiatAmount: o = "",
+  defaultCryptoAmount: d = "",
+  defaultWalletAddress: h = "",
   defaultGateway: f,
   fieldLocks: x,
   statusPollInterval: g = 5e3,
-  onComplete: h,
+  onComplete: p,
   onError: b,
-  children: L
+  children: S
 }) {
-  const O = X(() => ({ apiUrl: a, projectId: t }), [a, t]), A = m || (u ? u.toLowerCase() : ""), G = l === "sell", j = G ? !!i : !!c, Z = (G ? !!(j && u && A) : !!(j && u && A && p)) && f ? "confirm" : "amount", [s, P] = St(Bt, {
-    ...mt,
-    step: Z,
-    flowType: l,
-    fiatCurrency: d,
-    cryptoCurrency: u,
-    network: A,
-    fiatAmount: rt(c, 2),
-    cryptoAmount: rt(i, 6),
-    walletAddress: p,
+  const P = F(() => ({ apiUrl: a, projectId: t }), [a, t]), w = i || (m ? m.toLowerCase() : ""), G = s === "sell", Q = G ? !!d : !!o, z = (G ? !!(Q && m && w) : !!(Q && m && w && h)) && f ? "confirm" : "amount", [c, O] = Rt(Pt, {
+    ...ht,
+    step: z,
+    flowType: s,
+    fiatCurrency: u,
+    cryptoCurrency: m,
+    network: w,
+    fiatAmount: lt(o, 2),
+    cryptoAmount: lt(d, 6),
+    walletAddress: h,
     customerId: r
-  }), v = s.flowType === "sell", {
-    config: I,
-    loading: D,
-    error: F
-  } = Rt(O, s.flowType);
-  Ue.useEffect(() => {
-    var R, k, w;
-    if (!I || !s.cryptoCurrency || s.network) return;
-    const N = (R = I.cryptos) == null ? void 0 : R.find((_) => _.code === s.cryptoCurrency), S = ((k = N == null ? void 0 : N.networks) == null ? void 0 : k.find((_) => _.isDefault)) || ((w = N == null ? void 0 : N.networks) == null ? void 0 : w[0]);
-    S != null && S.id && P({ type: "SET_NETWORK", network: S.id });
-  }, [I, s.cryptoCurrency, s.network]);
-  const K = X(() => {
-    if (v) {
-      if (!s.cryptoAmount) return null;
-      const w = parseFloat(s.cryptoAmount);
-      return isNaN(w) || w <= 0 ? "Enter a valid amount" : null;
+  }), C = c.flowType === "sell", {
+    config: L,
+    loading: K,
+    error: X
+  } = It(P, c.flowType);
+  ke.useEffect(() => {
+    var R, k, T;
+    if (!L || !c.cryptoCurrency || c.network) return;
+    const v = (R = L.cryptos) == null ? void 0 : R.find((H) => H.code === c.cryptoCurrency), E = ((k = v == null ? void 0 : v.networks) == null ? void 0 : k.find((H) => H.isDefault)) || ((T = v == null ? void 0 : v.networks) == null ? void 0 : T[0]);
+    E != null && E.id && O({ type: "SET_NETWORK", network: E.id });
+  }, [L, c.cryptoCurrency, c.network]), ke.useEffect(() => {
+    var k, T;
+    if (!((k = L == null ? void 0 : L.paymentMethods) != null && k.length)) return;
+    const v = c.fiatCurrency, E = L.paymentMethods;
+    if (c.paymentMethodId && E.some(
+      (W) => W.id === c.paymentMethodId && W.supportedFiats.includes(v)
+    ))
+      return;
+    const R = E.find((H) => H.supportedFiats.includes(v));
+    O({ type: "SET_PAYMENT_METHOD", methodId: (R == null ? void 0 : R.id) || ((T = E[0]) == null ? void 0 : T.id) || "" });
+  }, [L, c.fiatCurrency, c.paymentMethodId]);
+  const $ = F(() => {
+    if (C) {
+      if (!c.cryptoAmount) return null;
+      const T = parseFloat(c.cryptoAmount);
+      return isNaN(T) || T <= 0 ? "Enter a valid amount" : null;
     }
-    if (!I || !s.fiatAmount) return null;
-    const N = parseFloat(s.fiatAmount);
-    if (isNaN(N)) return null;
-    const S = I.fiats.find((w) => w.code === s.fiatCurrency);
-    if (!S) return null;
-    const R = parseFloat(S.minAmount), k = parseFloat(S.maxAmount);
-    return !isNaN(R) && N < R ? `Minimum amount is ${S.minAmount} ${s.fiatCurrency}` : !isNaN(k) && N > k ? `Maximum amount is ${S.maxAmount} ${s.fiatCurrency}` : null;
-  }, [I, s.fiatAmount, s.fiatCurrency, s.cryptoAmount, v]), ge = X(() => {
-    const N = v ? !!s.cryptoAmount : !!s.fiatAmount;
-    return !I || !N || !s.cryptoCurrency || !s.network || K ? null : {
-      fiatCurrency: s.fiatCurrency,
-      ...v ? { cryptoAmount: s.cryptoAmount } : { fiatAmount: s.fiatAmount },
-      cryptoCurrency: s.cryptoCurrency,
-      network: s.network,
-      paymentMethodId: s.paymentMethodId || void 0,
-      country: s.country || void 0,
-      orderType: s.flowType
+    if (!L || !c.fiatAmount) return null;
+    const v = parseFloat(c.fiatAmount);
+    if (isNaN(v)) return null;
+    const E = L.fiats.find((T) => T.code === c.fiatCurrency);
+    if (!E) return null;
+    const R = parseFloat(E.minAmount), k = parseFloat(E.maxAmount);
+    return !isNaN(R) && v < R ? `Minimum amount is ${E.minAmount} ${c.fiatCurrency}` : !isNaN(k) && v > k ? `Maximum amount is ${E.maxAmount} ${c.fiatCurrency}` : null;
+  }, [L, c.fiatAmount, c.fiatCurrency, c.cryptoAmount, C]), Ne = F(() => {
+    const v = C ? !!c.cryptoAmount : !!c.fiatAmount;
+    return !L || !v || !c.cryptoCurrency || !c.network || $ ? null : {
+      fiatCurrency: c.fiatCurrency,
+      ...C ? { cryptoAmount: c.cryptoAmount } : { fiatAmount: c.fiatAmount },
+      cryptoCurrency: c.cryptoCurrency,
+      network: c.network,
+      paymentMethodId: c.paymentMethodId || void 0,
+      country: c.country || void 0,
+      orderType: c.flowType
     };
-  }, [I, s.fiatCurrency, s.fiatAmount, s.cryptoAmount, s.cryptoCurrency, s.network, s.paymentMethodId, s.country, K, v, s.flowType]), {
-    quotes: pe,
+  }, [L, c.fiatCurrency, c.fiatAmount, c.cryptoAmount, c.cryptoCurrency, c.network, c.paymentMethodId, c.country, $, C, c.flowType]), {
+    quotes: he,
     loading: fe,
     error: Y,
     refetch: ye
-  } = kt(O, ge), {
-    order: ee,
-    loading: ve,
-    error: ce,
-    createOrder: se
-  } = Lt(O), Ne = 15e3, {
+  } = Mt(P, Ne), {
+    order: ae,
+    loading: Ce,
+    error: se,
+    createOrder: ce
+  } = Bt(P), be = 15e3, {
     status: V,
-    loading: te
-  } = It(
+    loading: ne
+  } = Ot(
     { apiUrl: a },
-    (ee == null ? void 0 : ee.orderId) ?? null,
-    { pollInterval: g, initialDelay: Ne }
+    (ae == null ? void 0 : ae.orderId) ?? null,
+    { pollInterval: g, initialDelay: be }
   );
-  Ue.useEffect(() => {
-    (V == null ? void 0 : V.status) === "completed" && h && h(V);
-  }, [V == null ? void 0 : V.status, h]), Ue.useEffect(() => {
-    const N = F || ce;
-    N && b && b(N);
-  }, [F, ce, b]);
-  const ae = f || (I == null ? void 0 : I.defaultGateway) || null, Ce = U(ae);
-  Ce.current = ae;
-  const be = U(pe);
-  be.current = pe;
-  const Ee = $(async () => {
-    var S, R, k;
-    const N = ((S = s.selectedQuote) == null ? void 0 : S.gatewayId) || ((k = (R = be.current) == null ? void 0 : R.bestQuote) == null ? void 0 : k.gatewayId) || Ce.current;
-    if (!N || !s.walletAddress) {
-      const w = [!N && "gateway", !s.walletAddress && "walletAddress"].filter(Boolean).join(", ");
-      P({ type: "SET_ERROR", message: `Missing required fields: ${w}` });
+  ke.useEffect(() => {
+    (V == null ? void 0 : V.status) === "completed" && p && p(V);
+  }, [V == null ? void 0 : V.status, p]), ke.useEffect(() => {
+    const v = X || se;
+    v && b && b(v);
+  }, [X, se, b]);
+  const re = f || (L == null ? void 0 : L.defaultGateway) || null, Ee = D(re);
+  Ee.current = re;
+  const Ae = D(he);
+  Ae.current = he;
+  const we = _(async () => {
+    var E, R, k;
+    const v = ((E = c.selectedQuote) == null ? void 0 : E.gatewayId) || ((k = (R = Ae.current) == null ? void 0 : R.bestQuote) == null ? void 0 : k.gatewayId) || Ee.current;
+    if (!v || !c.walletAddress) {
+      const T = [!v && "gateway", !c.walletAddress && "walletAddress"].filter(Boolean).join(", ");
+      O({ type: "SET_ERROR", message: `Missing required fields: ${T}` });
       return;
     }
     try {
-      await se({
-        gateway: N,
-        externalCustomerId: s.customerId || void 0,
-        fiatCurrency: s.fiatCurrency,
-        ...v ? { cryptoAmount: s.cryptoAmount } : { fiatAmount: s.fiatAmount },
-        cryptoCurrency: s.cryptoCurrency,
-        network: s.network,
-        walletAddress: s.walletAddress,
-        paymentMethodId: s.paymentMethodId || void 0,
-        email: s.email || void 0,
-        orderType: s.flowType
-      }), P({ type: "SET_STEP", step: "checkout" });
-    } catch (w) {
-      const _ = w instanceof Error ? w.message : "Failed to create order";
-      /wallet|address/i.test(_) ? P({ type: "SET_WALLET_ERROR", message: _.replace(/^Failed to create checkout intent:\s*/i, "") }) : P({ type: "SET_ERROR", message: _ });
+      await ce({
+        gateway: v,
+        customerId: c.customerId || void 0,
+        fiatCurrency: c.fiatCurrency,
+        ...C ? { cryptoAmount: c.cryptoAmount } : { fiatAmount: c.fiatAmount },
+        cryptoCurrency: c.cryptoCurrency,
+        network: c.network,
+        walletAddress: c.walletAddress,
+        paymentMethodId: c.paymentMethodId || void 0,
+        email: c.email || void 0,
+        orderType: c.flowType
+      }), O({ type: "SET_STEP", step: "checkout" });
+    } catch (T) {
+      const H = T instanceof Error ? T.message : "Failed to create order";
+      /wallet|address/i.test(H) ? O({ type: "SET_WALLET_ERROR", message: H.replace(/^Failed to create checkout intent:\s*/i, "") }) : O({ type: "SET_ERROR", message: H });
     }
-  }, [s, se, v]), J = $((N) => {
-    P({ type: "SET_STEP", step: N });
-  }, []), ie = $(() => {
-    const N = ["confirm", "amount", "quotes", "wallet", "checkout", "processing", "complete"], S = N.indexOf(s.step);
-    S > 0 && P({ type: "SET_STEP", step: N[S - 1] });
-  }, [s.step, v]), Ie = X(() => {
-    const N = v ? !!s.cryptoAmount : !!s.fiatAmount;
-    switch (s.step) {
+  }, [c, ce, C]), q = _((v) => {
+    O({ type: "SET_STEP", step: v });
+  }, []), ie = _(() => {
+    const v = ["confirm", "amount", "quotes", "wallet", "checkout", "processing", "complete"], E = v.indexOf(c.step);
+    E > 0 && O({ type: "SET_STEP", step: v[E - 1] });
+  }, [c.step, C]), Oe = F(() => {
+    const v = C ? !!c.cryptoAmount : !!c.fiatAmount;
+    switch (c.step) {
       case "confirm":
-        return !!(N && s.cryptoCurrency && s.network && s.walletAddress && !K);
+        return !!(v && c.cryptoCurrency && c.network && c.walletAddress && !$);
       case "amount":
-        return !!(N && s.cryptoCurrency && s.network && !K);
+        return !!(v && c.cryptoCurrency && c.network && !$);
       case "quotes":
-        return !!s.selectedQuote;
+        return !!c.selectedQuote;
       case "wallet":
-        return !!s.walletAddress;
+        return !!c.walletAddress;
       default:
         return !1;
     }
-  }, [s, K, v]), xe = {
-    apiConfig: O,
+  }, [c, $, C]), xe = {
+    apiConfig: P,
     assetBaseUrl: n,
-    config: I,
-    configLoading: D,
-    configError: F,
-    state: s,
-    dispatch: P,
-    quotes: pe,
+    config: L,
+    configLoading: K,
+    configError: X,
+    state: c,
+    dispatch: O,
+    quotes: he,
     quotesLoading: fe,
     quotesError: Y,
     fetchQuotes: ye,
-    order: ee,
-    orderLoading: ve,
-    orderError: ce,
-    createOrder: Ee,
+    order: ae,
+    orderLoading: Ce,
+    orderError: se,
+    createOrder: we,
     orderStatus: V,
-    orderStatusLoading: te,
+    orderStatusLoading: ne,
     fieldLocks: x || null,
-    defaultGateway: ae,
-    amountError: K,
-    goToStep: J,
+    defaultGateway: re,
+    amountError: $,
+    goToStep: q,
     goBack: ie,
-    canProceed: Ie
+    canProceed: Oe
   };
-  return /* @__PURE__ */ e(ht.Provider, { value: xe, children: L });
+  return /* @__PURE__ */ e(ft.Provider, { value: xe, children: S });
 }
-function he() {
-  const t = wt(ht);
+function pe() {
+  const t = kt(ft);
   if (!t)
     throw new Error("useRamp must be used within a RampProvider");
   return t;
 }
-function Ot({
-  className: t = "",
-  iframeHeight: a = 600,
-  autoRedirect: n = !1,
-  redirectDelay: l = 3e3
-}) {
-  var g;
-  const { order: r, orderStatus: d, goToStep: u, goBack: m } = he(), [c, i] = C(!1), [p, f] = C(null), x = r != null && r.checkout.expiresAt ? Date.now() > r.checkout.expiresAt : !1;
-  if (H(() => {
-    if ((r == null ? void 0 : r.checkout.method) === "redirect" && n && !x) {
-      f(Math.ceil(l / 1e3));
-      const h = setTimeout(() => {
-        window.location.href = r.checkout.url;
-      }, l), b = setInterval(() => {
-        f((L) => L && L > 1 ? L - 1 : null);
-      }, 1e3);
-      return () => {
-        clearTimeout(h), clearInterval(b);
-      };
-    }
-  }, [r, n, l, x]), H(() => {
-    d && (d.status === "completed" ? u("complete") : ["failed", "cancelled", "expired"].includes(d.status) && u("error"));
-  }, [d == null ? void 0 : d.status, u]), !r)
-    return /* @__PURE__ */ o("div", { className: `flex flex-col items-center justify-center p-8 ${t}`, style: { color: "var(--t-text)" }, children: [
-      /* @__PURE__ */ e("p", { className: "text-[15px] mb-4", children: "No order found" }),
-      /* @__PURE__ */ e(
-        "button",
-        {
-          className: "font-semibold text-[14px] transition-all",
-          style: { height: 48, borderRadius: 5, background: "var(--t-surface)", color: "var(--t-text)", paddingLeft: 24, paddingRight: 24 },
-          onClick: m,
-          children: "Go Back"
-        }
-      )
-    ] });
-  if (x)
-    return /* @__PURE__ */ o("div", { className: `flex flex-col items-center justify-center p-8 text-center ${t}`, style: { color: "var(--t-text)" }, children: [
-      /* @__PURE__ */ e("div", { className: "text-[48px] mb-4", children: "⏰" }),
-      /* @__PURE__ */ e("h3", { className: "text-[18px] font-semibold mb-2", children: "Checkout Expired" }),
-      /* @__PURE__ */ e("p", { className: "text-[14px] mb-6", style: { color: "var(--t-text-secondary)" }, children: "The checkout link has expired. Please try again." }),
-      /* @__PURE__ */ e(
-        "button",
-        {
-          className: "w-full font-semibold text-[16px] transition-all",
-          style: { height: 60, borderRadius: 5, background: "var(--t-cta-bg)", color: "var(--t-cta-text)" },
-          onClick: m,
-          children: "Start Over"
-        }
-      )
-    ] });
-  if (r.checkout.method === "iframe")
-    return /* @__PURE__ */ e("div", { className: `flex flex-col flex-1 ${t}`, children: /* @__PURE__ */ o("div", { className: "relative flex-1", style: { height: a, borderRadius: 5, overflow: "hidden", background: "var(--t-surface)" }, children: [
-      !c && /* @__PURE__ */ o("div", { className: "absolute inset-0 flex flex-col items-center justify-center", children: [
-        /* @__PURE__ */ e("div", { className: "nramp-spinner" }),
-        /* @__PURE__ */ e("p", { className: "text-[14px] mt-4", style: { color: "var(--t-text-secondary)" }, children: "Loading checkout..." })
-      ] }),
-      /* @__PURE__ */ e(
-        "iframe",
-        {
-          src: r.checkout.url,
-          style: {
-            display: c ? "block" : "none",
-            width: "100%",
-            height: "100%",
-            border: "none"
-          },
-          allow: ((g = r.checkout.allowedFeatures) == null ? void 0 : g.join("; ")) || "payment; camera; microphone; geolocation; clipboard-read; clipboard-write; accelerometer; gyroscope; magnetometer; fullscreen; autoplay; encrypted-media; web-share",
-          onLoad: () => i(!0),
-          title: "Provider Checkout"
-        }
-      )
-    ] }) });
-  if (r.checkout.method === "redirect")
-    return /* @__PURE__ */ o("div", { className: `flex flex-col items-center justify-center p-8 text-center ${t}`, style: { color: "var(--t-text)" }, children: [
-      /* @__PURE__ */ e("div", { className: "text-[48px] mb-4", children: "🔗" }),
-      /* @__PURE__ */ e("h3", { className: "text-[18px] font-semibold mb-2", children: "Complete Payment" }),
-      /* @__PURE__ */ o("p", { className: "text-[14px] mb-4", style: { color: "var(--t-text-secondary)" }, children: [
-        "You'll be redirected to ",
-        r.gateway,
-        " to complete your payment."
-      ] }),
-      p !== null && /* @__PURE__ */ o("p", { className: "text-[13px] mb-4", style: { color: "var(--t-text-muted)" }, children: [
-        "Redirecting in ",
-        p,
-        "..."
-      ] }),
-      /* @__PURE__ */ o(
-        "a",
-        {
-          href: r.checkout.url,
-          className: "w-full font-semibold text-[16px] flex items-center justify-center transition-all",
-          style: { height: 60, borderRadius: 5, background: "var(--t-cta-bg)", color: "var(--t-cta-text)", textDecoration: "none" },
-          target: "_blank",
-          rel: "noopener noreferrer",
-          children: [
-            "Continue to ",
-            r.gateway
-          ]
-        }
-      ),
-      /* @__PURE__ */ e(
-        "button",
-        {
-          className: "w-full font-semibold text-[14px] mt-2 transition-all",
-          style: { height: 48, borderRadius: 5, background: "var(--t-surface)", color: "var(--t-text)" },
-          onClick: m,
-          children: "Cancel"
-        }
-      )
-    ] });
-  if (r.checkout.method === "widget" && r.widgetConfig) {
-    const h = Pt(r.checkout.url, r.widgetConfig);
-    return /* @__PURE__ */ e("div", { className: `flex flex-col flex-1 ${t}`, children: /* @__PURE__ */ o("div", { className: "relative flex-1", style: { height: a, borderRadius: 5, overflow: "hidden", background: "var(--t-surface)" }, children: [
-      !c && /* @__PURE__ */ o("div", { className: "absolute inset-0 flex flex-col items-center justify-center", children: [
-        /* @__PURE__ */ e("div", { className: "nramp-spinner" }),
-        /* @__PURE__ */ e("p", { className: "text-[14px] mt-4", style: { color: "var(--t-text-secondary)" }, children: "Loading checkout..." })
-      ] }),
-      /* @__PURE__ */ e(
-        "iframe",
-        {
-          src: h,
-          style: {
-            display: c ? "block" : "none",
-            width: "100%",
-            height: "100%",
-            border: "none"
-          },
-          allow: "payment; camera; microphone; geolocation; clipboard-read; clipboard-write; accelerometer; gyroscope; magnetometer; fullscreen; autoplay; encrypted-media; web-share",
-          onLoad: () => i(!0),
-          title: "Payment Checkout"
-        }
-      )
-    ] }) });
-  }
-  return /* @__PURE__ */ o("div", { className: `flex flex-col items-center justify-center p-8 ${t}`, style: { color: "var(--t-text)" }, children: [
-    /* @__PURE__ */ e("p", { className: "text-[15px] mb-4", children: "Unknown checkout method" }),
-    /* @__PURE__ */ e(
-      "button",
-      {
-        className: "font-semibold text-[14px] transition-all",
-        style: { height: 48, borderRadius: 5, background: "var(--t-surface)", color: "var(--t-text)", paddingLeft: 24, paddingRight: 24 },
-        onClick: m,
-        children: "Go Back"
-      }
-    )
-  ] });
-}
-function Pt(t, a) {
-  const n = new URL("/en/partner/widget", t);
-  for (const [l, r] of Object.entries(a))
-    r != null && r !== "" && n.searchParams.set(l, String(r));
-  return n.toString();
-}
-function Ht({ className: t = "" }) {
-  const { orderStatus: a, orderStatusLoading: n, goToStep: l } = he();
-  H(() => {
-    a && (a.status === "completed" ? l("complete") : ["failed", "cancelled", "expired", "refunded"].includes(a.status) && l("error"));
-  }, [a == null ? void 0 : a.status, l]);
-  const r = () => {
-    if (!a) return "Processing your order...";
-    switch (a.status) {
-      case "pending":
-        return "Waiting for payment confirmation...";
-      case "processing":
-        return "Processing your transaction...";
-      default:
-        return "Processing...";
-    }
-  };
-  return /* @__PURE__ */ o("div", { className: `flex flex-col items-center justify-center px-8 py-12 text-center ${t}`, children: [
-    /* @__PURE__ */ e("div", { className: "mb-6", children: /* @__PURE__ */ e("div", { className: "nramp-spinner-large nramp-spinner" }) }),
-    /* @__PURE__ */ e("h2", { className: "text-[20px] font-semibold mb-3", style: { color: "var(--t-text)" }, children: r() }),
-    n && /* @__PURE__ */ e("p", { className: "text-[13px] mb-4", style: { color: "var(--t-text-muted)" }, children: "Checking status..." }),
-    a && /* @__PURE__ */ o("div", { className: "w-full mt-6 text-left", style: { background: "var(--t-surface)", borderRadius: 5, padding: 16 }, children: [
-      /* @__PURE__ */ e(me, { label: "Order ID", value: a.orderId, mono: !0 }),
-      /* @__PURE__ */ e(me, { label: "Provider", value: a.gateway }),
-      /* @__PURE__ */ e(
-        me,
-        {
-          label: "Amount",
-          value: `${a.fiatAmount} ${a.fiatCurrency}`
-        }
-      ),
-      /* @__PURE__ */ e(
-        me,
-        {
-          label: "Receiving",
-          value: `${a.cryptoAmount || "..."} ${a.cryptoCurrency}`
-        }
-      ),
-      /* @__PURE__ */ e(me, { label: "Network", value: a.network }),
-      /* @__PURE__ */ e(
-        me,
-        {
-          label: "To Address",
-          value: `${a.walletAddress.slice(0, 10)}...${a.walletAddress.slice(-8)}`,
-          mono: !0
-        }
-      )
-    ] }),
-    /* @__PURE__ */ o("div", { className: "mt-6", children: [
-      /* @__PURE__ */ e("p", { className: "text-[13px]", style: { color: "var(--t-text-secondary)" }, children: "This usually takes a few minutes." }),
-      /* @__PURE__ */ e("p", { className: "text-[12px] mt-1", style: { color: "var(--t-text-muted)" }, children: "You can safely close this page - we'll send you an email when complete." })
-    ] })
-  ] });
-}
-function me({ label: t, value: a, mono: n }) {
-  return /* @__PURE__ */ o(
-    "div",
-    {
-      className: "flex justify-between items-center py-2",
-      style: { borderBottom: "1px solid var(--t-divider)" },
-      children: [
-        /* @__PURE__ */ e("span", { className: "text-[13px]", style: { color: "var(--t-text-secondary)" }, children: t }),
-        /* @__PURE__ */ e(
-          "span",
-          {
-            className: `text-[13px] font-medium ${n ? "font-mono" : ""}`,
-            style: { color: "var(--t-text)" },
-            children: a
-          }
-        )
-      ]
-    }
-  );
-}
-function Ut({
-  className: t = "",
-  explorerUrl: a,
-  onDone: n,
-  doneButtonText: l = "Done"
-}) {
-  const { orderStatus: r, state: d, dispatch: u } = he(), m = d.flowType === "sell", c = () => {
-    if (!(r != null && r.transactionHash)) return null;
-    if (!a) {
-      const f = {
-        ethereum: "https://etherscan.io/tx/{txHash}",
-        polygon: "https://polygonscan.com/tx/{txHash}",
-        arbitrum: "https://arbiscan.io/tx/{txHash}",
-        optimism: "https://optimistic.etherscan.io/tx/{txHash}",
-        base: "https://basescan.org/tx/{txHash}",
-        bitcoin: "https://mempool.space/tx/{txHash}",
-        solana: "https://solscan.io/tx/{txHash}",
-        avalanche: "https://snowtrace.io/tx/{txHash}",
-        fantom: "https://ftmscan.com/tx/{txHash}"
-      };
-      return (f[d.network] || f.ethereum).replace("{txHash}", r.transactionHash);
-    }
-    return a.replace("{txHash}", r.transactionHash);
-  }, i = () => {
-    n ? n() : u({ type: "RESET" });
-  }, p = c();
-  return /* @__PURE__ */ o("div", { className: `flex flex-col items-center px-8 py-12 text-center ${t}`, children: [
-    /* @__PURE__ */ e(
-      "div",
-      {
-        className: "flex items-center justify-center mb-5",
-        style: { width: 64, height: 64, borderRadius: "50%", background: "var(--t-success, #10b981)" },
-        children: /* @__PURE__ */ e("svg", { viewBox: "0 0 24 24", width: "32", height: "32", fill: "white", children: /* @__PURE__ */ e("path", { d: "M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z" }) })
-      }
-    ),
-    /* @__PURE__ */ e("h2", { className: "text-[20px] font-semibold mb-2", style: { color: "var(--t-text)" }, children: m ? "Sale Complete!" : "Purchase Complete!" }),
-    /* @__PURE__ */ e("p", { className: "text-[14px] mb-6", style: { color: "var(--t-text-secondary)" }, children: m ? `Your ${(r == null ? void 0 : r.fiatCurrency) || d.fiatCurrency} payout is being processed.` : `Your ${(r == null ? void 0 : r.cryptoCurrency) || d.cryptoCurrency} has been sent to your wallet.` }),
-    r && /* @__PURE__ */ o("div", { className: "w-full text-left mb-6", style: { background: "var(--t-surface)", borderRadius: 5, padding: 16 }, children: [
-      /* @__PURE__ */ e(
-        q,
-        {
-          label: m ? "Amount Sold" : "Amount Received",
-          value: `${r.cryptoAmount} ${r.cryptoCurrency}`,
-          highlight: !0
-        }
-      ),
-      /* @__PURE__ */ e(
-        q,
-        {
-          label: m ? "Payout Amount" : "Amount Paid",
-          value: `${r.fiatAmount} ${r.fiatCurrency}`
-        }
-      ),
-      /* @__PURE__ */ e(q, { label: "Network", value: r.network }),
-      /* @__PURE__ */ e(
-        q,
-        {
-          label: "Wallet",
-          value: `${r.walletAddress.slice(0, 10)}...${r.walletAddress.slice(-8)}`,
-          mono: !0
-        }
-      ),
-      r.transactionHash && /* @__PURE__ */ e(
-        q,
-        {
-          label: "Transaction",
-          value: `${r.transactionHash.slice(0, 10)}...${r.transactionHash.slice(-8)}`,
-          mono: !0
-        }
-      ),
-      /* @__PURE__ */ e(q, { label: "Provider", value: r.gateway }),
-      /* @__PURE__ */ e(q, { label: "Order ID", value: r.orderId, mono: !0 }),
-      r.completedAt && /* @__PURE__ */ e(
-        q,
-        {
-          label: "Completed",
-          value: new Date(r.completedAt).toLocaleString()
-        }
-      )
-    ] }),
-    /* @__PURE__ */ o("div", { className: "w-full flex flex-col gap-2", children: [
-      p && /* @__PURE__ */ e(
-        "a",
-        {
-          href: p,
-          target: "_blank",
-          rel: "noopener noreferrer",
-          className: "w-full font-semibold text-[14px] flex items-center justify-center transition-all",
-          style: { height: 48, borderRadius: 5, background: "var(--t-surface)", color: "var(--t-text)", textDecoration: "none" },
-          children: "View on Explorer"
-        }
-      ),
-      /* @__PURE__ */ e(
-        "button",
-        {
-          className: "w-full font-semibold text-[16px] transition-all",
-          style: { height: 60, borderRadius: 5, background: "var(--t-cta-bg)", color: "var(--t-cta-text)" },
-          onClick: i,
-          children: l
-        }
-      )
-    ] })
-  ] });
-}
-function q({ label: t, value: a, mono: n, highlight: l }) {
-  return /* @__PURE__ */ o(
-    "div",
-    {
-      className: "flex justify-between items-center py-2",
-      style: { borderBottom: "1px solid var(--t-divider)" },
-      children: [
-        /* @__PURE__ */ e("span", { className: "text-[13px]", style: { color: "var(--t-text-secondary)" }, children: t }),
-        /* @__PURE__ */ e(
-          "span",
-          {
-            className: `text-[13px] font-medium ${n ? "font-mono" : ""}`,
-            style: { color: l ? "var(--t-success, #10b981)" : "var(--t-text)" },
-            children: a
-          }
-        )
-      ]
-    }
-  );
-}
-function Dt({
-  className: t = "",
-  onRetry: a,
-  supportEmail: n = "support@nowramp.com"
-}) {
-  const { state: l, orderStatus: r, dispatch: d, goToStep: u } = he(), m = l.flowType === "sell", c = () => {
-    if (r)
-      switch (r.status) {
-        case "failed":
-          return "Payment Failed";
-        case "cancelled":
-          return "Order Cancelled";
-        case "expired":
-          return "Order Expired";
-        case "refunded":
-          return "Order Refunded";
-        default:
-          return "Something Went Wrong";
-      }
-    return "Something Went Wrong";
-  }, i = () => {
-    if (l.errorMessage) return l.errorMessage;
-    if (r)
-      switch (r.status) {
-        case "failed":
-          return m ? "Your sale could not be processed. Please try again." : "Your payment could not be processed. Please try again or use a different payment method.";
-        case "cancelled":
-          return m ? "Your sale was cancelled. No crypto was transferred." : "Your order was cancelled. No payment was processed.";
-        case "expired":
-          return m ? "Your order has expired. Please start a new sale." : "Your order has expired. Please start a new purchase.";
-        case "refunded":
-          return m ? "Your crypto has been returned. The funds should appear in your wallet shortly." : "Your payment has been refunded. The funds should appear in your account within 5-10 business days.";
-        default:
-          return "An unexpected error occurred. Please try again.";
-      }
-    return "An unexpected error occurred. Please try again.";
-  }, p = () => {
-    d({ type: "CLEAR_ERROR" }), a ? a() : (d({ type: "RESET" }), u("amount"));
-  }, f = () => {
-    d({ type: "RESET" }), u("amount");
-  };
-  return /* @__PURE__ */ o("div", { className: `flex flex-col items-center px-8 py-12 text-center ${t}`, children: [
-    /* @__PURE__ */ e(
-      "div",
-      {
-        className: "flex items-center justify-center mb-5",
-        style: { width: 64, height: 64, borderRadius: "50%", background: "var(--t-error, #EF4444)" },
-        children: /* @__PURE__ */ e("svg", { viewBox: "0 0 24 24", width: "32", height: "32", fill: "white", children: /* @__PURE__ */ e("path", { d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z" }) })
-      }
-    ),
-    /* @__PURE__ */ e("h2", { className: "text-[20px] font-semibold mb-2", style: { color: "var(--t-text)" }, children: c() }),
-    /* @__PURE__ */ e("p", { className: "text-[14px] mb-6", style: { color: "var(--t-text-secondary)" }, children: i() }),
-    r && /* @__PURE__ */ o("div", { className: "w-full text-left mb-6", style: { background: "var(--t-surface)", borderRadius: 5, padding: 16 }, children: [
-      /* @__PURE__ */ o("div", { className: "flex justify-between items-center py-2", style: { borderBottom: "1px solid var(--t-divider)" }, children: [
-        /* @__PURE__ */ e("span", { className: "text-[13px]", style: { color: "var(--t-text-secondary)" }, children: "Order ID" }),
-        /* @__PURE__ */ e("span", { className: "text-[13px] font-medium font-mono", style: { color: "var(--t-text)" }, children: r.orderId })
-      ] }),
-      /* @__PURE__ */ o("div", { className: "flex justify-between items-center py-2", children: [
-        /* @__PURE__ */ e("span", { className: "text-[13px]", style: { color: "var(--t-text-secondary)" }, children: "Status" }),
-        /* @__PURE__ */ e(
-          "span",
-          {
-            className: "text-[12px] font-medium px-2 py-0.5",
-            style: { background: "rgba(239,68,68,0.15)", color: "#EF4444", borderRadius: 4 },
-            children: r.gatewayStatus
-          }
-        )
-      ] })
-    ] }),
-    /* @__PURE__ */ o("div", { className: "w-full flex flex-col gap-2", children: [
-      /* @__PURE__ */ e(
-        "button",
-        {
-          className: "w-full font-semibold text-[16px] transition-all",
-          style: { height: 60, borderRadius: 5, background: "var(--t-cta-bg)", color: "var(--t-cta-text)" },
-          onClick: p,
-          children: "Try Again"
-        }
-      ),
-      /* @__PURE__ */ e(
-        "button",
-        {
-          className: "w-full font-semibold text-[14px] transition-all",
-          style: { height: 48, borderRadius: 5, background: "var(--t-surface)", color: "var(--t-text)" },
-          onClick: f,
-          children: "Start Over"
-        }
-      )
-    ] }),
-    /* @__PURE__ */ o("div", { className: "mt-6", children: [
-      /* @__PURE__ */ o("p", { className: "text-[13px]", style: { color: "var(--t-text-secondary)" }, children: [
-        "Need help? Contact",
-        " ",
-        /* @__PURE__ */ e(
-          "a",
-          {
-            href: `mailto:${n}`,
-            className: "underline",
-            style: { color: "var(--t-accent)" },
-            children: n
-          }
-        )
-      ] }),
-      r && /* @__PURE__ */ o("p", { className: "text-[12px] mt-1", style: { color: "var(--t-text-muted)" }, children: [
-        "Reference: ",
-        r.orderId
-      ] })
-    ] })
-  ] });
-}
-function ot(t) {
-  return t.length <= 12 ? t : `${t.slice(0, 6)}...${t.slice(-6)}`;
-}
-function Ft({ className: t = "" }) {
-  const {
-    config: a,
-    configLoading: n,
-    state: l,
-    defaultGateway: r,
-    fetchQuotes: d,
-    createOrder: u,
-    orderLoading: m
-  } = he(), c = l.flowType === "sell", [i, p] = C(null), f = a == null ? void 0 : a.gateways.find((g) => g.id === r), x = async () => {
-    p(null);
-    try {
-      d(), await u();
-    } catch (g) {
-      const h = g instanceof Error ? g.message : "Failed to create order";
-      p(h);
-    }
-  };
-  return n ? /* @__PURE__ */ o("div", { className: `flex flex-col items-center justify-center p-12 ${t}`, children: [
-    /* @__PURE__ */ e("div", { className: "nramp-spinner" }),
-    /* @__PURE__ */ e("p", { className: "text-[14px] mt-4", style: { color: "var(--t-text-secondary)" }, children: "Loading..." })
-  ] }) : /* @__PURE__ */ o("div", { className: `flex flex-col items-center px-8 py-12 ${t}`, children: [
-    /* @__PURE__ */ e("h2", { className: "text-[20px] font-semibold mb-6", style: { color: "var(--t-text)" }, children: c ? "Confirm Sale" : "Confirm Purchase" }),
-    /* @__PURE__ */ o("div", { className: "w-full text-left mb-6", style: { background: "var(--t-surface)", borderRadius: 5, padding: 16 }, children: [
-      f && /* @__PURE__ */ o("div", { className: "flex justify-between items-center py-2", style: { borderBottom: "1px solid var(--t-divider)" }, children: [
-        /* @__PURE__ */ e("span", { className: "text-[13px]", style: { color: "var(--t-text-secondary)" }, children: "Provider" }),
-        /* @__PURE__ */ o("span", { className: "flex items-center gap-2", children: [
-          f.logo && /* @__PURE__ */ e("img", { src: f.logo, alt: f.name, width: 20, height: 20, style: { borderRadius: 4 } }),
-          /* @__PURE__ */ e("span", { className: "text-[13px] font-medium", style: { color: "var(--t-text)" }, children: f.name })
-        ] })
-      ] }),
-      c ? /* @__PURE__ */ o(le, { children: [
-        /* @__PURE__ */ e(oe, { label: "You sell", value: `${l.cryptoAmount} ${l.cryptoCurrency}`, highlight: !0 }),
-        /* @__PURE__ */ e(oe, { label: "You receive", value: `${l.fiatCurrency} payout` })
-      ] }) : /* @__PURE__ */ o(le, { children: [
-        /* @__PURE__ */ e(oe, { label: "You pay", value: `${l.fiatAmount} ${l.fiatCurrency}`, highlight: !0 }),
-        /* @__PURE__ */ e(oe, { label: "You receive", value: `${l.cryptoCurrency} on ${l.network}` }),
-        /* @__PURE__ */ e(oe, { label: "Wallet", value: ot(l.walletAddress), mono: !0 })
-      ] }),
-      /* @__PURE__ */ e(oe, { label: "Network", value: l.network }),
-      c && l.walletAddress && /* @__PURE__ */ e(oe, { label: "Refund address", value: ot(l.walletAddress), mono: !0 })
-    ] }),
-    i && /* @__PURE__ */ e("p", { className: "text-[12px] mb-4", style: { color: "#EF4444" }, children: i }),
-    /* @__PURE__ */ e(
-      "button",
-      {
-        className: "w-full font-semibold text-[16px] transition-all flex items-center justify-center gap-2",
-        style: { height: 60, borderRadius: 5, background: "var(--t-cta-bg)", color: "var(--t-cta-text)", opacity: m ? 0.7 : 1 },
-        disabled: m,
-        onClick: x,
-        children: m ? /* @__PURE__ */ o(le, { children: [
-          /* @__PURE__ */ e("span", { className: "nramp-spinner-inline" }),
-          "Processing..."
-        ] }) : c ? "Confirm & Sell" : "Confirm & Pay"
-      }
-    )
-  ] });
-}
-function oe({ label: t, value: a, mono: n, highlight: l }) {
-  return /* @__PURE__ */ o("div", { className: "flex justify-between items-center py-2", style: { borderBottom: "1px solid var(--t-divider)" }, children: [
-    /* @__PURE__ */ e("span", { className: "text-[13px]", style: { color: "var(--t-text-secondary)" }, children: t }),
-    /* @__PURE__ */ e(
-      "span",
-      {
-        className: `text-[13px] font-medium ${n ? "font-mono" : ""}`,
-        style: { color: l ? "var(--t-success, #10b981)" : "var(--t-text)" },
-        children: a
-      }
-    )
-  ] });
-}
-function De({
-  isOpen: t,
-  onClose: a,
-  children: n
-}) {
-  const [l, r] = C(!1), [d, u] = C(!1);
-  H(() => {
-    if (t)
-      r(!0), requestAnimationFrame(() => requestAnimationFrame(() => u(!0)));
-    else if (l) {
-      u(!1);
-      const c = setTimeout(() => r(!1), 250);
-      return () => clearTimeout(c);
-    }
-  }, [t]);
-  const m = $(() => {
-    u(!1), setTimeout(() => a(), 250);
-  }, [a]);
-  return l ? /* @__PURE__ */ e(
-    "div",
-    {
-      className: "absolute inset-0 z-20 transition-opacity duration-250",
-      style: { opacity: d ? 1 : 0 },
-      children: /* @__PURE__ */ e(
-        "div",
-        {
-          className: "absolute inset-0 flex flex-col transition-transform duration-250 ease-out",
-          style: { background: "var(--t-modal-bg)", transform: d ? "translateY(0)" : "translateY(24px)" },
-          children: typeof n == "function" ? n(m) : n
-        }
-      )
-    }
-  ) : null;
-}
-function Kt({ char: t, height: a = 38 }) {
-  const n = "0123456789", l = n.indexOf(t);
-  return l === -1 ? /* @__PURE__ */ e("span", { children: t }) : /* @__PURE__ */ e("span", { className: "digit-slot", style: { height: a, lineHeight: `${a}px` }, children: /* @__PURE__ */ e("span", { className: "digit-slot-inner block", style: { transform: `translateY(-${l * a}px)` }, children: n.split("").map((r) => /* @__PURE__ */ e("span", { className: "block", style: { height: a, lineHeight: `${a}px` }, children: r }, r)) }) });
-}
-function _t({
-  value: t,
-  height: a = 38,
-  className: n = "",
-  style: l = {}
-}) {
-  return /* @__PURE__ */ e("span", { className: n, style: { display: "inline-flex", ...l }, children: t.split("").map((r, d) => /* @__PURE__ */ e(Kt, { char: r, height: a }, d)) });
-}
-function B({
-  w: t,
-  h: a,
-  className: n = ""
-}) {
-  return /* @__PURE__ */ e("div", { className: `skeleton ${n}`, style: { width: t, height: a } });
-}
-function Xt() {
-  return /* @__PURE__ */ o("div", { className: "flex-1 px-5 flex flex-col", children: [
-    /* @__PURE__ */ o("div", { className: "px-[18px] pt-[14px] pb-[18px]", style: { background: "var(--t-surface)", borderRadius: 5 }, children: [
-      /* @__PURE__ */ e(B, { w: 70, h: 14, className: "mb-3" }),
-      /* @__PURE__ */ o("div", { className: "flex justify-between items-center", children: [
-        /* @__PURE__ */ e(B, { w: 120, h: 32 }),
-        /* @__PURE__ */ e(B, { w: 75, h: 32 })
-      ] })
-    ] }),
-    /* @__PURE__ */ o("div", { className: "px-[18px] pt-[12px] pb-[18px]", style: { background: "var(--t-surface)", borderRadius: 5, marginTop: 4 }, children: [
-      /* @__PURE__ */ e(B, { w: 50, h: 14, className: "mb-3" }),
-      /* @__PURE__ */ o("div", { className: "flex justify-between items-center", children: [
-        /* @__PURE__ */ e(B, { w: 180, h: 32 }),
-        /* @__PURE__ */ e(B, { w: 85, h: 32 })
-      ] })
-    ] }),
-    /* @__PURE__ */ o("div", { className: "flex justify-between mt-3 px-[2px]", children: [
-      /* @__PURE__ */ e(B, { w: 140, h: 12 }),
-      /* @__PURE__ */ e(B, { w: 90, h: 12 })
-    ] }),
-    /* @__PURE__ */ o("div", { className: "mt-8", children: [
-      /* @__PURE__ */ e(B, { w: 65, h: 14, className: "mb-2.5" }),
-      /* @__PURE__ */ e(B, { w: "100%", h: 47 })
-    ] }),
-    /* @__PURE__ */ e("div", { className: "flex-1" }),
-    /* @__PURE__ */ e(B, { w: "100%", h: 60, className: "mb-2" }),
-    /* @__PURE__ */ e("div", { className: "text-center py-3", children: /* @__PURE__ */ e("span", { className: "text-[11px]", style: { color: "var(--t-text-tertiary)" }, children: "Powered by NowRamp" }) })
-  ] });
-}
-const Re = {
+const Ie = {
   ETH: { name: "Ethereum (ERC20)", shortName: "Ethereum", icon: "eth" },
   BSC: { name: "Binance Smart Chain (BEP20)", shortName: "Binance", icon: "bnb" },
   BTC: { name: "Bitcoin", icon: "btc" },
@@ -1117,7 +512,7 @@ const Re = {
   OKC: { name: "OKX Chain", icon: "eth" },
   UNI_CHAIN: { name: "UNI", icon: "uni" },
   ZEC: { name: "ZCash", icon: "zec" }
-}, $t = [
+}, Ut = [
   // --- Popular / Top coins ---
   { code: "BTC", name: "Bitcoin", chains: ["BTC", "LN"], popular: !0 },
   { code: "ETH", name: "Ethereum", chains: ["ETH", "ARB", "BASE", "BSC", "OPTIMISM", "LINEA", "ZKSYNC", "LRC", "STARK", "APE", "ECLIPSE", "FUEL", "INK", "SOPHON", "UNICHAIN", "WLD"], popular: !0 },
@@ -1310,7 +705,7 @@ const Re = {
   { code: "ZCHF", name: "Frankencoin", chains: ["ETH"], popular: !1 },
   { code: "ZETA", name: "Zeta", chains: ["ETH", "ZETACHAIN"], popular: !1 },
   { code: "ZTG", name: "Zeitgeist", chains: ["ZTG"], popular: !1 }
-], Gt = {
+], Dt = {
   USD: "us",
   EUR: "eu",
   GBP: "gb",
@@ -1324,18 +719,18 @@ const Re = {
   ARS: "ar",
   ALL: "al"
 };
-function pt(t, a = "") {
+function yt(t, a = "") {
   return `${a}/crypto-icons/${t.toLowerCase()}.svg`;
 }
-function Wt(t, a = "") {
-  const n = Gt[t] || "us";
+function Ft(t, a = "") {
+  const n = Dt[t] || "us";
   return `${a}/flags/${n}.svg`;
 }
-function Ke(t, a = "") {
-  const n = Re[t];
+function _e(t, a = "") {
+  const n = Ie[t];
   return n ? `${a}/crypto-icons/${n.icon}.svg` : `${a}/crypto-icons/${t.toLowerCase()}.svg`;
 }
-const lt = [
+const st = [
   { code: "ALL", name: "Albania Lek" },
   { code: "ARS", name: "Argentina Peso" },
   { code: "AUD", name: "Australian Dollar" },
@@ -1355,7 +750,7 @@ const lt = [
   { id: "orange", name: "Orange", accent: "#F59E0B" },
   { id: "rose", name: "Rose", accent: "#F43F5E" },
   { id: "mono", name: "Mono", accent: null }
-], st = {
+], it = {
   USDC: { USD: 0.9962, EUR: 1.0814, GBP: 1.2573, JPY: 667e-5, CAD: 0.7198, AUD: 0.6384, BRL: 0.1726, CHF: 1.1306, MXN: 0.0487, INR: 0.01187, ARS: 855e-6, ALL: 0.01058 },
   USDT: { USD: 0.9958, EUR: 1.081, GBP: 1.2568, JPY: 666e-5, CAD: 0.7194, AUD: 0.638, BRL: 0.1724, CHF: 1.1301, MXN: 0.0486, INR: 0.01186, ARS: 854e-6, ALL: 0.01057 },
   BTC: { USD: 104e-7, EUR: 1129e-8, GBP: 1313e-8, JPY: 696e-10, CAD: 751e-8, AUD: 666e-8, BRL: 18e-7, CHF: 118e-7, MXN: 508e-9, INR: 124e-9, ARS: 892e-11, ALL: 11e-8 },
@@ -1365,14 +760,14 @@ const lt = [
   DOGE: { USD: 3.896, EUR: 4.232, GBP: 4.92, JPY: 0.02607, CAD: 2.815, AUD: 2.496, BRL: 0.675, CHF: 4.421, MXN: 0.1902, INR: 0.04641, ARS: 3345e-6, ALL: 0.04134 },
   ADA: { USD: 1.333, EUR: 1.448, GBP: 1.683, JPY: 892e-5, CAD: 0.963, AUD: 0.854, BRL: 0.2309, CHF: 1.512, MXN: 0.0651, INR: 0.01588, ARS: 1145e-6, ALL: 0.01414 }
 };
-function xa(t, a) {
-  var n, l;
-  return ((n = st[t]) == null ? void 0 : n[a]) ?? ((l = st.USDC) == null ? void 0 : l[a]) ?? 1;
+function Aa(t, a) {
+  var n, s;
+  return ((n = it[t]) == null ? void 0 : n[a]) ?? ((s = it.USDC) == null ? void 0 : s[a]) ?? 1;
 }
-function Yt(t) {
+function Kt(t) {
   return parseFloat(t.replace(/,/g, "")) || 0;
 }
-function ga(t) {
+function wa(t) {
   if (t === 0) return "0";
   if (t >= 1e3) return t.toLocaleString("en-US", { maximumFractionDigits: 2 });
   if (t >= 1) return t.toFixed(2);
@@ -1380,18 +775,18 @@ function ga(t) {
   const a = t.toPrecision(4);
   return parseFloat(a).toString();
 }
-const Fe = (t) => /^#([0-9A-Fa-f]{3}){1,2}$/.test(t), it = 10, dt = 1e-4, Vt = (() => {
+const Ke = (t) => /^#([0-9A-Fa-f]{3}){1,2}$/.test(t), dt = 10, ut = 1e-4, _t = (() => {
   const t = [];
-  for (const a of $t)
+  for (const a of Ut)
     for (const n of a.chains)
       t.push({ code: a.code, name: a.name, chain: n, popular: a.popular });
   return t;
 })();
-function ut({ ticker: t, size: a = 32, baseUrl: n = "" }) {
+function mt({ ticker: t, size: a = 32, baseUrl: n = "" }) {
   return /* @__PURE__ */ e(
     "img",
     {
-      src: pt(t, n),
+      src: yt(t, n),
       alt: t,
       width: a,
       height: a,
@@ -1400,11 +795,11 @@ function ut({ ticker: t, size: a = 32, baseUrl: n = "" }) {
     }
   );
 }
-function _e({ currencyCode: t, size: a = 16, baseUrl: n = "" }) {
+function Xe({ currencyCode: t, size: a = 16, baseUrl: n = "" }) {
   return /* @__PURE__ */ e(
     "img",
     {
-      src: Wt(t, n),
+      src: Ft(t, n),
       alt: t,
       width: a,
       height: a,
@@ -1413,14 +808,14 @@ function _e({ currencyCode: t, size: a = 16, baseUrl: n = "" }) {
     }
   );
 }
-function ft({ size: t = 32, color: a = "#888" }) {
-  return /* @__PURE__ */ o("svg", { width: t, height: t, viewBox: "0 0 32 32", fill: "none", children: [
+function $e({ size: t = 32, color: a = "#888" }) {
+  return /* @__PURE__ */ l("svg", { width: t, height: t, viewBox: "0 0 32 32", fill: "none", children: [
     /* @__PURE__ */ e("circle", { cx: "16", cy: "16", r: "16", fill: a }),
     /* @__PURE__ */ e("circle", { cx: "16", cy: "16", r: "8", stroke: "white", strokeWidth: "1.5", fill: "none" })
   ] });
 }
-function jt({ size: t = 24 }) {
-  return /* @__PURE__ */ o("svg", { width: t, height: t, viewBox: "0 0 32 32", fill: "none", children: [
+function Xt({ size: t = 24 }) {
+  return /* @__PURE__ */ l("svg", { width: t, height: t, viewBox: "0 0 32 32", fill: "none", children: [
     /* @__PURE__ */ e("circle", { cx: "16", cy: "16", r: "16", fill: "#0077FF" }),
     /* @__PURE__ */ e("path", { d: "M8 15l8-6 8 6H8z", fill: "white" }),
     /* @__PURE__ */ e("rect", { x: "10", y: "16", width: "2", height: "6", fill: "white" }),
@@ -1429,7 +824,7 @@ function jt({ size: t = 24 }) {
     /* @__PURE__ */ e("rect", { x: "8", y: "22", width: "16", height: "2", rx: "0.5", fill: "white" })
   ] });
 }
-function Qt({ size: t = 32 }) {
+function $t({ size: t = 32 }) {
   return /* @__PURE__ */ e(
     "div",
     {
@@ -1439,7 +834,7 @@ function Qt({ size: t = 32 }) {
     }
   );
 }
-function Zt({ size: t = 32 }) {
+function Gt({ size: t = 32 }) {
   return /* @__PURE__ */ e(
     "div",
     {
@@ -1449,156 +844,985 @@ function Zt({ size: t = 32 }) {
     }
   );
 }
-function Jt({ size: t = 32 }) {
-  return /* @__PURE__ */ o(
+function jt({ size: t = 32 }) {
+  return /* @__PURE__ */ l(
+    "div",
+    {
+      className: "rounded-full bg-white flex items-center justify-center shrink-0",
+      style: { width: t, height: t, fontSize: t * 0.28, fontWeight: 700, color: "#333" },
+      children: [
+        "G",
+        /* @__PURE__ */ e("span", { style: { color: "#4285F4", fontSize: t * 0.2 }, children: "Pay" })
+      ]
+    }
+  );
+}
+function Yt({ size: t = 32 }) {
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      className: "rounded-full flex items-center justify-center shrink-0",
+      style: { width: t, height: t, background: "#003087" },
+      children: /* @__PURE__ */ e("span", { className: "text-white font-bold", style: { fontSize: t * 0.38 }, children: "P" })
+    }
+  );
+}
+function Vt({ size: t = 32 }) {
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      className: "rounded-full flex items-center justify-center shrink-0",
+      style: { width: t, height: t, background: "var(--t-card-icon-bg)" },
+      children: /* @__PURE__ */ l("svg", { width: t * 0.55, height: t * 0.55, viewBox: "0 0 18 14", fill: "none", children: [
+        /* @__PURE__ */ e("rect", { x: "0.5", y: "0.5", width: "17", height: "13", rx: "2", stroke: "var(--t-card-icon-stroke)" }),
+        /* @__PURE__ */ e("rect", { y: "3", width: "18", height: "3", fill: "var(--t-card-icon-stroke)" })
+      ] })
+    }
+  );
+}
+function Sa({ size: t = 18 }) {
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      className: "rounded-full bg-white flex items-center justify-center shrink-0",
+      style: { width: t, height: t },
+      children: /* @__PURE__ */ e("span", { className: "text-black font-bold", style: { fontSize: t * 0.55 }, children: "C" })
+    }
+  );
+}
+function ge() {
+  return /* @__PURE__ */ e("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", children: /* @__PURE__ */ e("path", { d: "M3 4.5L6 7.5L9 4.5", stroke: "var(--t-text-secondary)", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round" }) });
+}
+function Wt() {
+  return /* @__PURE__ */ e("svg", { width: "8", height: "14", viewBox: "0 0 8 14", fill: "none", children: /* @__PURE__ */ e("path", { d: "M1 1L7 7L1 13", stroke: "var(--t-icon-stroke)", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round" }) });
+}
+function Qt({ onClick: t }) {
+  return /* @__PURE__ */ e("button", { onClick: t, className: "hover:opacity-70 transition-opacity", children: /* @__PURE__ */ e("svg", { width: "24", height: "16", viewBox: "0 0 24 16", fill: "none", children: /* @__PURE__ */ e(
+    "path",
+    {
+      d: "M4 0.799805H20C21.7673 0.799805 23.2002 2.23269 23.2002 4V12C23.2002 13.7673 21.7673 15.2002 20 15.2002H4C2.23269 15.2002 0.799805 13.7673 0.799805 12V4C0.799805 2.23269 2.23269 0.799805 4 0.799805Z",
+      stroke: "var(--t-icon-stroke)",
+      strokeWidth: "1.6"
+    }
+  ) }) });
+}
+function Zt({ size: t = 40 }) {
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      className: "rounded-full flex items-center justify-center shrink-0",
+      style: { width: t, height: t, background: "var(--t-surface)" },
+      children: /* @__PURE__ */ l("svg", { width: t * 0.5, height: t * 0.5, viewBox: "0 0 20 20", fill: "none", children: [
+        /* @__PURE__ */ e("circle", { cx: "10", cy: "10", r: "7.5", stroke: "var(--t-text)", strokeWidth: "1.5" }),
+        /* @__PURE__ */ e("path", { d: "M10 2.5A7.5 7.5 0 0 1 10 17.5", fill: "var(--t-text)" })
+      ] })
+    }
+  );
+}
+function Jt(t, a = 32) {
+  switch (t) {
+    case "revolut":
+      return /* @__PURE__ */ e($t, { size: a });
+    case "applepay":
+      return /* @__PURE__ */ e(Gt, { size: a });
+    case "card":
+      return /* @__PURE__ */ e(Vt, { size: a });
+    case "googlepay":
+      return /* @__PURE__ */ e(jt, { size: a });
+    case "paypal":
+      return /* @__PURE__ */ e(Yt, { size: a });
+    case "bank":
+      return /* @__PURE__ */ e(Xt, { size: a });
+    default:
+      return /* @__PURE__ */ e($e, { size: a });
+  }
+}
+function Le({
+  isOpen: t,
+  onClose: a,
+  children: n
+}) {
+  const [s, r] = N(!1), [u, m] = N(!1);
+  U(() => {
+    if (t)
+      r(!0), requestAnimationFrame(() => requestAnimationFrame(() => m(!0)));
+    else if (s) {
+      m(!1);
+      const o = setTimeout(() => r(!1), 250);
+      return () => clearTimeout(o);
+    }
+  }, [t]);
+  const i = _(() => {
+    m(!1), setTimeout(() => a(), 250);
+  }, [a]);
+  return s ? /* @__PURE__ */ e(
+    "div",
+    {
+      className: "absolute inset-0 z-20 transition-opacity duration-250",
+      style: { opacity: u ? 1 : 0 },
+      children: /* @__PURE__ */ e(
+        "div",
+        {
+          className: "absolute inset-0 flex flex-col transition-transform duration-250 ease-out",
+          style: { background: "var(--t-modal-bg)", transform: u ? "translateY(0)" : "translateY(24px)" },
+          children: typeof n == "function" ? n(i) : n
+        }
+      )
+    }
+  ) : null;
+}
+function ve({ onClick: t }) {
+  return /* @__PURE__ */ e(
+    "button",
+    {
+      onClick: t,
+      className: "flex items-center justify-center transition-colors rounded-full shrink-0",
+      style: { width: 30, height: 30, backgroundColor: "var(--t-close-bg)" },
+      onMouseEnter: (a) => a.currentTarget.style.backgroundColor = "var(--t-close-hover)",
+      onMouseLeave: (a) => a.currentTarget.style.backgroundColor = "var(--t-close-bg)",
+      children: /* @__PURE__ */ e("svg", { width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", children: /* @__PURE__ */ e("path", { d: "M1 1L9 9M9 1L1 9", stroke: "var(--t-icon-close)", strokeWidth: "1.4", strokeLinecap: "round" }) })
+    }
+  );
+}
+function Be({
+  value: t,
+  onChange: a,
+  placeholder: n = ""
+}) {
+  return /* @__PURE__ */ l("div", { className: "relative mx-5 mb-5", children: [
+    /* @__PURE__ */ e(
+      "input",
+      {
+        type: "text",
+        value: t,
+        onChange: (s) => a(s.target.value),
+        placeholder: n,
+        style: { height: 47, borderRadius: 4.5, borderColor: "var(--t-border)", color: "var(--t-text)", paddingLeft: 14, paddingRight: t ? 40 : 14, fontSize: 14 },
+        className: "w-full bg-transparent border outline-none transition-colors"
+      }
+    ),
+    t && /* @__PURE__ */ e(
+      "button",
+      {
+        onClick: () => a(""),
+        className: "absolute right-3 top-1/2 -translate-y-1/2 flex items-center justify-center transition-colors rounded",
+        style: { width: 22, height: 22, backgroundColor: "var(--t-close-bg)", borderRadius: 4 },
+        children: /* @__PURE__ */ e("svg", { width: "8", height: "8", viewBox: "0 0 8 8", fill: "none", children: /* @__PURE__ */ e("path", { d: "M1 1L7 7M7 1L1 7", stroke: "var(--t-icon-close)", strokeWidth: "1.2", strokeLinecap: "round" }) })
+      }
+    )
+  ] });
+}
+function zt({
+  methods: t,
+  selectedId: a,
+  onSelect: n,
+  onClose: s
+}) {
+  const [r, u] = N(""), m = F(() => {
+    const i = r.trim().toLowerCase();
+    return i ? t.filter(
+      (o) => o.id.toLowerCase().includes(i) || o.name.toLowerCase().includes(i) || o.description && o.description.toLowerCase().includes(i)
+    ) : t;
+  }, [t, r]);
+  return /* @__PURE__ */ l(J, { children: [
+    /* @__PURE__ */ e("div", { className: "flex justify-end px-5 pt-5", children: /* @__PURE__ */ e(ve, { onClick: s }) }),
+    /* @__PURE__ */ e(
+      "h2",
+      {
+        className: "text-center text-[17px] font-medium mt-2 mb-6",
+        style: { color: "var(--t-text)" },
+        children: "Choose payment method"
+      }
+    ),
+    /* @__PURE__ */ e(Be, { value: r, onChange: u }),
+    /* @__PURE__ */ l("div", { className: "flex-1 overflow-y-auto custom-scroll px-5", children: [
+      m.map((i) => {
+        const o = i.id === a;
+        return /* @__PURE__ */ l(
+          "button",
+          {
+            onClick: () => n(i.id),
+            className: "flex items-center gap-4 w-full transition-colors",
+            style: {
+              color: "var(--t-text)",
+              paddingTop: 18,
+              paddingBottom: 18
+            },
+            children: [
+              /* @__PURE__ */ e("span", { className: "flex items-center justify-center shrink-0", style: { width: 32, height: 32 }, children: xt(i.id, i.icon, 32) }),
+              /* @__PURE__ */ e("span", { className: "text-left flex-1", children: /* @__PURE__ */ e(
+                "span",
+                {
+                  className: "font-semibold text-[15px] leading-tight",
+                  style: { color: o ? "var(--t-accent)" : "var(--t-text)" },
+                  children: i.name
+                }
+              ) })
+            ]
+          },
+          i.id
+        );
+      }),
+      m.length === 0 && /* @__PURE__ */ e("div", { className: "text-center py-10 text-[14px]", style: { color: "var(--t-text-muted)" }, children: "No payment methods found" })
+    ] })
+  ] });
+}
+const qt = {
+  "debit-credit-card": "card",
+  "bank-transfer": "bank",
+  "apple-pay": "applepay",
+  "google-pay": "googlepay",
+  paypal: "paypal",
+  revolut: "revolut"
+};
+function xt(t, a, n = 24) {
+  const s = qt[t];
+  return s ? Jt(s, n) : a ? /* @__PURE__ */ e("img", { src: a, alt: "", width: n, height: n, style: { borderRadius: "50%" } }) : /* @__PURE__ */ e($e, { size: n });
+}
+function ea({
+  methods: t,
+  selectedId: a,
+  onSelect: n,
+  fiatCurrency: s
+}) {
+  const [r, u] = N(!1), m = F(
+    () => t.filter((o) => o.supportedFiats.includes(s)),
+    [t, s]
+  ), i = m.find((o) => o.id === a) || m[0];
+  return m.length === 0 ? /* @__PURE__ */ e(
+    "div",
+    {
+      className: "flex items-center justify-between px-[18px] pt-[12px] pb-[14px]",
+      style: {
+        background: "var(--t-surface)",
+        borderBottomLeftRadius: 5,
+        borderBottomRightRadius: 5
+      },
+      children: /* @__PURE__ */ l("span", { className: "text-[12px]", style: { color: "var(--t-text-muted)" }, children: [
+        "No payment methods available for ",
+        s
+      ] })
+    }
+  ) : /* @__PURE__ */ l(J, { children: [
+    /* @__PURE__ */ l(
+      "div",
+      {
+        role: "button",
+        tabIndex: 0,
+        onClick: () => u(!0),
+        onKeyDown: (o) => {
+          (o.key === "Enter" || o.key === " ") && u(!0);
+        },
+        className: "flex items-center justify-between w-full px-[18px] transition-colors",
+        style: {
+          background: "var(--t-surface)",
+          borderBottomLeftRadius: 5,
+          borderBottomRightRadius: 5,
+          cursor: "pointer",
+          height: 42
+        },
+        children: [
+          /* @__PURE__ */ e("span", { className: "text-[12px]", style: { color: "var(--t-text-secondary)" }, children: "Payment method" }),
+          /* @__PURE__ */ l("span", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ e("span", { className: "flex items-center justify-center", style: { width: 20, height: 20 }, children: i && xt(i.id, i.icon, 20) }),
+            /* @__PURE__ */ e("span", { className: "text-[13px] font-medium", style: { color: "var(--t-text)" }, children: (i == null ? void 0 : i.name) || "Select" }),
+            /* @__PURE__ */ e(ge, {})
+          ] })
+        ]
+      }
+    ),
+    /* @__PURE__ */ e(Le, { isOpen: r, onClose: () => u(!1), children: (o) => /* @__PURE__ */ e(
+      zt,
+      {
+        methods: m,
+        selectedId: a,
+        onSelect: (d) => {
+          n(d), o();
+        },
+        onClose: o
+      }
+    ) })
+  ] });
+}
+function ta({
+  className: t = "",
+  iframeHeight: a = 600,
+  autoRedirect: n = !1,
+  redirectDelay: s = 3e3
+}) {
+  var g;
+  const { order: r, orderStatus: u, goToStep: m, goBack: i } = pe(), [o, d] = N(!1), [h, f] = N(null), x = r != null && r.checkout.expiresAt ? Date.now() > r.checkout.expiresAt : !1;
+  if (U(() => {
+    if ((r == null ? void 0 : r.checkout.method) === "redirect" && n && !x) {
+      f(Math.ceil(s / 1e3));
+      const p = setTimeout(() => {
+        window.location.href = r.checkout.url;
+      }, s), b = setInterval(() => {
+        f((S) => S && S > 1 ? S - 1 : null);
+      }, 1e3);
+      return () => {
+        clearTimeout(p), clearInterval(b);
+      };
+    }
+  }, [r, n, s, x]), U(() => {
+    u && (u.status === "completed" ? m("complete") : ["failed", "cancelled", "expired"].includes(u.status) && m("error"));
+  }, [u == null ? void 0 : u.status, m]), !r)
+    return /* @__PURE__ */ l(
+      "div",
+      {
+        className: `flex flex-col items-center justify-center p-8 ${t}`,
+        style: { color: "var(--t-text)" },
+        children: [
+          /* @__PURE__ */ e("p", { className: "text-[15px] mb-4", children: "No order found" }),
+          /* @__PURE__ */ e(
+            "button",
+            {
+              className: "font-semibold text-[14px] transition-all",
+              style: {
+                height: 48,
+                borderRadius: 5,
+                background: "var(--t-surface)",
+                color: "var(--t-text)",
+                paddingLeft: 24,
+                paddingRight: 24
+              },
+              onClick: i,
+              children: "Go Back"
+            }
+          )
+        ]
+      }
+    );
+  if (x)
+    return /* @__PURE__ */ l(
+      "div",
+      {
+        className: `flex flex-col items-center justify-center p-8 text-center ${t}`,
+        style: { color: "var(--t-text)" },
+        children: [
+          /* @__PURE__ */ e("h3", { className: "text-[18px] font-semibold mb-2", children: "Checkout expired" }),
+          /* @__PURE__ */ e("p", { className: "text-[14px] mb-6", style: { color: "var(--t-text-secondary)" }, children: "The session has expired. Please try again." }),
+          /* @__PURE__ */ e(
+            "button",
+            {
+              className: "w-full font-semibold text-[16px] transition-all",
+              style: {
+                height: 60,
+                borderRadius: 5,
+                background: "var(--t-cta-bg)",
+                color: "var(--t-cta-text)"
+              },
+              onClick: i,
+              children: "Start over"
+            }
+          )
+        ]
+      }
+    );
+  if (r.checkout.method === "iframe")
+    return /* @__PURE__ */ e("div", { className: `flex flex-col flex-1 ${t}`, children: /* @__PURE__ */ l(
+      "div",
+      {
+        className: "relative flex-1",
+        style: {
+          height: a,
+          borderRadius: 5,
+          overflow: "hidden",
+          background: "var(--t-surface)"
+        },
+        children: [
+          !o && /* @__PURE__ */ l("div", { className: "absolute inset-0 flex flex-col items-center justify-center", children: [
+            /* @__PURE__ */ e("div", { className: "nramp-spinner" }),
+            /* @__PURE__ */ e("p", { className: "text-[14px] mt-4", style: { color: "var(--t-text-secondary)" }, children: "Loading checkout..." })
+          ] }),
+          /* @__PURE__ */ e(
+            "iframe",
+            {
+              src: r.checkout.url,
+              style: {
+                display: o ? "block" : "none",
+                width: "100%",
+                height: "100%",
+                border: "none"
+              },
+              allow: ((g = r.checkout.allowedFeatures) == null ? void 0 : g.join("; ")) || "payment; camera; microphone; geolocation; clipboard-read; clipboard-write; accelerometer; gyroscope; magnetometer; fullscreen; autoplay; encrypted-media; web-share",
+              onLoad: () => d(!0),
+              title: "Provider Checkout"
+            }
+          )
+        ]
+      }
+    ) });
+  if (r.checkout.method === "redirect")
+    return /* @__PURE__ */ l(
+      "div",
+      {
+        className: `flex flex-col items-center justify-center p-8 text-center ${t}`,
+        style: { color: "var(--t-text)" },
+        children: [
+          /* @__PURE__ */ e("div", { className: "text-[48px] mb-4", children: "🔗" }),
+          /* @__PURE__ */ e("h3", { className: "text-[18px] font-semibold mb-2", children: "Complete Payment" }),
+          /* @__PURE__ */ l("p", { className: "text-[14px] mb-4", style: { color: "var(--t-text-secondary)" }, children: [
+            "You'll be redirected to ",
+            r.gateway,
+            " to complete your payment."
+          ] }),
+          h !== null && /* @__PURE__ */ l("p", { className: "text-[13px] mb-4", style: { color: "var(--t-text-muted)" }, children: [
+            "Redirecting in ",
+            h,
+            "..."
+          ] }),
+          /* @__PURE__ */ l(
+            "a",
+            {
+              href: r.checkout.url,
+              className: "w-full font-semibold text-[16px] flex items-center justify-center transition-all",
+              style: {
+                height: 60,
+                borderRadius: 5,
+                background: "var(--t-cta-bg)",
+                color: "var(--t-cta-text)",
+                textDecoration: "none"
+              },
+              target: "_blank",
+              rel: "noopener noreferrer",
+              children: [
+                "Continue to ",
+                r.gateway
+              ]
+            }
+          ),
+          /* @__PURE__ */ e(
+            "button",
+            {
+              className: "w-full font-semibold text-[14px] mt-2 transition-all",
+              style: {
+                height: 48,
+                borderRadius: 5,
+                background: "var(--t-surface)",
+                color: "var(--t-text)"
+              },
+              onClick: i,
+              children: "Cancel"
+            }
+          )
+        ]
+      }
+    );
+  if (r.checkout.method === "widget" && r.widgetConfig) {
+    const p = aa(r.checkout.url, r.widgetConfig);
+    return /* @__PURE__ */ e("div", { className: `flex flex-col flex-1 ${t}`, children: /* @__PURE__ */ l(
+      "div",
+      {
+        className: "relative flex-1",
+        style: {
+          height: a,
+          borderRadius: 5,
+          overflow: "hidden",
+          background: "var(--t-surface)"
+        },
+        children: [
+          !o && /* @__PURE__ */ l("div", { className: "absolute inset-0 flex flex-col items-center justify-center", children: [
+            /* @__PURE__ */ e("div", { className: "nramp-spinner" }),
+            /* @__PURE__ */ e("p", { className: "text-[14px] mt-4", style: { color: "var(--t-text-secondary)" }, children: "Loading checkout..." })
+          ] }),
+          /* @__PURE__ */ e(
+            "iframe",
+            {
+              src: p,
+              style: {
+                display: o ? "block" : "none",
+                width: "100%",
+                height: "100%",
+                border: "none"
+              },
+              allow: "payment; camera; microphone; geolocation; clipboard-read; clipboard-write; accelerometer; gyroscope; magnetometer; fullscreen; autoplay; encrypted-media; web-share",
+              onLoad: () => d(!0),
+              title: "Payment Checkout"
+            }
+          )
+        ]
+      }
+    ) });
+  }
+  return /* @__PURE__ */ l(
+    "div",
+    {
+      className: `flex flex-col items-center justify-center p-8 ${t}`,
+      style: { color: "var(--t-text)" },
+      children: [
+        /* @__PURE__ */ e("p", { className: "text-[15px] mb-4", children: "Unknown checkout method" }),
+        /* @__PURE__ */ e(
+          "button",
+          {
+            className: "font-semibold text-[14px] transition-all",
+            style: {
+              height: 48,
+              borderRadius: 5,
+              background: "var(--t-surface)",
+              color: "var(--t-text)",
+              paddingLeft: 24,
+              paddingRight: 24
+            },
+            onClick: i,
+            children: "Go Back"
+          }
+        )
+      ]
+    }
+  );
+}
+function aa(t, a) {
+  const n = new URL("/en/partner/widget", t);
+  for (const [s, r] of Object.entries(a))
+    r != null && r !== "" && n.searchParams.set(s, String(r));
+  return n.toString();
+}
+function na({ className: t = "" }) {
+  const { orderStatus: a, orderStatusLoading: n, goToStep: s } = pe();
+  U(() => {
+    a && (a.status === "completed" ? s("complete") : ["failed", "cancelled", "expired", "refunded"].includes(a.status) && s("error"));
+  }, [a == null ? void 0 : a.status, s]);
+  const r = () => {
+    if (!a) return "Processing your order...";
+    switch (a.status) {
+      case "pending":
+        return "Waiting for payment confirmation...";
+      case "processing":
+        return "Processing your transaction...";
+      default:
+        return "Processing...";
+    }
+  };
+  return /* @__PURE__ */ l("div", { className: `flex flex-col items-center justify-center px-8 py-12 text-center ${t}`, children: [
+    /* @__PURE__ */ e("div", { className: "mb-6", children: /* @__PURE__ */ e("div", { className: "nramp-spinner-large nramp-spinner" }) }),
+    /* @__PURE__ */ e("h2", { className: "text-[20px] font-semibold mb-3", style: { color: "var(--t-text)" }, children: r() }),
+    n && /* @__PURE__ */ e("p", { className: "text-[13px] mb-4", style: { color: "var(--t-text-muted)" }, children: "Checking status..." }),
+    a && /* @__PURE__ */ l("div", { className: "w-full mt-6 text-left", style: { background: "var(--t-surface)", borderRadius: 5, padding: 16 }, children: [
+      /* @__PURE__ */ e(me, { label: "Order ID", value: a.orderId, mono: !0 }),
+      /* @__PURE__ */ e(me, { label: "Provider", value: a.gateway }),
+      /* @__PURE__ */ e(
+        me,
+        {
+          label: "Amount",
+          value: `${a.fiatAmount} ${a.fiatCurrency}`
+        }
+      ),
+      /* @__PURE__ */ e(
+        me,
+        {
+          label: "Receiving",
+          value: `${a.cryptoAmount || "..."} ${a.cryptoCurrency}`
+        }
+      ),
+      /* @__PURE__ */ e(me, { label: "Network", value: a.network }),
+      /* @__PURE__ */ e(
+        me,
+        {
+          label: "To Address",
+          value: `${a.walletAddress.slice(0, 10)}...${a.walletAddress.slice(-8)}`,
+          mono: !0
+        }
+      )
+    ] }),
+    /* @__PURE__ */ l("div", { className: "mt-6", children: [
+      /* @__PURE__ */ e("p", { className: "text-[13px]", style: { color: "var(--t-text-secondary)" }, children: "This usually takes a few minutes." }),
+      /* @__PURE__ */ e("p", { className: "text-[12px] mt-1", style: { color: "var(--t-text-muted)" }, children: "You can safely close this page - we'll send you an email when complete." })
+    ] })
+  ] });
+}
+function me({ label: t, value: a, mono: n }) {
+  return /* @__PURE__ */ l(
+    "div",
+    {
+      className: "flex justify-between items-center py-2",
+      style: { borderBottom: "1px solid var(--t-divider)" },
+      children: [
+        /* @__PURE__ */ e("span", { className: "text-[13px]", style: { color: "var(--t-text-secondary)" }, children: t }),
+        /* @__PURE__ */ e(
+          "span",
+          {
+            className: `text-[13px] font-medium ${n ? "font-mono" : ""}`,
+            style: { color: "var(--t-text)" },
+            children: a
+          }
+        )
+      ]
+    }
+  );
+}
+function ra({
+  className: t = "",
+  explorerUrl: a,
+  onDone: n,
+  doneButtonText: s = "Done"
+}) {
+  const { orderStatus: r, state: u, dispatch: m } = pe(), i = u.flowType === "sell", o = () => {
+    if (!(r != null && r.transactionHash)) return null;
+    if (!a) {
+      const f = {
+        ethereum: "https://etherscan.io/tx/{txHash}",
+        polygon: "https://polygonscan.com/tx/{txHash}",
+        arbitrum: "https://arbiscan.io/tx/{txHash}",
+        optimism: "https://optimistic.etherscan.io/tx/{txHash}",
+        base: "https://basescan.org/tx/{txHash}",
+        bitcoin: "https://mempool.space/tx/{txHash}",
+        solana: "https://solscan.io/tx/{txHash}",
+        avalanche: "https://snowtrace.io/tx/{txHash}",
+        fantom: "https://ftmscan.com/tx/{txHash}"
+      };
+      return (f[u.network] || f.ethereum).replace("{txHash}", r.transactionHash);
+    }
+    return a.replace("{txHash}", r.transactionHash);
+  }, d = () => {
+    n ? n() : m({ type: "RESET" });
+  }, h = o();
+  return /* @__PURE__ */ l("div", { className: `flex flex-col items-center px-8 py-12 text-center ${t}`, children: [
+    /* @__PURE__ */ e(
+      "div",
+      {
+        className: "flex items-center justify-center mb-5",
+        style: { width: 64, height: 64, borderRadius: "50%", background: "var(--t-success, #10b981)" },
+        children: /* @__PURE__ */ e("svg", { viewBox: "0 0 24 24", width: "32", height: "32", fill: "white", children: /* @__PURE__ */ e("path", { d: "M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z" }) })
+      }
+    ),
+    /* @__PURE__ */ e("h2", { className: "text-[20px] font-semibold mb-2", style: { color: "var(--t-text)" }, children: i ? "Sale Complete!" : "Purchase Complete!" }),
+    /* @__PURE__ */ e("p", { className: "text-[14px] mb-6", style: { color: "var(--t-text-secondary)" }, children: i ? `Your ${(r == null ? void 0 : r.fiatCurrency) || u.fiatCurrency} payout is being processed.` : `Your ${(r == null ? void 0 : r.cryptoCurrency) || u.cryptoCurrency} has been sent to your wallet.` }),
+    r && /* @__PURE__ */ l("div", { className: "w-full text-left mb-6", style: { background: "var(--t-surface)", borderRadius: 5, padding: 16 }, children: [
+      /* @__PURE__ */ e(
+        te,
+        {
+          label: i ? "Amount Sold" : "Amount Received",
+          value: `${r.cryptoAmount} ${r.cryptoCurrency}`,
+          highlight: !0
+        }
+      ),
+      /* @__PURE__ */ e(
+        te,
+        {
+          label: i ? "Payout Amount" : "Amount Paid",
+          value: `${r.fiatAmount} ${r.fiatCurrency}`
+        }
+      ),
+      /* @__PURE__ */ e(te, { label: "Network", value: r.network }),
+      /* @__PURE__ */ e(
+        te,
+        {
+          label: "Wallet",
+          value: `${r.walletAddress.slice(0, 10)}...${r.walletAddress.slice(-8)}`,
+          mono: !0
+        }
+      ),
+      r.transactionHash && /* @__PURE__ */ e(
+        te,
+        {
+          label: "Transaction",
+          value: `${r.transactionHash.slice(0, 10)}...${r.transactionHash.slice(-8)}`,
+          mono: !0
+        }
+      ),
+      /* @__PURE__ */ e(te, { label: "Provider", value: r.gateway }),
+      /* @__PURE__ */ e(te, { label: "Order ID", value: r.orderId, mono: !0 }),
+      r.completedAt && /* @__PURE__ */ e(
+        te,
+        {
+          label: "Completed",
+          value: new Date(r.completedAt).toLocaleString()
+        }
+      )
+    ] }),
+    /* @__PURE__ */ l("div", { className: "w-full flex flex-col gap-2", children: [
+      h && /* @__PURE__ */ e(
+        "a",
+        {
+          href: h,
+          target: "_blank",
+          rel: "noopener noreferrer",
+          className: "w-full font-semibold text-[14px] flex items-center justify-center transition-all",
+          style: { height: 48, borderRadius: 5, background: "var(--t-surface)", color: "var(--t-text)", textDecoration: "none" },
+          children: "View on Explorer"
+        }
+      ),
+      /* @__PURE__ */ e(
+        "button",
+        {
+          className: "w-full font-semibold text-[16px] transition-all",
+          style: { height: 60, borderRadius: 5, background: "var(--t-cta-bg)", color: "var(--t-cta-text)" },
+          onClick: d,
+          children: s
+        }
+      )
+    ] })
+  ] });
+}
+function te({ label: t, value: a, mono: n, highlight: s }) {
+  return /* @__PURE__ */ l(
     "div",
     {
-      className: "rounded-full bg-white flex items-center justify-center shrink-0",
-      style: { width: t, height: t, fontSize: t * 0.28, fontWeight: 700, color: "#333" },
+      className: "flex justify-between items-center py-2",
+      style: { borderBottom: "1px solid var(--t-divider)" },
       children: [
-        "G",
-        /* @__PURE__ */ e("span", { style: { color: "#4285F4", fontSize: t * 0.2 }, children: "Pay" })
+        /* @__PURE__ */ e("span", { className: "text-[13px]", style: { color: "var(--t-text-secondary)" }, children: t }),
+        /* @__PURE__ */ e(
+          "span",
+          {
+            className: `text-[13px] font-medium ${n ? "font-mono" : ""}`,
+            style: { color: s ? "var(--t-success, #10b981)" : "var(--t-text)" },
+            children: a
+          }
+        )
       ]
     }
   );
 }
-function zt({ size: t = 32 }) {
-  return /* @__PURE__ */ e(
-    "div",
-    {
-      className: "rounded-full flex items-center justify-center shrink-0",
-      style: { width: t, height: t, background: "#003087" },
-      children: /* @__PURE__ */ e("span", { className: "text-white font-bold", style: { fontSize: t * 0.38 }, children: "P" })
-    }
-  );
-}
-function qt({ size: t = 32 }) {
-  return /* @__PURE__ */ e(
-    "div",
-    {
-      className: "rounded-full flex items-center justify-center shrink-0",
-      style: { width: t, height: t, background: "var(--t-card-icon-bg)" },
-      children: /* @__PURE__ */ o("svg", { width: t * 0.55, height: t * 0.55, viewBox: "0 0 18 14", fill: "none", children: [
-        /* @__PURE__ */ e("rect", { x: "0.5", y: "0.5", width: "17", height: "13", rx: "2", stroke: "var(--t-card-icon-stroke)" }),
-        /* @__PURE__ */ e("rect", { y: "3", width: "18", height: "3", fill: "var(--t-card-icon-stroke)" })
+function oa({
+  className: t = "",
+  onRetry: a,
+  supportEmail: n = "support@nowramp.com"
+}) {
+  const { state: s, orderStatus: r, dispatch: u, goToStep: m } = pe(), i = s.flowType === "sell", o = () => {
+    if (r)
+      switch (r.status) {
+        case "failed":
+          return "Payment Failed";
+        case "cancelled":
+          return "Order Cancelled";
+        case "expired":
+          return "Order Expired";
+        case "refunded":
+          return "Order Refunded";
+        default:
+          return "Something Went Wrong";
+      }
+    return "Something Went Wrong";
+  }, d = () => {
+    if (s.errorMessage) return s.errorMessage;
+    if (r)
+      switch (r.status) {
+        case "failed":
+          return i ? "Your sale could not be processed. Please try again." : "Your payment could not be processed. Please try again or use a different payment method.";
+        case "cancelled":
+          return i ? "Your sale was cancelled. No crypto was transferred." : "Your order was cancelled. No payment was processed.";
+        case "expired":
+          return i ? "Your order has expired. Please start a new sale." : "Your order has expired. Please start a new purchase.";
+        case "refunded":
+          return i ? "Your crypto has been returned. The funds should appear in your wallet shortly." : "Your payment has been refunded. The funds should appear in your account within 5-10 business days.";
+        default:
+          return "An unexpected error occurred. Please try again.";
+      }
+    return "An unexpected error occurred. Please try again.";
+  }, h = () => {
+    u({ type: "CLEAR_ERROR" }), a ? a() : (u({ type: "RESET" }), m("amount"));
+  }, f = () => {
+    u({ type: "RESET" }), m("amount");
+  };
+  return /* @__PURE__ */ l("div", { className: `flex flex-col items-center px-8 py-12 text-center ${t}`, children: [
+    /* @__PURE__ */ e(
+      "div",
+      {
+        className: "flex items-center justify-center mb-5",
+        style: { width: 64, height: 64, borderRadius: "50%", background: "var(--t-error, #EF4444)" },
+        children: /* @__PURE__ */ e("svg", { viewBox: "0 0 24 24", width: "32", height: "32", fill: "white", children: /* @__PURE__ */ e("path", { d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z" }) })
+      }
+    ),
+    /* @__PURE__ */ e("h2", { className: "text-[20px] font-semibold mb-2", style: { color: "var(--t-text)" }, children: o() }),
+    /* @__PURE__ */ e("p", { className: "text-[14px] mb-6", style: { color: "var(--t-text-secondary)" }, children: d() }),
+    r && /* @__PURE__ */ l("div", { className: "w-full text-left mb-6", style: { background: "var(--t-surface)", borderRadius: 5, padding: 16 }, children: [
+      /* @__PURE__ */ l("div", { className: "flex justify-between items-center py-2", style: { borderBottom: "1px solid var(--t-divider)" }, children: [
+        /* @__PURE__ */ e("span", { className: "text-[13px]", style: { color: "var(--t-text-secondary)" }, children: "Order ID" }),
+        /* @__PURE__ */ e("span", { className: "text-[13px] font-medium font-mono", style: { color: "var(--t-text)" }, children: r.orderId })
+      ] }),
+      /* @__PURE__ */ l("div", { className: "flex justify-between items-center py-2", children: [
+        /* @__PURE__ */ e("span", { className: "text-[13px]", style: { color: "var(--t-text-secondary)" }, children: "Status" }),
+        /* @__PURE__ */ e(
+          "span",
+          {
+            className: "text-[12px] font-medium px-2 py-0.5",
+            style: { background: "rgba(239,68,68,0.15)", color: "#EF4444", borderRadius: 4 },
+            children: r.gatewayStatus
+          }
+        )
       ] })
-    }
-  );
-}
-function va({ size: t = 18 }) {
-  return /* @__PURE__ */ e(
-    "div",
-    {
-      className: "rounded-full bg-white flex items-center justify-center shrink-0",
-      style: { width: t, height: t },
-      children: /* @__PURE__ */ e("span", { className: "text-black font-bold", style: { fontSize: t * 0.55 }, children: "C" })
-    }
-  );
-}
-function Te() {
-  return /* @__PURE__ */ e("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", children: /* @__PURE__ */ e("path", { d: "M3 4.5L6 7.5L9 4.5", stroke: "var(--t-text-secondary)", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round" }) });
-}
-function ea() {
-  return /* @__PURE__ */ e("svg", { width: "8", height: "14", viewBox: "0 0 8 14", fill: "none", children: /* @__PURE__ */ e("path", { d: "M1 1L7 7L1 13", stroke: "var(--t-icon-stroke)", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round" }) });
-}
-function ta({ onClick: t }) {
-  return /* @__PURE__ */ e("button", { onClick: t, className: "hover:opacity-70 transition-opacity", children: /* @__PURE__ */ e("svg", { width: "24", height: "16", viewBox: "0 0 24 16", fill: "none", children: /* @__PURE__ */ e(
-    "path",
-    {
-      d: "M4 0.799805H20C21.7673 0.799805 23.2002 2.23269 23.2002 4V12C23.2002 13.7673 21.7673 15.2002 20 15.2002H4C2.23269 15.2002 0.799805 13.7673 0.799805 12V4C0.799805 2.23269 2.23269 0.799805 4 0.799805Z",
-      stroke: "var(--t-icon-stroke)",
-      strokeWidth: "1.6"
-    }
-  ) }) });
-}
-function aa({ size: t = 40 }) {
-  return /* @__PURE__ */ e(
-    "div",
-    {
-      className: "rounded-full flex items-center justify-center shrink-0",
-      style: { width: t, height: t, background: "var(--t-surface)" },
-      children: /* @__PURE__ */ o("svg", { width: t * 0.5, height: t * 0.5, viewBox: "0 0 20 20", fill: "none", children: [
-        /* @__PURE__ */ e("circle", { cx: "10", cy: "10", r: "7.5", stroke: "var(--t-text)", strokeWidth: "1.5" }),
-        /* @__PURE__ */ e("path", { d: "M10 2.5A7.5 7.5 0 0 1 10 17.5", fill: "var(--t-text)" })
+    ] }),
+    /* @__PURE__ */ l("div", { className: "w-full flex flex-col gap-2", children: [
+      /* @__PURE__ */ e(
+        "button",
+        {
+          className: "w-full font-semibold text-[16px] transition-all",
+          style: { height: 60, borderRadius: 5, background: "var(--t-cta-bg)", color: "var(--t-cta-text)" },
+          onClick: h,
+          children: "Try Again"
+        }
+      ),
+      /* @__PURE__ */ e(
+        "button",
+        {
+          className: "w-full font-semibold text-[14px] transition-all",
+          style: { height: 48, borderRadius: 5, background: "var(--t-surface)", color: "var(--t-text)" },
+          onClick: f,
+          children: "Start Over"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ l("div", { className: "mt-6", children: [
+      /* @__PURE__ */ l("p", { className: "text-[13px]", style: { color: "var(--t-text-secondary)" }, children: [
+        "Need help? Contact",
+        " ",
+        /* @__PURE__ */ e(
+          "a",
+          {
+            href: `mailto:${n}`,
+            className: "underline",
+            style: { color: "var(--t-accent)" },
+            children: n
+          }
+        )
+      ] }),
+      r && /* @__PURE__ */ l("p", { className: "text-[12px] mt-1", style: { color: "var(--t-text-muted)" }, children: [
+        "Reference: ",
+        r.orderId
       ] })
-    }
-  );
+    ] })
+  ] });
 }
-function Na(t, a = 32) {
-  switch (t) {
-    case "revolut":
-      return /* @__PURE__ */ e(Qt, { size: a });
-    case "applepay":
-      return /* @__PURE__ */ e(Zt, { size: a });
-    case "card":
-      return /* @__PURE__ */ e(qt, { size: a });
-    case "googlepay":
-      return /* @__PURE__ */ e(Jt, { size: a });
-    case "paypal":
-      return /* @__PURE__ */ e(zt, { size: a });
-    case "bank":
-      return /* @__PURE__ */ e(jt, { size: a });
-    default:
-      return /* @__PURE__ */ e(ft, { size: a });
-  }
+function pt(t) {
+  return t.length <= 12 ? t : `${t.slice(0, 6)}...${t.slice(-6)}`;
 }
-function Le({ onClick: t }) {
-  return /* @__PURE__ */ e(
-    "button",
-    {
-      onClick: t,
-      className: "flex items-center justify-center transition-colors rounded-full shrink-0",
-      style: { width: 30, height: 30, backgroundColor: "var(--t-close-bg)" },
-      onMouseEnter: (a) => a.currentTarget.style.backgroundColor = "var(--t-close-hover)",
-      onMouseLeave: (a) => a.currentTarget.style.backgroundColor = "var(--t-close-bg)",
-      children: /* @__PURE__ */ e("svg", { width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", children: /* @__PURE__ */ e("path", { d: "M1 1L9 9M9 1L1 9", stroke: "var(--t-icon-close)", strokeWidth: "1.4", strokeLinecap: "round" }) })
+function la({ className: t = "" }) {
+  const {
+    config: a,
+    configLoading: n,
+    state: s,
+    defaultGateway: r,
+    fetchQuotes: u,
+    createOrder: m,
+    orderLoading: i
+  } = pe(), o = s.flowType === "sell", [d, h] = N(null), f = a == null ? void 0 : a.gateways.find((g) => g.id === r), x = async () => {
+    h(null);
+    try {
+      u(), await m();
+    } catch (g) {
+      const p = g instanceof Error ? g.message : "Failed to create order";
+      h(p);
     }
-  );
-}
-function Xe({
-  value: t,
-  onChange: a,
-  placeholder: n = ""
-}) {
-  return /* @__PURE__ */ o("div", { className: "relative mx-5 mb-5", children: [
+  };
+  return n ? /* @__PURE__ */ l("div", { className: `flex flex-col items-center justify-center p-12 ${t}`, children: [
+    /* @__PURE__ */ e("div", { className: "nramp-spinner" }),
+    /* @__PURE__ */ e("p", { className: "text-[14px] mt-4", style: { color: "var(--t-text-secondary)" }, children: "Loading..." })
+  ] }) : /* @__PURE__ */ l("div", { className: `flex flex-col items-center px-8 py-12 ${t}`, children: [
+    /* @__PURE__ */ e("h2", { className: "text-[20px] font-semibold mb-6", style: { color: "var(--t-text)" }, children: o ? "Confirm Sale" : "Confirm Purchase" }),
+    /* @__PURE__ */ l("div", { className: "w-full text-left mb-6", style: { background: "var(--t-surface)", borderRadius: 5, padding: 16 }, children: [
+      f && /* @__PURE__ */ l("div", { className: "flex justify-between items-center py-2", style: { borderBottom: "1px solid var(--t-divider)" }, children: [
+        /* @__PURE__ */ e("span", { className: "text-[13px]", style: { color: "var(--t-text-secondary)" }, children: "Provider" }),
+        /* @__PURE__ */ l("span", { className: "flex items-center gap-2", children: [
+          f.logo && /* @__PURE__ */ e("img", { src: f.logo, alt: f.name, width: 20, height: 20, style: { borderRadius: 4 } }),
+          /* @__PURE__ */ e("span", { className: "text-[13px] font-medium", style: { color: "var(--t-text)" }, children: f.name })
+        ] })
+      ] }),
+      o ? /* @__PURE__ */ l(J, { children: [
+        /* @__PURE__ */ e(le, { label: "You sell", value: `${s.cryptoAmount} ${s.cryptoCurrency}`, highlight: !0 }),
+        /* @__PURE__ */ e(le, { label: "You receive", value: `${s.fiatCurrency} payout` })
+      ] }) : /* @__PURE__ */ l(J, { children: [
+        /* @__PURE__ */ e(le, { label: "You pay", value: `${s.fiatAmount} ${s.fiatCurrency}`, highlight: !0 }),
+        /* @__PURE__ */ e(le, { label: "You receive", value: `${s.cryptoCurrency} on ${s.network}` }),
+        /* @__PURE__ */ e(le, { label: "Wallet", value: pt(s.walletAddress), mono: !0 })
+      ] }),
+      /* @__PURE__ */ e(le, { label: "Network", value: s.network }),
+      o && s.walletAddress && /* @__PURE__ */ e(le, { label: "Refund address", value: pt(s.walletAddress), mono: !0 })
+    ] }),
+    d && /* @__PURE__ */ e("p", { className: "text-[12px] mb-4", style: { color: "#EF4444" }, children: d }),
     /* @__PURE__ */ e(
-      "input",
+      "button",
       {
-        type: "text",
-        value: t,
-        onChange: (l) => a(l.target.value),
-        placeholder: n,
-        style: { height: 47, borderRadius: 4.5, borderColor: "var(--t-border)", color: "var(--t-text)", paddingLeft: 14, paddingRight: t ? 40 : 14, fontSize: 14 },
-        className: "w-full bg-transparent border outline-none transition-colors"
+        className: "w-full font-semibold text-[16px] transition-all flex items-center justify-center gap-2",
+        style: { height: 60, borderRadius: 5, background: "var(--t-cta-bg)", color: "var(--t-cta-text)", opacity: i ? 0.7 : 1 },
+        disabled: i,
+        onClick: x,
+        children: i ? /* @__PURE__ */ l(J, { children: [
+          /* @__PURE__ */ e("span", { className: "nramp-spinner-inline" }),
+          "Processing..."
+        ] }) : o ? "Confirm & Sell" : "Confirm & Pay"
       }
-    ),
-    t && /* @__PURE__ */ e(
-      "button",
+    )
+  ] });
+}
+function le({ label: t, value: a, mono: n, highlight: s }) {
+  return /* @__PURE__ */ l("div", { className: "flex justify-between items-center py-2", style: { borderBottom: "1px solid var(--t-divider)" }, children: [
+    /* @__PURE__ */ e("span", { className: "text-[13px]", style: { color: "var(--t-text-secondary)" }, children: t }),
+    /* @__PURE__ */ e(
+      "span",
       {
-        onClick: () => a(""),
-        className: "absolute right-3 top-1/2 -translate-y-1/2 flex items-center justify-center transition-colors rounded",
-        style: { width: 22, height: 22, backgroundColor: "var(--t-close-bg)", borderRadius: 4 },
-        children: /* @__PURE__ */ e("svg", { width: "8", height: "8", viewBox: "0 0 8 8", fill: "none", children: /* @__PURE__ */ e("path", { d: "M1 1L7 7M7 1L1 7", stroke: "var(--t-icon-close)", strokeWidth: "1.2", strokeLinecap: "round" }) })
+        className: `text-[13px] font-medium ${n ? "font-mono" : ""}`,
+        style: { color: s ? "var(--t-success, #10b981)" : "var(--t-text)" },
+        children: a
       }
     )
   ] });
 }
-function na({ onClose: t, onSelect: a, currencies: n, assetBaseUrl: l = "" }) {
-  const [r, d] = C(""), u = X(() => {
-    if (!n || n.length === 0) return lt;
-    const c = new Map(lt.map((i) => [i.code, i.name]));
-    return n.map((i) => ({
-      code: i.code,
-      name: i.name || c.get(i.code) || i.code
+function sa({ char: t, height: a = 38 }) {
+  const n = "0123456789", s = n.indexOf(t);
+  return s === -1 ? /* @__PURE__ */ e("span", { children: t }) : /* @__PURE__ */ e("span", { className: "digit-slot", style: { height: a, lineHeight: `${a}px` }, children: /* @__PURE__ */ e("span", { className: "digit-slot-inner block", style: { transform: `translateY(-${s * a}px)` }, children: n.split("").map((r) => /* @__PURE__ */ e("span", { className: "block", style: { height: a, lineHeight: `${a}px` }, children: r }, r)) }) });
+}
+function ca({
+  value: t,
+  height: a = 38,
+  className: n = "",
+  style: s = {}
+}) {
+  return /* @__PURE__ */ e("span", { className: n, style: { display: "inline-flex", ...s }, children: t.split("").map((r, u) => /* @__PURE__ */ e(sa, { char: r, height: a }, u)) });
+}
+function M({
+  w: t,
+  h: a,
+  className: n = ""
+}) {
+  return /* @__PURE__ */ e("div", { className: `skeleton ${n}`, style: { width: t, height: a } });
+}
+function ia() {
+  return /* @__PURE__ */ l("div", { className: "flex-1 px-5 flex flex-col", children: [
+    /* @__PURE__ */ l("div", { className: "px-[18px] pt-[14px] pb-[18px]", style: { background: "var(--t-surface)", borderRadius: 5 }, children: [
+      /* @__PURE__ */ e(M, { w: 70, h: 14, className: "mb-3" }),
+      /* @__PURE__ */ l("div", { className: "flex justify-between items-center", children: [
+        /* @__PURE__ */ e(M, { w: 120, h: 32 }),
+        /* @__PURE__ */ e(M, { w: 75, h: 32 })
+      ] })
+    ] }),
+    /* @__PURE__ */ l("div", { className: "px-[18px] pt-[12px] pb-[18px]", style: { background: "var(--t-surface)", borderRadius: 5, marginTop: 4 }, children: [
+      /* @__PURE__ */ e(M, { w: 50, h: 14, className: "mb-3" }),
+      /* @__PURE__ */ l("div", { className: "flex justify-between items-center", children: [
+        /* @__PURE__ */ e(M, { w: 180, h: 32 }),
+        /* @__PURE__ */ e(M, { w: 85, h: 32 })
+      ] })
+    ] }),
+    /* @__PURE__ */ l("div", { className: "flex justify-between mt-3 px-[2px]", children: [
+      /* @__PURE__ */ e(M, { w: 140, h: 12 }),
+      /* @__PURE__ */ e(M, { w: 90, h: 12 })
+    ] }),
+    /* @__PURE__ */ l("div", { className: "mt-8", children: [
+      /* @__PURE__ */ e(M, { w: 65, h: 14, className: "mb-2.5" }),
+      /* @__PURE__ */ e(M, { w: "100%", h: 47 })
+    ] }),
+    /* @__PURE__ */ e("div", { className: "flex-1" }),
+    /* @__PURE__ */ e(M, { w: "100%", h: 60, className: "mb-2" }),
+    /* @__PURE__ */ e("div", { className: "text-center py-3", children: /* @__PURE__ */ e("span", { className: "text-[11px]", style: { color: "var(--t-text-tertiary)" }, children: "Powered by NowRamp" }) })
+  ] });
+}
+function da({ onClose: t, onSelect: a, currencies: n, assetBaseUrl: s = "" }) {
+  const [r, u] = N(""), m = F(() => {
+    if (!n || n.length === 0) return st;
+    const o = new Map(st.map((d) => [d.code, d.name]));
+    return n.map((d) => ({
+      code: d.code,
+      name: d.name || o.get(d.code) || d.code
     }));
-  }, [n]), m = X(() => {
-    const c = r.trim().toLowerCase();
-    return c ? u.filter(
-      (i) => i.code.toLowerCase().includes(c) || i.name.toLowerCase().includes(c)
-    ) : u;
-  }, [u, r]);
-  return /* @__PURE__ */ o(le, { children: [
-    /* @__PURE__ */ e("div", { className: "flex justify-end px-5 pt-5", children: /* @__PURE__ */ e(Le, { onClick: t }) }),
+  }, [n]), i = F(() => {
+    const o = r.trim().toLowerCase();
+    return o ? m.filter(
+      (d) => d.code.toLowerCase().includes(o) || d.name.toLowerCase().includes(o)
+    ) : m;
+  }, [m, r]);
+  return /* @__PURE__ */ l(J, { children: [
+    /* @__PURE__ */ e("div", { className: "flex justify-end px-5 pt-5", children: /* @__PURE__ */ e(ve, { onClick: t }) }),
     /* @__PURE__ */ e(
       "h2",
       {
@@ -1607,64 +1831,64 @@ function na({ onClose: t, onSelect: a, currencies: n, assetBaseUrl: l = "" }) {
         children: "Select fiat currency"
       }
     ),
-    /* @__PURE__ */ e(Xe, { value: r, onChange: d }),
-    /* @__PURE__ */ o("div", { className: "flex-1 overflow-y-auto custom-scroll px-5", children: [
-      m.map((c) => /* @__PURE__ */ o(
+    /* @__PURE__ */ e(Be, { value: r, onChange: u }),
+    /* @__PURE__ */ l("div", { className: "flex-1 overflow-y-auto custom-scroll px-5", children: [
+      i.map((o) => /* @__PURE__ */ l(
         "button",
         {
-          onClick: () => a(c.code),
+          onClick: () => a(o.code),
           className: "flex items-center gap-3.5 w-full py-3.5 transition-colors",
           style: { color: "var(--t-text)" },
           children: [
-            /* @__PURE__ */ e(_e, { currencyCode: c.code, size: 32, baseUrl: l }),
-            /* @__PURE__ */ o("div", { className: "text-left", children: [
-              /* @__PURE__ */ e("div", { className: "font-semibold text-[15px] leading-tight", children: c.code }),
-              /* @__PURE__ */ e("div", { className: "text-[13px] mt-0.5", style: { color: "var(--t-text-secondary)" }, children: c.name })
+            /* @__PURE__ */ e(Xe, { currencyCode: o.code, size: 32, baseUrl: s }),
+            /* @__PURE__ */ l("div", { className: "text-left", children: [
+              /* @__PURE__ */ e("div", { className: "font-semibold text-[15px] leading-tight", children: o.code }),
+              /* @__PURE__ */ e("div", { className: "text-[13px] mt-0.5", style: { color: "var(--t-text-secondary)" }, children: o.name })
             ] })
           ]
         },
-        c.code
+        o.code
       )),
-      m.length === 0 && /* @__PURE__ */ e("div", { className: "text-center py-10 text-[14px]", style: { color: "var(--t-text-muted)" }, children: "No currencies found" })
+      i.length === 0 && /* @__PURE__ */ e("div", { className: "text-center py-10 text-[14px]", style: { color: "var(--t-text-muted)" }, children: "No currencies found" })
     ] })
   ] });
 }
-function ra({ onClose: t, onSelect: a, cryptos: n, assetBaseUrl: l = "" }) {
-  const [r, d] = C(""), u = X(() => {
-    if (!n || n.length === 0) return Vt;
-    const c = [];
-    for (const i of n) {
-      const p = i.networks || [];
-      if (p.length === 0)
-        c.push({ code: i.code, name: i.name || i.code, chain: i.code, popular: !1 });
+function ua({ onClose: t, onSelect: a, cryptos: n, assetBaseUrl: s = "" }) {
+  const [r, u] = N(""), m = F(() => {
+    if (!n || n.length === 0) return _t;
+    const o = [];
+    for (const d of n) {
+      const h = d.networks || [];
+      if (h.length === 0)
+        o.push({ code: d.code, name: d.name || d.code, chain: d.code, popular: !1 });
       else
-        for (const f of p) {
-          const x = f.code || f.id || f.name || i.code;
-          c.push({
-            code: i.code,
-            name: i.name || i.code,
+        for (const f of h) {
+          const x = f.code || f.id || f.name || d.code;
+          o.push({
+            code: d.code,
+            name: d.name || d.code,
             chain: x,
             chainName: f.name,
             popular: !1
           });
         }
     }
-    return c;
-  }, [n]), m = X(() => {
+    return o;
+  }, [n]), i = F(() => {
     var f;
-    const c = r.trim().toLowerCase();
-    if (!c) return u;
-    const i = c.split(/\s+/), p = [];
-    for (const x of u) {
-      const g = Re[x.chain], h = g ? g.name.toLowerCase() : "", b = ((f = g == null ? void 0 : g.shortName) == null ? void 0 : f.toLowerCase()) || "", L = x.chain.toLowerCase(), O = x.code.toLowerCase(), A = x.name.toLowerCase(), G = [O, A, h, b, L];
-      if (!i.every((Z) => G.some((s) => s.includes(Z)))) continue;
-      let W = 0;
-      O === c ? W += 100 : O.startsWith(i[0]) && (W += 50), x.popular && (W += 10), i.length > 1 && (h.includes(i[1]) || b.includes(i[1]) || L.includes(i[1])) && (W += 25), p.push({ item: x, score: W });
+    const o = r.trim().toLowerCase();
+    if (!o) return m;
+    const d = o.split(/\s+/), h = [];
+    for (const x of m) {
+      const g = Ie[x.chain], p = g ? g.name.toLowerCase() : "", b = ((f = g == null ? void 0 : g.shortName) == null ? void 0 : f.toLowerCase()) || "", S = x.chain.toLowerCase(), P = x.code.toLowerCase(), w = x.name.toLowerCase(), G = [P, w, p, b, S];
+      if (!d.every((z) => G.some((c) => c.includes(z)))) continue;
+      let j = 0;
+      P === o ? j += 100 : P.startsWith(d[0]) && (j += 50), x.popular && (j += 10), d.length > 1 && (p.includes(d[1]) || b.includes(d[1]) || S.includes(d[1])) && (j += 25), h.push({ item: x, score: j });
     }
-    return p.sort((x, g) => g.score - x.score), p.map((x) => x.item);
-  }, [u, r]);
-  return /* @__PURE__ */ o(le, { children: [
-    /* @__PURE__ */ e("div", { className: "flex justify-end px-5 pt-5", children: /* @__PURE__ */ e(Le, { onClick: t }) }),
+    return h.sort((x, g) => g.score - x.score), h.map((x) => x.item);
+  }, [m, r]);
+  return /* @__PURE__ */ l(J, { children: [
+    /* @__PURE__ */ e("div", { className: "flex justify-end px-5 pt-5", children: /* @__PURE__ */ e(ve, { onClick: t }) }),
     /* @__PURE__ */ e(
       "h2",
       {
@@ -1673,22 +1897,22 @@ function ra({ onClose: t, onSelect: a, cryptos: n, assetBaseUrl: l = "" }) {
         children: "Select crypto currency"
       }
     ),
-    /* @__PURE__ */ e(Xe, { value: r, onChange: d }),
-    /* @__PURE__ */ o("div", { className: "flex-1 overflow-y-auto custom-scroll px-5", children: [
-      m.map((c) => {
-        const i = Re[c.chain], p = (i == null ? void 0 : i.name) || c.chainName || c.chain;
-        return /* @__PURE__ */ o(
+    /* @__PURE__ */ e(Be, { value: r, onChange: u }),
+    /* @__PURE__ */ l("div", { className: "flex-1 overflow-y-auto custom-scroll px-5", children: [
+      i.map((o) => {
+        const d = Ie[o.chain], h = (d == null ? void 0 : d.name) || o.chainName || o.chain;
+        return /* @__PURE__ */ l(
           "button",
           {
-            onClick: () => a(c.code, c.chain),
+            onClick: () => a(o.code, o.chain),
             className: "flex items-center gap-3.5 w-full py-3.5 transition-colors",
             children: [
-              /* @__PURE__ */ o("div", { className: "relative shrink-0", style: { width: 40, height: 40 }, children: [
+              /* @__PURE__ */ l("div", { className: "relative shrink-0", style: { width: 40, height: 40 }, children: [
                 /* @__PURE__ */ e(
                   "img",
                   {
-                    src: pt(c.code, l),
-                    alt: c.code,
+                    src: yt(o.code, s),
+                    alt: o.code,
                     width: 32,
                     height: 32,
                     className: "rounded-full absolute top-0 left-0",
@@ -1698,8 +1922,8 @@ function ra({ onClose: t, onSelect: a, cryptos: n, assetBaseUrl: l = "" }) {
                 /* @__PURE__ */ e(
                   "img",
                   {
-                    src: Ke(c.chain, l),
-                    alt: c.chain,
+                    src: _e(o.chain, s),
+                    alt: o.chain,
                     width: 16,
                     height: 16,
                     className: "rounded-full absolute",
@@ -1713,28 +1937,28 @@ function ra({ onClose: t, onSelect: a, cryptos: n, assetBaseUrl: l = "" }) {
                   }
                 )
               ] }),
-              /* @__PURE__ */ o("div", { className: "text-left flex-1 min-w-0", children: [
+              /* @__PURE__ */ l("div", { className: "text-left flex-1 min-w-0", children: [
                 /* @__PURE__ */ e(
                   "div",
                   {
                     className: "font-semibold text-[15px] leading-tight",
                     style: { color: "var(--t-text)" },
-                    children: c.code
+                    children: o.code
                   }
                 ),
-                /* @__PURE__ */ e("div", { className: "text-[13px] mt-0.5", style: { color: "var(--t-text-secondary)" }, children: c.name })
+                /* @__PURE__ */ e("div", { className: "text-[13px] mt-0.5", style: { color: "var(--t-text-secondary)" }, children: o.name })
               ] }),
-              /* @__PURE__ */ e("div", { className: "text-right shrink-0", children: /* @__PURE__ */ e("div", { className: "text-[13px]", style: { color: "var(--t-text-muted)" }, children: p }) })
+              /* @__PURE__ */ e("div", { className: "text-right shrink-0", children: /* @__PURE__ */ e("div", { className: "text-[13px]", style: { color: "var(--t-text-muted)" }, children: h }) })
             ]
           },
-          `${c.code}-${c.chain}`
+          `${o.code}-${o.chain}`
         );
       }),
-      m.length === 0 && /* @__PURE__ */ e("div", { className: "text-center py-10 text-[14px]", style: { color: "var(--t-text-muted)" }, children: "No currencies found" })
+      i.length === 0 && /* @__PURE__ */ e("div", { className: "text-center py-10 text-[14px]", style: { color: "var(--t-text-muted)" }, children: "No currencies found" })
     ] })
   ] });
 }
-function oa({
+function ma({
   checked: t,
   onChange: a,
   accentColor: n = "var(--t-accent)"
@@ -1764,23 +1988,23 @@ function oa({
     }
   );
 }
-const la = [
+const pa = [
   { label: "Privacy policy", href: "https://nowramp.com/privacy-policy" },
   { label: "Terms of use", href: "https://nowramp.com/terms-and-conditions" }
 ];
-function ca({
+function ha({
   onClose: t,
   darkMode: a,
   onToggleDarkMode: n,
-  skinId: l,
+  skinId: s,
   onSelectSkin: r
 }) {
-  return /* @__PURE__ */ o(le, { children: [
-    /* @__PURE__ */ e("div", { className: "flex justify-end items-center px-5 pt-5", children: /* @__PURE__ */ e(Le, { onClick: t }) }),
-    /* @__PURE__ */ o("div", { className: "px-5 flex-1 pt-6 overflow-y-auto custom-scroll", children: [
-      /* @__PURE__ */ e("div", { style: { borderTop: "1px solid var(--t-divider)" }, children: /* @__PURE__ */ o("div", { className: "flex items-center justify-between w-full py-5", children: [
-        /* @__PURE__ */ o("div", { className: "flex items-center gap-3.5", children: [
-          /* @__PURE__ */ e(aa, { size: 40 }),
+  return /* @__PURE__ */ l(J, { children: [
+    /* @__PURE__ */ e("div", { className: "flex justify-end items-center px-5 pt-5", children: /* @__PURE__ */ e(ve, { onClick: t }) }),
+    /* @__PURE__ */ l("div", { className: "px-5 flex-1 pt-6 overflow-y-auto custom-scroll", children: [
+      /* @__PURE__ */ e("div", { style: { borderTop: "1px solid var(--t-divider)" }, children: /* @__PURE__ */ l("div", { className: "flex items-center justify-between w-full py-5", children: [
+        /* @__PURE__ */ l("div", { className: "flex items-center gap-3.5", children: [
+          /* @__PURE__ */ e(Zt, { size: 40 }),
           /* @__PURE__ */ e(
             "span",
             {
@@ -1790,14 +2014,14 @@ function ca({
             }
           )
         ] }),
-        /* @__PURE__ */ e(oa, { checked: a, onChange: n, accentColor: "#4CD964" })
+        /* @__PURE__ */ e(ma, { checked: a, onChange: n, accentColor: "#4CD964" })
       ] }) }),
       /* @__PURE__ */ e("div", { style: { height: 1, background: "var(--t-divider)" } }),
-      la.map((d) => /* @__PURE__ */ o("div", { children: [
-        /* @__PURE__ */ o(
+      pa.map((u) => /* @__PURE__ */ l("div", { children: [
+        /* @__PURE__ */ l(
           "a",
           {
-            href: d.href,
+            href: u.href,
             target: "_blank",
             rel: "noopener noreferrer",
             className: "flex items-center justify-between w-full py-5 transition-colors",
@@ -1807,201 +2031,206 @@ function ca({
                 {
                   className: "font-medium text-[15px]",
                   style: { color: "var(--t-text)" },
-                  children: d.label
+                  children: u.label
                 }
               ),
-              /* @__PURE__ */ e(ea, {})
+              /* @__PURE__ */ e(Wt, {})
             ]
           }
         ),
         /* @__PURE__ */ e("div", { style: { height: 1, background: "var(--t-divider)" } })
-      ] }, d.label))
+      ] }, u.label))
     ] })
   ] });
 }
-function sa({
+function fa({
   className: t = "",
   theme: a = "dark",
   skinId: n = "mono",
-  accentColor: l,
+  accentColor: s,
   bgColor: r,
-  bgImage: d,
-  borderColor: u,
-  borderRadius: m,
-  showFlowToggle: c = !0,
-  autoRedirect: i = !1,
-  explorerUrl: p,
+  bgImage: u,
+  borderColor: m,
+  borderRadius: i,
+  showFlowToggle: o = !0,
+  autoRedirect: d = !1,
+  explorerUrl: h,
   doneButtonText: f = "Done",
   supportEmail: x,
   onDone: g
 }) {
-  var Je, ze, qe, et, tt, at, nt;
+  var ze, qe, et, tt, at, nt, rt, ot;
   const {
-    state: h,
+    state: p,
     dispatch: b,
-    config: L,
-    configLoading: O,
-    quotes: A,
+    config: S,
+    configLoading: P,
+    quotes: w,
     quotesLoading: G,
-    quotesError: j,
-    fetchQuotes: W,
-    createOrder: Z,
-    orderLoading: s,
-    amountError: P,
-    fieldLocks: v,
-    apiConfig: I,
-    assetBaseUrl: D
-  } = he(), [F, K] = C(a === "dark"), [ge, pe] = C(n), [fe, Y] = C(null), [ye, ee] = C(!1), [ve, ce] = C(!1), [se, Ne] = C(!1), [V, te] = C(null), [ae, Ce] = C(!0), [be, Ee] = C(!1), [J, ie] = C(!1), Ie = U(null), xe = U(), N = U(h.flowType);
-  H(() => {
-    K(a === "dark");
-  }, [a]), H(() => {
-    const y = setTimeout(() => Ce(!1), O ? 0 : 800);
+    quotesError: Q,
+    fetchQuotes: j,
+    createOrder: z,
+    orderLoading: c,
+    amountError: O,
+    fieldLocks: C,
+    apiConfig: L,
+    assetBaseUrl: K
+  } = pe(), [X, $] = N(a === "dark"), [Ne, he] = N(n), [fe, Y] = N(null), [ye, ae] = N(!1), [Ce, se] = N(!1), [ce, be] = N(!1), [V, ne] = N(null), [re, Ee] = N(!0), [Ae, we] = N(!1), [q, ie] = N(!1), Oe = D(null), xe = D(), v = D(p.flowType);
+  U(() => {
+    $(a === "dark");
+  }, [a]), U(() => {
+    const y = setTimeout(() => Ee(!1), P ? 0 : 800);
     return () => clearTimeout(y);
-  }, [O]), H(() => {
-    if (N.current !== h.flowType && !ae) {
-      N.current = h.flowType, Ee(!0), ee(!1), ce(!1);
-      const y = setTimeout(() => Ee(!1), 350);
+  }, [P]), U(() => {
+    if (v.current !== p.flowType && !re) {
+      v.current = p.flowType, we(!0), ae(!1), se(!1);
+      const y = setTimeout(() => we(!1), 350);
       return () => clearTimeout(y);
     }
-    N.current = h.flowType;
-  }, [h.flowType, ae]);
-  const S = h.flowType, R = S === "buy", k = h.cryptoCurrency || "BTC", w = h.fiatCurrency || "USD", _ = R ? h.fiatAmount : h.cryptoAmount, ne = Yt(_), de = (Je = A == null ? void 0 : A.bestQuote) != null && Je.exchangeRate ? parseFloat(A.bestQuote.exchangeRate) : null, Ae = U(null);
-  de && k && w && (Ae.current = { rate: de, crypto: k, fiat: w });
-  const yt = X(() => {
-    if (A != null && A.bestQuote) {
-      const y = R ? A.bestQuote.cryptoAmount : A.bestQuote.fiatAmount;
+    v.current = p.flowType;
+  }, [p.flowType, re]);
+  const E = p.flowType, R = E === "buy", k = p.cryptoCurrency || "BTC", T = p.fiatCurrency || "USD", H = R ? p.fiatAmount : p.cryptoAmount, W = Kt(H), de = (ze = w == null ? void 0 : w.bestQuote) != null && ze.exchangeRate ? parseFloat(w.bestQuote.exchangeRate) : null, Se = D(null);
+  de && k && T && (Se.current = { rate: de, crypto: k, fiat: T });
+  const gt = F(() => {
+    if (w != null && w.bestQuote) {
+      const y = R ? w.bestQuote.cryptoAmount : w.bestQuote.fiatAmount;
       if (y) return y;
     }
     return "0";
-  }, [A, R]), xt = X(() => {
-    var M, z, Oe;
-    const y = de || ((M = Ae.current) == null ? void 0 : M.rate), E = de ? k : (z = Ae.current) == null ? void 0 : z.crypto, T = de ? w : (Oe = Ae.current) == null ? void 0 : Oe.fiat;
-    return !y || !E || !T ? "" : `1 ${E} ≈ ${y.toFixed(2)} ${T}`;
-  }, [k, w, de]);
-  H(() => {
-    const y = h.walletAddress.trim(), E = h.network;
+  }, [w, R]), vt = F(() => {
+    var B, ee, Ue;
+    const y = de || ((B = Se.current) == null ? void 0 : B.rate), A = de ? k : (ee = Se.current) == null ? void 0 : ee.crypto, I = de ? T : (Ue = Se.current) == null ? void 0 : Ue.fiat;
+    return !y || !A || !I ? "" : `1 ${A} ≈ ${y.toFixed(2)} ${I}`;
+  }, [k, T, de]);
+  U(() => {
+    const y = p.walletAddress.trim(), A = p.network;
     if (!y || y.length < 10) {
-      te(null), b({ type: "SET_WALLET_ERROR", message: "" });
+      ne(null), b({ type: "SET_WALLET_ERROR", message: "" });
       return;
     }
-    return Ne(!0), te(null), clearTimeout(xe.current), xe.current = setTimeout(async () => {
-      var T, M, z;
+    return be(!0), ne(null), clearTimeout(xe.current), xe.current = setTimeout(async () => {
+      var I, B, ee;
       try {
-        const Pe = await (await fetch(`${I.apiUrl}/public/validate/address`, {
+        const De = await (await fetch(`${L.apiUrl}/public/validate/address`, {
           method: "POST",
           headers: { "Content-Type": "application/json" },
-          body: JSON.stringify({ address: y, ...E ? { network: E } : {} })
-        })).json(), He = ((T = Pe.data) == null ? void 0 : T.attributes) || Pe.data || Pe;
-        if (He.isValid)
-          te(!0), b({ type: "SET_WALLET_ERROR", message: "" });
+          body: JSON.stringify({ address: y, ...A ? { network: A } : {} })
+        })).json(), Fe = ((I = De.data) == null ? void 0 : I.attributes) || De.data || De;
+        if (Fe.isValid)
+          ne(!0), b({ type: "SET_WALLET_ERROR", message: "" });
         else {
-          te(!1);
-          const At = ((M = He.errors) == null ? void 0 : M[0]) || ((z = He.details) == null ? void 0 : z.formatMessage) || "Invalid wallet address";
-          b({ type: "SET_WALLET_ERROR", message: At });
+          ne(!1);
+          const Tt = ((B = Fe.errors) == null ? void 0 : B[0]) || ((ee = Fe.details) == null ? void 0 : ee.formatMessage) || "Invalid wallet address";
+          b({ type: "SET_WALLET_ERROR", message: Tt });
         }
       } catch {
-        te(null);
+        ne(null);
       } finally {
-        Ne(!1);
+        be(!1);
       }
     }, 500), () => clearTimeout(xe.current);
-  }, [h.walletAddress, h.network, I.apiUrl]);
-  const $e = !_ || ne === 0, Ge = ne > 0 && (R ? ne < it : ne < dt), We = !!P || Ge || ye && $e, gt = ne > 0 && !P && !Ge, Be = h.walletAddress.trim().length >= 10 && V !== !1 && !se, Se = gt && Be && !!h.cryptoCurrency && !!h.network, vt = (y) => {
-    let E = y.target.value.replace(/[^0-9.,]/g, "");
-    const T = R ? 2 : 6, M = E.indexOf(".");
-    M !== -1 && E.length - M - 1 > T && (E = E.slice(0, M + T + 1)), b(R ? { type: "SET_FIAT_AMOUNT", amount: E } : { type: "SET_CRYPTO_AMOUNT", amount: E });
-  }, Ye = (y) => {
-    y !== S && b({ type: "SET_FLOW_TYPE", flowType: y });
-  }, Nt = $(
+  }, [p.walletAddress, p.network, L.apiUrl]);
+  const Ge = !H || W === 0, je = W > 0 && (R ? W < dt : W < ut), Ye = !!O || je || ye && Ge, Nt = W > 0 && !O && !je, Pe = p.walletAddress.trim().length >= 10 && V !== !1 && !ce, Te = Nt && Pe && !!p.cryptoCurrency && !!p.network, Ct = (y) => {
+    let A = y.target.value.replace(/[^0-9.,]/g, "");
+    const I = R ? 2 : 6, B = A.indexOf(".");
+    B !== -1 && A.length - B - 1 > I && (A = A.slice(0, B + I + 1)), b(R ? { type: "SET_FIAT_AMOUNT", amount: A } : { type: "SET_CRYPTO_AMOUNT", amount: A });
+  }, Ve = (y) => {
+    y !== E && b({ type: "SET_FLOW_TYPE", flowType: y });
+  }, bt = _(
     (y) => {
       b({ type: "SET_FIAT_CURRENCY", currency: y });
     },
     [b]
-  ), Ct = $(
-    (y, E) => {
-      b({ type: "SET_CRYPTO_CURRENCY", currency: y }), b({ type: "SET_CRYPTO_CHAIN", chain: E });
+  ), Et = _(
+    (y, A) => {
+      b({ type: "SET_CRYPTO_CURRENCY", currency: y }), b({ type: "SET_CRYPTO_CHAIN", chain: A });
     },
     [b]
-  ), bt = () => {
-    Se && (ie(!0), W());
+  ), At = _(
+    (y) => {
+      b({ type: "SET_PAYMENT_METHOD", methodId: y });
+    },
+    [b]
+  ), wt = () => {
+    Te && (ie(!0), j());
   };
-  H(() => {
+  U(() => {
     var y;
-    if (!(!J || G)) {
-      if (A != null && A.bestQuote)
-        ie(!1), b({ type: "SELECT_QUOTE", quote: A.bestQuote }), Z().catch(() => {
+    if (!(!q || G)) {
+      if (w != null && w.bestQuote)
+        ie(!1), b({ type: "SELECT_QUOTE", quote: w.bestQuote }), z().catch(() => {
         });
-      else if (j)
-        ie(!1), b({ type: "SET_ERROR", message: j.message || "No quotes available" });
-      else if (A && !A.bestQuote) {
+      else if (Q)
+        ie(!1), b({ type: "SET_ERROR", message: Q.message || "No quotes available" });
+      else if (w && !w.bestQuote) {
         ie(!1);
-        const E = (y = A.unavailableGateways) == null ? void 0 : y.map((M) => M.reason).filter(Boolean), T = E != null && E.length ? `No providers available: ${E.join("; ")}` : "No providers available for this currency/network combination";
-        b({ type: "SET_ERROR", message: T });
+        const A = (y = w.unavailableGateways) == null ? void 0 : y.map((B) => B.reason).filter(Boolean), I = A != null && A.length ? `No providers available: ${A.join("; ")}` : "No providers available for this currency/network combination";
+        b({ type: "SET_ERROR", message: I });
       }
     }
-  }, [J, A, G, j, b, Z]);
-  const Ve = F ? "theme-dark" : "theme-light", Me = ct.find((y) => y.id === ge) || ct[0], Et = Me.accent === null, je = (l ? Fe(l) : !1) ? { "--t-accent": l, "--t-cta-bg": l, "--t-cta-text": "#ffffff" } : Et ? {
-    "--t-accent": F ? "#ffffff" : "#111111",
-    "--t-cta-bg": F ? "#ffffff" : "#111111",
-    "--t-cta-text": F ? "#000000" : "#ffffff"
+  }, [q, w, G, Q, b, z]);
+  const We = X ? "theme-dark" : "theme-light", He = ct.find((y) => y.id === Ne) || ct[0], St = He.accent === null, Qe = (s ? Ke(s) : !1) ? { "--t-accent": s, "--t-cta-bg": s, "--t-cta-text": "#ffffff" } : St ? {
+    "--t-accent": X ? "#ffffff" : "#111111",
+    "--t-cta-bg": X ? "#ffffff" : "#111111",
+    "--t-cta-text": X ? "#000000" : "#ffffff"
   } : {
-    "--t-accent": Me.accent,
-    "--t-cta-bg": Me.accent,
+    "--t-accent": He.accent,
+    "--t-cta-bg": He.accent,
     "--t-cta-text": "#ffffff"
-  }, re = {};
-  r && Fe(r) ? re.backgroundColor = r : re.backgroundColor = "var(--t-bg)", d && (re.backgroundImage = `url(${d})`, re.backgroundSize = "cover", re.backgroundPosition = "center");
-  const we = {};
-  u && Fe(u) && (we.border = `1px solid ${u}`), m && (we.borderRadius = m);
-  const Qe = h.step === "checkout" ? /* @__PURE__ */ e(Ot, { autoRedirect: i }) : h.step === "processing" ? /* @__PURE__ */ e(Ht, {}) : h.step === "complete" ? /* @__PURE__ */ e(Ut, { explorerUrl: p, doneButtonText: f, onDone: g }) : h.step === "error" ? /* @__PURE__ */ e(Dt, { supportEmail: x }) : h.step === "confirm" ? /* @__PURE__ */ e(Ft, {}) : null;
-  if (Qe)
+  }, oe = {};
+  r && Ke(r) ? oe.backgroundColor = r : oe.backgroundColor = "var(--t-bg)", u && (oe.backgroundImage = `url(${u})`, oe.backgroundSize = "cover", oe.backgroundPosition = "center");
+  const Re = {};
+  m && Ke(m) && (Re.border = `1px solid ${m}`), i && (Re.borderRadius = i);
+  const Ze = p.step === "checkout" ? /* @__PURE__ */ e(ta, { autoRedirect: d }) : p.step === "processing" ? /* @__PURE__ */ e(na, {}) : p.step === "complete" ? /* @__PURE__ */ e(ra, { explorerUrl: h, doneButtonText: f, onDone: g }) : p.step === "error" ? /* @__PURE__ */ e(oa, { supportEmail: x }) : p.step === "confirm" ? /* @__PURE__ */ e(la, {}) : null;
+  if (Ze)
     return /* @__PURE__ */ e(
       "div",
       {
-        className: `${Ve} relative w-full max-w-[390px] h-[640px] overflow-hidden flex flex-col select-none transition-colors duration-300 ${t}`,
+        className: `${We} relative w-full max-w-[390px] h-[640px] overflow-hidden flex flex-col select-none transition-colors duration-300 ${t}`,
         style: {
           fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
-          ...re,
-          ...je,
-          ...we
+          ...oe,
+          ...Qe,
+          ...Re
         },
-        children: Qe
+        children: Ze
       }
     );
-  const Q = h.network, ue = Q ? Re[Q] : null, Ze = (ue == null ? void 0 : ue.shortName) || (ue == null ? void 0 : ue.name) || Q;
-  return /* @__PURE__ */ o(
+  const Z = p.network, ue = Z ? Ie[Z] : null, Je = (ue == null ? void 0 : ue.shortName) || (ue == null ? void 0 : ue.name) || Z;
+  return /* @__PURE__ */ l(
     "div",
     {
-      className: `${Ve} relative w-full max-w-[390px] min-h-[640px] overflow-hidden flex flex-col select-none transition-colors duration-300 ${t}`,
+      className: `${We} relative w-full max-w-[390px] min-h-[640px] overflow-hidden flex flex-col select-none transition-colors duration-300 ${t}`,
       style: {
         fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
-        ...re,
-        ...je,
-        ...we
+        ...oe,
+        ...Qe,
+        ...Re
       },
       children: [
-        /* @__PURE__ */ e("div", { className: `flex justify-end items-center px-5 pt-3 ${c ? "pb-1" : "pb-5"}`, children: /* @__PURE__ */ e(ta, { onClick: () => Y("settings") }) }),
-        c ? /* @__PURE__ */ o("div", { className: "flex flex-col items-center pt-3 pb-5", children: [
-          /* @__PURE__ */ o("div", { className: "flex", style: { width: 165 }, children: [
+        /* @__PURE__ */ e("div", { className: `flex justify-end items-center px-5 pt-3 ${o ? "pb-1" : "pb-5"}`, children: /* @__PURE__ */ e(Qt, { onClick: () => Y("settings") }) }),
+        o ? /* @__PURE__ */ l("div", { className: "flex flex-col items-center pt-3 pb-5", children: [
+          /* @__PURE__ */ l("div", { className: "flex", style: { width: 165 }, children: [
             /* @__PURE__ */ e(
               "button",
               {
-                onClick: () => Ye("buy"),
+                onClick: () => Ve("buy"),
                 className: "flex-1 pb-2.5 text-[16px] font-medium text-center transition-colors duration-200",
-                style: { color: S === "buy" ? "var(--t-text)" : "var(--t-text-secondary)" },
+                style: { color: E === "buy" ? "var(--t-text)" : "var(--t-text-secondary)" },
                 children: "Buy"
               }
             ),
             /* @__PURE__ */ e(
               "button",
               {
-                onClick: () => Ye("sell"),
+                onClick: () => Ve("sell"),
                 className: "flex-1 pb-2.5 text-[16px] font-medium text-center transition-colors duration-200",
-                style: { color: S === "sell" ? "var(--t-text)" : "var(--t-text-secondary)" },
+                style: { color: E === "sell" ? "var(--t-text)" : "var(--t-text-secondary)" },
                 children: "Sell"
               }
             )
           ] }),
-          /* @__PURE__ */ o("div", { className: "relative", style: { width: 165, height: 1 }, children: [
+          /* @__PURE__ */ l("div", { className: "relative", style: { width: 165, height: 1 }, children: [
             /* @__PURE__ */ e("div", { className: "absolute inset-0", style: { background: "var(--t-divider)" } }),
             /* @__PURE__ */ e(
               "div",
@@ -2009,42 +2238,42 @@ function sa({
                 className: "absolute top-0 h-full transition-all duration-300 ease-in-out",
                 style: {
                   width: "50%",
-                  left: S === "buy" ? "0%" : "50%",
+                  left: E === "buy" ? "0%" : "50%",
                   background: "var(--t-accent)"
                 }
               }
             )
           ] })
         ] }) : null,
-        ae || be || O ? /* @__PURE__ */ e(Xt, {}) : /* @__PURE__ */ o("div", { className: "flex-1 overflow-hidden px-5 flex flex-col tab-fade-in", children: [
-          /* @__PURE__ */ o(
+        re || Ae || P ? /* @__PURE__ */ e(ia, {}) : /* @__PURE__ */ l("div", { className: "flex-1 overflow-hidden px-5 flex flex-col tab-fade-in", children: [
+          /* @__PURE__ */ l(
             "div",
             {
               className: "px-[18px] pt-[14px] pb-[18px]",
               style: {
                 background: "var(--t-surface)",
                 borderRadius: 5,
-                border: ye && We ? "1px solid #EF4444" : "1px solid transparent"
+                border: ye && Ye ? "1px solid #EF4444" : "1px solid transparent"
               },
               children: [
                 /* @__PURE__ */ e("div", { className: "text-[13px] mb-2.5", style: { color: "var(--t-text-secondary)" }, children: "You spend" }),
-                /* @__PURE__ */ o("div", { className: "flex items-center justify-between", children: [
+                /* @__PURE__ */ l("div", { className: "flex items-center justify-between", children: [
                   /* @__PURE__ */ e(
                     "input",
                     {
-                      ref: Ie,
+                      ref: Oe,
                       type: "text",
-                      value: _,
-                      onChange: vt,
-                      onBlur: () => ee(!0),
+                      value: H,
+                      onChange: Ct,
+                      onBlur: () => ae(!0),
                       placeholder: R ? "250" : "0.01",
                       className: "bg-transparent outline-none w-0 flex-1 mr-3",
                       style: { color: "var(--t-text)", fontSize: 24, fontWeight: 600, lineHeight: "32px" },
                       inputMode: "decimal",
-                      disabled: !!((ze = v == null ? void 0 : v.sourceAmount) != null && ze.locked)
+                      disabled: !!((qe = C == null ? void 0 : C.sourceAmount) != null && qe.locked)
                     }
                   ),
-                  R ? /* @__PURE__ */ o(
+                  R ? /* @__PURE__ */ l(
                     "button",
                     {
                       onClick: () => Y("fiat"),
@@ -2056,15 +2285,15 @@ function sa({
                         paddingLeft: 10,
                         paddingRight: 10
                       },
-                      disabled: !!((qe = v == null ? void 0 : v.sourceCurrency) != null && qe.locked),
+                      disabled: !!((et = C == null ? void 0 : C.sourceCurrency) != null && et.locked),
                       children: [
-                        /* @__PURE__ */ e(_e, { currencyCode: w, size: 16, baseUrl: D }),
-                        /* @__PURE__ */ e("span", { className: "text-[13px] font-medium", style: { color: "var(--t-text)" }, children: w }),
-                        /* @__PURE__ */ e(Te, {})
+                        /* @__PURE__ */ e(Xe, { currencyCode: T, size: 16, baseUrl: K }),
+                        /* @__PURE__ */ e("span", { className: "text-[13px] font-medium", style: { color: "var(--t-text)" }, children: T }),
+                        /* @__PURE__ */ e(ge, {})
                       ]
                     }
-                  ) : /* @__PURE__ */ o("div", { className: "flex flex-col items-end shrink-0", children: [
-                    /* @__PURE__ */ o(
+                  ) : /* @__PURE__ */ l("div", { className: "flex flex-col items-end shrink-0", children: [
+                    /* @__PURE__ */ l(
                       "button",
                       {
                         onClick: () => Y("crypto"),
@@ -2076,35 +2305,35 @@ function sa({
                           paddingLeft: 10,
                           paddingRight: 10
                         },
-                        disabled: !!((et = v == null ? void 0 : v.destinationCurrency) != null && et.locked),
+                        disabled: !!((tt = C == null ? void 0 : C.destinationCurrency) != null && tt.locked),
                         children: [
-                          /* @__PURE__ */ e(ut, { ticker: k, size: 16, baseUrl: D }),
+                          /* @__PURE__ */ e(mt, { ticker: k, size: 16, baseUrl: K }),
                           /* @__PURE__ */ e("span", { className: "text-[13px] font-medium", style: { color: "var(--t-text)" }, children: k }),
-                          /* @__PURE__ */ e(Te, {})
+                          /* @__PURE__ */ e(ge, {})
                         ]
                       }
                     ),
-                    Q && /* @__PURE__ */ o("div", { className: "flex items-center gap-1 mt-1.5 mr-0.5", children: [
+                    Z && /* @__PURE__ */ l("div", { className: "flex items-center gap-1 mt-1.5 mr-0.5", children: [
                       /* @__PURE__ */ e(
                         "img",
                         {
-                          src: Ke(Q, D),
-                          alt: Q,
+                          src: _e(Z, K),
+                          alt: Z,
                           width: 14,
                           height: 14,
                           className: "rounded-full",
                           style: { width: 14, height: 14 }
                         }
                       ),
-                      /* @__PURE__ */ e("span", { className: "text-[12px]", style: { color: "var(--t-text-muted)" }, children: Ze })
+                      /* @__PURE__ */ e("span", { className: "text-[12px]", style: { color: "var(--t-text-muted)" }, children: Je })
                     ] })
                   ] })
                 ] })
               ]
             }
           ),
-          ye && We && /* @__PURE__ */ e("div", { className: "text-[12px] mt-1.5 px-[2px]", style: { color: "#EF4444" }, children: P || ($e ? "Amount should be more than 0" : R ? `Minimum amount is ${it} ${w}` : `Minimum amount is ${dt} ${k}`) }),
-          /* @__PURE__ */ o(
+          ye && Ye && /* @__PURE__ */ e("div", { className: "text-[12px] mt-1.5 px-[2px]", style: { color: "#EF4444" }, children: O || (Ge ? "Amount should be more than 0" : R ? `Minimum amount is ${dt} ${T}` : `Minimum amount is ${ut} ${k}`) }),
+          /* @__PURE__ */ l(
             "div",
             {
               className: "px-[18px] pt-[12px] pb-[14px]",
@@ -2118,18 +2347,18 @@ function sa({
               },
               children: [
                 /* @__PURE__ */ e("div", { className: "text-[13px] mb-2.5", style: { color: "var(--t-text-secondary)" }, children: "You get" }),
-                /* @__PURE__ */ o("div", { className: "flex items-start justify-between", children: [
-                  G ? /* @__PURE__ */ e(B, { w: 180, h: 32 }) : /* @__PURE__ */ e(
-                    _t,
+                /* @__PURE__ */ l("div", { className: "flex items-start justify-between", children: [
+                  G ? /* @__PURE__ */ e(M, { w: 180, h: 32 }) : /* @__PURE__ */ e(
+                    ca,
                     {
-                      value: ne > 0 ? yt : "0",
+                      value: W > 0 ? gt : "0",
                       height: 32,
                       className: "font-semibold",
-                      style: { color: ne > 0 ? "var(--t-text)" : "var(--t-text-muted)", fontSize: 24 }
+                      style: { color: W > 0 ? "var(--t-text)" : "var(--t-text-muted)", fontSize: 24 }
                     }
                   ),
-                  R ? /* @__PURE__ */ o("div", { className: "flex flex-col items-end shrink-0", children: [
-                    /* @__PURE__ */ o(
+                  R ? /* @__PURE__ */ l("div", { className: "flex flex-col items-end shrink-0", children: [
+                    /* @__PURE__ */ l(
                       "button",
                       {
                         onClick: () => Y("crypto"),
@@ -2141,29 +2370,29 @@ function sa({
                           paddingLeft: 10,
                           paddingRight: 10
                         },
-                        disabled: !!((tt = v == null ? void 0 : v.destinationCurrency) != null && tt.locked),
+                        disabled: !!((at = C == null ? void 0 : C.destinationCurrency) != null && at.locked),
                         children: [
-                          /* @__PURE__ */ e(ut, { ticker: k, size: 16, baseUrl: D }),
+                          /* @__PURE__ */ e(mt, { ticker: k, size: 16, baseUrl: K }),
                           /* @__PURE__ */ e("span", { className: "text-[13px] font-medium", style: { color: "var(--t-text)" }, children: k }),
-                          /* @__PURE__ */ e(Te, {})
+                          /* @__PURE__ */ e(ge, {})
                         ]
                       }
                     ),
-                    Q && /* @__PURE__ */ o("div", { className: "flex items-center gap-1 mt-1.5 mr-0.5", children: [
+                    Z && /* @__PURE__ */ l("div", { className: "flex items-center gap-1 mt-1.5 mr-0.5", children: [
                       /* @__PURE__ */ e(
                         "img",
                         {
-                          src: Ke(Q, D),
-                          alt: Q,
+                          src: _e(Z, K),
+                          alt: Z,
                           width: 14,
                           height: 14,
                           className: "rounded-full",
                           style: { width: 14, height: 14 }
                         }
                       ),
-                      /* @__PURE__ */ e("span", { className: "text-[12px]", style: { color: "var(--t-text-muted)" }, children: Ze })
+                      /* @__PURE__ */ e("span", { className: "text-[12px]", style: { color: "var(--t-text-muted)" }, children: Je })
                     ] })
-                  ] }) : /* @__PURE__ */ o(
+                  ] }) : /* @__PURE__ */ l(
                     "button",
                     {
                       onClick: () => Y("fiat"),
@@ -2175,11 +2404,11 @@ function sa({
                         paddingLeft: 10,
                         paddingRight: 10
                       },
-                      disabled: !!((at = v == null ? void 0 : v.sourceCurrency) != null && at.locked),
+                      disabled: !!((nt = C == null ? void 0 : C.sourceCurrency) != null && nt.locked),
                       children: [
-                        /* @__PURE__ */ e(_e, { currencyCode: w, size: 16, baseUrl: D }),
-                        /* @__PURE__ */ e("span", { className: "text-[13px] font-medium", style: { color: "var(--t-text)" }, children: w }),
-                        /* @__PURE__ */ e(Te, {})
+                        /* @__PURE__ */ e(Xe, { currencyCode: T, size: 16, baseUrl: K }),
+                        /* @__PURE__ */ e("span", { className: "text-[13px] font-medium", style: { color: "var(--t-text)" }, children: T }),
+                        /* @__PURE__ */ e(ge, {})
                       ]
                     }
                   )
@@ -2191,100 +2420,112 @@ function sa({
             "div",
             {
               className: "flex items-center justify-between mt-[2px] px-[18px] pt-[12px] pb-[14px]",
-              style: { background: "var(--t-surface)" },
-              children: /* @__PURE__ */ e("span", { className: "text-[12px]", style: { color: "var(--t-text-secondary)" }, children: xt || " " })
+              style: {
+                background: "var(--t-surface)",
+                ...(rt = S == null ? void 0 : S.paymentMethods) != null && rt.length ? {} : { borderBottomLeftRadius: 5, borderBottomRightRadius: 5 }
+              },
+              children: /* @__PURE__ */ e("span", { className: "text-[12px]", style: { color: "var(--t-text-secondary)" }, children: vt || " " })
             }
           ),
-          /* @__PURE__ */ o("div", { className: "mt-8", children: [
+          (S == null ? void 0 : S.paymentMethods) && S.paymentMethods.length > 0 && /* @__PURE__ */ e("div", { className: "mt-[2px]", children: /* @__PURE__ */ e(
+            ea,
+            {
+              methods: S.paymentMethods,
+              selectedId: p.paymentMethodId,
+              onSelect: At,
+              fiatCurrency: p.fiatCurrency
+            }
+          ) }),
+          /* @__PURE__ */ l("div", { className: "mt-8", children: [
             /* @__PURE__ */ e("div", { className: "text-[13px] mb-2.5", style: { color: "var(--t-text-secondary)" }, children: "Wallet address" }),
             /* @__PURE__ */ e(
               "input",
               {
                 type: "text",
-                value: h.walletAddress,
+                value: p.walletAddress,
                 onChange: (y) => b({ type: "SET_WALLET_ADDRESS", address: y.target.value }),
-                onBlur: () => ce(!0),
+                onBlur: () => se(!0),
                 placeholder: "Enter your wallet address",
                 spellCheck: !1,
                 autoComplete: "off",
                 className: "w-full bg-transparent text-[13px] outline-none transition-colors",
                 style: {
-                  border: h.walletError || ve && !Be ? "1px solid #EF4444" : "1px solid var(--t-border)",
+                  border: p.walletError || Ce && !Pe ? "1px solid #EF4444" : "1px solid var(--t-border)",
                   borderRadius: 3.5,
                   height: 47,
                   paddingLeft: 14,
                   paddingRight: 14,
                   color: "var(--t-text)"
                 },
-                disabled: !!((nt = v == null ? void 0 : v.destinationAddress) != null && nt.locked)
+                disabled: !!((ot = C == null ? void 0 : C.destinationAddress) != null && ot.locked)
               }
             ),
-            h.walletError ? /* @__PURE__ */ e("div", { className: "text-[12px] mt-1.5", style: { color: "#EF4444" }, children: h.walletError }) : ve && !Be && !se ? /* @__PURE__ */ e("div", { className: "text-[12px] mt-1.5", style: { color: "#EF4444" }, children: "Enter a valid wallet address" }) : se && h.walletAddress.trim().length >= 10 ? /* @__PURE__ */ e("div", { className: "text-[12px] mt-1.5", style: { color: "var(--t-text-muted)" }, children: "Validating address..." }) : null
+            p.walletError ? /* @__PURE__ */ e("div", { className: "text-[12px] mt-1.5", style: { color: "#EF4444" }, children: p.walletError }) : Ce && !Pe && !ce ? /* @__PURE__ */ e("div", { className: "text-[12px] mt-1.5", style: { color: "#EF4444" }, children: "Enter a valid wallet address" }) : ce && p.walletAddress.trim().length >= 10 ? /* @__PURE__ */ e("div", { className: "text-[12px] mt-1.5", style: { color: "var(--t-text-muted)" }, children: "Validating address..." }) : null
           ] }),
           /* @__PURE__ */ e("div", { className: "flex-1" }),
           /* @__PURE__ */ e(
             "button",
             {
-              disabled: !Se || s || J,
-              onClick: bt,
+              disabled: !Te || c || q,
+              onClick: wt,
               className: "w-full font-semibold text-[16px] transition-all",
               style: {
                 height: 60,
                 borderRadius: 5,
                 background: "var(--t-cta-bg)",
                 color: "var(--t-cta-text)",
-                opacity: Se && !s && !J ? 1 : 0.4,
-                cursor: Se && !s && !J ? "pointer" : "not-allowed"
+                opacity: Te && !c && !q ? 1 : 0.4,
+                cursor: Te && !c && !q ? "pointer" : "not-allowed"
               },
-              children: J ? "Getting best price..." : s ? "Processing..." : R ? `Buy ${k}` : `Sell ${k}`
+              children: q ? "Getting best price..." : c ? "Processing..." : R ? `Buy ${k}` : `Sell ${k}`
             }
           ),
           /* @__PURE__ */ e("div", { className: "text-center py-3", children: /* @__PURE__ */ e("span", { className: "text-[11px]", style: { color: "var(--t-text-tertiary)" }, children: "Powered by NowRamp" }) })
-        ] }, S),
-        /* @__PURE__ */ e(De, { isOpen: fe === "fiat", onClose: () => Y(null), children: (y) => {
-          var E;
+        ] }, E),
+        /* @__PURE__ */ e(Le, { isOpen: fe === "fiat", onClose: () => Y(null), children: (y) => {
+          var A;
           return /* @__PURE__ */ e(
-            na,
+            da,
             {
               onClose: y,
-              onSelect: (T) => {
-                Nt(T), y();
+              onSelect: (I) => {
+                bt(I), y();
               },
-              currencies: (E = L == null ? void 0 : L.fiats) == null ? void 0 : E.map((T) => ({ code: T.code, name: T.code })),
-              assetBaseUrl: D
+              currencies: (A = S == null ? void 0 : S.fiats) == null ? void 0 : A.map((I) => ({ code: I.code, name: I.code })),
+              assetBaseUrl: K
             }
           );
         } }),
-        /* @__PURE__ */ e(De, { isOpen: fe === "crypto", onClose: () => Y(null), children: (y) => {
-          var E;
+        /* @__PURE__ */ e(Le, { isOpen: fe === "crypto", onClose: () => Y(null), children: (y) => {
+          var A;
           return /* @__PURE__ */ e(
-            ra,
+            ua,
             {
               onClose: y,
-              onSelect: (T, M) => {
-                Ct(T, M), y();
+              onSelect: (I, B) => {
+                Et(I, B), y();
               },
-              cryptos: (E = L == null ? void 0 : L.cryptos) == null ? void 0 : E.map((T) => {
-                var M;
+              cryptos: (A = S == null ? void 0 : S.cryptos) == null ? void 0 : A.map((I) => {
+                var B;
                 return {
-                  code: T.code,
-                  name: T.code,
-                  networks: (M = T.networks) == null ? void 0 : M.map((z) => ({ code: z.id, name: z.name }))
+                  code: I.code,
+                  name: I.code,
+                  networks: (B = I.networks) == null ? void 0 : B.map((ee) => ({ code: ee.id, name: ee.name }))
                 };
               }),
-              assetBaseUrl: D
+              assetBaseUrl: K
             }
           );
         } }),
-        /* @__PURE__ */ e(De, { isOpen: fe === "settings", onClose: () => Y(null), children: (y) => /* @__PURE__ */ e(
-          ca,
+        /* @__PURE__ */ e(Le, { isOpen: fe === "settings", onClose: () => Y(null), children: (y) => /* @__PURE__ */ e(
+          ha,
           {
             onClose: y,
-            darkMode: F,
-            onToggleDarkMode: K,
-            skinId: ge,
-            onSelectSkin: (E) => {
-              pe(E);
+            darkMode: X,
+            onToggleDarkMode: $,
+            skinId: Ne,
+            onSelectSkin: (A) => {
+              he(A);
             }
           }
         ) })
@@ -2292,108 +2533,108 @@ function sa({
     }
   );
 }
-function ia({
+function ya({
   projectId: t,
   apiUrl: a,
   assetBaseUrl: n,
-  flowType: l,
+  flowType: s,
   customerId: r,
-  defaultFiatCurrency: d,
-  defaultCryptoCurrency: u,
-  defaultNetwork: m,
-  defaultFiatAmount: c,
-  defaultCryptoAmount: i,
-  defaultWalletAddress: p,
+  defaultFiatCurrency: u,
+  defaultCryptoCurrency: m,
+  defaultNetwork: i,
+  defaultFiatAmount: o,
+  defaultCryptoAmount: d,
+  defaultWalletAddress: h,
   defaultGateway: f,
   fieldLocks: x,
   statusPollInterval: g,
-  onComplete: h,
+  onComplete: p,
   onError: b,
-  className: L,
-  theme: O,
-  skinId: A,
+  className: S,
+  theme: P,
+  skinId: w,
   accentColor: G,
-  bgColor: j,
-  bgImage: W,
-  borderColor: Z,
-  borderRadius: s,
-  showFlowToggle: P,
-  autoRedirect: v,
-  explorerUrl: I,
-  doneButtonText: D,
-  supportEmail: F,
-  onDone: K
+  bgColor: Q,
+  bgImage: j,
+  borderColor: z,
+  borderRadius: c,
+  showFlowToggle: O,
+  autoRedirect: C,
+  explorerUrl: L,
+  doneButtonText: K,
+  supportEmail: X,
+  onDone: $
 }) {
   return /* @__PURE__ */ e(
-    Mt,
+    Ht,
     {
       projectId: t,
       apiUrl: a,
       assetBaseUrl: n,
-      flowType: l,
+      flowType: s,
       customerId: r,
-      defaultFiatCurrency: d,
-      defaultCryptoCurrency: u,
-      defaultNetwork: m,
-      defaultFiatAmount: c,
-      defaultCryptoAmount: i,
-      defaultWalletAddress: p,
+      defaultFiatCurrency: u,
+      defaultCryptoCurrency: m,
+      defaultNetwork: i,
+      defaultFiatAmount: o,
+      defaultCryptoAmount: d,
+      defaultWalletAddress: h,
       defaultGateway: f,
       fieldLocks: x,
       statusPollInterval: g,
-      onComplete: h,
+      onComplete: p,
       onError: b,
       children: /* @__PURE__ */ e(
-        sa,
+        fa,
         {
-          className: L,
-          theme: O,
-          skinId: A,
+          className: S,
+          theme: P,
+          skinId: w,
           accentColor: G,
-          bgColor: j,
-          bgImage: W,
-          borderColor: Z,
-          borderRadius: s,
-          showFlowToggle: P,
-          autoRedirect: v,
-          explorerUrl: I,
-          doneButtonText: D,
-          supportEmail: F,
-          onDone: K
+          bgColor: Q,
+          bgImage: j,
+          borderColor: z,
+          borderRadius: c,
+          showFlowToggle: O,
+          autoRedirect: C,
+          explorerUrl: L,
+          doneButtonText: K,
+          supportEmail: X,
+          onDone: $
         }
       )
     }
   );
 }
-function Ca({
+function Ta({
   submitButtonText: t,
   rateRefreshInterval: a,
   ...n
 }) {
-  return /* @__PURE__ */ e(ia, { ...n });
+  return /* @__PURE__ */ e(ya, { ...n });
 }
-function ba({
+function Ra({
   skin: t,
   active: a,
   onClick: n,
-  darkMode: l,
+  darkMode: s,
   dimmed: r
 }) {
-  const d = t.accent === null, u = 32;
-  return /* @__PURE__ */ o(
+  const u = t.accent === null, m = 32;
+  return /* @__PURE__ */ l(
     "button",
     {
       onClick: n,
       className: "relative shrink-0",
-      style: { width: u, height: u, opacity: r ? 0.4 : 1, transition: "opacity 0.2s" },
+      style: { width: m, height: m, opacity: r ? 0.4 : 1, transition: "opacity 0.2s" },
       children: [
-        d ? /* @__PURE__ */ o("svg", { width: u, height: u, viewBox: "0 0 32 32", children: [
+        u ? /* @__PURE__ */ l("svg", { width: m, height: m, viewBox: "0 0 32 32", children: [
           /* @__PURE__ */ e("clipPath", { id: "mono-left", children: /* @__PURE__ */ e("rect", { x: "0", y: "0", width: "16", height: "32" }) }),
           /* @__PURE__ */ e("clipPath", { id: "mono-right", children: /* @__PURE__ */ e("rect", { x: "16", y: "0", width: "16", height: "32" }) }),
           /* @__PURE__ */ e("circle", { cx: "16", cy: "16", r: "15", fill: "#111111", clipPath: "url(#mono-left)" }),
           /* @__PURE__ */ e("circle", { cx: "16", cy: "16", r: "15", fill: "#ffffff", clipPath: "url(#mono-right)" }),
-          /* @__PURE__ */ e("circle", { cx: "16", cy: "16", r: "15", fill: "none", stroke: l ? "rgba(255,255,255,0.15)" : "rgba(0,0,0,0.1)", strokeWidth: "1" })
-        ] }) : /* @__PURE__ */ e("svg", { width: u, height: u, viewBox: "0 0 32 32", children: /* @__PURE__ */ e("circle", { cx: "16", cy: "16", r: "15", fill: t.accent }) }),
+          /* @__PURE__ */ e("circle", { cx: "16", cy: "16", r: "15", fill: "none", stroke: s ? "rgba(255,255,255,0.15)" : "rgba(0,0,0,0.1)", strokeWidth: "1" })
+        ] }) : /* @__PURE__ */ e("svg", { width: m, height: m, viewBox: "0 0 32 32", children: /* @__PURE__ */ e("circle", { cx: "16", cy: "16", r: "15", fill: t.accent }) }),
         a && !r && /* @__PURE__ */ e(
           "div",
           {
@@ -2405,13 +2646,13 @@ function ba({
     }
   );
 }
-function da({ quote: t }) {
-  return t.isBestRate ? /* @__PURE__ */ e("div", { className: "text-[12px]", style: { color: "var(--t-text-secondary)" }, children: "Best price" }) : t.isRecommended ? /* @__PURE__ */ e("div", { className: "text-[12px]", style: { color: "var(--t-text-secondary)" }, children: "Recommended" }) : t.rank && t.rank <= 3 ? /* @__PURE__ */ o("div", { className: "text-[12px]", style: { color: "var(--t-text-secondary)" }, children: [
+function xa({ quote: t }) {
+  return t.isBestRate ? /* @__PURE__ */ e("div", { className: "text-[12px]", style: { color: "var(--t-text-secondary)" }, children: "Best price" }) : t.isRecommended ? /* @__PURE__ */ e("div", { className: "text-[12px]", style: { color: "var(--t-text-secondary)" }, children: "Recommended" }) : t.rank && t.rank <= 3 ? /* @__PURE__ */ l("div", { className: "text-[12px]", style: { color: "var(--t-text-secondary)" }, children: [
     "#",
     t.rank
   ] }) : null;
 }
-function ua({ quote: t }) {
+function ga({ quote: t }) {
   return t.gatewayLogo ? /* @__PURE__ */ e(
     "img",
     {
@@ -2422,10 +2663,10 @@ function ua({ quote: t }) {
       className: "rounded-full shrink-0",
       style: { width: 36, height: 36 }
     }
-  ) : /* @__PURE__ */ e(ft, { size: 36 });
+  ) : /* @__PURE__ */ e($e, { size: 36 });
 }
-function ma() {
-  return /* @__PURE__ */ e("div", { className: "space-y-2", children: [0, 1, 2].map((t) => /* @__PURE__ */ o(
+function va() {
+  return /* @__PURE__ */ e("div", { className: "space-y-2", children: [0, 1, 2].map((t) => /* @__PURE__ */ l(
     "div",
     {
       className: "w-full flex items-center gap-3.5",
@@ -2437,34 +2678,34 @@ function ma() {
         background: "var(--t-surface)"
       },
       children: [
-        /* @__PURE__ */ e(B, { w: 36, h: 36, className: "rounded-full shrink-0" }),
-        /* @__PURE__ */ o("div", { className: "flex-1", children: [
-          /* @__PURE__ */ e(B, { w: 90, h: 14, className: "mb-1.5" }),
-          /* @__PURE__ */ e(B, { w: 60, h: 12 })
+        /* @__PURE__ */ e(M, { w: 36, h: 36, className: "rounded-full shrink-0" }),
+        /* @__PURE__ */ l("div", { className: "flex-1", children: [
+          /* @__PURE__ */ e(M, { w: 90, h: 14, className: "mb-1.5" }),
+          /* @__PURE__ */ e(M, { w: 60, h: 12 })
         ] }),
-        /* @__PURE__ */ o("div", { className: "text-right", children: [
-          /* @__PURE__ */ e(B, { w: 40, h: 10, className: "mb-1.5" }),
-          /* @__PURE__ */ e(B, { w: 80, h: 14 })
+        /* @__PURE__ */ l("div", { className: "text-right", children: [
+          /* @__PURE__ */ e(M, { w: 40, h: 10, className: "mb-1.5" }),
+          /* @__PURE__ */ e(M, { w: 80, h: 14 })
         ] })
       ]
     },
     t
   )) });
 }
-function Ea({
+function ka({
   onClose: t,
   onSelect: a,
   quotes: n,
-  quotesLoading: l,
+  quotesLoading: s,
   cryptoCurrency: r
 }) {
-  const [d, u] = C(""), m = X(() => {
+  const [u, m] = N(""), i = F(() => {
     if (!(n != null && n.quotes)) return [];
-    const c = d.trim().toLowerCase();
-    return c ? n.quotes.filter((i) => i.gatewayName.toLowerCase().includes(c)) : n.quotes;
-  }, [n, d]);
-  return /* @__PURE__ */ o(le, { children: [
-    /* @__PURE__ */ e("div", { className: "flex justify-end px-5 pt-5", children: /* @__PURE__ */ e(Le, { onClick: t }) }),
+    const o = u.trim().toLowerCase();
+    return o ? n.quotes.filter((d) => d.gatewayName.toLowerCase().includes(o)) : n.quotes;
+  }, [n, u]);
+  return /* @__PURE__ */ l(J, { children: [
+    /* @__PURE__ */ e("div", { className: "flex justify-end px-5 pt-5", children: /* @__PURE__ */ e(ve, { onClick: t }) }),
     /* @__PURE__ */ e(
       "h2",
       {
@@ -2473,32 +2714,32 @@ function Ea({
         children: "Choose Ramp"
       }
     ),
-    /* @__PURE__ */ e(Xe, { value: d, onChange: u }),
-    /* @__PURE__ */ o("div", { className: "flex-1 overflow-y-auto custom-scroll px-5 space-y-2", children: [
-      l ? /* @__PURE__ */ e(ma, {}) : m.length === 0 ? /* @__PURE__ */ e("div", { className: "text-center py-10 text-[14px]", style: { color: "var(--t-text-muted)" }, children: n && n.quotes.length === 0 ? "No quotes available for this request" : "No providers found" }) : m.map((c, i) => {
-        const p = i === 0, f = parseFloat(c.cryptoAmount), x = f >= 1 ? f.toFixed(4) : f.toPrecision(6);
-        return /* @__PURE__ */ o(
+    /* @__PURE__ */ e(Be, { value: u, onChange: m }),
+    /* @__PURE__ */ l("div", { className: "flex-1 overflow-y-auto custom-scroll px-5 space-y-2", children: [
+      s ? /* @__PURE__ */ e(va, {}) : i.length === 0 ? /* @__PURE__ */ e("div", { className: "text-center py-10 text-[14px]", style: { color: "var(--t-text-muted)" }, children: n && n.quotes.length === 0 ? "No quotes available for this request" : "No providers found" }) : i.map((o, d) => {
+        const h = d === 0, f = parseFloat(o.cryptoAmount), x = f >= 1 ? f.toFixed(4) : f.toPrecision(6);
+        return /* @__PURE__ */ l(
           "button",
           {
-            onClick: () => a(c),
+            onClick: () => a(o),
             className: "w-full flex items-center gap-3.5 transition-colors",
             style: {
-              borderRadius: p ? 4.5 : 5,
-              height: p ? 63 : 64,
+              borderRadius: h ? 4.5 : 5,
+              height: h ? 63 : 64,
               paddingLeft: 16,
               paddingRight: 16,
-              border: p ? "1px solid var(--t-border)" : "1px solid transparent",
-              background: p ? "transparent" : "var(--t-surface)"
+              border: h ? "1px solid var(--t-border)" : "1px solid transparent",
+              background: h ? "transparent" : "var(--t-surface)"
             },
             children: [
-              /* @__PURE__ */ e(ua, { quote: c }),
-              /* @__PURE__ */ o("div", { className: "text-left flex-1 min-w-0", children: [
-                /* @__PURE__ */ e("div", { className: "font-medium text-[15px]", style: { color: "var(--t-text)" }, children: c.gatewayName }),
-                /* @__PURE__ */ e(da, { quote: c })
+              /* @__PURE__ */ e(ga, { quote: o }),
+              /* @__PURE__ */ l("div", { className: "text-left flex-1 min-w-0", children: [
+                /* @__PURE__ */ e("div", { className: "font-medium text-[15px]", style: { color: "var(--t-text)" }, children: o.gatewayName }),
+                /* @__PURE__ */ e(xa, { quote: o })
               ] }),
-              /* @__PURE__ */ o("div", { className: "text-right shrink-0", children: [
+              /* @__PURE__ */ l("div", { className: "text-right shrink-0", children: [
                 /* @__PURE__ */ e("div", { className: "text-[11px]", style: { color: "var(--t-text-secondary)" }, children: "You get" }),
-                /* @__PURE__ */ o("div", { className: "font-medium text-[14px]", style: { color: "var(--t-text)" }, children: [
+                /* @__PURE__ */ l("div", { className: "font-medium text-[14px]", style: { color: "var(--t-text)" }, children: [
                   r,
                   " ",
                   x
@@ -2506,78 +2747,79 @@ function Ea({
               ] })
             ]
           },
-          c.gatewayId
+          o.gatewayId
         );
       }),
-      !l && (n == null ? void 0 : n.unavailableGateways) && n.unavailableGateways.length > 0 && /* @__PURE__ */ e("div", { className: "pt-3", children: n.unavailableGateways.map((c) => /* @__PURE__ */ o(
+      !s && (n == null ? void 0 : n.unavailableGateways) && n.unavailableGateways.length > 0 && /* @__PURE__ */ e("div", { className: "pt-3", children: n.unavailableGateways.map((o) => /* @__PURE__ */ l(
         "div",
         {
           className: "flex items-center justify-between py-2 text-[12px]",
           style: { color: "var(--t-text-muted)" },
           children: [
-            /* @__PURE__ */ e("span", { children: c.gatewayName }),
-            /* @__PURE__ */ e("span", { children: c.reason })
+            /* @__PURE__ */ e("span", { children: o.gatewayName }),
+            /* @__PURE__ */ e("span", { children: o.reason })
           ]
         },
-        c.gatewayId
+        o.gatewayId
       )) })
     ] })
   ] });
 }
 export {
-  Kt as AnimatedDigit,
-  _t as AnimatedNumber,
-  Zt as ApplePayIcon,
-  Re as BLOCKCHAINS,
-  jt as BankIcon,
-  Vt as CRYPTO_CHAIN_COMBOS,
-  $t as CRYPTO_CURRENCIES,
-  qt as CardIcon,
-  Ca as CheckoutForm,
-  Ot as CheckoutStep,
-  Te as ChevronDown,
-  ea as ChevronRight,
-  Ea as ChooseRampModal,
-  Le as CloseButton,
-  va as CoinifyIcon,
-  Ut as CompleteStep,
-  Ft as ConfirmStep,
-  ra as CryptoCurrencyModal,
-  ut as CryptoIcon,
-  aa as DarkModeIcon,
-  Dt as ErrorStep,
-  lt as FIAT_CURRENCIES,
-  Gt as FIAT_TO_COUNTRY,
-  na as FiatCurrencyModal,
-  _e as FiatFlag,
-  Xt as FormSkeleton,
-  ft as GenericCoinIcon,
-  Jt as GooglePayIcon,
-  st as MOCK_RATES,
-  ta as MenuIcon,
-  De as Modal,
-  zt as PayPalIcon,
-  Ht as ProcessingStep,
-  ia as RampForm,
-  Mt as RampProvider,
-  Qt as RevolutIcon,
+  sa as AnimatedDigit,
+  ca as AnimatedNumber,
+  Gt as ApplePayIcon,
+  Ie as BLOCKCHAINS,
+  Xt as BankIcon,
+  _t as CRYPTO_CHAIN_COMBOS,
+  Ut as CRYPTO_CURRENCIES,
+  Vt as CardIcon,
+  Ta as CheckoutForm,
+  ta as CheckoutStep,
+  ge as ChevronDown,
+  Wt as ChevronRight,
+  ka as ChooseRampModal,
+  ve as CloseButton,
+  Sa as CoinifyIcon,
+  ra as CompleteStep,
+  la as ConfirmStep,
+  ua as CryptoCurrencyModal,
+  mt as CryptoIcon,
+  Zt as DarkModeIcon,
+  oa as ErrorStep,
+  st as FIAT_CURRENCIES,
+  Dt as FIAT_TO_COUNTRY,
+  da as FiatCurrencyModal,
+  Xe as FiatFlag,
+  ia as FormSkeleton,
+  $e as GenericCoinIcon,
+  jt as GooglePayIcon,
+  it as MOCK_RATES,
+  Qt as MenuIcon,
+  Le as Modal,
+  Yt as PayPalIcon,
+  ea as PaymentMethodSelector,
+  na as ProcessingStep,
+  ya as RampForm,
+  Ht as RampProvider,
+  $t as RevolutIcon,
   ct as SKINS,
-  Xe as SearchInput,
-  ca as SettingsScreen,
-  B as Skeleton,
-  ba as SkinSwatch,
-  oa as ToggleSwitch,
-  ga as formatOutput,
-  Ke as getChainIconUrl,
-  pt as getCryptoIconUrl,
-  Wt as getFiatFlagUrl,
-  xa as getMockRate,
-  Na as getPaymentIcon,
-  Yt as parseAmount,
-  Lt as useCheckoutIntent,
-  kt as useQuotes,
-  he as useRamp,
-  Rt as useRampConfig,
-  It as useTransaction
+  Be as SearchInput,
+  ha as SettingsScreen,
+  M as Skeleton,
+  Ra as SkinSwatch,
+  ma as ToggleSwitch,
+  wa as formatOutput,
+  _e as getChainIconUrl,
+  yt as getCryptoIconUrl,
+  Ft as getFiatFlagUrl,
+  Aa as getMockRate,
+  Jt as getPaymentIcon,
+  Kt as parseAmount,
+  Bt as useCheckoutIntent,
+  Mt as useQuotes,
+  pe as useRamp,
+  It as useRampConfig,
+  Ot as useTransaction
 };
 //# sourceMappingURL=index.js.map