@retinalabsllc/zairusjs 11.0.5 → 11.0.15

package/dist/index.d.mts

@@ -265,6 +265,8 @@ interface UniversalWallet {
     network: string;
     address: string;
     logoSrc: string;
+    networkLogoSrc?: string;
+    isActive?: boolean;
 }
 interface UniversalWalletPageProps {
     headerTitle: string;
@@ -278,6 +280,12 @@ interface UniversalWalletPageProps {
     renderQrCode?: (wallet: UniversalWallet) => React.ReactNode;
     onDownloadPayId?: (wallet: UniversalWallet) => void;
     onCopyAddress?: (wallet: UniversalWallet) => void;
+    onGeneratePhrase?: () => string;
+    onValidatePhrase?: (phrase: string) => boolean;
+    onSaveLocally?: (phrase: string, password: string) => Promise<{
+        success: boolean;
+        address?: string;
+    }>;
 }
 declare const UniversalWalletPage: React.FC<UniversalWalletPageProps>;
 

package/dist/index.d.ts

@@ -265,6 +265,8 @@ interface UniversalWallet {
     network: string;
     address: string;
     logoSrc: string;
+    networkLogoSrc?: string;
+    isActive?: boolean;
 }
 interface UniversalWalletPageProps {
     headerTitle: string;
@@ -278,6 +280,12 @@ interface UniversalWalletPageProps {
     renderQrCode?: (wallet: UniversalWallet) => React.ReactNode;
     onDownloadPayId?: (wallet: UniversalWallet) => void;
     onCopyAddress?: (wallet: UniversalWallet) => void;
+    onGeneratePhrase?: () => string;
+    onValidatePhrase?: (phrase: string) => boolean;
+    onSaveLocally?: (phrase: string, password: string) => Promise<{
+        success: boolean;
+        address?: string;
+    }>;
 }
 declare const UniversalWalletPage: React.FC<UniversalWalletPageProps>;
 

package/dist/index.js

@@ -536,7 +536,7 @@ function AuthFormInner({
     if (mode === "SIGNUP" && signupStep === "NAME") handleNextSignupStep();
     else if (mode === "SIGNUP" && signupStep === "ORGANIZATION") handleNextSignupStep();
     else handleAuthRequestSubmit();
-  } }, mode === "SIGNUP" && signupStep === "NAME" && requireNames && /* @__PURE__ */ import_react6.default.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ import_react6.default.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "First Name"), /* @__PURE__ */ import_react6.default.createElement("input", { type: "text", value: firstName, onChange: (e) => setFirstName(cleanAlpha(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-100 text-black outline-none focus:border-black transition-all duration-300", placeholder: "First name" })), /* @__PURE__ */ import_react6.default.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ import_react6.default.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "Last Name"), /* @__PURE__ */ import_react6.default.createElement("input", { type: "text", value: lastName, onChange: (e) => setLastName(cleanAlpha(e.target.value)), required: true, className: "w-full px-2 py-3 bg-transparent text-sm border-b border-neutral-100 text-black outline-none focus:border-black transition-all duration-300", placeholder: "Last name" }))), mode === "SIGNUP" && signupStep === "ORGANIZATION" && requireOrganization && /* @__PURE__ */ import_react6.default.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "space-y-1.5 relative" }, /* @__PURE__ */ import_react6.default.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "Organization Name"), /* @__PURE__ */ import_react6.default.createElement("input", { type: "text", value: orgName, onChange: (e) => setOrgName(cleanOrgName(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-100 text-black outline-none focus:border-black transition-all duration-300", placeholder: "Acme Corporation" }))), (mode === "LOGIN" || mode === "SIGNUP" && signupStep === "EMAIL_ID") && /* @__PURE__ */ import_react6.default.createElement("div", { className: "space-y-6" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ import_react6.default.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "Email ID"), /* @__PURE__ */ import_react6.default.createElement("input", { type: "email", value: emailId, onChange: (e) => setEmailId(cleanEmailId(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 bg-transparent text-sm border-b border-neutral-100 text-black outline-none focus:border-black transition-all duration-300", placeholder: "name@company.com" })), mode === "SIGNUP" && /* @__PURE__ */ import_react6.default.createElement("div", { className: "flex items-start gap-3 mt-4" }, /* @__PURE__ */ import_react6.default.createElement("input", { type: "checkbox", id: "zairus-terms", checked: agreedToTerms, onChange: (e) => setAgreedToTerms(e.target.checked), className: "mt-0.5 w-4 h-4 bg-white border-neutral-300 rounded text-black focus:ring-black cursor-pointer", required: true }), /* @__PURE__ */ import_react6.default.createElement("label", { htmlFor: "zairus-terms", className: "text-[11px] text-neutral-500 cursor-pointer leading-snug" }, "I agree to ", companyName, "'s ", /* @__PURE__ */ import_react6.default.createElement("a", { href: termsUrl, target: "_blank", rel: "noreferrer", className: "text-black underline " }, "Terms of Service"), " and ", /* @__PURE__ */ import_react6.default.createElement("a", { href: privacyUrl, target: "_blank", rel: "noreferrer", className: "text-black underline " }, "Privacy Policy"), "."))), /* @__PURE__ */ import_react6.default.createElement(ThreeDActionButton, { type: "submit", disabled: isContinueDisabled(), isLoading: isSubmitting, className: "w-full mt-10" }, "Continue"))), step === "OTP" && /* @__PURE__ */ import_react6.default.createElement("div", { className: "animate-in fade-in duration-300" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "text-center mb-10 mt-2" }, /* @__PURE__ */ import_react6.default.createElement("h2", { className: "text-xl text-black mb-2 tracking-tight" }, "Security Check"), /* @__PURE__ */ import_react6.default.createElement("p", { className: "text-[13px] text-neutral-500" }, userHas2FA ? "Enter the code from your authenticator app." : `Enter the code sent to ${emailId}`)), /* @__PURE__ */ import_react6.default.createElement("form", { className: "space-y-8", autoComplete: "off", onSubmit: (e) => {
+  } }, mode === "SIGNUP" && signupStep === "NAME" && requireNames && /* @__PURE__ */ import_react6.default.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ import_react6.default.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "First Name"), /* @__PURE__ */ import_react6.default.createElement("input", { type: "text", value: firstName, onChange: (e) => setFirstName(cleanAlpha(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300", placeholder: "First name" })), /* @__PURE__ */ import_react6.default.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ import_react6.default.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "Last Name"), /* @__PURE__ */ import_react6.default.createElement("input", { type: "text", value: lastName, onChange: (e) => setLastName(cleanAlpha(e.target.value)), required: true, className: "w-full px-2 py-3 bg-transparent text-sm border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300", placeholder: "Last name" }))), mode === "SIGNUP" && signupStep === "ORGANIZATION" && requireOrganization && /* @__PURE__ */ import_react6.default.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "space-y-1.5 relative" }, /* @__PURE__ */ import_react6.default.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "Organization Name"), /* @__PURE__ */ import_react6.default.createElement("input", { type: "text", value: orgName, onChange: (e) => setOrgName(cleanOrgName(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300", placeholder: "Acme Corporation" }))), (mode === "LOGIN" || mode === "SIGNUP" && signupStep === "EMAIL_ID") && /* @__PURE__ */ import_react6.default.createElement("div", { className: "space-y-6" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ import_react6.default.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "Email ID"), /* @__PURE__ */ import_react6.default.createElement("input", { type: "email", value: emailId, onChange: (e) => setEmailId(cleanEmailId(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 bg-transparent text-sm border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300", placeholder: "name@company.com" })), mode === "SIGNUP" && /* @__PURE__ */ import_react6.default.createElement("div", { className: "flex items-start gap-3 mt-4" }, /* @__PURE__ */ import_react6.default.createElement("input", { type: "checkbox", id: "zairus-terms", checked: agreedToTerms, onChange: (e) => setAgreedToTerms(e.target.checked), className: "mt-0.5 w-4 h-4 bg-white border-neutral-300 rounded text-black focus:ring-black cursor-pointer", required: true }), /* @__PURE__ */ import_react6.default.createElement("label", { htmlFor: "zairus-terms", className: "text-[11px] text-neutral-500 cursor-pointer leading-snug" }, "I agree to ", companyName, "'s ", /* @__PURE__ */ import_react6.default.createElement("a", { href: termsUrl, target: "_blank", rel: "noreferrer", className: "text-black underline " }, "Terms of Service"), " and ", /* @__PURE__ */ import_react6.default.createElement("a", { href: privacyUrl, target: "_blank", rel: "noreferrer", className: "text-black underline " }, "Privacy Policy"), "."))), /* @__PURE__ */ import_react6.default.createElement(ThreeDActionButton, { type: "submit", disabled: isContinueDisabled(), isLoading: isSubmitting, className: "w-full mt-10" }, "Continue"))), step === "OTP" && /* @__PURE__ */ import_react6.default.createElement("div", { className: "animate-in fade-in duration-300" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "text-center mb-10 mt-2" }, /* @__PURE__ */ import_react6.default.createElement("h2", { className: "text-xl text-black mb-2 tracking-tight" }, "Security Check"), /* @__PURE__ */ import_react6.default.createElement("p", { className: "text-[13px] text-neutral-500" }, userHas2FA ? "Enter the code from your authenticator app." : `Enter the code sent to ${emailId}`)), /* @__PURE__ */ import_react6.default.createElement("form", { className: "space-y-8", autoComplete: "off", onSubmit: (e) => {
     e.preventDefault();
     verifyOtpCode(otp.join(""));
   } }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "flex justify-between gap-2", onPaste: handlePaste }, otp.map((digit, index) => /* @__PURE__ */ import_react6.default.createElement(
@@ -554,7 +554,7 @@ function AuthFormInner({
       onKeyDown: (e) => {
         if (e.key === "Backspace" && !otp[index] && index > 0) inputRefs.current[index - 1]?.focus();
       },
-      className: "w-10 h-12 text-center text-lg bg-transparent border-b-2 border-neutral-100 text-black outline-none focus:border-black transition-all duration-300"
+      className: "w-10 h-12 text-center text-lg bg-transparent border-b-2 border-neutral-200 text-black outline-none focus:border-black transition-all duration-300"
     }
   ))), /* @__PURE__ */ import_react6.default.createElement(ThreeDActionButton, { type: "submit", disabled: otp.join("").length < 6, isLoading: isSubmitting, className: "w-full" }, "Verify Code")), userHasPasskey && /* @__PURE__ */ import_react6.default.createElement("div", { className: "pt-6 " }, /* @__PURE__ */ import_react6.default.createElement(
     "button",
@@ -588,9 +588,9 @@ var Footer = ({
   const toggleColumn = (idx) => {
     setOpenCol(openCol === idx ? null : idx);
   };
-  return /* @__PURE__ */ import_react7.default.createElement("div", { className: "" }, topSection && topSection, /* @__PURE__ */ import_react7.default.createElement("footer", { className: "relative px-6 overflow-hidden flex flex-col" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "relative w-full max-w-7xl mx-auto z-20 flex flex-col" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "relative py-12 md:py-16" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start gap-12 lg:gap-16 mb-12 text-left" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "w-full lg:max-w-sm flex flex-col items-start justify-between shrink-0" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "flex items-center gap-4 mb-4" }, /* @__PURE__ */ import_react7.default.createElement("img", { src: "https://retinalabs.company/assets/images/ndpr.avif", alt: "NDPR", className: "w-28 h-auto object-contain filter grayscale opacity-80" }), /* @__PURE__ */ import_react7.default.createElement("img", { src: "https://retinalabs.company/assets/images/gdpr.avif", alt: "GDPR", className: "w-12 h-12 object-contain filter grayscale opacity-80" })), /* @__PURE__ */ import_react7.default.createElement("div", null, /* @__PURE__ */ import_react7.default.createElement("p", { className: "text-[11px]  text-neutral-600 leading-relaxed pr-4" }, description))), /* @__PURE__ */ import_react7.default.createElement("div", { className: "w-full lg:flex-1 lg:max-w-2xl" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "hidden md:grid grid-cols-2 gap-x-16 lg:gap-x-24 gap-y-12" }, columns.map((col, idx) => /* @__PURE__ */ import_react7.default.createElement("div", { key: idx, className: "flex flex-col" }, /* @__PURE__ */ import_react7.default.createElement("h4", { className: "text-[11px] tracking-[0.2em] text-black mb-6 " }, col.title), /* @__PURE__ */ import_react7.default.createElement("ul", { className: "space-y-4 text-[13px] text-neutral-500" }, col.links.map((link, lIdx) => /* @__PURE__ */ import_react7.default.createElement("li", { key: lIdx }, link.isExternal ? /* @__PURE__ */ import_react7.default.createElement("a", { href: link.href, target: "_blank", rel: "noopener noreferrer", className: "hover:text-black transition-colors block truncate" }, link.label) : /* @__PURE__ */ import_react7.default.createElement(import_link3.default, { href: link.href, className: "hover:text-black transition-colors block truncate" }, link.label))))))), /* @__PURE__ */ import_react7.default.createElement("div", { className: "flex flex-col md:hidden w-full border-t border-neutral-100 mt-4" }, columns.map((col, idx) => {
+  return /* @__PURE__ */ import_react7.default.createElement("div", { className: "" }, topSection && topSection, /* @__PURE__ */ import_react7.default.createElement("footer", { className: "relative px-6 overflow-hidden flex flex-col" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "relative w-full max-w-7xl mx-auto z-20 flex flex-col" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "relative py-12 md:py-16" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start gap-12 lg:gap-16 mb-12 text-left" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "w-full lg:max-w-sm flex flex-col items-start justify-between shrink-0" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "flex items-center gap-4 mb-4" }, /* @__PURE__ */ import_react7.default.createElement("img", { src: "https://retinalabs.company/assets/images/ndpr.avif", alt: "NDPR", className: "w-28 h-auto object-contain filter grayscale opacity-80" }), /* @__PURE__ */ import_react7.default.createElement("img", { src: "https://retinalabs.company/assets/images/gdpr.avif", alt: "GDPR", className: "w-12 h-12 object-contain filter grayscale opacity-80" })), /* @__PURE__ */ import_react7.default.createElement("div", null, /* @__PURE__ */ import_react7.default.createElement("p", { className: "text-[11px]  text-neutral-600 leading-relaxed pr-4" }, description))), /* @__PURE__ */ import_react7.default.createElement("div", { className: "w-full lg:flex-1 lg:max-w-2xl" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "hidden md:grid grid-cols-2 gap-x-16 lg:gap-x-24 gap-y-12" }, columns.map((col, idx) => /* @__PURE__ */ import_react7.default.createElement("div", { key: idx, className: "flex flex-col" }, /* @__PURE__ */ import_react7.default.createElement("h4", { className: "text-[11px] tracking-[0.2em] text-black mb-6 " }, col.title), /* @__PURE__ */ import_react7.default.createElement("ul", { className: "space-y-4 text-[13px] text-neutral-500" }, col.links.map((link, lIdx) => /* @__PURE__ */ import_react7.default.createElement("li", { key: lIdx }, link.isExternal ? /* @__PURE__ */ import_react7.default.createElement("a", { href: link.href, target: "_blank", rel: "noopener noreferrer", className: "hover:text-black transition-colors block truncate" }, link.label) : /* @__PURE__ */ import_react7.default.createElement(import_link3.default, { href: link.href, className: "hover:text-black transition-colors block truncate" }, link.label))))))), /* @__PURE__ */ import_react7.default.createElement("div", { className: "flex flex-col md:hidden w-full border-t border-neutral-200 mt-4" }, columns.map((col, idx) => {
     const isOpen = openCol === idx;
-    return /* @__PURE__ */ import_react7.default.createElement("div", { key: idx, className: "border-b border-neutral-100" }, /* @__PURE__ */ import_react7.default.createElement(
+    return /* @__PURE__ */ import_react7.default.createElement("div", { key: idx, className: "border-b border-neutral-200" }, /* @__PURE__ */ import_react7.default.createElement(
       "button",
       {
         onClick: () => toggleColumn(idx),
@@ -695,7 +695,7 @@ var ManagedToaster = () => {
   );
 };
 
-// src/components/ReusableInputs.tsx
+// src/components/TextInput.tsx
 var import_react12 = __toESM(require("react"));
 var TextInput = ({
   label,
@@ -718,7 +718,7 @@ var TextInput = ({
     readOnly,
     autoComplete: "off",
     spellCheck: "false",
-    className: `w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-100 text-black transition-all outline-none focus:border-black disabled:opacity-50 ${readOnly ? "cursor-pointer" : ""}`
+    className: `w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-200 text-black transition-all outline-none focus:border-black disabled:opacity-50 ${readOnly ? "cursor-pointer" : ""}`
   }
 ));
 var NumberInput = ({
@@ -741,7 +741,7 @@ var NumberInput = ({
     disabled,
     autoComplete: "off",
     spellCheck: "false",
-    className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-100 text-black transition-all outline-none focus:border-black disabled:opacity-50"
+    className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-200 text-black transition-all outline-none focus:border-black disabled:opacity-50"
   }
 ));
 
@@ -925,7 +925,7 @@ var UniversalOrganizationPage = ({
       placeholder: "sovereignuser",
       maxLength: 30
     }
-  ), /* @__PURE__ */ import_react15.default.createElement("div", { className: "space-y-1.5 relative w-full" }, /* @__PURE__ */ import_react15.default.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block" }, "Wallet Username"), /* @__PURE__ */ import_react15.default.createElement("div", { className: "flex items-center relative w-full border-b border-neutral-100 focus-within:border-black transition-all duration-300" }, /* @__PURE__ */ import_react15.default.createElement(
+  ), /* @__PURE__ */ import_react15.default.createElement("div", { className: "space-y-1.5 relative w-full" }, /* @__PURE__ */ import_react15.default.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block" }, "Wallet Username"), /* @__PURE__ */ import_react15.default.createElement("div", { className: "flex items-center relative w-full border-b border-neutral-200 focus-within:border-black transition-all duration-300" }, /* @__PURE__ */ import_react15.default.createElement(
     "input",
     {
       type: "text",
@@ -1571,15 +1571,7 @@ var truncateAddress2 = (ref) => {
 };
 var WalletLogo = ({ src, alt, sizeClass = "w-10 h-10" }) => {
   const [isLoaded, setIsLoaded] = (0, import_react27.useState)(false);
-  return /* @__PURE__ */ import_react27.default.createElement("div", { className: `relative shrink-0 rounded-full bg-neutral-100 flex items-center justify-center overflow-hidden  ${sizeClass}` }, !isLoaded && /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.Loading03Icon, size: 16, className: "animate-spin text-neutral-400 absolute" }), /* @__PURE__ */ import_react27.default.createElement(
-    "img",
-    {
-      src,
-      alt,
-      onLoad: () => setIsLoaded(true),
-      className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}`
-    }
-  ));
+  return /* @__PURE__ */ import_react27.default.createElement("div", { className: `relative shrink-0 rounded-full bg-neutral-100 flex items-center justify-center overflow-hidden  ${sizeClass}` }, !isLoaded && /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.Loading03Icon, size: 16, className: "animate-spin text-neutral-400 absolute" }), /* @__PURE__ */ import_react27.default.createElement("img", { src, alt, onLoad: () => setIsLoaded(true), className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}` }));
 };
 var UniversalWalletPage = ({
   headerTitle,
@@ -1592,74 +1584,156 @@ var UniversalWalletPage = ({
   renderQrCode,
   onDownloadPayId,
   onCopyAddress,
-  onBack
+  onBack,
+  onGeneratePhrase,
+  onValidatePhrase,
+  onSaveLocally
 }) => {
   const onBackHandler = onBack ?? (() => {
     if (typeof window !== "undefined") window.history.back();
   });
   const [selectedWallet, setSelectedWallet] = (0, import_react27.useState)(null);
   const [localSearchQuery, setLocalSearchQuery] = (0, import_react27.useState)("");
+  const [addModalOpen, setAddModalOpen] = (0, import_react27.useState)(false);
+  const [importModalOpen, setImportModalOpen] = (0, import_react27.useState)(false);
+  const [flowStep, setFlowStep] = (0, import_react27.useState)(1);
+  const [generatedPhrase, setGeneratedPhrase] = (0, import_react27.useState)("");
+  const [hasBackedUp, setHasBackedUp] = (0, import_react27.useState)(false);
+  const [verifyWords, setVerifyWords] = (0, import_react27.useState)([]);
+  const [walletPassword, setWalletPassword] = (0, import_react27.useState)("");
+  const [importPhraseInput, setImportPhraseInput] = (0, import_react27.useState)("");
+  const [isProcessing, setIsProcessing] = (0, import_react27.useState)(false);
   const filteredWallets = wallets.filter((wallet) => {
     const q = localSearchQuery.toLowerCase();
     return wallet.name.toLowerCase().includes(q) || wallet.currency.toLowerCase().includes(q) || wallet.network.toLowerCase().includes(q);
   });
-  const handleCopy = (wallet) => {
-    if (onCopyAddress) onCopyAddress(wallet);
+  const handleCopy = (text, isWallet = true) => {
     if (typeof navigator !== "undefined" && navigator.clipboard) {
-      navigator.clipboard.writeText(wallet.address).catch(() => {
-      });
+      navigator.clipboard.writeText(text).then(() => {
+        import_react_hot_toast6.default.success(isWallet ? "Address Copied" : "Phrase copied to clipboard");
+      }).catch(() => import_react_hot_toast6.default.error("Failed to copy."));
     }
-    import_react_hot_toast6.default.success("Copied");
   };
-  return /* @__PURE__ */ import_react27.default.createElement("div", null, /* @__PURE__ */ import_react27.default.createElement("div", { className: "mb-6 flex max-w-3xl w-full mx-auto items-center px-1" }, /* @__PURE__ */ import_react27.default.createElement(
-    "button",
-    {
-      onClick: onBackHandler,
-      className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] font-medium outline-none"
-    },
-    /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.ArrowLeft01Icon, size: 16 }),
-    " Back"
-  )), /* @__PURE__ */ import_react27.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react27.default.createElement(ManagedToaster, null), !hideControls && /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col sm:flex-row mb-4 items-center justify-between gap-4 w-full" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "relative w-full sm:w-96" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.Search01Icon, size: 16, className: "text-neutral-400" })), /* @__PURE__ */ import_react27.default.createElement(
+  const handleDownloadTxt = () => {
+    const element = document.createElement("a");
+    const fileContent = `Aeona Self-Custodial Recovery Phrase:
+
+${generatedPhrase}
+
+CRITICAL WARNING: Keep this phrase completely secure. Anyone who has access to these words has full control over your wallet assets. Aeona cannot recover your wallet if this is lost.`;
+    const file = new Blob([fileContent], { type: "text/plain" });
+    element.href = URL.createObjectURL(file);
+    element.download = "aeona_recovery_phrase.txt";
+    document.body.appendChild(element);
+    element.click();
+    document.body.removeChild(element);
+    import_react_hot_toast6.default.success("Phrase downloaded.");
+  };
+  const startWalletGeneration = () => {
+    if (onGeneratePhrase) {
+      const phrase = onGeneratePhrase();
+      setGeneratedPhrase(phrase);
+      setVerifyWords(Array(phrase.split(" ").length).fill(""));
+    }
+    setHasBackedUp(false);
+    setWalletPassword("");
+    setFlowStep(1);
+    setAddModalOpen(true);
+  };
+  const handleGridPaste = async () => {
+    try {
+      const text = await navigator.clipboard.readText();
+      const pastedWords = text.trim().split(/\s+/);
+      if (pastedWords.length > 0) {
+        const newWords = [...verifyWords];
+        for (let i = 0; i < pastedWords.length && i < newWords.length; i++) {
+          newWords[i] = pastedWords[i].toLowerCase();
+        }
+        setVerifyWords(newWords);
+        import_react_hot_toast6.default.success("Phrase auto-filled.");
+      }
+    } catch (err) {
+      import_react_hot_toast6.default.error("Clipboard access denied. Please allow clipboard access or type manually.");
+    }
+  };
+  const handleCreationNext = () => {
+    if (flowStep === 1) {
+      if (!hasBackedUp) return import_react_hot_toast6.default.error("Please confirm you have backed up the phrase.");
+      setFlowStep(2);
+    } else if (flowStep === 2) {
+      const reconstructed = verifyWords.map((w) => w.trim()).join(" ");
+      if (reconstructed !== generatedPhrase.trim()) {
+        return import_react_hot_toast6.default.error("Phrase verification failed. Ensure words are in the correct order.");
+      }
+      setFlowStep(3);
+    }
+  };
+  const startWalletImport = () => {
+    setImportPhraseInput("");
+    setWalletPassword("");
+    setFlowStep(1);
+    setImportModalOpen(true);
+  };
+  const handleImportNext = () => {
+    if (!importPhraseInput.trim()) return import_react_hot_toast6.default.error("Please enter phrase.");
+    if (onValidatePhrase && !onValidatePhrase(importPhraseInput)) {
+      return import_react_hot_toast6.default.error("Invalid recovery phrase. Please check your spelling.");
+    }
+    setFlowStep(2);
+  };
+  const handleSaveWallet = async (phrase) => {
+    if (!walletPassword || walletPassword.length < 6) return import_react_hot_toast6.default.error("Password must be at least 6 characters.");
+    setIsProcessing(true);
+    try {
+      if (onSaveLocally) {
+        const res = await onSaveLocally(phrase, walletPassword);
+        if (res.success) {
+          import_react_hot_toast6.default.success("Wallet secured locally.");
+          setAddModalOpen(false);
+          setImportModalOpen(false);
+        } else {
+          import_react_hot_toast6.default.error("Failed to secure wallet.");
+        }
+      }
+    } finally {
+      setIsProcessing(false);
+    }
+  };
+  return /* @__PURE__ */ import_react27.default.createElement("div", null, /* @__PURE__ */ import_react27.default.createElement("div", { className: "mb-6 flex max-w-3xl w-full mx-auto items-center px-1" }, /* @__PURE__ */ import_react27.default.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] font-medium outline-none" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.ArrowLeft01Icon, size: 16 }), " Back")), /* @__PURE__ */ import_react27.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react27.default.createElement(ManagedToaster, null), !hideControls && /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-row flex-nowrap mb-4 items-center justify-between gap-4 w-full" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "relative flex-1 min-w-0 max-w-full" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.Search01Icon, size: 16, className: "text-neutral-400" })), /* @__PURE__ */ import_react27.default.createElement(
     "input",
     {
       type: "text",
       placeholder: "Search wallets by name or network...",
       value: localSearchQuery,
       onChange: (e) => setLocalSearchQuery(e.target.value),
-      className: "w-full pl-10 pr-4 py-2 bg-white  rounded-full text-[13px] text-black placeholder-neutral-400 outline-none transition-all duration-300 focus:border-black"
+      className: "w-full pl-10 pr-4 py-2 bg-white rounded-full text-[13px] text-black placeholder-neutral-400 outline-none transition-colors focus:border-black"
     }
-  ))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, /* @__PURE__ */ import_react27.default.createElement("div", null, /* @__PURE__ */ import_react27.default.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, headerTitle), headerDescription && /* @__PURE__ */ import_react27.default.createElement("p", { className: "text-xs text-neutral-500" }, headerDescription))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ import_react27.default.createElement(PageSpinner3, null) : /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ import_react27.default.createElement("div", null, filteredWallets.length === 0 ? /* @__PURE__ */ import_react27.default.createElement("p", { className: "text-xs text-neutral-400 py-6 text-center" }, "No wallets found") : filteredWallets.map((wallet) => /* @__PURE__ */ import_react27.default.createElement(
-    "div",
-    {
-      key: wallet.id,
-      onClick: () => setSelectedWallet(wallet),
-      className: "flex items-center justify-between py-4 hover:bg-neutral-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl"
-    },
-    /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ import_react27.default.createElement(WalletLogo, { src: wallet.logoSrc, alt: wallet.name }), /* @__PURE__ */ import_react27.default.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-1" }, /* @__PURE__ */ import_react27.default.createElement("p", { className: "text-[13px] text-black truncate " }, wallet.name), /* @__PURE__ */ import_react27.default.createElement("p", { className: `text-[13px] text-neutral-500 truncate transition-all duration-300 ${hideBalanceAmounts ? "blur-sm opacity-40 select-none" : ""}` }, wallet.balance, " ", wallet.currency))),
-    /* @__PURE__ */ import_react27.default.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[10px] tracking-wide text-neutral-600 bg-neutral-100 px-2.5 py-1 rounded-full " }, wallet.network))
-  )))))), selectedWallet && /* @__PURE__ */ import_react27.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setSelectedWallet(null) }), /* @__PURE__ */ import_react27.default.createElement("div", { className: "relative w-full max-w-sm bg-white  rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[90vh]" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ import_react27.default.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Wallet Details"), /* @__PURE__ */ import_react27.default.createElement("button", { onClick: () => setSelectedWallet(null), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6 pt-6" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col items-center justify-center mb-6" }, /* @__PURE__ */ import_react27.default.createElement(WalletLogo, { src: selectedWallet.logoSrc, alt: selectedWallet.name, sizeClass: "w-14 h-14 mb-4" }), /* @__PURE__ */ import_react27.default.createElement("h2", { className: `text-2xl text-black mb-2 transition-all duration-300  ${hideBalanceAmounts ? "blur-[6px] opacity-40 select-none" : ""}` }, selectedWallet.balance, " ", selectedWallet.currency), /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[9px] tracking-widest text-neutral-500 px-4 py-1.5 rounded-full border border-neutral-200  mt-1 " }, selectedWallet.network, " NETWORK")), renderQrCode && /* @__PURE__ */ import_react27.default.createElement("div", { className: "w-full flex justify-center mb-6 mix-blend-multiply" }, renderQrCode(selectedWallet)), /* @__PURE__ */ import_react27.default.createElement("div", { className: "grid grid-cols-1 gap-y-6 gap-x-4 mb-10" }, /* @__PURE__ */ import_react27.default.createElement("div", null, /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Wallet Address"), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center gap-2 min-w-0" }, /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[13px] text-black truncate min-w-0 block" }, truncateAddress2(selectedWallet.address)), /* @__PURE__ */ import_react27.default.createElement(
-    "button",
-    {
-      onClick: () => handleCopy(selectedWallet),
-      className: "text-neutral-400 hover:text-black transition-colors outline-none"
-    },
-    /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.Copy01Icon, size: 14 })
-  ))), /* @__PURE__ */ import_react27.default.createElement("div", null, /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Wallet Name"), /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[13px] text-black" }, selectedWallet.name))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ import_react27.default.createElement(
-    ThreeDActionButton,
-    {
-      onClick: () => onDownloadPayId && onDownloadPayId(selectedWallet),
-      isLoading: isGeneratingStatement,
-      className: "w-full"
-    },
-    "Generate Statement"
-  ), /* @__PURE__ */ import_react27.default.createElement(
-    "button",
+  )), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center gap-3 w-auto pb-0 shrink-0" }, /* @__PURE__ */ import_react27.default.createElement("button", { onClick: startWalletGeneration, className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-neutral-500 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.PlusSignIcon, size: 16 })), /* @__PURE__ */ import_react27.default.createElement("button", { onClick: startWalletImport, className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-neutral-500 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.Upload01Icon, size: 16 })))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, /* @__PURE__ */ import_react27.default.createElement("div", null, /* @__PURE__ */ import_react27.default.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, headerTitle), headerDescription && /* @__PURE__ */ import_react27.default.createElement("p", { className: "text-xs text-neutral-500" }, headerDescription))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ import_react27.default.createElement(PageSpinner3, null) : /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ import_react27.default.createElement("div", null, filteredWallets.length === 0 ? /* @__PURE__ */ import_react27.default.createElement("p", { className: "text-xs text-neutral-400 py-6 text-center" }, "No wallets found") : filteredWallets.map((wallet) => /* @__PURE__ */ import_react27.default.createElement("div", { key: wallet.id, onClick: () => setSelectedWallet(wallet), className: "flex items-center justify-between py-4 hover:bg-neutral-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "relative shrink-0" }, /* @__PURE__ */ import_react27.default.createElement(WalletLogo, { src: wallet.logoSrc, alt: wallet.name }), wallet.networkLogoSrc && /* @__PURE__ */ import_react27.default.createElement("div", { className: "absolute -bottom-1 -right-1 w-4 h-4 rounded-full border border-white bg-white overflow-hidden shadow-sm" }, /* @__PURE__ */ import_react27.default.createElement("img", { src: wallet.networkLogoSrc, alt: "Network", className: "w-full h-full object-cover" }))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-1" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react27.default.createElement("p", { className: "text-[13px] text-black truncate" }, wallet.name), wallet.isActive !== void 0 && /* @__PURE__ */ import_react27.default.createElement("span", { className: `text-[9px] px-1.5 py-0.5 rounded-sm tracking-widest uppercase ${wallet.isActive ? "bg-emerald-50 text-emerald-600" : "bg-red-50 text-red-600"}` }, wallet.isActive ? "Active" : "Inactive")), /* @__PURE__ */ import_react27.default.createElement("p", { className: `text-[13px] text-neutral-500 truncate transition-all duration-300 ${hideBalanceAmounts ? "blur-sm opacity-40 select-none" : ""}` }, wallet.balance, " ", wallet.currency))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[10px] tracking-wide text-neutral-600 bg-neutral-100 px-2.5 py-1 rounded-full " }, wallet.network)))))))), addModalOpen && /* @__PURE__ */ import_react27.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isProcessing && setAddModalOpen(false) }), /* @__PURE__ */ import_react27.default.createElement("div", { className: "relative w-full max-w-md bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, /* @__PURE__ */ import_react27.default.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, flowStep === 1 ? "Secret Recovery Phrase" : flowStep === 2 ? "Verify Phrase" : "Secure Wallet"), /* @__PURE__ */ import_react27.default.createElement("button", { onClick: () => !isProcessing && setAddModalOpen(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "p-6" }, flowStep === 1 && /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in" }, /* @__PURE__ */ import_react27.default.createElement(Banner, { type: "alert", title: "CRITICAL WARNING", message: "This phrase is the master key to your wallet. Anyone with these words has full control over your assets. Aeona cannot recover this if lost.", isDismissible: false }), /* @__PURE__ */ import_react27.default.createElement("div", { className: "grid grid-cols-3 gap-2 max-h-48 overflow-y-auto custom-scrollbar pr-1" }, generatedPhrase.split(" ").map((word, idx) => /* @__PURE__ */ import_react27.default.createElement("div", { key: idx, className: "flex items-center gap-1.5 bg-neutral-50  rounded-lg p-2 selection:bg-neutral-200" }, /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[10px] text-neutral-400 font-mono select-none w-4 text-right shrink-0" }, idx + 1, "."), /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[13px] text-black font-medium" }, word)))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center justify-between gap-2 0 pt-4" }, /* @__PURE__ */ import_react27.default.createElement("button", { onClick: () => handleCopy(generatedPhrase, false), className: "text-xs text-black flex items-center gap-1.5 hover:underline outline-none" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.Copy01Icon, size: 14 }), " Copy Phrase"), /* @__PURE__ */ import_react27.default.createElement("button", { onClick: handleDownloadTxt, className: "text-xs text-black flex items-center gap-1.5 hover:underline outline-none" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.Download01Icon, size: 14 }), " Download .txt")), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-start gap-3  p-3 rounded-xl border border-neutral-200 mt-2" }, /* @__PURE__ */ import_react27.default.createElement("input", { type: "checkbox", id: "backup-confirm", checked: hasBackedUp, onChange: (e) => setHasBackedUp(e.target.checked), className: "mt-0.5 w-4 h-4 bg-white border-neutral-300 rounded text-black focus:ring-black cursor-pointer shrink-0" }), /* @__PURE__ */ import_react27.default.createElement("label", { htmlFor: "backup-confirm", className: "text-xs text-neutral-600 cursor-pointer leading-relaxed" }, "I have securely copied and stored my recovery phrase. I understand that if I lose it, my funds are gone forever.")), /* @__PURE__ */ import_react27.default.createElement(ThreeDActionButton, { onClick: handleCreationNext, className: "w-full mt-2" }, "Continue")), flowStep === 2 && /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ import_react27.default.createElement("p", { className: "text-sm text-neutral-600" }, "Please enter or paste your recovery phrase below to verify your backup."), /* @__PURE__ */ import_react27.default.createElement("div", { className: "grid grid-cols-3 gap-2 max-h-56 overflow-y-auto custom-scrollbar pr-1 pb-1" }, verifyWords.map((word, idx) => /* @__PURE__ */ import_react27.default.createElement("div", { key: idx, className: "flex items-center gap-1 bg-white border border-neutral-200 focus-within:border-black rounded-lg p-1.5 transition-colors" }, /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[10px] text-neutral-400 font-mono w-4 shrink-0 text-right select-none" }, idx + 1, "."), /* @__PURE__ */ import_react27.default.createElement(
+    "input",
     {
-      onClick: () => handleCopy(selectedWallet),
-      className: "w-full flex  items-center justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 outline-none text-xs tracking-wide transition-colors"
-    },
-    "Copy Wallet Address"
-  )))))));
+      type: "text",
+      value: word,
+      onChange: (e) => {
+        const newWords = [...verifyWords];
+        newWords[idx] = e.target.value.trim().toLowerCase();
+        setVerifyWords(newWords);
+      },
+      onPaste: (e) => {
+        const pastedData = e.clipboardData.getData("text").trim();
+        const pastedWords = pastedData.split(/\s+/);
+        if (pastedWords.length > 1) {
+          e.preventDefault();
+          const newWords = [...verifyWords];
+          for (let i = 0; i < pastedWords.length && i < newWords.length; i++) {
+            newWords[i] = pastedWords[i].toLowerCase();
+          }
+          setVerifyWords(newWords);
+          import_react_hot_toast6.default.success("Phrase auto-filled.");
+        }
+      },
+      className: "w-full bg-transparent text-[13px] text-black outline-none min-w-0"
+    }
+  )))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center justify-between pt-4" }, /* @__PURE__ */ import_react27.default.createElement("button", { onClick: handleGridPaste, className: "text-xs text-black flex items-center gap-1.5 hover:underline outline-none" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.ClipboardIcon, size: 14 }), " Paste Phrase")), /* @__PURE__ */ import_react27.default.createElement(ThreeDActionButton, { onClick: handleCreationNext, className: "w-full mt-2" }, "Verify Backup")), flowStep === 3 && /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ import_react27.default.createElement(Banner, { type: "success", title: "Phrase Verified", message: "Your phrase is correct. Now set a local password to encrypt your wallet on this browser.", isDismissible: false }), /* @__PURE__ */ import_react27.default.createElement(TextInput, { label: "LOCAL PASSWORD", type: "password", value: walletPassword, onChange: setWalletPassword, placeholder: "Enter a strong password" }), /* @__PURE__ */ import_react27.default.createElement(ThreeDActionButton, { onClick: () => handleSaveWallet(generatedPhrase), isLoading: isProcessing, className: "w-full mt-2" }, "Encrypt & Save Wallet"))))), importModalOpen && /* @__PURE__ */ import_react27.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isProcessing && setImportModalOpen(false) }), /* @__PURE__ */ import_react27.default.createElement("div", { className: "relative w-full max-w-md bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ import_react27.default.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Import Wallet"), /* @__PURE__ */ import_react27.default.createElement("button", { onClick: () => !isProcessing && setImportModalOpen(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "p-6" }, flowStep === 1 && /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in" }, /* @__PURE__ */ import_react27.default.createElement("p", { className: "text-sm text-neutral-600" }, "Enter your 12 or 24-word recovery phrase to restore your wallet on this device."), /* @__PURE__ */ import_react27.default.createElement(TextInput, { label: "RECOVERY PHRASE", value: importPhraseInput, onChange: setImportPhraseInput, placeholder: "abandon abandon abandon..." }), /* @__PURE__ */ import_react27.default.createElement(ThreeDActionButton, { onClick: handleImportNext, className: "w-full mt-2" }, "Continue")), flowStep === 2 && /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ import_react27.default.createElement("p", { className: "text-sm text-neutral-600" }, "Set a local password to encrypt this wallet on this specific browser."), /* @__PURE__ */ import_react27.default.createElement(TextInput, { label: "LOCAL PASSWORD", type: "password", value: walletPassword, onChange: setWalletPassword, placeholder: "Enter a strong password" }), /* @__PURE__ */ import_react27.default.createElement(ThreeDActionButton, { onClick: () => handleSaveWallet(importPhraseInput), isLoading: isProcessing, className: "w-full mt-2" }, "Encrypt & Import Wallet"))))), selectedWallet && /* @__PURE__ */ import_react27.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setSelectedWallet(null) }), /* @__PURE__ */ import_react27.default.createElement("div", { className: "relative w-full max-w-sm bg-white  rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[90vh]" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ import_react27.default.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Wallet Details"), /* @__PURE__ */ import_react27.default.createElement("button", { onClick: () => setSelectedWallet(null), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6 pt-6" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col items-center justify-center mb-6" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "relative mb-4" }, /* @__PURE__ */ import_react27.default.createElement(WalletLogo, { src: selectedWallet.logoSrc, alt: selectedWallet.name, sizeClass: "w-14 h-14" }), selectedWallet.networkLogoSrc && /* @__PURE__ */ import_react27.default.createElement("div", { className: "absolute -bottom-1 -right-1 w-5 h-5 rounded-full border border-white bg-white overflow-hidden shadow-sm" }, /* @__PURE__ */ import_react27.default.createElement("img", { src: selectedWallet.networkLogoSrc, alt: "Network", className: "w-full h-full object-cover" }))), /* @__PURE__ */ import_react27.default.createElement("h2", { className: `text-2xl text-black mb-2 transition-all duration-300  ${hideBalanceAmounts ? "blur-[6px] opacity-40 select-none" : ""}` }, selectedWallet.balance, " ", selectedWallet.currency), /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[9px] tracking-widest text-neutral-500 px-4 py-1.5 rounded-full border border-neutral-200 mt-1 " }, selectedWallet.network, " NETWORK")), renderQrCode && /* @__PURE__ */ import_react27.default.createElement("div", { className: "w-full flex justify-center mb-6 mix-blend-multiply" }, renderQrCode(selectedWallet)), /* @__PURE__ */ import_react27.default.createElement("div", { className: "grid grid-cols-1 gap-y-6 gap-x-4 mb-10" }, /* @__PURE__ */ import_react27.default.createElement("div", null, /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Wallet Address"), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center gap-2 min-w-0" }, /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[13px] text-black truncate min-w-0 block" }, truncateAddress2(selectedWallet.address)), /* @__PURE__ */ import_react27.default.createElement("button", { onClick: () => handleCopy(selectedWallet.address, true), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.Copy01Icon, size: 14 })))), /* @__PURE__ */ import_react27.default.createElement("div", null, /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Wallet Status"), selectedWallet.isActive ? /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[13px] text-emerald-600 font-medium" }, "Active on this device") : /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[13px] text-red-600 font-medium" }, "Inactive - Requires Import"))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ import_react27.default.createElement(ThreeDActionButton, { onClick: () => onDownloadPayId && onDownloadPayId(selectedWallet), isLoading: isGeneratingStatement, className: "w-full" }, "Generate Statement"), /* @__PURE__ */ import_react27.default.createElement("button", { onClick: () => handleCopy(selectedWallet.address, true), className: "w-full flex items-center justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 outline-none text-xs tracking-wide transition-colors" }, "Copy Wallet Address")))))));
 };
 
 // src/components/UniversalCardPage.tsx
@@ -2820,7 +2894,7 @@ var UniversalSecurityPage = ({
       toggleLoading: isPasskeyLoading,
       isLast: true
     }
-  ))), show2FASetupModal && /* @__PURE__ */ import_react45.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react45.default.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isSubmitting && setShow2FASetupModal(false) }), /* @__PURE__ */ import_react45.default.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[90vh]" }, /* @__PURE__ */ import_react45.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ import_react45.default.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Enable 2FA"), /* @__PURE__ */ import_react45.default.createElement("button", { onClick: () => !isSubmitting && setShow2FASetupModal(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react45.default.createElement(import_react46.HugeiconsIcon, { icon: import_core_free_icons16.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react45.default.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6 pt-2" }, /* @__PURE__ */ import_react45.default.createElement("div", { className: "w-full flex justify-center mb-6 mix-blend-multiply" }, twoFaQr ? /* @__PURE__ */ import_react45.default.createElement("img", { src: twoFaQr, alt: "2FA QR Code", className: "w-40 h-40 object-contain rounded-xl border border-neutral-100 p-2" }) : /* @__PURE__ */ import_react45.default.createElement("div", { className: "w-40 h-40 bg-neutral-100 rounded-xl flex items-center justify-center animate-pulse" })), /* @__PURE__ */ import_react45.default.createElement("div", { className: "grid grid-cols-1 gap-y-6 gap-x-4 mb-8" }, /* @__PURE__ */ import_react45.default.createElement("div", null, /* @__PURE__ */ import_react45.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2 uppercase" }, "Setup Key"), /* @__PURE__ */ import_react45.default.createElement("div", { className: "flex items-center gap-2 min-w-0 bg-neutral-50 px-3 py-2.5 rounded-xl " }, /* @__PURE__ */ import_react45.default.createElement("span", { className: "text-[13px] font-mono tracking-widest text-black truncate min-w-0 block flex-1" }, twoFaSecret), /* @__PURE__ */ import_react45.default.createElement(
+  ))), show2FASetupModal && /* @__PURE__ */ import_react45.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react45.default.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isSubmitting && setShow2FASetupModal(false) }), /* @__PURE__ */ import_react45.default.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[90vh]" }, /* @__PURE__ */ import_react45.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ import_react45.default.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Enable 2FA"), /* @__PURE__ */ import_react45.default.createElement("button", { onClick: () => !isSubmitting && setShow2FASetupModal(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react45.default.createElement(import_react46.HugeiconsIcon, { icon: import_core_free_icons16.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react45.default.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6 pt-2" }, /* @__PURE__ */ import_react45.default.createElement("div", { className: "w-full flex justify-center mb-6 mix-blend-multiply" }, twoFaQr ? /* @__PURE__ */ import_react45.default.createElement("img", { src: twoFaQr, alt: "2FA QR Code", className: "w-40 h-40 object-contain rounded-xl border border-neutral-200 p-2" }) : /* @__PURE__ */ import_react45.default.createElement("div", { className: "w-40 h-40 bg-neutral-100 rounded-xl flex items-center justify-center animate-pulse" })), /* @__PURE__ */ import_react45.default.createElement("div", { className: "grid grid-cols-1 gap-y-6 gap-x-4 mb-8" }, /* @__PURE__ */ import_react45.default.createElement("div", null, /* @__PURE__ */ import_react45.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2 uppercase" }, "Setup Key"), /* @__PURE__ */ import_react45.default.createElement("div", { className: "flex items-center gap-2 min-w-0 bg-neutral-50 px-3 py-2.5 rounded-xl " }, /* @__PURE__ */ import_react45.default.createElement("span", { className: "text-[13px] font-mono tracking-widest text-black truncate min-w-0 block flex-1" }, twoFaSecret), /* @__PURE__ */ import_react45.default.createElement(
     "button",
     {
       type: "button",
@@ -2848,7 +2922,7 @@ var UniversalSecurityPage = ({
           inputRefs.current[index - 1]?.focus();
         }
       },
-      className: "w-8 h-12 text-center text-lg bg-transparent border-b-2 border-neutral-100 text-black outline-none focus:border-black transition-all duration-300"
+      className: "w-8 h-12 text-center text-lg bg-transparent border-b-2 border-neutral-200 text-black outline-none focus:border-black transition-all duration-300"
     }
   ))), /* @__PURE__ */ import_react45.default.createElement(
     ThreeDActionButton,
@@ -2888,7 +2962,7 @@ var UniversalSecurityPage = ({
           inputRefs.current[index - 1]?.focus();
         }
       },
-      className: "w-10 h-12 text-center text-lg bg-transparent border-b-2 border-neutral-100 text-black outline-none focus:border-black transition-all duration-300"
+      className: "w-10 h-12 text-center text-lg bg-transparent border-b-2 border-neutral-200 text-black outline-none focus:border-black transition-all duration-300"
     }
   ))), /* @__PURE__ */ import_react45.default.createElement(
     ThreeDActionButton,
@@ -3106,7 +3180,7 @@ var ManagedDocument = ({
         style: isAnimating ? { animationIterationCount: 1 } : {}
       },
       title
-    )), sections.map((section, index) => /* @__PURE__ */ import_react51.default.createElement("div", { key: index, className: "relative px-5 md:px-12 py-8 md:py-10" }, section.heading && /* @__PURE__ */ import_react51.default.createElement("p", { className: " text-[11px] tracking-[0.2em] text-black mb-4 text-left " }, section.heading), section.paragraphs && section.paragraphs.length > 0 && /* @__PURE__ */ import_react51.default.createElement("div", { className: "text-[14px] leading-[1.8] text-neutral-700 space-y-4 text-left " }, section.paragraphs.map((text, pIndex) => /* @__PURE__ */ import_react51.default.createElement("p", { key: pIndex }, text))), section.quote && /* @__PURE__ */ import_react51.default.createElement("div", { className: `border-neutral-100 border rounded-xl p-6 ${section.paragraphs && section.paragraphs.length > 0 ? "mt-6" : ""}` }, /* @__PURE__ */ import_react51.default.createElement("p", { className: "text-neutral-900 text-[14px] md:text-[14px] leading-relaxed" }, '"', section.quote, '"')))), (contactText || contactEmail) && /* @__PURE__ */ import_react51.default.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10 pb-12 md:pb-14" }, /* @__PURE__ */ import_react51.default.createElement("p", { className: "text-[11px] text-neutral-600 text-left" }, contactText, contactEmail && /* @__PURE__ */ import_react51.default.createElement(
+    )), sections.map((section, index) => /* @__PURE__ */ import_react51.default.createElement("div", { key: index, className: "relative px-5 md:px-12 py-8 md:py-10" }, section.heading && /* @__PURE__ */ import_react51.default.createElement("p", { className: " text-[11px] tracking-[0.2em] text-black mb-4 text-left " }, section.heading), section.paragraphs && section.paragraphs.length > 0 && /* @__PURE__ */ import_react51.default.createElement("div", { className: "text-[14px] leading-[1.8] text-neutral-700 space-y-4 text-left " }, section.paragraphs.map((text, pIndex) => /* @__PURE__ */ import_react51.default.createElement("p", { key: pIndex }, text))), section.quote && /* @__PURE__ */ import_react51.default.createElement("div", { className: `border-neutral-200 border rounded-xl p-6 ${section.paragraphs && section.paragraphs.length > 0 ? "mt-6" : ""}` }, /* @__PURE__ */ import_react51.default.createElement("p", { className: "text-neutral-900 text-[14px] md:text-[14px] leading-relaxed" }, '"', section.quote, '"')))), (contactText || contactEmail) && /* @__PURE__ */ import_react51.default.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10 pb-12 md:pb-14" }, /* @__PURE__ */ import_react51.default.createElement("p", { className: "text-[11px] text-neutral-600 text-left" }, contactText, contactEmail && /* @__PURE__ */ import_react51.default.createElement(
       "a",
       {
         href: `mailto:${contactEmail}`,
@@ -3256,7 +3330,7 @@ var ManagedPricingBlock = ({
       import_link7.default,
       {
         href: plan.ctaHref,
-        className: "w-full py-2.5 px-5 rounded-full border border-neutral-100 text-center text-black text-xs hover:bg-neutral-50 transition-colors mb-6 outline-none block"
+        className: "w-full py-2.5 px-5 rounded-full border border-neutral-200 text-center text-black text-xs hover:bg-neutral-50 transition-colors mb-6 outline-none block"
       },
       plan.ctaText
     ),
@@ -3394,7 +3468,7 @@ var ManagedNewsletterSplitBlock = ({
         backgroundRepeat: "repeat"
       }
     }
-  ), /* @__PURE__ */ import_react58.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react58.default.createElement("div", { className: "mb-10 border-b border-neutral-100 pb-8 text-center md:text-left" }, tagline && /* @__PURE__ */ import_react58.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 " }, tagline), /* @__PURE__ */ import_react58.default.createElement("h1", { className: "  text-3xl mt-4 text-black tracking-tight mb-4" }, title), subtitle && /* @__PURE__ */ import_react58.default.createElement("p", { className: "text-[11px] tracking-[0.2em] text-neutral-500 " }, subtitle)), /* @__PURE__ */ import_react58.default.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 mb-10 text-center md:text-left" }, description), children && /* @__PURE__ */ import_react58.default.createElement("div", { className: "mb-8 text-left" }, children), /* @__PURE__ */ import_react58.default.createElement("div", { className: "text-center md:text-left mt-10 space-y-6" }, dividerText && /* @__PURE__ */ import_react58.default.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ import_react58.default.createElement("div", { className: "grow h-px bg-neutral-100" }), /* @__PURE__ */ import_react58.default.createElement("span", { className: "shrink mx-4 text-[11px] tracking-[0.2em] text-neutral-400 " }, dividerText), /* @__PURE__ */ import_react58.default.createElement("div", { className: "grow h-px bg-neutral-100" })), ctaText && ctaHref && /* @__PURE__ */ import_react58.default.createElement("div", { className: "w-full *:w-full" }, /* @__PURE__ */ import_react58.default.createElement(
+  ), /* @__PURE__ */ import_react58.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react58.default.createElement("div", { className: "mb-10 border-b border-neutral-200 pb-8 text-center md:text-left" }, tagline && /* @__PURE__ */ import_react58.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 " }, tagline), /* @__PURE__ */ import_react58.default.createElement("h1", { className: "  text-3xl mt-4 text-black tracking-tight mb-4" }, title), subtitle && /* @__PURE__ */ import_react58.default.createElement("p", { className: "text-[11px] tracking-[0.2em] text-neutral-500 " }, subtitle)), /* @__PURE__ */ import_react58.default.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 mb-10 text-center md:text-left" }, description), children && /* @__PURE__ */ import_react58.default.createElement("div", { className: "mb-8 text-left" }, children), /* @__PURE__ */ import_react58.default.createElement("div", { className: "text-center md:text-left mt-10 space-y-6" }, dividerText && /* @__PURE__ */ import_react58.default.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ import_react58.default.createElement("div", { className: "grow h-px bg-neutral-100" }), /* @__PURE__ */ import_react58.default.createElement("span", { className: "shrink mx-4 text-[11px] tracking-[0.2em] text-neutral-400 " }, dividerText), /* @__PURE__ */ import_react58.default.createElement("div", { className: "grow h-px bg-neutral-100" })), ctaText && ctaHref && /* @__PURE__ */ import_react58.default.createElement("div", { className: "w-full *:w-full" }, /* @__PURE__ */ import_react58.default.createElement(
     ThreeDButton,
     {
       href: ctaHref,
@@ -3454,7 +3528,7 @@ var PortfolioHero = ({
       ref: heroContentRef,
       className: "w-full opacity-0 translate-y-5 transition-all duration-1000 ease-out relative z-10"
     },
-    /* @__PURE__ */ import_react59.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center gap-5 sm:gap-8 mb-10" }, /* @__PURE__ */ import_react59.default.createElement("div", { className: "relative w-20 h-20 sm:w-32 sm:h-32 rounded-full overflow-hidden border border-neutral-100 shrink-0 shadow-sm" }, /* @__PURE__ */ import_react59.default.createElement(
+    /* @__PURE__ */ import_react59.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center gap-5 sm:gap-8 mb-10" }, /* @__PURE__ */ import_react59.default.createElement("div", { className: "relative w-20 h-20 sm:w-32 sm:h-32 rounded-full overflow-hidden border border-neutral-200 shrink-0 shadow-sm" }, /* @__PURE__ */ import_react59.default.createElement(
       import_image7.default,
       {
         src: imageSrc,
@@ -3713,7 +3787,7 @@ var ContentGridBlock = ({
   middleBottomCard,
   rightCards
 }) => {
-  return /* @__PURE__ */ import_react66.default.createElement("section", { className: " w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react66.default.createElement("div", { className: "max-w-300 w-full px-4 md:px-8 flex flex-col gap-12" }, /* @__PURE__ */ import_react66.default.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-6 w-full" }, /* @__PURE__ */ import_react66.default.createElement("h2", { className: "text-3xl   tracking-tight text-black leading-[1.15] max-w-lg" }, header.titlePrefix, " ", /* @__PURE__ */ import_react66.default.createElement("span", { className: "gradient-text" }, header.highlightText))), /* @__PURE__ */ import_react66.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" }, /* @__PURE__ */ import_react66.default.createElement("div", { className: "flex flex-col justify-end" }, /* @__PURE__ */ import_react66.default.createElement("div", { className: "bg-black rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ import_react66.default.createElement("p", { className: "text-[17px] text-white leading-snug  mb-4" }, leftCard.mainText), leftCard.tag && /* @__PURE__ */ import_react66.default.createElement("span", { className: "mb-auto text-[11px]  text-neutral-200  tracking-widest" }, leftCard.tag), /* @__PURE__ */ import_react66.default.createElement("div", { className: "flex items-center justify-between mt-8" }, /* @__PURE__ */ import_react66.default.createElement("div", null, /* @__PURE__ */ import_react66.default.createElement("h4", { className: "text-[15px]  text-white" }, leftCard.title), /* @__PURE__ */ import_react66.default.createElement("p", { className: "text-[13px] text-neutral-300" }, leftCard.subtitle)), /* @__PURE__ */ import_react66.default.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ import_react66.default.createElement(import_image11.default, { src: leftCard.thumbnailSrc, alt: leftCard.title, fill: true, className: "object-cover" }))))), /* @__PURE__ */ import_react66.default.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ import_react66.default.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col relative h-75" }, /* @__PURE__ */ import_react66.default.createElement("div", { className: "absolute top-6 right-6 flex flex-col items-end gap-1" }, /* @__PURE__ */ import_react66.default.createElement("span", { className: "text-[11px] text-neutral-400  tracking-wide" }, middleTopCard.topRightLabel), /* @__PURE__ */ import_react66.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react66.default.createElement("div", { className: "flex -space-x-2" }, middleTopCard.topRightAvatars.map((src, i) => /* @__PURE__ */ import_react66.default.createElement("div", { key: i, className: "w-7 h-7 rounded-full border-2 border-white overflow-hidden relative z-10" }, /* @__PURE__ */ import_react66.default.createElement(import_image11.default, { src, alt: "Avatar", fill: true, className: "object-cover", sizes: "28px" })))), /* @__PURE__ */ import_react66.default.createElement("span", { className: "text-sm  text-neutral-500" }, middleTopCard.topRightCount))), /* @__PURE__ */ import_react66.default.createElement("div", { className: "grow flex flex-col justify-center items-center py-6" }, /* @__PURE__ */ import_react66.default.createElement("div", { className: "px-5 py-2 rounded-full bg-neutral-50/50 border border-neutral-100 text-[13px] text-neutral-600" }, middleTopCard.badgePrefix, " ", /* @__PURE__ */ import_react66.default.createElement("span", { className: " text-black" }, middleTopCard.badgeHighlight), middleTopCard.badgeSuffix)), /* @__PURE__ */ import_react66.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react66.default.createElement("p", { className: "text-[11px] text-neutral-400  tracking-wide mb-1" }, middleTopCard.title), /* @__PURE__ */ import_react66.default.createElement("p", { className: "text-[14px] text-black  leading-snug pr-4" }, middleTopCard.description))), /* @__PURE__ */ import_react66.default.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ import_react66.default.createElement("div", { className: "flex justify-between items-start mb-6" }, /* @__PURE__ */ import_react66.default.createElement("div", null, /* @__PURE__ */ import_react66.default.createElement("h4", { className: "text-[15px]  text-black leading-tight" }, middleBottomCard.title), /* @__PURE__ */ import_react66.default.createElement("p", { className: "text-[13px] text-neutral-400" }, middleBottomCard.subtitle)), /* @__PURE__ */ import_react66.default.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ import_react66.default.createElement(import_image11.default, { src: middleBottomCard.thumbnailSrc, alt: middleBottomCard.title, fill: true, className: "object-cover" }))), /* @__PURE__ */ import_react66.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react66.default.createElement("p", { className: "text-[16px] text-black leading-snug  mb-4" }, middleBottomCard.mainText), middleBottomCard.tag && /* @__PURE__ */ import_react66.default.createElement("span", { className: "text-[11px]  text-neutral-400  tracking-widest" }, middleBottomCard.tag)))), /* @__PURE__ */ import_react66.default.createElement("div", { className: "flex flex-col gap-6" }, rightCards.slice(0, 2).map((card, idx) => /* @__PURE__ */ import_react66.default.createElement("div", { key: idx, className: "relative w-full h-80  text-white rounded-3xl overflow-hidden group" }, /* @__PURE__ */ import_react66.default.createElement(
+  return /* @__PURE__ */ import_react66.default.createElement("section", { className: " w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react66.default.createElement("div", { className: "max-w-300 w-full px-4 md:px-8 flex flex-col gap-12" }, /* @__PURE__ */ import_react66.default.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-6 w-full" }, /* @__PURE__ */ import_react66.default.createElement("h2", { className: "text-3xl   tracking-tight text-black leading-[1.15] max-w-lg" }, header.titlePrefix, " ", /* @__PURE__ */ import_react66.default.createElement("span", { className: "gradient-text" }, header.highlightText))), /* @__PURE__ */ import_react66.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" }, /* @__PURE__ */ import_react66.default.createElement("div", { className: "flex flex-col justify-end" }, /* @__PURE__ */ import_react66.default.createElement("div", { className: "bg-black rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ import_react66.default.createElement("p", { className: "text-[17px] text-white leading-snug  mb-4" }, leftCard.mainText), leftCard.tag && /* @__PURE__ */ import_react66.default.createElement("span", { className: "mb-auto text-[11px]  text-neutral-200  tracking-widest" }, leftCard.tag), /* @__PURE__ */ import_react66.default.createElement("div", { className: "flex items-center justify-between mt-8" }, /* @__PURE__ */ import_react66.default.createElement("div", null, /* @__PURE__ */ import_react66.default.createElement("h4", { className: "text-[15px]  text-white" }, leftCard.title), /* @__PURE__ */ import_react66.default.createElement("p", { className: "text-[13px] text-neutral-300" }, leftCard.subtitle)), /* @__PURE__ */ import_react66.default.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ import_react66.default.createElement(import_image11.default, { src: leftCard.thumbnailSrc, alt: leftCard.title, fill: true, className: "object-cover" }))))), /* @__PURE__ */ import_react66.default.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ import_react66.default.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col relative h-75" }, /* @__PURE__ */ import_react66.default.createElement("div", { className: "absolute top-6 right-6 flex flex-col items-end gap-1" }, /* @__PURE__ */ import_react66.default.createElement("span", { className: "text-[11px] text-neutral-400  tracking-wide" }, middleTopCard.topRightLabel), /* @__PURE__ */ import_react66.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react66.default.createElement("div", { className: "flex -space-x-2" }, middleTopCard.topRightAvatars.map((src, i) => /* @__PURE__ */ import_react66.default.createElement("div", { key: i, className: "w-7 h-7 rounded-full border-2 border-white overflow-hidden relative z-10" }, /* @__PURE__ */ import_react66.default.createElement(import_image11.default, { src, alt: "Avatar", fill: true, className: "object-cover", sizes: "28px" })))), /* @__PURE__ */ import_react66.default.createElement("span", { className: "text-sm  text-neutral-500" }, middleTopCard.topRightCount))), /* @__PURE__ */ import_react66.default.createElement("div", { className: "grow flex flex-col justify-center items-center py-6" }, /* @__PURE__ */ import_react66.default.createElement("div", { className: "px-5 py-2 rounded-full bg-neutral-50/50 border border-neutral-200 text-[13px] text-neutral-600" }, middleTopCard.badgePrefix, " ", /* @__PURE__ */ import_react66.default.createElement("span", { className: " text-black" }, middleTopCard.badgeHighlight), middleTopCard.badgeSuffix)), /* @__PURE__ */ import_react66.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react66.default.createElement("p", { className: "text-[11px] text-neutral-400  tracking-wide mb-1" }, middleTopCard.title), /* @__PURE__ */ import_react66.default.createElement("p", { className: "text-[14px] text-black  leading-snug pr-4" }, middleTopCard.description))), /* @__PURE__ */ import_react66.default.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ import_react66.default.createElement("div", { className: "flex justify-between items-start mb-6" }, /* @__PURE__ */ import_react66.default.createElement("div", null, /* @__PURE__ */ import_react66.default.createElement("h4", { className: "text-[15px]  text-black leading-tight" }, middleBottomCard.title), /* @__PURE__ */ import_react66.default.createElement("p", { className: "text-[13px] text-neutral-400" }, middleBottomCard.subtitle)), /* @__PURE__ */ import_react66.default.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ import_react66.default.createElement(import_image11.default, { src: middleBottomCard.thumbnailSrc, alt: middleBottomCard.title, fill: true, className: "object-cover" }))), /* @__PURE__ */ import_react66.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react66.default.createElement("p", { className: "text-[16px] text-black leading-snug  mb-4" }, middleBottomCard.mainText), middleBottomCard.tag && /* @__PURE__ */ import_react66.default.createElement("span", { className: "text-[11px]  text-neutral-400  tracking-widest" }, middleBottomCard.tag)))), /* @__PURE__ */ import_react66.default.createElement("div", { className: "flex flex-col gap-6" }, rightCards.slice(0, 2).map((card, idx) => /* @__PURE__ */ import_react66.default.createElement("div", { key: idx, className: "relative w-full h-80  text-white rounded-3xl overflow-hidden group" }, /* @__PURE__ */ import_react66.default.createElement(
     ImageWithLoader2,
     {
       src: card.bgImageSrc,

package/dist/index.mjs

@@ -464,7 +464,7 @@ function AuthFormInner({
     if (mode === "SIGNUP" && signupStep === "NAME") handleNextSignupStep();
     else if (mode === "SIGNUP" && signupStep === "ORGANIZATION") handleNextSignupStep();
     else handleAuthRequestSubmit();
-  } }, mode === "SIGNUP" && signupStep === "NAME" && requireNames && /* @__PURE__ */ React5.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ React5.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ React5.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "First Name"), /* @__PURE__ */ React5.createElement("input", { type: "text", value: firstName, onChange: (e) => setFirstName(cleanAlpha(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-100 text-black outline-none focus:border-black transition-all duration-300", placeholder: "First name" })), /* @__PURE__ */ React5.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ React5.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "Last Name"), /* @__PURE__ */ React5.createElement("input", { type: "text", value: lastName, onChange: (e) => setLastName(cleanAlpha(e.target.value)), required: true, className: "w-full px-2 py-3 bg-transparent text-sm border-b border-neutral-100 text-black outline-none focus:border-black transition-all duration-300", placeholder: "Last name" }))), mode === "SIGNUP" && signupStep === "ORGANIZATION" && requireOrganization && /* @__PURE__ */ React5.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ React5.createElement("div", { className: "space-y-1.5 relative" }, /* @__PURE__ */ React5.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "Organization Name"), /* @__PURE__ */ React5.createElement("input", { type: "text", value: orgName, onChange: (e) => setOrgName(cleanOrgName(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-100 text-black outline-none focus:border-black transition-all duration-300", placeholder: "Acme Corporation" }))), (mode === "LOGIN" || mode === "SIGNUP" && signupStep === "EMAIL_ID") && /* @__PURE__ */ React5.createElement("div", { className: "space-y-6" }, /* @__PURE__ */ React5.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ React5.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "Email ID"), /* @__PURE__ */ React5.createElement("input", { type: "email", value: emailId, onChange: (e) => setEmailId(cleanEmailId(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 bg-transparent text-sm border-b border-neutral-100 text-black outline-none focus:border-black transition-all duration-300", placeholder: "name@company.com" })), mode === "SIGNUP" && /* @__PURE__ */ React5.createElement("div", { className: "flex items-start gap-3 mt-4" }, /* @__PURE__ */ React5.createElement("input", { type: "checkbox", id: "zairus-terms", checked: agreedToTerms, onChange: (e) => setAgreedToTerms(e.target.checked), className: "mt-0.5 w-4 h-4 bg-white border-neutral-300 rounded text-black focus:ring-black cursor-pointer", required: true }), /* @__PURE__ */ React5.createElement("label", { htmlFor: "zairus-terms", className: "text-[11px] text-neutral-500 cursor-pointer leading-snug" }, "I agree to ", companyName, "'s ", /* @__PURE__ */ React5.createElement("a", { href: termsUrl, target: "_blank", rel: "noreferrer", className: "text-black underline " }, "Terms of Service"), " and ", /* @__PURE__ */ React5.createElement("a", { href: privacyUrl, target: "_blank", rel: "noreferrer", className: "text-black underline " }, "Privacy Policy"), "."))), /* @__PURE__ */ React5.createElement(ThreeDActionButton, { type: "submit", disabled: isContinueDisabled(), isLoading: isSubmitting, className: "w-full mt-10" }, "Continue"))), step === "OTP" && /* @__PURE__ */ React5.createElement("div", { className: "animate-in fade-in duration-300" }, /* @__PURE__ */ React5.createElement("div", { className: "text-center mb-10 mt-2" }, /* @__PURE__ */ React5.createElement("h2", { className: "text-xl text-black mb-2 tracking-tight" }, "Security Check"), /* @__PURE__ */ React5.createElement("p", { className: "text-[13px] text-neutral-500" }, userHas2FA ? "Enter the code from your authenticator app." : `Enter the code sent to ${emailId}`)), /* @__PURE__ */ React5.createElement("form", { className: "space-y-8", autoComplete: "off", onSubmit: (e) => {
+  } }, mode === "SIGNUP" && signupStep === "NAME" && requireNames && /* @__PURE__ */ React5.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ React5.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ React5.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "First Name"), /* @__PURE__ */ React5.createElement("input", { type: "text", value: firstName, onChange: (e) => setFirstName(cleanAlpha(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300", placeholder: "First name" })), /* @__PURE__ */ React5.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ React5.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "Last Name"), /* @__PURE__ */ React5.createElement("input", { type: "text", value: lastName, onChange: (e) => setLastName(cleanAlpha(e.target.value)), required: true, className: "w-full px-2 py-3 bg-transparent text-sm border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300", placeholder: "Last name" }))), mode === "SIGNUP" && signupStep === "ORGANIZATION" && requireOrganization && /* @__PURE__ */ React5.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ React5.createElement("div", { className: "space-y-1.5 relative" }, /* @__PURE__ */ React5.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "Organization Name"), /* @__PURE__ */ React5.createElement("input", { type: "text", value: orgName, onChange: (e) => setOrgName(cleanOrgName(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300", placeholder: "Acme Corporation" }))), (mode === "LOGIN" || mode === "SIGNUP" && signupStep === "EMAIL_ID") && /* @__PURE__ */ React5.createElement("div", { className: "space-y-6" }, /* @__PURE__ */ React5.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ React5.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "Email ID"), /* @__PURE__ */ React5.createElement("input", { type: "email", value: emailId, onChange: (e) => setEmailId(cleanEmailId(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 bg-transparent text-sm border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300", placeholder: "name@company.com" })), mode === "SIGNUP" && /* @__PURE__ */ React5.createElement("div", { className: "flex items-start gap-3 mt-4" }, /* @__PURE__ */ React5.createElement("input", { type: "checkbox", id: "zairus-terms", checked: agreedToTerms, onChange: (e) => setAgreedToTerms(e.target.checked), className: "mt-0.5 w-4 h-4 bg-white border-neutral-300 rounded text-black focus:ring-black cursor-pointer", required: true }), /* @__PURE__ */ React5.createElement("label", { htmlFor: "zairus-terms", className: "text-[11px] text-neutral-500 cursor-pointer leading-snug" }, "I agree to ", companyName, "'s ", /* @__PURE__ */ React5.createElement("a", { href: termsUrl, target: "_blank", rel: "noreferrer", className: "text-black underline " }, "Terms of Service"), " and ", /* @__PURE__ */ React5.createElement("a", { href: privacyUrl, target: "_blank", rel: "noreferrer", className: "text-black underline " }, "Privacy Policy"), "."))), /* @__PURE__ */ React5.createElement(ThreeDActionButton, { type: "submit", disabled: isContinueDisabled(), isLoading: isSubmitting, className: "w-full mt-10" }, "Continue"))), step === "OTP" && /* @__PURE__ */ React5.createElement("div", { className: "animate-in fade-in duration-300" }, /* @__PURE__ */ React5.createElement("div", { className: "text-center mb-10 mt-2" }, /* @__PURE__ */ React5.createElement("h2", { className: "text-xl text-black mb-2 tracking-tight" }, "Security Check"), /* @__PURE__ */ React5.createElement("p", { className: "text-[13px] text-neutral-500" }, userHas2FA ? "Enter the code from your authenticator app." : `Enter the code sent to ${emailId}`)), /* @__PURE__ */ React5.createElement("form", { className: "space-y-8", autoComplete: "off", onSubmit: (e) => {
     e.preventDefault();
     verifyOtpCode(otp.join(""));
   } }, /* @__PURE__ */ React5.createElement("div", { className: "flex justify-between gap-2", onPaste: handlePaste }, otp.map((digit, index) => /* @__PURE__ */ React5.createElement(
@@ -482,7 +482,7 @@ function AuthFormInner({
       onKeyDown: (e) => {
         if (e.key === "Backspace" && !otp[index] && index > 0) inputRefs.current[index - 1]?.focus();
       },
-      className: "w-10 h-12 text-center text-lg bg-transparent border-b-2 border-neutral-100 text-black outline-none focus:border-black transition-all duration-300"
+      className: "w-10 h-12 text-center text-lg bg-transparent border-b-2 border-neutral-200 text-black outline-none focus:border-black transition-all duration-300"
     }
   ))), /* @__PURE__ */ React5.createElement(ThreeDActionButton, { type: "submit", disabled: otp.join("").length < 6, isLoading: isSubmitting, className: "w-full" }, "Verify Code")), userHasPasskey && /* @__PURE__ */ React5.createElement("div", { className: "pt-6 " }, /* @__PURE__ */ React5.createElement(
     "button",
@@ -516,9 +516,9 @@ var Footer = ({
   const toggleColumn = (idx) => {
     setOpenCol(openCol === idx ? null : idx);
   };
-  return /* @__PURE__ */ React6.createElement("div", { className: "" }, topSection && topSection, /* @__PURE__ */ React6.createElement("footer", { className: "relative px-6 overflow-hidden flex flex-col" }, /* @__PURE__ */ React6.createElement("div", { className: "relative w-full max-w-7xl mx-auto z-20 flex flex-col" }, /* @__PURE__ */ React6.createElement("div", { className: "relative py-12 md:py-16" }, /* @__PURE__ */ React6.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start gap-12 lg:gap-16 mb-12 text-left" }, /* @__PURE__ */ React6.createElement("div", { className: "w-full lg:max-w-sm flex flex-col items-start justify-between shrink-0" }, /* @__PURE__ */ React6.createElement("div", { className: "flex items-center gap-4 mb-4" }, /* @__PURE__ */ React6.createElement("img", { src: "https://retinalabs.company/assets/images/ndpr.avif", alt: "NDPR", className: "w-28 h-auto object-contain filter grayscale opacity-80" }), /* @__PURE__ */ React6.createElement("img", { src: "https://retinalabs.company/assets/images/gdpr.avif", alt: "GDPR", className: "w-12 h-12 object-contain filter grayscale opacity-80" })), /* @__PURE__ */ React6.createElement("div", null, /* @__PURE__ */ React6.createElement("p", { className: "text-[11px]  text-neutral-600 leading-relaxed pr-4" }, description))), /* @__PURE__ */ React6.createElement("div", { className: "w-full lg:flex-1 lg:max-w-2xl" }, /* @__PURE__ */ React6.createElement("div", { className: "hidden md:grid grid-cols-2 gap-x-16 lg:gap-x-24 gap-y-12" }, columns.map((col, idx) => /* @__PURE__ */ React6.createElement("div", { key: idx, className: "flex flex-col" }, /* @__PURE__ */ React6.createElement("h4", { className: "text-[11px] tracking-[0.2em] text-black mb-6 " }, col.title), /* @__PURE__ */ React6.createElement("ul", { className: "space-y-4 text-[13px] text-neutral-500" }, col.links.map((link, lIdx) => /* @__PURE__ */ React6.createElement("li", { key: lIdx }, link.isExternal ? /* @__PURE__ */ React6.createElement("a", { href: link.href, target: "_blank", rel: "noopener noreferrer", className: "hover:text-black transition-colors block truncate" }, link.label) : /* @__PURE__ */ React6.createElement(Link3, { href: link.href, className: "hover:text-black transition-colors block truncate" }, link.label))))))), /* @__PURE__ */ React6.createElement("div", { className: "flex flex-col md:hidden w-full border-t border-neutral-100 mt-4" }, columns.map((col, idx) => {
+  return /* @__PURE__ */ React6.createElement("div", { className: "" }, topSection && topSection, /* @__PURE__ */ React6.createElement("footer", { className: "relative px-6 overflow-hidden flex flex-col" }, /* @__PURE__ */ React6.createElement("div", { className: "relative w-full max-w-7xl mx-auto z-20 flex flex-col" }, /* @__PURE__ */ React6.createElement("div", { className: "relative py-12 md:py-16" }, /* @__PURE__ */ React6.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start gap-12 lg:gap-16 mb-12 text-left" }, /* @__PURE__ */ React6.createElement("div", { className: "w-full lg:max-w-sm flex flex-col items-start justify-between shrink-0" }, /* @__PURE__ */ React6.createElement("div", { className: "flex items-center gap-4 mb-4" }, /* @__PURE__ */ React6.createElement("img", { src: "https://retinalabs.company/assets/images/ndpr.avif", alt: "NDPR", className: "w-28 h-auto object-contain filter grayscale opacity-80" }), /* @__PURE__ */ React6.createElement("img", { src: "https://retinalabs.company/assets/images/gdpr.avif", alt: "GDPR", className: "w-12 h-12 object-contain filter grayscale opacity-80" })), /* @__PURE__ */ React6.createElement("div", null, /* @__PURE__ */ React6.createElement("p", { className: "text-[11px]  text-neutral-600 leading-relaxed pr-4" }, description))), /* @__PURE__ */ React6.createElement("div", { className: "w-full lg:flex-1 lg:max-w-2xl" }, /* @__PURE__ */ React6.createElement("div", { className: "hidden md:grid grid-cols-2 gap-x-16 lg:gap-x-24 gap-y-12" }, columns.map((col, idx) => /* @__PURE__ */ React6.createElement("div", { key: idx, className: "flex flex-col" }, /* @__PURE__ */ React6.createElement("h4", { className: "text-[11px] tracking-[0.2em] text-black mb-6 " }, col.title), /* @__PURE__ */ React6.createElement("ul", { className: "space-y-4 text-[13px] text-neutral-500" }, col.links.map((link, lIdx) => /* @__PURE__ */ React6.createElement("li", { key: lIdx }, link.isExternal ? /* @__PURE__ */ React6.createElement("a", { href: link.href, target: "_blank", rel: "noopener noreferrer", className: "hover:text-black transition-colors block truncate" }, link.label) : /* @__PURE__ */ React6.createElement(Link3, { href: link.href, className: "hover:text-black transition-colors block truncate" }, link.label))))))), /* @__PURE__ */ React6.createElement("div", { className: "flex flex-col md:hidden w-full border-t border-neutral-200 mt-4" }, columns.map((col, idx) => {
     const isOpen = openCol === idx;
-    return /* @__PURE__ */ React6.createElement("div", { key: idx, className: "border-b border-neutral-100" }, /* @__PURE__ */ React6.createElement(
+    return /* @__PURE__ */ React6.createElement("div", { key: idx, className: "border-b border-neutral-200" }, /* @__PURE__ */ React6.createElement(
       "button",
       {
         onClick: () => toggleColumn(idx),
@@ -623,7 +623,7 @@ var ManagedToaster = () => {
   );
 };
 
-// src/components/ReusableInputs.tsx
+// src/components/TextInput.tsx
 import React9 from "react";
 var TextInput = ({
   label,
@@ -646,7 +646,7 @@ var TextInput = ({
     readOnly,
     autoComplete: "off",
     spellCheck: "false",
-    className: `w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-100 text-black transition-all outline-none focus:border-black disabled:opacity-50 ${readOnly ? "cursor-pointer" : ""}`
+    className: `w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-200 text-black transition-all outline-none focus:border-black disabled:opacity-50 ${readOnly ? "cursor-pointer" : ""}`
   }
 ));
 var NumberInput = ({
@@ -669,7 +669,7 @@ var NumberInput = ({
     disabled,
     autoComplete: "off",
     spellCheck: "false",
-    className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-100 text-black transition-all outline-none focus:border-black disabled:opacity-50"
+    className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-200 text-black transition-all outline-none focus:border-black disabled:opacity-50"
   }
 ));
 
@@ -861,7 +861,7 @@ var UniversalOrganizationPage = ({
       placeholder: "sovereignuser",
       maxLength: 30
     }
-  ), /* @__PURE__ */ React11.createElement("div", { className: "space-y-1.5 relative w-full" }, /* @__PURE__ */ React11.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block" }, "Wallet Username"), /* @__PURE__ */ React11.createElement("div", { className: "flex items-center relative w-full border-b border-neutral-100 focus-within:border-black transition-all duration-300" }, /* @__PURE__ */ React11.createElement(
+  ), /* @__PURE__ */ React11.createElement("div", { className: "space-y-1.5 relative w-full" }, /* @__PURE__ */ React11.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block" }, "Wallet Username"), /* @__PURE__ */ React11.createElement("div", { className: "flex items-center relative w-full border-b border-neutral-200 focus-within:border-black transition-all duration-300" }, /* @__PURE__ */ React11.createElement(
     "input",
     {
       type: "text",
@@ -1521,7 +1521,11 @@ import {
   CancelCircleIcon as CancelCircleIcon3,
   Loading03Icon as Loading03Icon5,
   Copy01Icon as Copy01Icon2,
-  ArrowLeft01Icon as ArrowLeft01Icon4
+  ArrowLeft01Icon as ArrowLeft01Icon4,
+  PlusSignIcon,
+  Upload01Icon,
+  Download01Icon,
+  ClipboardIcon
 } from "@hugeicons/core-free-icons";
 var PageSpinner3 = () => /* @__PURE__ */ React17.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Loading03Icon5, size: 32, className: "animate-spin mb-4 text-black" }));
 var truncateAddress2 = (ref) => {
@@ -1530,15 +1534,7 @@ var truncateAddress2 = (ref) => {
 };
 var WalletLogo = ({ src, alt, sizeClass = "w-10 h-10" }) => {
   const [isLoaded, setIsLoaded] = useState10(false);
-  return /* @__PURE__ */ React17.createElement("div", { className: `relative shrink-0 rounded-full bg-neutral-100 flex items-center justify-center overflow-hidden  ${sizeClass}` }, !isLoaded && /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Loading03Icon5, size: 16, className: "animate-spin text-neutral-400 absolute" }), /* @__PURE__ */ React17.createElement(
-    "img",
-    {
-      src,
-      alt,
-      onLoad: () => setIsLoaded(true),
-      className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}`
-    }
-  ));
+  return /* @__PURE__ */ React17.createElement("div", { className: `relative shrink-0 rounded-full bg-neutral-100 flex items-center justify-center overflow-hidden  ${sizeClass}` }, !isLoaded && /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Loading03Icon5, size: 16, className: "animate-spin text-neutral-400 absolute" }), /* @__PURE__ */ React17.createElement("img", { src, alt, onLoad: () => setIsLoaded(true), className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}` }));
 };
 var UniversalWalletPage = ({
   headerTitle,
@@ -1551,74 +1547,156 @@ var UniversalWalletPage = ({
   renderQrCode,
   onDownloadPayId,
   onCopyAddress,
-  onBack
+  onBack,
+  onGeneratePhrase,
+  onValidatePhrase,
+  onSaveLocally
 }) => {
   const onBackHandler = onBack ?? (() => {
     if (typeof window !== "undefined") window.history.back();
   });
   const [selectedWallet, setSelectedWallet] = useState10(null);
   const [localSearchQuery, setLocalSearchQuery] = useState10("");
+  const [addModalOpen, setAddModalOpen] = useState10(false);
+  const [importModalOpen, setImportModalOpen] = useState10(false);
+  const [flowStep, setFlowStep] = useState10(1);
+  const [generatedPhrase, setGeneratedPhrase] = useState10("");
+  const [hasBackedUp, setHasBackedUp] = useState10(false);
+  const [verifyWords, setVerifyWords] = useState10([]);
+  const [walletPassword, setWalletPassword] = useState10("");
+  const [importPhraseInput, setImportPhraseInput] = useState10("");
+  const [isProcessing, setIsProcessing] = useState10(false);
   const filteredWallets = wallets.filter((wallet) => {
     const q = localSearchQuery.toLowerCase();
     return wallet.name.toLowerCase().includes(q) || wallet.currency.toLowerCase().includes(q) || wallet.network.toLowerCase().includes(q);
   });
-  const handleCopy = (wallet) => {
-    if (onCopyAddress) onCopyAddress(wallet);
+  const handleCopy = (text, isWallet = true) => {
     if (typeof navigator !== "undefined" && navigator.clipboard) {
-      navigator.clipboard.writeText(wallet.address).catch(() => {
-      });
+      navigator.clipboard.writeText(text).then(() => {
+        toast5.success(isWallet ? "Address Copied" : "Phrase copied to clipboard");
+      }).catch(() => toast5.error("Failed to copy."));
     }
-    toast5.success("Copied");
   };
-  return /* @__PURE__ */ React17.createElement("div", null, /* @__PURE__ */ React17.createElement("div", { className: "mb-6 flex max-w-3xl w-full mx-auto items-center px-1" }, /* @__PURE__ */ React17.createElement(
-    "button",
-    {
-      onClick: onBackHandler,
-      className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] font-medium outline-none"
-    },
-    /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: ArrowLeft01Icon4, size: 16 }),
-    " Back"
-  )), /* @__PURE__ */ React17.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React17.createElement(ManagedToaster, null), !hideControls && /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col sm:flex-row mb-4 items-center justify-between gap-4 w-full" }, /* @__PURE__ */ React17.createElement("div", { className: "relative w-full sm:w-96" }, /* @__PURE__ */ React17.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Search01Icon2, size: 16, className: "text-neutral-400" })), /* @__PURE__ */ React17.createElement(
+  const handleDownloadTxt = () => {
+    const element = document.createElement("a");
+    const fileContent = `Aeona Self-Custodial Recovery Phrase:
+
+${generatedPhrase}
+
+CRITICAL WARNING: Keep this phrase completely secure. Anyone who has access to these words has full control over your wallet assets. Aeona cannot recover your wallet if this is lost.`;
+    const file = new Blob([fileContent], { type: "text/plain" });
+    element.href = URL.createObjectURL(file);
+    element.download = "aeona_recovery_phrase.txt";
+    document.body.appendChild(element);
+    element.click();
+    document.body.removeChild(element);
+    toast5.success("Phrase downloaded.");
+  };
+  const startWalletGeneration = () => {
+    if (onGeneratePhrase) {
+      const phrase = onGeneratePhrase();
+      setGeneratedPhrase(phrase);
+      setVerifyWords(Array(phrase.split(" ").length).fill(""));
+    }
+    setHasBackedUp(false);
+    setWalletPassword("");
+    setFlowStep(1);
+    setAddModalOpen(true);
+  };
+  const handleGridPaste = async () => {
+    try {
+      const text = await navigator.clipboard.readText();
+      const pastedWords = text.trim().split(/\s+/);
+      if (pastedWords.length > 0) {
+        const newWords = [...verifyWords];
+        for (let i = 0; i < pastedWords.length && i < newWords.length; i++) {
+          newWords[i] = pastedWords[i].toLowerCase();
+        }
+        setVerifyWords(newWords);
+        toast5.success("Phrase auto-filled.");
+      }
+    } catch (err) {
+      toast5.error("Clipboard access denied. Please allow clipboard access or type manually.");
+    }
+  };
+  const handleCreationNext = () => {
+    if (flowStep === 1) {
+      if (!hasBackedUp) return toast5.error("Please confirm you have backed up the phrase.");
+      setFlowStep(2);
+    } else if (flowStep === 2) {
+      const reconstructed = verifyWords.map((w) => w.trim()).join(" ");
+      if (reconstructed !== generatedPhrase.trim()) {
+        return toast5.error("Phrase verification failed. Ensure words are in the correct order.");
+      }
+      setFlowStep(3);
+    }
+  };
+  const startWalletImport = () => {
+    setImportPhraseInput("");
+    setWalletPassword("");
+    setFlowStep(1);
+    setImportModalOpen(true);
+  };
+  const handleImportNext = () => {
+    if (!importPhraseInput.trim()) return toast5.error("Please enter phrase.");
+    if (onValidatePhrase && !onValidatePhrase(importPhraseInput)) {
+      return toast5.error("Invalid recovery phrase. Please check your spelling.");
+    }
+    setFlowStep(2);
+  };
+  const handleSaveWallet = async (phrase) => {
+    if (!walletPassword || walletPassword.length < 6) return toast5.error("Password must be at least 6 characters.");
+    setIsProcessing(true);
+    try {
+      if (onSaveLocally) {
+        const res = await onSaveLocally(phrase, walletPassword);
+        if (res.success) {
+          toast5.success("Wallet secured locally.");
+          setAddModalOpen(false);
+          setImportModalOpen(false);
+        } else {
+          toast5.error("Failed to secure wallet.");
+        }
+      }
+    } finally {
+      setIsProcessing(false);
+    }
+  };
+  return /* @__PURE__ */ React17.createElement("div", null, /* @__PURE__ */ React17.createElement("div", { className: "mb-6 flex max-w-3xl w-full mx-auto items-center px-1" }, /* @__PURE__ */ React17.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] font-medium outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: ArrowLeft01Icon4, size: 16 }), " Back")), /* @__PURE__ */ React17.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React17.createElement(ManagedToaster, null), !hideControls && /* @__PURE__ */ React17.createElement("div", { className: "flex flex-row flex-nowrap mb-4 items-center justify-between gap-4 w-full" }, /* @__PURE__ */ React17.createElement("div", { className: "relative flex-1 min-w-0 max-w-full" }, /* @__PURE__ */ React17.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Search01Icon2, size: 16, className: "text-neutral-400" })), /* @__PURE__ */ React17.createElement(
     "input",
     {
       type: "text",
       placeholder: "Search wallets by name or network...",
       value: localSearchQuery,
       onChange: (e) => setLocalSearchQuery(e.target.value),
-      className: "w-full pl-10 pr-4 py-2 bg-white  rounded-full text-[13px] text-black placeholder-neutral-400 outline-none transition-all duration-300 focus:border-black"
+      className: "w-full pl-10 pr-4 py-2 bg-white rounded-full text-[13px] text-black placeholder-neutral-400 outline-none transition-colors focus:border-black"
     }
-  ))), /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, /* @__PURE__ */ React17.createElement("div", null, /* @__PURE__ */ React17.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, headerTitle), headerDescription && /* @__PURE__ */ React17.createElement("p", { className: "text-xs text-neutral-500" }, headerDescription))), /* @__PURE__ */ React17.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ React17.createElement(PageSpinner3, null) : /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React17.createElement("div", null, filteredWallets.length === 0 ? /* @__PURE__ */ React17.createElement("p", { className: "text-xs text-neutral-400 py-6 text-center" }, "No wallets found") : filteredWallets.map((wallet) => /* @__PURE__ */ React17.createElement(
-    "div",
-    {
-      key: wallet.id,
-      onClick: () => setSelectedWallet(wallet),
-      className: "flex items-center justify-between py-4 hover:bg-neutral-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl"
-    },
-    /* @__PURE__ */ React17.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React17.createElement(WalletLogo, { src: wallet.logoSrc, alt: wallet.name }), /* @__PURE__ */ React17.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-1" }, /* @__PURE__ */ React17.createElement("p", { className: "text-[13px] text-black truncate " }, wallet.name), /* @__PURE__ */ React17.createElement("p", { className: `text-[13px] text-neutral-500 truncate transition-all duration-300 ${hideBalanceAmounts ? "blur-sm opacity-40 select-none" : ""}` }, wallet.balance, " ", wallet.currency))),
-    /* @__PURE__ */ React17.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ React17.createElement("span", { className: "text-[10px] tracking-wide text-neutral-600 bg-neutral-100 px-2.5 py-1 rounded-full " }, wallet.network))
-  )))))), selectedWallet && /* @__PURE__ */ React17.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React17.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setSelectedWallet(null) }), /* @__PURE__ */ React17.createElement("div", { className: "relative w-full max-w-sm bg-white  rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[90vh]" }, /* @__PURE__ */ React17.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React17.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Wallet Details"), /* @__PURE__ */ React17.createElement("button", { onClick: () => setSelectedWallet(null), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: CancelCircleIcon3, size: 18 }))), /* @__PURE__ */ React17.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6 pt-6" }, /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col items-center justify-center mb-6" }, /* @__PURE__ */ React17.createElement(WalletLogo, { src: selectedWallet.logoSrc, alt: selectedWallet.name, sizeClass: "w-14 h-14 mb-4" }), /* @__PURE__ */ React17.createElement("h2", { className: `text-2xl text-black mb-2 transition-all duration-300  ${hideBalanceAmounts ? "blur-[6px] opacity-40 select-none" : ""}` }, selectedWallet.balance, " ", selectedWallet.currency), /* @__PURE__ */ React17.createElement("span", { className: "text-[9px] tracking-widest text-neutral-500 px-4 py-1.5 rounded-full border border-neutral-200  mt-1 " }, selectedWallet.network, " NETWORK")), renderQrCode && /* @__PURE__ */ React17.createElement("div", { className: "w-full flex justify-center mb-6 mix-blend-multiply" }, renderQrCode(selectedWallet)), /* @__PURE__ */ React17.createElement("div", { className: "grid grid-cols-1 gap-y-6 gap-x-4 mb-10" }, /* @__PURE__ */ React17.createElement("div", null, /* @__PURE__ */ React17.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Wallet Address"), /* @__PURE__ */ React17.createElement("div", { className: "flex items-center gap-2 min-w-0" }, /* @__PURE__ */ React17.createElement("span", { className: "text-[13px] text-black truncate min-w-0 block" }, truncateAddress2(selectedWallet.address)), /* @__PURE__ */ React17.createElement(
-    "button",
-    {
-      onClick: () => handleCopy(selectedWallet),
-      className: "text-neutral-400 hover:text-black transition-colors outline-none"
-    },
-    /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Copy01Icon2, size: 14 })
-  ))), /* @__PURE__ */ React17.createElement("div", null, /* @__PURE__ */ React17.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Wallet Name"), /* @__PURE__ */ React17.createElement("span", { className: "text-[13px] text-black" }, selectedWallet.name))), /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React17.createElement(
-    ThreeDActionButton,
-    {
-      onClick: () => onDownloadPayId && onDownloadPayId(selectedWallet),
-      isLoading: isGeneratingStatement,
-      className: "w-full"
-    },
-    "Generate Statement"
-  ), /* @__PURE__ */ React17.createElement(
-    "button",
+  )), /* @__PURE__ */ React17.createElement("div", { className: "flex items-center gap-3 w-auto pb-0 shrink-0" }, /* @__PURE__ */ React17.createElement("button", { onClick: startWalletGeneration, className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-neutral-500 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: PlusSignIcon, size: 16 })), /* @__PURE__ */ React17.createElement("button", { onClick: startWalletImport, className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-neutral-500 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Upload01Icon, size: 16 })))), /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, /* @__PURE__ */ React17.createElement("div", null, /* @__PURE__ */ React17.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, headerTitle), headerDescription && /* @__PURE__ */ React17.createElement("p", { className: "text-xs text-neutral-500" }, headerDescription))), /* @__PURE__ */ React17.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ React17.createElement(PageSpinner3, null) : /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React17.createElement("div", null, filteredWallets.length === 0 ? /* @__PURE__ */ React17.createElement("p", { className: "text-xs text-neutral-400 py-6 text-center" }, "No wallets found") : filteredWallets.map((wallet) => /* @__PURE__ */ React17.createElement("div", { key: wallet.id, onClick: () => setSelectedWallet(wallet), className: "flex items-center justify-between py-4 hover:bg-neutral-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl" }, /* @__PURE__ */ React17.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React17.createElement("div", { className: "relative shrink-0" }, /* @__PURE__ */ React17.createElement(WalletLogo, { src: wallet.logoSrc, alt: wallet.name }), wallet.networkLogoSrc && /* @__PURE__ */ React17.createElement("div", { className: "absolute -bottom-1 -right-1 w-4 h-4 rounded-full border border-white bg-white overflow-hidden shadow-sm" }, /* @__PURE__ */ React17.createElement("img", { src: wallet.networkLogoSrc, alt: "Network", className: "w-full h-full object-cover" }))), /* @__PURE__ */ React17.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-1" }, /* @__PURE__ */ React17.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React17.createElement("p", { className: "text-[13px] text-black truncate" }, wallet.name), wallet.isActive !== void 0 && /* @__PURE__ */ React17.createElement("span", { className: `text-[9px] px-1.5 py-0.5 rounded-sm tracking-widest uppercase ${wallet.isActive ? "bg-emerald-50 text-emerald-600" : "bg-red-50 text-red-600"}` }, wallet.isActive ? "Active" : "Inactive")), /* @__PURE__ */ React17.createElement("p", { className: `text-[13px] text-neutral-500 truncate transition-all duration-300 ${hideBalanceAmounts ? "blur-sm opacity-40 select-none" : ""}` }, wallet.balance, " ", wallet.currency))), /* @__PURE__ */ React17.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ React17.createElement("span", { className: "text-[10px] tracking-wide text-neutral-600 bg-neutral-100 px-2.5 py-1 rounded-full " }, wallet.network)))))))), addModalOpen && /* @__PURE__ */ React17.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React17.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isProcessing && setAddModalOpen(false) }), /* @__PURE__ */ React17.createElement("div", { className: "relative w-full max-w-md bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React17.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, /* @__PURE__ */ React17.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, flowStep === 1 ? "Secret Recovery Phrase" : flowStep === 2 ? "Verify Phrase" : "Secure Wallet"), /* @__PURE__ */ React17.createElement("button", { onClick: () => !isProcessing && setAddModalOpen(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: CancelCircleIcon3, size: 18 }))), /* @__PURE__ */ React17.createElement("div", { className: "p-6" }, flowStep === 1 && /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in" }, /* @__PURE__ */ React17.createElement(Banner, { type: "alert", title: "CRITICAL WARNING", message: "This phrase is the master key to your wallet. Anyone with these words has full control over your assets. Aeona cannot recover this if lost.", isDismissible: false }), /* @__PURE__ */ React17.createElement("div", { className: "grid grid-cols-3 gap-2 max-h-48 overflow-y-auto custom-scrollbar pr-1" }, generatedPhrase.split(" ").map((word, idx) => /* @__PURE__ */ React17.createElement("div", { key: idx, className: "flex items-center gap-1.5 bg-neutral-50  rounded-lg p-2 selection:bg-neutral-200" }, /* @__PURE__ */ React17.createElement("span", { className: "text-[10px] text-neutral-400 font-mono select-none w-4 text-right shrink-0" }, idx + 1, "."), /* @__PURE__ */ React17.createElement("span", { className: "text-[13px] text-black font-medium" }, word)))), /* @__PURE__ */ React17.createElement("div", { className: "flex items-center justify-between gap-2 0 pt-4" }, /* @__PURE__ */ React17.createElement("button", { onClick: () => handleCopy(generatedPhrase, false), className: "text-xs text-black flex items-center gap-1.5 hover:underline outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Copy01Icon2, size: 14 }), " Copy Phrase"), /* @__PURE__ */ React17.createElement("button", { onClick: handleDownloadTxt, className: "text-xs text-black flex items-center gap-1.5 hover:underline outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Download01Icon, size: 14 }), " Download .txt")), /* @__PURE__ */ React17.createElement("div", { className: "flex items-start gap-3  p-3 rounded-xl border border-neutral-200 mt-2" }, /* @__PURE__ */ React17.createElement("input", { type: "checkbox", id: "backup-confirm", checked: hasBackedUp, onChange: (e) => setHasBackedUp(e.target.checked), className: "mt-0.5 w-4 h-4 bg-white border-neutral-300 rounded text-black focus:ring-black cursor-pointer shrink-0" }), /* @__PURE__ */ React17.createElement("label", { htmlFor: "backup-confirm", className: "text-xs text-neutral-600 cursor-pointer leading-relaxed" }, "I have securely copied and stored my recovery phrase. I understand that if I lose it, my funds are gone forever.")), /* @__PURE__ */ React17.createElement(ThreeDActionButton, { onClick: handleCreationNext, className: "w-full mt-2" }, "Continue")), flowStep === 2 && /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ React17.createElement("p", { className: "text-sm text-neutral-600" }, "Please enter or paste your recovery phrase below to verify your backup."), /* @__PURE__ */ React17.createElement("div", { className: "grid grid-cols-3 gap-2 max-h-56 overflow-y-auto custom-scrollbar pr-1 pb-1" }, verifyWords.map((word, idx) => /* @__PURE__ */ React17.createElement("div", { key: idx, className: "flex items-center gap-1 bg-white border border-neutral-200 focus-within:border-black rounded-lg p-1.5 transition-colors" }, /* @__PURE__ */ React17.createElement("span", { className: "text-[10px] text-neutral-400 font-mono w-4 shrink-0 text-right select-none" }, idx + 1, "."), /* @__PURE__ */ React17.createElement(
+    "input",
     {
-      onClick: () => handleCopy(selectedWallet),
-      className: "w-full flex  items-center justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 outline-none text-xs tracking-wide transition-colors"
-    },
-    "Copy Wallet Address"
-  )))))));
+      type: "text",
+      value: word,
+      onChange: (e) => {
+        const newWords = [...verifyWords];
+        newWords[idx] = e.target.value.trim().toLowerCase();
+        setVerifyWords(newWords);
+      },
+      onPaste: (e) => {
+        const pastedData = e.clipboardData.getData("text").trim();
+        const pastedWords = pastedData.split(/\s+/);
+        if (pastedWords.length > 1) {
+          e.preventDefault();
+          const newWords = [...verifyWords];
+          for (let i = 0; i < pastedWords.length && i < newWords.length; i++) {
+            newWords[i] = pastedWords[i].toLowerCase();
+          }
+          setVerifyWords(newWords);
+          toast5.success("Phrase auto-filled.");
+        }
+      },
+      className: "w-full bg-transparent text-[13px] text-black outline-none min-w-0"
+    }
+  )))), /* @__PURE__ */ React17.createElement("div", { className: "flex items-center justify-between pt-4" }, /* @__PURE__ */ React17.createElement("button", { onClick: handleGridPaste, className: "text-xs text-black flex items-center gap-1.5 hover:underline outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: ClipboardIcon, size: 14 }), " Paste Phrase")), /* @__PURE__ */ React17.createElement(ThreeDActionButton, { onClick: handleCreationNext, className: "w-full mt-2" }, "Verify Backup")), flowStep === 3 && /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ React17.createElement(Banner, { type: "success", title: "Phrase Verified", message: "Your phrase is correct. Now set a local password to encrypt your wallet on this browser.", isDismissible: false }), /* @__PURE__ */ React17.createElement(TextInput, { label: "LOCAL PASSWORD", type: "password", value: walletPassword, onChange: setWalletPassword, placeholder: "Enter a strong password" }), /* @__PURE__ */ React17.createElement(ThreeDActionButton, { onClick: () => handleSaveWallet(generatedPhrase), isLoading: isProcessing, className: "w-full mt-2" }, "Encrypt & Save Wallet"))))), importModalOpen && /* @__PURE__ */ React17.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React17.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isProcessing && setImportModalOpen(false) }), /* @__PURE__ */ React17.createElement("div", { className: "relative w-full max-w-md bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React17.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React17.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Import Wallet"), /* @__PURE__ */ React17.createElement("button", { onClick: () => !isProcessing && setImportModalOpen(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: CancelCircleIcon3, size: 18 }))), /* @__PURE__ */ React17.createElement("div", { className: "p-6" }, flowStep === 1 && /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in" }, /* @__PURE__ */ React17.createElement("p", { className: "text-sm text-neutral-600" }, "Enter your 12 or 24-word recovery phrase to restore your wallet on this device."), /* @__PURE__ */ React17.createElement(TextInput, { label: "RECOVERY PHRASE", value: importPhraseInput, onChange: setImportPhraseInput, placeholder: "abandon abandon abandon..." }), /* @__PURE__ */ React17.createElement(ThreeDActionButton, { onClick: handleImportNext, className: "w-full mt-2" }, "Continue")), flowStep === 2 && /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ React17.createElement("p", { className: "text-sm text-neutral-600" }, "Set a local password to encrypt this wallet on this specific browser."), /* @__PURE__ */ React17.createElement(TextInput, { label: "LOCAL PASSWORD", type: "password", value: walletPassword, onChange: setWalletPassword, placeholder: "Enter a strong password" }), /* @__PURE__ */ React17.createElement(ThreeDActionButton, { onClick: () => handleSaveWallet(importPhraseInput), isLoading: isProcessing, className: "w-full mt-2" }, "Encrypt & Import Wallet"))))), selectedWallet && /* @__PURE__ */ React17.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React17.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setSelectedWallet(null) }), /* @__PURE__ */ React17.createElement("div", { className: "relative w-full max-w-sm bg-white  rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[90vh]" }, /* @__PURE__ */ React17.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React17.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Wallet Details"), /* @__PURE__ */ React17.createElement("button", { onClick: () => setSelectedWallet(null), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: CancelCircleIcon3, size: 18 }))), /* @__PURE__ */ React17.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6 pt-6" }, /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col items-center justify-center mb-6" }, /* @__PURE__ */ React17.createElement("div", { className: "relative mb-4" }, /* @__PURE__ */ React17.createElement(WalletLogo, { src: selectedWallet.logoSrc, alt: selectedWallet.name, sizeClass: "w-14 h-14" }), selectedWallet.networkLogoSrc && /* @__PURE__ */ React17.createElement("div", { className: "absolute -bottom-1 -right-1 w-5 h-5 rounded-full border border-white bg-white overflow-hidden shadow-sm" }, /* @__PURE__ */ React17.createElement("img", { src: selectedWallet.networkLogoSrc, alt: "Network", className: "w-full h-full object-cover" }))), /* @__PURE__ */ React17.createElement("h2", { className: `text-2xl text-black mb-2 transition-all duration-300  ${hideBalanceAmounts ? "blur-[6px] opacity-40 select-none" : ""}` }, selectedWallet.balance, " ", selectedWallet.currency), /* @__PURE__ */ React17.createElement("span", { className: "text-[9px] tracking-widest text-neutral-500 px-4 py-1.5 rounded-full border border-neutral-200 mt-1 " }, selectedWallet.network, " NETWORK")), renderQrCode && /* @__PURE__ */ React17.createElement("div", { className: "w-full flex justify-center mb-6 mix-blend-multiply" }, renderQrCode(selectedWallet)), /* @__PURE__ */ React17.createElement("div", { className: "grid grid-cols-1 gap-y-6 gap-x-4 mb-10" }, /* @__PURE__ */ React17.createElement("div", null, /* @__PURE__ */ React17.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Wallet Address"), /* @__PURE__ */ React17.createElement("div", { className: "flex items-center gap-2 min-w-0" }, /* @__PURE__ */ React17.createElement("span", { className: "text-[13px] text-black truncate min-w-0 block" }, truncateAddress2(selectedWallet.address)), /* @__PURE__ */ React17.createElement("button", { onClick: () => handleCopy(selectedWallet.address, true), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Copy01Icon2, size: 14 })))), /* @__PURE__ */ React17.createElement("div", null, /* @__PURE__ */ React17.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Wallet Status"), selectedWallet.isActive ? /* @__PURE__ */ React17.createElement("span", { className: "text-[13px] text-emerald-600 font-medium" }, "Active on this device") : /* @__PURE__ */ React17.createElement("span", { className: "text-[13px] text-red-600 font-medium" }, "Inactive - Requires Import"))), /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React17.createElement(ThreeDActionButton, { onClick: () => onDownloadPayId && onDownloadPayId(selectedWallet), isLoading: isGeneratingStatement, className: "w-full" }, "Generate Statement"), /* @__PURE__ */ React17.createElement("button", { onClick: () => handleCopy(selectedWallet.address, true), className: "w-full flex items-center justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 outline-none text-xs tracking-wide transition-colors" }, "Copy Wallet Address")))))));
 };
 
 // src/components/UniversalCardPage.tsx
@@ -2808,7 +2886,7 @@ var UniversalSecurityPage = ({
       toggleLoading: isPasskeyLoading,
       isLast: true
     }
-  ))), show2FASetupModal && /* @__PURE__ */ React27.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React27.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isSubmitting && setShow2FASetupModal(false) }), /* @__PURE__ */ React27.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[90vh]" }, /* @__PURE__ */ React27.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React27.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Enable 2FA"), /* @__PURE__ */ React27.createElement("button", { onClick: () => !isSubmitting && setShow2FASetupModal(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon: CancelCircleIcon6, size: 18 }))), /* @__PURE__ */ React27.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6 pt-2" }, /* @__PURE__ */ React27.createElement("div", { className: "w-full flex justify-center mb-6 mix-blend-multiply" }, twoFaQr ? /* @__PURE__ */ React27.createElement("img", { src: twoFaQr, alt: "2FA QR Code", className: "w-40 h-40 object-contain rounded-xl border border-neutral-100 p-2" }) : /* @__PURE__ */ React27.createElement("div", { className: "w-40 h-40 bg-neutral-100 rounded-xl flex items-center justify-center animate-pulse" })), /* @__PURE__ */ React27.createElement("div", { className: "grid grid-cols-1 gap-y-6 gap-x-4 mb-8" }, /* @__PURE__ */ React27.createElement("div", null, /* @__PURE__ */ React27.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2 uppercase" }, "Setup Key"), /* @__PURE__ */ React27.createElement("div", { className: "flex items-center gap-2 min-w-0 bg-neutral-50 px-3 py-2.5 rounded-xl " }, /* @__PURE__ */ React27.createElement("span", { className: "text-[13px] font-mono tracking-widest text-black truncate min-w-0 block flex-1" }, twoFaSecret), /* @__PURE__ */ React27.createElement(
+  ))), show2FASetupModal && /* @__PURE__ */ React27.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React27.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isSubmitting && setShow2FASetupModal(false) }), /* @__PURE__ */ React27.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[90vh]" }, /* @__PURE__ */ React27.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React27.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Enable 2FA"), /* @__PURE__ */ React27.createElement("button", { onClick: () => !isSubmitting && setShow2FASetupModal(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon: CancelCircleIcon6, size: 18 }))), /* @__PURE__ */ React27.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6 pt-2" }, /* @__PURE__ */ React27.createElement("div", { className: "w-full flex justify-center mb-6 mix-blend-multiply" }, twoFaQr ? /* @__PURE__ */ React27.createElement("img", { src: twoFaQr, alt: "2FA QR Code", className: "w-40 h-40 object-contain rounded-xl border border-neutral-200 p-2" }) : /* @__PURE__ */ React27.createElement("div", { className: "w-40 h-40 bg-neutral-100 rounded-xl flex items-center justify-center animate-pulse" })), /* @__PURE__ */ React27.createElement("div", { className: "grid grid-cols-1 gap-y-6 gap-x-4 mb-8" }, /* @__PURE__ */ React27.createElement("div", null, /* @__PURE__ */ React27.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2 uppercase" }, "Setup Key"), /* @__PURE__ */ React27.createElement("div", { className: "flex items-center gap-2 min-w-0 bg-neutral-50 px-3 py-2.5 rounded-xl " }, /* @__PURE__ */ React27.createElement("span", { className: "text-[13px] font-mono tracking-widest text-black truncate min-w-0 block flex-1" }, twoFaSecret), /* @__PURE__ */ React27.createElement(
     "button",
     {
       type: "button",
@@ -2836,7 +2914,7 @@ var UniversalSecurityPage = ({
           inputRefs.current[index - 1]?.focus();
         }
       },
-      className: "w-8 h-12 text-center text-lg bg-transparent border-b-2 border-neutral-100 text-black outline-none focus:border-black transition-all duration-300"
+      className: "w-8 h-12 text-center text-lg bg-transparent border-b-2 border-neutral-200 text-black outline-none focus:border-black transition-all duration-300"
     }
   ))), /* @__PURE__ */ React27.createElement(
     ThreeDActionButton,
@@ -2876,7 +2954,7 @@ var UniversalSecurityPage = ({
           inputRefs.current[index - 1]?.focus();
         }
       },
-      className: "w-10 h-12 text-center text-lg bg-transparent border-b-2 border-neutral-100 text-black outline-none focus:border-black transition-all duration-300"
+      className: "w-10 h-12 text-center text-lg bg-transparent border-b-2 border-neutral-200 text-black outline-none focus:border-black transition-all duration-300"
     }
   ))), /* @__PURE__ */ React27.createElement(
     ThreeDActionButton,
@@ -3094,7 +3172,7 @@ var ManagedDocument = ({
         style: isAnimating ? { animationIterationCount: 1 } : {}
       },
       title
-    )), sections.map((section, index) => /* @__PURE__ */ React30.createElement("div", { key: index, className: "relative px-5 md:px-12 py-8 md:py-10" }, section.heading && /* @__PURE__ */ React30.createElement("p", { className: " text-[11px] tracking-[0.2em] text-black mb-4 text-left " }, section.heading), section.paragraphs && section.paragraphs.length > 0 && /* @__PURE__ */ React30.createElement("div", { className: "text-[14px] leading-[1.8] text-neutral-700 space-y-4 text-left " }, section.paragraphs.map((text, pIndex) => /* @__PURE__ */ React30.createElement("p", { key: pIndex }, text))), section.quote && /* @__PURE__ */ React30.createElement("div", { className: `border-neutral-100 border rounded-xl p-6 ${section.paragraphs && section.paragraphs.length > 0 ? "mt-6" : ""}` }, /* @__PURE__ */ React30.createElement("p", { className: "text-neutral-900 text-[14px] md:text-[14px] leading-relaxed" }, '"', section.quote, '"')))), (contactText || contactEmail) && /* @__PURE__ */ React30.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10 pb-12 md:pb-14" }, /* @__PURE__ */ React30.createElement("p", { className: "text-[11px] text-neutral-600 text-left" }, contactText, contactEmail && /* @__PURE__ */ React30.createElement(
+    )), sections.map((section, index) => /* @__PURE__ */ React30.createElement("div", { key: index, className: "relative px-5 md:px-12 py-8 md:py-10" }, section.heading && /* @__PURE__ */ React30.createElement("p", { className: " text-[11px] tracking-[0.2em] text-black mb-4 text-left " }, section.heading), section.paragraphs && section.paragraphs.length > 0 && /* @__PURE__ */ React30.createElement("div", { className: "text-[14px] leading-[1.8] text-neutral-700 space-y-4 text-left " }, section.paragraphs.map((text, pIndex) => /* @__PURE__ */ React30.createElement("p", { key: pIndex }, text))), section.quote && /* @__PURE__ */ React30.createElement("div", { className: `border-neutral-200 border rounded-xl p-6 ${section.paragraphs && section.paragraphs.length > 0 ? "mt-6" : ""}` }, /* @__PURE__ */ React30.createElement("p", { className: "text-neutral-900 text-[14px] md:text-[14px] leading-relaxed" }, '"', section.quote, '"')))), (contactText || contactEmail) && /* @__PURE__ */ React30.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10 pb-12 md:pb-14" }, /* @__PURE__ */ React30.createElement("p", { className: "text-[11px] text-neutral-600 text-left" }, contactText, contactEmail && /* @__PURE__ */ React30.createElement(
       "a",
       {
         href: `mailto:${contactEmail}`,
@@ -3244,7 +3322,7 @@ var ManagedPricingBlock = ({
       Link7,
       {
         href: plan.ctaHref,
-        className: "w-full py-2.5 px-5 rounded-full border border-neutral-100 text-center text-black text-xs hover:bg-neutral-50 transition-colors mb-6 outline-none block"
+        className: "w-full py-2.5 px-5 rounded-full border border-neutral-200 text-center text-black text-xs hover:bg-neutral-50 transition-colors mb-6 outline-none block"
       },
       plan.ctaText
     ),
@@ -3382,7 +3460,7 @@ var ManagedNewsletterSplitBlock = ({
         backgroundRepeat: "repeat"
       }
     }
-  ), /* @__PURE__ */ React35.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React35.createElement("div", { className: "mb-10 border-b border-neutral-100 pb-8 text-center md:text-left" }, tagline && /* @__PURE__ */ React35.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 " }, tagline), /* @__PURE__ */ React35.createElement("h1", { className: "  text-3xl mt-4 text-black tracking-tight mb-4" }, title), subtitle && /* @__PURE__ */ React35.createElement("p", { className: "text-[11px] tracking-[0.2em] text-neutral-500 " }, subtitle)), /* @__PURE__ */ React35.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 mb-10 text-center md:text-left" }, description), children && /* @__PURE__ */ React35.createElement("div", { className: "mb-8 text-left" }, children), /* @__PURE__ */ React35.createElement("div", { className: "text-center md:text-left mt-10 space-y-6" }, dividerText && /* @__PURE__ */ React35.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React35.createElement("div", { className: "grow h-px bg-neutral-100" }), /* @__PURE__ */ React35.createElement("span", { className: "shrink mx-4 text-[11px] tracking-[0.2em] text-neutral-400 " }, dividerText), /* @__PURE__ */ React35.createElement("div", { className: "grow h-px bg-neutral-100" })), ctaText && ctaHref && /* @__PURE__ */ React35.createElement("div", { className: "w-full *:w-full" }, /* @__PURE__ */ React35.createElement(
+  ), /* @__PURE__ */ React35.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React35.createElement("div", { className: "mb-10 border-b border-neutral-200 pb-8 text-center md:text-left" }, tagline && /* @__PURE__ */ React35.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 " }, tagline), /* @__PURE__ */ React35.createElement("h1", { className: "  text-3xl mt-4 text-black tracking-tight mb-4" }, title), subtitle && /* @__PURE__ */ React35.createElement("p", { className: "text-[11px] tracking-[0.2em] text-neutral-500 " }, subtitle)), /* @__PURE__ */ React35.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 mb-10 text-center md:text-left" }, description), children && /* @__PURE__ */ React35.createElement("div", { className: "mb-8 text-left" }, children), /* @__PURE__ */ React35.createElement("div", { className: "text-center md:text-left mt-10 space-y-6" }, dividerText && /* @__PURE__ */ React35.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React35.createElement("div", { className: "grow h-px bg-neutral-100" }), /* @__PURE__ */ React35.createElement("span", { className: "shrink mx-4 text-[11px] tracking-[0.2em] text-neutral-400 " }, dividerText), /* @__PURE__ */ React35.createElement("div", { className: "grow h-px bg-neutral-100" })), ctaText && ctaHref && /* @__PURE__ */ React35.createElement("div", { className: "w-full *:w-full" }, /* @__PURE__ */ React35.createElement(
     ThreeDButton,
     {
       href: ctaHref,
@@ -3442,7 +3520,7 @@ var PortfolioHero = ({
       ref: heroContentRef,
       className: "w-full opacity-0 translate-y-5 transition-all duration-1000 ease-out relative z-10"
     },
-    /* @__PURE__ */ React36.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center gap-5 sm:gap-8 mb-10" }, /* @__PURE__ */ React36.createElement("div", { className: "relative w-20 h-20 sm:w-32 sm:h-32 rounded-full overflow-hidden border border-neutral-100 shrink-0 shadow-sm" }, /* @__PURE__ */ React36.createElement(
+    /* @__PURE__ */ React36.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center gap-5 sm:gap-8 mb-10" }, /* @__PURE__ */ React36.createElement("div", { className: "relative w-20 h-20 sm:w-32 sm:h-32 rounded-full overflow-hidden border border-neutral-200 shrink-0 shadow-sm" }, /* @__PURE__ */ React36.createElement(
       Image8,
       {
         src: imageSrc,
@@ -3701,7 +3779,7 @@ var ContentGridBlock = ({
   middleBottomCard,
   rightCards
 }) => {
-  return /* @__PURE__ */ React40.createElement("section", { className: " w-full flex justify-center z-10 relative" }, /* @__PURE__ */ React40.createElement("div", { className: "max-w-300 w-full px-4 md:px-8 flex flex-col gap-12" }, /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-6 w-full" }, /* @__PURE__ */ React40.createElement("h2", { className: "text-3xl   tracking-tight text-black leading-[1.15] max-w-lg" }, header.titlePrefix, " ", /* @__PURE__ */ React40.createElement("span", { className: "gradient-text" }, header.highlightText))), /* @__PURE__ */ React40.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" }, /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col justify-end" }, /* @__PURE__ */ React40.createElement("div", { className: "bg-black rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ React40.createElement("p", { className: "text-[17px] text-white leading-snug  mb-4" }, leftCard.mainText), leftCard.tag && /* @__PURE__ */ React40.createElement("span", { className: "mb-auto text-[11px]  text-neutral-200  tracking-widest" }, leftCard.tag), /* @__PURE__ */ React40.createElement("div", { className: "flex items-center justify-between mt-8" }, /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("h4", { className: "text-[15px]  text-white" }, leftCard.title), /* @__PURE__ */ React40.createElement("p", { className: "text-[13px] text-neutral-300" }, leftCard.subtitle)), /* @__PURE__ */ React40.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ React40.createElement(Image12, { src: leftCard.thumbnailSrc, alt: leftCard.title, fill: true, className: "object-cover" }))))), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ React40.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col relative h-75" }, /* @__PURE__ */ React40.createElement("div", { className: "absolute top-6 right-6 flex flex-col items-end gap-1" }, /* @__PURE__ */ React40.createElement("span", { className: "text-[11px] text-neutral-400  tracking-wide" }, middleTopCard.topRightLabel), /* @__PURE__ */ React40.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React40.createElement("div", { className: "flex -space-x-2" }, middleTopCard.topRightAvatars.map((src, i) => /* @__PURE__ */ React40.createElement("div", { key: i, className: "w-7 h-7 rounded-full border-2 border-white overflow-hidden relative z-10" }, /* @__PURE__ */ React40.createElement(Image12, { src, alt: "Avatar", fill: true, className: "object-cover", sizes: "28px" })))), /* @__PURE__ */ React40.createElement("span", { className: "text-sm  text-neutral-500" }, middleTopCard.topRightCount))), /* @__PURE__ */ React40.createElement("div", { className: "grow flex flex-col justify-center items-center py-6" }, /* @__PURE__ */ React40.createElement("div", { className: "px-5 py-2 rounded-full bg-neutral-50/50 border border-neutral-100 text-[13px] text-neutral-600" }, middleTopCard.badgePrefix, " ", /* @__PURE__ */ React40.createElement("span", { className: " text-black" }, middleTopCard.badgeHighlight), middleTopCard.badgeSuffix)), /* @__PURE__ */ React40.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ React40.createElement("p", { className: "text-[11px] text-neutral-400  tracking-wide mb-1" }, middleTopCard.title), /* @__PURE__ */ React40.createElement("p", { className: "text-[14px] text-black  leading-snug pr-4" }, middleTopCard.description))), /* @__PURE__ */ React40.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ React40.createElement("div", { className: "flex justify-between items-start mb-6" }, /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("h4", { className: "text-[15px]  text-black leading-tight" }, middleBottomCard.title), /* @__PURE__ */ React40.createElement("p", { className: "text-[13px] text-neutral-400" }, middleBottomCard.subtitle)), /* @__PURE__ */ React40.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ React40.createElement(Image12, { src: middleBottomCard.thumbnailSrc, alt: middleBottomCard.title, fill: true, className: "object-cover" }))), /* @__PURE__ */ React40.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ React40.createElement("p", { className: "text-[16px] text-black leading-snug  mb-4" }, middleBottomCard.mainText), middleBottomCard.tag && /* @__PURE__ */ React40.createElement("span", { className: "text-[11px]  text-neutral-400  tracking-widest" }, middleBottomCard.tag)))), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-6" }, rightCards.slice(0, 2).map((card, idx) => /* @__PURE__ */ React40.createElement("div", { key: idx, className: "relative w-full h-80  text-white rounded-3xl overflow-hidden group" }, /* @__PURE__ */ React40.createElement(
+  return /* @__PURE__ */ React40.createElement("section", { className: " w-full flex justify-center z-10 relative" }, /* @__PURE__ */ React40.createElement("div", { className: "max-w-300 w-full px-4 md:px-8 flex flex-col gap-12" }, /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-6 w-full" }, /* @__PURE__ */ React40.createElement("h2", { className: "text-3xl   tracking-tight text-black leading-[1.15] max-w-lg" }, header.titlePrefix, " ", /* @__PURE__ */ React40.createElement("span", { className: "gradient-text" }, header.highlightText))), /* @__PURE__ */ React40.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" }, /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col justify-end" }, /* @__PURE__ */ React40.createElement("div", { className: "bg-black rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ React40.createElement("p", { className: "text-[17px] text-white leading-snug  mb-4" }, leftCard.mainText), leftCard.tag && /* @__PURE__ */ React40.createElement("span", { className: "mb-auto text-[11px]  text-neutral-200  tracking-widest" }, leftCard.tag), /* @__PURE__ */ React40.createElement("div", { className: "flex items-center justify-between mt-8" }, /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("h4", { className: "text-[15px]  text-white" }, leftCard.title), /* @__PURE__ */ React40.createElement("p", { className: "text-[13px] text-neutral-300" }, leftCard.subtitle)), /* @__PURE__ */ React40.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ React40.createElement(Image12, { src: leftCard.thumbnailSrc, alt: leftCard.title, fill: true, className: "object-cover" }))))), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ React40.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col relative h-75" }, /* @__PURE__ */ React40.createElement("div", { className: "absolute top-6 right-6 flex flex-col items-end gap-1" }, /* @__PURE__ */ React40.createElement("span", { className: "text-[11px] text-neutral-400  tracking-wide" }, middleTopCard.topRightLabel), /* @__PURE__ */ React40.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React40.createElement("div", { className: "flex -space-x-2" }, middleTopCard.topRightAvatars.map((src, i) => /* @__PURE__ */ React40.createElement("div", { key: i, className: "w-7 h-7 rounded-full border-2 border-white overflow-hidden relative z-10" }, /* @__PURE__ */ React40.createElement(Image12, { src, alt: "Avatar", fill: true, className: "object-cover", sizes: "28px" })))), /* @__PURE__ */ React40.createElement("span", { className: "text-sm  text-neutral-500" }, middleTopCard.topRightCount))), /* @__PURE__ */ React40.createElement("div", { className: "grow flex flex-col justify-center items-center py-6" }, /* @__PURE__ */ React40.createElement("div", { className: "px-5 py-2 rounded-full bg-neutral-50/50 border border-neutral-200 text-[13px] text-neutral-600" }, middleTopCard.badgePrefix, " ", /* @__PURE__ */ React40.createElement("span", { className: " text-black" }, middleTopCard.badgeHighlight), middleTopCard.badgeSuffix)), /* @__PURE__ */ React40.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ React40.createElement("p", { className: "text-[11px] text-neutral-400  tracking-wide mb-1" }, middleTopCard.title), /* @__PURE__ */ React40.createElement("p", { className: "text-[14px] text-black  leading-snug pr-4" }, middleTopCard.description))), /* @__PURE__ */ React40.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ React40.createElement("div", { className: "flex justify-between items-start mb-6" }, /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("h4", { className: "text-[15px]  text-black leading-tight" }, middleBottomCard.title), /* @__PURE__ */ React40.createElement("p", { className: "text-[13px] text-neutral-400" }, middleBottomCard.subtitle)), /* @__PURE__ */ React40.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ React40.createElement(Image12, { src: middleBottomCard.thumbnailSrc, alt: middleBottomCard.title, fill: true, className: "object-cover" }))), /* @__PURE__ */ React40.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ React40.createElement("p", { className: "text-[16px] text-black leading-snug  mb-4" }, middleBottomCard.mainText), middleBottomCard.tag && /* @__PURE__ */ React40.createElement("span", { className: "text-[11px]  text-neutral-400  tracking-widest" }, middleBottomCard.tag)))), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-6" }, rightCards.slice(0, 2).map((card, idx) => /* @__PURE__ */ React40.createElement("div", { key: idx, className: "relative w-full h-80  text-white rounded-3xl overflow-hidden group" }, /* @__PURE__ */ React40.createElement(
     ImageWithLoader2,
     {
       src: card.bgImageSrc,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@retinalabsllc/zairusjs",
-  "version": "11.0.5",
+  "version": "11.0.15",
   "description": "A perceptive, Ai data driven Next.js UI component library.",
   "author": "Retina Labs Company",
   "license": "MIT",