@betterstore/react 0.5.21 → 0.5.23

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.
package/dist/index.mjs CHANGED
@@ -25,7 +25,7 @@ const createStoreImpl = (createState) => {
25
25
  const initialState = state = createState(setState, getState, api);
26
26
  return api;
27
27
  };
28
- const createStore = (createState) => createState ? createStoreImpl(createState) : createStoreImpl;
28
+ const createStore = ((createState) => createState ? createStoreImpl(createState) : createStoreImpl);
29
29
 
30
30
  const identity$1 = (arg) => arg;
31
31
  function useStore(api, selector = identity$1) {
@@ -43,7 +43,7 @@ const createImpl = (createState) => {
43
43
  Object.assign(useBoundStore, api);
44
44
  return useBoundStore;
45
45
  };
46
- const create = (createState) => createState ? createImpl(createState) : createImpl;
46
+ const create = ((createState) => createState ? createImpl(createState) : createImpl);
47
47
 
48
48
  function createJSONStorage(getStorage, options) {
49
49
  let storage;
@@ -134,12 +134,12 @@ const persistImpl = (config, baseOptions) => (set, get, api) => {
134
134
  const savedSetState = api.setState;
135
135
  api.setState = (state, replace) => {
136
136
  savedSetState(state, replace);
137
- void setItem();
137
+ return setItem();
138
138
  };
139
139
  const configResult = config(
140
140
  (...args) => {
141
141
  set(...args);
142
- void setItem();
142
+ return setItem();
143
143
  },
144
144
  get,
145
145
  api
@@ -7534,7 +7534,7 @@ function createStoreHelpers(config) {
7534
7534
  return new helpers_default(config?.proxy);
7535
7535
  }
7536
7536
 
7537
- var css_248z = "/*! tailwindcss v4.1.12 | MIT License | https://tailwindcss.com */\n@layer properties;\n@layer theme, base, components, utilities;\n@layer theme {\n :root, :host {\n --font-sans: var(--font-sans), Helvetica, Arial, apple-system, sans-serif;\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\",\n \"Courier New\", monospace;\n --color-red-500: oklch(63.7% 0.237 25.331);\n --color-black: #000;\n --color-white: #fff;\n --spacing: 0.25rem;\n --container-lg: 32rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\n --text-sm: 0.875rem;\n --text-sm--line-height: calc(1.25 / 0.875);\n --text-base: 1rem;\n --text-base--line-height: calc(1.5 / 1);\n --text-lg: 1.125rem;\n --text-lg--line-height: calc(1.75 / 1.125);\n --text-2xl: 1.5rem;\n --text-2xl--line-height: calc(2 / 1.5);\n --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --tracking-tight: -0.025em;\n --tracking-widest: 0.1em;\n --radius-xs: 0.125rem;\n --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);\n --animate-spin: spin 1s linear infinite;\n --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n --default-transition-duration: 150ms;\n --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n --default-font-family: var(--font-sans), Helvetica, Arial, apple-system, sans-serif;\n --default-mono-font-family: var(--font-mono);\n }\n}\n@layer base {\n *, ::after, ::before, ::backdrop, ::file-selector-button {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n border: 0 solid;\n }\n html, :host {\n line-height: 1.5;\n -webkit-text-size-adjust: 100%;\n tab-size: 4;\n font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n font-feature-settings: var(--default-font-feature-settings, normal);\n font-variation-settings: var(--default-font-variation-settings, normal);\n -webkit-tap-highlight-color: transparent;\n }\n hr {\n height: 0;\n color: inherit;\n border-top-width: 1px;\n }\n abbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n }\n h1, h2, h3, h4, h5, h6 {\n font-size: inherit;\n font-weight: inherit;\n }\n a {\n color: inherit;\n -webkit-text-decoration: inherit;\n text-decoration: inherit;\n }\n b, strong {\n font-weight: bolder;\n }\n code, kbd, samp, pre {\n font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);\n font-feature-settings: var(--default-mono-font-feature-settings, normal);\n font-variation-settings: var(--default-mono-font-variation-settings, normal);\n font-size: 1em;\n }\n small {\n font-size: 80%;\n }\n sub, sup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n }\n sub {\n bottom: -0.25em;\n }\n sup {\n top: -0.5em;\n }\n table {\n text-indent: 0;\n border-color: inherit;\n border-collapse: collapse;\n }\n :-moz-focusring {\n outline: auto;\n }\n progress {\n vertical-align: baseline;\n }\n summary {\n display: list-item;\n }\n ol, ul, menu {\n list-style: none;\n }\n img, svg, video, canvas, audio, iframe, embed, object {\n display: block;\n vertical-align: middle;\n }\n img, video {\n max-width: 100%;\n height: auto;\n }\n button, input, select, optgroup, textarea, ::file-selector-button {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n border-radius: 0;\n background-color: transparent;\n opacity: 1;\n }\n :where(select:is([multiple], [size])) optgroup {\n font-weight: bolder;\n }\n :where(select:is([multiple], [size])) optgroup option {\n padding-inline-start: 20px;\n }\n ::file-selector-button {\n margin-inline-end: 4px;\n }\n ::placeholder {\n opacity: 1;\n }\n @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {\n ::placeholder {\n color: currentcolor;\n @supports (color: color-mix(in lab, red, red)) {\n color: color-mix(in oklab, currentcolor 50%, transparent);\n }\n }\n }\n textarea {\n resize: vertical;\n }\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n ::-webkit-date-and-time-value {\n min-height: 1lh;\n text-align: inherit;\n }\n ::-webkit-datetime-edit {\n display: inline-flex;\n }\n ::-webkit-datetime-edit-fields-wrapper {\n padding: 0;\n }\n ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {\n padding-block: 0;\n }\n ::-webkit-calendar-picker-indicator {\n line-height: 1;\n }\n :-moz-ui-invalid {\n box-shadow: none;\n }\n button, input:where([type=\"button\"], [type=\"reset\"], [type=\"submit\"]), ::file-selector-button {\n appearance: button;\n }\n ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {\n height: auto;\n }\n [hidden]:where(:not([hidden=\"until-found\"])) {\n display: none !important;\n }\n}\n@layer utilities {\n .pointer-events-none {\n pointer-events: none;\n }\n .sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border-width: 0;\n }\n .absolute {\n position: absolute;\n }\n .fixed {\n position: fixed;\n }\n .relative {\n position: relative;\n }\n .inset-0 {\n inset: calc(var(--spacing) * 0);\n }\n .-top-2 {\n top: calc(var(--spacing) * -2);\n }\n .top-0 {\n top: calc(var(--spacing) * 0);\n }\n .top-0\\.5 {\n top: calc(var(--spacing) * 0.5);\n }\n .top-1\\/2 {\n top: calc(1/2 * 100%);\n }\n .top-4 {\n top: calc(var(--spacing) * 4);\n }\n .top-\\[50\\%\\] {\n top: 50%;\n }\n .top-full {\n top: 100%;\n }\n .-right-2 {\n right: calc(var(--spacing) * -2);\n }\n .right-0 {\n right: calc(var(--spacing) * 0);\n }\n .right-4 {\n right: calc(var(--spacing) * 4);\n }\n .bottom-0 {\n bottom: calc(var(--spacing) * 0);\n }\n .left-0 {\n left: calc(var(--spacing) * 0);\n }\n .left-1\\/2 {\n left: calc(1/2 * 100%);\n }\n .left-2 {\n left: calc(var(--spacing) * 2);\n }\n .left-\\[50\\%\\] {\n left: 50%;\n }\n .z-0 {\n z-index: 0;\n }\n .z-10 {\n z-index: 10;\n }\n .z-50 {\n z-index: 50;\n }\n .order-3 {\n order: 3;\n }\n .order-4 {\n order: 4;\n }\n .order-5 {\n order: 5;\n }\n .order-6 {\n order: 6;\n }\n .order-7 {\n order: 7;\n }\n .order-first {\n order: -9999;\n }\n .container {\n width: 100%;\n @media (width >= 40rem) {\n max-width: 40rem;\n }\n @media (width >= 48rem) {\n max-width: 48rem;\n }\n @media (width >= 64rem) {\n max-width: 64rem;\n }\n @media (width >= 80rem) {\n max-width: 80rem;\n }\n @media (width >= 96rem) {\n max-width: 96rem;\n }\n }\n .-m-0\\.5 {\n margin: calc(var(--spacing) * -0.5);\n }\n .m-0 {\n margin: calc(var(--spacing) * 0);\n }\n .-mx-1 {\n margin-inline: calc(var(--spacing) * -1);\n }\n .my-1 {\n margin-block: calc(var(--spacing) * 1);\n }\n .my-2 {\n margin-block: calc(var(--spacing) * 2);\n }\n .-mt-1 {\n margin-top: calc(var(--spacing) * -1);\n }\n .-mt-2 {\n margin-top: calc(var(--spacing) * -2);\n }\n .-mt-4 {\n margin-top: calc(var(--spacing) * -4);\n }\n .mt-1 {\n margin-top: calc(var(--spacing) * 1);\n }\n .mt-2 {\n margin-top: calc(var(--spacing) * 2);\n }\n .mt-8 {\n margin-top: calc(var(--spacing) * 8);\n }\n .-mb-0\\.5 {\n margin-bottom: calc(var(--spacing) * -0.5);\n }\n .-mb-2 {\n margin-bottom: calc(var(--spacing) * -2);\n }\n .mb-1 {\n margin-bottom: calc(var(--spacing) * 1);\n }\n .mb-2 {\n margin-bottom: calc(var(--spacing) * 2);\n }\n .mb-4 {\n margin-bottom: calc(var(--spacing) * 4);\n }\n .ml-4 {\n margin-left: calc(var(--spacing) * 4);\n }\n .ml-auto {\n margin-left: auto;\n }\n .line-clamp-1 {\n overflow: hidden;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 1;\n }\n .block {\n display: block;\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .hidden {\n display: none;\n }\n .inline-flex {\n display: inline-flex;\n }\n .aspect-square {\n aspect-ratio: 1 / 1;\n }\n .size-2 {\n width: calc(var(--spacing) * 2);\n height: calc(var(--spacing) * 2);\n }\n .size-3 {\n width: calc(var(--spacing) * 3);\n height: calc(var(--spacing) * 3);\n }\n .size-3\\.5 {\n width: calc(var(--spacing) * 3.5);\n height: calc(var(--spacing) * 3.5);\n }\n .size-4 {\n width: calc(var(--spacing) * 4);\n height: calc(var(--spacing) * 4);\n }\n .size-5 {\n width: calc(var(--spacing) * 5);\n height: calc(var(--spacing) * 5);\n }\n .size-9 {\n width: calc(var(--spacing) * 9);\n height: calc(var(--spacing) * 9);\n }\n .size-16 {\n width: calc(var(--spacing) * 16);\n height: calc(var(--spacing) * 16);\n }\n .h-0 {\n height: calc(var(--spacing) * 0);\n }\n .h-3\\.5 {\n height: calc(var(--spacing) * 3.5);\n }\n .h-4 {\n height: calc(var(--spacing) * 4);\n }\n .h-5 {\n height: calc(var(--spacing) * 5);\n }\n .h-6 {\n height: calc(var(--spacing) * 6);\n }\n .h-8 {\n height: calc(var(--spacing) * 8);\n }\n .h-9 {\n height: calc(var(--spacing) * 9);\n }\n .h-10 {\n height: calc(var(--spacing) * 10);\n }\n .h-12 {\n height: calc(var(--spacing) * 12);\n }\n .h-16 {\n height: calc(var(--spacing) * 16);\n }\n .h-\\[2px\\] {\n height: 2px;\n }\n .h-\\[18px\\] {\n height: 18px;\n }\n .h-\\[20px\\] {\n height: 20px;\n }\n .h-\\[44px\\] {\n height: 44px;\n }\n .h-auto {\n height: auto;\n }\n .h-auto\\! {\n height: auto !important;\n }\n .h-full {\n height: 100%;\n }\n .h-max {\n height: max-content;\n }\n .h-px {\n height: 1px;\n }\n .max-h-\\(--radix-dropdown-menu-content-available-height\\) {\n max-height: var(--radix-dropdown-menu-content-available-height);\n }\n .max-h-0 {\n max-height: calc(var(--spacing) * 0);\n }\n .max-h-60 {\n max-height: calc(var(--spacing) * 60);\n }\n .max-h-\\[300px\\] {\n max-height: 300px;\n }\n .min-h-full {\n min-height: 100%;\n }\n .w-0 {\n width: calc(var(--spacing) * 0);\n }\n .w-4 {\n width: calc(var(--spacing) * 4);\n }\n .w-6 {\n width: calc(var(--spacing) * 6);\n }\n .w-12 {\n width: calc(var(--spacing) * 12);\n }\n .w-16 {\n width: calc(var(--spacing) * 16);\n }\n .w-20 {\n width: calc(var(--spacing) * 20);\n }\n .w-24 {\n width: calc(var(--spacing) * 24);\n }\n .w-28 {\n width: calc(var(--spacing) * 28);\n }\n .w-32 {\n width: calc(var(--spacing) * 32);\n }\n .w-40 {\n width: calc(var(--spacing) * 40);\n }\n .w-72 {\n width: calc(var(--spacing) * 72);\n }\n .w-full {\n width: 100%;\n }\n .max-w-0 {\n max-width: calc(var(--spacing) * 0);\n }\n .max-w-\\[calc\\(100\\%-2rem\\)\\] {\n max-width: calc(100% - 2rem);\n }\n .min-w-0 {\n min-width: calc(var(--spacing) * 0);\n }\n .min-w-\\[8rem\\] {\n min-width: 8rem;\n }\n .flex-1 {\n flex: 1;\n }\n .shrink-0 {\n flex-shrink: 0;\n }\n .origin-\\(--radix-dropdown-menu-content-transform-origin\\) {\n transform-origin: var(--radix-dropdown-menu-content-transform-origin);\n }\n .origin-\\(--radix-popover-content-transform-origin\\) {\n transform-origin: var(--radix-popover-content-transform-origin);\n }\n .-translate-x-0 {\n --tw-translate-x: calc(var(--spacing) * -0);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .-translate-x-1\\/2 {\n --tw-translate-x: calc(calc(1/2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .-translate-x-3 {\n --tw-translate-x: calc(var(--spacing) * -3);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .translate-x-2 {\n --tw-translate-x: calc(var(--spacing) * 2);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .translate-x-\\[-50\\%\\] {\n --tw-translate-x: -50%;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .-translate-y-1\\/2 {\n --tw-translate-y: calc(calc(1/2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .translate-y-\\[-50\\%\\] {\n --tw-translate-y: -50%;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .rotate-180 {\n rotate: 180deg;\n }\n .animate-pulse {\n animation: var(--animate-pulse);\n }\n .animate-spin {\n animation: var(--animate-spin);\n }\n .cursor-default {\n cursor: default;\n }\n .cursor-pointer {\n cursor: pointer;\n }\n .resize {\n resize: both;\n }\n .scroll-py-1 {\n scroll-padding-block: calc(var(--spacing) * 1);\n }\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n .flex-col {\n flex-direction: column;\n }\n .flex-col-reverse {\n flex-direction: column-reverse;\n }\n .items-center {\n align-items: center;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .gap-0 {\n gap: calc(var(--spacing) * 0);\n }\n .gap-0\\.5 {\n gap: calc(var(--spacing) * 0.5);\n }\n .gap-1\\.5 {\n gap: calc(var(--spacing) * 1.5);\n }\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n .gap-3 {\n gap: calc(var(--spacing) * 3);\n }\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n .gap-5 {\n gap: calc(var(--spacing) * 5);\n }\n .gap-6 {\n gap: calc(var(--spacing) * 6);\n }\n .gap-\\[10px\\] {\n gap: 10px;\n }\n .space-y-2 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-5 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .overflow-hidden {\n overflow: hidden;\n }\n .overflow-x-hidden {\n overflow-x: hidden;\n }\n .overflow-y-auto {\n overflow-y: auto;\n }\n .rounded-\\[4px\\] {\n border-radius: 4px;\n }\n .rounded-full {\n border-radius: calc(infinity * 1px);\n }\n .rounded-lg {\n border-radius: var(--radius);\n }\n .rounded-md {\n border-radius: calc(var(--radius) - 2px);\n }\n .rounded-sm {\n border-radius: calc(var(--radius) - 4px);\n }\n .rounded-xs {\n border-radius: var(--radius-xs);\n }\n .border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n .border-b {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 1px;\n }\n .border-border {\n border-color: var(--border);\n }\n .border-input {\n border-color: var(--input);\n }\n .border-primary {\n border-color: var(--primary);\n }\n .bg-accent {\n background-color: var(--accent);\n }\n .bg-background {\n background-color: var(--background);\n }\n .bg-black\\/50 {\n background-color: color-mix(in srgb, #000 50%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-black) 50%, transparent);\n }\n }\n .bg-border {\n background-color: var(--border);\n }\n .bg-destructive {\n background-color: var(--destructive);\n }\n .bg-muted {\n background-color: var(--muted);\n }\n .bg-popover {\n background-color: var(--popover);\n }\n .bg-primary {\n background-color: var(--primary);\n }\n .bg-secondary {\n background-color: var(--secondary);\n }\n .bg-transparent {\n background-color: transparent;\n }\n .fill-current {\n fill: currentcolor;\n }\n .fill-primary {\n fill: var(--primary);\n }\n .object-cover {\n object-fit: cover;\n }\n .p-0 {\n padding: calc(var(--spacing) * 0);\n }\n .p-1 {\n padding: calc(var(--spacing) * 1);\n }\n .p-3 {\n padding: calc(var(--spacing) * 3);\n }\n .p-4 {\n padding: calc(var(--spacing) * 4);\n }\n .p-6 {\n padding: calc(var(--spacing) * 6);\n }\n .px-1 {\n padding-inline: calc(var(--spacing) * 1);\n }\n .px-2 {\n padding-inline: calc(var(--spacing) * 2);\n }\n .px-3 {\n padding-inline: calc(var(--spacing) * 3);\n }\n .px-4 {\n padding-inline: calc(var(--spacing) * 4);\n }\n .px-6 {\n padding-inline: calc(var(--spacing) * 6);\n }\n .py-1 {\n padding-block: calc(var(--spacing) * 1);\n }\n .py-1\\.5 {\n padding-block: calc(var(--spacing) * 1.5);\n }\n .py-2 {\n padding-block: calc(var(--spacing) * 2);\n }\n .py-3 {\n padding-block: calc(var(--spacing) * 3);\n }\n .py-4 {\n padding-block: calc(var(--spacing) * 4);\n }\n .py-6 {\n padding-block: calc(var(--spacing) * 6);\n }\n .pt-2 {\n padding-top: calc(var(--spacing) * 2);\n }\n .pt-4 {\n padding-top: calc(var(--spacing) * 4);\n }\n .pr-2 {\n padding-right: calc(var(--spacing) * 2);\n }\n .pb-1 {\n padding-bottom: calc(var(--spacing) * 1);\n }\n .pb-2 {\n padding-bottom: calc(var(--spacing) * 2);\n }\n .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n .pb-40 {\n padding-bottom: calc(var(--spacing) * 40);\n }\n .pl-8 {\n padding-left: calc(var(--spacing) * 8);\n }\n .text-center {\n text-align: center;\n }\n .text-left {\n text-align: left;\n }\n .text-right {\n text-align: right;\n }\n .text-base {\n font-size: var(--text-base);\n line-height: var(--tw-leading, var(--text-base--line-height));\n }\n .text-lg {\n font-size: var(--text-lg);\n line-height: var(--tw-leading, var(--text-lg--line-height));\n }\n .text-sm {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n }\n .text-\\[13px\\] {\n font-size: 13px;\n }\n .leading-none {\n --tw-leading: 1;\n line-height: 1;\n }\n .font-bold {\n --tw-font-weight: var(--font-weight-bold);\n font-weight: var(--font-weight-bold);\n }\n .font-medium {\n --tw-font-weight: var(--font-weight-medium);\n font-weight: var(--font-weight-medium);\n }\n .font-semibold {\n --tw-font-weight: var(--font-weight-semibold);\n font-weight: var(--font-weight-semibold);\n }\n .tracking-tight {\n --tw-tracking: var(--tracking-tight);\n letter-spacing: var(--tracking-tight);\n }\n .tracking-widest {\n --tw-tracking: var(--tracking-widest);\n letter-spacing: var(--tracking-widest);\n }\n .text-ellipsis {\n text-overflow: ellipsis;\n }\n .whitespace-nowrap {\n white-space: nowrap;\n }\n .text-background {\n color: var(--background);\n }\n .text-current {\n color: currentcolor;\n }\n .text-destructive {\n color: var(--destructive);\n }\n .text-destructive-foreground {\n color: var(--destructive-foreground);\n }\n .text-foreground {\n color: var(--foreground);\n }\n .text-muted-foreground {\n color: var(--muted-foreground);\n }\n .text-popover-foreground {\n color: var(--popover-foreground);\n }\n .text-primary {\n color: var(--primary);\n }\n .text-primary-foreground {\n color: var(--primary-foreground);\n }\n .text-red-500 {\n color: var(--color-red-500);\n }\n .text-ring {\n color: var(--ring);\n }\n .text-secondary-foreground {\n color: var(--secondary-foreground);\n }\n .text-white {\n color: var(--color-white);\n }\n .line-through {\n text-decoration-line: line-through;\n }\n .underline {\n text-decoration-line: underline;\n }\n .underline-offset-4 {\n text-underline-offset: 4px;\n }\n .opacity-0 {\n opacity: 0%;\n }\n .opacity-50 {\n opacity: 50%;\n }\n .opacity-70 {\n opacity: 70%;\n }\n .opacity-100 {\n opacity: 100%;\n }\n .shadow {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .shadow-lg {\n --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .shadow-md {\n --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .shadow-xs {\n --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .ring {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .ring-offset-background {\n --tw-ring-offset-color: var(--background);\n }\n .outline-hidden {\n --tw-outline-style: none;\n outline-style: none;\n @media (forced-colors: active) {\n outline: 2px solid transparent;\n outline-offset: 2px;\n }\n }\n .outline {\n outline-style: var(--tw-outline-style);\n outline-width: 1px;\n }\n .transition {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-\\[color\\,box-shadow\\] {\n transition-property: color,box-shadow;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-colors {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-opacity {\n transition-property: opacity;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-shadow {\n transition-property: box-shadow;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-transform {\n transition-property: transform, translate, scale, rotate;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-none {\n transition-property: none;\n }\n .duration-200 {\n --tw-duration: 200ms;\n transition-duration: 200ms;\n }\n .ease-in-out {\n --tw-ease: var(--ease-in-out);\n transition-timing-function: var(--ease-in-out);\n }\n .outline-none {\n --tw-outline-style: none;\n outline-style: none;\n }\n .select-none {\n -webkit-user-select: none;\n user-select: none;\n }\n .duration-200 {\n animation-duration: 200ms;\n }\n .ease-in-out {\n animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n }\n .group-data-\\[disabled\\=true\\]\\:pointer-events-none {\n &:is(:where(.group)[data-disabled=\"true\"] *) {\n pointer-events: none;\n }\n }\n .group-data-\\[disabled\\=true\\]\\:opacity-50 {\n &:is(:where(.group)[data-disabled=\"true\"] *) {\n opacity: 50%;\n }\n }\n .peer-disabled\\:cursor-not-allowed {\n &:is(:where(.peer):disabled ~ *) {\n cursor: not-allowed;\n }\n }\n .peer-disabled\\:opacity-50 {\n &:is(:where(.peer):disabled ~ *) {\n opacity: 50%;\n }\n }\n .file\\:inline-flex {\n &::file-selector-button {\n display: inline-flex;\n }\n }\n .file\\:h-7 {\n &::file-selector-button {\n height: calc(var(--spacing) * 7);\n }\n }\n .file\\:border-0 {\n &::file-selector-button {\n border-style: var(--tw-border-style);\n border-width: 0px;\n }\n }\n .file\\:bg-transparent {\n &::file-selector-button {\n background-color: transparent;\n }\n }\n .file\\:text-sm {\n &::file-selector-button {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n }\n .file\\:font-medium {\n &::file-selector-button {\n --tw-font-weight: var(--font-weight-medium);\n font-weight: var(--font-weight-medium);\n }\n }\n .file\\:text-foreground {\n &::file-selector-button {\n color: var(--foreground);\n }\n }\n .placeholder\\:text-muted-foreground {\n &::placeholder {\n color: var(--muted-foreground);\n }\n }\n .after\\:absolute {\n &::after {\n content: var(--tw-content);\n position: absolute;\n }\n }\n .after\\:top-1\\/2 {\n &::after {\n content: var(--tw-content);\n top: calc(1/2 * 100%);\n }\n }\n .after\\:right-0 {\n &::after {\n content: var(--tw-content);\n right: calc(var(--spacing) * 0);\n }\n }\n .after\\:left-0 {\n &::after {\n content: var(--tw-content);\n left: calc(var(--spacing) * 0);\n }\n }\n .after\\:z-0 {\n &::after {\n content: var(--tw-content);\n z-index: 0;\n }\n }\n .after\\:h-px {\n &::after {\n content: var(--tw-content);\n height: 1px;\n }\n }\n .after\\:-translate-y-1\\/2 {\n &::after {\n content: var(--tw-content);\n --tw-translate-y: calc(calc(1/2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n }\n .after\\:bg-background {\n &::after {\n content: var(--tw-content);\n background-color: var(--background);\n }\n }\n .after\\:content-\\[\\'\\'\\] {\n &::after {\n content: var(--tw-content);\n --tw-content: '';\n content: var(--tw-content);\n }\n }\n .last\\:border-b-0 {\n &:last-child {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 0px;\n }\n }\n .hover\\:bg-accent {\n &:hover {\n @media (hover: hover) {\n background-color: var(--accent);\n }\n }\n }\n .hover\\:bg-destructive\\/90 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--destructive);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--destructive) 90%, transparent);\n }\n }\n }\n }\n .hover\\:bg-muted {\n &:hover {\n @media (hover: hover) {\n background-color: var(--muted);\n }\n }\n }\n .hover\\:bg-primary\\/90 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--primary);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--primary) 90%, transparent);\n }\n }\n }\n }\n .hover\\:bg-secondary\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--secondary);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--secondary) 80%, transparent);\n }\n }\n }\n }\n .hover\\:text-accent-foreground {\n &:hover {\n @media (hover: hover) {\n color: var(--accent-foreground);\n }\n }\n }\n .hover\\:text-foreground {\n &:hover {\n @media (hover: hover) {\n color: var(--foreground);\n }\n }\n }\n .hover\\:text-muted-foreground {\n &:hover {\n @media (hover: hover) {\n color: var(--muted-foreground);\n }\n }\n }\n .hover\\:underline {\n &:hover {\n @media (hover: hover) {\n text-decoration-line: underline;\n }\n }\n }\n .hover\\:opacity-100 {\n &:hover {\n @media (hover: hover) {\n opacity: 100%;\n }\n }\n }\n .focus\\:bg-accent {\n &:focus {\n background-color: var(--accent);\n }\n }\n .focus\\:text-accent-foreground {\n &:focus {\n color: var(--accent-foreground);\n }\n }\n .focus\\:ring-2 {\n &:focus {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n .focus\\:ring-ring {\n &:focus {\n --tw-ring-color: var(--ring);\n }\n }\n .focus\\:ring-offset-2 {\n &:focus {\n --tw-ring-offset-width: 2px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n }\n }\n .focus\\:outline-hidden {\n &:focus {\n --tw-outline-style: none;\n outline-style: none;\n @media (forced-colors: active) {\n outline: 2px solid transparent;\n outline-offset: 2px;\n }\n }\n }\n .focus-visible\\:border-ring {\n &:focus-visible {\n border-color: var(--ring);\n }\n }\n .focus-visible\\:ring-\\[3px\\] {\n &:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n .focus-visible\\:ring-destructive\\/20 {\n &:focus-visible {\n --tw-ring-color: var(--destructive);\n @supports (color: color-mix(in lab, red, red)) {\n --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);\n }\n }\n }\n .focus-visible\\:ring-ring\\/50 {\n &:focus-visible {\n --tw-ring-color: var(--ring);\n @supports (color: color-mix(in lab, red, red)) {\n --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);\n }\n }\n }\n .disabled\\:pointer-events-none {\n &:disabled {\n pointer-events: none;\n }\n }\n .disabled\\:cursor-not-allowed {\n &:disabled {\n cursor: not-allowed;\n }\n }\n .disabled\\:opacity-50 {\n &:disabled {\n opacity: 50%;\n }\n }\n .has-\\[\\>svg\\]\\:px-2\\.5 {\n &:has(>svg) {\n padding-inline: calc(var(--spacing) * 2.5);\n }\n }\n .has-\\[\\>svg\\]\\:px-3 {\n &:has(>svg) {\n padding-inline: calc(var(--spacing) * 3);\n }\n }\n .has-\\[\\>svg\\]\\:px-4 {\n &:has(>svg) {\n padding-inline: calc(var(--spacing) * 4);\n }\n }\n .aria-invalid\\:border-destructive {\n &[aria-invalid=\"true\"] {\n border-color: var(--destructive);\n }\n }\n .aria-invalid\\:ring-destructive\\/20 {\n &[aria-invalid=\"true\"] {\n --tw-ring-color: var(--destructive);\n @supports (color: color-mix(in lab, red, red)) {\n --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);\n }\n }\n }\n .data-\\[disabled\\]\\:pointer-events-none {\n &[data-disabled] {\n pointer-events: none;\n }\n }\n .data-\\[disabled\\]\\:opacity-50 {\n &[data-disabled] {\n opacity: 50%;\n }\n }\n .data-\\[disabled\\=true\\]\\:pointer-events-none {\n &[data-disabled=\"true\"] {\n pointer-events: none;\n }\n }\n .data-\\[disabled\\=true\\]\\:opacity-50 {\n &[data-disabled=\"true\"] {\n opacity: 50%;\n }\n }\n .data-\\[error\\=true\\]\\:text-destructive-foreground {\n &[data-error=\"true\"] {\n color: var(--destructive-foreground);\n }\n }\n .data-\\[inset\\]\\:pl-8 {\n &[data-inset] {\n padding-left: calc(var(--spacing) * 8);\n }\n }\n .data-\\[selected\\=true\\]\\:bg-accent {\n &[data-selected=\"true\"] {\n background-color: var(--accent);\n }\n }\n .data-\\[selected\\=true\\]\\:text-accent-foreground {\n &[data-selected=\"true\"] {\n color: var(--accent-foreground);\n }\n }\n .data-\\[side\\=bottom\\]\\:slide-in-from-top-2 {\n &[data-side=\"bottom\"] {\n --tw-enter-translate-y: -0.5rem;\n }\n }\n .data-\\[side\\=left\\]\\:slide-in-from-right-2 {\n &[data-side=\"left\"] {\n --tw-enter-translate-x: 0.5rem;\n }\n }\n .data-\\[side\\=right\\]\\:slide-in-from-left-2 {\n &[data-side=\"right\"] {\n --tw-enter-translate-x: -0.5rem;\n }\n }\n .data-\\[side\\=top\\]\\:slide-in-from-bottom-2 {\n &[data-side=\"top\"] {\n --tw-enter-translate-y: 0.5rem;\n }\n }\n .\\*\\*\\:data-\\[slot\\=command-input-wrapper\\]\\:h-12 {\n :is(& *) {\n &[data-slot=\"command-input-wrapper\"] {\n height: calc(var(--spacing) * 12);\n }\n }\n }\n .data-\\[state\\=checked\\]\\:border-primary {\n &[data-state=\"checked\"] {\n border-color: var(--primary);\n }\n }\n .data-\\[state\\=checked\\]\\:bg-primary {\n &[data-state=\"checked\"] {\n background-color: var(--primary);\n }\n }\n .data-\\[state\\=checked\\]\\:text-primary-foreground {\n &[data-state=\"checked\"] {\n color: var(--primary-foreground);\n }\n }\n .data-\\[state\\=closed\\]\\:animate-out {\n &[data-state=\"closed\"] {\n animation-name: exit;\n animation-duration: 150ms;\n --tw-exit-opacity: initial;\n --tw-exit-scale: initial;\n --tw-exit-rotate: initial;\n --tw-exit-translate-x: initial;\n --tw-exit-translate-y: initial;\n }\n }\n .data-\\[state\\=closed\\]\\:fade-out-0 {\n &[data-state=\"closed\"] {\n --tw-exit-opacity: 0;\n }\n }\n .data-\\[state\\=closed\\]\\:zoom-out-95 {\n &[data-state=\"closed\"] {\n --tw-exit-scale: .95;\n }\n }\n .data-\\[state\\=open\\]\\:bg-accent {\n &[data-state=\"open\"] {\n background-color: var(--accent);\n }\n }\n .data-\\[state\\=open\\]\\:text-accent-foreground {\n &[data-state=\"open\"] {\n color: var(--accent-foreground);\n }\n }\n .data-\\[state\\=open\\]\\:text-muted-foreground {\n &[data-state=\"open\"] {\n color: var(--muted-foreground);\n }\n }\n .data-\\[state\\=open\\]\\:animate-in {\n &[data-state=\"open\"] {\n animation-name: enter;\n animation-duration: 150ms;\n --tw-enter-opacity: initial;\n --tw-enter-scale: initial;\n --tw-enter-rotate: initial;\n --tw-enter-translate-x: initial;\n --tw-enter-translate-y: initial;\n }\n }\n .data-\\[state\\=open\\]\\:fade-in-0 {\n &[data-state=\"open\"] {\n --tw-enter-opacity: 0;\n }\n }\n .data-\\[state\\=open\\]\\:zoom-in-95 {\n &[data-state=\"open\"] {\n --tw-enter-scale: .95;\n }\n }\n .data-\\[variant\\=destructive\\]\\:text-destructive {\n &[data-variant=\"destructive\"] {\n color: var(--destructive);\n }\n }\n .data-\\[variant\\=destructive\\]\\:focus\\:bg-destructive\\/10 {\n &[data-variant=\"destructive\"] {\n &:focus {\n background-color: var(--destructive);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--destructive) 10%, transparent);\n }\n }\n }\n }\n .data-\\[variant\\=destructive\\]\\:focus\\:text-destructive {\n &[data-variant=\"destructive\"] {\n &:focus {\n color: var(--destructive);\n }\n }\n }\n .max-md\\:cursor-pointer {\n @media (width < 48rem) {\n cursor: pointer;\n }\n }\n .max-sm\\:hidden {\n @media (width < 40rem) {\n display: none;\n }\n }\n .max-sm\\:h-\\[52px\\] {\n @media (width < 40rem) {\n height: 52px;\n }\n }\n .sm\\:static {\n @media (width >= 40rem) {\n position: static;\n }\n }\n .sm\\:w-fit {\n @media (width >= 40rem) {\n width: fit-content;\n }\n }\n .sm\\:max-w-lg {\n @media (width >= 40rem) {\n max-width: var(--container-lg);\n }\n }\n .sm\\:flex-row {\n @media (width >= 40rem) {\n flex-direction: row;\n }\n }\n .sm\\:justify-end {\n @media (width >= 40rem) {\n justify-content: flex-end;\n }\n }\n .sm\\:bg-transparent {\n @media (width >= 40rem) {\n background-color: transparent;\n }\n }\n .sm\\:px-0 {\n @media (width >= 40rem) {\n padding-inline: calc(var(--spacing) * 0);\n }\n }\n .sm\\:pb-0 {\n @media (width >= 40rem) {\n padding-bottom: calc(var(--spacing) * 0);\n }\n }\n .sm\\:text-left {\n @media (width >= 40rem) {\n text-align: left;\n }\n }\n .md\\:order-last {\n @media (width >= 48rem) {\n order: 9999;\n }\n }\n .md\\:order-none {\n @media (width >= 48rem) {\n order: 0;\n }\n }\n .md\\:col-span-2 {\n @media (width >= 48rem) {\n grid-column: span 2 / span 2;\n }\n }\n .md\\:col-span-3 {\n @media (width >= 48rem) {\n grid-column: span 3 / span 3;\n }\n }\n .md\\:col-span-4 {\n @media (width >= 48rem) {\n grid-column: span 4 / span 4;\n }\n }\n .md\\:block {\n @media (width >= 48rem) {\n display: block;\n }\n }\n .md\\:flex {\n @media (width >= 48rem) {\n display: flex;\n }\n }\n .md\\:grid {\n @media (width >= 48rem) {\n display: grid;\n }\n }\n .md\\:hidden {\n @media (width >= 48rem) {\n display: none;\n }\n }\n .md\\:max-w-\\[75\\%\\] {\n @media (width >= 48rem) {\n max-width: 75%;\n }\n }\n .md\\:grid-cols-2 {\n @media (width >= 48rem) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n }\n .md\\:grid-cols-3 {\n @media (width >= 48rem) {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n }\n .md\\:grid-cols-7 {\n @media (width >= 48rem) {\n grid-template-columns: repeat(7, minmax(0, 1fr));\n }\n }\n .md\\:gap-0 {\n @media (width >= 48rem) {\n gap: calc(var(--spacing) * 0);\n }\n }\n .md\\:px-8 {\n @media (width >= 48rem) {\n padding-inline: calc(var(--spacing) * 8);\n }\n }\n .md\\:py-12 {\n @media (width >= 48rem) {\n padding-block: calc(var(--spacing) * 12);\n }\n }\n .md\\:text-sm {\n @media (width >= 48rem) {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n }\n .dark\\:focus-visible\\:ring-destructive\\/40 {\n @media (prefers-color-scheme: dark) {\n &:focus-visible {\n --tw-ring-color: var(--destructive);\n @supports (color: color-mix(in lab, red, red)) {\n --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);\n }\n }\n }\n }\n .dark\\:aria-invalid\\:ring-destructive\\/40 {\n @media (prefers-color-scheme: dark) {\n &[aria-invalid=\"true\"] {\n --tw-ring-color: var(--destructive);\n @supports (color: color-mix(in lab, red, red)) {\n --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);\n }\n }\n }\n }\n .dark\\:data-\\[variant\\=destructive\\]\\:focus\\:bg-destructive\\/20 {\n @media (prefers-color-scheme: dark) {\n &[data-variant=\"destructive\"] {\n &:focus {\n background-color: var(--destructive);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--destructive) 20%, transparent);\n }\n }\n }\n }\n }\n .\\[\\&_\\[cmdk-group-heading\\]\\]\\:px-2 {\n & [cmdk-group-heading] {\n padding-inline: calc(var(--spacing) * 2);\n }\n }\n .\\[\\&_\\[cmdk-group-heading\\]\\]\\:py-1\\.5 {\n & [cmdk-group-heading] {\n padding-block: calc(var(--spacing) * 1.5);\n }\n }\n .\\[\\&_\\[cmdk-group-heading\\]\\]\\:text-xs {\n & [cmdk-group-heading] {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n }\n }\n .\\[\\&_\\[cmdk-group-heading\\]\\]\\:font-medium {\n & [cmdk-group-heading] {\n --tw-font-weight: var(--font-weight-medium);\n font-weight: var(--font-weight-medium);\n }\n }\n .\\[\\&_\\[cmdk-group-heading\\]\\]\\:text-muted-foreground {\n & [cmdk-group-heading] {\n color: var(--muted-foreground);\n }\n }\n .\\[\\&_\\[cmdk-group\\]\\]\\:px-2 {\n & [cmdk-group] {\n padding-inline: calc(var(--spacing) * 2);\n }\n }\n .\\[\\&_\\[cmdk-group\\]\\:not\\(\\[hidden\\]\\)_\\~\\[cmdk-group\\]\\]\\:pt-0 {\n & [cmdk-group]:not([hidden]) ~[cmdk-group] {\n padding-top: calc(var(--spacing) * 0);\n }\n }\n .\\[\\&_\\[cmdk-input-wrapper\\]_svg\\]\\:h-5 {\n & [cmdk-input-wrapper] svg {\n height: calc(var(--spacing) * 5);\n }\n }\n .\\[\\&_\\[cmdk-input-wrapper\\]_svg\\]\\:w-5 {\n & [cmdk-input-wrapper] svg {\n width: calc(var(--spacing) * 5);\n }\n }\n .\\[\\&_\\[cmdk-input\\]\\]\\:h-12 {\n & [cmdk-input] {\n height: calc(var(--spacing) * 12);\n }\n }\n .\\[\\&_\\[cmdk-item\\]\\]\\:px-2 {\n & [cmdk-item] {\n padding-inline: calc(var(--spacing) * 2);\n }\n }\n .\\[\\&_\\[cmdk-item\\]\\]\\:py-3 {\n & [cmdk-item] {\n padding-block: calc(var(--spacing) * 3);\n }\n }\n .\\[\\&_\\[cmdk-item\\]_svg\\]\\:h-5 {\n & [cmdk-item] svg {\n height: calc(var(--spacing) * 5);\n }\n }\n .\\[\\&_\\[cmdk-item\\]_svg\\]\\:w-5 {\n & [cmdk-item] svg {\n width: calc(var(--spacing) * 5);\n }\n }\n .\\[\\&_svg\\]\\:pointer-events-none {\n & svg {\n pointer-events: none;\n }\n }\n .\\[\\&_svg\\]\\:shrink-0 {\n & svg {\n flex-shrink: 0;\n }\n }\n .\\[\\&_svg\\:not\\(\\[class\\*\\=\\'size-\\'\\]\\)\\]\\:size-4 {\n & svg:not([class*='size-']) {\n width: calc(var(--spacing) * 4);\n height: calc(var(--spacing) * 4);\n }\n }\n .\\[\\&_svg\\:not\\(\\[class\\*\\=\\'text-\\'\\]\\)\\]\\:text-muted-foreground {\n & svg:not([class*='text-']) {\n color: var(--muted-foreground);\n }\n }\n .data-\\[variant\\=destructive\\]\\:\\*\\:\\[svg\\]\\:\\!text-destructive {\n &[data-variant=\"destructive\"] {\n :is(& > *) {\n &:is(svg) {\n color: var(--destructive) !important;\n }\n }\n }\n }\n}\n@layer base {\n ::selection {\n background-color: var(--primary);\n color: var(--primary-foreground);\n }\n input:-webkit-autofill,\n input:-webkit-autofill:hover,\n input:-webkit-autofill:focus,\n input:-webkit-autofill:active {\n -webkit-box-shadow: 0 0 0 30px var(--muted) inset !important;\n -webkit-text-fill-color: var(--foreground) !important;\n }\n input:-moz-autofill,\n input:autofill {\n background-color: var(--muted);\n color: var(--foreground);\n }\n * {\n --tw-border-style: solid;\n border-style: solid;\n border-color: var(--border);\n outline-color: var(--ring);\n @supports (color: color-mix(in lab, red, red)) {\n outline-color: color-mix(in oklab, var(--ring) 50%, transparent);\n }\n }\n .checkout-embed {\n background-color: var(--background);\n font-family: var(--font-sans), Helvetica, Arial, apple-system, sans-serif;\n color: var(--foreground);\n }\n h2 {\n font-size: var(--text-2xl);\n line-height: var(--tw-leading, var(--text-2xl--line-height));\n --tw-font-weight: var(--font-weight-bold);\n font-weight: var(--font-weight-bold);\n --tw-tracking: var(--tracking-tight);\n letter-spacing: var(--tracking-tight);\n }\n p {\n --tw-tracking: var(--tracking-tight);\n letter-spacing: var(--tracking-tight);\n }\n}\n@layer utilities {\n .scrollbar-hidden {\n scrollbar-width: none;\n }\n .scrollbar-hidden::-webkit-scrollbar {\n display: none;\n }\n}\n@keyframes enter {\n from {\n opacity: var(--tw-enter-opacity, 1);\n transform: translate3d(var(--tw-enter-translate-x, 0), var(--tw-enter-translate-y, 0), 0) scale3d(var(--tw-enter-scale, 1), var(--tw-enter-scale, 1), var(--tw-enter-scale, 1)) rotate(var(--tw-enter-rotate, 0));\n }\n}\n@keyframes exit {\n to {\n opacity: var(--tw-exit-opacity, 1);\n transform: translate3d(var(--tw-exit-translate-x, 0), var(--tw-exit-translate-y, 0), 0) scale3d(var(--tw-exit-scale, 1), var(--tw-exit-scale, 1), var(--tw-exit-scale, 1)) rotate(var(--tw-exit-rotate, 0));\n }\n}\n@property --tw-translate-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-space-y-reverse {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-border-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\n}\n@property --tw-leading {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-font-weight {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-tracking {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-shadow-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-inset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-shadow-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-inset-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-ring-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-ring-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-inset-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-ring-inset {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ring-offset-width {\n syntax: \"<length>\";\n inherits: false;\n initial-value: 0px;\n}\n@property --tw-ring-offset-color {\n syntax: \"*\";\n inherits: false;\n initial-value: #fff;\n}\n@property --tw-ring-offset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-outline-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\n}\n@property --tw-duration {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ease {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-content {\n syntax: \"*\";\n initial-value: \"\";\n inherits: false;\n}\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n@keyframes pulse {\n 50% {\n opacity: 0.5;\n }\n}\n@layer properties {\n @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {\n *, ::before, ::after, ::backdrop {\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-translate-z: 0;\n --tw-space-y-reverse: 0;\n --tw-border-style: solid;\n --tw-leading: initial;\n --tw-font-weight: initial;\n --tw-tracking: initial;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-color: initial;\n --tw-shadow-alpha: 100%;\n --tw-inset-shadow: 0 0 #0000;\n --tw-inset-shadow-color: initial;\n --tw-inset-shadow-alpha: 100%;\n --tw-ring-color: initial;\n --tw-ring-shadow: 0 0 #0000;\n --tw-inset-ring-color: initial;\n --tw-inset-ring-shadow: 0 0 #0000;\n --tw-ring-inset: initial;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-outline-style: solid;\n --tw-duration: initial;\n --tw-ease: initial;\n --tw-content: \"\";\n }\n }\n}\n";
7537
+ var css_248z = "/*! tailwindcss v4.1.12 | MIT License | https://tailwindcss.com */\n@layer properties;\n@layer theme, base, components, utilities;\n@layer theme {\n :root, :host {\n --font-sans: var(--font-sans), Helvetica, Arial, apple-system, sans-serif;\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\",\n \"Courier New\", monospace;\n --color-red-500: oklch(63.7% 0.237 25.331);\n --color-black: #000;\n --color-white: #fff;\n --spacing: 0.25rem;\n --container-lg: 32rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\n --text-sm: 0.875rem;\n --text-sm--line-height: calc(1.25 / 0.875);\n --text-base: 1rem;\n --text-base--line-height: calc(1.5 / 1);\n --text-lg: 1.125rem;\n --text-lg--line-height: calc(1.75 / 1.125);\n --text-2xl: 1.5rem;\n --text-2xl--line-height: calc(2 / 1.5);\n --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --tracking-tight: -0.025em;\n --tracking-widest: 0.1em;\n --radius-xs: 0.125rem;\n --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);\n --animate-spin: spin 1s linear infinite;\n --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n --default-transition-duration: 150ms;\n --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n --default-font-family: var(--font-sans), Helvetica, Arial, apple-system, sans-serif;\n --default-mono-font-family: var(--font-mono);\n }\n}\n@layer base {\n *, ::after, ::before, ::backdrop, ::file-selector-button {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n border: 0 solid;\n }\n html, :host {\n line-height: 1.5;\n -webkit-text-size-adjust: 100%;\n tab-size: 4;\n font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n font-feature-settings: var(--default-font-feature-settings, normal);\n font-variation-settings: var(--default-font-variation-settings, normal);\n -webkit-tap-highlight-color: transparent;\n }\n hr {\n height: 0;\n color: inherit;\n border-top-width: 1px;\n }\n abbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n }\n h1, h2, h3, h4, h5, h6 {\n font-size: inherit;\n font-weight: inherit;\n }\n a {\n color: inherit;\n -webkit-text-decoration: inherit;\n text-decoration: inherit;\n }\n b, strong {\n font-weight: bolder;\n }\n code, kbd, samp, pre {\n font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);\n font-feature-settings: var(--default-mono-font-feature-settings, normal);\n font-variation-settings: var(--default-mono-font-variation-settings, normal);\n font-size: 1em;\n }\n small {\n font-size: 80%;\n }\n sub, sup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n }\n sub {\n bottom: -0.25em;\n }\n sup {\n top: -0.5em;\n }\n table {\n text-indent: 0;\n border-color: inherit;\n border-collapse: collapse;\n }\n :-moz-focusring {\n outline: auto;\n }\n progress {\n vertical-align: baseline;\n }\n summary {\n display: list-item;\n }\n ol, ul, menu {\n list-style: none;\n }\n img, svg, video, canvas, audio, iframe, embed, object {\n display: block;\n vertical-align: middle;\n }\n img, video {\n max-width: 100%;\n height: auto;\n }\n button, input, select, optgroup, textarea, ::file-selector-button {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n border-radius: 0;\n background-color: transparent;\n opacity: 1;\n }\n :where(select:is([multiple], [size])) optgroup {\n font-weight: bolder;\n }\n :where(select:is([multiple], [size])) optgroup option {\n padding-inline-start: 20px;\n }\n ::file-selector-button {\n margin-inline-end: 4px;\n }\n ::placeholder {\n opacity: 1;\n }\n @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {\n ::placeholder {\n color: currentcolor;\n @supports (color: color-mix(in lab, red, red)) {\n color: color-mix(in oklab, currentcolor 50%, transparent);\n }\n }\n }\n textarea {\n resize: vertical;\n }\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n ::-webkit-date-and-time-value {\n min-height: 1lh;\n text-align: inherit;\n }\n ::-webkit-datetime-edit {\n display: inline-flex;\n }\n ::-webkit-datetime-edit-fields-wrapper {\n padding: 0;\n }\n ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {\n padding-block: 0;\n }\n ::-webkit-calendar-picker-indicator {\n line-height: 1;\n }\n :-moz-ui-invalid {\n box-shadow: none;\n }\n button, input:where([type=\"button\"], [type=\"reset\"], [type=\"submit\"]), ::file-selector-button {\n appearance: button;\n }\n ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {\n height: auto;\n }\n [hidden]:where(:not([hidden=\"until-found\"])) {\n display: none !important;\n }\n}\n@layer utilities {\n .pointer-events-none {\n pointer-events: none;\n }\n .sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border-width: 0;\n }\n .absolute {\n position: absolute;\n }\n .fixed {\n position: fixed;\n }\n .relative {\n position: relative;\n }\n .inset-0 {\n inset: calc(var(--spacing) * 0);\n }\n .-top-2 {\n top: calc(var(--spacing) * -2);\n }\n .top-0 {\n top: calc(var(--spacing) * 0);\n }\n .top-0\\.5 {\n top: calc(var(--spacing) * 0.5);\n }\n .top-1\\/2 {\n top: calc(1/2 * 100%);\n }\n .top-4 {\n top: calc(var(--spacing) * 4);\n }\n .top-\\[50\\%\\] {\n top: 50%;\n }\n .top-full {\n top: 100%;\n }\n .-right-2 {\n right: calc(var(--spacing) * -2);\n }\n .right-0 {\n right: calc(var(--spacing) * 0);\n }\n .right-4 {\n right: calc(var(--spacing) * 4);\n }\n .bottom-0 {\n bottom: calc(var(--spacing) * 0);\n }\n .left-0 {\n left: calc(var(--spacing) * 0);\n }\n .left-1\\/2 {\n left: calc(1/2 * 100%);\n }\n .left-2 {\n left: calc(var(--spacing) * 2);\n }\n .left-\\[50\\%\\] {\n left: 50%;\n }\n .z-0 {\n z-index: 0;\n }\n .z-10 {\n z-index: 10;\n }\n .z-50 {\n z-index: 50;\n }\n .order-3 {\n order: 3;\n }\n .order-4 {\n order: 4;\n }\n .order-5 {\n order: 5;\n }\n .order-6 {\n order: 6;\n }\n .order-7 {\n order: 7;\n }\n .order-first {\n order: -9999;\n }\n .container {\n width: 100%;\n @media (width >= 40rem) {\n max-width: 40rem;\n }\n @media (width >= 48rem) {\n max-width: 48rem;\n }\n @media (width >= 64rem) {\n max-width: 64rem;\n }\n @media (width >= 80rem) {\n max-width: 80rem;\n }\n @media (width >= 96rem) {\n max-width: 96rem;\n }\n }\n .-m-0\\.5 {\n margin: calc(var(--spacing) * -0.5);\n }\n .m-0 {\n margin: calc(var(--spacing) * 0);\n }\n .-mx-1 {\n margin-inline: calc(var(--spacing) * -1);\n }\n .my-1 {\n margin-block: calc(var(--spacing) * 1);\n }\n .my-2 {\n margin-block: calc(var(--spacing) * 2);\n }\n .-mt-1 {\n margin-top: calc(var(--spacing) * -1);\n }\n .-mt-2 {\n margin-top: calc(var(--spacing) * -2);\n }\n .-mt-4 {\n margin-top: calc(var(--spacing) * -4);\n }\n .mt-1 {\n margin-top: calc(var(--spacing) * 1);\n }\n .mt-2 {\n margin-top: calc(var(--spacing) * 2);\n }\n .mt-8 {\n margin-top: calc(var(--spacing) * 8);\n }\n .-mb-0\\.5 {\n margin-bottom: calc(var(--spacing) * -0.5);\n }\n .-mb-2 {\n margin-bottom: calc(var(--spacing) * -2);\n }\n .mb-1 {\n margin-bottom: calc(var(--spacing) * 1);\n }\n .mb-2 {\n margin-bottom: calc(var(--spacing) * 2);\n }\n .mb-4 {\n margin-bottom: calc(var(--spacing) * 4);\n }\n .ml-4 {\n margin-left: calc(var(--spacing) * 4);\n }\n .ml-auto {\n margin-left: auto;\n }\n .line-clamp-1 {\n overflow: hidden;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 1;\n }\n .block {\n display: block;\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .hidden {\n display: none;\n }\n .inline-flex {\n display: inline-flex;\n }\n .aspect-square {\n aspect-ratio: 1 / 1;\n }\n .size-2 {\n width: calc(var(--spacing) * 2);\n height: calc(var(--spacing) * 2);\n }\n .size-3 {\n width: calc(var(--spacing) * 3);\n height: calc(var(--spacing) * 3);\n }\n .size-3\\.5 {\n width: calc(var(--spacing) * 3.5);\n height: calc(var(--spacing) * 3.5);\n }\n .size-4 {\n width: calc(var(--spacing) * 4);\n height: calc(var(--spacing) * 4);\n }\n .size-5 {\n width: calc(var(--spacing) * 5);\n height: calc(var(--spacing) * 5);\n }\n .size-9 {\n width: calc(var(--spacing) * 9);\n height: calc(var(--spacing) * 9);\n }\n .size-16 {\n width: calc(var(--spacing) * 16);\n height: calc(var(--spacing) * 16);\n }\n .h-0 {\n height: calc(var(--spacing) * 0);\n }\n .h-3\\.5 {\n height: calc(var(--spacing) * 3.5);\n }\n .h-4 {\n height: calc(var(--spacing) * 4);\n }\n .h-5 {\n height: calc(var(--spacing) * 5);\n }\n .h-6 {\n height: calc(var(--spacing) * 6);\n }\n .h-8 {\n height: calc(var(--spacing) * 8);\n }\n .h-9 {\n height: calc(var(--spacing) * 9);\n }\n .h-10 {\n height: calc(var(--spacing) * 10);\n }\n .h-12 {\n height: calc(var(--spacing) * 12);\n }\n .h-16 {\n height: calc(var(--spacing) * 16);\n }\n .h-\\[2px\\] {\n height: 2px;\n }\n .h-\\[18px\\] {\n height: 18px;\n }\n .h-\\[20px\\] {\n height: 20px;\n }\n .h-\\[44px\\] {\n height: 44px;\n }\n .h-auto {\n height: auto;\n }\n .h-auto\\! {\n height: auto !important;\n }\n .h-full {\n height: 100%;\n }\n .h-max {\n height: max-content;\n }\n .h-px {\n height: 1px;\n }\n .max-h-\\(--radix-dropdown-menu-content-available-height\\) {\n max-height: var(--radix-dropdown-menu-content-available-height);\n }\n .max-h-0 {\n max-height: calc(var(--spacing) * 0);\n }\n .max-h-60 {\n max-height: calc(var(--spacing) * 60);\n }\n .max-h-\\[300px\\] {\n max-height: 300px;\n }\n .min-h-full {\n min-height: 100%;\n }\n .w-0 {\n width: calc(var(--spacing) * 0);\n }\n .w-4 {\n width: calc(var(--spacing) * 4);\n }\n .w-6 {\n width: calc(var(--spacing) * 6);\n }\n .w-12 {\n width: calc(var(--spacing) * 12);\n }\n .w-16 {\n width: calc(var(--spacing) * 16);\n }\n .w-20 {\n width: calc(var(--spacing) * 20);\n }\n .w-24 {\n width: calc(var(--spacing) * 24);\n }\n .w-28 {\n width: calc(var(--spacing) * 28);\n }\n .w-32 {\n width: calc(var(--spacing) * 32);\n }\n .w-40 {\n width: calc(var(--spacing) * 40);\n }\n .w-72 {\n width: calc(var(--spacing) * 72);\n }\n .w-full {\n width: 100%;\n }\n .max-w-0 {\n max-width: calc(var(--spacing) * 0);\n }\n .max-w-\\[calc\\(100\\%-2rem\\)\\] {\n max-width: calc(100% - 2rem);\n }\n .min-w-0 {\n min-width: calc(var(--spacing) * 0);\n }\n .min-w-\\[8rem\\] {\n min-width: 8rem;\n }\n .flex-1 {\n flex: 1;\n }\n .shrink-0 {\n flex-shrink: 0;\n }\n .origin-\\(--radix-dropdown-menu-content-transform-origin\\) {\n transform-origin: var(--radix-dropdown-menu-content-transform-origin);\n }\n .origin-\\(--radix-popover-content-transform-origin\\) {\n transform-origin: var(--radix-popover-content-transform-origin);\n }\n .-translate-x-0 {\n --tw-translate-x: calc(var(--spacing) * -0);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .-translate-x-1\\/2 {\n --tw-translate-x: calc(calc(1/2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .-translate-x-3 {\n --tw-translate-x: calc(var(--spacing) * -3);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .translate-x-2 {\n --tw-translate-x: calc(var(--spacing) * 2);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .translate-x-\\[-50\\%\\] {\n --tw-translate-x: -50%;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .-translate-y-1\\/2 {\n --tw-translate-y: calc(calc(1/2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .translate-y-\\[-50\\%\\] {\n --tw-translate-y: -50%;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .rotate-180 {\n rotate: 180deg;\n }\n .animate-pulse {\n animation: var(--animate-pulse);\n }\n .animate-spin {\n animation: var(--animate-spin);\n }\n .cursor-default {\n cursor: default;\n }\n .cursor-pointer {\n cursor: pointer;\n }\n .resize {\n resize: both;\n }\n .scroll-py-1 {\n scroll-padding-block: calc(var(--spacing) * 1);\n }\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n .flex-col {\n flex-direction: column;\n }\n .flex-col-reverse {\n flex-direction: column-reverse;\n }\n .items-center {\n align-items: center;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .gap-0 {\n gap: calc(var(--spacing) * 0);\n }\n .gap-0\\.5 {\n gap: calc(var(--spacing) * 0.5);\n }\n .gap-1 {\n gap: calc(var(--spacing) * 1);\n }\n .gap-1\\.5 {\n gap: calc(var(--spacing) * 1.5);\n }\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n .gap-3 {\n gap: calc(var(--spacing) * 3);\n }\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n .gap-5 {\n gap: calc(var(--spacing) * 5);\n }\n .gap-6 {\n gap: calc(var(--spacing) * 6);\n }\n .gap-\\[10px\\] {\n gap: 10px;\n }\n .space-y-2 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-5 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .overflow-hidden {\n overflow: hidden;\n }\n .overflow-x-hidden {\n overflow-x: hidden;\n }\n .overflow-y-auto {\n overflow-y: auto;\n }\n .rounded-\\[4px\\] {\n border-radius: 4px;\n }\n .rounded-full {\n border-radius: calc(infinity * 1px);\n }\n .rounded-lg {\n border-radius: var(--radius);\n }\n .rounded-md {\n border-radius: calc(var(--radius) - 2px);\n }\n .rounded-sm {\n border-radius: calc(var(--radius) - 4px);\n }\n .rounded-xs {\n border-radius: var(--radius-xs);\n }\n .border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n .border-b {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 1px;\n }\n .border-border {\n border-color: var(--border);\n }\n .border-input {\n border-color: var(--input);\n }\n .border-primary {\n border-color: var(--primary);\n }\n .bg-accent {\n background-color: var(--accent);\n }\n .bg-background {\n background-color: var(--background);\n }\n .bg-black\\/50 {\n background-color: color-mix(in srgb, #000 50%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-black) 50%, transparent);\n }\n }\n .bg-border {\n background-color: var(--border);\n }\n .bg-destructive {\n background-color: var(--destructive);\n }\n .bg-muted {\n background-color: var(--muted);\n }\n .bg-popover {\n background-color: var(--popover);\n }\n .bg-primary {\n background-color: var(--primary);\n }\n .bg-secondary {\n background-color: var(--secondary);\n }\n .bg-transparent {\n background-color: transparent;\n }\n .fill-current {\n fill: currentcolor;\n }\n .fill-primary {\n fill: var(--primary);\n }\n .object-cover {\n object-fit: cover;\n }\n .p-0 {\n padding: calc(var(--spacing) * 0);\n }\n .p-1 {\n padding: calc(var(--spacing) * 1);\n }\n .p-3 {\n padding: calc(var(--spacing) * 3);\n }\n .p-4 {\n padding: calc(var(--spacing) * 4);\n }\n .p-6 {\n padding: calc(var(--spacing) * 6);\n }\n .px-1 {\n padding-inline: calc(var(--spacing) * 1);\n }\n .px-2 {\n padding-inline: calc(var(--spacing) * 2);\n }\n .px-3 {\n padding-inline: calc(var(--spacing) * 3);\n }\n .px-4 {\n padding-inline: calc(var(--spacing) * 4);\n }\n .px-6 {\n padding-inline: calc(var(--spacing) * 6);\n }\n .py-1 {\n padding-block: calc(var(--spacing) * 1);\n }\n .py-1\\.5 {\n padding-block: calc(var(--spacing) * 1.5);\n }\n .py-2 {\n padding-block: calc(var(--spacing) * 2);\n }\n .py-3 {\n padding-block: calc(var(--spacing) * 3);\n }\n .py-4 {\n padding-block: calc(var(--spacing) * 4);\n }\n .py-6 {\n padding-block: calc(var(--spacing) * 6);\n }\n .pt-2 {\n padding-top: calc(var(--spacing) * 2);\n }\n .pt-4 {\n padding-top: calc(var(--spacing) * 4);\n }\n .pr-2 {\n padding-right: calc(var(--spacing) * 2);\n }\n .pb-1 {\n padding-bottom: calc(var(--spacing) * 1);\n }\n .pb-2 {\n padding-bottom: calc(var(--spacing) * 2);\n }\n .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n .pb-40 {\n padding-bottom: calc(var(--spacing) * 40);\n }\n .pl-8 {\n padding-left: calc(var(--spacing) * 8);\n }\n .text-center {\n text-align: center;\n }\n .text-left {\n text-align: left;\n }\n .text-right {\n text-align: right;\n }\n .text-base {\n font-size: var(--text-base);\n line-height: var(--tw-leading, var(--text-base--line-height));\n }\n .text-lg {\n font-size: var(--text-lg);\n line-height: var(--tw-leading, var(--text-lg--line-height));\n }\n .text-sm {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n }\n .text-\\[13px\\] {\n font-size: 13px;\n }\n .leading-none {\n --tw-leading: 1;\n line-height: 1;\n }\n .font-bold {\n --tw-font-weight: var(--font-weight-bold);\n font-weight: var(--font-weight-bold);\n }\n .font-medium {\n --tw-font-weight: var(--font-weight-medium);\n font-weight: var(--font-weight-medium);\n }\n .font-semibold {\n --tw-font-weight: var(--font-weight-semibold);\n font-weight: var(--font-weight-semibold);\n }\n .tracking-tight {\n --tw-tracking: var(--tracking-tight);\n letter-spacing: var(--tracking-tight);\n }\n .tracking-widest {\n --tw-tracking: var(--tracking-widest);\n letter-spacing: var(--tracking-widest);\n }\n .text-ellipsis {\n text-overflow: ellipsis;\n }\n .whitespace-nowrap {\n white-space: nowrap;\n }\n .text-background {\n color: var(--background);\n }\n .text-current {\n color: currentcolor;\n }\n .text-destructive {\n color: var(--destructive);\n }\n .text-destructive-foreground {\n color: var(--destructive-foreground);\n }\n .text-foreground {\n color: var(--foreground);\n }\n .text-muted-foreground {\n color: var(--muted-foreground);\n }\n .text-popover-foreground {\n color: var(--popover-foreground);\n }\n .text-primary {\n color: var(--primary);\n }\n .text-primary-foreground {\n color: var(--primary-foreground);\n }\n .text-red-500 {\n color: var(--color-red-500);\n }\n .text-ring {\n color: var(--ring);\n }\n .text-secondary-foreground {\n color: var(--secondary-foreground);\n }\n .text-white {\n color: var(--color-white);\n }\n .line-through {\n text-decoration-line: line-through;\n }\n .underline {\n text-decoration-line: underline;\n }\n .underline-offset-4 {\n text-underline-offset: 4px;\n }\n .opacity-0 {\n opacity: 0%;\n }\n .opacity-50 {\n opacity: 50%;\n }\n .opacity-70 {\n opacity: 70%;\n }\n .opacity-100 {\n opacity: 100%;\n }\n .shadow {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .shadow-lg {\n --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .shadow-md {\n --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .shadow-xs {\n --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .ring {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .ring-offset-background {\n --tw-ring-offset-color: var(--background);\n }\n .outline-hidden {\n --tw-outline-style: none;\n outline-style: none;\n @media (forced-colors: active) {\n outline: 2px solid transparent;\n outline-offset: 2px;\n }\n }\n .outline {\n outline-style: var(--tw-outline-style);\n outline-width: 1px;\n }\n .transition {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-\\[color\\,box-shadow\\] {\n transition-property: color,box-shadow;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-colors {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-opacity {\n transition-property: opacity;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-shadow {\n transition-property: box-shadow;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-transform {\n transition-property: transform, translate, scale, rotate;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-none {\n transition-property: none;\n }\n .duration-200 {\n --tw-duration: 200ms;\n transition-duration: 200ms;\n }\n .ease-in-out {\n --tw-ease: var(--ease-in-out);\n transition-timing-function: var(--ease-in-out);\n }\n .outline-none {\n --tw-outline-style: none;\n outline-style: none;\n }\n .select-none {\n -webkit-user-select: none;\n user-select: none;\n }\n .duration-200 {\n animation-duration: 200ms;\n }\n .ease-in-out {\n animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n }\n .group-data-\\[disabled\\=true\\]\\:pointer-events-none {\n &:is(:where(.group)[data-disabled=\"true\"] *) {\n pointer-events: none;\n }\n }\n .group-data-\\[disabled\\=true\\]\\:opacity-50 {\n &:is(:where(.group)[data-disabled=\"true\"] *) {\n opacity: 50%;\n }\n }\n .peer-disabled\\:cursor-not-allowed {\n &:is(:where(.peer):disabled ~ *) {\n cursor: not-allowed;\n }\n }\n .peer-disabled\\:opacity-50 {\n &:is(:where(.peer):disabled ~ *) {\n opacity: 50%;\n }\n }\n .file\\:inline-flex {\n &::file-selector-button {\n display: inline-flex;\n }\n }\n .file\\:h-7 {\n &::file-selector-button {\n height: calc(var(--spacing) * 7);\n }\n }\n .file\\:border-0 {\n &::file-selector-button {\n border-style: var(--tw-border-style);\n border-width: 0px;\n }\n }\n .file\\:bg-transparent {\n &::file-selector-button {\n background-color: transparent;\n }\n }\n .file\\:text-sm {\n &::file-selector-button {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n }\n .file\\:font-medium {\n &::file-selector-button {\n --tw-font-weight: var(--font-weight-medium);\n font-weight: var(--font-weight-medium);\n }\n }\n .file\\:text-foreground {\n &::file-selector-button {\n color: var(--foreground);\n }\n }\n .placeholder\\:text-muted-foreground {\n &::placeholder {\n color: var(--muted-foreground);\n }\n }\n .after\\:absolute {\n &::after {\n content: var(--tw-content);\n position: absolute;\n }\n }\n .after\\:top-1\\/2 {\n &::after {\n content: var(--tw-content);\n top: calc(1/2 * 100%);\n }\n }\n .after\\:right-0 {\n &::after {\n content: var(--tw-content);\n right: calc(var(--spacing) * 0);\n }\n }\n .after\\:left-0 {\n &::after {\n content: var(--tw-content);\n left: calc(var(--spacing) * 0);\n }\n }\n .after\\:z-0 {\n &::after {\n content: var(--tw-content);\n z-index: 0;\n }\n }\n .after\\:h-px {\n &::after {\n content: var(--tw-content);\n height: 1px;\n }\n }\n .after\\:-translate-y-1\\/2 {\n &::after {\n content: var(--tw-content);\n --tw-translate-y: calc(calc(1/2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n }\n .after\\:bg-background {\n &::after {\n content: var(--tw-content);\n background-color: var(--background);\n }\n }\n .after\\:content-\\[\\'\\'\\] {\n &::after {\n content: var(--tw-content);\n --tw-content: '';\n content: var(--tw-content);\n }\n }\n .last\\:border-b-0 {\n &:last-child {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 0px;\n }\n }\n .hover\\:bg-accent {\n &:hover {\n @media (hover: hover) {\n background-color: var(--accent);\n }\n }\n }\n .hover\\:bg-destructive\\/90 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--destructive);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--destructive) 90%, transparent);\n }\n }\n }\n }\n .hover\\:bg-muted {\n &:hover {\n @media (hover: hover) {\n background-color: var(--muted);\n }\n }\n }\n .hover\\:bg-primary\\/90 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--primary);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--primary) 90%, transparent);\n }\n }\n }\n }\n .hover\\:bg-secondary\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--secondary);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--secondary) 80%, transparent);\n }\n }\n }\n }\n .hover\\:text-accent-foreground {\n &:hover {\n @media (hover: hover) {\n color: var(--accent-foreground);\n }\n }\n }\n .hover\\:text-foreground {\n &:hover {\n @media (hover: hover) {\n color: var(--foreground);\n }\n }\n }\n .hover\\:text-muted-foreground {\n &:hover {\n @media (hover: hover) {\n color: var(--muted-foreground);\n }\n }\n }\n .hover\\:underline {\n &:hover {\n @media (hover: hover) {\n text-decoration-line: underline;\n }\n }\n }\n .hover\\:opacity-100 {\n &:hover {\n @media (hover: hover) {\n opacity: 100%;\n }\n }\n }\n .focus\\:bg-accent {\n &:focus {\n background-color: var(--accent);\n }\n }\n .focus\\:text-accent-foreground {\n &:focus {\n color: var(--accent-foreground);\n }\n }\n .focus\\:ring-2 {\n &:focus {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n .focus\\:ring-ring {\n &:focus {\n --tw-ring-color: var(--ring);\n }\n }\n .focus\\:ring-offset-2 {\n &:focus {\n --tw-ring-offset-width: 2px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n }\n }\n .focus\\:outline-hidden {\n &:focus {\n --tw-outline-style: none;\n outline-style: none;\n @media (forced-colors: active) {\n outline: 2px solid transparent;\n outline-offset: 2px;\n }\n }\n }\n .focus-visible\\:border-ring {\n &:focus-visible {\n border-color: var(--ring);\n }\n }\n .focus-visible\\:ring-\\[3px\\] {\n &:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n .focus-visible\\:ring-destructive\\/20 {\n &:focus-visible {\n --tw-ring-color: var(--destructive);\n @supports (color: color-mix(in lab, red, red)) {\n --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);\n }\n }\n }\n .focus-visible\\:ring-ring\\/50 {\n &:focus-visible {\n --tw-ring-color: var(--ring);\n @supports (color: color-mix(in lab, red, red)) {\n --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);\n }\n }\n }\n .disabled\\:pointer-events-none {\n &:disabled {\n pointer-events: none;\n }\n }\n .disabled\\:cursor-not-allowed {\n &:disabled {\n cursor: not-allowed;\n }\n }\n .disabled\\:opacity-50 {\n &:disabled {\n opacity: 50%;\n }\n }\n .has-\\[\\>svg\\]\\:px-2\\.5 {\n &:has(>svg) {\n padding-inline: calc(var(--spacing) * 2.5);\n }\n }\n .has-\\[\\>svg\\]\\:px-3 {\n &:has(>svg) {\n padding-inline: calc(var(--spacing) * 3);\n }\n }\n .has-\\[\\>svg\\]\\:px-4 {\n &:has(>svg) {\n padding-inline: calc(var(--spacing) * 4);\n }\n }\n .aria-invalid\\:border-destructive {\n &[aria-invalid=\"true\"] {\n border-color: var(--destructive);\n }\n }\n .aria-invalid\\:ring-destructive\\/20 {\n &[aria-invalid=\"true\"] {\n --tw-ring-color: var(--destructive);\n @supports (color: color-mix(in lab, red, red)) {\n --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);\n }\n }\n }\n .data-\\[disabled\\]\\:pointer-events-none {\n &[data-disabled] {\n pointer-events: none;\n }\n }\n .data-\\[disabled\\]\\:opacity-50 {\n &[data-disabled] {\n opacity: 50%;\n }\n }\n .data-\\[disabled\\=true\\]\\:pointer-events-none {\n &[data-disabled=\"true\"] {\n pointer-events: none;\n }\n }\n .data-\\[disabled\\=true\\]\\:opacity-50 {\n &[data-disabled=\"true\"] {\n opacity: 50%;\n }\n }\n .data-\\[error\\=true\\]\\:text-destructive-foreground {\n &[data-error=\"true\"] {\n color: var(--destructive-foreground);\n }\n }\n .data-\\[inset\\]\\:pl-8 {\n &[data-inset] {\n padding-left: calc(var(--spacing) * 8);\n }\n }\n .data-\\[selected\\=true\\]\\:bg-accent {\n &[data-selected=\"true\"] {\n background-color: var(--accent);\n }\n }\n .data-\\[selected\\=true\\]\\:text-accent-foreground {\n &[data-selected=\"true\"] {\n color: var(--accent-foreground);\n }\n }\n .data-\\[side\\=bottom\\]\\:slide-in-from-top-2 {\n &[data-side=\"bottom\"] {\n --tw-enter-translate-y: -0.5rem;\n }\n }\n .data-\\[side\\=left\\]\\:slide-in-from-right-2 {\n &[data-side=\"left\"] {\n --tw-enter-translate-x: 0.5rem;\n }\n }\n .data-\\[side\\=right\\]\\:slide-in-from-left-2 {\n &[data-side=\"right\"] {\n --tw-enter-translate-x: -0.5rem;\n }\n }\n .data-\\[side\\=top\\]\\:slide-in-from-bottom-2 {\n &[data-side=\"top\"] {\n --tw-enter-translate-y: 0.5rem;\n }\n }\n .\\*\\*\\:data-\\[slot\\=command-input-wrapper\\]\\:h-12 {\n :is(& *) {\n &[data-slot=\"command-input-wrapper\"] {\n height: calc(var(--spacing) * 12);\n }\n }\n }\n .data-\\[state\\=checked\\]\\:border-primary {\n &[data-state=\"checked\"] {\n border-color: var(--primary);\n }\n }\n .data-\\[state\\=checked\\]\\:bg-primary {\n &[data-state=\"checked\"] {\n background-color: var(--primary);\n }\n }\n .data-\\[state\\=checked\\]\\:text-primary-foreground {\n &[data-state=\"checked\"] {\n color: var(--primary-foreground);\n }\n }\n .data-\\[state\\=closed\\]\\:animate-out {\n &[data-state=\"closed\"] {\n animation-name: exit;\n animation-duration: 150ms;\n --tw-exit-opacity: initial;\n --tw-exit-scale: initial;\n --tw-exit-rotate: initial;\n --tw-exit-translate-x: initial;\n --tw-exit-translate-y: initial;\n }\n }\n .data-\\[state\\=closed\\]\\:fade-out-0 {\n &[data-state=\"closed\"] {\n --tw-exit-opacity: 0;\n }\n }\n .data-\\[state\\=closed\\]\\:zoom-out-95 {\n &[data-state=\"closed\"] {\n --tw-exit-scale: .95;\n }\n }\n .data-\\[state\\=open\\]\\:bg-accent {\n &[data-state=\"open\"] {\n background-color: var(--accent);\n }\n }\n .data-\\[state\\=open\\]\\:text-accent-foreground {\n &[data-state=\"open\"] {\n color: var(--accent-foreground);\n }\n }\n .data-\\[state\\=open\\]\\:text-muted-foreground {\n &[data-state=\"open\"] {\n color: var(--muted-foreground);\n }\n }\n .data-\\[state\\=open\\]\\:animate-in {\n &[data-state=\"open\"] {\n animation-name: enter;\n animation-duration: 150ms;\n --tw-enter-opacity: initial;\n --tw-enter-scale: initial;\n --tw-enter-rotate: initial;\n --tw-enter-translate-x: initial;\n --tw-enter-translate-y: initial;\n }\n }\n .data-\\[state\\=open\\]\\:fade-in-0 {\n &[data-state=\"open\"] {\n --tw-enter-opacity: 0;\n }\n }\n .data-\\[state\\=open\\]\\:zoom-in-95 {\n &[data-state=\"open\"] {\n --tw-enter-scale: .95;\n }\n }\n .data-\\[variant\\=destructive\\]\\:text-destructive {\n &[data-variant=\"destructive\"] {\n color: var(--destructive);\n }\n }\n .data-\\[variant\\=destructive\\]\\:focus\\:bg-destructive\\/10 {\n &[data-variant=\"destructive\"] {\n &:focus {\n background-color: var(--destructive);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--destructive) 10%, transparent);\n }\n }\n }\n }\n .data-\\[variant\\=destructive\\]\\:focus\\:text-destructive {\n &[data-variant=\"destructive\"] {\n &:focus {\n color: var(--destructive);\n }\n }\n }\n .max-md\\:cursor-pointer {\n @media (width < 48rem) {\n cursor: pointer;\n }\n }\n .max-sm\\:hidden {\n @media (width < 40rem) {\n display: none;\n }\n }\n .max-sm\\:h-\\[52px\\] {\n @media (width < 40rem) {\n height: 52px;\n }\n }\n .sm\\:static {\n @media (width >= 40rem) {\n position: static;\n }\n }\n .sm\\:w-fit {\n @media (width >= 40rem) {\n width: fit-content;\n }\n }\n .sm\\:max-w-lg {\n @media (width >= 40rem) {\n max-width: var(--container-lg);\n }\n }\n .sm\\:flex-row {\n @media (width >= 40rem) {\n flex-direction: row;\n }\n }\n .sm\\:justify-end {\n @media (width >= 40rem) {\n justify-content: flex-end;\n }\n }\n .sm\\:bg-transparent {\n @media (width >= 40rem) {\n background-color: transparent;\n }\n }\n .sm\\:px-0 {\n @media (width >= 40rem) {\n padding-inline: calc(var(--spacing) * 0);\n }\n }\n .sm\\:pb-0 {\n @media (width >= 40rem) {\n padding-bottom: calc(var(--spacing) * 0);\n }\n }\n .sm\\:text-left {\n @media (width >= 40rem) {\n text-align: left;\n }\n }\n .md\\:order-last {\n @media (width >= 48rem) {\n order: 9999;\n }\n }\n .md\\:order-none {\n @media (width >= 48rem) {\n order: 0;\n }\n }\n .md\\:col-span-2 {\n @media (width >= 48rem) {\n grid-column: span 2 / span 2;\n }\n }\n .md\\:col-span-3 {\n @media (width >= 48rem) {\n grid-column: span 3 / span 3;\n }\n }\n .md\\:col-span-4 {\n @media (width >= 48rem) {\n grid-column: span 4 / span 4;\n }\n }\n .md\\:block {\n @media (width >= 48rem) {\n display: block;\n }\n }\n .md\\:flex {\n @media (width >= 48rem) {\n display: flex;\n }\n }\n .md\\:grid {\n @media (width >= 48rem) {\n display: grid;\n }\n }\n .md\\:hidden {\n @media (width >= 48rem) {\n display: none;\n }\n }\n .md\\:max-w-\\[75\\%\\] {\n @media (width >= 48rem) {\n max-width: 75%;\n }\n }\n .md\\:grid-cols-2 {\n @media (width >= 48rem) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n }\n .md\\:grid-cols-3 {\n @media (width >= 48rem) {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n }\n .md\\:grid-cols-7 {\n @media (width >= 48rem) {\n grid-template-columns: repeat(7, minmax(0, 1fr));\n }\n }\n .md\\:gap-0 {\n @media (width >= 48rem) {\n gap: calc(var(--spacing) * 0);\n }\n }\n .md\\:px-8 {\n @media (width >= 48rem) {\n padding-inline: calc(var(--spacing) * 8);\n }\n }\n .md\\:py-12 {\n @media (width >= 48rem) {\n padding-block: calc(var(--spacing) * 12);\n }\n }\n .md\\:text-sm {\n @media (width >= 48rem) {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n }\n .dark\\:focus-visible\\:ring-destructive\\/40 {\n @media (prefers-color-scheme: dark) {\n &:focus-visible {\n --tw-ring-color: var(--destructive);\n @supports (color: color-mix(in lab, red, red)) {\n --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);\n }\n }\n }\n }\n .dark\\:aria-invalid\\:ring-destructive\\/40 {\n @media (prefers-color-scheme: dark) {\n &[aria-invalid=\"true\"] {\n --tw-ring-color: var(--destructive);\n @supports (color: color-mix(in lab, red, red)) {\n --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);\n }\n }\n }\n }\n .dark\\:data-\\[variant\\=destructive\\]\\:focus\\:bg-destructive\\/20 {\n @media (prefers-color-scheme: dark) {\n &[data-variant=\"destructive\"] {\n &:focus {\n background-color: var(--destructive);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--destructive) 20%, transparent);\n }\n }\n }\n }\n }\n .\\[\\&_\\[cmdk-group-heading\\]\\]\\:px-2 {\n & [cmdk-group-heading] {\n padding-inline: calc(var(--spacing) * 2);\n }\n }\n .\\[\\&_\\[cmdk-group-heading\\]\\]\\:py-1\\.5 {\n & [cmdk-group-heading] {\n padding-block: calc(var(--spacing) * 1.5);\n }\n }\n .\\[\\&_\\[cmdk-group-heading\\]\\]\\:text-xs {\n & [cmdk-group-heading] {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n }\n }\n .\\[\\&_\\[cmdk-group-heading\\]\\]\\:font-medium {\n & [cmdk-group-heading] {\n --tw-font-weight: var(--font-weight-medium);\n font-weight: var(--font-weight-medium);\n }\n }\n .\\[\\&_\\[cmdk-group-heading\\]\\]\\:text-muted-foreground {\n & [cmdk-group-heading] {\n color: var(--muted-foreground);\n }\n }\n .\\[\\&_\\[cmdk-group\\]\\]\\:px-2 {\n & [cmdk-group] {\n padding-inline: calc(var(--spacing) * 2);\n }\n }\n .\\[\\&_\\[cmdk-group\\]\\:not\\(\\[hidden\\]\\)_\\~\\[cmdk-group\\]\\]\\:pt-0 {\n & [cmdk-group]:not([hidden]) ~[cmdk-group] {\n padding-top: calc(var(--spacing) * 0);\n }\n }\n .\\[\\&_\\[cmdk-input-wrapper\\]_svg\\]\\:h-5 {\n & [cmdk-input-wrapper] svg {\n height: calc(var(--spacing) * 5);\n }\n }\n .\\[\\&_\\[cmdk-input-wrapper\\]_svg\\]\\:w-5 {\n & [cmdk-input-wrapper] svg {\n width: calc(var(--spacing) * 5);\n }\n }\n .\\[\\&_\\[cmdk-input\\]\\]\\:h-12 {\n & [cmdk-input] {\n height: calc(var(--spacing) * 12);\n }\n }\n .\\[\\&_\\[cmdk-item\\]\\]\\:px-2 {\n & [cmdk-item] {\n padding-inline: calc(var(--spacing) * 2);\n }\n }\n .\\[\\&_\\[cmdk-item\\]\\]\\:py-3 {\n & [cmdk-item] {\n padding-block: calc(var(--spacing) * 3);\n }\n }\n .\\[\\&_\\[cmdk-item\\]_svg\\]\\:h-5 {\n & [cmdk-item] svg {\n height: calc(var(--spacing) * 5);\n }\n }\n .\\[\\&_\\[cmdk-item\\]_svg\\]\\:w-5 {\n & [cmdk-item] svg {\n width: calc(var(--spacing) * 5);\n }\n }\n .\\[\\&_svg\\]\\:pointer-events-none {\n & svg {\n pointer-events: none;\n }\n }\n .\\[\\&_svg\\]\\:shrink-0 {\n & svg {\n flex-shrink: 0;\n }\n }\n .\\[\\&_svg\\:not\\(\\[class\\*\\=\\'size-\\'\\]\\)\\]\\:size-4 {\n & svg:not([class*='size-']) {\n width: calc(var(--spacing) * 4);\n height: calc(var(--spacing) * 4);\n }\n }\n .\\[\\&_svg\\:not\\(\\[class\\*\\=\\'text-\\'\\]\\)\\]\\:text-muted-foreground {\n & svg:not([class*='text-']) {\n color: var(--muted-foreground);\n }\n }\n .data-\\[variant\\=destructive\\]\\:\\*\\:\\[svg\\]\\:\\!text-destructive {\n &[data-variant=\"destructive\"] {\n :is(& > *) {\n &:is(svg) {\n color: var(--destructive) !important;\n }\n }\n }\n }\n}\n@layer base {\n ::selection {\n background-color: var(--primary);\n color: var(--primary-foreground);\n }\n input:-webkit-autofill,\n input:-webkit-autofill:hover,\n input:-webkit-autofill:focus,\n input:-webkit-autofill:active {\n -webkit-box-shadow: 0 0 0 30px var(--muted) inset !important;\n -webkit-text-fill-color: var(--foreground) !important;\n }\n input:-moz-autofill,\n input:autofill {\n background-color: var(--muted);\n color: var(--foreground);\n }\n * {\n --tw-border-style: solid;\n border-style: solid;\n border-color: var(--border);\n outline-color: var(--ring);\n @supports (color: color-mix(in lab, red, red)) {\n outline-color: color-mix(in oklab, var(--ring) 50%, transparent);\n }\n }\n .checkout-embed {\n background-color: var(--background);\n font-family: var(--font-sans), Helvetica, Arial, apple-system, sans-serif;\n color: var(--foreground);\n }\n h2 {\n font-size: var(--text-2xl);\n line-height: var(--tw-leading, var(--text-2xl--line-height));\n --tw-font-weight: var(--font-weight-bold);\n font-weight: var(--font-weight-bold);\n --tw-tracking: var(--tracking-tight);\n letter-spacing: var(--tracking-tight);\n }\n p {\n --tw-tracking: var(--tracking-tight);\n letter-spacing: var(--tracking-tight);\n }\n}\n@layer utilities {\n .scrollbar-hidden {\n scrollbar-width: none;\n }\n .scrollbar-hidden::-webkit-scrollbar {\n display: none;\n }\n}\n@keyframes enter {\n from {\n opacity: var(--tw-enter-opacity, 1);\n transform: translate3d(var(--tw-enter-translate-x, 0), var(--tw-enter-translate-y, 0), 0) scale3d(var(--tw-enter-scale, 1), var(--tw-enter-scale, 1), var(--tw-enter-scale, 1)) rotate(var(--tw-enter-rotate, 0));\n }\n}\n@keyframes exit {\n to {\n opacity: var(--tw-exit-opacity, 1);\n transform: translate3d(var(--tw-exit-translate-x, 0), var(--tw-exit-translate-y, 0), 0) scale3d(var(--tw-exit-scale, 1), var(--tw-exit-scale, 1), var(--tw-exit-scale, 1)) rotate(var(--tw-exit-rotate, 0));\n }\n}\n@property --tw-translate-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-space-y-reverse {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-border-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\n}\n@property --tw-leading {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-font-weight {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-tracking {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-shadow-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-inset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-shadow-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-inset-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-ring-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-ring-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-inset-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-ring-inset {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ring-offset-width {\n syntax: \"<length>\";\n inherits: false;\n initial-value: 0px;\n}\n@property --tw-ring-offset-color {\n syntax: \"*\";\n inherits: false;\n initial-value: #fff;\n}\n@property --tw-ring-offset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-outline-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\n}\n@property --tw-duration {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ease {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-content {\n syntax: \"*\";\n initial-value: \"\";\n inherits: false;\n}\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n@keyframes pulse {\n 50% {\n opacity: 0.5;\n }\n}\n@layer properties {\n @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {\n *, ::before, ::after, ::backdrop {\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-translate-z: 0;\n --tw-space-y-reverse: 0;\n --tw-border-style: solid;\n --tw-leading: initial;\n --tw-font-weight: initial;\n --tw-tracking: initial;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-color: initial;\n --tw-shadow-alpha: 100%;\n --tw-inset-shadow: 0 0 #0000;\n --tw-inset-shadow-color: initial;\n --tw-inset-shadow-alpha: 100%;\n --tw-ring-color: initial;\n --tw-ring-shadow: 0 0 #0000;\n --tw-inset-ring-color: initial;\n --tw-inset-ring-shadow: 0 0 #0000;\n --tw-ring-inset: initial;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-outline-style: solid;\n --tw-duration: initial;\n --tw-ease: initial;\n --tw-content: \"\";\n }\n }\n}\n";
7538
7538
 
7539
7539
  var M$1=(e,i,s,u,m,a,l,h)=>{let d=document.documentElement,w=["light","dark"];function p(n){(Array.isArray(e)?e:[e]).forEach(y=>{let k=y==="class",S=k&&a?m.map(f=>a[f]||f):m;k?(d.classList.remove(...S),d.classList.add(a&&a[n]?a[n]:n)):d.setAttribute(y,n);}),R(n);}function R(n){h&&w.includes(n)&&(d.style.colorScheme=n);}function c(){return window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}if(u)p(u);else try{let n=localStorage.getItem(i)||s,y=l&&n==="system"?c():n;p(y);}catch(n){}};var x=React.createContext(void 0),U$1={setTheme:e=>{},themes:[]},z=()=>{var e;return (e=React.useContext(x))!=null?e:U$1};React.memo(({forcedTheme:e,storageKey:i,attribute:s,enableSystem:u,enableColorScheme:m,defaultTheme:a,value:l,themes:h,nonce:d,scriptProps:w})=>{let p=JSON.stringify([s,i,a,e,h,l,u,m]).slice(1,-1);return React.createElement("script",{...w,suppressHydrationWarning:true,nonce:typeof window=="undefined"?d:"",dangerouslySetInnerHTML:{__html:`(${M$1.toString()})(${p})`}})});
7540
7540
 
@@ -13404,8 +13404,6 @@ const convertCheckoutAppearanceToStripeAppearance = (appearance, fonts) => {
13404
13404
  return newAppearance;
13405
13405
  };
13406
13406
 
13407
- const storeHelpers = createStoreHelpers();
13408
-
13409
13407
  var util;
13410
13408
  (function (util) {
13411
13409
  util.assertEqual = (_) => { };
@@ -16418,6 +16416,60 @@ ZodTuple.create = (schemas, params) => {
16418
16416
  ...processCreateParams(params),
16419
16417
  });
16420
16418
  };
16419
+ class ZodRecord extends ZodType {
16420
+ get keySchema() {
16421
+ return this._def.keyType;
16422
+ }
16423
+ get valueSchema() {
16424
+ return this._def.valueType;
16425
+ }
16426
+ _parse(input) {
16427
+ const { status, ctx } = this._processInputParams(input);
16428
+ if (ctx.parsedType !== ZodParsedType.object) {
16429
+ addIssueToContext(ctx, {
16430
+ code: ZodIssueCode.invalid_type,
16431
+ expected: ZodParsedType.object,
16432
+ received: ctx.parsedType,
16433
+ });
16434
+ return INVALID;
16435
+ }
16436
+ const pairs = [];
16437
+ const keyType = this._def.keyType;
16438
+ const valueType = this._def.valueType;
16439
+ for (const key in ctx.data) {
16440
+ pairs.push({
16441
+ key: keyType._parse(new ParseInputLazyPath(ctx, key, ctx.path, key)),
16442
+ value: valueType._parse(new ParseInputLazyPath(ctx, ctx.data[key], ctx.path, key)),
16443
+ alwaysSet: key in ctx.data,
16444
+ });
16445
+ }
16446
+ if (ctx.common.async) {
16447
+ return ParseStatus.mergeObjectAsync(status, pairs);
16448
+ }
16449
+ else {
16450
+ return ParseStatus.mergeObjectSync(status, pairs);
16451
+ }
16452
+ }
16453
+ get element() {
16454
+ return this._def.valueType;
16455
+ }
16456
+ static create(first, second, third) {
16457
+ if (second instanceof ZodType) {
16458
+ return new ZodRecord({
16459
+ keyType: first,
16460
+ valueType: second,
16461
+ typeName: ZodFirstPartyTypeKind.ZodRecord,
16462
+ ...processCreateParams(third),
16463
+ });
16464
+ }
16465
+ return new ZodRecord({
16466
+ keyType: ZodString.create(),
16467
+ valueType: first,
16468
+ typeName: ZodFirstPartyTypeKind.ZodRecord,
16469
+ ...processCreateParams(second),
16470
+ });
16471
+ }
16472
+ }
16421
16473
  class ZodMap extends ZodType {
16422
16474
  get keySchema() {
16423
16475
  return this._def.keyType;
@@ -17183,6 +17235,7 @@ const objectType = ZodObject.create;
17183
17235
  ZodUnion.create;
17184
17236
  ZodIntersection.create;
17185
17237
  ZodTuple.create;
17238
+ const recordType = ZodRecord.create;
17186
17239
  ZodEnum.create;
17187
17240
  ZodPromise.create;
17188
17241
  ZodOptional.create;
@@ -17211,15 +17264,20 @@ const customerSchema = objectType({
17211
17264
  const shippingMethodSchema = objectType({
17212
17265
  rateId: stringType().min(1, "required_error"),
17213
17266
  provider: stringType().min(1, "required_error"),
17214
- price: numberType().min(1, "required_error"),
17267
+ priceInCents: numberType().min(1, "required_error"),
17215
17268
  name: stringType().min(1, "required_error"),
17216
17269
  pickupPointId: stringType().optional(),
17217
17270
  pickupPointDisplayName: stringType().optional(),
17218
17271
  });
17272
+ const shipmentsFormSchema = recordType(stringType(), shippingMethodSchema)
17273
+ .refine((data) => Object.keys(data).length > 0, {
17274
+ message: "at_least_one_shipping_method_required",
17275
+ path: [],
17276
+ });
17219
17277
  // Combined checkout schema
17220
17278
  objectType({
17221
17279
  customer: customerSchema,
17222
- shipping: shippingMethodSchema,
17280
+ shipping: shipmentsFormSchema,
17223
17281
  customerId: stringType().optional(),
17224
17282
  });
17225
17283
 
@@ -26236,14 +26294,9 @@ function getWindowScrollBarX(element, rect) {
26236
26294
  return rect.left + leftScroll;
26237
26295
  }
26238
26296
 
26239
- function getHTMLOffset(documentElement, scroll, ignoreScrollbarX) {
26240
- if (ignoreScrollbarX === void 0) {
26241
- ignoreScrollbarX = false;
26242
- }
26297
+ function getHTMLOffset(documentElement, scroll) {
26243
26298
  const htmlRect = documentElement.getBoundingClientRect();
26244
- const x = htmlRect.left + scroll.scrollLeft - (ignoreScrollbarX ? 0 :
26245
- // RTL <body> scrollbar.
26246
- getWindowScrollBarX(documentElement, htmlRect));
26299
+ const x = htmlRect.left + scroll.scrollLeft - getWindowScrollBarX(documentElement, htmlRect);
26247
26300
  const y = htmlRect.top + scroll.scrollTop;
26248
26301
  return {
26249
26302
  x,
@@ -26282,7 +26335,7 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
26282
26335
  offsets.y = offsetRect.y + offsetParent.clientTop;
26283
26336
  }
26284
26337
  }
26285
- const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll, true) : createCoords(0);
26338
+ const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
26286
26339
  return {
26287
26340
  width: rect.width * scale.x,
26288
26341
  height: rect.height * scale.y,
@@ -26316,6 +26369,10 @@ function getDocumentRect(element) {
26316
26369
  };
26317
26370
  }
26318
26371
 
26372
+ // Safety check: ensure the scrollbar space is reasonable in case this
26373
+ // calculation is affected by unusual styles.
26374
+ // Most scrollbars leave 15-18px of space.
26375
+ const SCROLLBAR_MAX = 25;
26319
26376
  function getViewportRect(element, strategy) {
26320
26377
  const win = getWindow(element);
26321
26378
  const html = getDocumentElement(element);
@@ -26333,6 +26390,24 @@ function getViewportRect(element, strategy) {
26333
26390
  y = visualViewport.offsetTop;
26334
26391
  }
26335
26392
  }
26393
+ const windowScrollbarX = getWindowScrollBarX(html);
26394
+ // <html> `overflow: hidden` + `scrollbar-gutter: stable` reduces the
26395
+ // visual width of the <html> but this is not considered in the size
26396
+ // of `html.clientWidth`.
26397
+ if (windowScrollbarX <= 0) {
26398
+ const doc = html.ownerDocument;
26399
+ const body = doc.body;
26400
+ const bodyStyles = getComputedStyle(body);
26401
+ const bodyMarginInline = doc.compatMode === 'CSS1Compat' ? parseFloat(bodyStyles.marginLeft) + parseFloat(bodyStyles.marginRight) || 0 : 0;
26402
+ const clippingStableScrollbarWidth = Math.abs(html.clientWidth - body.clientWidth - bodyMarginInline);
26403
+ if (clippingStableScrollbarWidth <= SCROLLBAR_MAX) {
26404
+ width -= clippingStableScrollbarWidth;
26405
+ }
26406
+ } else if (windowScrollbarX <= SCROLLBAR_MAX) {
26407
+ // If the <body> scrollbar is on the left, the width needs to be extended
26408
+ // by the scrollbar amount so there isn't extra space on the right.
26409
+ width += windowScrollbarX;
26410
+ }
26336
26411
  return {
26337
26412
  width,
26338
26413
  height,
@@ -41304,10 +41379,10 @@ function PaymentElement({ paymentSecret, publicKey, checkoutAppearance, locale,
41304
41379
  }
41305
41380
  var PaymentElement$1 = memo(PaymentElement);
41306
41381
 
41307
- function PaymentForm({ paymentSecret, onSuccess, onError, onBack, onDoubleBack, contactEmail, shippingAddress, shippingName, shippingPrice, checkoutAppearance, fonts, locale, publicKey, paymentComponentKey, }) {
41382
+ function PaymentForm({ paymentSecret, onSuccess, onError, onBack, onDoubleBack, contactEmail, shippingFormData, address, checkoutAppearance, fonts, locale, publicKey, paymentComponentKey, }) {
41308
41383
  const [isSubmitting, setIsSubmitting] = useState(false);
41309
41384
  const { t } = useTranslation();
41310
- return (jsxs("div", { className: "space-y-6", children: [jsxs("div", { children: [jsx("h2", { className: "mb-2", children: t("CheckoutEmbed.Payment.title") }), jsx("p", { className: "text-muted-foreground text-sm", children: t("CheckoutEmbed.Payment.description") })] }), jsxs("div", { className: "space-y-2", children: [jsxs("div", { className: "flex items-center justify-between text-sm", children: [jsxs("p", { children: [jsx("span", { className: "font-medium", children: t("CheckoutEmbed.Shipping.contact") }), " ", jsx("span", { className: "text-muted-foreground", children: contactEmail })] }), jsx(Button, { variant: "link", size: "link", onClick: onDoubleBack, children: t("CheckoutEmbed.Shipping.change") })] }), jsxs("div", { className: "flex items-center justify-between text-sm", children: [jsxs("p", { children: [jsx("span", { className: "font-medium", children: t("CheckoutEmbed.Shipping.address") }), " ", jsx("span", { className: "text-muted-foreground", children: shippingAddress })] }), jsx(Button, { variant: "link", size: "link", onClick: onDoubleBack, children: t("CheckoutEmbed.Shipping.change") })] }), jsxs("div", { className: "flex items-center justify-between text-sm", children: [jsxs("p", { children: [jsx("span", { className: "font-medium", children: t("CheckoutEmbed.Shipping.shipping") }), " ", jsxs("span", { className: "text-muted-foreground", children: [shippingName, " \u00B7 ", shippingPrice] })] }), jsx(Button, { variant: "link", size: "link", onClick: onBack, children: t("CheckoutEmbed.Shipping.change") })] })] }), jsx("div", { className: "mt-8", children: paymentSecret && (jsx(PaymentElement$1, { fonts: fonts, checkoutAppearance: convertCheckoutAppearanceToStripeAppearance(checkoutAppearance, fonts), locale: locale, paymentSecret: paymentSecret, onSuccess: onSuccess, onError: onError, setSubmitting: setIsSubmitting, publicKey: publicKey, children: jsx("div", { className: "fixed bottom-0 left-0 right-0 z-50 mt-8 px-4 sm:static sm:px-0", children: jsxs("div", { className: "bg-background flex flex-col-reverse items-center justify-between gap-2 pb-4 sm:flex-row sm:bg-transparent sm:pb-0", children: [jsxs(Button, { className: "w-full sm:w-fit", type: "button", variant: "ghost", onClick: onBack, children: [jsx(ChevronLeft, {}), t("CheckoutEmbed.Payment.back")] }), jsx(SubmitButton, { className: "w-full max-sm:h-[52px] sm:w-fit", isValid: true, isSubmitting: isSubmitting, children: t("CheckoutEmbed.Payment.button") })] }) }) }, paymentComponentKey)) })] }));
41385
+ return (jsxs("div", { className: "space-y-6", children: [jsxs("div", { children: [jsx("h2", { className: "mb-2", children: t("CheckoutEmbed.Payment.title") }), jsx("p", { className: "text-muted-foreground text-sm", children: t("CheckoutEmbed.Payment.description") })] }), jsxs("div", { className: "space-y-2", children: [jsxs("div", { className: "flex items-center justify-between text-sm", children: [jsxs("p", { children: [jsx("span", { className: "font-medium", children: t("CheckoutEmbed.Shipping.contact") }), " ", jsx("span", { className: "text-muted-foreground", children: contactEmail })] }), jsx(Button, { variant: "link", size: "link", onClick: onDoubleBack, children: t("CheckoutEmbed.Shipping.change") })] }), jsxs("div", { className: "flex items-center justify-between text-sm", children: [jsxs("p", { children: [jsx("span", { className: "font-medium", children: t("CheckoutEmbed.Shipping.address") }), " ", jsx("span", { className: "text-muted-foreground", children: address })] }), jsx(Button, { variant: "link", size: "link", onClick: onDoubleBack, children: t("CheckoutEmbed.Shipping.change") })] }), jsxs("div", { className: "flex items-center justify-between text-sm", children: [jsxs("div", { className: "flex gap-1", children: [jsx("p", { className: "font-medium", children: t("CheckoutEmbed.Shipping.shipping") }), " ", jsx("div", { className: "text-muted-foreground flex flex-col gap-1", children: Object.entries(shippingFormData).map(([id, shipmentFormData]) => (jsxs("p", { children: [shipmentFormData.name, " \u00B7 ", shipmentFormData.priceInCents] }, id))) })] }), jsx(Button, { variant: "link", size: "link", onClick: onBack, children: t("CheckoutEmbed.Shipping.change") })] })] }), jsx("div", { className: "mt-8", children: paymentSecret && (jsx(PaymentElement$1, { fonts: fonts, checkoutAppearance: convertCheckoutAppearanceToStripeAppearance(checkoutAppearance, fonts), locale: locale, paymentSecret: paymentSecret, onSuccess: onSuccess, onError: onError, setSubmitting: setIsSubmitting, publicKey: publicKey, children: jsx("div", { className: "fixed bottom-0 left-0 right-0 z-50 mt-8 px-4 sm:static sm:px-0", children: jsxs("div", { className: "bg-background flex flex-col-reverse items-center justify-between gap-2 pb-4 sm:flex-row sm:bg-transparent sm:pb-0", children: [jsxs(Button, { className: "w-full sm:w-fit", type: "button", variant: "ghost", onClick: onBack, children: [jsx(ChevronLeft, {}), t("CheckoutEmbed.Payment.back")] }), jsx(SubmitButton, { className: "w-full max-sm:h-[52px] sm:w-fit", isValid: true, isSubmitting: isSubmitting, children: t("CheckoutEmbed.Payment.button") })] }) }) }, paymentComponentKey)) })] }));
41311
41386
  }
41312
41387
 
41313
41388
  function Skeleton(_a) {
@@ -41315,6 +41390,8 @@ function Skeleton(_a) {
41315
41390
  return (jsx("div", Object.assign({ "data-slot": "skeleton", className: cn("bg-accent animate-pulse rounded-md", className) }, props)));
41316
41391
  }
41317
41392
 
41393
+ const storeHelpers = createStoreHelpers();
41394
+
41318
41395
  function ZasilkovnaShippingOption({ children, onPickupPointSelected, locale, countryCode, apiKey, }) {
41319
41396
  const [widgetLoaded, setWidgetLoaded] = useState(false);
41320
41397
  useEffect(() => {
@@ -41361,50 +41438,62 @@ function ShippingOptionWrapper({ rate, children, onPickupPointSelected, locale,
41361
41438
  return jsx(Fragment, { children: children });
41362
41439
  }
41363
41440
 
41364
- function ShippingMethodForm({ shippingRates, initialData, onSubmit, onBack, contactEmail, shippingAddress, currency, exchangeRate, locale, countryCode, setFormData, formData, }) {
41441
+ function ShipmentsForm({ shippingRates, initialData, onSubmit, onBack, contactEmail, shippingAddress, currency, exchangeRate, locale, countryCode, setFormData, formData, shipments, }) {
41365
41442
  var _a;
41366
41443
  const { t } = useTranslation();
41367
41444
  const form = useForm({
41368
- resolver: s(shippingMethodSchema),
41369
- defaultValues: initialData || {
41370
- rateId: "",
41371
- provider: "",
41372
- price: 0,
41373
- pickupPointId: "",
41374
- pickupPointDisplayName: "",
41375
- },
41445
+ resolver: s(shipmentsFormSchema),
41446
+ defaultValues: initialData ||
41447
+ Object.fromEntries(shipments.map((shipment) => [
41448
+ shipment.id,
41449
+ {
41450
+ rateId: "",
41451
+ provider: "",
41452
+ priceInCents: 0,
41453
+ pickupPointId: "",
41454
+ pickupPointDisplayName: "",
41455
+ },
41456
+ ])),
41376
41457
  });
41377
- const currentRateId = form.watch("rateId");
41378
- return (jsxs("div", { className: "space-y-6", children: [jsx("h2", { children: t("CheckoutEmbed.Shipping.title") }), jsxs("div", { className: "space-y-2 pb-2", children: [jsxs("div", { className: "flex items-center justify-between text-sm", children: [jsxs("p", { children: [jsx("span", { className: "font-medium", children: t("CheckoutEmbed.Shipping.contact") }), " ", jsx("span", { className: "text-muted-foreground", children: contactEmail })] }), jsx(Button, { variant: "link", size: "link", onClick: onBack, children: t("CheckoutEmbed.Shipping.change") })] }), jsxs("div", { className: "flex items-center justify-between text-sm", children: [jsxs("p", { children: [jsx("span", { className: "font-medium", children: t("CheckoutEmbed.Shipping.address") }), " ", jsx("span", { className: "text-muted-foreground", children: shippingAddress })] }), jsx(Button, { variant: "link", size: "link", onClick: onBack, children: t("CheckoutEmbed.Shipping.change") })] })] }), jsx(Form, Object.assign({}, form, { children: jsxs("form", { onSubmit: form.handleSubmit((data) => onSubmit(data, "123")), className: "space-y-4", children: [shippingRates.length === 0 &&
41379
- Array.from({ length: 3 }).map((_, index) => (jsx(ShippingRateLoading, {}, index))), shippingRates.map((rate) => {
41380
- const pickupPointDisplayName = form.watch("pickupPointDisplayName");
41381
- const rateId = rate.provider + rate.name;
41382
- const intPrice = Math.ceil(Number(rate.price));
41383
- const displayPrice = storeHelpers.formatPrice(intPrice, currency, exchangeRate);
41384
- const description = rate.provider === "zasilkovna"
41385
- ? t("CheckoutEmbed.Shipping.description.zasilkovna")
41386
- : t("CheckoutEmbed.Shipping.description.other");
41387
- return (jsx(ShippingOptionWrapper, { rate: rate, onPickupPointSelected: (pickupPointId, pickupPointName) => {
41388
- const newFormData = {
41389
- rateId,
41390
- provider: rate.provider,
41391
- price: intPrice,
41392
- name: rate.name,
41393
- pickupPointId: rate.provider === "zasilkovna" ? pickupPointId : "",
41394
- pickupPointDisplayName: rate.provider === "zasilkovna" ? pickupPointName : "",
41395
- };
41396
- form.setValue("rateId", newFormData.rateId);
41397
- form.setValue("provider", newFormData.provider);
41398
- form.setValue("name", newFormData.name);
41399
- form.setValue("price", newFormData.price);
41400
- form.setValue("pickupPointId", newFormData.pickupPointId);
41401
- form.setValue("pickupPointDisplayName", newFormData.pickupPointDisplayName);
41402
- setFormData(Object.assign(Object.assign({}, formData), { shipping: Object.assign({}, newFormData) }));
41403
- }, locale: locale, countryCode: countryCode, children: jsxs("div", { className: clsx("bg-background cursor-pointer rounded-md border p-4", {
41404
- "bg-muted border-primary": currentRateId === rateId,
41405
- }), children: [jsxs("div", { className: "flex w-full items-center justify-between", children: [jsx("p", { children: rate.name }), jsx("p", { children: displayPrice })] }), jsx("p", { className: "text-muted-foreground text-sm", children: description }), pickupPointDisplayName && (jsxs(Fragment, { children: [jsx("hr", { className: "my-2" }), jsxs("p", { className: "text-muted-foreground text-sm", children: [t("CheckoutEmbed.Shipping.description.shippedTo"), " ", jsx("span", { className: "text-foreground", children: pickupPointDisplayName })] })] }))] }) }, rateId));
41406
- }), jsx(FormMessage, { children: (_a = form.formState.errors.rateId) === null || _a === void 0 ? void 0 : _a.message }), jsxs("div", { className: "flex items-center justify-between pt-4", children: [jsxs(Button, { type: "button", variant: "ghost", onClick: onBack, children: [jsx(ChevronLeft, {}), t("CheckoutEmbed.Shipping.back")] }), jsx(SubmitButton, { isSubmitting: form.formState.isSubmitting, isValid: !!currentRateId, children: t("CheckoutEmbed.Shipping.button") })] })] }) }))] }));
41458
+ const isButtonEnabled = Object.values(form.getValues()).every((value) => { var _a; return ((_a = value.rateId) === null || _a === void 0 ? void 0 : _a.length) > 0; });
41459
+ return (jsxs("div", { className: "space-y-6", children: [jsx("h2", { children: t("CheckoutEmbed.Shipping.title") }), jsxs("div", { className: "space-y-2 pb-2", children: [jsxs("div", { className: "flex items-center justify-between text-sm", children: [jsxs("p", { children: [jsx("span", { className: "font-medium", children: t("CheckoutEmbed.Shipping.contact") }), " ", jsx("span", { className: "text-muted-foreground", children: contactEmail })] }), jsx(Button, { variant: "link", size: "link", onClick: onBack, children: t("CheckoutEmbed.Shipping.change") })] }), jsxs("div", { className: "flex items-center justify-between text-sm", children: [jsxs("p", { children: [jsx("span", { className: "font-medium", children: t("CheckoutEmbed.Shipping.address") }), " ", jsx("span", { className: "text-muted-foreground", children: shippingAddress })] }), jsx(Button, { variant: "link", size: "link", onClick: onBack, children: t("CheckoutEmbed.Shipping.change") })] })] }), jsx(Form, Object.assign({}, form, { children: jsxs("form", { onSubmit: form.handleSubmit(onSubmit), className: "space-y-4", children: [shipments.map((shipment) => (jsx(SingleShipmentSection, { shipment: shipment, shippingRates: shippingRates, form: form, setFormData: setFormData, formData: formData, currency: currency, exchangeRate: exchangeRate, locale: locale, countryCode: countryCode, multipleShipments: shipments.length > 1 }, shipment.id))), jsx(FormMessage, { children: (_a = form.formState.errors.root) === null || _a === void 0 ? void 0 : _a.message }), jsxs("div", { className: "flex items-center justify-between pt-4", children: [jsxs(Button, { type: "button", variant: "ghost", onClick: onBack, children: [jsx(ChevronLeft, {}), t("CheckoutEmbed.Shipping.back")] }), jsx(SubmitButton, { isSubmitting: form.formState.isSubmitting, isValid: isButtonEnabled, children: t("CheckoutEmbed.Shipping.button") })] })] }) }))] }));
41407
41460
  }
41461
+ const SingleShipmentSection = ({ shippingRates, form, currency, exchangeRate, locale, countryCode, setFormData, formData, multipleShipments, shipment, }) => {
41462
+ var _a;
41463
+ const { t } = useTranslation();
41464
+ const shipmentId = shipment.id;
41465
+ const currentRateId = form.watch(`${shipmentId}.rateId`);
41466
+ // TODO: construct the headline
41467
+ return (jsxs("div", { children: [multipleShipments && (jsx("h3", { className: "text-lg font-medium", children: (_a = shipment.shipmentData) === null || _a === void 0 ? void 0 : _a.name })), shippingRates.length === 0 &&
41468
+ Array.from({ length: 3 }).map((_, index) => (jsx(ShippingRateLoading, {}, index))), shippingRates.map((rate) => {
41469
+ const pickupPointDisplayName = form.watch(`${shipmentId}.pickupPointDisplayName`);
41470
+ const rateId = rate.provider + rate.name;
41471
+ const intPrice = Math.ceil(Number(rate.priceInCents));
41472
+ const displayPrice = storeHelpers.formatPrice(intPrice, currency, exchangeRate);
41473
+ const description = rate.provider === "zasilkovna"
41474
+ ? t("CheckoutEmbed.Shipping.description.zasilkovna")
41475
+ : t("CheckoutEmbed.Shipping.description.other");
41476
+ return (jsx(ShippingOptionWrapper, { rate: rate, onPickupPointSelected: (pickupPointId, pickupPointName) => {
41477
+ const newData = {
41478
+ rateId,
41479
+ provider: rate.provider,
41480
+ priceInCents: intPrice,
41481
+ name: rate.name,
41482
+ pickupPointId: rate.provider === "zasilkovna" ? pickupPointId : "",
41483
+ pickupPointDisplayName: rate.provider === "zasilkovna" ? pickupPointName : "",
41484
+ };
41485
+ form.setValue(`${shipmentId}.rateId`, newData.rateId);
41486
+ form.setValue(`${shipmentId}.provider`, newData.provider);
41487
+ form.setValue(`${shipmentId}.name`, newData.name);
41488
+ form.setValue(`${shipmentId}.priceInCents`, newData.priceInCents);
41489
+ form.setValue(`${shipmentId}.pickupPointId`, newData.pickupPointId);
41490
+ form.setValue(`${shipmentId}.pickupPointDisplayName`, newData.pickupPointDisplayName);
41491
+ setFormData(Object.assign(Object.assign({}, formData), { shipping: Object.assign(Object.assign({}, formData.shipping), { [shipmentId]: newData }) }));
41492
+ }, locale: locale, countryCode: countryCode, children: jsxs("div", { className: clsx("bg-background cursor-pointer rounded-md border p-4", {
41493
+ "bg-muted border-primary": currentRateId === rateId,
41494
+ }), children: [jsxs("div", { className: "flex w-full items-center justify-between", children: [jsx("p", { children: rate.name }), jsx("p", { children: displayPrice })] }), jsx("p", { className: "text-muted-foreground text-sm", children: description }), pickupPointDisplayName && (jsxs(Fragment, { children: [jsx("hr", { className: "my-2" }), jsxs("p", { className: "text-muted-foreground text-sm", children: [t("CheckoutEmbed.Shipping.description.shippedTo"), " ", jsx("span", { className: "text-foreground", children: pickupPointDisplayName })] })] }))] }) }, rateId));
41495
+ })] }));
41496
+ };
41408
41497
  function ShippingRateLoading() {
41409
41498
  return (jsxs("div", { className: clsx("bg-background grid cursor-pointer gap-[10px] rounded-md border p-4"), children: [jsxs("div", { className: "flex w-full items-center justify-between", children: [jsx(Skeleton, { className: "h-5 w-12" }), jsx(Skeleton, { className: "h-5 w-16" })] }), jsx(Skeleton, { className: "h-3.5 w-40" })] }));
41410
41499
  }
@@ -41422,14 +41511,14 @@ const resetFormStore = (formData) => {
41422
41511
  localStorage.setItem("checkout", JSON.stringify(Object.assign(Object.assign({}, currentState), { state: Object.assign(Object.assign({}, currentState.state), { step: "customer", formData: { customer: formData.customer } }) })));
41423
41512
  };
41424
41513
 
41425
- function CheckoutForm({ storeClient, checkoutId, onSuccess, onError, cancelUrl, clientSecret, customer, currency, checkoutAppearance, fonts, locale, setShippingCost, exchangeRate, paymentSecret, publicKey, paymentComponentKey, clientProxy, latitude, longitude, currentAlpha3CountryCode, }) {
41514
+ function CheckoutForm({ storeClient, checkoutId, onSuccess, onError, cancelUrl, clientSecret, customer, currency, checkoutAppearance, fonts, locale, setShippingCost, exchangeRate, paymentSecret, publicKey, paymentComponentKey, clientProxy, latitude, longitude, currentAlpha3CountryCode, shipments, }) {
41426
41515
  const { formData, setFormData, step, setStep, checkoutId: storedCheckoutId, setCheckoutId, } = useFormStore();
41427
41516
  const [shippingRates, setShippingRates] = useState([]);
41428
41517
  const validateStep = useCallback(() => {
41429
41518
  if (step === "customer")
41430
41519
  return;
41431
41520
  const isShippingValid = formData.shipping &&
41432
- shippingMethodSchema.safeParse(formData.shipping).success;
41521
+ shipmentsFormSchema.safeParse(formData.shipping).success;
41433
41522
  const isCustomerValid = formData.customer && customerSchema.safeParse(formData.customer).success;
41434
41523
  if (step === "shipping" && !isCustomerValid) {
41435
41524
  setStep("customer");
@@ -41538,7 +41627,6 @@ function CheckoutForm({ storeClient, checkoutId, onSuccess, onError, cancelUrl,
41538
41627
  });
41539
41628
  yield storeClient.updateCheckout(clientSecret, checkoutId, {
41540
41629
  customerId: newCustomer.id,
41541
- shipments: [],
41542
41630
  });
41543
41631
  newCustomerId = newCustomer.id;
41544
41632
  }
@@ -41557,22 +41645,22 @@ function CheckoutForm({ storeClient, checkoutId, onSuccess, onError, cancelUrl,
41557
41645
  setStep("shipping");
41558
41646
  });
41559
41647
  // Handle shipping method form submission
41560
- const handleShippingSubmit = (data, id) => __awaiter(this, void 0, void 0, function* () {
41648
+ const handleShippingSubmit = (data) => __awaiter(this, void 0, void 0, function* () {
41561
41649
  const newFormData = Object.assign(Object.assign({}, formData), { shipping: data });
41562
41650
  setFormData(newFormData);
41651
+ const shipments = Object.entries(data).map(([id, shipmentFormData]) => ({
41652
+ id: id,
41653
+ shipmentData: {
41654
+ provider: shipmentFormData.provider,
41655
+ pickupPointId: shipmentFormData.pickupPointId,
41656
+ name: shipmentFormData.name,
41657
+ priceInCents: shipmentFormData.priceInCents,
41658
+ },
41659
+ }));
41563
41660
  yield storeClient.updateCheckout(clientSecret, checkoutId, {
41564
- shipments: [
41565
- {
41566
- id: id,
41567
- shipmentData: {
41568
- provider: data.provider,
41569
- pickupPointId: data.pickupPointId,
41570
- name: data.name,
41571
- },
41572
- },
41573
- ],
41661
+ shipments,
41574
41662
  });
41575
- setShippingCost(data.price);
41663
+ setShippingCost(shipments.reduce((acc, shipment) => acc + shipment.shipmentData.priceInCents, 0));
41576
41664
  setStep("payment");
41577
41665
  });
41578
41666
  // Navigate back to previous step
@@ -41590,10 +41678,10 @@ function CheckoutForm({ storeClient, checkoutId, onSuccess, onError, cancelUrl,
41590
41678
  };
41591
41679
  const renderStep = () => {
41592
41680
  if (step === "payment" && formData.customer && formData.shipping) {
41593
- return (jsx(PaymentForm, { paymentComponentKey: paymentComponentKey, locale: locale, fonts: fonts, checkoutAppearance: checkoutAppearance, paymentSecret: paymentSecret, onSuccess: onSuccess, onError: onError, onBack: handleBack, onDoubleBack: handleDoubleBack, contactEmail: formData.customer.email, shippingAddress: formatAddress(formData.customer.address), shippingName: formData.shipping.name, shippingPrice: storeHelpers.formatPrice(formData.shipping.price, currency, exchangeRate), publicKey: publicKey }));
41681
+ return (jsx(PaymentForm, { paymentComponentKey: paymentComponentKey, locale: locale, fonts: fonts, checkoutAppearance: checkoutAppearance, paymentSecret: paymentSecret, onSuccess: onSuccess, onError: onError, onBack: handleBack, onDoubleBack: handleDoubleBack, contactEmail: formData.customer.email, address: formatAddress(formData.customer.address), shippingFormData: formData.shipping, publicKey: publicKey }));
41594
41682
  }
41595
41683
  if (step === "shipping" && formData.customer) {
41596
- return (jsx(ShippingMethodForm, { setFormData: setFormData, formData: formData, shippingRates: shippingRates, initialData: formData.shipping, onSubmit: handleShippingSubmit, onBack: handleBack, contactEmail: formData.customer.email, shippingAddress: formatAddress(formData.customer.address), currency: currency, exchangeRate: exchangeRate, locale: locale, countryCode: formData.customer.address.countryCode }));
41684
+ return (jsx(ShipmentsForm, { setFormData: setFormData, formData: formData, shippingRates: shippingRates, initialData: formData.shipping, onSubmit: handleShippingSubmit, onBack: handleBack, contactEmail: formData.customer.email, shippingAddress: formatAddress(formData.customer.address), currency: currency, exchangeRate: exchangeRate, locale: locale, countryCode: formData.customer.address.countryCode, shipments: shipments }));
41597
41685
  }
41598
41686
  return (jsx(CustomerForm, { initialData: formData.customer, onSubmit: handleCustomerSubmit, clientProxy: clientProxy, clientSecret: clientSecret, latitude: latitude, longitude: longitude, currentAlpha3CountryCode: currentAlpha3CountryCode, locale: locale }));
41599
41687
  };
@@ -41638,8 +41726,6 @@ function DiscountCode({ applyDiscountCode, }) {
41638
41726
  }
41639
41727
 
41640
41728
  function CheckoutSummary({ appliedDiscounts, lineItems, shipping, tax, currency, onCancel, exchangeRate, applyDiscountCode, removeDiscount, }) {
41641
- var _a, _b;
41642
- const { formData } = useFormStore();
41643
41729
  const [isOpen, setIsOpen] = useState(false);
41644
41730
  const { t } = useTranslation();
41645
41731
  const subtotal = lineItems.reduce((acc, item) => {
@@ -41647,7 +41733,7 @@ function CheckoutSummary({ appliedDiscounts, lineItems, shipping, tax, currency,
41647
41733
  const productItem = ((_a = item.productData) === null || _a === void 0 ? void 0 : _a.selectedVariant) || item.productData;
41648
41734
  return acc + ((_b = productItem === null || productItem === void 0 ? void 0 : productItem.priceInCents) !== null && _b !== void 0 ? _b : 0) * item.quantity;
41649
41735
  }, 0);
41650
- const shippingPrice = (_b = shipping !== null && shipping !== void 0 ? shipping : (_a = formData.shipping) === null || _a === void 0 ? void 0 : _a.price) !== null && _b !== void 0 ? _b : 0;
41736
+ const shippingPrice = shipping !== null && shipping !== void 0 ? shipping : 0;
41651
41737
  const total = subtotal + (tax !== null && tax !== void 0 ? tax : 0) + shippingPrice;
41652
41738
  const isShippingFree = subtotal > shippingPrice &&
41653
41739
  appliedDiscounts.some((discount) => discount.discount.type === "FREE_SHIPPING");
@@ -41773,6 +41859,21 @@ function CheckoutEmbedComponent({ checkoutId, config }) {
41773
41859
  const [latitude, setLatitude] = useState(undefined);
41774
41860
  const [longitude, setLongitude] = useState(undefined);
41775
41861
  const [currentAlpha3CountryCode, setCurrentAlpha3CountryCode] = useState(undefined);
41862
+ const [totalShipping, setTotalShipping] = useState(null);
41863
+ useEffect(() => {
41864
+ if (checkout) {
41865
+ const areAllShipmentsFilled = checkout.shipments.every((shipment) => { var _a; return (_a = shipment.shipmentData) === null || _a === void 0 ? void 0 : _a.provider; });
41866
+ if (areAllShipmentsFilled) {
41867
+ setTotalShipping(checkout.shipments.reduce((acc, shipment) => {
41868
+ var _a, _b;
41869
+ return acc + ((_b = (_a = shipment.shipmentData) === null || _a === void 0 ? void 0 : _a.priceInCents) !== null && _b !== void 0 ? _b : 0);
41870
+ }, 0));
41871
+ }
41872
+ else {
41873
+ setTotalShipping(null);
41874
+ }
41875
+ }
41876
+ }, [checkout]);
41776
41877
  useEffect(() => {
41777
41878
  getIpInfo().then(({ latitude, longitude, countryCodeIso3 }) => {
41778
41879
  setLatitude(latitude);
@@ -41822,11 +41923,6 @@ function CheckoutEmbedComponent({ checkoutId, config }) {
41822
41923
  if (!checkout && !loading) {
41823
41924
  throw new Error("Checkout not found");
41824
41925
  }
41825
- const setShippingCost = (cost) => {
41826
- if (!checkout)
41827
- return;
41828
- setCheckout(Object.assign(Object.assign({}, checkout), { shipping: cost }));
41829
- };
41830
41926
  function generatePaymentSecret() {
41831
41927
  return __awaiter(this, void 0, void 0, function* () {
41832
41928
  console.log("[Payment Debug] Generating new payment secret");
@@ -41907,7 +42003,7 @@ function CheckoutEmbedComponent({ checkoutId, config }) {
41907
42003
  }
41908
42004
  });
41909
42005
  const calculateTotalWithDiscounts = (checkout) => {
41910
- var _a, _b;
42006
+ var _a;
41911
42007
  if (!checkout)
41912
42008
  return 0;
41913
42009
  const subtotal = checkout.lineItems.reduce((acc, item) => {
@@ -41915,8 +42011,8 @@ function CheckoutEmbedComponent({ checkoutId, config }) {
41915
42011
  const productItem = ((_a = item.productData) === null || _a === void 0 ? void 0 : _a.selectedVariant) || item.productData;
41916
42012
  return acc + ((_b = productItem === null || productItem === void 0 ? void 0 : productItem.priceInCents) !== null && _b !== void 0 ? _b : 0) * item.quantity;
41917
42013
  }, 0);
41918
- const shippingPrice = (_a = checkout.shipping) !== null && _a !== void 0 ? _a : 0;
41919
- const total = subtotal + ((_b = checkout.tax) !== null && _b !== void 0 ? _b : 0) + shippingPrice;
42014
+ const shippingPrice = totalShipping !== null && totalShipping !== void 0 ? totalShipping : 0;
42015
+ const total = subtotal + ((_a = checkout.tax) !== null && _a !== void 0 ? _a : 0) + shippingPrice;
41920
42016
  const isShippingFree = subtotal > shippingPrice &&
41921
42017
  checkout.appliedDiscounts.some((discount) => discount.discount.type === "FREE_SHIPPING");
41922
42018
  const filteredDiscounts = checkout.appliedDiscounts.filter((discount) => discount.discount.type !== "FREE_SHIPPING");
@@ -41947,7 +42043,7 @@ function CheckoutEmbedComponent({ checkoutId, config }) {
41947
42043
  };
41948
42044
  // eslint-disable-next-line react-hooks/exhaustive-deps
41949
42045
  }, []);
41950
- return (jsx(ShadowWrapper, { shadowRef: shadowRef, children: jsxs("div", { className: "checkout-embed flex h-max flex-col gap-6 py-4 md:grid md:grid-cols-7 md:gap-0 md:py-12", children: [jsx(Appearance, { appearance: appearance, fonts: config.fonts, shadowRef: shadowRef }), jsx("div", { className: "h-max px-4 md:col-span-4 md:px-8", children: loading ? (jsx(CheckoutFormLoading, {})) : (jsx(CheckoutForm, { locale: locale, setShippingCost: setShippingCost, storeClient: storeClient, fonts: config.fonts, checkoutAppearance: appearance, currency: (_a = checkout === null || checkout === void 0 ? void 0 : checkout.currency) !== null && _a !== void 0 ? _a : "", customer: checkout === null || checkout === void 0 ? void 0 : checkout.customer, cancelUrl: cancelUrl, checkoutId: checkoutId, clientSecret: clientSecret, onSuccess: onSuccess, onError: onError, exchangeRate: (_b = checkout === null || checkout === void 0 ? void 0 : checkout.exchangeRate) !== null && _b !== void 0 ? _b : 1, publicKey: publicKey, paymentSecret: paymentSecret, paymentComponentKey: paymentComponentKey, clientProxy: clientProxy, latitude: latitude, longitude: longitude, currentAlpha3CountryCode: currentAlpha3CountryCode })) }), jsxs("div", { className: "order-first h-max px-4 md:order-last md:col-span-3 md:px-8", children: [jsx(Toaster, {}), loading ? (jsx(CheckoutSummaryLoading, {})) : (jsx(CheckoutSummary, { currency: (_c = checkout === null || checkout === void 0 ? void 0 : checkout.currency) !== null && _c !== void 0 ? _c : "", lineItems: (_d = checkout === null || checkout === void 0 ? void 0 : checkout.lineItems) !== null && _d !== void 0 ? _d : [], shipping: checkout === null || checkout === void 0 ? void 0 : checkout.shipping, tax: checkout === null || checkout === void 0 ? void 0 : checkout.tax, onCancel: onCancel, exchangeRate: (_e = checkout === null || checkout === void 0 ? void 0 : checkout.exchangeRate) !== null && _e !== void 0 ? _e : 1, applyDiscountCode: applyDiscountCode, appliedDiscounts: (_f = checkout === null || checkout === void 0 ? void 0 : checkout.appliedDiscounts) !== null && _f !== void 0 ? _f : [], removeDiscount: removeDiscount }))] })] }) }));
42046
+ return (jsx(ShadowWrapper, { shadowRef: shadowRef, children: jsxs("div", { className: "checkout-embed flex h-max flex-col gap-6 py-4 md:grid md:grid-cols-7 md:gap-0 md:py-12", children: [jsx(Appearance, { appearance: appearance, fonts: config.fonts, shadowRef: shadowRef }), jsx("div", { className: "h-max px-4 md:col-span-4 md:px-8", children: loading ? (jsx(CheckoutFormLoading, {})) : (jsx(CheckoutForm, { locale: locale, setShippingCost: setTotalShipping, storeClient: storeClient, fonts: config.fonts, checkoutAppearance: appearance, currency: (_a = checkout === null || checkout === void 0 ? void 0 : checkout.currency) !== null && _a !== void 0 ? _a : "", customer: checkout === null || checkout === void 0 ? void 0 : checkout.customer, cancelUrl: cancelUrl, checkoutId: checkoutId, clientSecret: clientSecret, onSuccess: onSuccess, onError: onError, exchangeRate: (_b = checkout === null || checkout === void 0 ? void 0 : checkout.exchangeRate) !== null && _b !== void 0 ? _b : 1, publicKey: publicKey, paymentSecret: paymentSecret, paymentComponentKey: paymentComponentKey, clientProxy: clientProxy, latitude: latitude, longitude: longitude, currentAlpha3CountryCode: currentAlpha3CountryCode, shipments: (checkout === null || checkout === void 0 ? void 0 : checkout.shipments) || [] })) }), jsxs("div", { className: "order-first h-max px-4 md:order-last md:col-span-3 md:px-8", children: [jsx(Toaster, {}), loading ? (jsx(CheckoutSummaryLoading, {})) : (jsx(CheckoutSummary, { currency: (_c = checkout === null || checkout === void 0 ? void 0 : checkout.currency) !== null && _c !== void 0 ? _c : "", lineItems: (_d = checkout === null || checkout === void 0 ? void 0 : checkout.lineItems) !== null && _d !== void 0 ? _d : [], shipping: totalShipping, tax: checkout === null || checkout === void 0 ? void 0 : checkout.tax, onCancel: onCancel, exchangeRate: (_e = checkout === null || checkout === void 0 ? void 0 : checkout.exchangeRate) !== null && _e !== void 0 ? _e : 1, applyDiscountCode: applyDiscountCode, appliedDiscounts: (_f = checkout === null || checkout === void 0 ? void 0 : checkout.appliedDiscounts) !== null && _f !== void 0 ? _f : [], removeDiscount: removeDiscount }))] })] }) }));
41951
42047
  }
41952
42048
  const CheckoutEmbed = memo(CheckoutEmbedComponent);
41953
42049