@askdialog/dialog-vue 3.10.0 → 3.11.1

package/README.md

@@ -136,6 +136,7 @@ Creates one search controller per composable instance and disposes it on unmount
 - `country` (string, required) - Shopper's ISO 3166-1 alpha-2 country, e.g. `BE`; prices follow its market
 - `surface` (SearchSurface, optional) - Where results are displayed, for analytics (default: `'search_page'`)
 - `navigate` ((url, hit: SearchProductHit) => void, optional) - Router adapter called after selection attribution (e.g. `(url) => router.push(url)`). Omit it to let the cards' plain `<a href>` links navigate natively.
+- `buildProductUrl` ((hit: SearchProductHit) => string | undefined, optional) - Builds a card's link when its hit has no `url`, e.g. ``(hit) => `/products/${hit.handle}` ``. With neither, the card has no link.
 - `debounceMs` (number, optional) - Keystroke debounce (default: 250)
 - `hitsPerPage` (number, optional) - Results per page (default: 12)
 - `sections` (SearchSection[], optional) - Extra indices searched alongside the products; `collections` fills the collections column of `DialogSearchResults`. Only request an index the catalog exposes: a missing one fails the whole search.
@@ -169,7 +170,7 @@ Search input: typing runs a debounced search, submitting (Enter) searches immedi
 
 #### DialogSearchResults
 
-Floating results panel overlaying the page content: portaled to `document.body` in `position: fixed`, centered on the bar (up to 1440px wide, filling the viewport) and anchored under the spot where the component is rendered (place it right after the bar), so no ancestor stacking context or `overflow: hidden` can hide it. It shows the same layout as the Shopify search overlay: a collections column on the left when `sections` requests them, the products on the right as a list or a 3-column grid, the query match emphasized in every title, and either a "See all results" button or the pagination controls. Below 768px the panel stacks, collections in a horizontal rail above the products. Colors, radii and font follow the SDK theme (dark palette when `backgroundColor` is dark, straight or rounded corners from `ctaBorderType`). Each product card reads the hit, Algolia's Shopify record: its `product_image` (the variant's `image` when absent), its `title`, its lowest variant price (`variants_min_price`, formatted with `currency`, the base currency of the shopper's market) and its `url`; a hit without a price shows none. Each card links to the product page and records search attribution (viewport impressions, select on click and middle-click) automatically. Clicking outside the panel (and outside the bar) closes it; typing again or re-focusing the bar reopens it with the results kept.
+Floating results panel overlaying the page content: portaled to `document.body` in `position: fixed`, centered on the bar (up to 1440px wide, filling the viewport) and anchored under the spot where the component is rendered (place it right after the bar), so no ancestor stacking context or `overflow: hidden` can hide it. It shows the same layout as the Shopify search overlay: a collections column on the left when `sections` requests them, the products on the right as a list or a 3-column grid, the query match emphasized in every title, and either a "See all results" button or the pagination controls. Below 768px the panel stacks, collections in a horizontal rail above the products. Colors, radii and font follow the SDK theme (dark palette when `backgroundColor` is dark, straight or rounded corners from `ctaBorderType`). Each product card reads the hit, Algolia's Shopify record: its `product_image` (the variant's `image` when absent), its `title`, its lowest variant price (`variants_min_price`, formatted with `currency`, the base currency of the shopper's market), struck through next to it the lowest compare-at price (`variants_compare_at_price_min`, formatted the same way) when it is higher, and its `url`; a hit without a price shows none. Each card links to the product page and records search attribution (viewport impressions, select on click and middle-click) automatically. Clicking outside the panel (and outside the bar) closes it; typing again or re-focusing the bar reopens it with the results kept.
 
 **Props:**
 - `controller` (SearchController) - From `useDialogSearch` (required)

package/dist/components/DialogSearch/DialogSearchCollections.vue.d.ts

@@ -1,7 +1,7 @@
-import { SearchHit } from '@askdialog/dialog-sdk';
+import { SearchCollectionHit } from '@askdialog/dialog-sdk';
 import { SearchMessages } from './searchMessages';
 type __VLS_Props = {
-    collections: SearchHit[];
+    collections: SearchCollectionHit[];
     query: string;
     messages: SearchMessages;
 };

package/dist/components/DialogSearch/searchCollections.d.ts

@@ -1,6 +1,6 @@
-import { SearchHit } from '@askdialog/dialog-sdk';
+import { SearchCollectionHit } from '@askdialog/dialog-sdk';
 /** Collections without a link cannot navigate on selection and are not rendered. */
-export declare const navigableCollections: (collections: SearchHit[] | undefined) => {
-    collection: SearchHit;
+export declare const navigableCollections: (collections: SearchCollectionHit[] | undefined) => {
+    collection: SearchCollectionHit;
     href: string;
 }[];

package/dist/components/DialogSearch/searchDisplay.d.ts

@@ -1,11 +1,8 @@
-import { SearchHit, SearchProductHit } from '@askdialog/dialog-sdk';
-/**
- * The lowest variant price only, as on the Shopify storefront search.
- * Hide a missing or invalid price; show a bare amount when currency is absent.
- */
-export declare const formatSearchPrice: ({ variants_min_price: amount, currency }: SearchProductHit, locale?: string) => string;
+import { SearchHitByIndex, SearchIndex, SearchProductHit } from '@askdialog/dialog-sdk';
+type SearchHit = SearchHitByIndex[SearchIndex];
 /** The product's image, as Algolia's cards in distinct mode; else the variant's. */
 export declare const hitImage: (hit: SearchProductHit) => string | undefined;
-export declare const safeHref: (url: string) => string | undefined;
+export declare const safeHref: (url: string | undefined) => string | undefined;
 export declare const hitHref: (hit: SearchHit) => string | undefined;
 export declare const hitTitle: (hit: SearchHit) => string;
+export {};

package/dist/components/DialogSearch/useDialogSearch.d.ts

@@ -10,6 +10,8 @@ export interface UseDialogSearchOptions {
     surface?: SearchSurface;
     /** Navigate after recording selection; omit to use native links. */
     navigate?: (url: string, hit: SearchProductHit) => void;
+    /** Build a product's link when its hit has no `url`, e.g. `/products/${hit.handle}`. */
+    buildProductUrl?: (hit: SearchProductHit) => string | undefined;
     debounceMs?: number;
     hitsPerPage?: number;
     /**

package/dist/dialog-vue.css

@@ -1 +1 @@
-.dialog-ask-something-else[data-v-d0e272a0]{padding:12px 16px;min-height:50px;width:fit-content;display:flex;align-items:center;font-family:var(--dialog-theme-font-family);font-size:var(--dialog-theme-content-font-size, 14px);font-weight:500;cursor:pointer;border:unset;border-radius:var(--dialog-theme-cta-border-type, 24px);background-color:var(--dialog-theme-primary-color);color:var(--dialog-theme-cta-text-color)}.dialog-ask-something-else[data-v-d0e272a0]:hover:not(:disabled){transform:scale(1.02)}.dialog-ask-something-else[data-v-d0e272a0]:disabled{cursor:default;opacity:.5}.dialog-block-header-container[data-v-28e6dda7]{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start}.dialog-block-title[data-v-28e6dda7]{color:var(--dialog-theme-title-color, #272727);font-family:var(--dialog-theme-font-family);font-size:var(--dialog-theme-title-font-size);font-style:normal;font-weight:500;line-height:20px;letter-spacing:1.3px;text-transform:uppercase}.dialog-block-description[data-v-28e6dda7]{color:var(--dialog-theme-description-color, #6c6c6c);font-family:var(--dialog-theme-font-family);font-size:var(--dialog-theme-description-font-size);font-style:normal;font-weight:500;line-height:20px}.dialog-block-suggestions-item[data-v-db34d4b4]{background-color:#f1f1f1;border:none;outline:none;padding:12px 16px;width:fit-content;cursor:pointer;display:flex;justify-content:flex-start;background-color:#fff;align-items:center;gap:8px;border:1px solid #dddce2;border-radius:24px}.dialog-block-suggestions-item[data-v-db34d4b4]:hover{transform:scale(1.01)}.dialog-block-suggestions-item-label[data-v-db34d4b4]{color:var(--dialog-theme-content-color, #575665);font-size:var(--dialog-theme-content-font-size, 14px);font-weight:500;text-align:start;flex:1}.dialog-block-suggestions-item-icon path[data-v-db34d4b4]{stroke:var(--dialog-theme-primary-color)}.dialog-block-suggestions-skeleton-item[data-v-26a64b58],.dialog-block-suggestions-skeleton-item[data-v-26a64b58]:empty{display:block;width:100%;width:90%;height:18px;border-radius:18px;padding:12px 16px;background-color:#f1f1f1;animation:pulse-26a64b58 1.5s ease-in-out infinite}@keyframes pulse-26a64b58{0%{background-color:#f1f1f1}50%{background-color:#fff}to{background-color:#f1f1f1}}.dialog-block-suggestions-container[data-v-18c9e78b]{display:flex;flex-direction:column;gap:12px;width:100%}.dialog-input-wrapper[data-v-87013888]{position:relative;width:100%;height:50px;max-height:50px;padding:16px 20px;border:1px solid #d9d9d9;border-radius:var(--dialog-theme-cta-border-type, 24px);background:#fff;display:flex;align-items:center;box-sizing:border-box}.dialog-input-container[data-v-87013888]{display:flex;flex-direction:column;gap:8px;width:100%}.dialog-ask-anything-input-ai-input[data-v-87013888]{outline:unset;box-shadow:unset;border:unset;width:100%;font-size:16px;background:transparent;padding-inline-end:35px}.dialog-input-submit[data-v-87013888]{width:40px;height:40px;border-radius:100%;display:flex;align-items:center;justify-content:center;background-color:var(--dialog-theme-primary-color);position:absolute;cursor:pointer;top:calc(50% - 20px);inset-inline-end:4px;border:unset}.dialog-input-submit[data-v-87013888]:disabled{opacity:.5}.dialog-input-ai-disclosure[data-v-87013888]{margin:0;font-size:12px;line-height:1.4;font-family:var(--dialog-theme-font-family);color:var(--dialog-theme-description-color, #6b6b6b)}.dialog-block-container[data-v-0c307e5f]{position:relative;display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;padding:24px 0;width:fit-content;gap:24px}.dialog-block-container[data-v-0c307e5f]>*{box-sizing:border-box}.dialog-search-bar{box-sizing:border-box;display:flex;align-items:center;gap:8px;width:100%;margin:0;padding:10px 10px 10px 14px;background:#fffc;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(0,0,0,.05);border-radius:24px;box-shadow:0 6px 20px -6px #0000001a}.dialog-search-bar:focus-within{border-color:#00000026;box-shadow:0 6px 20px -6px #0000001a,0 0 0 2px #1717171f}.dialog-search-bar-field{display:flex;flex:1 0 0;min-width:0;align-items:center;gap:6px;padding:2px 0}.dialog-search-bar-icon{display:inline-flex;flex-shrink:0;color:#737373}.dialog-search-bar-input{flex:1 0 0;min-width:0;margin:0;padding:0;border:none;outline:none;background:transparent;font-family:Inter,sans-serif;font-weight:500;font-size:16px;line-height:24px;color:#171717;text-overflow:ellipsis;box-shadow:none;-moz-appearance:none;appearance:none;-webkit-appearance:none}.dialog-search-bar-input::placeholder{color:#a3a3a3;opacity:1}.dialog-search-bar-input:focus,.dialog-search-bar-input:focus-visible{outline:none;box-shadow:none;border:none}.dialog-search-bar-submit{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:28px;height:28px;padding:6px;border:none;border-radius:9999px;background:#171717;color:#fff;box-shadow:0 1px 1px #1717170d;cursor:pointer}.dialog-search-bar-submit:focus-visible{outline:2px solid #171717;outline-offset:2px}.dialog-search-pagination{display:flex;align-items:center;justify-content:center;gap:12px;padding:4px 0;font-size:12px;color:var(--dso-text-sec, #737373)}.dialog-search-pagination button{margin:0;padding:6px 14px;border:1px solid var(--dso-border, rgba(0, 0, 0, .1));border-radius:var(--dso-r-btn, 10px);background:transparent;font:inherit;color:var(--dso-text, #171717);cursor:pointer;transition:background-color .12s ease}.dialog-search-pagination button:hover:not(:disabled){background-color:var(--dso-hover, rgba(0, 0, 0, .04))}.dialog-search-pagination button:disabled{opacity:.4;cursor:default}.dialog-search-match{font-weight:600}.dialog-search-muted{opacity:.55}.dialog-search-card{width:100%}.dialog-search-product{display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:16px;align-items:center;padding:8px;border-radius:var(--dso-r-item);color:inherit;text-decoration:none}a.dialog-search-product:hover{background:var(--dso-hover)}.dialog-search-product-thumb{flex:none;width:56px;height:56px;overflow:hidden;border:1px solid var(--dso-border);border-radius:var(--dso-r-thumb);background:var(--dso-thumb)}.dialog-search-product-thumb img{display:block;width:100%;height:100%;object-fit:cover}.dialog-search-product-title{flex:1;min-width:0;font-size:14px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}.dialog-search-product-price{font-size:15px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}@media(min-width:768px){.dialog-search-panel--grid .dialog-search-product{display:flex;flex-direction:column;align-items:stretch;gap:10px;padding:12px;border:1px solid var(--dso-border)}.dialog-search-panel--grid .dialog-search-product-thumb{width:100%;height:auto;aspect-ratio:4 / 3;border:0}}@media(max-width:767px){.dialog-search-product{grid-template-columns:52px minmax(0,1fr) auto;gap:12px}.dialog-search-product-thumb{width:52px;height:52px}.dialog-search-product-price{font-size:14px}}.dialog-search-collections{display:flex;flex-direction:column;gap:4px;min-height:0;padding:20px 12px 20px 24px;border-right:1px solid var(--dso-border);background:var(--dso-side);overflow-y:auto}.dialog-search-collection-list{display:flex;flex-direction:column;gap:4px;margin:0;padding:0;list-style:none}.dialog-search-collection{display:flex;align-items:center;gap:12px;padding:8px 12px;border-radius:var(--dso-r-item);color:inherit;text-decoration:none}.dialog-search-collection:hover{background:var(--dso-hover)}.dialog-search-collection-thumb{flex:none;width:40px;height:40px;overflow:hidden;border-radius:var(--dso-r-thumb);background:var(--dso-thumb)}.dialog-search-collection-thumb img{display:block;width:100%;height:100%;object-fit:cover}.dialog-search-collection-title{flex:1;min-width:0;font-size:14px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}.dialog-search-caret{display:inline-flex;flex:none;color:var(--dso-text-sec)}@media(max-width:767px){.dialog-search-collections{flex:none;gap:10px;padding:0;border-right:0;background:transparent;overflow:visible}.dialog-search-collections .dialog-search-section-head{padding:0 16px}.dialog-search-collection-list{flex-direction:row;gap:10px;padding:0 16px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}.dialog-search-collection-list::-webkit-scrollbar{display:none}.dialog-search-collection{flex:none;flex-direction:column;align-items:stretch;gap:8px;width:80px;padding:0}.dialog-search-collection-thumb{width:80px;height:50px;border-radius:var(--dso-r-item)}.dialog-search-collection-title{font-size:13px}.dialog-search-caret{display:none}}.dialog-search-products{display:flex;flex-direction:column;gap:14px;min-height:0;padding:20px 24px 12px;overflow-y:auto}.dialog-search-products .dialog-search-section-head{padding:0 8px}.dialog-search-results{display:flex;flex-direction:column;margin:0;padding:0;list-style:none}.dialog-search-empty{padding:8px;color:var(--dso-text-sec)}@media(min-width:768px){.dialog-search-panel--grid .dialog-search-results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}}@media(max-width:767px){.dialog-search-products{gap:6px;padding:0 8px 8px;overflow:visible}}.dialog-search-panel{position:fixed;z-index:9999;box-sizing:border-box;display:flex;flex-direction:column;margin:0;padding:0;background:var(--dso-panel);border-radius:var(--dso-r-panel);box-shadow:0 24px 64px #00000047;overflow:hidden;font-family:var(--dso-font, inherit);font-size:14px;line-height:1.35;color:var(--dso-text);-webkit-font-smoothing:antialiased}.dialog-search-panel *,.dialog-search-panel *:before,.dialog-search-panel *:after{box-sizing:border-box}.dialog-search-status{margin:0;padding:16px 24px;color:var(--dso-text-sec)}.dialog-search-status-error{color:#b3261e}.dialog-search-error{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding-bottom:16px}.dialog-search-retry{margin:0 24px;padding:6px 14px;border:1px solid var(--dso-border);border-radius:var(--dso-r-btn);background:transparent;font:inherit;font-size:13px;color:var(--dso-text);cursor:pointer;transition:background-color .12s ease}.dialog-search-retry:hover{background-color:var(--dso-hover)}.dialog-search-body{display:grid;grid-template-columns:340px minmax(0,1fr);flex:1;min-height:0}.dialog-search-body--no-collections{grid-template-columns:minmax(0,1fr)}.dialog-search-section-head{display:flex;justify-content:space-between;align-items:baseline;padding:0 12px 8px}.dialog-search-label{margin:0;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--dso-text-sec)}.dialog-search-label-count{font-size:12px;font-weight:500;letter-spacing:0;text-transform:none}.dialog-search-count{font-size:12px;color:var(--dso-text-sec)}.dialog-search-footer{display:flex;justify-content:flex-end;align-items:center;flex:none;padding:14px 24px;border-top:1px solid var(--dso-border)}.dialog-search-cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 20px;border:1px solid var(--dso-primary);border-radius:var(--dso-r-btn);background:var(--dso-primary);color:var(--dso-cta-text);font-size:14px;font-weight:500;text-decoration:none}.dialog-search-cta:hover{filter:brightness(.95)}.dialog-search-footer .dialog-search-pagination{flex:1}@media(max-width:767px){.dialog-search-body{display:flex;flex-direction:column;gap:18px;padding-top:16px;overflow-y:auto}.dialog-search-footer{padding:12px 16px}.dialog-search-cta{width:100%;height:44px}.dialog-search-cta svg{display:none}}
+.dialog-ask-something-else[data-v-d0e272a0]{padding:12px 16px;min-height:50px;width:fit-content;display:flex;align-items:center;font-family:var(--dialog-theme-font-family);font-size:var(--dialog-theme-content-font-size, 14px);font-weight:500;cursor:pointer;border:unset;border-radius:var(--dialog-theme-cta-border-type, 24px);background-color:var(--dialog-theme-primary-color);color:var(--dialog-theme-cta-text-color)}.dialog-ask-something-else[data-v-d0e272a0]:hover:not(:disabled){transform:scale(1.02)}.dialog-ask-something-else[data-v-d0e272a0]:disabled{cursor:default;opacity:.5}.dialog-block-header-container[data-v-28e6dda7]{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start}.dialog-block-title[data-v-28e6dda7]{color:var(--dialog-theme-title-color, #272727);font-family:var(--dialog-theme-font-family);font-size:var(--dialog-theme-title-font-size);font-style:normal;font-weight:500;line-height:20px;letter-spacing:1.3px;text-transform:uppercase}.dialog-block-description[data-v-28e6dda7]{color:var(--dialog-theme-description-color, #6c6c6c);font-family:var(--dialog-theme-font-family);font-size:var(--dialog-theme-description-font-size);font-style:normal;font-weight:500;line-height:20px}.dialog-block-suggestions-item[data-v-db34d4b4]{background-color:#f1f1f1;border:none;outline:none;padding:12px 16px;width:fit-content;cursor:pointer;display:flex;justify-content:flex-start;background-color:#fff;align-items:center;gap:8px;border:1px solid #dddce2;border-radius:24px}.dialog-block-suggestions-item[data-v-db34d4b4]:hover{transform:scale(1.01)}.dialog-block-suggestions-item-label[data-v-db34d4b4]{color:var(--dialog-theme-content-color, #575665);font-size:var(--dialog-theme-content-font-size, 14px);font-weight:500;text-align:start;flex:1}.dialog-block-suggestions-item-icon path[data-v-db34d4b4]{stroke:var(--dialog-theme-primary-color)}.dialog-block-suggestions-skeleton-item[data-v-26a64b58],.dialog-block-suggestions-skeleton-item[data-v-26a64b58]:empty{display:block;width:100%;width:90%;height:18px;border-radius:18px;padding:12px 16px;background-color:#f1f1f1;animation:pulse-26a64b58 1.5s ease-in-out infinite}@keyframes pulse-26a64b58{0%{background-color:#f1f1f1}50%{background-color:#fff}to{background-color:#f1f1f1}}.dialog-block-suggestions-container[data-v-18c9e78b]{display:flex;flex-direction:column;gap:12px;width:100%}.dialog-input-wrapper[data-v-87013888]{position:relative;width:100%;height:50px;max-height:50px;padding:16px 20px;border:1px solid #d9d9d9;border-radius:var(--dialog-theme-cta-border-type, 24px);background:#fff;display:flex;align-items:center;box-sizing:border-box}.dialog-input-container[data-v-87013888]{display:flex;flex-direction:column;gap:8px;width:100%}.dialog-ask-anything-input-ai-input[data-v-87013888]{outline:unset;box-shadow:unset;border:unset;width:100%;font-size:16px;background:transparent;padding-inline-end:35px}.dialog-input-submit[data-v-87013888]{width:40px;height:40px;border-radius:100%;display:flex;align-items:center;justify-content:center;background-color:var(--dialog-theme-primary-color);position:absolute;cursor:pointer;top:calc(50% - 20px);inset-inline-end:4px;border:unset}.dialog-input-submit[data-v-87013888]:disabled{opacity:.5}.dialog-input-ai-disclosure[data-v-87013888]{margin:0;font-size:12px;line-height:1.4;font-family:var(--dialog-theme-font-family);color:var(--dialog-theme-description-color, #6b6b6b)}.dialog-block-container[data-v-0c307e5f]{position:relative;display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;padding:24px 0;width:fit-content;gap:24px}.dialog-block-container[data-v-0c307e5f]>*{box-sizing:border-box}.dialog-search-bar{box-sizing:border-box;display:flex;align-items:center;gap:8px;width:100%;margin:0;padding:10px 10px 10px 14px;background:#fffc;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(0,0,0,.05);border-radius:24px;box-shadow:0 6px 20px -6px #0000001a}.dialog-search-bar:focus-within{border-color:#00000026;box-shadow:0 6px 20px -6px #0000001a,0 0 0 2px #1717171f}.dialog-search-bar-field{display:flex;flex:1 0 0;min-width:0;align-items:center;gap:6px;padding:2px 0}.dialog-search-bar-icon{display:inline-flex;flex-shrink:0;color:#737373}.dialog-search-bar-input{flex:1 0 0;min-width:0;margin:0;padding:0;border:none;outline:none;background:transparent;font-family:Inter,sans-serif;font-weight:500;font-size:16px;line-height:24px;color:#171717;text-overflow:ellipsis;box-shadow:none;-moz-appearance:none;appearance:none;-webkit-appearance:none}.dialog-search-bar-input::placeholder{color:#a3a3a3;opacity:1}.dialog-search-bar-input:focus,.dialog-search-bar-input:focus-visible{outline:none;box-shadow:none;border:none}.dialog-search-bar-submit{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:28px;height:28px;padding:6px;border:none;border-radius:9999px;background:#171717;color:#fff;box-shadow:0 1px 1px #1717170d;cursor:pointer}.dialog-search-bar-submit:focus-visible{outline:2px solid #171717;outline-offset:2px}.dialog-search-pagination{display:flex;align-items:center;justify-content:center;gap:12px;padding:4px 0;font-size:12px;color:var(--dso-text-sec, #737373)}.dialog-search-pagination button{margin:0;padding:6px 14px;border:1px solid var(--dso-border, rgba(0, 0, 0, .1));border-radius:var(--dso-r-btn, 10px);background:transparent;font:inherit;color:var(--dso-text, #171717);cursor:pointer;transition:background-color .12s ease}.dialog-search-pagination button:hover:not(:disabled){background-color:var(--dso-hover, rgba(0, 0, 0, .04))}.dialog-search-pagination button:disabled{opacity:.4;cursor:default}.dialog-search-match{font-weight:600}.dialog-search-muted{opacity:.55}.dialog-search-card{width:100%}.dialog-search-product{display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:16px;align-items:center;padding:8px;border-radius:var(--dso-r-item);color:inherit;text-decoration:none}a.dialog-search-product:hover{background:var(--dso-hover)}.dialog-search-product-thumb{flex:none;width:56px;height:56px;overflow:hidden;border:1px solid var(--dso-border);border-radius:var(--dso-r-thumb);background:var(--dso-thumb)}.dialog-search-product-thumb img{display:block;width:100%;height:100%;object-fit:cover}.dialog-search-product-title{flex:1;min-width:0;font-size:14px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}.dialog-search-product-price{font-size:15px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}.dialog-search-product-compare-at{margin-inline-end:6px;font-weight:400;opacity:.55}@media(min-width:768px){.dialog-search-panel--grid .dialog-search-product{display:flex;flex-direction:column;align-items:stretch;gap:10px;padding:12px;border:1px solid var(--dso-border)}.dialog-search-panel--grid .dialog-search-product-thumb{width:100%;height:auto;aspect-ratio:4 / 3;border:0}}@media(max-width:767px){.dialog-search-product{grid-template-columns:52px minmax(0,1fr) auto;gap:12px}.dialog-search-product-thumb{width:52px;height:52px}.dialog-search-product-price{font-size:14px}}.dialog-search-collections{display:flex;flex-direction:column;gap:4px;min-height:0;padding:20px 12px 20px 24px;border-right:1px solid var(--dso-border);background:var(--dso-side);overflow-y:auto}.dialog-search-collection-list{display:flex;flex-direction:column;gap:4px;margin:0;padding:0;list-style:none}.dialog-search-collection{display:flex;align-items:center;gap:12px;padding:8px 12px;border-radius:var(--dso-r-item);color:inherit;text-decoration:none}.dialog-search-collection:hover{background:var(--dso-hover)}.dialog-search-collection-thumb{flex:none;width:40px;height:40px;overflow:hidden;border-radius:var(--dso-r-thumb);background:var(--dso-thumb)}.dialog-search-collection-thumb img{display:block;width:100%;height:100%;object-fit:cover}.dialog-search-collection-title{flex:1;min-width:0;font-size:14px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}.dialog-search-caret{display:inline-flex;flex:none;color:var(--dso-text-sec)}@media(max-width:767px){.dialog-search-collections{flex:none;gap:10px;padding:0;border-right:0;background:transparent;overflow:visible}.dialog-search-collections .dialog-search-section-head{padding:0 16px}.dialog-search-collection-list{flex-direction:row;gap:10px;padding:0 16px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}.dialog-search-collection-list::-webkit-scrollbar{display:none}.dialog-search-collection{flex:none;flex-direction:column;align-items:stretch;gap:8px;width:80px;padding:0}.dialog-search-collection-thumb{width:80px;height:50px;border-radius:var(--dso-r-item)}.dialog-search-collection-title{font-size:13px}.dialog-search-caret{display:none}}.dialog-search-products{display:flex;flex-direction:column;gap:14px;min-height:0;padding:20px 24px 12px;overflow-y:auto}.dialog-search-products .dialog-search-section-head{padding:0 8px}.dialog-search-results{display:flex;flex-direction:column;margin:0;padding:0;list-style:none}.dialog-search-empty{padding:8px;color:var(--dso-text-sec)}@media(min-width:768px){.dialog-search-panel--grid .dialog-search-results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}}@media(max-width:767px){.dialog-search-products{gap:6px;padding:0 8px 8px;overflow:visible}}.dialog-search-panel{position:fixed;z-index:9999;box-sizing:border-box;display:flex;flex-direction:column;margin:0;padding:0;background:var(--dso-panel);border-radius:var(--dso-r-panel);box-shadow:0 24px 64px #00000047;overflow:hidden;font-family:var(--dso-font, inherit);font-size:14px;line-height:1.35;color:var(--dso-text);-webkit-font-smoothing:antialiased}.dialog-search-panel *,.dialog-search-panel *:before,.dialog-search-panel *:after{box-sizing:border-box}.dialog-search-status{margin:0;padding:16px 24px;color:var(--dso-text-sec)}.dialog-search-status-error{color:#b3261e}.dialog-search-error{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding-bottom:16px}.dialog-search-retry{margin:0 24px;padding:6px 14px;border:1px solid var(--dso-border);border-radius:var(--dso-r-btn);background:transparent;font:inherit;font-size:13px;color:var(--dso-text);cursor:pointer;transition:background-color .12s ease}.dialog-search-retry:hover{background-color:var(--dso-hover)}.dialog-search-body{display:grid;grid-template-columns:340px minmax(0,1fr);flex:1;min-height:0}.dialog-search-body--no-collections{grid-template-columns:minmax(0,1fr)}.dialog-search-section-head{display:flex;justify-content:space-between;align-items:baseline;padding:0 12px 8px}.dialog-search-label{margin:0;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--dso-text-sec)}.dialog-search-label-count{font-size:12px;font-weight:500;letter-spacing:0;text-transform:none}.dialog-search-count{font-size:12px;color:var(--dso-text-sec)}.dialog-search-footer{display:flex;justify-content:flex-end;align-items:center;flex:none;padding:14px 24px;border-top:1px solid var(--dso-border)}.dialog-search-cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 20px;border:1px solid var(--dso-primary);border-radius:var(--dso-r-btn);background:var(--dso-primary);color:var(--dso-cta-text);font-size:14px;font-weight:500;text-decoration:none}.dialog-search-cta:hover{filter:brightness(.95)}.dialog-search-footer .dialog-search-pagination{flex:1}@media(max-width:767px){.dialog-search-body{display:flex;flex-direction:column;gap:18px;padding-top:16px;overflow-y:auto}.dialog-search-footer{padding:12px 16px}.dialog-search-cta{width:100%;height:44px}.dialog-search-cta svg{display:none}}