@getlupa/client 1.15.16 → 1.16.0

package/dist/lupaSearch.mjs

@@ -8695,8 +8695,8 @@ const useSearchBoxStore = defineStore("searchBox", () => {
 });
 const _hoisted_1$1h = { id: "lupa-search-box-input-container" };
 const _hoisted_2$V = { class: "lupa-input-clear" };
-const _hoisted_3$E = { id: "lupa-search-box-input" };
-const _hoisted_4$t = ["value"];
+const _hoisted_3$C = { id: "lupa-search-box-input" };
+const _hoisted_4$s = ["value"];
 const _hoisted_5$j = ["aria-label", "placeholder"];
 const _hoisted_6$9 = /* @__PURE__ */ createBaseVNode("span", { class: "lupa-search-submit-icon" }, null, -1);
 const _hoisted_7$7 = [
@@ -8706,7 +8706,7 @@ const _hoisted_8$3 = {
   key: 0,
   class: "lupa-close-label"
 };
-const _sfc_main$1t = /* @__PURE__ */ defineComponent({
+const _sfc_main$1u = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxInput",
   props: {
     options: {},
@@ -8797,13 +8797,13 @@ const _sfc_main$1t = /* @__PURE__ */ defineComponent({
             onClick: clear2
           }, null, 2)
         ]),
-        createBaseVNode("div", _hoisted_3$E, [
+        createBaseVNode("div", _hoisted_3$C, [
           createBaseVNode("input", {
             class: "lupa-hint",
             "aria-hidden": "true",
             value: showHint.value ? suggestedValue.value.item.suggestion : "",
             disabled: ""
-          }, null, 8, _hoisted_4$t),
+          }, null, 8, _hoisted_4$s),
           withDirectives(createBaseVNode("input", mergeProps({
             "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => inputValue.value = $event)
           }, inputAttributes.value, {
@@ -8836,7 +8836,7 @@ const _sfc_main$1t = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$1s = /* @__PURE__ */ defineComponent({
+const _sfc_main$1t = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxMoreResults",
   props: {
     labels: {},
@@ -8875,7 +8875,7 @@ const _sfc_main$1s = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$1g = { class: "lupa-search-box-history-item" };
 const _hoisted_2$U = { class: "lupa-search-box-history-item-content" };
-const _sfc_main$1r = /* @__PURE__ */ defineComponent({
+const _sfc_main$1s = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxHistoryItem",
   props: {
     item: {},
@@ -8910,7 +8910,7 @@ const _hoisted_1$1f = {
   key: 0,
   class: "lupa-search-box-history-panel"
 };
-const _sfc_main$1q = /* @__PURE__ */ defineComponent({
+const _sfc_main$1r = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxHistoryPanel",
   props: {
     options: {}
@@ -8953,7 +8953,7 @@ const _sfc_main$1q = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return hasHistory.value ? (openBlock(), createElementBlock("div", _hoisted_1$1f, [
         (openBlock(true), createElementBlock(Fragment, null, renderList(unref(history), (item, index) => {
-          return openBlock(), createBlock(_sfc_main$1r, {
+          return openBlock(), createBlock(_sfc_main$1s, {
             key: item,
             item,
             highlighted: index === highlightIndex.value,
@@ -8970,7 +8970,7 @@ const _sfc_main$1q = /* @__PURE__ */ defineComponent({
   }
 });
 const _hoisted_1$1e = { class: "lupa-search-box-no-results" };
-const _sfc_main$1p = /* @__PURE__ */ defineComponent({
+const _sfc_main$1q = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxNoResults",
   props: {
     labels: {}
@@ -9015,12 +9015,12 @@ const _hoisted_2$T = {
   "data-cy": "lupa-suggestion-value",
   class: "lupa-suggestion-value"
 };
-const _hoisted_3$D = {
+const _hoisted_3$B = {
   key: 2,
   class: "lupa-suggestion-facet",
   "data-cy": "lupa-suggestion-facet"
 };
-const _hoisted_4$s = {
+const _hoisted_4$r = {
   class: "lupa-suggestion-facet-label",
   "data-cy": "lupa-suggestion-facet-label"
 };
@@ -9028,7 +9028,7 @@ const _hoisted_5$i = {
   class: "lupa-suggestion-facet-value",
   "data-cy": "lupa-suggestion-facet-value"
 };
-const _sfc_main$1o = /* @__PURE__ */ defineComponent({
+const _sfc_main$1p = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxSuggestion",
   props: {
     suggestion: {},
@@ -9065,8 +9065,8 @@ const _sfc_main$1o = /* @__PURE__ */ defineComponent({
           "data-cy": "lupa-suggestion-value",
           innerHTML: _ctx.suggestion.displayHighlight
         }, null, 8, _hoisted_1$1d)) : (openBlock(), createElementBlock("div", _hoisted_2$T, toDisplayString(_ctx.suggestion.display), 1)),
-        _ctx.suggestion.facet ? (openBlock(), createElementBlock("div", _hoisted_3$D, [
-          createBaseVNode("span", _hoisted_4$s, toDisplayString(facetLabel.value), 1),
+        _ctx.suggestion.facet ? (openBlock(), createElementBlock("div", _hoisted_3$B, [
+          createBaseVNode("span", _hoisted_4$r, toDisplayString(facetLabel.value), 1),
           createBaseVNode("span", _hoisted_5$i, toDisplayString(_ctx.suggestion.facet.title), 1)
         ])) : createCommentVNode("", true)
       ]);
@@ -9077,7 +9077,7 @@ const _hoisted_1$1c = {
   id: "lupa-search-box-suggestions",
   "data-cy": "lupa-search-box-suggestions"
 };
-const _sfc_main$1n = /* @__PURE__ */ defineComponent({
+const _sfc_main$1o = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxSuggestions",
   props: {
     items: {},
@@ -9139,7 +9139,7 @@ const _sfc_main$1n = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$1c, [
         (openBlock(true), createElementBlock(Fragment, null, renderList(items.value, (item, index) => {
-          return openBlock(), createBlock(_sfc_main$1o, {
+          return openBlock(), createBlock(_sfc_main$1p, {
             key: getSuggestionKey(item),
             class: normalizeClass(["lupa-suggestion", index === highlightedIndex.value ? "lupa-suggestion-highlighted" : ""]),
             suggestion: item,
@@ -9167,7 +9167,7 @@ const debounce$1 = (func, timeout) => {
     }, timeout);
   };
 };
-const _sfc_main$1m = /* @__PURE__ */ defineComponent({
+const _sfc_main$1n = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxSuggestionsWrapper",
   props: {
     panel: {},
@@ -9209,7 +9209,7 @@ const _sfc_main$1m = /* @__PURE__ */ defineComponent({
     const getSuggestionsDebounced = debounce$1(getSuggestions, props.debounce);
     watch(() => props.panel.limit, getSuggestionsDebounced);
     return (_ctx, _cache) => {
-      return openBlock(), createBlock(_sfc_main$1n, {
+      return openBlock(), createBlock(_sfc_main$1o, {
         items: searchResult.value,
         highlight: _ctx.panel.highlight,
         queryKey: _ctx.panel.queryKey,
@@ -18300,7 +18300,7 @@ const replaceImageWithPlaceholder = (e2, placeholder) => {
 };
 const _hoisted_1$1b = ["src"];
 const _hoisted_2$S = ["src"];
-const _sfc_main$1l = /* @__PURE__ */ defineComponent({
+const _sfc_main$1m = /* @__PURE__ */ defineComponent({
   __name: "ProductImage",
   props: {
     item: {},
@@ -18455,7 +18455,7 @@ const _sfc_main$1l = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$1k = /* @__PURE__ */ defineComponent({
+const _sfc_main$1l = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProductImage",
   props: {
     item: {},
@@ -18463,7 +18463,7 @@ const _sfc_main$1k = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     return (_ctx, _cache) => {
-      return openBlock(), createBlock(_sfc_main$1l, {
+      return openBlock(), createBlock(_sfc_main$1m, {
         item: _ctx.item,
         options: _ctx.options,
         "wrapper-class": "lupa-search-box-image-wrapper",
@@ -18477,7 +18477,7 @@ const _hoisted_2$R = {
   key: 1,
   class: "lupa-search-box-product-title"
 };
-const _sfc_main$1j = /* @__PURE__ */ defineComponent({
+const _sfc_main$1k = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProductTitle",
   props: {
     item: {},
@@ -18511,7 +18511,7 @@ const _hoisted_2$Q = {
   key: 1,
   class: "lupa-search-box-product-description"
 };
-const _sfc_main$1i = /* @__PURE__ */ defineComponent({
+const _sfc_main$1j = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProductDescription",
   props: {
     item: {},
@@ -18539,7 +18539,7 @@ const _sfc_main$1i = /* @__PURE__ */ defineComponent({
   }
 });
 const _hoisted_1$18 = { class: "lupa-search-box-product-price" };
-const _sfc_main$1h = /* @__PURE__ */ defineComponent({
+const _sfc_main$1i = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProductPrice",
   props: {
     item: {},
@@ -18563,7 +18563,7 @@ const _sfc_main$1h = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$1g = /* @__PURE__ */ defineComponent({
+const _sfc_main$1h = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProductRegularPrice",
   props: {
     item: {},
@@ -18592,10 +18592,10 @@ const _sfc_main$1g = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$17 = ["innerHTML"];
 const _hoisted_2$P = { key: 0 };
-const _hoisted_3$C = { key: 1 };
-const _hoisted_4$r = { class: "lupa-search-box-custom-label" };
+const _hoisted_3$A = { key: 1 };
+const _hoisted_4$q = { class: "lupa-search-box-custom-label" };
 const _hoisted_5$h = { class: "lupa-search-box-custom-text" };
-const _sfc_main$1f = /* @__PURE__ */ defineComponent({
+const _sfc_main$1g = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProductCustom",
   props: {
     item: {},
@@ -18625,8 +18625,8 @@ const _sfc_main$1f = /* @__PURE__ */ defineComponent({
         key: 1,
         class: [className.value, "lupa-search-box-product-custom"]
       }, toHandlers(_ctx.options.action ? { click: handleClick } : {}, true)), [
-        !label.value ? (openBlock(), createElementBlock("div", _hoisted_2$P, toDisplayString(text.value), 1)) : (openBlock(), createElementBlock("div", _hoisted_3$C, [
-          createBaseVNode("div", _hoisted_4$r, toDisplayString(label.value), 1),
+        !label.value ? (openBlock(), createElementBlock("div", _hoisted_2$P, toDisplayString(text.value), 1)) : (openBlock(), createElementBlock("div", _hoisted_3$A, [
+          createBaseVNode("div", _hoisted_4$q, toDisplayString(label.value), 1),
           createBaseVNode("div", _hoisted_5$h, toDisplayString(text.value), 1)
         ]))
       ], 16));
@@ -18634,7 +18634,7 @@ const _sfc_main$1f = /* @__PURE__ */ defineComponent({
   }
 });
 const _hoisted_1$16 = ["innerHTML"];
-const _sfc_main$1e = /* @__PURE__ */ defineComponent({
+const _sfc_main$1f = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProductCustomHtml",
   props: {
     item: {},
@@ -18780,8 +18780,11 @@ const useSearchResultStore = defineStore("searchResult", () => {
       return hasResults.value && ((_a = searchResult.value.offset) != null ? _a : 0) >= totalItems.value;
     }
   );
-  const setSidebarState = ({ visible }) => {
-    if (visible) {
+  const setSidebarState = ({
+    visible,
+    disableBodyScrolling = true
+  }) => {
+    if (visible && disableBodyScrolling) {
       disableBodyScroll();
     } else {
       enableBodyScroll();
@@ -18895,8 +18898,8 @@ const useSearchResultStore = defineStore("searchResult", () => {
 });
 const _hoisted_1$15 = { class: "lupa-search-box-add-to-cart-wrapper" };
 const _hoisted_2$O = { class: "lupa-search-box-product-addtocart" };
-const _hoisted_3$B = ["onClick", "disabled"];
-const _sfc_main$1d = /* @__PURE__ */ defineComponent({
+const _hoisted_3$z = ["onClick", "disabled"];
+const _sfc_main$1e = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProductAddToCart",
   props: {
     item: {},
@@ -18938,7 +18941,7 @@ const _sfc_main$1d = /* @__PURE__ */ defineComponent({
             "data-cy": "lupa-add-to-cart",
             type: "button",
             disabled: !inStockValue.value || loading.value
-          }, _ctx.dynamicAttributes), toDisplayString(label.value), 17, _hoisted_3$B)
+          }, _ctx.dynamicAttributes), toDisplayString(label.value), 17, _hoisted_3$z)
         ])
       ]);
     };
@@ -18950,17 +18953,17 @@ const _hoisted_1$14 = {
 };
 const __default__$4 = {
   components: {
-    SearchBoxProductImage: _sfc_main$1k,
-    SearchBoxProductTitle: _sfc_main$1j,
-    SearchBoxProductDescription: _sfc_main$1i,
-    SearchBoxProductPrice: _sfc_main$1h,
-    SearchBoxProductRegularPrice: _sfc_main$1g,
-    SearchBoxProductCustom: _sfc_main$1f,
-    SearchBoxProductCustomHtml: _sfc_main$1e,
-    SearchBoxProductAddToCart: _sfc_main$1d
+    SearchBoxProductImage: _sfc_main$1l,
+    SearchBoxProductTitle: _sfc_main$1k,
+    SearchBoxProductDescription: _sfc_main$1j,
+    SearchBoxProductPrice: _sfc_main$1i,
+    SearchBoxProductRegularPrice: _sfc_main$1h,
+    SearchBoxProductCustom: _sfc_main$1g,
+    SearchBoxProductCustomHtml: _sfc_main$1f,
+    SearchBoxProductAddToCart: _sfc_main$1e
   }
 };
-const _sfc_main$1c = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValues2({}, __default__$4), {
+const _sfc_main$1d = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValues2({}, __default__$4), {
   __name: "SearchBoxProductElement",
   props: {
     item: {},
@@ -19046,12 +19049,12 @@ const _sfc_main$1c = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValu
 }));
 const _hoisted_1$13 = { class: "lupa-badge-title" };
 const _hoisted_2$N = ["src"];
-const _hoisted_3$A = { key: 1 };
-const _hoisted_4$q = {
+const _hoisted_3$y = { key: 1 };
+const _hoisted_4$p = {
   key: 0,
   class: "lupa-badge-full-text"
 };
-const _sfc_main$1b = /* @__PURE__ */ defineComponent({
+const _sfc_main$1c = /* @__PURE__ */ defineComponent({
   __name: "SearchResultGeneratedBadge",
   props: {
     options: {},
@@ -19089,15 +19092,15 @@ const _sfc_main$1b = /* @__PURE__ */ defineComponent({
             key: 0,
             src: image.value
           }, null, 8, _hoisted_2$N)) : createCommentVNode("", true),
-          hasTitleText.value && showTitle.value ? (openBlock(), createElementBlock("span", _hoisted_3$A, toDisplayString(_ctx.badge.titleText), 1)) : createCommentVNode("", true)
+          hasTitleText.value && showTitle.value ? (openBlock(), createElementBlock("span", _hoisted_3$y, toDisplayString(_ctx.badge.titleText), 1)) : createCommentVNode("", true)
         ]),
-        hasAdditionalText.value ? (openBlock(), createElementBlock("span", _hoisted_4$q, toDisplayString(_ctx.badge.additionalText), 1)) : createCommentVNode("", true)
+        hasAdditionalText.value ? (openBlock(), createElementBlock("span", _hoisted_4$p, toDisplayString(_ctx.badge.additionalText), 1)) : createCommentVNode("", true)
       ], 6);
     };
   }
 });
 const _hoisted_1$12 = { class: "lupa-generated-badges" };
-const _sfc_main$1a = /* @__PURE__ */ defineComponent({
+const _sfc_main$1b = /* @__PURE__ */ defineComponent({
   __name: "SearchResultGeneratedBadges",
   props: {
     options: {}
@@ -19125,7 +19128,7 @@ const _sfc_main$1a = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$12, [
         (openBlock(true), createElementBlock(Fragment, null, renderList(badges.value, (badge) => {
-          return openBlock(), createBlock(_sfc_main$1b, {
+          return openBlock(), createBlock(_sfc_main$1c, {
             key: badge.id,
             badge,
             options: _ctx.options
@@ -19136,7 +19139,7 @@ const _sfc_main$1a = /* @__PURE__ */ defineComponent({
   }
 });
 const _hoisted_1$11 = ["innerHTML"];
-const _sfc_main$19 = /* @__PURE__ */ defineComponent({
+const _sfc_main$1a = /* @__PURE__ */ defineComponent({
   __name: "CustomBadge",
   props: {
     badge: {}
@@ -19162,7 +19165,7 @@ const _sfc_main$19 = /* @__PURE__ */ defineComponent({
   }
 });
 const _hoisted_1$10 = { class: "lupa-text-badges" };
-const _sfc_main$18 = /* @__PURE__ */ defineComponent({
+const _sfc_main$19 = /* @__PURE__ */ defineComponent({
   __name: "TextBadge",
   props: {
     badge: {}
@@ -19189,7 +19192,7 @@ const _sfc_main$18 = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$$ = { class: "lupa-image-badges" };
 const _hoisted_2$M = ["src"];
-const _sfc_main$17 = /* @__PURE__ */ defineComponent({
+const _sfc_main$18 = /* @__PURE__ */ defineComponent({
   __name: "ImageBadge",
   props: {
     badge: {}
@@ -19224,7 +19227,7 @@ const _sfc_main$17 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$16 = /* @__PURE__ */ defineComponent({
+const _sfc_main$17 = /* @__PURE__ */ defineComponent({
   __name: "DiscountBadge",
   props: {
     badge: {}
@@ -19285,13 +19288,13 @@ const _sfc_main$16 = /* @__PURE__ */ defineComponent({
 const _hoisted_1$_ = { id: "lupa-search-results-badges" };
 const __default__$3 = {
   components: {
-    CustomBadge: _sfc_main$19,
-    TextBadge: _sfc_main$18,
-    ImageBadge: _sfc_main$17,
-    DiscountBadge: _sfc_main$16
+    CustomBadge: _sfc_main$1a,
+    TextBadge: _sfc_main$19,
+    ImageBadge: _sfc_main$18,
+    DiscountBadge: _sfc_main$17
   }
 };
-const _sfc_main$15 = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValues2({}, __default__$3), {
+const _sfc_main$16 = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValues2({}, __default__$3), {
   __name: "SearchResultsBadgeWrapper",
   props: {
     position: {},
@@ -19365,7 +19368,7 @@ const _sfc_main$15 = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValu
               badge
             }, null, 8, ["badge"]);
           }), 128)),
-          positionValue.value === "card" ? (openBlock(), createBlock(_sfc_main$1a, {
+          positionValue.value === "card" ? (openBlock(), createBlock(_sfc_main$1b, {
             key: 0,
             options: _ctx.options
           }, null, 8, ["options"])) : createCommentVNode("", true)
@@ -19376,11 +19379,11 @@ const _sfc_main$15 = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValu
 }));
 const _hoisted_1$Z = ["href"];
 const _hoisted_2$L = { class: "lupa-search-box-product-details-section" };
-const _hoisted_3$z = {
+const _hoisted_3$x = {
   key: 0,
   class: "lupa-search-box-product-add-to-cart-section"
 };
-const _sfc_main$14 = /* @__PURE__ */ defineComponent({
+const _sfc_main$15 = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProduct",
   props: {
     item: {},
@@ -19466,7 +19469,7 @@ const _sfc_main$14 = /* @__PURE__ */ defineComponent({
           style: normalizeStyle(imageStyleOverride.value)
         }, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(imageElements.value, (element) => {
-            return openBlock(), createBlock(_sfc_main$1c, {
+            return openBlock(), createBlock(_sfc_main$1d, {
               class: "lupa-search-box-product-element",
               item: _ctx.item,
               element,
@@ -19479,7 +19482,7 @@ const _sfc_main$14 = /* @__PURE__ */ defineComponent({
         createBaseVNode("div", _hoisted_2$L, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(detailElements.value, (element) => {
             var _a;
-            return openBlock(), createBlock(_sfc_main$1c, {
+            return openBlock(), createBlock(_sfc_main$1d, {
               key: element.key,
               class: "lupa-search-box-product-element",
               item: _ctx.item,
@@ -19490,7 +19493,7 @@ const _sfc_main$14 = /* @__PURE__ */ defineComponent({
               badgeOptions.value && ((_a = badgeOptions.value) == null ? void 0 : _a.anchorElementKey) === element.key ? {
                 name: "badges",
                 fn: withCtx(() => [
-                  createVNode(_sfc_main$15, {
+                  createVNode(_sfc_main$16, {
                     options: badgeOptions.value,
                     position: "card"
                   }, null, 8, ["options"])
@@ -19500,8 +19503,8 @@ const _sfc_main$14 = /* @__PURE__ */ defineComponent({
             ]), 1032, ["item", "element", "labels", "link"]);
           }), 128))
         ]),
-        addToCartElement.value ? (openBlock(), createElementBlock("div", _hoisted_3$z, [
-          createVNode(_sfc_main$1c, {
+        addToCartElement.value ? (openBlock(), createElementBlock("div", _hoisted_3$x, [
+          createVNode(_sfc_main$1d, {
             class: "lupa-search-box-product-element",
             item: _ctx.item,
             element: addToCartElement.value,
@@ -19583,7 +19586,7 @@ const useTrackingStore = defineStore("tracking", () => {
   return { trackSearch, trackResults, trackEvent, trackDelayedEvent };
 });
 const _hoisted_1$Y = { id: "lupa-search-box-products" };
-const _sfc_main$13 = /* @__PURE__ */ defineComponent({
+const _sfc_main$14 = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProducts",
   props: {
     items: {},
@@ -19663,7 +19666,7 @@ const _sfc_main$13 = /* @__PURE__ */ defineComponent({
             itemClicked: handleProductClick
           });
         }), 128)) : (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(_ctx.items, (item, index) => {
-          return openBlock(), createBlock(_sfc_main$14, {
+          return openBlock(), createBlock(_sfc_main$15, {
             key: index,
             item,
             panelOptions: _ctx.panelOptions,
@@ -19680,7 +19683,7 @@ const _sfc_main$13 = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$X = { class: "lupa-search-box-documents-go-to-results-wrapper" };
 const _hoisted_2$K = { key: 0 };
-const _sfc_main$12 = /* @__PURE__ */ defineComponent({
+const _sfc_main$13 = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProductsGoToResultsButton",
   props: {
     options: {},
@@ -19790,7 +19793,7 @@ const processExtractionObject = (value = {}) => {
   }
   return parsedObject;
 };
-const _sfc_main$11 = /* @__PURE__ */ defineComponent({
+const _sfc_main$12 = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProductsWrapper",
   props: {
     panel: {},
@@ -19855,7 +19858,7 @@ const _sfc_main$11 = /* @__PURE__ */ defineComponent({
     watch(() => props.panel.limit, getItemsDebounced);
     return (_ctx, _cache) => {
       var _a, _b;
-      return openBlock(), createBlock(_sfc_main$13, {
+      return openBlock(), createBlock(_sfc_main$14, {
         items: (_b = (_a = searchResult.value) == null ? void 0 : _a.items) != null ? _b : [],
         panelOptions: _ctx.panel,
         labels: _ctx.labels,
@@ -19865,7 +19868,7 @@ const _sfc_main$11 = /* @__PURE__ */ defineComponent({
         default: withCtx(() => {
           var _a2;
           return [
-            showGoToResultsButton.value && ((_a2 = searchResult.value) == null ? void 0 : _a2.items.length) ? (openBlock(), createBlock(_sfc_main$12, {
+            showGoToResultsButton.value && ((_a2 = searchResult.value) == null ? void 0 : _a2.items.length) ? (openBlock(), createBlock(_sfc_main$13, {
               key: 0,
               options: _ctx.searchBoxOptions,
               panel: _ctx.panel,
@@ -19886,7 +19889,7 @@ const _sfc_main$11 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$10 = /* @__PURE__ */ defineComponent({
+const _sfc_main$11 = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxRelatedSourceWrapper",
   props: {
     panel: {},
@@ -19958,7 +19961,7 @@ const _sfc_main$10 = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       var _a, _b;
-      return openBlock(), createBlock(_sfc_main$13, {
+      return openBlock(), createBlock(_sfc_main$14, {
         items: (_b = (_a = searchResult.value) == null ? void 0 : _a.items) != null ? _b : [],
         panelOptions: documentPanelOptions.value,
         labels: _ctx.labels,
@@ -19981,11 +19984,11 @@ const _hoisted_1$W = {
   id: "lupa-search-box-panel"
 };
 const _hoisted_2$J = ["data-cy"];
-const _hoisted_3$y = {
+const _hoisted_3$w = {
   key: 0,
   class: "lupa-panel-title lupa-panel-title-top-results"
 };
-const _hoisted_4$p = {
+const _hoisted_4$o = {
   key: 1,
   class: "lupa-panel-title"
 };
@@ -19995,12 +19998,12 @@ const _hoisted_5$g = {
 };
 const __default__$2 = {
   components: {
-    SearchBoxSuggestionsWrapper: _sfc_main$1m,
-    SearchBoxProductsWrapper: _sfc_main$11,
-    SearchBoxRelatedSourceWrapper: _sfc_main$10
+    SearchBoxSuggestionsWrapper: _sfc_main$1n,
+    SearchBoxProductsWrapper: _sfc_main$12,
+    SearchBoxRelatedSourceWrapper: _sfc_main$11
   }
 };
-const _sfc_main$$ = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValues2({}, __default__$2), {
+const _sfc_main$10 = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValues2({}, __default__$2), {
   __name: "SearchBoxMainPanel",
   props: {
     options: {},
@@ -20177,8 +20180,8 @@ const _sfc_main$$ = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValue
                 style: normalizeStyle(panel.gridArea ? { gridArea: `${panel.gridArea}${index}` } : {}),
                 "data-cy": "lupa-panel-" + panel.type + "-index"
               }, [
-                ((_a = panel.labels) == null ? void 0 : _a.topResultsTitle) && showTopResultsPanelTitle(panel.queryKey) ? (openBlock(), createElementBlock("div", _hoisted_3$y, toDisplayString((_b = panel.labels) == null ? void 0 : _b.topResultsTitle), 1)) : createCommentVNode("", true),
-                ((_c = panel.labels) == null ? void 0 : _c.title) && showPanelTitle(panel) ? (openBlock(), createElementBlock("div", _hoisted_4$p, toDisplayString((_d = panel.labels) == null ? void 0 : _d.title), 1)) : createCommentVNode("", true),
+                ((_a = panel.labels) == null ? void 0 : _a.topResultsTitle) && showTopResultsPanelTitle(panel.queryKey) ? (openBlock(), createElementBlock("div", _hoisted_3$w, toDisplayString((_b = panel.labels) == null ? void 0 : _b.topResultsTitle), 1)) : createCommentVNode("", true),
+                ((_c = panel.labels) == null ? void 0 : _c.title) && showPanelTitle(panel) ? (openBlock(), createElementBlock("div", _hoisted_4$o, toDisplayString((_d = panel.labels) == null ? void 0 : _d.title), 1)) : createCommentVNode("", true),
                 panel.queryKey && canShowPanel(panel) ? (openBlock(), createBlock(resolveDynamicComponent(getComponent(panel.type)), {
                   key: 2,
                   panel,
@@ -20203,18 +20206,18 @@ const _sfc_main$$ = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValue
               ], 14, _hoisted_2$J);
             }), 128))
           ], 4),
-          !unref(hasAnyResults) && _ctx.options.showNoResultsPanel ? (openBlock(), createBlock(_sfc_main$1p, {
+          !unref(hasAnyResults) && _ctx.options.showNoResultsPanel ? (openBlock(), createBlock(_sfc_main$1q, {
             key: 1,
             labels: labels.value
           }, null, 8, ["labels"])) : createCommentVNode("", true),
-          unref(hasAnyResults) || !_ctx.options.hideMoreResultsButtonOnNoResults ? (openBlock(), createBlock(_sfc_main$1s, {
+          unref(hasAnyResults) || !_ctx.options.hideMoreResultsButtonOnNoResults ? (openBlock(), createBlock(_sfc_main$1t, {
             key: 2,
             labels: labels.value,
             options: _ctx.options,
             onGoToResults: _cache[4] || (_cache[4] = ($event) => _ctx.$emit("go-to-results"))
           }, null, 8, ["labels", "options"])) : createCommentVNode("", true)
         ])) : displayHistory.value ? (openBlock(), createElementBlock("div", _hoisted_5$g, [
-          createVNode(_sfc_main$1q, {
+          createVNode(_sfc_main$1r, {
             options: _ctx.options.history,
             history: history.value,
             onGoToResults: handleGoToResults,
@@ -20241,7 +20244,7 @@ const unbindSearchTriggers = (triggers = [], event) => {
 };
 const _hoisted_1$V = { id: "lupa-search-box" };
 const _hoisted_2$I = { class: "lupa-search-box-wrapper" };
-const _sfc_main$_ = /* @__PURE__ */ defineComponent({
+const _sfc_main$$ = /* @__PURE__ */ defineComponent({
   __name: "SearchBox",
   props: {
     options: {},
@@ -20511,7 +20514,7 @@ const _sfc_main$_ = /* @__PURE__ */ defineComponent({
       var _a2;
       return openBlock(), createElementBlock("div", _hoisted_1$V, [
         createBaseVNode("div", _hoisted_2$I, [
-          createVNode(_sfc_main$1t, {
+          createVNode(_sfc_main$1u, {
             options: inputOptions.value,
             suggestedValue: suggestedValue.value,
             "can-close": (_a2 = _ctx.isSearchContainer) != null ? _a2 : false,
@@ -20524,7 +20527,7 @@ const _sfc_main$_ = /* @__PURE__ */ defineComponent({
             onSearch: handleSearch,
             onClose: _cache[2] || (_cache[2] = ($event) => _ctx.$emit("close"))
           }, null, 8, ["options", "suggestedValue", "can-close", "emit-input-on-focus"]),
-          opened.value || _ctx.isSearchContainer ? (openBlock(), createBlock(_sfc_main$$, {
+          opened.value || _ctx.isSearchContainer ? (openBlock(), createBlock(_sfc_main$10, {
             key: 0,
             options: panelOptions.value,
             inputValue: inputValue.value,
@@ -20621,12 +20624,12 @@ const _hoisted_2$H = {
   key: 0,
   "data-cy": "suggested-search-text-label"
 };
-const _hoisted_3$x = {
+const _hoisted_3$v = {
   key: 1,
   "data-cy": "did-you-mean-label"
 };
-const _hoisted_4$o = { key: 1 };
-const _sfc_main$Z = /* @__PURE__ */ defineComponent({
+const _hoisted_4$n = { key: 1 };
+const _sfc_main$_ = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsDidYouMean",
   props: {
     labels: {}
@@ -20668,7 +20671,7 @@ const _sfc_main$Z = /* @__PURE__ */ defineComponent({
             ]);
           }), 128))
         ])) : createCommentVNode("", true),
-        didYouMeanValue.value ? (openBlock(), createElementBlock("div", _hoisted_3$x, [
+        didYouMeanValue.value ? (openBlock(), createElementBlock("div", _hoisted_3$v, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.labels.didYouMean.split(" "), (label, index) => {
             return openBlock(), createElementBlock("span", { key: index }, [
               label.includes("{1}") ? (openBlock(), createElementBlock("span", {
@@ -20676,7 +20679,7 @@ const _sfc_main$Z = /* @__PURE__ */ defineComponent({
                 class: "lupa-did-you-mean lupa-highlighted-search-text",
                 "data-cy": "did-you-mean-value",
                 onClick: _cache[0] || (_cache[0] = ($event) => goToResults({ searchText: didYouMeanValue.value }))
-              }, toDisplayString(didYouMeanValue.value) + " ", 1)) : (openBlock(), createElementBlock("span", _hoisted_4$o, toDisplayString(label) + " ", 1))
+              }, toDisplayString(didYouMeanValue.value) + " ", 1)) : (openBlock(), createElementBlock("span", _hoisted_4$n, toDisplayString(label) + " ", 1))
             ]);
           }), 128))
         ])) : createCommentVNode("", true)
@@ -20689,7 +20692,7 @@ const _hoisted_1$T = {
   class: "lupa-search-results-summary"
 };
 const _hoisted_2$G = ["innerHTML"];
-const _sfc_main$Y = /* @__PURE__ */ defineComponent({
+const _sfc_main$Z = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsSummary",
   props: {
     label: {},
@@ -20722,13 +20725,13 @@ const _hoisted_1$S = {
   "data-cy": "lupa-result-page-title"
 };
 const _hoisted_2$F = { key: 0 };
-const _hoisted_3$w = {
+const _hoisted_3$u = {
   key: 1,
   class: "lupa-results-total-count"
 };
-const _hoisted_4$n = { class: "lupa-results-total-count-number" };
+const _hoisted_4$m = { class: "lupa-results-total-count-number" };
 const _hoisted_5$f = ["innerHTML"];
-const _sfc_main$X = /* @__PURE__ */ defineComponent({
+const _sfc_main$Y = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsTitle",
   props: {
     options: {},
@@ -20774,13 +20777,13 @@ const _sfc_main$X = /* @__PURE__ */ defineComponent({
         showSearchTitle.value ? (openBlock(), createElementBlock("h1", _hoisted_1$S, [
           createTextVNode(toDisplayString(searchResultsTitleTemplate.value || _ctx.options.labels.searchResults), 1),
           queryText.value && !searchResultsTitleTemplate.value ? (openBlock(), createElementBlock("span", _hoisted_2$F, "'" + toDisplayString(queryText.value) + "'", 1)) : createCommentVNode("", true),
-          showProductCount.value ? (openBlock(), createElementBlock("span", _hoisted_3$w, [
+          showProductCount.value ? (openBlock(), createElementBlock("span", _hoisted_3$u, [
             createTextVNode("(" + toDisplayString(searchResultsCountLabel.value), 1),
-            createBaseVNode("span", _hoisted_4$n, toDisplayString(unref(totalItems)), 1),
+            createBaseVNode("span", _hoisted_4$m, toDisplayString(unref(totalItems)), 1),
             createTextVNode(")")
           ])) : createCommentVNode("", true)
         ])) : createCommentVNode("", true),
-        _ctx.showSummary ? (openBlock(), createBlock(_sfc_main$Y, {
+        _ctx.showSummary ? (openBlock(), createBlock(_sfc_main$Z, {
           key: 1,
           label: summaryLabel.value
         }, null, 8, ["label"])) : createCommentVNode("", true),
@@ -20793,16 +20796,15 @@ const _sfc_main$X = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$R = { class: "lupa-search-result-filter-value" };
-const _hoisted_2$E = {
+const _hoisted_1$R = {
   class: "lupa-current-filter-label",
   "data-cy": "lupa-current-filter-label"
 };
-const _hoisted_3$v = {
+const _hoisted_2$E = {
   class: "lupa-current-filter-value",
   "data-cy": "lupa-current-filter-value"
 };
-const _sfc_main$W = /* @__PURE__ */ defineComponent({
+const _sfc_main$X = /* @__PURE__ */ defineComponent({
   __name: "CurrentFilterDisplay",
   props: {
     filter: {}
@@ -20810,18 +20812,23 @@ const _sfc_main$W = /* @__PURE__ */ defineComponent({
   emits: ["remove"],
   setup(__props, { emit: emit2 }) {
     const props = __props;
+    const facetKeyClass = computed(() => {
+      return `lupa-facet-active-filter-${props.filter.key}`;
+    });
     const handleClick = () => {
       emit2("remove", { filter: props.filter });
     };
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$R, [
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["lupa-search-result-filter-value", { [facetKeyClass.value]: true }])
+      }, [
         createBaseVNode("div", {
           class: "lupa-current-filter-action",
           onClick: handleClick
         }, "⨉"),
-        createBaseVNode("div", _hoisted_2$E, toDisplayString(_ctx.filter.label) + ": ", 1),
-        createBaseVNode("div", _hoisted_3$v, toDisplayString(_ctx.filter.value), 1)
-      ]);
+        createBaseVNode("div", _hoisted_1$R, toDisplayString(_ctx.filter.label) + ": ", 1),
+        createBaseVNode("div", _hoisted_2$E, toDisplayString(_ctx.filter.value), 1)
+      ], 2);
     };
   }
 });
@@ -20830,12 +20837,12 @@ const _hoisted_2$D = {
   key: 0,
   class: "lupa-filter-count"
 };
-const _hoisted_3$u = {
+const _hoisted_3$t = {
   key: 0,
   class: "filter-values"
 };
-const _hoisted_4$m = { class: "lupa-current-filter-list" };
-const _sfc_main$V = /* @__PURE__ */ defineComponent({
+const _hoisted_4$l = { class: "lupa-current-filter-list" };
+const _sfc_main$W = /* @__PURE__ */ defineComponent({
   __name: "CurrentFilters",
   props: {
     options: {},
@@ -20917,10 +20924,10 @@ const _sfc_main$V = /* @__PURE__ */ defineComponent({
             class: normalizeClass(["lupa-filter-title-caret", isOpen.value && "open"])
           }, null, 2)) : createCommentVNode("", true)
         ]),
-        !_ctx.expandable || isOpen.value ? (openBlock(), createElementBlock("div", _hoisted_3$u, [
-          createBaseVNode("div", _hoisted_4$m, [
+        !_ctx.expandable || isOpen.value ? (openBlock(), createElementBlock("div", _hoisted_3$t, [
+          createBaseVNode("div", _hoisted_4$l, [
             (openBlock(true), createElementBlock(Fragment, null, renderList(currentDisplayFilters.value, (filter2) => {
-              return openBlock(), createBlock(_sfc_main$W, {
+              return openBlock(), createBlock(_sfc_main$X, {
                 key: filter2.key + "_" + filter2.value,
                 filter: filter2,
                 onRemove: handleRemove
@@ -20938,7 +20945,7 @@ const _sfc_main$V = /* @__PURE__ */ defineComponent({
   }
 });
 const _hoisted_1$P = ["href"];
-const _sfc_main$U = /* @__PURE__ */ defineComponent({
+const _sfc_main$V = /* @__PURE__ */ defineComponent({
   __name: "CategoryFilterItem",
   props: {
     options: {},
@@ -20985,10 +20992,10 @@ const _hoisted_1$O = {
   "data-cy": "lupa-category-filter"
 };
 const _hoisted_2$C = { class: "lupa-category-back" };
-const _hoisted_3$t = ["href"];
-const _hoisted_4$l = ["href"];
+const _hoisted_3$s = ["href"];
+const _hoisted_4$k = ["href"];
 const _hoisted_5$e = { class: "lupa-child-category-list" };
-const _sfc_main$T = /* @__PURE__ */ defineComponent({
+const _sfc_main$U = /* @__PURE__ */ defineComponent({
   __name: "CategoryFilter",
   props: {
     options: {}
@@ -21083,7 +21090,7 @@ const _sfc_main$T = /* @__PURE__ */ defineComponent({
             "data-cy": "lupa-category-back",
             href: backUrlLink.value,
             onClick: handleNavigationBack
-          }, toDisplayString(backTitle.value), 9, _hoisted_3$t)) : createCommentVNode("", true)
+          }, toDisplayString(backTitle.value), 9, _hoisted_3$s)) : createCommentVNode("", true)
         ]),
         createBaseVNode("div", {
           class: normalizeClass(["lupa-current-category", { "lupa-current-category-active": isActive }])
@@ -21093,11 +21100,11 @@ const _sfc_main$T = /* @__PURE__ */ defineComponent({
             href: parentUrlLink.value,
             class: normalizeClass({ "lupa-title-category": !hasBackButton.value }),
             onClick: handleNavigationParent
-          }, toDisplayString(parentTitle.value), 11, _hoisted_4$l)
+          }, toDisplayString(parentTitle.value), 11, _hoisted_4$k)
         ], 2),
         createBaseVNode("div", _hoisted_5$e, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(categoryChildren.value, (child) => {
-            return openBlock(), createBlock(_sfc_main$U, {
+            return openBlock(), createBlock(_sfc_main$V, {
               key: getCategoryKey(child),
               item: child,
               options: _ctx.options
@@ -21113,8 +21120,8 @@ const _hoisted_1$N = {
   "data-cy": "lupa-search-result-facet-term-values"
 };
 const _hoisted_2$B = ["placeholder"];
-const _hoisted_3$s = { class: "lupa-terms-list" };
-const _hoisted_4$k = ["onClick"];
+const _hoisted_3$r = { class: "lupa-terms-list" };
+const _hoisted_4$j = ["onClick"];
 const _hoisted_5$d = { class: "lupa-term-checkbox-wrapper" };
 const _hoisted_6$8 = { class: "lupa-term-checkbox-label" };
 const _hoisted_7$6 = { class: "lupa-term-label" };
@@ -21124,7 +21131,7 @@ const _hoisted_8$2 = {
 };
 const _hoisted_9$2 = { key: 0 };
 const _hoisted_10$1 = { key: 1 };
-const _sfc_main$S = /* @__PURE__ */ defineComponent({
+const _sfc_main$T = /* @__PURE__ */ defineComponent({
   __name: "TermFacet",
   props: {
     options: {},
@@ -21205,7 +21212,7 @@ const _sfc_main$S = /* @__PURE__ */ defineComponent({
         }, null, 8, _hoisted_2$B)), [
           [vModelText, termFilter.value]
         ]) : createCommentVNode("", true),
-        createBaseVNode("div", _hoisted_3$s, [
+        createBaseVNode("div", _hoisted_3$r, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(displayValues.value, (item) => {
             return openBlock(), createElementBlock("div", {
               class: normalizeClass(["lupa-facet-term", { checked: isChecked(item) }]),
@@ -21222,7 +21229,7 @@ const _sfc_main$S = /* @__PURE__ */ defineComponent({
                 createBaseVNode("span", _hoisted_7$6, toDisplayString(item.title), 1),
                 _ctx.options.showDocumentCount ? (openBlock(), createElementBlock("span", _hoisted_8$2, "(" + toDisplayString(item.count) + ")", 1)) : createCommentVNode("", true)
               ])
-            ], 10, _hoisted_4$k);
+            ], 10, _hoisted_4$j);
           }), 128))
         ]),
         displayShowMore.value ? (openBlock(), createElementBlock("div", {
@@ -22218,11 +22225,11 @@ const _hoisted_2$A = {
   key: 0,
   class: "lupa-stats-facet-summary"
 };
-const _hoisted_3$r = {
+const _hoisted_3$q = {
   key: 1,
   class: "lupa-stats-facet-summary-input"
 };
-const _hoisted_4$j = {
+const _hoisted_4$i = {
   key: 0,
   class: "lupa-stats-range-label"
 };
@@ -22241,7 +22248,7 @@ const _hoisted_13 = {
   key: 2,
   class: "lupa-stats-slider-wrapper"
 };
-const _sfc_main$R = /* @__PURE__ */ defineComponent({
+const _sfc_main$S = /* @__PURE__ */ defineComponent({
   __name: "StatsFacet",
   props: {
     options: {},
@@ -22419,9 +22426,9 @@ const _sfc_main$R = /* @__PURE__ */ defineComponent({
     };
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$M, [
-        !isInputVisible.value ? (openBlock(), createElementBlock("div", _hoisted_2$A, toDisplayString(statsSummary.value), 1)) : (openBlock(), createElementBlock("div", _hoisted_3$r, [
+        !isInputVisible.value ? (openBlock(), createElementBlock("div", _hoisted_2$A, toDisplayString(statsSummary.value), 1)) : (openBlock(), createElementBlock("div", _hoisted_3$q, [
           createBaseVNode("div", null, [
-            rangeLabelFrom.value ? (openBlock(), createElementBlock("div", _hoisted_4$j, toDisplayString(rangeLabelFrom.value), 1)) : createCommentVNode("", true),
+            rangeLabelFrom.value ? (openBlock(), createElementBlock("div", _hoisted_4$i, toDisplayString(rangeLabelFrom.value), 1)) : createCommentVNode("", true),
             createBaseVNode("div", _hoisted_5$c, [
               withDirectives(createBaseVNode("input", {
                 "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => fromValue.value = $event),
@@ -22487,8 +22494,8 @@ const _sfc_main$R = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$L = { class: "lupa-term-checkbox-wrapper" };
 const _hoisted_2$z = { class: "lupa-term-checkbox-label" };
-const _hoisted_3$q = { class: "lupa-term-label" };
-const _hoisted_4$i = {
+const _hoisted_3$p = { class: "lupa-term-label" };
+const _hoisted_4$h = {
   key: 0,
   class: "lupa-term-count"
 };
@@ -22496,7 +22503,7 @@ const _hoisted_5$b = {
   key: 0,
   class: "lupa-facet-level"
 };
-const _sfc_main$Q = /* @__PURE__ */ defineComponent({
+const _sfc_main$R = /* @__PURE__ */ defineComponent({
   __name: "HierarchyFacetLevel",
   props: {
     options: {},
@@ -22548,8 +22555,8 @@ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
             }, null, 2)
           ]),
           createBaseVNode("div", _hoisted_2$z, [
-            createBaseVNode("span", _hoisted_3$q, toDisplayString(_ctx.item.title) + toDisplayString(" "), 1),
-            _ctx.options.showDocumentCount ? (openBlock(), createElementBlock("span", _hoisted_4$i, "(" + toDisplayString(_ctx.item.count) + ")", 1)) : createCommentVNode("", true)
+            createBaseVNode("span", _hoisted_3$p, toDisplayString(_ctx.item.title) + toDisplayString(" "), 1),
+            _ctx.options.showDocumentCount ? (openBlock(), createElementBlock("span", _hoisted_4$h, "(" + toDisplayString(_ctx.item.count) + ")", 1)) : createCommentVNode("", true)
           ])
         ]),
         showChildren.value ? (openBlock(), createElementBlock("div", _hoisted_5$b, [
@@ -22573,8 +22580,8 @@ const _hoisted_1$K = {
   "data-cy": "lupa-search-result-facet-term-values"
 };
 const _hoisted_2$y = { key: 0 };
-const _hoisted_3$p = ["placeholder"];
-const _sfc_main$P = /* @__PURE__ */ defineComponent({
+const _hoisted_3$o = ["placeholder"];
+const _sfc_main$Q = /* @__PURE__ */ defineComponent({
   __name: "HierarchyFacet",
   props: {
     options: {},
@@ -22636,12 +22643,12 @@ const _sfc_main$P = /* @__PURE__ */ defineComponent({
             "data-cy": "lupa-term-filter",
             "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => termFilter.value = $event),
             placeholder: _ctx.options.labels.facetFilter
-          }, null, 8, _hoisted_3$p), [
+          }, null, 8, _hoisted_3$o), [
             [vModelText, termFilter.value]
           ])
         ])) : createCommentVNode("", true),
         (openBlock(true), createElementBlock(Fragment, null, renderList(displayValues.value, (item) => {
-          return openBlock(), createBlock(_sfc_main$Q, {
+          return openBlock(), createBlock(_sfc_main$R, {
             key: item.title,
             options: _ctx.options,
             item,
@@ -22673,12 +22680,12 @@ const _hoisted_2$x = {
 };
 const __default__$1 = {
   components: {
-    TermFacet: _sfc_main$S,
-    StatsFacet: _sfc_main$R,
-    HierarchyFacet: _sfc_main$P
+    TermFacet: _sfc_main$T,
+    StatsFacet: _sfc_main$S,
+    HierarchyFacet: _sfc_main$Q
   }
 };
-const _sfc_main$O = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValues2({}, __default__$1), {
+const _sfc_main$P = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValues2({}, __default__$1), {
   __name: "FacetDisplay",
   props: {
     options: {},
@@ -22735,6 +22742,9 @@ const _sfc_main$O = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValue
       var _a2;
       return ((_a2 = currentFilterKeys.value) != null ? _a2 : []).join(",");
     });
+    const facetKeyClass = computed(() => {
+      return `lupa-facet-${facet.value.key}`;
+    });
     onMounted(() => {
       var _a2;
       if (((_a2 = props.options.style) == null ? void 0 : _a2.type) === "top-dropdown") {
@@ -22786,7 +22796,7 @@ const _sfc_main$O = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValue
         "data-cy": "lupa-search-result-facet-display"
       }, [
         createBaseVNode("div", {
-          class: normalizeClass(["lupa-search-result-facet-label", { open: isOpen.value, "lupa-has-filter": hasFilter.value }]),
+          class: normalizeClass(["lupa-search-result-facet-label", { open: isOpen.value, "lupa-has-filter": hasFilter.value, [facetKeyClass.value]: true }]),
           "data-cy": "lupa-search-result-facet-label",
           onClick: toggleFacet
         }, [
@@ -22818,7 +22828,7 @@ const _hoisted_2$w = {
   key: 0,
   class: "lupa-facets-title"
 };
-const _sfc_main$N = /* @__PURE__ */ defineComponent({
+const _sfc_main$O = /* @__PURE__ */ defineComponent({
   __name: "FacetList",
   props: {
     options: {},
@@ -22859,7 +22869,7 @@ const _sfc_main$N = /* @__PURE__ */ defineComponent({
         }, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(displayFacets.value, (facet) => {
             var _a2;
-            return openBlock(), createBlock(_sfc_main$O, {
+            return openBlock(), createBlock(_sfc_main$P, {
               key: facet.key,
               facet,
               currentFilters: currentFiltersValue.value,
@@ -22875,7 +22885,7 @@ const _sfc_main$N = /* @__PURE__ */ defineComponent({
   }
 });
 const _hoisted_1$H = ["onClick"];
-const _sfc_main$M = /* @__PURE__ */ defineComponent({
+const _sfc_main$N = /* @__PURE__ */ defineComponent({
   __name: "FacetsButton",
   props: {
     options: {}
@@ -22901,7 +22911,7 @@ const _sfc_main$M = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$G = { class: "lupa-search-result-facets" };
 const _hoisted_2$v = { class: "lupa-facets-filter-button-wrapper" };
-const _sfc_main$L = /* @__PURE__ */ defineComponent({
+const _sfc_main$M = /* @__PURE__ */ defineComponent({
   __name: "Facets",
   props: {
     options: {},
@@ -22985,7 +22995,7 @@ const _sfc_main$L = /* @__PURE__ */ defineComponent({
     };
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$G, [
-        regularFacets.value ? (openBlock(), createBlock(_sfc_main$N, {
+        regularFacets.value ? (openBlock(), createBlock(_sfc_main$O, {
           key: 0,
           options: _ctx.options,
           facets: regularFacets.value,
@@ -22996,7 +23006,7 @@ const _sfc_main$L = /* @__PURE__ */ defineComponent({
           onClear: clear2
         }, null, 8, ["options", "facets", "currentFilters", "facetStyle", "clearable"])) : createCommentVNode("", true),
         createBaseVNode("div", _hoisted_2$v, [
-          showFilterButton.value ? (openBlock(), createBlock(_sfc_main$M, {
+          showFilterButton.value ? (openBlock(), createBlock(_sfc_main$N, {
             key: 0,
             options: _ctx.options,
             onFilter: filter2
@@ -23010,7 +23020,7 @@ const _hoisted_1$F = {
   id: "lupa-search-result-filters",
   class: "lupa-search-result-filters"
 };
-const _sfc_main$K = /* @__PURE__ */ defineComponent({
+const _sfc_main$L = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsFilters",
   props: {
     options: {},
@@ -23044,18 +23054,18 @@ const _sfc_main$K = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       var _a;
       return openBlock(), createElementBlock("div", _hoisted_1$F, [
-        showCurrentFilters.value ? (openBlock(), createBlock(_sfc_main$V, {
+        showCurrentFilters.value ? (openBlock(), createBlock(_sfc_main$W, {
           key: 0,
           options: _ctx.options.currentFilters,
           expandable: (_a = _ctx.expandable) != null ? _a : false
         }, null, 8, ["options", "expandable"])) : createCommentVNode("", true),
-        _ctx.options.categories ? (openBlock(), createBlock(_sfc_main$T, {
+        _ctx.options.categories ? (openBlock(), createBlock(_sfc_main$U, {
           key: 1,
           options: _ctx.options.categories,
           ref_key: "categoryFilters",
           ref: categoryFilters
         }, null, 8, ["options"])) : createCommentVNode("", true),
-        _ctx.options.facets ? (openBlock(), createBlock(_sfc_main$L, {
+        _ctx.options.facets ? (openBlock(), createBlock(_sfc_main$M, {
           key: 2,
           options: _ctx.options.facets,
           onFilter: filter2
@@ -23069,15 +23079,15 @@ const _hoisted_1$E = {
   class: "lupa-mobile-filter-sidebar"
 };
 const _hoisted_2$u = ["onClick"];
-const _hoisted_3$o = { class: "lupa-mobile-sidebar-content" };
-const _hoisted_4$h = { class: "lupa-sidebar-top" };
+const _hoisted_3$n = { class: "lupa-mobile-sidebar-content" };
+const _hoisted_4$g = { class: "lupa-sidebar-top" };
 const _hoisted_5$a = { class: "lupa-sidebar-title" };
 const _hoisted_6$6 = {
   key: 0,
   class: "lupa-sidebar-filter-count"
 };
 const _hoisted_7$4 = { class: "lupa-sidebar-filter-options" };
-const _sfc_main$J = /* @__PURE__ */ defineComponent({
+const _sfc_main$K = /* @__PURE__ */ defineComponent({
   __name: "MobileFilterSidebar",
   props: {
     options: {}
@@ -23113,8 +23123,8 @@ const _sfc_main$J = /* @__PURE__ */ defineComponent({
           class: "lupa-sidebar-close",
           onClick: withModifiers(handleMobileToggle, ["stop"])
         }, null, 8, _hoisted_2$u),
-        createBaseVNode("div", _hoisted_3$o, [
-          createBaseVNode("div", _hoisted_4$h, [
+        createBaseVNode("div", _hoisted_3$n, [
+          createBaseVNode("div", _hoisted_4$g, [
             createBaseVNode("div", _hoisted_5$a, [
               createTextVNode(toDisplayString(sidebarTitle.value) + " ", 1),
               isFilterCountVisible.value ? (openBlock(), createElementBlock("span", _hoisted_6$6, toDisplayString(unref(currentFilterCount)), 1)) : createCommentVNode("", true)
@@ -23125,7 +23135,7 @@ const _sfc_main$J = /* @__PURE__ */ defineComponent({
             })
           ]),
           createBaseVNode("div", _hoisted_7$4, [
-            createVNode(_sfc_main$K, {
+            createVNode(_sfc_main$L, {
               options: _ctx.options,
               expandable: isActiveFiltersExpanded.value,
               onFilter: filter2
@@ -23138,12 +23148,12 @@ const _sfc_main$J = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$D = { id: "lupa-search-results-breadcrumbs" };
 const _hoisted_2$t = ["href", "onClick"];
-const _hoisted_3$n = {
+const _hoisted_3$m = {
   key: 1,
   class: "lupa-search-results-breadcrumb-text"
 };
-const _hoisted_4$g = { key: 2 };
-const _sfc_main$I = /* @__PURE__ */ defineComponent({
+const _hoisted_4$f = { key: 2 };
+const _sfc_main$J = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsBreadcrumbs",
   props: {
     breadcrumbs: {}
@@ -23182,8 +23192,8 @@ const _sfc_main$I = /* @__PURE__ */ defineComponent({
                 var _a;
                 return handleNavigation(e2, (_a = breadcrumb == null ? void 0 : breadcrumb.link) != null ? _a : "");
               }
-            }, toDisplayString(getLabel(breadcrumb.label)), 9, _hoisted_2$t)) : (openBlock(), createElementBlock("span", _hoisted_3$n, toDisplayString(getLabel(breadcrumb.label)), 1)),
-            index < breadcrumbsValue.value.length - 1 ? (openBlock(), createElementBlock("span", _hoisted_4$g, " / ")) : createCommentVNode("", true)
+            }, toDisplayString(getLabel(breadcrumb.label)), 9, _hoisted_2$t)) : (openBlock(), createElementBlock("span", _hoisted_3$m, toDisplayString(getLabel(breadcrumb.label)), 1)),
+            index < breadcrumbsValue.value.length - 1 ? (openBlock(), createElementBlock("span", _hoisted_4$f, " / ")) : createCommentVNode("", true)
           ]);
         }), 128))
       ]);
@@ -23194,7 +23204,7 @@ const _hoisted_1$C = {
   id: "lupa-search-result-filters",
   class: "lupa-search-result-filters lupa-search-result-top-filters"
 };
-const _sfc_main$H = /* @__PURE__ */ defineComponent({
+const _sfc_main$I = /* @__PURE__ */ defineComponent({
   __name: "FiltersTopDropdown",
   props: {
     options: {}
@@ -23207,7 +23217,7 @@ const _sfc_main$H = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       var _a;
       return openBlock(), createElementBlock("div", _hoisted_1$C, [
-        _ctx.options.facets ? (openBlock(), createBlock(_sfc_main$L, {
+        _ctx.options.facets ? (openBlock(), createBlock(_sfc_main$M, {
           key: 0,
           options: _ctx.options.facets,
           "facet-style": (_a = _ctx.options.facets.style) == null ? void 0 : _a.type,
@@ -23219,7 +23229,7 @@ const _sfc_main$H = /* @__PURE__ */ defineComponent({
   }
 });
 const _hoisted_1$B = { id: "lupa-search-results-layout-selection" };
-const _sfc_main$G = /* @__PURE__ */ defineComponent({
+const _sfc_main$H = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsLayoutSelection",
   setup(__props) {
     const searchResultStore = useSearchResultStore();
@@ -23256,7 +23266,7 @@ const _hoisted_1$A = {
   key: 0,
   class: "lupa-mobile-toggle-filter-count"
 };
-const _sfc_main$F = /* @__PURE__ */ defineComponent({
+const _sfc_main$G = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsMobileToggle",
   props: {
     label: {},
@@ -23264,13 +23274,28 @@ const _sfc_main$F = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     const searchResultStore = useSearchResultStore();
+    const optionsStore = useOptionsStore();
     const { currentFilterCount } = storeToRefs(searchResultStore);
+    const { searchResultOptions } = storeToRefs(optionsStore);
+    const disableMobileBodyScrollLock = computed(
+      () => {
+        var _a, _b, _c;
+        return (_c = (_b = (_a = searchResultOptions.value.filters) == null ? void 0 : _a.facets) == null ? void 0 : _b.disableMobileBodyScrollLock) != null ? _c : false;
+      }
+    );
     const handleMobileToggle = () => {
-      searchResultStore.setSidebarState({ visible: true });
+      searchResultStore.setSidebarState({
+        visible: true,
+        disableBodyScrolling: !disableMobileBodyScrollLock.value
+      });
     };
+    const hasActiveFilters = computed(() => currentFilterCount.value > 0);
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
-        class: normalizeClass(["lupa-mobile-toggle", { "lupa-mobile-toggle-filters-empty": unref(currentFilterCount) < 1 }]),
+        class: normalizeClass(["lupa-mobile-toggle", {
+          "lupa-mobile-toggle-filters-empty": unref(currentFilterCount) < 1,
+          "lupa-mobile-toggle-has-filters": hasActiveFilters.value
+        }]),
         onClick: handleMobileToggle
       }, [
         createTextVNode(toDisplayString(_ctx.label) + " ", 1),
@@ -23279,6 +23304,26 @@ const _sfc_main$F = /* @__PURE__ */ defineComponent({
     };
   }
 });
+const _sfc_main$F = /* @__PURE__ */ defineComponent({
+  __name: "SearchResultsMobileFilterClose",
+  props: {
+    label: {}
+  },
+  setup(__props) {
+    const searchResultStore = useSearchResultStore();
+    const handleMobileToggle = () => {
+      searchResultStore.setSidebarState({
+        visible: false
+      });
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: "lupa-mobile-filter-close-toggle",
+        onClick: handleMobileToggle
+      }, toDisplayString(_ctx.label), 1);
+    };
+  }
+});
 const _hoisted_1$z = {
   key: 0,
   id: "lupa-search-results-page-select",
@@ -23288,8 +23333,8 @@ const _hoisted_2$s = {
   key: 0,
   class: "lupa-page-number-separator"
 };
-const _hoisted_3$m = ["onClick"];
-const _hoisted_4$f = {
+const _hoisted_3$l = ["onClick"];
+const _hoisted_4$e = {
   key: 0,
   class: "lupa-page-number-separator"
 };
@@ -23392,10 +23437,10 @@ const _sfc_main$E = /* @__PURE__ */ defineComponent({
               page === _ctx.options.selectedPage ? "lupa-page-number-selected" : ""
             ]),
             "data-cy": "lupa-page-number"
-          }, toDisplayString(page), 11, _hoisted_3$m);
+          }, toDisplayString(page), 11, _hoisted_3$l);
         }), 128)),
         showLastPage.value ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [
-          showLastPageSeparator.value ? (openBlock(), createElementBlock("div", _hoisted_4$f, "...")) : createCommentVNode("", true),
+          showLastPageSeparator.value ? (openBlock(), createElementBlock("div", _hoisted_4$e, "...")) : createCommentVNode("", true),
           createBaseVNode("div", {
             class: "lupa-page-number lupa-page-number-last",
             onClick: _cache[2] || (_cache[2] = () => {
@@ -23419,8 +23464,8 @@ const _hoisted_1$y = {
   "data-cy": "lupa-search-results-page-size"
 };
 const _hoisted_2$r = { id: "lupa-select" };
-const _hoisted_3$l = { class: "lupa-select-label" };
-const _hoisted_4$e = ["aria-label"];
+const _hoisted_3$k = { class: "lupa-select-label" };
+const _hoisted_4$d = ["aria-label"];
 const _hoisted_5$9 = ["value"];
 const _sfc_main$D = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsPageSize",
@@ -23452,7 +23497,7 @@ const _sfc_main$D = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$y, [
         createBaseVNode("div", _hoisted_2$r, [
-          createBaseVNode("label", _hoisted_3$l, toDisplayString(label.value), 1),
+          createBaseVNode("label", _hoisted_3$k, toDisplayString(label.value), 1),
           createBaseVNode("select", {
             class: "lupa-select-dropdown",
             "aria-label": label.value,
@@ -23467,7 +23512,7 @@ const _sfc_main$D = /* @__PURE__ */ defineComponent({
                 value: option
               }, toDisplayString(prefixLabel.value) + toDisplayString(option), 9, _hoisted_5$9);
             }), 128))
-          ], 40, _hoisted_4$e)
+          ], 40, _hoisted_4$d)
         ])
       ]);
     };
@@ -23478,8 +23523,8 @@ const _hoisted_1$x = {
   class: "lupa-search-results-sort"
 };
 const _hoisted_2$q = { id: "lupa-select" };
-const _hoisted_3$k = { class: "lupa-select-label" };
-const _hoisted_4$d = ["aria-label"];
+const _hoisted_3$j = { class: "lupa-select-label" };
+const _hoisted_4$c = ["aria-label"];
 const _hoisted_5$8 = ["value"];
 const _sfc_main$C = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsSort",
@@ -23532,7 +23577,7 @@ const _sfc_main$C = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$x, [
         createBaseVNode("div", _hoisted_2$q, [
-          createBaseVNode("label", _hoisted_3$k, toDisplayString(_ctx.options.label), 1),
+          createBaseVNode("label", _hoisted_3$j, toDisplayString(_ctx.options.label), 1),
           withDirectives(createBaseVNode("select", {
             class: "lupa-select-dropdown",
             "aria-label": _ctx.options.label,
@@ -23547,7 +23592,7 @@ const _sfc_main$C = /* @__PURE__ */ defineComponent({
                 value: option.key
               }, toDisplayString(option.label), 9, _hoisted_5$8);
             }), 128))
-          ], 40, _hoisted_4$d), [
+          ], 40, _hoisted_4$c), [
             [vModelSelect, selectedKey.value]
           ])
         ])
@@ -23560,8 +23605,8 @@ const _hoisted_2$p = {
   key: 0,
   class: "lupa-toolbar-right-title"
 };
-const _hoisted_3$j = { key: 2 };
-const _hoisted_4$c = { key: 4 };
+const _hoisted_3$i = { key: 2 };
+const _hoisted_4$b = { key: 4 };
 const _hoisted_5$7 = { key: 6 };
 const _hoisted_6$5 = { class: "lupa-toolbar-right" };
 const _hoisted_7$3 = {
@@ -23586,7 +23631,7 @@ const _sfc_main$B = /* @__PURE__ */ defineComponent({
     const searchResultStore = useSearchResultStore();
     const optionsStore = useOptionsStore();
     const { page, limit } = storeToRefs(paramStore);
-    const { hasAnyFilter, searchResult } = storeToRefs(searchResultStore);
+    const { hasAnyFilter, searchResult, isMobileSidebarVisible } = storeToRefs(searchResultStore);
     const { currentResolutionPageSizes } = storeToRefs(optionsStore);
     const isBottomLocation = computed(() => {
       return props.paginationLocation === "bottom";
@@ -23603,6 +23648,10 @@ const _sfc_main$B = /* @__PURE__ */ defineComponent({
       var _a;
       return isBottomLocation.value ? false : Boolean((_a = optionsValue.value.toolbar) == null ? void 0 : _a.layoutSelector);
     });
+    const showFiltersCloseButton = computed(() => {
+      var _a;
+      return isBottomLocation.value ? false : Boolean((_a = optionsValue.value.toolbar) == null ? void 0 : _a.filtersCloseButton);
+    });
     const sortOptions = computed(() => {
       var _a, _b;
       if (isBottomLocation.value || !((_a = optionsValue.value.sort) == null ? void 0 : _a.length)) {
@@ -23679,13 +23728,13 @@ const _sfc_main$B = /* @__PURE__ */ defineComponent({
       }, [
         createBaseVNode("div", _hoisted_1$w, [
           toolbarLeftLabel.value ? (openBlock(), createElementBlock("div", _hoisted_2$p, toDisplayString(toolbarLeftLabel.value), 1)) : createCommentVNode("", true),
-          showLayoutSelection.value ? (openBlock(), createBlock(_sfc_main$G, { key: 1 })) : (openBlock(), createElementBlock("div", _hoisted_3$j)),
-          showItemSummary.value ? (openBlock(), createBlock(_sfc_main$Y, {
+          showLayoutSelection.value ? (openBlock(), createBlock(_sfc_main$H, { key: 1 })) : (openBlock(), createElementBlock("div", _hoisted_3$i)),
+          showItemSummary.value ? (openBlock(), createBlock(_sfc_main$Z, {
             key: 3,
             label: searchSummaryLabel.value,
             clearable: unref(hasAnyFilter) && showFilterClear.value,
             onClear: handleClearAll
-          }, null, 8, ["label", "clearable"])) : (openBlock(), createElementBlock("div", _hoisted_4$c)),
+          }, null, 8, ["label", "clearable"])) : (openBlock(), createElementBlock("div", _hoisted_4$b)),
           displayPageSelect.value ? (openBlock(), createBlock(_sfc_main$E, {
             key: 5,
             options: paginationOptions.value.pageSelect,
@@ -23695,7 +23744,7 @@ const _sfc_main$B = /* @__PURE__ */ defineComponent({
         ]),
         createBaseVNode("div", _hoisted_6$5, [
           toolbarRightLabel.value ? (openBlock(), createElementBlock("div", _hoisted_7$3, toDisplayString(toolbarRightLabel.value), 1)) : createCommentVNode("", true),
-          createVNode(_sfc_main$F, {
+          createVNode(_sfc_main$G, {
             label: optionsValue.value.labels.mobileFilterButton,
             "show-filter-count": showMobileFilterCount.value
           }, null, 8, ["label", "show-filter-count"]),
@@ -23708,7 +23757,11 @@ const _sfc_main$B = /* @__PURE__ */ defineComponent({
             key: 3,
             options: sortOptions.value,
             callbacks: callbacks.value
-          }, null, 8, ["options", "callbacks"])) : (openBlock(), createElementBlock("div", _hoisted_9))
+          }, null, 8, ["options", "callbacks"])) : (openBlock(), createElementBlock("div", _hoisted_9)),
+          showFiltersCloseButton.value && unref(isMobileSidebarVisible) ? (openBlock(), createBlock(_sfc_main$F, {
+            key: 5,
+            label: optionsValue.value.labels.mobileFilterCloseButton
+          }, null, 8, ["label"])) : createCommentVNode("", true)
         ])
       ], 2);
     };
@@ -23722,7 +23775,7 @@ const _sfc_main$A = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     return (_ctx, _cache) => {
-      return openBlock(), createBlock(_sfc_main$1l, {
+      return openBlock(), createBlock(_sfc_main$1m, {
         item: _ctx.item,
         options: _ctx.options,
         "wrapper-class": "lupa-search-results-image-wrapper",
@@ -23733,8 +23786,8 @@ const _sfc_main$A = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$v = ["title", "innerHTML"];
 const _hoisted_2$o = ["title"];
-const _hoisted_3$i = ["href", "innerHTML"];
-const _hoisted_4$b = ["title"];
+const _hoisted_3$h = ["href", "innerHTML"];
+const _hoisted_4$a = ["title"];
 const _hoisted_5$6 = {
   key: 0,
   class: "lupa-search-results-product-title-text"
@@ -23788,7 +23841,7 @@ const _sfc_main$z = /* @__PURE__ */ defineComponent({
           class: "lupa-search-results-product-title-text lupa-title-link",
           innerHTML: sanitizedTitle.value,
           onClick: handleNavigation
-        }, null, 8, _hoisted_3$i)
+        }, null, 8, _hoisted_3$h)
       ], 12, _hoisted_2$o)) : (openBlock(), createElementBlock("div", {
         key: 2,
         class: "lupa-search-results-product-title",
@@ -23802,7 +23855,7 @@ const _sfc_main$z = /* @__PURE__ */ defineComponent({
           class: "lupa-search-results-product-title-text lupa-title-link",
           onClick: handleNavigation
         }, toDisplayString(title.value), 9, _hoisted_6$4)) : createCommentVNode("", true)
-      ], 12, _hoisted_4$b));
+      ], 12, _hoisted_4$a));
     };
   }
 });
@@ -23844,8 +23897,8 @@ const _sfc_main$y = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$t = { id: "lupa-search-results-rating" };
 const _hoisted_2$n = { class: "lupa-ratings" };
-const _hoisted_3$h = { class: "lupa-ratings-base" };
-const _hoisted_4$a = ["innerHTML"];
+const _hoisted_3$g = { class: "lupa-ratings-base" };
+const _hoisted_4$9 = ["innerHTML"];
 const _hoisted_5$5 = { class: "lupa-rating-wrapper" };
 const _hoisted_6$3 = ["innerHTML"];
 const _hoisted_7$2 = ["href"];
@@ -23889,13 +23942,13 @@ const _sfc_main$x = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$t, [
         createBaseVNode("div", _hoisted_2$n, [
-          createBaseVNode("div", _hoisted_3$h, [
+          createBaseVNode("div", _hoisted_3$g, [
             (openBlock(true), createElementBlock(Fragment, null, renderList(baseStars.value, (star, index) => {
               return openBlock(), createElementBlock("div", {
                 key: index,
                 innerHTML: star,
                 class: "lupa-rating lupa-rating-not-highlighted"
-              }, null, 8, _hoisted_4$a);
+              }, null, 8, _hoisted_4$9);
             }), 128))
           ]),
           createBaseVNode("div", _hoisted_5$5, [
@@ -23979,7 +24032,7 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$r = { class: "lupa-search-results-add-to-cart-wrapper" };
 const _hoisted_2$m = { class: "lupa-search-results-product-addtocart" };
-const _hoisted_3$g = ["id", "disabled", "onClick"];
+const _hoisted_3$f = ["id", "disabled", "onClick"];
 const _sfc_main$u = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsProductAddToCart",
   props: {
@@ -24028,7 +24081,7 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
             disabled: !inStockValue.value || loading.value
           }, _ctx.dynamicAttributes, {
             onClick: withModifiers(handleClick, ["stop"])
-          }), toDisplayString(label.value), 17, _hoisted_3$g)
+          }), toDisplayString(label.value), 17, _hoisted_3$f)
         ])
       ]);
     };
@@ -24036,8 +24089,8 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$q = ["innerHTML"];
 const _hoisted_2$l = { key: 0 };
-const _hoisted_3$f = { key: 1 };
-const _hoisted_4$9 = { class: "lupa-search-box-custom-label" };
+const _hoisted_3$e = { key: 1 };
+const _hoisted_4$8 = { class: "lupa-search-box-custom-label" };
 const _hoisted_5$4 = { class: "lupa-search-box-custom-text" };
 const _sfc_main$t = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsProductCustom",
@@ -24081,8 +24134,8 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
         key: 1,
         class: className.value
       }, toHandlers(_ctx.options.action ? { click: handleClick } : {}, true)), [
-        !label.value ? (openBlock(), createElementBlock("div", _hoisted_2$l, toDisplayString(text.value), 1)) : (openBlock(), createElementBlock("div", _hoisted_3$f, [
-          createBaseVNode("div", _hoisted_4$9, toDisplayString(label.value), 1),
+        !label.value ? (openBlock(), createElementBlock("div", _hoisted_2$l, toDisplayString(text.value), 1)) : (openBlock(), createElementBlock("div", _hoisted_3$e, [
+          createBaseVNode("div", _hoisted_4$8, toDisplayString(label.value), 1),
           createBaseVNode("div", _hoisted_5$4, toDisplayString(text.value), 1)
         ]))
       ], 16));
@@ -24127,8 +24180,8 @@ const _sfc_main$s = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$o = { id: "lupa-search-results-rating" };
 const _hoisted_2$k = ["innerHTML"];
-const _hoisted_3$e = { class: "lupa-ratings" };
-const _hoisted_4$8 = ["href"];
+const _hoisted_3$d = { class: "lupa-ratings" };
+const _hoisted_4$7 = ["href"];
 const _sfc_main$r = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsProductSingleStarRating",
   props: {
@@ -24162,11 +24215,11 @@ const _sfc_main$r = /* @__PURE__ */ defineComponent({
           innerHTML: star.value,
           class: "lupa-rating lupa-rating-highlighted"
         }, null, 8, _hoisted_2$k),
-        createBaseVNode("div", _hoisted_3$e, toDisplayString(rating.value), 1),
+        createBaseVNode("div", _hoisted_3$d, toDisplayString(rating.value), 1),
         createBaseVNode("a", {
           href: ratingLink.value,
           class: "lupa-total-ratings"
-        }, toDisplayString(totalRatings.value), 9, _hoisted_4$8)
+        }, toDisplayString(totalRatings.value), 9, _hoisted_4$7)
       ]);
     };
   }
@@ -24269,11 +24322,11 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValue
 }));
 const _hoisted_1$n = ["onMouseup"];
 const _hoisted_2$j = ["href"];
-const _hoisted_3$d = {
+const _hoisted_3$c = {
   key: 0,
   class: "lupa-out-of-stock"
 };
-const _hoisted_4$7 = { class: "lupa-search-result-product-details-section" };
+const _hoisted_4$6 = { class: "lupa-search-result-product-details-section" };
 const _sfc_main$p = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsProductCard",
   props: {
@@ -24282,7 +24335,8 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
     isAdditionalPanel: { type: Boolean },
     clickTrackingSettings: {},
     lupaClickTrackingType: {},
-    sourceItemId: {}
+    sourceItemId: {},
+    analyticsMetadata: {}
   },
   setup(__props) {
     const props = __props;
@@ -24393,7 +24447,8 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
           },
           options: { allowEmptySearchQuery: true },
           filters: searchResultStore.hasAnyFilter ? searchResultStore.filters : void 0,
-          sourceItemId: props.lupaClickTrackingType === "recommendedItemClick" ? props.sourceItemId : void 0
+          sourceItemId: props.lupaClickTrackingType === "recommendedItemClick" ? props.sourceItemId : void 0,
+          metadata: props.analyticsMetadata
         }
       };
       if (isDelayedClickTracking()) {
@@ -24437,7 +24492,7 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
         onClick: handleClick,
         onMouseup: withModifiers(handleClick, ["middle", "exact"])
       }), [
-        createVNode(_sfc_main$15, { options: badgesOptions.value }, null, 8, ["options"]),
+        createVNode(_sfc_main$16, { options: badgesOptions.value }, null, 8, ["options"]),
         createBaseVNode("div", {
           class: normalizeClass(["lupa-search-result-product-contents", listLayoutClass.value])
         }, [
@@ -24458,14 +24513,14 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
                 onProductEvent: handleProductEvent
               }, null, 8, ["item", "element", "labels", "inStock", "link"]);
             }), 128)),
-            createVNode(_sfc_main$15, {
+            createVNode(_sfc_main$16, {
               options: badgesOptions.value,
               position: "image",
               class: "lupa-image-badges"
             }, null, 8, ["options"]),
-            ((_a = labels.value) == null ? void 0 : _a.outOfStock) && !isInStock.value ? (openBlock(), createElementBlock("div", _hoisted_3$d, toDisplayString(labels.value.outOfStock), 1)) : createCommentVNode("", true)
+            ((_a = labels.value) == null ? void 0 : _a.outOfStock) && !isInStock.value ? (openBlock(), createElementBlock("div", _hoisted_3$c, toDisplayString(labels.value.outOfStock), 1)) : createCommentVNode("", true)
           ], 8, _hoisted_2$j),
-          createBaseVNode("div", _hoisted_4$7, [
+          createBaseVNode("div", _hoisted_4$6, [
             (openBlock(true), createElementBlock(Fragment, null, renderList(detailElements.value, (element) => {
               return openBlock(), createBlock(_sfc_main$q, {
                 class: "lupa-search-results-product-element",
@@ -24508,11 +24563,11 @@ const _hoisted_1$m = {
   "data-cy": "lupa-search-results-similar-queries"
 };
 const _hoisted_2$i = { class: "lupa-similar-queries-label" };
-const _hoisted_3$c = {
+const _hoisted_3$b = {
   class: "lupa-similar-query-label",
   "data-cy": "lupa-similar-query-label"
 };
-const _hoisted_4$6 = ["onClick"];
+const _hoisted_4$5 = ["onClick"];
 const _hoisted_5$3 = ["innerHTML"];
 const _hoisted_6$2 = { key: 0 };
 const _hoisted_7$1 = {
@@ -24548,12 +24603,20 @@ const _sfc_main$o = /* @__PURE__ */ defineComponent({
     }) => {
       paramsStore.goToResults({ searchText, facet });
     };
+    const getClickMetadata = (similarQuery) => {
+      var _a;
+      const isRegularSimilarQuery = (_a = similarQuery.displayQuery) == null ? void 0 : _a.includes("<del>");
+      return {
+        _lupaEventSource: isRegularSimilarQuery ? "similarQueries" : "similarQueriesAI",
+        _lupaUpdatedQuery: similarQuery.query
+      };
+    };
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$m, [
         createBaseVNode("div", _hoisted_2$i, toDisplayString(_ctx.labels.similarQueries), 1),
         (openBlock(true), createElementBlock(Fragment, null, renderList(similarQueries.value, (similarQuery, index) => {
           return openBlock(), createElementBlock("div", { key: index }, [
-            createBaseVNode("div", _hoisted_3$c, [
+            createBaseVNode("div", _hoisted_3$b, [
               createBaseVNode("span", null, toDisplayString(similarQueryLabel.value), 1),
               createBaseVNode("span", {
                 id: "lupa-similar-query-text-component",
@@ -24565,7 +24628,7 @@ const _sfc_main$o = /* @__PURE__ */ defineComponent({
                   innerHTML: getSimilarQueryContent(similarQuery.displayQuery)
                 }, null, 8, _hoisted_5$3),
                 similarQuery.count ? (openBlock(), createElementBlock("span", _hoisted_6$2, " (" + toDisplayString(similarQuery.count) + ")", 1)) : createCommentVNode("", true)
-              ], 8, _hoisted_4$6)
+              ], 8, _hoisted_4$5)
             ]),
             createBaseVNode("div", _hoisted_7$1, [
               (openBlock(true), createElementBlock(Fragment, null, renderList(similarQuery.items, (product, index2) => {
@@ -24573,8 +24636,9 @@ const _sfc_main$o = /* @__PURE__ */ defineComponent({
                   style: normalizeStyle(_ctx.columnSize),
                   key: getDocumentKey(index2, product),
                   product,
-                  options: _ctx.productCardOptions
-                }, null, 8, ["style", "product", "options"]);
+                  options: _ctx.productCardOptions,
+                  "analytics-metadata": getClickMetadata(similarQuery)
+                }, null, 8, ["style", "product", "options", "analytics-metadata"]);
               }), 128))
             ])
           ]);
@@ -24743,7 +24807,7 @@ const _hoisted_1$i = {
   "data-cy": "lupa-search-results-similar-results"
 };
 const _hoisted_2$f = { class: "lupa-similar-results-label" };
-const _hoisted_3$b = {
+const _hoisted_3$a = {
   class: "lupa-products",
   "data-cy": "lupa-products"
 };
@@ -24762,17 +24826,23 @@ const _sfc_main$k = /* @__PURE__ */ defineComponent({
     const getDocumentKey = (index, product) => {
       return getProductKey(`${index}`, product, props.productCardOptions.idKey);
     };
+    const clickMetadata = computed(() => {
+      return {
+        _lupaEventSource: "similarResults"
+      };
+    });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$i, [
         createBaseVNode("div", _hoisted_2$f, toDisplayString(_ctx.labels.similarResultsLabel), 1),
-        createBaseVNode("div", _hoisted_3$b, [
+        createBaseVNode("div", _hoisted_3$a, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(similarResults.value.items, (product, index) => {
             return openBlock(), createBlock(_sfc_main$p, {
               style: normalizeStyle(_ctx.columnSize),
               key: getDocumentKey(index, product),
               product,
-              options: _ctx.productCardOptions
-            }, null, 8, ["style", "product", "options"]);
+              options: _ctx.productCardOptions,
+              "analytics-metadata": clickMetadata.value
+            }, null, 8, ["style", "product", "options", "analytics-metadata"]);
           }), 128))
         ])
       ]);
@@ -24883,8 +24953,8 @@ const extractRelatedSource = (source, searchResults2, options, activeFilters) =>
 });
 const _hoisted_1$h = { class: "lupa-related-query-item" };
 const _hoisted_2$e = { class: "lupa-related-query-image" };
-const _hoisted_3$a = { class: "lupa-related-query-label" };
-const _hoisted_4$5 = { class: "lupa-related-query-title" };
+const _hoisted_3$9 = { class: "lupa-related-query-label" };
+const _hoisted_4$4 = { class: "lupa-related-query-title" };
 const _hoisted_5$2 = {
   key: 0,
   class: "lupa-related-query-count"
@@ -24982,7 +25052,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
       var _a;
       return openBlock(), createElementBlock("div", _hoisted_1$h, [
         createBaseVNode("div", _hoisted_2$e, [
-          itemToDisplay.value && image.value ? (openBlock(), createBlock(_sfc_main$1l, {
+          itemToDisplay.value && image.value ? (openBlock(), createBlock(_sfc_main$1m, {
             key: 0,
             "wrapper-class": "lupa-related-query-image-wrapper",
             "image-class": "lupa-related-query-image",
@@ -24990,8 +25060,8 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
             options: image.value
           }, null, 8, ["item", "options"])) : createCommentVNode("", true)
         ]),
-        createBaseVNode("div", _hoisted_3$a, [
-          createBaseVNode("span", _hoisted_4$5, toDisplayString(_ctx.query), 1),
+        createBaseVNode("div", _hoisted_3$9, [
+          createBaseVNode("span", _hoisted_4$4, toDisplayString(_ctx.query), 1),
           ((_a = _ctx.options) == null ? void 0 : _a.showCount) ? (openBlock(), createElementBlock("span", _hoisted_5$2, "(" + toDisplayString(totalItemCount.value) + ")", 1)) : createCommentVNode("", true)
         ])
       ]);
@@ -25006,7 +25076,7 @@ const _hoisted_2$d = {
   key: 0,
   class: "lupa-related-queries-title"
 };
-const _hoisted_3$9 = ["onClick"];
+const _hoisted_3$8 = ["onClick"];
 const _sfc_main$i = /* @__PURE__ */ defineComponent({
   __name: "RelatedQueries",
   props: {
@@ -25111,7 +25181,7 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
                   "existing-items-from-other-queries": allDisplayItems.value,
                   onLoaded: (item) => processLoadedItem(query, item)
                 }, null, 8, ["source-key", "options", "query", "existing-items-from-other-queries", "onLoaded"])
-              ], 8, _hoisted_3$9)
+              ], 8, _hoisted_3$8)
             ], 2)), [
               [vShow, querySourceResultMap.value[query.value] !== false]
             ]);
@@ -25153,7 +25223,7 @@ const _hoisted_1$f = {
   class: "lupa-redirection-suggestion"
 };
 const _hoisted_2$c = { class: "lupa-redirections-suggestion-label" };
-const _hoisted_3$8 = ["href"];
+const _hoisted_3$7 = ["href"];
 const _sfc_main$h = /* @__PURE__ */ defineComponent({
   __name: "RedirectionSuggestions",
   props: {
@@ -25179,7 +25249,7 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return redirectionSuggestion.value && label.value && link.value ? (openBlock(), createElementBlock("div", _hoisted_1$f, [
         createBaseVNode("h4", _hoisted_2$c, [
-          createBaseVNode("a", { href: link.value }, toDisplayString(label.value), 9, _hoisted_3$8)
+          createBaseVNode("a", { href: link.value }, toDisplayString(label.value), 9, _hoisted_3$7)
         ])
       ])) : createCommentVNode("", true);
     };
@@ -25190,12 +25260,12 @@ const _hoisted_2$b = {
   class: "lupa-products",
   "data-cy": "lupa-products"
 };
-const _hoisted_3$7 = {
+const _hoisted_3$6 = {
   key: 1,
   class: "lupa-empty-results",
   "data-cy": "lupa-no-results-in-page"
 };
-const _hoisted_4$4 = {
+const _hoisted_4$3 = {
   key: 4,
   class: "lupa-empty-results",
   "data-cy": "lupa-no-results"
@@ -25296,6 +25366,13 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
       var _a, _b;
       return Boolean((_b = (_a = searchResult.value.similarResults) == null ? void 0 : _a.items) == null ? void 0 : _b.length);
     });
+    const clickMetadata = computed(() => {
+      const hasDidYouMean = Boolean(searchResult.value.suggestedSearchText);
+      return hasDidYouMean ? {
+        _lupaEventSource: "didYouMean",
+        _lupaUpdatedQuery: searchResult.value.suggestedSearchText
+      } : void 0;
+    });
     const getProductKeyAction = (index, product) => {
       return getProductKey(`${index}`, product, props.options.idKey);
     };
@@ -25327,7 +25404,7 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
           options: _ctx.options.relatedQueries
         }, null, 8, ["options"])) : createCommentVNode("", true),
         unref(hasResults) ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [
-          showTopFilters.value ? (openBlock(), createBlock(_sfc_main$H, {
+          showTopFilters.value ? (openBlock(), createBlock(_sfc_main$I, {
             key: 0,
             options: (_a = _ctx.options.filters) != null ? _a : {}
           }, null, 8, ["options"])) : createCommentVNode("", true),
@@ -25338,7 +25415,7 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
             "pagination-location": "top",
             onFilter: filter2
           }, null, 8, ["options"])) : createCommentVNode("", true),
-          currentFilterOptions.value && currentFilterPositionDesktop.value === "pageTop" ? (openBlock(), createBlock(_sfc_main$V, {
+          currentFilterOptions.value && currentFilterPositionDesktop.value === "pageTop" ? (openBlock(), createBlock(_sfc_main$W, {
             key: 2,
             class: normalizeClass(currentFiltersClass.value),
             "data-cy": "lupa-search-result-filters-mobile-toolbar",
@@ -25352,7 +25429,7 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
             options: _ctx.options,
             "pagination-location": "top"
           }, null, 8, ["options"]),
-          currentFilterOptions.value && currentFilterPositionDesktop.value === "resultsTop" ? (openBlock(), createBlock(_sfc_main$V, {
+          currentFilterOptions.value && currentFilterPositionDesktop.value === "resultsTop" ? (openBlock(), createBlock(_sfc_main$W, {
             key: 0,
             class: normalizeClass(currentFiltersClass.value),
             "data-cy": "lupa-search-result-filters-mobile-toolbar",
@@ -25372,11 +25449,12 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
                 style: normalizeStyle(columnSize.value),
                 key: getProductKeyAction(index, product),
                 product,
-                options: productCardOptions.value
-              }, null, 8, ["style", "product", "options"]);
+                options: productCardOptions.value,
+                "analytics-metadata": clickMetadata.value
+              }, null, 8, ["style", "product", "options", "analytics-metadata"]);
             }), 128))
           ]),
-          unref(isPageEmpty) && _ctx.options.labels.noItemsInPage ? (openBlock(), createElementBlock("div", _hoisted_3$7, [
+          unref(isPageEmpty) && _ctx.options.labels.noItemsInPage ? (openBlock(), createElementBlock("div", _hoisted_3$6, [
             createTextVNode(toDisplayString(_ctx.options.labels.noItemsInPage) + " ", 1),
             _ctx.options.labels.backToFirstPage ? (openBlock(), createElementBlock("span", {
               key: 0,
@@ -25394,7 +25472,7 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
             location: "bottom",
             sdkOptions: _ctx.options.options
           }, null, 8, ["options", "sdkOptions"])
-        ], 64)) : !unref(loading) && unref(currentQueryText) ? (openBlock(), createElementBlock("div", _hoisted_4$4, [
+        ], 64)) : !unref(loading) && unref(currentQueryText) ? (openBlock(), createElementBlock("div", _hoisted_4$3, [
           createTextVNode(toDisplayString(_ctx.options.labels.emptyResults) + " ", 1),
           createBaseVNode("span", null, toDisplayString(unref(currentQueryText)), 1)
         ])) : createCommentVNode("", true),
@@ -25422,8 +25500,8 @@ const _hoisted_2$a = {
   key: 0,
   class: "lupa-category-back"
 };
-const _hoisted_3$6 = ["href"];
-const _hoisted_4$3 = {
+const _hoisted_3$5 = ["href"];
+const _hoisted_4$2 = {
   key: 1,
   class: "lupa-child-category-list"
 };
@@ -25481,11 +25559,11 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
               "data-cy": "lupa-category-back",
               href: backUrlLink.value,
               onClick: handleNavigationBack
-            }, toDisplayString(backTitle.value), 9, _hoisted_3$6)
+            }, toDisplayString(backTitle.value), 9, _hoisted_3$5)
           ])) : createCommentVNode("", true),
-          hasRelatedCategoryChildren.value ? (openBlock(), createElementBlock("div", _hoisted_4$3, [
+          hasRelatedCategoryChildren.value ? (openBlock(), createElementBlock("div", _hoisted_4$2, [
             (openBlock(true), createElementBlock(Fragment, null, renderList(unref(relatedCategoryChildren), (child) => {
-              return openBlock(), createBlock(_sfc_main$U, {
+              return openBlock(), createBlock(_sfc_main$V, {
                 key: getCategoryKey(child),
                 item: child,
                 options: categoryOptions.value
@@ -25506,13 +25584,7 @@ const _hoisted_1$c = {
   key: 0,
   class: "lupa-container-title-summary-mobile"
 };
-const _hoisted_2$9 = {
-  key: 4,
-  id: "lupa-search-results",
-  class: "top-layout-wrapper"
-};
-const _hoisted_3$5 = { class: "search-content" };
-const _hoisted_4$2 = { id: "lupa-search-results" };
+const _hoisted_2$9 = { class: "search-content" };
 const _sfc_main$e = /* @__PURE__ */ defineComponent({
   __name: "SearchResults",
   props: {
@@ -25538,7 +25610,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
       var _a, _b;
       return (_b = (_a = props.initialFilters) != null ? _a : extractedInitialFilters.value) != null ? _b : {};
     });
-    const { currentQueryText, hasResults, currentFilterCount } = storeToRefs(searchResultStore);
+    const { currentQueryText, hasResults, currentFilterCount, isMobileSidebarVisible, layout } = storeToRefs(searchResultStore);
     const { searchString, sortParams } = storeToRefs(paramStore);
     const { defaultSearchResultPageSize } = storeToRefs(optionStore);
     const searchResultsFilters = ref(null);
@@ -25554,6 +25626,13 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
     const isTitleResultTopPosition = computed(() => {
       return props.options.searchTitlePosition === "search-results-top";
     });
+    const indicatorClasses = computed(() => {
+      return {
+        "lupa-mobile-sidebar-visible": isMobileSidebarVisible.value,
+        "lupa-layout-grid": !layout.value || layout.value === ResultsLayoutEnum.GRID,
+        "lupa-layout-list": layout.value === ResultsLayoutEnum.LIST
+      };
+    });
     const handlePopState = () => {
       var _a;
       const searchParams = getSearchParams((_a = props.options.ssr) == null ? void 0 : _a.url);
@@ -25727,8 +25806,8 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
         class: normalizeClass(["lupa-search-result-wrapper", { "lupa-search-wrapper-no-results": !unref(hasResults) }])
       }, [
         _ctx.isContainer ? (openBlock(), createElementBlock("div", _hoisted_1$c, [
-          createVNode(_sfc_main$Z, { labels: didYouMeanLabels.value }, null, 8, ["labels"]),
-          createVNode(_sfc_main$X, {
+          createVNode(_sfc_main$_, { labels: didYouMeanLabels.value }, null, 8, ["labels"]),
+          createVNode(_sfc_main$Y, {
             "show-summary": true,
             options: _ctx.options,
             "is-product-list": (_a = _ctx.isProductList) != null ? _a : false
@@ -25738,26 +25817,30 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
           key: 1,
           options: _ctx.options
         }, null, 8, ["options"])) : createCommentVNode("", true),
-        _ctx.options.filters ? (openBlock(), createBlock(_sfc_main$J, {
+        _ctx.options.filters ? (openBlock(), createBlock(_sfc_main$K, {
           key: 2,
           options: _ctx.options.filters,
           onFilter: handleParamsChange
         }, null, 8, ["options"])) : createCommentVNode("", true),
-        unref(currentQueryText) || _ctx.isProductList ? (openBlock(), createBlock(_sfc_main$I, {
+        unref(currentQueryText) || _ctx.isProductList ? (openBlock(), createBlock(_sfc_main$J, {
           key: 3,
           breadcrumbs: _ctx.options.breadcrumbs
         }, null, 8, ["breadcrumbs"])) : createCommentVNode("", true),
-        isTitleResultTopPosition.value ? (openBlock(), createElementBlock("div", _hoisted_2$9, [
-          showFilterSidebar.value ? (openBlock(), createBlock(_sfc_main$K, {
+        isTitleResultTopPosition.value ? (openBlock(), createElementBlock("div", {
+          key: 4,
+          id: "lupa-search-results",
+          class: normalizeClass(["top-layout-wrapper", indicatorClasses.value])
+        }, [
+          showFilterSidebar.value ? (openBlock(), createBlock(_sfc_main$L, {
             key: 0,
             options: (_b = _ctx.options.filters) != null ? _b : {},
             ref_key: "searchResultsFilters",
             ref: searchResultsFilters,
             onFilter: handleParamsChange
           }, null, 8, ["options"])) : createCommentVNode("", true),
-          createBaseVNode("div", _hoisted_3$5, [
-            createVNode(_sfc_main$Z, { labels: didYouMeanLabels.value }, null, 8, ["labels"]),
-            createVNode(_sfc_main$X, {
+          createBaseVNode("div", _hoisted_2$9, [
+            createVNode(_sfc_main$_, { labels: didYouMeanLabels.value }, null, 8, ["labels"]),
+            createVNode(_sfc_main$Y, {
               options: _ctx.options,
               "is-product-list": (_c = _ctx.isProductList) != null ? _c : false
             }, null, 8, ["options", "is-product-list"]),
@@ -25772,14 +25855,17 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
               _: 3
             }, 8, ["options", "ssr"])
           ])
-        ])) : (openBlock(), createElementBlock(Fragment, { key: 5 }, [
-          createVNode(_sfc_main$Z, { labels: didYouMeanLabels.value }, null, 8, ["labels"]),
-          createVNode(_sfc_main$X, {
+        ], 2)) : (openBlock(), createElementBlock(Fragment, { key: 5 }, [
+          createVNode(_sfc_main$_, { labels: didYouMeanLabels.value }, null, 8, ["labels"]),
+          createVNode(_sfc_main$Y, {
             options: _ctx.options,
             "is-product-list": (_d = _ctx.isProductList) != null ? _d : false
           }, null, 8, ["options", "is-product-list"]),
-          createBaseVNode("div", _hoisted_4$2, [
-            showFilterSidebar.value ? (openBlock(), createBlock(_sfc_main$K, {
+          createBaseVNode("div", {
+            id: "lupa-search-results",
+            class: normalizeClass(indicatorClasses.value)
+          }, [
+            showFilterSidebar.value ? (openBlock(), createBlock(_sfc_main$L, {
               key: 0,
               options: (_e = _ctx.options.filters) != null ? _e : {},
               ref_key: "searchResultsFilters",
@@ -25804,7 +25890,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
                 key: "0"
               } : void 0
             ]), 1032, ["options", "ssr"])
-          ])
+          ], 2)
         ], 64))
       ], 2);
     };
@@ -31413,7 +31499,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
           onClick: withModifiers(innerClick, ["stop"])
         }, [
           createBaseVNode("div", _hoisted_2$7, [
-            createVNode(_sfc_main$_, {
+            createVNode(_sfc_main$$, {
               options: fullSearchBoxOptions.value,
               "is-search-container": true,
               ref_key: "searchBox",
@@ -32943,7 +33029,7 @@ const _hoisted_4 = {
   key: 0,
   class: "lupasearch-chat-content"
 };
-const _sfc_main$1u = /* @__PURE__ */ defineComponent({
+const _sfc_main$1v = /* @__PURE__ */ defineComponent({
   __name: "ChatContainer",
   props: {
     options: {}
@@ -38961,7 +39047,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
     };
     __expose({ fetch: fetch2 });
     return (_ctx, _cache) => {
-      return openBlock(), createBlock(unref(_sfc_main$_), {
+      return openBlock(), createBlock(unref(_sfc_main$$), {
         options: fullSearchBoxOptions.value,
         ref_key: "searchBox",
         ref: searchBox2
@@ -39516,7 +39602,7 @@ const chat = (options, mountOptions) => {
   const instance = createVue(
     options.displayOptions.containerSelector,
     mountOptions == null ? void 0 : mountOptions.mountingBehavior,
-    _sfc_main$1u,
+    _sfc_main$1v,
     {
       options
     }