@aurum-sdk/core 0.1.2 → 0.1.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (20) hide show
  1. package/README.md +1 -1
  2. package/dist/{chunk-EQEZQPHH.mjs → chunk-3TZNNET3.mjs} +31 -15
  3. package/dist/chunk-3TZNNET3.mjs.map +1 -0
  4. package/dist/{chunk-LTGSWCPM.js → chunk-F4RYBD6L.js} +31 -15
  5. package/dist/chunk-F4RYBD6L.js.map +1 -0
  6. package/dist/index.css +11 -2
  7. package/dist/index.css.map +1 -1
  8. package/dist/index.d.mts +1 -1
  9. package/dist/index.d.ts +1 -1
  10. package/dist/index.js +60 -60
  11. package/dist/index.js.map +1 -1
  12. package/dist/index.mjs +3 -3
  13. package/dist/index.mjs.map +1 -1
  14. package/dist/widgets.css +11 -2
  15. package/dist/widgets.css.map +1 -1
  16. package/dist/widgets.js +13 -13
  17. package/dist/widgets.mjs +1 -1
  18. package/package.json +3 -3
  19. package/dist/chunk-EQEZQPHH.mjs.map +0 -1
  20. package/dist/chunk-LTGSWCPM.js.map +0 -1
package/README.md CHANGED
@@ -45,7 +45,7 @@ import { Aurum } from '@aurum-sdk/core';
45
45
  const aurum = new Aurum({
46
46
  brand: { appName: 'Your App Name' },
47
47
  wallets: {
48
- email: { projectId: 'cdp-project-id' },
48
+ embedded: { projectId: 'cdp-project-id' },
49
49
  walletConnect: { projectId: 'reown-project-id' },
50
50
  },
51
51
  });
package/dist/{chunk-EQEZQPHH.mjs → chunk-3TZNNET3.mjs} RENAMED
@@ -756,20 +756,26 @@ function initSentry(enabled = true) {
756
756
  Sentry.init({
757
757
  dsn: "https://0bb16fd7057ac7b45ae0ab416cdbea8b@o4505953815494656.ingest.us.sentry.io/4509747448184832",
758
758
  environment: getEnvironment(),
759
- release: `@aurum-sdk/core@${"0.1.2"}`,
759
+ release: `@aurum-sdk/core@${"0.1.3"}`,
760
760
  sendDefaultPii: false,
761
761
  enableLogs: true
762
762
  });
763
763
  }
764
+ function getUrl() {
765
+ if (typeof window !== "undefined") {
766
+ return window.location.href;
767
+ }
768
+ return void 0;
769
+ }
764
770
  var sentryLogger = {
765
771
  info: (message, attributes) => {
766
- if (telemetryEnabled) Sentry.logger.info(message, attributes);
772
+ if (telemetryEnabled) Sentry.logger.info(message, { url: getUrl(), ...attributes });
767
773
  },
768
774
  warn: (message, attributes) => {
769
- if (telemetryEnabled) Sentry.logger.warn(message, attributes);
775
+ if (telemetryEnabled) Sentry.logger.warn(message, { url: getUrl(), ...attributes });
770
776
  },
771
777
  error: (message, attributes) => {
772
- if (telemetryEnabled) Sentry.logger.error(message, attributes);
778
+ if (telemetryEnabled) Sentry.logger.error(message, { url: getUrl(), ...attributes });
773
779
  }
774
780
  };
775
781
 
@@ -1008,6 +1014,8 @@ var GridWalletButton = ({
1008
1014
  onClick: () => connectWallet(wallet),
1009
1015
  "aria-label": `Connect with ${wallet.name}`,
1010
1016
  title: wallet.name,
1017
+ size: "xs",
1018
+ style: { borderRadius: "var(--aurum-border-radius-md)" },
1011
1019
  children: /* @__PURE__ */ jsx20(WalletLogoWrapper, { id: wallet.id, size: 44, variant: "icon" })
1012
1020
  }
1013
1021
  );
@@ -1015,17 +1023,25 @@ var GridWalletButton = ({
1015
1023
 
1016
1024
  // src/components/ConnectModal/WalletListGrid.tsx
1017
1025
  import { jsx as jsx21 } from "react/jsx-runtime";
1018
- var getGridColumns = (walletCount) => {
1019
- if (walletCount <= 2) return 2;
1020
- if (walletCount === 3) return 3;
1021
- if (walletCount === 5) return 3;
1022
- if (walletCount === 6) return 3;
1023
- return 4;
1024
- };
1026
+ var MAX_PER_ROW = 4;
1027
+ function splitIntoRows(items) {
1028
+ if (items.length === 0) return [];
1029
+ const numRows = Math.ceil(items.length / MAX_PER_ROW);
1030
+ const basePerRow = Math.floor(items.length / numRows);
1031
+ const remainder = items.length % numRows;
1032
+ const rows = [];
1033
+ let index = 0;
1034
+ for (let i = 0; i < numRows; i++) {
1035
+ const rowSize = basePerRow + (i < remainder ? 1 : 0);
1036
+ rows.push(items.slice(index, index + rowSize));
1037
+ index += rowSize;
1038
+ }
1039
+ return rows;
1040
+ }
1025
1041
  var WalletListGrid = ({ wallets }) => {
1026
1042
  const { connectWallet } = useConnectModal();
1027
- const columns = getGridColumns(wallets.length);
1028
- return /* @__PURE__ */ jsx21("div", { className: "aurum-wallet-grid", style: { "--grid-columns": columns }, children: wallets.map((wallet) => /* @__PURE__ */ jsx21(GridWalletButton, { wallet, connectWallet }, wallet.id)) });
1043
+ const rows = splitIntoRows(wallets);
1044
+ return /* @__PURE__ */ jsx21("div", { className: "aurum-wallet-grid", children: rows.map((row, rowIndex) => /* @__PURE__ */ jsx21("div", { className: "aurum-wallet-grid-row", children: row.map((wallet) => /* @__PURE__ */ jsx21(GridWalletButton, { wallet, connectWallet }, wallet.id)) }, rowIndex)) });
1029
1045
  };
1030
1046
 
1031
1047
  // src/components/ConnectModal/WalletListStacked.tsx
@@ -2381,7 +2397,7 @@ var ConnectPages = () => {
2381
2397
  };
2382
2398
 
2383
2399
  // src/styles/bundledStyles.ts
2384
- var bundledStyles = "/* ui/globals.css */\n/* ============================================\n AURUM SDK - DESIGN TOKEN SYSTEM\n ============================================\n\n Google Fonts:\n - Noto Sans: 400, 500, 600, 700\n ============================================ */\n\n@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');\n\n/* ============================================\n External variables (injected by createShadowRoot.ts):\n - --aurum-primary-color: Brand color from dapp\n - --aurum-border-radius-*: Radius scale tokens\n - --aurum-modal-z-index: Modal z-index\n - --aurum-font-family: Font family from dapp\n ============================================ */\n\n/* Base reset styles for Shadow DOM */\n:host {\n all: initial;\n}\n\n*,\n*::before,\n*::after {\n box-sizing: border-box;\n}\n\n/* Ensure form elements inherit font from parent */\ninput,\nbutton,\ntextarea,\nselect {\n font-family: inherit;\n}\n\n.aurum-sdk {\n /* ==========================================\n TYPOGRAPHY\n ========================================== */\n font-family: var(--aurum-font-family);\n font-size: 1rem;\n line-height: 1.5;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n\n /* Font weights */\n --font-normal: 400;\n --font-medium: 500;\n --font-semibold: 600;\n --font-bold: 700;\n\n /* ==========================================\n TRANSITIONS\n ========================================== */\n --duration-fast: 100ms;\n --duration-normal: 200ms;\n --duration-slow: 300ms;\n --ease-default: cubic-bezier(0.4, 0, 0.2, 1);\n --ease-in: cubic-bezier(0.4, 0, 1, 1);\n --ease-out: cubic-bezier(0, 0, 0.2, 1);\n\n /* ==========================================\n LIGHT THEME COLORS (Default)\n ========================================== */\n\n /* Foreground / Text */\n --color-foreground: #0c0c0c;\n --color-foreground-muted: #787878;\n --color-foreground-subtle: #979797;\n\n /* Card surfaces */\n --color-card: #ffffff;\n\n /* Borders */\n --color-border: #d9d9d9;\n --color-border-muted: #c0c0c0;\n --color-border-focus: var(--aurum-primary-color);\n\n /* Brand / Primary (from integrator) */\n --color-primary: var(--aurum-primary-color);\n --color-primary-foreground: #ffffff;\n --color-primary-hover: color-mix(in srgb, var(--aurum-primary-color) 85%, #000);\n --color-primary-muted: color-mix(in srgb, var(--aurum-primary-color) 15%, transparent);\n\n /* Interactive elements */\n --color-accent: #f1f1f1;\n --color-accent-foreground: #0d0d0d;\n --color-accent-hover: #e6e6e6;\n\n /* Semantic colors */\n --color-success: #22c55e;\n --color-error: #ef4444;\n\n /* Overlay / Modal */\n --color-overlay: rgb(0 0 0 / 0.5);\n\n /* Ring (focus indicator) */\n --color-ring: var(--aurum-primary-color);\n --ring-offset: 0.125rem;\n\n /* Shadows */\n --shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);\n}\n\n/* ==========================================\n DARK THEME COLORS\n ========================================== */\n\n.aurum-sdk[data-theme='dark'] {\n /* Foreground / Text */\n --color-foreground: #fafafa;\n --color-foreground-muted: #a9a9a9;\n --color-foreground-subtle: #777777;\n\n /* Card surfaces */\n --color-card: #151515;\n\n /* Borders */\n --color-border: #282828;\n --color-border-muted: #424242;\n --color-border-focus: var(--aurum-primary-color);\n\n /* Brand / Primary (from integrator) */\n --color-primary: var(--aurum-primary-color);\n --color-primary-foreground: #0a0a0a;\n --color-primary-hover: color-mix(in srgb, var(--aurum-primary-color) 85%, #fff);\n --color-primary-muted: color-mix(in srgb, var(--aurum-primary-color) 20%, transparent);\n\n /* Interactive elements */\n --color-accent: #272727;\n --color-accent-foreground: #fafafa;\n --color-accent-hover: #404040;\n\n /* Semantic colors */\n --color-success: #22c55e;\n --color-error: #ef4444;\n\n /* Overlay / Modal */\n --color-overlay: rgb(0 0 0 / 0.7);\n\n /* Ring (focus indicator) */\n --color-ring: var(--aurum-primary-color);\n --ring-offset: 0.125rem;\n\n /* Shadows */\n --shadow: 0 20px 25px -5px rgb(0 0 0 / 0.5), 0 8px 10px -6px rgb(0 0 0 / 0.5);\n}\n\n\n/* components/ConnectModal/AdditionalWalletsIcon.css */\n.additional-wallets-container {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.additional-wallets-grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n grid-template-rows: 1fr 1fr;\n gap: 0.125rem;\n align-items: center;\n justify-items: center;\n}\n\n.additional-wallets-grid-item {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.additional-wallets-placeholder {\n background-color: var(--aurum-color-bg-tertiary);\n border-radius: var(--aurum-border-radius-xs);\n opacity: 0.4;\n}\n\n.circular-icon-wrapper {\n border-radius: 50%;\n overflow: hidden;\n border: 2px solid var(--aurum-color-bg-secondary);\n}\n\n.circular-icon-wrapper--front {\n z-index: 2;\n}\n\n.circular-icon-wrapper--back {\n margin-left: -0.5rem;\n z-index: 1;\n}\n\n\n/* components/ConnectModal/ConnectionStatus/ConnectionStatus.css */\n@keyframes shake {\n 0%,\n 100% {\n transform: translateX(0);\n }\n 20%,\n 60% {\n transform: translateX(-0.125rem);\n }\n 40%,\n 80% {\n transform: translateX(0.125rem);\n }\n}\n\n@keyframes opacity-pulse {\n 0%,\n 100% {\n opacity: 0.4;\n }\n 50% {\n opacity: 1;\n }\n}\n\n@keyframes scale-in {\n from {\n transform: scale(0.75);\n }\n to {\n transform: scale(1);\n }\n}\n\n.wallet-icon-shake {\n /* Duration synced with ANIMATION_DURATION.SHAKE in constants/theme.ts */\n animation: shake var(--duration-slow) var(--ease-default);\n}\n\n.ellipses-loading,\n.ellipses-success,\n.status-icon-with-dots {\n display: flex;\n gap: 0.25rem;\n align-items: center;\n justify-content: center;\n width: 100%;\n}\n\n.ellipses-loading span,\n.ellipses-success span,\n.status-icon-with-dots .dot,\n.status-icon-with-dots .icon-center {\n font-size: 3rem;\n line-height: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 0.9375rem;\n height: 3rem;\n margin: 0;\n padding: 0;\n flex-shrink: 0;\n}\n\n.ellipses-loading span,\n.ellipses-success span,\n.status-icon-with-dots .dot {\n transform: translateY(-0.28125rem);\n}\n\n.status-icon-with-dots .icon-center {\n transform: translateY(-0.2rem);\n}\n\n.ellipses-loading span {\n color: var(--color-foreground-subtle);\n opacity: 0.4;\n animation: opacity-pulse 1.5s var(--ease-default) infinite;\n will-change: opacity;\n}\n\n.ellipses-loading span:nth-child(2) {\n animation-delay: 0.2s;\n}\n.ellipses-loading span:nth-child(3) {\n animation-delay: 0.4s;\n}\n.ellipses-loading span:nth-child(4) {\n animation-delay: 0.6s;\n}\n.ellipses-loading span:nth-child(5) {\n animation-delay: 0.8s;\n}\n\n.ellipses-success span,\n.status-icon-with-dots.success .dot {\n color: var(--aurum-primary-color);\n}\n\n.status-icon-with-dots.error .dot {\n color: var(--color-error);\n}\n\n.status-button {\n display: flex;\n align-items: flex-start;\n justify-content: center;\n width: 100%;\n}\n\n.success-icon-large {\n animation: scale-in var(--duration-fast) var(--ease-out);\n}\n\n/* Logo containers for visual balance */\n.brand-logo-container,\n.wallet-logo-with-retry {\n position: relative;\n display: inline-block;\n}\n\n/* Always reserve space on both sides to prevent layout shift when retry button appears/disappears */\n.brand-logo-container {\n margin-left: 0.375rem; /* Matches retry button's right: -0.375rem */\n}\n\n.wallet-logo-with-retry {\n margin-right: 0.375rem; /* Reserve space for retry button */\n}\n\n.retry-icon-overlay.retry-icon-overlay {\n position: absolute;\n bottom: -0.125rem;\n right: -0.375rem;\n width: 1.625rem;\n height: 1.625rem;\n min-width: 1.625rem;\n min-height: 1.625rem;\n border-radius: 50%;\n padding: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n\n/* components/ConnectModal/EmailAuth.css */\n.email-auth-input {\n width: 100%;\n outline: none;\n font-family: inherit;\n font-size: 1rem;\n line-height: 1.75rem;\n box-sizing: border-box;\n padding: 0.75rem 3rem 0.75rem 3rem;\n color: var(--color-foreground);\n transition:\n outline 0.2s ease,\n border-color 0.2s ease;\n background-color: var(--color-card);\n border-width: 1px;\n border-style: solid;\n border-color: var(--color-border);\n border-radius: var(--aurum-border-radius-md);\n}\n\n.email-auth-input:hover:not(:focus):not(.email-auth-input--error) {\n border-color: var(--color-border-muted);\n}\n\n.email-auth-input:focus {\n outline: 2px solid var(--color-ring);\n outline-offset: var(--ring-offset);\n}\n\n.email-auth-input--error {\n outline: 2px solid var(--color-error);\n outline-offset: var(--ring-offset);\n}\n\n.email-auth-submit-button.aurum-button {\n top: 50%;\n right: 0.75rem;\n height: auto;\n padding: 0.5rem;\n min-width: auto;\n position: absolute;\n transform: translateY(-50%);\n border-radius: var(--aurum-border-radius-sm);\n}\n\n.email-auth-icon {\n top: 50%;\n left: 1rem;\n position: absolute;\n transform: translateY(-50%);\n display: flex;\n align-items: center;\n pointer-events: none;\n}\n\n\n/* components/ConnectModal/WalletGrid.css */\n.aurum-wallet-grid {\n display: grid;\n grid-template-columns: repeat(var(--grid-columns, 3), 1fr);\n gap: 10px;\n width: 100%;\n}\n\n\n/* components/ModalHeader/ModalHeader.css */\n.modal-header {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n padding: 1rem;\n background-color: var(--color-card);\n border-radius: var(--aurum-border-radius-lg) var(--aurum-border-radius-lg) 0 0;\n z-index: 1;\n display: grid;\n grid-template-columns: 1fr auto 1fr;\n align-items: center;\n}\n\n.modal-header > div {\n display: flex;\n align-items: center;\n width: 100%;\n}\n\n.modal-header-left {\n justify-content: flex-start;\n min-width: 2.25rem;\n height: 2.25rem;\n}\n\n.modal-header-center {\n justify-content: center;\n max-width: 12.5rem;\n text-align: center;\n line-height: 1.2;\n overflow-wrap: break-word;\n}\n\n.modal-header-right {\n justify-content: flex-end;\n min-width: 2.25rem;\n height: 2.25rem;\n}\n\n\n/* components/PoweredBy/PoweredBy.css */\n.powered-by-container {\n position: absolute;\n bottom: 1rem;\n left: 0;\n right: 0;\n width: 100%;\n}\n\n\n/* components/QRCodeDisplay/QRCodeDisplay.css */\n@keyframes qr-shimmer {\n 0% {\n transform: translateX(-100%);\n }\n 100% {\n transform: translateX(100%);\n }\n}\n\n.qr-container-shimmer {\n position: relative;\n overflow: hidden; /* Keep for shimmer animation */\n}\n\n.qr-container-shimmer::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: linear-gradient(\n 90deg,\n transparent 0%,\n color-mix(in srgb, var(--color-foreground) 10%, transparent) 50%,\n transparent 100%\n );\n animation: qr-shimmer 2s infinite;\n pointer-events: none;\n z-index: 1;\n}\n\n.qr-container {\n border-radius: var(--aurum-border-radius-md);\n border: 1px solid var(--color-border);\n padding: 0.5rem;\n box-sizing: content-box;\n transition: border-color var(--duration-slow) var(--ease-default);\n}\n\n.qr-subtitle {\n max-width: 15rem;\n}\n\n\n/* components/QRCodeDisplay/QRCodeSkeleton.css */\n.qr-skeleton-container {\n width: 100%;\n position: relative;\n}\n\n.qr-skeleton-svg {\n display: block;\n position: relative;\n z-index: 2;\n border-radius: var(--aurum-border-radius-sm);\n}\n\n.qr-skeleton-dot {\n opacity: 0.7;\n}\n\n.qr-skeleton-eye {\n opacity: 0.7;\n}\n\n\n/* components/SpinnerWithIcon/SpinnerWithIcon.css */\n.spinner-with-icon {\n transition: all var(--duration-normal) var(--ease-default);\n}\n\n.spinner-with-icon svg {\n transition: color var(--duration-normal) var(--ease-default);\n}\n\n\n/* components/widgets/widgets.css */\n/* Widget-specific styles that match modal-content */\n\n.widget-provider {\n position: relative;\n width: 23.75rem;\n min-width: 17rem;\n margin: 0 auto;\n padding: 1.25rem 1.5rem;\n background-color: var(--color-card);\n border-radius: var(--aurum-border-radius-lg);\n border: 1px solid var(--color-border-muted);\n box-sizing: border-box;\n color: var(--color-card-foreground);\n box-shadow: var(--shadow);\n outline: none;\n overflow-x: auto;\n}\n\n.widget-provider .modal-header {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n}\n\n@media (max-width: 30.25rem) {\n .widget-provider {\n width: 100%;\n max-width: 100%;\n border-radius: var(--aurum-border-radius-md);\n display: flex;\n flex-direction: column;\n }\n\n /* Ensure page wrapper fills width in flex container on mobile */\n /* .widget-pages {\n width: 100%;\n } */\n}\n\n\n/* ui/Badge/Badge.css */\n.aurum-badge-recent {\n padding: 0.25rem 0.5rem;\n border-radius: var(--aurum-border-radius-xs);\n\n font-size: 0.65rem;\n line-height: 1;\n letter-spacing: 0.07em;\n text-transform: uppercase;\n\n color: var(--color-foreground-muted);\n}\n\n\n/* ui/Button/Button.css */\n.aurum-button {\n display: flex;\n align-items: center;\n justify-content: center;\n border: none;\n font-weight: var(--font-semibold);\n cursor: pointer;\n transition:\n background-color var(--duration-normal) var(--ease-default),\n color var(--duration-normal) var(--ease-default),\n transform var(--duration-fast) var(--ease-default),\n box-shadow var(--duration-normal) var(--ease-default);\n text-decoration: none;\n box-sizing: border-box;\n position: relative;\n outline: none;\n font-family: inherit;\n}\n\n.aurum-button:focus-visible {\n outline: 2px solid var(--color-ring);\n outline-offset: var(--ring-offset);\n}\n\n.aurum-button--xs {\n padding: 0.25rem 0.5rem;\n font-size: 0.75rem;\n gap: 0.25rem;\n border-radius: var(--aurum-border-radius-xs);\n}\n\n.aurum-button--sm {\n padding: 0.5rem 0.75rem;\n font-size: 0.875rem;\n gap: 0.25rem;\n border-radius: calc(var(--aurum-border-radius-sm) - 2px);\n}\n\n.aurum-button--md {\n padding: 0.75rem 1rem;\n font-size: 0.9rem;\n gap: 0.5rem;\n border-radius: calc(var(--aurum-border-radius-md) - 2px);\n}\n\n.aurum-button--lg {\n padding: 1rem 1.5rem;\n font-size: 1rem;\n gap: 0.75rem;\n border-radius: var(--aurum-border-radius-md);\n}\n\n.aurum-button--full-width {\n width: 100%;\n}\n\n.aurum-button--primary {\n background-color: var(--color-primary);\n color: var(--color-primary-foreground);\n}\n\n.aurum-button--primary:active:not(:disabled) {\n transform: scale(0.98);\n}\n\n.aurum-button--secondary {\n background-color: var(--color-accent);\n color: var(--color-accent-foreground);\n}\n\n.aurum-button--secondary:active:not(:disabled) {\n transform: scale(0.98);\n}\n\n.aurum-button--tertiary {\n background: transparent;\n color: var(--color-foreground);\n border: 1px solid var(--color-border);\n}\n\n.aurum-button--tertiary:active:not(:disabled) {\n transform: scale(0.98);\n}\n\n.aurum-button--text {\n background: transparent;\n color: var(--color-primary);\n padding: 0.25rem;\n}\n\n.aurum-button--text:not(.aurum-button--full-width) {\n width: fit-content;\n}\n\n.aurum-button--text:active:not(:disabled) {\n transform: scale(0.98);\n}\n\n.aurum-button--close {\n background: transparent;\n color: var(--color-foreground-muted);\n border: none;\n padding: 0.5rem;\n border-radius: var(--aurum-border-radius-md);\n font-size: 1.25rem;\n line-height: 1;\n}\n\n.aurum-button--close:active:not(:disabled) {\n transform: scale(0.95);\n}\n\n/* Hover styles only for devices with hover capability (not touch) */\n@media (hover: hover) {\n .aurum-button--primary:hover:not(:disabled) {\n background-color: var(--color-primary-hover);\n }\n\n .aurum-button--secondary:hover:not(:disabled) {\n background-color: var(--color-accent-hover);\n }\n\n .aurum-button--tertiary:hover:not(:disabled) {\n background-color: var(--color-accent);\n border-color: var(--color-border-muted);\n }\n\n .aurum-button--text:hover:not(:disabled) {\n opacity: 0.7;\n }\n\n .aurum-button--close:hover:not(:disabled) {\n background-color: var(--color-accent);\n color: var(--color-foreground);\n }\n}\n\n.aurum-button--disabled,\n.aurum-button:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n pointer-events: none;\n}\n\n.aurum-button--loading {\n pointer-events: none;\n}\n\n\n/* ui/Divider/Divider.css */\n.divider {\n display: flex;\n align-items: center;\n width: 100%;\n}\n\n.divider-line {\n flex: 1;\n height: 1px;\n background-color: var(--color-border);\n}\n\n.divider-text {\n padding: 0 1rem;\n color: var(--color-foreground-subtle);\n font-size: 0.875rem;\n font-weight: var(--font-medium);\n}\n\n\n/* ui/Modal/Modal.css */\n.modal-overlay {\n position: fixed;\n inset: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n z-index: var(--aurum-modal-z-index);\n background-color: var(--color-overlay);\n opacity: 0;\n}\n\n.modal-overlay.modal-open {\n opacity: 1;\n transition: opacity 150ms ease-out;\n}\n\n.modal-overlay.modal-exiting {\n opacity: 0;\n transition: opacity 150ms ease-in;\n}\n\n.modal-content {\n position: relative;\n width: 23.75rem;\n min-width: 17rem;\n padding: 1.25rem 1.5rem;\n color: var(--color-card-foreground);\n background-color: var(--color-card);\n border-radius: var(--aurum-border-radius-lg);\n box-shadow: var(--shadow);\n border: 1px solid var(--color-border-muted);\n outline: none;\n opacity: 0;\n transform: scale(0.95);\n}\n\n.modal-overlay.modal-open .modal-content {\n opacity: 1;\n transform: scale(1);\n transition:\n opacity 150ms ease-out,\n transform 150ms ease-out;\n}\n\n.modal-overlay.modal-exiting .modal-content {\n opacity: 0;\n transform: scale(0.95);\n transition:\n opacity 150ms ease-in,\n transform 150ms ease-in;\n}\n\n.modal-page-container {\n position: relative;\n width: 100%;\n overflow-x: visible;\n overflow-y: auto;\n scrollbar-width: none;\n -ms-overflow-style: none;\n}\n\n.modal-page-container::-webkit-scrollbar {\n display: none;\n}\n\n.modal-page {\n position: relative;\n width: 100%;\n box-sizing: border-box;\n opacity: 0;\n transition: opacity 0s;\n}\n\n.modal-page.active {\n opacity: 1;\n transition: opacity var(--duration-slow) var(--ease-out);\n}\n\n/* Mobile drawer layout */\n@media (max-width: 30.25rem) {\n .modal-overlay {\n align-items: flex-end;\n justify-content: center;\n opacity: 1;\n transition: none;\n }\n\n .modal-overlay.modal-open {\n transition: none;\n }\n\n .modal-overlay.modal-exiting {\n opacity: 1;\n background-color: transparent;\n transition: none;\n }\n\n .modal-content {\n width: 100%;\n max-height: 82vh;\n max-height: 82dvh;\n min-height: 35vh;\n min-height: 35dvh;\n padding: 1rem;\n border-radius: var(--aurum-border-radius-lg) var(--aurum-border-radius-lg) 0 0;\n border-bottom: none;\n display: flex;\n flex-direction: column;\n height: auto;\n opacity: 1;\n transform: translateY(100%);\n }\n\n .modal-overlay.modal-open .modal-content {\n opacity: 1;\n transform: translateY(0);\n transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);\n }\n\n .modal-overlay.modal-exiting .modal-content {\n opacity: 1;\n transform: translateY(100%);\n transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);\n }\n\n .modal-page-container {\n flex: 0 1 auto;\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n }\n\n .modal-page {\n flex: 0 1 auto;\n display: flex;\n flex-direction: column;\n }\n}\n\n\n/* ui/Spinner/Spinner.css */\n.spinner {\n flex-shrink: 0;\n animation: spinner-rotate 1s linear infinite;\n}\n\n@keyframes spinner-rotate {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}\n\n\n/* ui/Text/Text.css */\n.aurum-text {\n margin: 0;\n padding: 0;\n font-family: inherit;\n line-height: 1.5;\n}\n\n.aurum-text--primary {\n color: var(--color-foreground);\n}\n\n.aurum-text--secondary {\n color: var(--color-foreground-muted);\n}\n\n.aurum-text--tertiary {\n color: var(--color-foreground-subtle);\n}\n\n.aurum-text--error {\n color: var(--color-error);\n}\n\n.aurum-text--brand {\n color: var(--color-primary);\n}\n\n.aurum-text--success {\n color: var(--color-success);\n}\n\n.aurum-text--xs {\n font-size: 0.75rem;\n line-height: 1.4;\n}\n\n.aurum-text--sm {\n font-size: 0.875rem;\n line-height: 1.45;\n}\n\n.aurum-text--md {\n font-size: 1rem;\n line-height: 1.5;\n}\n\n.aurum-text--lg {\n font-size: 1.125rem;\n line-height: 1.5;\n}\n\n.aurum-text--normal {\n font-weight: var(--font-normal);\n}\n\n.aurum-text--semibold {\n font-weight: var(--font-semibold);\n}\n\n.aurum-text--bold {\n font-weight: var(--font-bold);\n}\n\n.aurum-text--align-left {\n text-align: left;\n}\n\n.aurum-text--align-center {\n text-align: center;\n}\n\n.aurum-text--align-right {\n text-align: right;\n}\n\n\n";
2400
+ var bundledStyles = "/* ui/globals.css */\n/* ============================================\n AURUM SDK - DESIGN TOKEN SYSTEM\n ============================================\n\n Google Fonts:\n - Noto Sans: 400, 500, 600, 700\n ============================================ */\n\n@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');\n\n/* ============================================\n External variables (injected by createShadowRoot.ts):\n - --aurum-primary-color: Brand color from dapp\n - --aurum-border-radius-*: Radius scale tokens\n - --aurum-modal-z-index: Modal z-index\n - --aurum-font-family: Font family from dapp\n ============================================ */\n\n/* Base reset styles for Shadow DOM */\n:host {\n all: initial;\n}\n\n*,\n*::before,\n*::after {\n box-sizing: border-box;\n}\n\n/* Ensure form elements inherit font from parent */\ninput,\nbutton,\ntextarea,\nselect {\n font-family: inherit;\n}\n\n.aurum-sdk {\n /* ==========================================\n TYPOGRAPHY\n ========================================== */\n font-family: var(--aurum-font-family);\n font-size: 1rem;\n line-height: 1.5;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n\n /* Font weights */\n --font-normal: 400;\n --font-medium: 500;\n --font-semibold: 600;\n --font-bold: 700;\n\n /* ==========================================\n TRANSITIONS\n ========================================== */\n --duration-fast: 100ms;\n --duration-normal: 200ms;\n --duration-slow: 300ms;\n --ease-default: cubic-bezier(0.4, 0, 0.2, 1);\n --ease-in: cubic-bezier(0.4, 0, 1, 1);\n --ease-out: cubic-bezier(0, 0, 0.2, 1);\n\n /* ==========================================\n LIGHT THEME COLORS (Default)\n ========================================== */\n\n /* Foreground / Text */\n --color-foreground: #0c0c0c;\n --color-foreground-muted: #787878;\n --color-foreground-subtle: #979797;\n\n /* Card surfaces */\n --color-card: #ffffff;\n\n /* Borders */\n --color-border: #d9d9d9;\n --color-border-muted: #c0c0c0;\n --color-border-focus: var(--aurum-primary-color);\n\n /* Brand / Primary (from integrator) */\n --color-primary: var(--aurum-primary-color);\n --color-primary-foreground: #ffffff;\n --color-primary-hover: color-mix(in srgb, var(--aurum-primary-color) 85%, #000);\n --color-primary-muted: color-mix(in srgb, var(--aurum-primary-color) 15%, transparent);\n\n /* Interactive elements */\n --color-accent: #f1f1f1;\n --color-accent-foreground: #0d0d0d;\n --color-accent-hover: #e6e6e6;\n\n /* Semantic colors */\n --color-success: #22c55e;\n --color-error: #ef4444;\n\n /* Overlay / Modal */\n --color-overlay: rgb(0 0 0 / 0.5);\n\n /* Ring (focus indicator) */\n --color-ring: var(--aurum-primary-color);\n --ring-offset: 0.125rem;\n\n /* Shadows */\n --shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);\n}\n\n/* ==========================================\n DARK THEME COLORS\n ========================================== */\n\n.aurum-sdk[data-theme='dark'] {\n /* Foreground / Text */\n --color-foreground: #fafafa;\n --color-foreground-muted: #a9a9a9;\n --color-foreground-subtle: #777777;\n\n /* Card surfaces */\n --color-card: #151515;\n\n /* Borders */\n --color-border: #282828;\n --color-border-muted: #424242;\n --color-border-focus: var(--aurum-primary-color);\n\n /* Brand / Primary (from integrator) */\n --color-primary: var(--aurum-primary-color);\n --color-primary-foreground: #0a0a0a;\n --color-primary-hover: color-mix(in srgb, var(--aurum-primary-color) 85%, #fff);\n --color-primary-muted: color-mix(in srgb, var(--aurum-primary-color) 20%, transparent);\n\n /* Interactive elements */\n --color-accent: #272727;\n --color-accent-foreground: #fafafa;\n --color-accent-hover: #404040;\n\n /* Semantic colors */\n --color-success: #22c55e;\n --color-error: #ef4444;\n\n /* Overlay / Modal */\n --color-overlay: rgb(0 0 0 / 0.7);\n\n /* Ring (focus indicator) */\n --color-ring: var(--aurum-primary-color);\n --ring-offset: 0.125rem;\n\n /* Shadows */\n --shadow: 0 20px 25px -5px rgb(0 0 0 / 0.5), 0 8px 10px -6px rgb(0 0 0 / 0.5);\n}\n\n\n/* components/ConnectModal/AdditionalWalletsIcon.css */\n.additional-wallets-container {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.additional-wallets-grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n grid-template-rows: 1fr 1fr;\n gap: 0.125rem;\n align-items: center;\n justify-items: center;\n}\n\n.additional-wallets-grid-item {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.additional-wallets-placeholder {\n background-color: var(--aurum-color-bg-tertiary);\n border-radius: var(--aurum-border-radius-xs);\n opacity: 0.4;\n}\n\n.circular-icon-wrapper {\n border-radius: 50%;\n overflow: hidden;\n border: 2px solid var(--aurum-color-bg-secondary);\n}\n\n.circular-icon-wrapper--front {\n z-index: 2;\n}\n\n.circular-icon-wrapper--back {\n margin-left: -0.5rem;\n z-index: 1;\n}\n\n\n/* components/ConnectModal/ConnectionStatus/ConnectionStatus.css */\n@keyframes shake {\n 0%,\n 100% {\n transform: translateX(0);\n }\n 20%,\n 60% {\n transform: translateX(-0.125rem);\n }\n 40%,\n 80% {\n transform: translateX(0.125rem);\n }\n}\n\n@keyframes opacity-pulse {\n 0%,\n 100% {\n opacity: 0.4;\n }\n 50% {\n opacity: 1;\n }\n}\n\n@keyframes scale-in {\n from {\n transform: scale(0.75);\n }\n to {\n transform: scale(1);\n }\n}\n\n.wallet-icon-shake {\n /* Duration synced with ANIMATION_DURATION.SHAKE in constants/theme.ts */\n animation: shake var(--duration-slow) var(--ease-default);\n}\n\n.ellipses-loading,\n.ellipses-success,\n.status-icon-with-dots {\n display: flex;\n gap: 0.25rem;\n align-items: center;\n justify-content: center;\n width: 100%;\n}\n\n.ellipses-loading span,\n.ellipses-success span,\n.status-icon-with-dots .dot,\n.status-icon-with-dots .icon-center {\n font-size: 3rem;\n line-height: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 0.9375rem;\n height: 3rem;\n margin: 0;\n padding: 0;\n flex-shrink: 0;\n}\n\n.ellipses-loading span,\n.ellipses-success span,\n.status-icon-with-dots .dot {\n transform: translateY(-0.28125rem);\n}\n\n.status-icon-with-dots .icon-center {\n transform: translateY(-0.2rem);\n}\n\n.ellipses-loading span {\n color: var(--color-foreground-subtle);\n opacity: 0.4;\n animation: opacity-pulse 1.5s var(--ease-default) infinite;\n will-change: opacity;\n}\n\n.ellipses-loading span:nth-child(2) {\n animation-delay: 0.2s;\n}\n.ellipses-loading span:nth-child(3) {\n animation-delay: 0.4s;\n}\n.ellipses-loading span:nth-child(4) {\n animation-delay: 0.6s;\n}\n.ellipses-loading span:nth-child(5) {\n animation-delay: 0.8s;\n}\n\n.ellipses-success span,\n.status-icon-with-dots.success .dot {\n color: var(--aurum-primary-color);\n}\n\n.status-icon-with-dots.error .dot {\n color: var(--color-error);\n}\n\n.status-button {\n display: flex;\n align-items: flex-start;\n justify-content: center;\n width: 100%;\n}\n\n.success-icon-large {\n animation: scale-in var(--duration-fast) var(--ease-out);\n}\n\n/* Logo containers for visual balance */\n.brand-logo-container,\n.wallet-logo-with-retry {\n position: relative;\n display: inline-block;\n}\n\n/* Always reserve space on both sides to prevent layout shift when retry button appears/disappears */\n.brand-logo-container {\n margin-left: 0.375rem; /* Matches retry button's right: -0.375rem */\n}\n\n.wallet-logo-with-retry {\n margin-right: 0.375rem; /* Reserve space for retry button */\n}\n\n.retry-icon-overlay.retry-icon-overlay {\n position: absolute;\n bottom: -0.125rem;\n right: -0.375rem;\n width: 1.625rem;\n height: 1.625rem;\n min-width: 1.625rem;\n min-height: 1.625rem;\n border-radius: 50%;\n padding: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n\n/* components/ConnectModal/EmailAuth.css */\n.email-auth-input {\n width: 100%;\n outline: none;\n font-family: inherit;\n font-size: 1rem;\n line-height: 1.75rem;\n box-sizing: border-box;\n padding: 0.75rem 3rem 0.75rem 3rem;\n color: var(--color-foreground);\n transition:\n outline 0.2s ease,\n border-color 0.2s ease;\n background-color: var(--color-card);\n border-width: 1px;\n border-style: solid;\n border-color: var(--color-border);\n border-radius: var(--aurum-border-radius-md);\n}\n\n.email-auth-input:hover:not(:focus):not(.email-auth-input--error) {\n border-color: var(--color-border-muted);\n}\n\n.email-auth-input:focus {\n outline: 2px solid var(--color-ring);\n outline-offset: var(--ring-offset);\n}\n\n.email-auth-input--error {\n outline: 2px solid var(--color-error);\n outline-offset: var(--ring-offset);\n}\n\n.email-auth-submit-button.aurum-button {\n top: 50%;\n right: 0.75rem;\n height: auto;\n padding: 0.5rem;\n min-width: auto;\n position: absolute;\n transform: translateY(-50%);\n border-radius: var(--aurum-border-radius-sm);\n}\n\n.email-auth-icon {\n top: 50%;\n left: 1rem;\n position: absolute;\n transform: translateY(-50%);\n display: flex;\n align-items: center;\n pointer-events: none;\n}\n\n\n/* components/ConnectModal/WalletGrid.css */\n.aurum-wallet-grid {\n display: flex;\n flex-direction: column;\n gap: 10px;\n width: 100%;\n}\n\n.aurum-wallet-grid-row {\n display: flex;\n gap: 10px;\n width: 100%;\n}\n\n.aurum-wallet-grid-row > * {\n flex: 1;\n min-width: 0;\n}\n\n\n/* components/ModalHeader/ModalHeader.css */\n.modal-header {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n padding: 1rem;\n background-color: var(--color-card);\n border-radius: var(--aurum-border-radius-lg) var(--aurum-border-radius-lg) 0 0;\n z-index: 1;\n display: grid;\n grid-template-columns: 1fr auto 1fr;\n align-items: center;\n}\n\n.modal-header > div {\n display: flex;\n align-items: center;\n width: 100%;\n}\n\n.modal-header-left {\n justify-content: flex-start;\n min-width: 2.25rem;\n height: 2.25rem;\n}\n\n.modal-header-center {\n justify-content: center;\n max-width: 12.5rem;\n text-align: center;\n line-height: 1.2;\n overflow-wrap: break-word;\n}\n\n.modal-header-right {\n justify-content: flex-end;\n min-width: 2.25rem;\n height: 2.25rem;\n}\n\n\n/* components/PoweredBy/PoweredBy.css */\n.powered-by-container {\n position: absolute;\n bottom: 1rem;\n left: 0;\n right: 0;\n width: 100%;\n}\n\n\n/* components/QRCodeDisplay/QRCodeDisplay.css */\n@keyframes qr-shimmer {\n 0% {\n transform: translateX(-100%);\n }\n 100% {\n transform: translateX(100%);\n }\n}\n\n.qr-container-shimmer {\n position: relative;\n overflow: hidden; /* Keep for shimmer animation */\n}\n\n.qr-container-shimmer::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: linear-gradient(\n 90deg,\n transparent 0%,\n color-mix(in srgb, var(--color-foreground) 10%, transparent) 50%,\n transparent 100%\n );\n animation: qr-shimmer 2s infinite;\n pointer-events: none;\n z-index: 1;\n}\n\n.qr-container {\n border-radius: var(--aurum-border-radius-md);\n border: 1px solid var(--color-border);\n padding: 0.5rem;\n box-sizing: content-box;\n transition: border-color var(--duration-slow) var(--ease-default);\n}\n\n.qr-subtitle {\n max-width: 15rem;\n}\n\n\n/* components/QRCodeDisplay/QRCodeSkeleton.css */\n.qr-skeleton-container {\n width: 100%;\n position: relative;\n}\n\n.qr-skeleton-svg {\n display: block;\n position: relative;\n z-index: 2;\n border-radius: var(--aurum-border-radius-sm);\n}\n\n.qr-skeleton-dot {\n opacity: 0.7;\n}\n\n.qr-skeleton-eye {\n opacity: 0.7;\n}\n\n\n/* components/SpinnerWithIcon/SpinnerWithIcon.css */\n.spinner-with-icon {\n transition: all var(--duration-normal) var(--ease-default);\n}\n\n.spinner-with-icon svg {\n transition: color var(--duration-normal) var(--ease-default);\n}\n\n\n/* components/widgets/widgets.css */\n/* Widget-specific styles that match modal-content */\n\n.widget-provider {\n position: relative;\n width: 23.75rem;\n min-width: 17rem;\n margin: 0 auto;\n padding: 1.25rem 1.5rem;\n background-color: var(--color-card);\n border-radius: var(--aurum-border-radius-lg);\n border: 1px solid var(--color-border-muted);\n box-sizing: border-box;\n color: var(--color-card-foreground);\n box-shadow: var(--shadow);\n outline: none;\n overflow-x: auto;\n}\n\n.widget-provider .modal-header {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n}\n\n@media (max-width: 30.25rem) {\n .widget-provider {\n width: 100%;\n max-width: 100%;\n border-radius: var(--aurum-border-radius-md);\n display: flex;\n flex-direction: column;\n }\n\n /* Ensure page wrapper fills width in flex container on mobile */\n /* .widget-pages {\n width: 100%;\n } */\n}\n\n\n/* ui/Badge/Badge.css */\n.aurum-badge-recent {\n padding: 0.25rem 0.5rem;\n border-radius: var(--aurum-border-radius-xs);\n\n font-size: 0.65rem;\n line-height: 1;\n letter-spacing: 0.07em;\n text-transform: uppercase;\n\n color: var(--color-foreground-muted);\n}\n\n\n/* ui/Button/Button.css */\n.aurum-button {\n display: flex;\n align-items: center;\n justify-content: center;\n border: none;\n font-weight: var(--font-semibold);\n cursor: pointer;\n transition:\n background-color var(--duration-normal) var(--ease-default),\n color var(--duration-normal) var(--ease-default),\n transform var(--duration-fast) var(--ease-default),\n box-shadow var(--duration-normal) var(--ease-default);\n text-decoration: none;\n box-sizing: border-box;\n position: relative;\n outline: none;\n font-family: inherit;\n}\n\n.aurum-button:focus-visible {\n outline: 2px solid var(--color-ring);\n outline-offset: var(--ring-offset);\n}\n\n.aurum-button--xs {\n padding: 0.25rem 0.5rem;\n font-size: 0.75rem;\n gap: 0.25rem;\n border-radius: var(--aurum-border-radius-xs);\n}\n\n.aurum-button--sm {\n padding: 0.5rem 0.75rem;\n font-size: 0.875rem;\n gap: 0.25rem;\n border-radius: calc(var(--aurum-border-radius-sm) - 2px);\n}\n\n.aurum-button--md {\n padding: 0.75rem 1rem;\n font-size: 0.9rem;\n gap: 0.5rem;\n border-radius: calc(var(--aurum-border-radius-md) - 2px);\n}\n\n.aurum-button--lg {\n padding: 1rem 1.5rem;\n font-size: 1rem;\n gap: 0.75rem;\n border-radius: var(--aurum-border-radius-md);\n}\n\n.aurum-button--full-width {\n width: 100%;\n}\n\n.aurum-button--primary {\n background-color: var(--color-primary);\n color: var(--color-primary-foreground);\n}\n\n.aurum-button--primary:active:not(:disabled) {\n transform: scale(0.98);\n}\n\n.aurum-button--secondary {\n background-color: var(--color-accent);\n color: var(--color-accent-foreground);\n}\n\n.aurum-button--secondary:active:not(:disabled) {\n transform: scale(0.98);\n}\n\n.aurum-button--tertiary {\n background: transparent;\n color: var(--color-foreground);\n border: 1px solid var(--color-border);\n}\n\n.aurum-button--tertiary:active:not(:disabled) {\n transform: scale(0.98);\n}\n\n.aurum-button--text {\n background: transparent;\n color: var(--color-primary);\n padding: 0.25rem;\n}\n\n.aurum-button--text:not(.aurum-button--full-width) {\n width: fit-content;\n}\n\n.aurum-button--text:active:not(:disabled) {\n transform: scale(0.98);\n}\n\n.aurum-button--close {\n background: transparent;\n color: var(--color-foreground-muted);\n border: none;\n padding: 0.5rem;\n border-radius: var(--aurum-border-radius-md);\n font-size: 1.25rem;\n line-height: 1;\n}\n\n.aurum-button--close:active:not(:disabled) {\n transform: scale(0.95);\n}\n\n/* Hover styles only for devices with hover capability (not touch) */\n@media (hover: hover) {\n .aurum-button--primary:hover:not(:disabled) {\n background-color: var(--color-primary-hover);\n }\n\n .aurum-button--secondary:hover:not(:disabled) {\n background-color: var(--color-accent-hover);\n }\n\n .aurum-button--tertiary:hover:not(:disabled) {\n background-color: var(--color-accent);\n border-color: var(--color-border-muted);\n }\n\n .aurum-button--text:hover:not(:disabled) {\n opacity: 0.7;\n }\n\n .aurum-button--close:hover:not(:disabled) {\n background-color: var(--color-accent);\n color: var(--color-foreground);\n }\n}\n\n.aurum-button--disabled,\n.aurum-button:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n pointer-events: none;\n}\n\n.aurum-button--loading {\n pointer-events: none;\n}\n\n\n/* ui/Divider/Divider.css */\n.divider {\n display: flex;\n align-items: center;\n width: 100%;\n}\n\n.divider-line {\n flex: 1;\n height: 1px;\n background-color: var(--color-border);\n}\n\n.divider-text {\n padding: 0 1rem;\n color: var(--color-foreground-subtle);\n font-size: 0.875rem;\n font-weight: var(--font-medium);\n}\n\n\n/* ui/Modal/Modal.css */\n.modal-overlay {\n position: fixed;\n inset: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n z-index: var(--aurum-modal-z-index);\n background-color: var(--color-overlay);\n opacity: 0;\n}\n\n.modal-overlay.modal-open {\n opacity: 1;\n transition: opacity 150ms ease-out;\n}\n\n.modal-overlay.modal-exiting {\n opacity: 0;\n transition: opacity 150ms ease-in;\n}\n\n.modal-content {\n position: relative;\n width: 23.75rem;\n min-width: 17rem;\n padding: 1.25rem 1.5rem;\n color: var(--color-card-foreground);\n background-color: var(--color-card);\n border-radius: var(--aurum-border-radius-lg);\n box-shadow: var(--shadow);\n border: 1px solid var(--color-border-muted);\n outline: none;\n opacity: 0;\n transform: scale(0.95);\n}\n\n.modal-overlay.modal-open .modal-content {\n opacity: 1;\n transform: scale(1);\n transition:\n opacity 150ms ease-out,\n transform 150ms ease-out;\n}\n\n.modal-overlay.modal-exiting .modal-content {\n opacity: 0;\n transform: scale(0.95);\n transition:\n opacity 150ms ease-in,\n transform 150ms ease-in;\n}\n\n.modal-page-container {\n position: relative;\n width: 100%;\n overflow-x: visible;\n overflow-y: auto;\n scrollbar-width: none;\n -ms-overflow-style: none;\n}\n\n.modal-page-container::-webkit-scrollbar {\n display: none;\n}\n\n.modal-page {\n position: relative;\n width: 100%;\n box-sizing: border-box;\n opacity: 0;\n transition: opacity 0s;\n}\n\n.modal-page.active {\n opacity: 1;\n transition: opacity var(--duration-slow) var(--ease-out);\n}\n\n/* Mobile drawer layout */\n@media (max-width: 30.25rem) {\n .modal-overlay {\n align-items: flex-end;\n justify-content: center;\n opacity: 1;\n transition: none;\n }\n\n .modal-overlay.modal-open {\n transition: none;\n }\n\n .modal-overlay.modal-exiting {\n opacity: 1;\n background-color: transparent;\n transition: none;\n }\n\n .modal-content {\n width: 100%;\n max-height: 82vh;\n max-height: 82dvh;\n min-height: 35vh;\n min-height: 35dvh;\n padding: 1rem;\n border-radius: var(--aurum-border-radius-lg) var(--aurum-border-radius-lg) 0 0;\n border-bottom: none;\n display: flex;\n flex-direction: column;\n height: auto;\n opacity: 1;\n transform: translateY(100%);\n }\n\n .modal-overlay.modal-open .modal-content {\n opacity: 1;\n transform: translateY(0);\n transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);\n }\n\n .modal-overlay.modal-exiting .modal-content {\n opacity: 1;\n transform: translateY(100%);\n transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);\n }\n\n .modal-page-container {\n flex: 0 1 auto;\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n }\n\n .modal-page {\n flex: 0 1 auto;\n display: flex;\n flex-direction: column;\n }\n}\n\n\n/* ui/Spinner/Spinner.css */\n.spinner {\n flex-shrink: 0;\n animation: spinner-rotate 1s linear infinite;\n}\n\n@keyframes spinner-rotate {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}\n\n\n/* ui/Text/Text.css */\n.aurum-text {\n margin: 0;\n padding: 0;\n font-family: inherit;\n line-height: 1.5;\n}\n\n.aurum-text--primary {\n color: var(--color-foreground);\n}\n\n.aurum-text--secondary {\n color: var(--color-foreground-muted);\n}\n\n.aurum-text--tertiary {\n color: var(--color-foreground-subtle);\n}\n\n.aurum-text--error {\n color: var(--color-error);\n}\n\n.aurum-text--brand {\n color: var(--color-primary);\n}\n\n.aurum-text--success {\n color: var(--color-success);\n}\n\n.aurum-text--xs {\n font-size: 0.75rem;\n line-height: 1.4;\n}\n\n.aurum-text--sm {\n font-size: 0.875rem;\n line-height: 1.45;\n}\n\n.aurum-text--md {\n font-size: 1rem;\n line-height: 1.5;\n}\n\n.aurum-text--lg {\n font-size: 1.125rem;\n line-height: 1.5;\n}\n\n.aurum-text--normal {\n font-weight: var(--font-normal);\n}\n\n.aurum-text--semibold {\n font-weight: var(--font-semibold);\n}\n\n.aurum-text--bold {\n font-weight: var(--font-bold);\n}\n\n.aurum-text--align-left {\n text-align: left;\n}\n\n.aurum-text--align-center {\n text-align: center;\n}\n\n.aurum-text--align-right {\n text-align: right;\n}\n\n\n";
2385
2401
 
2386
2402
  // src/utils/generateBrandStyles.ts
2387
2403
  function generateBrandCssVariables(brandConfig) {
@@ -2429,4 +2445,4 @@ export {
2429
2445
  ConnectPages,
2430
2446
  generateCompleteStyles
2431
2447
  };
2432
- //# sourceMappingURL=chunk-EQEZQPHH.mjs.map
2448
+ //# sourceMappingURL=chunk-3TZNNET3.mjs.map