@depict-ai/react-ui 2.1.10 → 2.1.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/ES10/index.cjs CHANGED
@@ -38,7 +38,7 @@ $parcel$export(module.exports, "version", () => $efbdd2dab4314170$export$83d89fb
38
38
  $parcel$export(module.exports, "Navigation", () => $0d3a2413fdeb34b9$export$b8a61e5c71402559);
39
39
  /*! Depict.ai search and product listing react SDK wrapper */ // This is where the actual source of your React stuff should live
40
40
  // Note, if you add an export here, also add one in src-server/main.ts
41
- const $efbdd2dab4314170$export$83d89fbfd8236492 = "2.1.10";
41
+ const $efbdd2dab4314170$export$83d89fbfd8236492 = "2.1.11";
42
42
  const $ef516b1f92253963$export$8e769ad4338a911e = {
43
43
  usedLocale: $2kiy7$solidjs.createSignal((0, $2kiy7$depictaiuilocales.defaultLocale)),
44
44
  search_instances: new Map(),
@@ -848,10 +848,13 @@ function $745b83c12baac3c0$export$5abb40edfde2a843(props, set_portals) {
848
848
  get grid_spacing() {
849
849
  var _props$gridSpacing;
850
850
  return (_props$gridSpacing = props.gridSpacing) !== null && _props$gridSpacing !== void 0 ? _props$gridSpacing : (0, $2kiy7$depictaiui.defaultGridSpacing);
851
+ },
852
+ get title() {
853
+ return props.title;
851
854
  }
852
855
  });
853
856
  }
854
- function $27d583018ba6e604$export$bd8acc07a8bae229(props, set_portals) {
857
+ function $3b36cc844440a979$export$e46079a2793e9ec7(props, set_portals) {
855
858
  const component_portals = new Set();
856
859
  return $2kiy7$depictaiui.RecommendationGrid({
857
860
  get recommendations() {
@@ -885,6 +888,9 @@ function $27d583018ba6e604$export$bd8acc07a8bae229(props, set_portals) {
885
888
  get max_rows() {
886
889
  return props.maxRows;
887
890
  },
891
+ get title() {
892
+ return props.title;
893
+ },
888
894
  get view_more_button() {
889
895
  var _viewMoreButton$start;
890
896
  const {
@@ -901,7 +907,7 @@ function $27d583018ba6e604$export$bd8acc07a8bae229(props, set_portals) {
901
907
  function $8f89f8a832210d6b$export$b0a773486c1c2312(props) {
902
908
  $6e5ce22b65512b0a$export$4daadad26e48a2c7(props);
903
909
  return $e7ba61a7074c02d3$export$f6e64e17bd69eeef({
904
- solid_component: (0, $27d583018ba6e604$export$bd8acc07a8bae229),
910
+ solid_component: (0, $3b36cc844440a979$export$e46079a2793e9ec7),
905
911
  props: props,
906
912
  hydrate_function_when_ssr: (0, $2kiy7$solidjsweb.hydrate),
907
913
  wrapper_type: "section"
package/ES10/index.d.ts CHANGED
@@ -3,7 +3,7 @@ import React, { PropsWithChildren, ReactNode, FC, ReactPortal, ReactElement } fr
3
3
  import { BaseProviderConfig, BaseSearchProviderConfig, BaseCategoryProviderConfig, ModernDisplayWithPageUrl, BaseProductListingConfig, BaseSearchPageConfig, BaseCategoryPageConfig, CategoryTitle, embedded_num_products, ImagePlaceholder as _ImagePlaceholder1, TextPlaceholder as _TextPlaceholder1, ExclusiveId, fetchDepictRecommendations } from "@depict-ai/ui/ES10";
4
4
  import { Locale } from "@depict-ai/ui/locales/ES10";
5
5
  import { Display, ModernDisplay } from "@depict-ai/utilishared/ES10";
6
- export const version = "2.1.10";
6
+ export const version = "2.1.11";
7
7
  interface UsePerformanceClientReturn {
8
8
  dpc: DPC;
9
9
  }
@@ -365,6 +365,10 @@ interface RecommendationConfig<T extends Display> extends BaseProductListingConf
365
365
  * The product card function to use for rendering products.
366
366
  */
367
367
  productCard: DepictProductCard<T>;
368
+ /**
369
+ * Title to show when recommendations are being shown
370
+ */
371
+ title?: string;
368
372
  }
369
373
  interface RecommendationGridConfig<T extends Display> extends RecommendationConfig<T> {
370
374
  maxRows?: number;
@@ -374,7 +378,7 @@ interface RecommendationGridConfig<T extends Display> extends RecommendationConf
374
378
  rowsPerClick?: number;
375
379
  };
376
380
  }
377
- declare function SolidRecommendationWrapper<T extends Display>(props: RecommendationGridConfig<T>, set_portals: (portals: ReactPortal[]) => void): HTMLDivElement;
381
+ declare function SolidRecommendationGridWrapper<T extends Display>(props: RecommendationGridConfig<T>, set_portals: (portals: ReactPortal[]) => void): HTMLDivElement;
378
382
  interface RecommendationSliderConfig<T extends Display> extends RecommendationConfig<T> {
379
383
  viewMoreButton?: {
380
384
  text: string;
@@ -388,6 +392,7 @@ interface RecommendationSliderConfig<T extends Display> extends RecommendationCo
388
392
  * @param productCard a function that renders a product card or a placeholder for one
389
393
  * @param columnsAtSize the number of columns to show at each media breakpoint
390
394
  * @param gridSpacing the spacing between the product cards
395
+ * @param title Optional title to show when recommendations are being shown
391
396
  */
392
397
  export function RecommendationSlider<T extends Display>(props: Parameters<typeof SolidRecommendationSliderWrapper<T>>[0]): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
393
398
  declare function SolidRecommendationSliderWrapper<T extends Display>(props: RecommendationSliderConfig<T>, set_portals: (portals: ReactPortal[]) => void): HTMLDivElement;
@@ -399,8 +404,9 @@ declare function SolidRecommendationSliderWrapper<T extends Display>(props: Reco
399
404
  * @param gridSpacing the spacing between the product cards
400
405
  * @param maxRows the maximum number of rows to show.
401
406
  * @param viewMoreButton optional configuration for the view more button. If unset, all products will be shown by default. Otherwise, a view more button with the given text will be shown. With the properties startRows and rowsPerClick, you can configure how many rows should be shown initially and how many rows should be added on each click.
407
+ * @param title Optional title to show when recommendations are being shown
402
408
  */
403
- export function RecommendationGrid<T extends Display>(props: Parameters<typeof SolidRecommendationWrapper<T>>[0]): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
409
+ export function RecommendationGrid<T extends Display>(props: Parameters<typeof SolidRecommendationGridWrapper<T>>[0]): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
404
410
  /**
405
411
  * Parameters to configure the search modal.
406
412
  */
package/ES10/index.js CHANGED
@@ -14,7 +14,7 @@ import { renderToString as $jb2Oo$renderToString } from "react-dom/server";
14
14
  // Note, if you add an export here, also add one in src-server/main.ts
15
15
  import { register_es_version } from "../multi_import_deduplicator.mjs";
16
16
  register_es_version("react-ui", "ES10");
17
- const $9bd9bb8700ab2ada$export$83d89fbfd8236492 = "2.1.10";
17
+ const $9bd9bb8700ab2ada$export$83d89fbfd8236492 = "2.1.11";
18
18
  const $8c691d7f86317052$export$8e769ad4338a911e = {
19
19
  usedLocale: $jb2Oo$createSignal((0, $jb2Oo$defaultLocale)),
20
20
  search_instances: new Map(),
@@ -824,10 +824,13 @@ function $c02e9fd51f31a1bd$export$5abb40edfde2a843(props, set_portals) {
824
824
  get grid_spacing() {
825
825
  var _props$gridSpacing;
826
826
  return (_props$gridSpacing = props.gridSpacing) !== null && _props$gridSpacing !== void 0 ? _props$gridSpacing : (0, $jb2Oo$defaultGridSpacing);
827
+ },
828
+ get title() {
829
+ return props.title;
827
830
  }
828
831
  });
829
832
  }
830
- function $48b0916cc674770c$export$bd8acc07a8bae229(props, set_portals) {
833
+ function $cd68097a7ee08669$export$e46079a2793e9ec7(props, set_portals) {
831
834
  const component_portals = new Set();
832
835
  return $jb2Oo$RecommendationGrid({
833
836
  get recommendations() {
@@ -861,6 +864,9 @@ function $48b0916cc674770c$export$bd8acc07a8bae229(props, set_portals) {
861
864
  get max_rows() {
862
865
  return props.maxRows;
863
866
  },
867
+ get title() {
868
+ return props.title;
869
+ },
864
870
  get view_more_button() {
865
871
  var _viewMoreButton$start;
866
872
  const {
@@ -877,7 +883,7 @@ function $48b0916cc674770c$export$bd8acc07a8bae229(props, set_portals) {
877
883
  function $31abef71c0a2d3fc$export$b0a773486c1c2312(props) {
878
884
  $758339150fbfe9d5$export$4daadad26e48a2c7(props);
879
885
  return $0dd9d9a9c7da4c1d$export$f6e64e17bd69eeef({
880
- solid_component: (0, $48b0916cc674770c$export$bd8acc07a8bae229),
886
+ solid_component: (0, $cd68097a7ee08669$export$e46079a2793e9ec7),
881
887
  props: props,
882
888
  hydrate_function_when_ssr: (0, $jb2Oo$hydrate),
883
889
  wrapper_type: "section"
@@ -1 +1 @@
1
- .depict.plp{color:#0f0f0f}.depict.plp button{border:none}.depict.plp a{text-decoration:none}.depict.plp,.depict.plp *{box-sizing:border-box}.depict.plp .listing-page{flex-direction:column;display:flex}.depict.plp .listing-page .no-results{background:#fff;flex-direction:column;flex-grow:2;justify-content:flex-start;align-items:center;padding:40px;display:flex}.depict.plp .listing-page .no-results>:not(:first-child){margin-top:3px}.depict.plp .listing-page .no-results>:not(:last-child){margin-bottom:3px}.depict.plp .listing-page .no-results .hint{cursor:pointer;color:#333335;text-decoration:underline}.depict.plp .listing-page .no-results .text{font-size:2em;font-weight:700}.depict.plp .cards:not(.css-grid){flex-flow:wrap;display:flex}.depict.plp .cards{flex-grow:1;align-content:flex-start;overflow:hidden}.depict.plp .load-more-container,.depict.plp .load-less-container{justify-content:center;display:flex}.depict.plp .listing-page{padding:20px 10px}@media (max-width:651px){.depict.plp .listing-page{padding:16px 8px}}.depict.plp .listing-page>.filter-results-for-one-row,.depict.plp .listing-page>.results-for{margin-bottom:10px}@media (max-width:651px){.depict.plp .listing-page>.filter-results-for-one-row,.depict.plp .listing-page>.results-for{margin-bottom:8px}}.depict.plp .listing-page>.sort-and-filter-buttons{margin-top:10px;margin-bottom:10px}@media (max-width:651px){.depict.plp .listing-page>.sort-and-filter-buttons{margin-top:8px;margin-bottom:8px}}.depict.plp .listing-page .PLP-results{margin-top:10px;display:flex}@media (max-width:651px){.depict.plp .listing-page .PLP-results{margin-top:8px}}.depict.plp .listing-page .PLP-results>.filters,.depict.plp .listing-page .PLP-results>.sorting{margin-left:12px}.depict.plp .listing-page .selected-filters .inner{align-items:center;margin-top:0;margin-bottom:0;display:flex}.depict.plp .listing-page .selected-filters .inner .title{margin-right:10px}@media (max-width:651px){.depict.plp .listing-page .selected-filters .inner{margin-top:10px;margin-bottom:10px}}.depict.plp .listing-page .selected-filters .inner .title{text-transform:uppercase;color:#0f0f0f;font-size:1.1em}@media (max-width:600px){.depict.plp .listing-page .selected-filters .inner .title{display:none}}.depict.plp .listing-page .selected-filters .inner .depict-slider{width:unset;overflow:hidden}.depict.plp .listing-page .selected-filters .inner .depict-slider .clear-filter{border:1px solid #0f0f0f}.depict.plp .listing-page .selected-filters .inner .depict-slider .clear-filter svg{width:12.64px;height:12.64px}.depict.plp .listing-page .selected-filters .inner .depict-slider .clear-all-filters{border:1px solid #0f0f0f}.depict.plp .listing-page .selected-filters .inner .depict-slider .clear-filter,.depict.plp .listing-page .selected-filters .inner .depict-slider .clear-all-filters{white-space:nowrap;cursor:pointer;border-radius:4px;align-items:center;padding:5px 10px;font-size:1em;line-height:1;display:flex}.depict.plp .listing-page .selected-filters .inner .depict-slider .clear-filter>:not(:first-child),.depict.plp .listing-page .selected-filters .inner .depict-slider .clear-all-filters>:not(:first-child){margin-left:2.5px}.depict.plp .listing-page .selected-filters .inner .depict-slider .clear-filter>:not(:last-child),.depict.plp .listing-page .selected-filters .inner .depict-slider .clear-all-filters>:not(:last-child){margin-right:2.5px}.depict.plp .scroll-status{pointer-events:none;white-space:nowrap;z-index:calc(5000 + 4);opacity:0;justify-content:center;align-items:center;display:flex;position:sticky;bottom:10vh}.depict.plp .scroll-status .text{color:#fff;background:#333335bf;border-radius:20px;padding:10px 20px}.depict.plp .major-minor-transition{transition:filter .15s ease-in-out,background .25s ease-in-out,color .25s ease-in-out,border .25s ease-in-out}.depict.plp .filter-results-for-one-row{justify-content:space-between;align-items:center;display:flex}.depict.plp :not(.filter-results-for-one-row)>.sort-and-filter-buttons .inner{justify-content:space-between}.depict.plp .sorting-attributes,.depict.plp .sorting-direction{flex-direction:column;padding:10px;display:flex}.depict.plp .sorting-attributes>:not(:first-child),.depict.plp .sorting-direction>:not(:first-child){margin-top:5px}.depict.plp .sorting-attributes>:not(:last-child),.depict.plp .sorting-direction>:not(:last-child){margin-bottom:5px}.depict.plp .sort-and-filter-buttons .outer{margin-top:-5px}.depict.plp .sort-and-filter-buttons .inner{justify-content:flex-end;align-items:center;padding-top:5px;display:flex;overflow:hidden}.depict.plp .sort-and-filter-buttons .inner>:not(:first-child){margin-left:5px}.depict.plp .sort-and-filter-buttons .inner>:not(:last-child){margin-right:5px}.depict.plp .sort-and-filter-buttons.fake .toggle-button{transition:none}.depict.plp .sort-and-filter-buttons .toggle-button{white-space:nowrap;position:relative}.depict.plp .sort-and-filter-buttons .toggle-button>:not(:first-child){margin-left:2.5px}.depict.plp .sort-and-filter-buttons .toggle-button>:not(:last-child){margin-right:2.5px}.depict.plp .sort-and-filter-buttons .toggle-button svg path{transition-duration:.25s}.depict.plp .sort-and-filter-buttons .toggle-button.major.for-sorting>:not(:first-child){margin-left:5px}.depict.plp .sort-and-filter-buttons .toggle-button.major.for-sorting>:not(:last-child){margin-right:5px}.depict.plp .sort-and-filter-buttons .num-filters{color:#fff;width:20px;height:20px;z-index:calc(1 + 1);background:#0f0f0f;border-radius:13px;justify-content:center;align-items:center;font-size:12px;line-height:1;transition:opacity .25s ease-in-out;display:flex;position:absolute;top:-4px;right:-4px}.depict.plp .sort-and-filter-buttons .open-filters-button-container{position:relative}.depict.plp label{margin:0}.depict.plp .PLP-results .sorting,.depict.plp .PLP-results .filters{flex-shrink:0;flex-basis:330px}.depict.plp .filters .body,.depict.plp .sorting .body{flex-direction:column;display:flex}.depict.plp .filters .body .input-row,.depict.plp .sorting .body .input-row{position:relative}.depict.plp .filters .body .input-row:not(.count-0),.depict.plp .sorting .body .input-row:not(.count-0){cursor:pointer}.depict.plp .filters .body .input-row .custom-indicator,.depict.plp .sorting .body .input-row .custom-indicator{margin-right:10px;position:relative}.depict.plp .filters .body .input-row input,.depict.plp .sorting .body .input-row input{opacity:0;cursor:pointer;height:0;width:0;position:absolute}.depict.plp .filters .body .input-row .custom-indicator:after,.depict.plp .sorting .body .input-row .custom-indicator:after{content:"";display:none;position:absolute}.depict.plp .filters .body .input-row input[type=checkbox]~.custom-indicator,.depict.plp .sorting .body .input-row input[type=checkbox]~.custom-indicator{background-color:#fff;border-radius:2px;padding:9px}.depict.plp .filters .body .input-row input[type=checkbox]~.custom-indicator:not(.color),.depict.plp .sorting .body .input-row input[type=checkbox]~.custom-indicator:not(.color){border:1px solid #0f0f0f}.depict.plp .filters .body .input-row input[type=checkbox]~.custom-indicator.color,.depict.plp .sorting .body .input-row input[type=checkbox]~.custom-indicator.color{border:.5px solid #868689;padding:9.5px}.depict.plp .filters .body .input-row input[type=checkbox]:checked~.custom-indicator,.depict.plp .sorting .body .input-row input[type=checkbox]:checked~.custom-indicator{background-color:#0f0f0f}.depict.plp .filters .body .input-row input[type=checkbox]:checked~.custom-indicator:after,.depict.plp .sorting .body .input-row input[type=checkbox]:checked~.custom-indicator:after{fill:#fff;color:#fff;width:13px;height:10px;background-image:url("data:image/svg+xml;utf8,<svg fill=\"%23FFFFFF\" width=\"12\" height=\"10\" viewBox=\"0 0 12 10\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12 2.0001L10.6 0.600098L4 7.2001L1.4 4.6001L0 6.0001L4 10.0001L12 2.0001Z\" /></svg>");background-repeat:round;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.depict.plp .filters .body .input-row input[type=checkbox]:checked~.custom-indicator.color:after,.depict.plp .sorting .body .input-row input[type=checkbox]:checked~.custom-indicator.color:after{background-image:url("data:image/svg+xml;utf8,<svg fill=\"%23FFFFFF\" width=\"12\" height=\"10\" viewBox=\"0 0 12 10\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12 2.0001L10.6 0.600098L4 7.2001L1.4 4.6001L0 6.0001L4 10.0001L12 2.0001Z\" /></svg>")}.depict.plp .filters .body .input-row input[type=checkbox]:checked~.custom-indicator.color.black-check:after,.depict.plp .sorting .body .input-row input[type=checkbox]:checked~.custom-indicator.color.black-check:after{background-image:url("data:image/svg+xml;utf8,<svg fill=\"%23000000\" width=\"12\" height=\"10\" viewBox=\"0 0 12 10\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12 2.0001L10.6 0.600098L4 7.2001L1.4 4.6001L0 6.0001L4 10.0001L12 2.0001Z\" /></svg>")}.depict.plp .filters .body .input-row input[type=checkbox]:focus-visible~.custom-indicator,.depict.plp .sorting .body .input-row input[type=checkbox]:focus-visible~.custom-indicator{outline:2.5px solid #fff;box-shadow:0 0 0 4px #0f0f0f}@media not all and (hover:none){.depict.plp .filters .body .input-row:hover input[type=checkbox]:not([disabled])~.custom-indicator,.depict.plp .sorting .body .input-row:hover input[type=checkbox]:not([disabled])~.custom-indicator{background-color:#f3f3f5}.depict.plp .filters .body .input-row:hover input[type=checkbox]:not([disabled])~.custom-indicator:not(.color),.depict.plp .sorting .body .input-row:hover input[type=checkbox]:not([disabled])~.custom-indicator:not(.color){border:2px solid #0f0f0f;padding:8px}.depict.plp .filters .body .input-row:hover input[type=checkbox]:not([disabled]):checked~.custom-indicator,.depict.plp .sorting .body .input-row:hover input[type=checkbox]:not([disabled]):checked~.custom-indicator{background-color:#333335}}.depict.plp .filters .body .input-row input[type=checkbox][disabled]~.custom-indicator:not(.color),.depict.plp .sorting .body .input-row input[type=checkbox][disabled]~.custom-indicator:not(.color){border:1px solid #cbcbcc;padding:9px}.depict.plp .filters .body .input-row input[type=radio]~.custom-indicator,.depict.plp .sorting .body .input-row input[type=radio]~.custom-indicator{background-color:#fff;border:1px solid #0f0f0f;border-radius:50%;padding:9px}.depict.plp .filters .body .input-row input[type=radio]:checked~.custom-indicator,.depict.plp .sorting .body .input-row input[type=radio]:checked~.custom-indicator{background-color:#0000}.depict.plp .filters .body .input-row input[type=radio]:checked~.custom-indicator:after,.depict.plp .sorting .body .input-row input[type=radio]:checked~.custom-indicator:after{width:12px;height:12px;background-color:#0f0f0f;border-radius:50%;display:block;top:50%;left:50%;transform:translate(-50%,-50%)}.depict.plp .filters .body .input-row input[type=radio]:focus-visible~.custom-indicator,.depict.plp .sorting .body .input-row input[type=radio]:focus-visible~.custom-indicator{outline:2.5px solid #fff;box-shadow:0 0 0 4px #0f0f0f}@media not all and (hover:none){.depict.plp .filters .body .input-row:hover input[type=radio]:not([disabled])~.custom-indicator,.depict.plp .sorting .body .input-row:hover input[type=radio]:not([disabled])~.custom-indicator{background-color:#f3f3f5;border:2px solid #0f0f0f;padding:8px}.depict.plp .filters .body .input-row:hover input[type=radio]:checked~.custom-indicator:after,.depict.plp .sorting .body .input-row:hover input[type=radio]:checked~.custom-indicator:after{background-color:#333335}}.depict.plp .filters .search-in-filters{display:flex;position:relative}.depict.plp .filters .search-in-filters>:not(input){position:absolute}.depict.plp .filters .search-in-filters .clear-filter-search{cursor:pointer;background:0 0;transition:transform .1s ease-in-out;display:flex;right:10px}.depict.plp .filters .search-in-filters .clear-filter-search path{transition-duration:.1s}.depict.plp .filters .search-in-filters .clear-filter-search:focus{outline:none}.depict.plp .filters .search-in-filters .clear-filter-search:focus-visible{filter:drop-shadow(-2px -2px 4px #418fc3cc)drop-shadow(2px 2px 4px #418fc3cc);transform:scale(1.4)translateY(-35.7143%)}.depict.plp .filters .search-in-filters .clear-filter-search:focus-visible svg path{fill:#000}@media not all and (hover:none){.depict.plp .filters .search-in-filters .clear-filter-search:hover svg path{fill:#000}}.depict.plp .filters .search-in-filters .search-icon{pointer-events:none;order:0;left:10px}.depict.plp .filters .search-in-filters .search-icon path{transition-duration:.15s}.depict.plp .filters .search-in-filters .clear-filter-search,.depict.plp .filters .search-in-filters .search-icon{top:50%;transform:translateY(-50%)}.depict.plp .filters .search-in-filters .clear-filter-search path,.depict.plp .filters .search-in-filters .search-icon path{fill:#868689}.depict.plp .filters .search-in-filters .query{color:#333335;border:1px solid #cbcbcc;border-radius:4px;flex-grow:1;padding:10px 36px;font-size:1em;line-height:1}@media not all and (hover:none){.depict.plp .filters .search-in-filters .query:hover{color:#0f0f0f}.depict.plp .filters .search-in-filters .query:hover~.search-icon path{fill:#0f0f0f}}.depict.plp .filters .search-in-filters .query:focus{color:#000;border:1px solid #0f0f0f;outline:none}.depict.plp .filters .search-in-filters .query:focus~svg path,.depict.plp .filters .search-in-filters .query:focus~button svg path{fill:#000}.depict.plp .filters .body .input-row{justify-content:space-between;padding-top:5px;padding-bottom:5px}.depict.plp .filters .body .input-row,.depict.plp .filters .body .input-row>.left{align-items:center;display:flex}.depict.plp .filters .body .input-row .text{color:#333335;-webkit-line-clamp:1;font-weight:400;line-height:20px}.depict.plp .filters .body .input-row :checked~.text,.depict.plp .filters .body .input-row .fake-checked~.text{color:#0f0f0f;font-weight:500}.depict.plp .filters .body .input-row.count-0 *+.text{color:#cbcbcc}.depict.plp .filters .body .count{color:#868689;font-weight:400}.depict.plp .filters .body .input-row:not(.count-0):hover .count{color:#000}.depict.plp .filters .body .count-0 .count,.depict.plp .filters .body .count.count-0{color:#cbcbcc}.depict.plp .filters .body .selected-w-sign{align-items:center;display:flex}.depict.plp .filters .body .selected-w-sign>:not(:first-child){margin-left:5px}.depict.plp .filters .body .selected-w-sign>:not(:last-child){margin-right:5px}.depict.plp .filters .body .selected-w-sign .show-selected{color:#868689;fill:#868689;align-items:center;display:flex}.depict.plp .filters .body .selected-w-sign .show-selected>:not(:first-child){margin-left:2.5px}.depict.plp .filters .body .selected-w-sign .show-selected>:not(:last-child){margin-right:2.5px}.depict.plp .filters .body .selected-w-sign .show-selected span{line-height:1}.depict.plp .filters .body .ungrouped{margin-top:25px}.depict.plp .filters .body .clear-all-filters{text-transform:uppercase;margin-top:5px;padding:.7em;font-size:1.1em;font-weight:400}.depict.plp .filters .body details summary{cursor:pointer;list-style:none}.depict.plp .filters .body details summary::-webkit-details-marker{display:none}.depict.plp .filters .body details summary>.summary{justify-content:space-between;align-items:center;display:flex}.depict.plp .filters .body details.filter-collapsible{border-top:1px solid #cbcbcc}.depict.plp .filters .body details.filter-collapsible .filter-group-summary:focus{outline:none}.depict.plp .filters .body details.filter-collapsible .filter-group-summary:focus-visible{background:#f3f3f5}@media not all and (hover:none){.depict.plp .filters .body details.filter-collapsible .filter-group-summary:hover{background:#f3f3f5}}.depict.plp .filters .body details.filter-collapsible .filter-group-summary:active{background:#eeeef0}.depict.plp .filters .body details.filter-collapsible .filter-group-summary>.summary{color:#333335;padding:15px 10px}.depict.plp .filters .body details.filter-collapsible .filter-group-summary>.summary>svg{transform:rotate(270deg)}.depict.plp .filters .body details.filter-collapsible[open] .filter-group-summary{border-bottom:1px solid #e4e4e5}.depict.plp .filters .body details.filter-collapsible[open] .filter-group-summary>.summary>span{font-weight:500}.depict.plp .filters .body .filter-collapsible-body{border-radius:0 0 4px 4px;flex-direction:column;margin-bottom:15px;display:flex;overflow:hidden}.depict.plp .filters .body .filter-collapsible-body>:not(:first-child){margin-top:.5px}.depict.plp .filters .body .filter-collapsible-body>:not(:last-child){margin-bottom:.5px}.depict.plp .filters .body .filter-collapsible-body .view-more-clear{border-top:1px solid #e4e4e5;justify-content:space-between;display:flex}.depict.plp .filters .body .filter-collapsible-body .view-more-clear .clear-group{margin-left:auto}.depict.plp .filters .body .filter-collapsible-body .view-more-clear .clear-group>:not(:first-child){margin-left:1.839px}.depict.plp .filters .body .filter-collapsible-body .view-more-clear .clear-group>:not(:last-child){margin-right:1.839px}.depict.plp .filters .body .filter-collapsible-body .view-more-clear .clear-group svg{width:11px;height:12px}.depict.plp .filters .body .filter-collapsible-body .view-more-clear .expand-filter{margin-right:auto}.depict.plp .filters .body .filter-collapsible-body .view-more-clear .expand-filter>:not(:first-child){margin-left:5px}.depict.plp .filters .body .filter-collapsible-body .view-more-clear .expand-filter>:not(:last-child){margin-right:5px}.depict.plp .filters .body .filter-collapsible-body .view-more-clear .expand-filter.expanded svg{clip-path:polygon(20% 48%,80% 48%,80% 50.8%,20% 50.8%);transform:scale(1.6)}.depict.plp .filters .body .filter-collapsible-body .view-more-clear button{color:#333335;cursor:pointer;text-transform:uppercase;background:0 0;border:none;justify-content:center;align-items:center;margin-bottom:0;margin-left:0;margin-right:0;padding:10px;display:flex}.depict.plp .filters .body .filter-collapsible-body .view-more-clear button svg path{fill:#333335}@media not all and (hover:none){.depict.plp .filters .body .filter-collapsible-body .view-more-clear button:hover{color:#4c4c4f}}.depict.plp .filters .body .filter-collapsible-body .view-more-clear button:active{color:#000}.depict.plp .filters .body .filter-collapsible-body .view-more-clear button:focus-visible{filter:drop-shadow(-2px -2px 4px #418fc3cc)drop-shadow(2px 2px 4px #418fc3cc);outline:none}.depict.plp .filters .body .filter-collapsible-body .filter-part{flex-direction:column;padding:15px 10px 20px;display:flex}.depict.plp .filters .body .filter-collapsible-body .filter-part>:not(:first-child){margin-top:5px}.depict.plp .filters .body .filter-collapsible-body .filter-part>:not(:last-child){margin-bottom:5px}.depict.plp .filters .body :not(.ungrouped)>form{margin-top:-5px;margin-bottom:-5px}.depict.plp .filters .body .hierarchical{margin-left:-20px}.depict.plp .filters .body .hierarchical.any-expandable .count{margin-right:30px}.depict.plp .filters .body .hierarchical .checkbox-details{padding-left:20px}.depict.plp .filters .body .hierarchical .checkbox-details.expandable{position:relative}.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:before,.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:after{pointer-events:none;content:"";height:1px;width:calc(100% - 20px);background:#f3f3f5;position:absolute;right:0}.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:before{top:-.5px}.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:after{bottom:-.5px}@media not all and (hover:none){.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:hover:after,.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:hover:before,.input-row:hover~details>.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:after,.input-row:hover~details>.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:before{z-index:1;background:#e4e4e5}}.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:focus-visible:after,.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:focus-visible:before,.input-row~details:focus-visible>.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:after,.input-row~details:focus-visible>.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:before{z-index:1;background:#e4e4e5}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>.input-row{padding-right:30px;position:absolute}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details:not([open]),.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details[open]>.category-parent>.summary{padding-top:5px;padding-bottom:5px}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:focus,.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:focus-visible{box-shadow:none;outline:none}@supports selector(:focus-visible){@media not all and (hover:none){.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:not(:focus-visible):not(:hover) .morphing-sign span{background:#333335}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:not(:focus-visible):not(:hover) .morphing-sign span:first-child{width:5%;left:47.5%}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:not(:focus-visible):not(:hover) .morphing-sign span:last-child{height:5%;top:47.5%}}@media (hover:none){.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:not(:focus-visible) .morphing-sign span{background:#333335}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:not(:focus-visible) .morphing-sign span:first-child{width:5%;left:47.5%}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:not(:focus-visible) .morphing-sign span:last-child{height:5%;top:47.5%}}@media not all and (hover:none){.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:hover .morphing-sign{transform:scale(1.5)}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:hover .count:not(.count-0){color:#000}}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:focus-visible .count{color:#000}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:focus-visible .morphing-sign{transform:scale(1.5)}}@supports not selector(:focus-visible){@media not all and (hover:none){.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:not(:hover) .morphing-sign span{background:#333335}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:not(:hover) .morphing-sign span:first-child{width:5%;left:47.5%}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:not(:hover) .morphing-sign span:last-child{height:5%;top:47.5%}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:hover .morphing-sign{transform:scale(1.5)}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:hover .count:not(.count-0){color:#000}}@media (hover:none){.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent .morphing-sign span{background:#333335}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent .morphing-sign span:first-child{width:5%;left:47.5%}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent .morphing-sign span:last-child{height:5%;top:47.5%}}}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent>.summary{justify-content:flex-end}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent>.summary .count{margin-right:10px}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent>.summary .morphing-sign{width:20px;height:20px;transition-duration:.15s;transition-timing-function:ease-in-out}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent>.summary .morphing-sign span{background:#333335;transition-duration:.15s;transition-timing-function:ease-in-out}.depict.plp .filters .body .range .input-group{width:100%;flex-wrap:nowrap;padding-top:10px;padding-bottom:25px;display:flex}.depict.plp .filters .body .range .input-group .field{width:100%;align-items:center;display:flex}.depict.plp .filters .body .range .input-group .field input{width:100%;text-align:center;-moz-appearance:textfield;color:#868689;background:#f3f3f5;border:.5px solid #0f0f0f;outline:none;padding-top:8px;padding-bottom:8px;transition-duration:50ms}.depict.plp .filters .body .range .input-group .field input:focus-visible{background:#e4e4e5}@media not all and (hover:none){.depict.plp .filters .body .range .input-group .field input:hover{background:#e4e4e5}}.depict.plp .filters .body .range .input-group .field input::-webkit-outer-spin-button,.depict.plp .filters .body .range .input-group .field input::-webkit-inner-spin-button{-webkit-appearance:none}.depict.plp .filters .body .range .input-group .separator{color:#333335;flex-shrink:0;flex-basis:25px;justify-content:center;align-items:center;font-size:19px;display:flex}.depict.plp .filters .body .range .slider{height:5px;background:#e4e4e5;border-radius:5px;position:relative}.depict.plp .filters .body .range .slider .progress{height:100%;background:#0f0f0f;border-radius:5px;position:absolute;left:25%;right:25%}.depict.plp .filters .body .range .range-group{position:relative}.depict.plp .filters .body .range .range-group input{width:100%;height:0;pointer-events:none;-webkit-appearance:none;-moz-appearance:none;background:0 0;margin:0;position:absolute;top:-2.5px}.depict.plp .filters .body .range .range-group input:focus{outline:none}.depict.plp .filters .body .range .range-group input::-webkit-slider-thumb{cursor:pointer;height:20px;width:20px;pointer-events:auto;-webkit-appearance:none;background:#0f0f0f;border-radius:50%;box-shadow:0 0 6px #0000000d}@media not all and (hover:none){.depict.plp .filters .body .range .range-group input::-webkit-slider-thumb:hover{background:#333335}}.depict.plp .filters .body .range .range-group input::-moz-range-thumb{cursor:pointer;height:20px;width:20px;pointer-events:auto;-moz-appearance:none;background:#0f0f0f;border:none;border-radius:50%;box-shadow:0 0 6px #0000000d}@media not all and (hover:none){.depict.plp .filters .body .range .range-group input::-moz-range-thumb:hover{background:#333335}}.depict.plp .filters .body .range .range-group input:focus-visible::-webkit-slider-thumb{background:#333335}.depict.plp .filters .body .range .range-group input:focus-visible::-moz-range-thumb{background:#333335}.depict.plp .filters .body .range .value-text{color:#333335;justify-content:space-between;padding-top:10px;display:flex}.depict.plp .filters .body .range.disabled .input-group .field input{color:#cbcbcc;background:#fafafc;border:.5px solid #0000}@media not all and (hover:none){.depict.plp .filters .body .range.disabled .input-group .field input:hover{background:#fafafc}}.depict.plp .filters .body .range.disabled .input-group .separator{color:#cbcbcc}.depict.plp .filters .body .range.disabled .slider .progress{background:#cbcbcc}.depict.plp .filters .body .range.disabled .range-group input{transform:translate(calc(50% - 10px))}.depict.plp .filters .body .range.disabled .range-group input::-webkit-slider-thumb{cursor:default;background:#cbcbcc}.depict.plp .filters .body .range.disabled .range-group input::-moz-range-thumb{cursor:default;background:#cbcbcc}.depict.plp .filters .body .filter-collapsible-body .filter-part .checkbox-grid{margin-bottom:0}.depict.plp .filters .body .checkbox-grid{flex-wrap:wrap;display:flex}.depict.plp .filters .body .checkbox-grid .minor{color:#333335;border:1px solid #e4e4e5}.depict.plp .filters .body .checkbox-grid .minor .count{color:#868689}.depict.plp .filters .body .checkbox-grid .major .count{color:#e4e4e5}.depict.plp .filters .body .checkbox-grid .major,.depict.plp .filters .body .checkbox-grid .minor{padding:6px 10px}.depict.plp .filters .body .checkbox-grid .major[disabled],.depict.plp .filters .body .checkbox-grid .minor[disabled]{cursor:default;color:#cbcbcc;border:1px solid #f3f3f5}.depict.plp .filters .body .checkbox-grid .major[disabled] .count,.depict.plp .filters .body .checkbox-grid .minor[disabled] .count{color:#cbcbcc;border-left-color:#f3f3f5}.depict.plp .filters .body .checkbox-grid .major .count-wrapper,.depict.plp .filters .body .checkbox-grid .minor .count-wrapper{height:100%;align-items:center;margin-left:8px;display:flex}.depict.plp .filters .body .checkbox-grid .major .count-wrapper .count,.depict.plp .filters .body .checkbox-grid .minor .count-wrapper .count{border-left:1px solid #e4e4e5;padding-left:4px;font-size:.75em;line-height:1}.depict.plp .filters .body .checkbox-color{flex-wrap:wrap;justify-content:space-between;display:flex}.depict.plp .filters .body .checkbox-color .input-row{width:calc(50% - 10px)}.depict.plp .filters .body .checkbox-color .custom-indicator{margin-right:0}.depict.plp .filters .body .checkbox-color .text{margin-left:10px}@media not all and (hover:none){.depict.plp .filters .body .checkbox-color .input-row:hover input:not([disabled])+.custom-indicator{box-shadow:0 0 0 2px #fff,0 0 0 3px #868689}}.depict.plp .sorting .body{color:#333335;line-height:1}.depict.plp .sorting .body>:not(:first-child){margin-top:.5px}.depict.plp .sorting .body>:not(:last-child){margin-bottom:.5px}.depict.plp .sorting .body .input-row{justify-content:flex-start;align-items:center;display:flex}.depict.plp .morphing-sign{width:1.5em;height:1.5em;border:0;position:relative}.depict.plp .morphing-sign span{background:#333335;border-radius:2px;position:absolute}.depict.plp .morphing-sign span:first-child{width:10%;top:25%;bottom:25%;left:45%}.depict.plp .morphing-sign span:last-child{height:10%;top:45%;left:25%;right:25%}.depict.plp .depict-filter-sort-modal-backdrop{z-index:5000;touch-action:none;will-change:opacity;opacity:0;background:#000000b3;position:fixed;inset:0}.depict.plp .dismiss-modal{z-index:5003;cursor:pointer;background:0 0;border:none;padding:0;line-height:0;position:fixed;top:14px;left:4px;transform:translateY(calc(-100% - 14px))}.depict.plp .dismiss-modal svg{transform:scale(.6646)}.depict.plp .dismiss-modal svg path{fill:#fff}.depict.plp .filter-sort-modal{z-index:calc(5000 + 2);width:calc(100% - 30px);height:100%;will-change:transform;background:#fff;flex-direction:column;justify-content:space-between;display:flex;position:fixed;top:0;left:30px;transform:translateY(100%)}.depict.plp .filter-sort-modal details.sorting>summary,.depict.plp .filter-sort-modal details.filters>summary{list-style:none}.depict.plp .filter-sort-modal details.sorting>summary::-webkit-details-marker,.depict.plp .filter-sort-modal details.filters>summary::-webkit-details-marker{display:none}.depict.plp .filter-sort-modal details.sorting .sort-filter-summary>.summary,.depict.plp .filter-sort-modal details.filters .sort-filter-summary>.summary{cursor:pointer;color:#0f0f0f;border-top:1px solid #ececec;justify-content:space-between;padding:13px 20px;font-weight:400;display:flex;box-shadow:0 4px 4px #0f0f0f1a}.depict.plp .filter-sort-modal details.sorting .sort-filter-summary>.summary .left-els,.depict.plp .filter-sort-modal details.filters .sort-filter-summary>.summary .left-els{align-items:center;display:flex}.depict.plp .filter-sort-modal details.sorting .sort-filter-summary>.summary .left-els>:not(:first-child),.depict.plp .filter-sort-modal details.filters .sort-filter-summary>.summary .left-els>:not(:first-child){margin-left:5px}.depict.plp .filter-sort-modal details.sorting .sort-filter-summary>.summary .left-els>:not(:last-child),.depict.plp .filter-sort-modal details.filters .sort-filter-summary>.summary .left-els>:not(:last-child){margin-right:5px}.depict.plp .filter-sort-modal details[open] .sort-filter-summary>.summary{font-weight:600}.depict.plp .filter-sort-modal .filter-icon,.depict.plp .filter-sort-modal .sort-icon{fill:#0f0f0f}.depict.plp .filter-sort-modal>.body{flex-direction:column;display:flex;overflow-y:auto}.depict.plp .filter-sort-modal>.body>:not(:first-child){margin-top:1px}.depict.plp .filter-sort-modal>.body>:not(:last-child){margin-bottom:1px}.depict.plp .filter-sort-modal .filters .body,.depict.plp .filter-sort-modal .sorting .body{color:#333335}.depict.plp .filter-sort-modal .filters>summary .morphing-sign span,.depict.plp .filter-sort-modal .sorting>summary .morphing-sign span{background:#0f0f0f}.depict.plp .filter-sort-modal .filters .filter-collapsible-body{background:0 0}.depict.plp .filter-sort-modal .filters .body{background:unset;padding:10px}.depict.plp .filter-sort-modal .sorting .body{border-radius:4px;margin:10px;padding:0}.depict.plp .filter-sort-modal .bottom-row{flex-shrink:0;justify-content:space-between;padding:10px;display:flex}.depict.plp .filter-sort-modal .bottom-row>:not(:first-child){margin-left:5px}.depict.plp .filter-sort-modal .bottom-row>:not(:last-child){margin-right:5px}.depict.plp .filter-sort-modal .bottom-row>button{border-radius:4px;padding-top:12px;padding-bottom:12px}.depict.plp .filter-sort-modal .bottom-row .show-results{flex-grow:1;font-size:1.1em;font-weight:500}.depict.plp .filter-sort-modal .bottom-row .clear{font-size:1.1em}.depict.plp .floating-buttons{z-index:calc(5000 + 4);opacity:0;justify-content:flex-start;align-items:center;padding-left:12px;transition-duration:.3s;transition-timing-function:ease-in-out;display:flex;position:sticky;bottom:12px}.depict.plp .floating-buttons:not(.show-them){pointer-events:none}.depict.plp .floating-buttons.show-them{opacity:1}.depict.plp .floating-buttons .filter{margin-right:5px}.depict.plp .floating-buttons .sort{margin-left:5px;margin-right:5px}.depict.plp .floating-buttons .up{margin-left:5px}.depict.plp .floating-buttons .sort,.depict.plp .floating-buttons .filter,.depict.plp .floating-buttons .up{filter:drop-shadow(2px 2px 4px #0000001a)drop-shadow(-2px -2px 4px #ffffff4d);background:#f3f3f5;border:1px solid #0f0f0f;border-radius:20px;padding:10px}@media not all and (hover:none){.depict.plp .floating-buttons .sort:hover,.depict.plp .floating-buttons .filter:hover,.depict.plp .floating-buttons .up:hover{background:#e4e4e5}}.depict.plp .floating-buttons .sort:focus,.depict.plp .floating-buttons .filter:focus,.depict.plp .floating-buttons .up:focus{outline:none}.depict.plp .floating-buttons .sort:focus-visible,.depict.plp .floating-buttons .filter:focus-visible,.depict.plp .floating-buttons .up:focus-visible{background:#e4e4e5}.depict.plp .floating-buttons .sort div,.depict.plp .floating-buttons .filter div,.depict.plp .floating-buttons .up div{display:flex}.depict.plp .floating-buttons .sort svg path,.depict.plp .floating-buttons .filter svg path,.depict.plp .floating-buttons .up svg path{fill:#333335}.depict.plp .depict-slider{width:100%;position:relative}.depict.plp .depict-slider .sliding{height:100%;-ms-overflow-style:none;scrollbar-width:none;flex-flow:row;align-items:stretch;display:flex;overflow-x:scroll}.depict.plp .depict-slider .sliding>:not(:first-child){margin-left:5px}.depict.plp .depict-slider .sliding>:not(:last-child){margin-right:5px}.depict.plp .depict-slider .sliding::-webkit-scrollbar{display:none}.depict.plp .depict-slider .sliding>*{flex-shrink:0}.depict.plp .depict-slider .d-navbutton{z-index:2;touch-action:manipulation;cursor:pointer;height:calc(100% + 2px);width:26px;background:linear-gradient(270deg,#fff 50%,#0000 105%);border:none;justify-content:flex-end;align-items:center;padding:0 1px 0 0;transition-duration:.2s;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.depict.plp .depict-slider .d-navbutton.hidden{cursor:default;opacity:0;animation-name:depict_slider_button_unclickable;animation-duration:5s;animation-fill-mode:forwards}.depict.plp .depict-slider .d-navbutton.left{left:-1px;transform:translateY(-50%)rotate(180deg)}.depict.plp .depict-slider .d-navbutton.right{right:-1px}.depict.plp .depict-slider .d-navbutton img{width:100%;height:100%}.depict.plp .depict-slider .d-navbutton>div{display:flex}@media not all and (hover:none){.depict.plp .depict-slider .d-navbutton:hover svg{transform:scale(1.2)}}.depict.plp .depict-slider .d-navbutton:focus-visible svg{transform:scale(1.5)}.depict.plp .depict-slider .d-navbutton:focus-visible svg path{filter:drop-shadow(-2px -2px 4px #418fc3cc)drop-shadow(2px 2px 4px #418fc3cc)}.depict.plp .depict-slider .d-navbutton svg{transition-duration:.15s}.depict.plp .depict-slider .d-navbutton:active{opacity:.9}@keyframes depict_slider_button_unclickable{0%{pointer-events:all}to{pointer-events:none;visibility:hidden}}.depict.plp button.major{color:#fff;white-space:pre-wrap;cursor:pointer;background:#0f0f0f;border:1px solid #0000;border-radius:4px;justify-content:center;align-items:center;padding:10px 20px;transition:filter .15s ease-in-out,background .1s ease-in-out;display:flex}.depict.plp button.major svg path{fill:#fff}@media not all and (hover:none){.depict.plp button.major:not([disabled]):hover{filter:drop-shadow(-2px -2px 4px #ffffff40)drop-shadow(2px 2px 4px #00000026);background:#333335}}.depict.plp button.major:not([disabled]):active{filter:drop-shadow(2px 2px 4px #ffffff40)drop-shadow(-2px -2px 4px #00000026);background:#000}.depict.plp button.major:focus{outline-style:none}.depict.plp button.major:focus-visible{filter:drop-shadow(2px 2px 4px #418fc3cc)drop-shadow(-2px -2px 4px #418fc3cc);background:#333335}.depict.plp button.minor{color:#0f0f0f;white-space:pre-wrap;cursor:pointer;background:#fff;border:1px solid #0f0f0f;border-radius:4px;justify-content:center;align-items:center;padding:10px 20px;transition:filter .15s ease-in-out,background .1s ease-in-out;display:flex}.depict.plp button.minor svg path{fill:#0f0f0f}@media not all and (hover:none){.depict.plp button.minor:not([disabled]):hover{filter:drop-shadow(-2px -2px 4px #ffffff40)drop-shadow(2px 2px 4px #00000026);background:#f3f3f5}}.depict.plp button.minor:not([disabled]):active{filter:drop-shadow(2px 2px 4px #ffffff40)drop-shadow(-2px -2px 4px #00000026);background:#e4e4e5}.depict.plp button.minor:focus{outline-style:none}.depict.plp button.minor:focus-visible{filter:drop-shadow(-2px -2px 4px #418fc3cc)drop-shadow(2px 2px 4px #418fc3cc);background:#f3f3f5}.depict.plp .line-clamp{text-overflow:ellipsis;white-space:pre-line;overflow-wrap:anywhere;word-break:break-word;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.depict.plp .previous-searches .item,.depict.plp .previous-searches .suggestion,.depict.plp .suggestions .item,.depict.plp .suggestions .suggestion,.depict.plp .has-match{color:#333335;font-weight:400}.depict.plp .has-match .highlighted-part{color:#333335;font-weight:500}.depict.plp button.major .has-match{color:#f3f3f5}.depict.plp button.major .has-match .highlighted-part{color:#fff}.depict.search .previous-searches{flex-direction:column;display:flex}.depict.search .previous-searches>:not(:first-child){margin-top:7.5px}.depict.search .previous-searches>:not(:last-child){margin-bottom:7.5px}.depict.search .previous-searches .list{flex-direction:column;display:flex}.depict.search .previous-searches .list>:not(:first-child){margin-top:2.5px}.depict.search .previous-searches .list>:not(:last-child){margin-bottom:2.5px}.depict.search .previous-searches .list .item{overflow-wrap:anywhere;border-radius:4px;justify-content:space-between;align-items:center;padding:10px 20px;display:flex}.depict.search .previous-searches .list .item .left{align-items:center;display:flex}.depict.search .previous-searches .list .item .left>:not(:first-child){margin-left:5px}.depict.search .previous-searches .list .item .left>:not(:last-child){margin-right:5px}.depict.search .previous-searches .list .item .left svg{min-width:12px}.depict.search .previous-searches .list .item .left svg path{fill:#333335}.depict.search .previous-searches .list .item .delete{height:100%;cursor:pointer;background:0 0;justify-content:center;align-items:center;padding:0 10px;display:flex}.depict.search .previous-searches .list .item .delete:focus{outline:none}.depict.search .previous-searches .list .item .delete svg{width:13px;height:13px;transition-duration:.15s}.depict.search .previous-searches .list .item .delete svg path{fill:#333335}.depict.search .previous-searches .list .item .delete:hover svg{transform:scale(1.2)}.depict.search .previous-searches .list .item .delete:hover svg path{fill:#000}.depict.search .previous-searches .list .item .delete:focus-visible{filter:drop-shadow(-2px -2px 4px #418fc3cc)drop-shadow(2px 2px 4px #418fc3cc)}.depict.search .previous-searches .list .item .delete:focus-visible svg{transform:scale(1.2)}.depict.search .previous-searches .list .item .delete:focus-visible svg path{fill:#000}.depict.search .previous-searches .line-clamp,.depict.search .suggestions .line-clamp{-webkit-line-clamp:1}.depict.search .previous-searches .text,.depict.search .suggestions .text{color:#333335;margin-top:0;font-size:16px;font-weight:700}.depict.search .previous-searches .item,.depict.search .previous-searches .suggestion,.depict.search .suggestions .item,.depict.search .suggestions .suggestion{background:#fff}.depict.search .previous-searches .item.selected,.depict.search .previous-searches .suggestion.selected,.depict.search .suggestions .item.selected,.depict.search .suggestions .suggestion.selected{background:#e4e4e5}.depict.search .previous-searches .item:focus-visible,.depict.search .previous-searches .suggestion:focus-visible,.depict.search .suggestions .item:focus-visible,.depict.search .suggestions .suggestion:focus-visible{filter:drop-shadow(-2px -2px 4px #418fc3cc)drop-shadow(2px 2px 4px #418fc3cc);outline:none}.depict.search .previous-searches .item:active,.depict.search .previous-searches .suggestion:active,.depict.search .suggestions .item:active,.depict.search .suggestions .suggestion:active{background:#cbcbcc}.depict.search .previous-searches .item .with-icon,.depict.search .previous-searches .suggestion .with-icon,.depict.search .suggestions .item .with-icon,.depict.search .suggestions .suggestion .with-icon{justify-content:center;align-items:center;display:flex}.depict.search .previous-searches .item .with-icon>:not(:first-child),.depict.search .previous-searches .suggestion .with-icon>:not(:first-child),.depict.search .suggestions .item .with-icon>:not(:first-child),.depict.search .suggestions .suggestion .with-icon>:not(:first-child){margin-left:4px}.depict.search .previous-searches .item .with-icon>:not(:last-child),.depict.search .previous-searches .suggestion .with-icon>:not(:last-child),.depict.search .suggestions .item .with-icon>:not(:last-child),.depict.search .suggestions .suggestion .with-icon>:not(:last-child){margin-right:4px}.depict.search .suggestions{flex-direction:column;display:flex}.depict.search .suggestions>:not(:first-child){margin-top:10px}.depict.search .suggestions>:not(:last-child){margin-bottom:10px}.depict.search .suggestions:not(.compact)>.suggestion-container>:not(:first-child),.depict.search .suggestions.compact>.suggestion-container:not(.query)>:not(:first-child){margin-top:2.5px}.depict.search .suggestions:not(.compact)>.suggestion-container>:not(:last-child),.depict.search .suggestions.compact>.suggestion-container:not(.query)>:not(:last-child){margin-bottom:2.5px}.depict.search .suggestions .suggestion-container{flex-direction:column;display:flex}.depict.search .suggestions .suggestion-container .suggestion{overflow-wrap:anywhere;border-radius:4px;justify-content:space-between;align-items:center;padding:10px 20px;display:flex}.depict.search .suggestions .suggestion-container .suggestion svg{flex-shrink:0}.depict.search .suggestions .suggestion-container .suggestion svg path{fill:#333335}.depict.search .suggestions .suggestion-container .suggestion.type-category .with-parent-title{justify-content:center;align-items:center;padding-right:8px;display:flex}.depict.search .suggestions .suggestion-container .suggestion .search-icon{max-width:12px;max-height:13px}.depict.search .suggestions .suggestion-container .suggestion .search-icon svg{transform:matrix(.6,0,0,.6,-4.14,-4.32)}.depict.search .suggestions .suggestion-container .suggestion .category{margin-right:20px}.depict.search .suggestions .suggestion-container .suggestion .type{color:#868689;text-transform:capitalize;white-space:nowrap}.depict.search .suggestions .suggestion-container.query{flex-direction:column}.depict.search .suggestions .suggestion-container.query .suggestion{justify-content:flex-start}.depict.search .suggestions .suggestion-container.query .suggestion>:not(:first-child){margin-left:4px}.depict.search .suggestions .suggestion-container.query .suggestion>:not(:last-child){margin-right:4px}.depict.search .suggestions.compact>.suggestion-container.query{flex-flow:wrap;margin:-2.5px}.depict.search .suggestions.compact>.suggestion-container.query>*{margin:2.5px}.depict.search .category-suggestions{display:flex}.depict.search .category-suggestions .sliding{margin-bottom:-2px;padding-bottom:2px}.depict.search .category-suggestions .title{font-weight:500}.depict.search .category-suggestions .category-suggestion{color:#0f0f0f;height:100%;background:#fff;border:1px solid #e4e4e5;justify-content:space-between;align-items:center;padding:10px 20px;transition:background .1s ease-in-out;display:flex}.depict.search .category-suggestions .category-suggestion:focus-visible{background:#f3f3f5}@media not all and (hover:none){.depict.search .category-suggestions .category-suggestion:hover{background:#f3f3f5}}.depict.search .category-suggestions .category-suggestion:active{background:#e4e4e5}.depict.search .category-suggestions .category-suggestion>:not(:first-child){margin-left:5px}.depict.search .category-suggestions .category-suggestion>:not(:last-child){margin-right:5px}.depict.search .category-suggestions .category-suggestion .parent-title{font-weight:300}.depict.search .category-suggestions .category-suggestion>*{white-space:nowrap;font-size:.85em}.depict.search .instant-results{flex-direction:column;display:flex}.depict.search .instant-results>:not(:first-child){margin-top:2.5px}.depict.search .instant-results>:not(:last-child){margin-bottom:2.5px}.depict.search .instant-results .instant-card{background:#fff;border-radius:4px;flex:100%;padding:5px 20px;display:flex;overflow:hidden}.depict.search .instant-results .instant-card:hover,.depict.search .instant-results .instant-card:focus{z-index:2;box-shadow:2px 2px 4px #00000026,-4px -4px 4px #ffffff4d}.depict.search .instant-results .instant-card>:not(:first-child){margin-left:.75vw}.depict.search .instant-results .instant-card>:not(:last-child){margin-right:.75vw}.depict.search .instant-results .instant-card .img-part{flex:0 0 100px}.depict.search .instant-results .instant-card .right-part{flex-grow:1;justify-content:space-between;display:flex}.depict.search .instant-results .instant-card .right-part>:not(:first-child){margin-left:.75vw}.depict.search .instant-results .instant-card .right-part>:not(:last-child){margin-right:.75vw}.depict.search .instant-results .instant-card .right-part .title-brand-tagline{justify-content:center;align-items:center;display:flex}@media (min-width:601px){.depict.search .instant-results .instant-card .right-part .title-brand-tagline>:not(:first-child){margin-left:.75vw}.depict.search .instant-results .instant-card .right-part .title-brand-tagline>:not(:last-child){margin-right:.75vw}}@media (max-width:600px){.depict.search .instant-results .instant-card .right-part .title-brand-tagline{flex-direction:column;align-items:flex-start}.depict.search .instant-results .instant-card .right-part .title-brand-tagline>:not(:first-child){margin-top:.75vw}.depict.search .instant-results .instant-card .right-part .title-brand-tagline>:not(:last-child){margin-bottom:.75vw}}.depict.search .instant-results .instant-card .right-part .title-brand-tagline .title{-webkit-line-clamp:2}.depict.search .instant-results .instant-card .right-part .title-brand-tagline .tagline{color:#868689;font-size:.9em}.depict.search .instant-results .instant-card .right-part .price-container{justify-content:center;align-items:center;display:flex}@media (min-width:601px){.depict.search .instant-results .instant-card .right-part .price-container>:not(:first-child){margin-left:.75vw}.depict.search .instant-results .instant-card .right-part .price-container>:not(:last-child){margin-right:.75vw}}.depict.search .instant-results .instant-card .right-part .price-container .price:not(.orig){color:#333335;font-weight:700}.depict.search .instant-results .instant-card .right-part .price-container .price.orig{color:#868689;text-decoration:line-through}.depict.search .instant-results .instant-card .right-part .price-container .price.sales-price{color:#ff2e3e}@media (max-width:600px){.depict.search .instant-results .instant-card .right-part .price-container{flex-direction:column}.depict.search .instant-results .instant-card .right-part .price-container>:not(:first-child){margin-top:.75vw}.depict.search .instant-results .instant-card .right-part .price-container>:not(:last-child){margin-bottom:.75vw}.depict.search .instant-results .instant-card .right-part .price-container .price:not(.orig){order:0}.depict.search .instant-results .instant-card .right-part .price-container .price.orig{order:1}}.depict.search .search-field{z-index:calc(1 + 5);border-radius:10px;display:flex;box-shadow:0 4px 4px #0000000d}.depict.search .search-field input,.depict.search .search-field button{margin:0}.depict.search .search-field .query{font-size:initial;width:100%;color:#333335;background-color:#fff;border:none;border-radius:10px 0 0 10px;flex-grow:1;padding:14px 55px 14px 20px}.depict.search .search-field .query:focus{color:#000;outline:none}@media not all and (hover:none){.depict.search .search-field .query:hover{color:#000;outline:none}}.depict.search .search-field .query.has-adjacent-back-button{border-top-left-radius:0;border-bottom-left-radius:0;padding-left:0}.depict.search .search-field .field{flex-grow:1;display:flex;position:relative}.depict.search .search-field .back{cursor:pointer;background-color:#fff;border:none;border-top-left-radius:10px;border-bottom-left-radius:10px;justify-content:center;align-items:center;padding:14px 15px 14px 10px;display:flex}.depict.search .search-field .back svg path{fill:#333335}.depict.search .search-field .back:focus{outline:none}.depict.search .search-field .back:focus-visible{filter:drop-shadow(-2px -2px 4px #418fc3cc)drop-shadow(2px 2px 4px #418fc3cc)}.depict.search .search-field .back:focus-visible svg path{fill:#0f0f0f}@media not all and (hover:none){.depict.search .search-field .back:hover svg path{fill:#0f0f0f}}.depict.search .search-field .clear,.depict.search .search-field .submit{cursor:pointer}.depict.search .search-field .clear{background-color:#fff;border:none;padding:0;position:absolute;top:50%;right:30px;transform:translateY(-50%)scale(.8)}.depict.search .search-field .clear svg path{fill:#333335}.depict.search .search-field .clear:focus{outline:none}.depict.search .search-field .clear:focus-visible{filter:drop-shadow(-2px -2px 4px #418fc3cc)drop-shadow(2px 2px 4px #418fc3cc)}.depict.search .search-field .clear:focus-visible svg path{fill:#000}@media not all and (hover:none){.depict.search .search-field .clear:hover svg path{fill:#000}}.depict.search .search-field .submit{min-width:50px;border:none;border-radius:0 10px 10px 0;padding:0}.depict.search .search-field:not(.in-modal) .query{border-top:1px solid #cbcbcc;border-bottom:1px solid #cbcbcc;border-left:1px solid #cbcbcc}.depict.search .search-field:not(.in-modal) .submit{border-top:1px solid #cbcbcc;border-bottom:1px solid #cbcbcc;border-right:1px solid #cbcbcc}.depict.search .depict-search-modal-backdrop{z-index:5000;touch-action:none;background:#0006;position:fixed;inset:0}.depict.search .depict-search-modal{justify-content:center;display:flex}.depict.search .depict-search-modal .search-field{z-index:calc(5000 + 5)}.depict.search .depict-search-modal .body{max-width:800px;z-index:calc(5000 + 1);background:#f3f3f5;border-radius:10px;flex-direction:column;display:flex}@media (hover:hover) and (pointer:fine) and (max-height:790px){.depict.search .depict-search-modal .body{max-height:100%;position:fixed;top:0}}@media (hover:hover) and (pointer:fine) and (max-height:790px) and (max-width:600px){.depict.search .depict-search-modal .body{width:calc(100% - 30px);left:30px}}@media not all and (hover:hover) and (pointer:fine){@media (max-height:1000px){.depict.search .depict-search-modal .body{max-height:100%;position:fixed;top:0}}@media (max-height:1000px) and (max-width:600px){.depict.search .depict-search-modal .body{width:calc(100% - 30px);left:30px}}}.depict.search .depict-search-modal .body .padded>*,.depict.search .depict-search-modal .body .search-field{flex-shrink:0}.depict.search .depict-search-modal .body .padded{flex-direction:column;padding-top:20px;padding-left:max(1vw,10px);padding-right:max(1vw,10px);display:flex;overflow:auto}.depict.search .depict-search-modal .body .padded>:not(:first-child){margin-top:10px}.depict.search .depict-search-modal .body .padded>:not(:last-child){margin-bottom:10px}.depict.search .depict-search-modal .body .discover-more{justify-content:center;display:flex}.depict.search .depict-search-modal .body .discover-more button{text-transform:uppercase;margin:20px 0;padding:12px 18px}.depict.search .listing-page .content-results{margin-bottom:20px}@media (max-width:651px){.depict.search .listing-page .content-results{margin-bottom:16px}}.depict.search .listing-page .search-field{width:min(100%,800px);align-self:center;margin-top:40px;margin-bottom:20px}@media (max-width:651px){.depict.search .listing-page .search-field{margin-top:16px;margin-bottom:16px}}.depict.search .listing-page .search-field~.category-suggestions .category-suggestion:last-child{margin-right:auto}.depict.search .listing-page .search-field~.category-suggestions .category-suggestion:first-child{margin-left:auto}.depict.search .listing-page .category-suggestions{margin-bottom:20px}@media (max-width:651px){.depict.search .listing-page .category-suggestions{margin-bottom:16px}}@media (min-width:652px){.depict.search .listing-page .search-field+.filter-results-for-one-row,.depict.search .listing-page .search-field+.results-for{margin-top:20px}}.depict.search .listing-page .search-recs{margin-top:60px;padding-top:60px}@media (max-width:651px){.depict.search .listing-page .search-recs{margin-top:48px;padding-top:48px}}.depict.search .listing-page .PLP-results.nothing+.search-recs{margin-top:30px;padding-top:30px}@media (max-width:651px){.depict.search .listing-page .PLP-results.nothing+.search-recs{margin-top:24px;padding-top:24px}}.depict.search .listing-page .search-recs{border-top:2px solid #e4e4e5;flex-direction:column;display:flex}.depict.search .listing-page .search-recs .search-recs-title{margin-top:0;margin-bottom:20px;font-size:24px;font-weight:600;line-height:1}.depict.search .listing-page .search-recs .load-more-container{margin-top:30px}.depict.search .results-for{overflow-wrap:anywhere;font-size:1.5em}.depict.search .listing-page .content-results{flex-direction:column;display:flex}.depict.search .listing-page .content-results .results-for{margin-bottom:20px}@media (max-width:651px){.depict.search .listing-page .content-results .results-for{margin-bottom:16px}}.depict.search .listing-page .content-results .load-more-container,.depict.search .listing-page .content-results .load-less-container{margin-top:8px}.depict.search .listing-page .content-results .view-more,.depict.search .listing-page .content-results .view-less{color:#0f0f0f;text-underline-offset:2px;background:0 0;border:none;padding:0;font-size:1em;text-decoration:underline}@media not all and (hover:none){.depict.search .listing-page .content-results .view-more:hover,.depict.search .listing-page .content-results .view-less:hover{color:#333335;cursor:pointer}}.depict.search .listing-page .content-results .view-more:focus-visible,.depict.search .listing-page .content-results .view-less:focus-visible{outline:1px solid #fff;box-shadow:0 0 0 3.5px #0f0f0f}.depict.search .listing-page .content-results .view-more:active,.depict.search .listing-page .content-results .view-less:active{color:#000}.depict.search .content-card{display:flex}.depict.search .content-card:has(.content-title:focus-visible){background:#e4e4e5}.depict.search .content-card .info{flex-direction:column;flex-grow:1;display:flex}.depict.search .content-card .info>:not(:first-child){margin-top:4px}.depict.search .content-card .info>:not(:last-child){margin-bottom:4px}.depict.search .content-card .highlighted-part{color:#000;font-weight:600}@media not all and (hover:none){.depict.search .content-card:has(.image a:hover) .content-title{color:#333335;text-decoration:underline}}.depict.search .content-card .content-title{-webkit-line-clamp:1;color:#0f0f0f;align-self:flex-start;font-size:1.2em;font-weight:500}@media not all and (hover:none){.depict.search .content-card .content-title:hover,.depict.search .content-card .content-title:hover .highlighted-part{color:#333335;text-decoration:underline}}.depict.search .content-card .content-title:focus-visible{color:#333335;text-decoration:underline}.depict.search .content-card .content-title:active,.depict.search .content-card .content-title:active .highlighted-part{color:#000}.depict.search .content-card .description{-webkit-line-clamp:2;color:#333335}.depict.search .content-card .image{flex-direction:column;display:flex}.depict.search .content-card .image>*{padding-right:8px}.depict.search .content-card .image svg path{fill:#0f0f0f}.depict.category .crumbs{flex-wrap:wrap;display:flex}.depict.category .crumbs .crumb{color:#333335}.depict.category .crumbs .crumb:hover{text-decoration:underline}.depict.category .crumbs .crumb:last-of-type{color:#0f0f0f;font-weight:500}.depict.category .crumbs .separator{color:#868689;margin-left:10px;margin-right:10px}.depict.category .quicklinks{overflow:hidden}.depict.category .quicklinks .quicklink{white-space:nowrap;color:#0f0f0f;background:#fff;border:1px solid #cbcbcc;border-radius:4px;padding:10px 20px;transition:all 75ms ease-in-out}.depict.category .quicklinks .quicklink:focus{outline:none}@media not all and (hover:none){.depict.category .quicklinks .quicklink:hover{background:#f3f3f5}}.depict.category .quicklinks .quicklink:focus-visible{filter:drop-shadow(-2px -2px 4px #418fc3cc)drop-shadow(2px 2px 4px #418fc3cc);background:#f3f3f5}.depict.category .quicklinks .quicklink:active{background:#e4e4e5}.depict.category .quicklinks .quicklink.selected{color:#fff;background:#0f0f0f;border:1px solid #0000}@media not all and (hover:none){.depict.category .quicklinks .quicklink.selected:hover{background:#333335}}.depict.category .quicklinks .quicklink.selected:focus-visible{filter:drop-shadow(2px 2px 4px #418fc3cc)drop-shadow(-2px -2px 4px #418fc3cc);background:#333335}.depict.category .quicklinks .quicklink.selected:active{background:#000}.depict.category .category-title{overflow-wrap:anywhere;flex-wrap:wrap;align-items:center;font-size:1.5em;display:flex}.depict.category .category-title *{align-items:center;display:flex}.depict.category .category-title .title{font-weight:700;font-size:inherit;margin-right:10px}.depict.category .category-title .explanation{color:#868689;font-weight:500}.depict.category .category-title .explanation .product-count{margin-left:10px}.depict.category .listing-page .quicklinks,.depict.category .listing-page .crumbs{margin-bottom:20px}@media (max-width:651px){.depict.category .listing-page .quicklinks,.depict.category .listing-page .crumbs{margin-bottom:16px}}.depict.plp.toast{z-index:calc(5000 + 5);white-space:nowrap;border-bottom-style:solid;border-bottom-width:2px;background:#fff;border-image-source:linear-gradient(90deg,#0f0f0f 0% 100%);border-image-slice:0 0 100%;border-radius:4px;padding:10px 20px;position:fixed;bottom:10px;left:50%;transform:translate(-50%);box-shadow:2px 2px 4px #0000000d}.depict.plp.toast *,.depict.plp.toast *{-webkit-user-select:none;user-select:none}@media (min-width:1000px){.depict.plp.toast{padding:10px 40px}}.depict.plp.toast,.depict.plp.toast .buttons{justify-content:center;align-items:center;display:flex}@media (max-width:999px){.depict.plp.toast>:not(:first-child),.depict.plp.toast .buttons>:not(:first-child){margin-left:5px}.depict.plp.toast>:not(:last-child),.depict.plp.toast .buttons>:not(:last-child){margin-right:5px}}@media (min-width:1000px){.depict.plp.toast>:not(:first-child),.depict.plp.toast .buttons>:not(:first-child){margin-left:15px}.depict.plp.toast>:not(:last-child),.depict.plp.toast .buttons>:not(:last-child){margin-right:15px}}.depict.plp.toast{color:#0f0f0f}.depict.plp.toast button{cursor:pointer;border-radius:4px;padding:5px 20px}.depict-placeholder{will-change:mask,-webkit-mask;mask-position-x:125%;mask-position-y:50%;-webkit-mask-image: ;-webkit-mask-image: ;mask-image: ;-webkit-mask-size: ;-webkit-mask-size: ;mask-size: ;background:#ddd;animation:1.5s linear infinite depict-placeholder;display:inline-block;overflow:hidden;-webkit-mask:linear-gradient(-60deg,#000 30%,#0005,#000 70%) 125%/300% 100%}@keyframes depict-placeholder{0%{mask-position-x:125%;-webkit-mask-position-x:125%}10%{mask-position-x:125%;-webkit-mask-position-x:125%}90%{mask-position-x:-25%;-webkit-mask-position-x:-25%}to{mask-position-x:-25%;-webkit-mask-position-x:-25%}}
1
+ .depict.plp{color:#0f0f0f}.depict.plp button{border:none}.depict.plp a{text-decoration:none}.depict.plp,.depict.plp *{box-sizing:border-box}.depict.plp .listing-page{flex-direction:column;display:flex}.depict.plp .listing-page .no-results{background:#fff;flex-direction:column;flex-grow:2;justify-content:flex-start;align-items:center;padding:40px;display:flex}.depict.plp .listing-page .no-results>:not(:first-child){margin-top:3px}.depict.plp .listing-page .no-results>:not(:last-child){margin-bottom:3px}.depict.plp .listing-page .no-results .hint{cursor:pointer;color:#333335;text-decoration:underline}.depict.plp .listing-page .no-results .text{font-size:2em;font-weight:700}.depict.plp .cards:not(.css-grid){flex-flow:wrap;display:flex}.depict.plp .cards{flex-grow:1;align-content:flex-start;overflow:hidden}.depict.plp .load-more-container,.depict.plp .load-less-container{justify-content:center;display:flex}.depict.plp .listing-page{padding:20px 10px}@media (max-width:651px){.depict.plp .listing-page{padding:16px 8px}}.depict.plp .listing-page>.filter-results-for-one-row,.depict.plp .listing-page>.results-for{margin-bottom:10px}@media (max-width:651px){.depict.plp .listing-page>.filter-results-for-one-row,.depict.plp .listing-page>.results-for{margin-bottom:8px}}.depict.plp .listing-page>.sort-and-filter-buttons{margin-top:10px;margin-bottom:10px}@media (max-width:651px){.depict.plp .listing-page>.sort-and-filter-buttons{margin-top:8px;margin-bottom:8px}}.depict.plp .listing-page .PLP-results{margin-top:10px;display:flex}@media (max-width:651px){.depict.plp .listing-page .PLP-results{margin-top:8px}}.depict.plp .listing-page .PLP-results>.filters,.depict.plp .listing-page .PLP-results>.sorting{margin-left:12px}.depict.plp .listing-page .selected-filters .inner{align-items:center;margin-top:0;margin-bottom:0;display:flex}.depict.plp .listing-page .selected-filters .inner .title{margin-right:10px}@media (max-width:651px){.depict.plp .listing-page .selected-filters .inner{margin-top:10px;margin-bottom:10px}}.depict.plp .listing-page .selected-filters .inner .title{text-transform:uppercase;color:#0f0f0f;font-size:1.1em}@media (max-width:600px){.depict.plp .listing-page .selected-filters .inner .title{display:none}}.depict.plp .listing-page .selected-filters .inner .depict-slider{width:unset;overflow:hidden}.depict.plp .listing-page .selected-filters .inner .depict-slider .clear-filter{border:1px solid #0f0f0f}.depict.plp .listing-page .selected-filters .inner .depict-slider .clear-filter svg{width:12.64px;height:12.64px}.depict.plp .listing-page .selected-filters .inner .depict-slider .clear-all-filters{border:1px solid #0f0f0f}.depict.plp .listing-page .selected-filters .inner .depict-slider .clear-filter,.depict.plp .listing-page .selected-filters .inner .depict-slider .clear-all-filters{white-space:nowrap;cursor:pointer;border-radius:4px;align-items:center;padding:5px 10px;font-size:1em;line-height:1;display:flex}.depict.plp .listing-page .selected-filters .inner .depict-slider .clear-filter>:not(:first-child),.depict.plp .listing-page .selected-filters .inner .depict-slider .clear-all-filters>:not(:first-child){margin-left:2.5px}.depict.plp .listing-page .selected-filters .inner .depict-slider .clear-filter>:not(:last-child),.depict.plp .listing-page .selected-filters .inner .depict-slider .clear-all-filters>:not(:last-child){margin-right:2.5px}.depict.plp .scroll-status{pointer-events:none;white-space:nowrap;z-index:calc(5000 + 4);opacity:0;justify-content:center;align-items:center;display:flex;position:sticky;bottom:10vh}.depict.plp .scroll-status .text{color:#fff;background:#333335bf;border-radius:20px;padding:10px 20px}.depict.plp .major-minor-transition{transition:filter .15s ease-in-out,background .25s ease-in-out,color .25s ease-in-out,border .25s ease-in-out}.depict.plp .filter-results-for-one-row{justify-content:space-between;align-items:center;display:flex}.depict.plp :not(.filter-results-for-one-row)>.sort-and-filter-buttons .inner{justify-content:space-between}.depict.plp .sorting-attributes,.depict.plp .sorting-direction{flex-direction:column;padding:10px;display:flex}.depict.plp .sorting-attributes>:not(:first-child),.depict.plp .sorting-direction>:not(:first-child){margin-top:5px}.depict.plp .sorting-attributes>:not(:last-child),.depict.plp .sorting-direction>:not(:last-child){margin-bottom:5px}.depict.plp .sort-and-filter-buttons .outer{margin-top:-5px}.depict.plp .sort-and-filter-buttons .inner{justify-content:flex-end;align-items:center;padding-top:5px;display:flex;overflow:hidden}.depict.plp .sort-and-filter-buttons .inner>:not(:first-child){margin-left:5px}.depict.plp .sort-and-filter-buttons .inner>:not(:last-child){margin-right:5px}.depict.plp .sort-and-filter-buttons.fake .toggle-button{transition:none}.depict.plp .sort-and-filter-buttons .toggle-button{white-space:nowrap;position:relative}.depict.plp .sort-and-filter-buttons .toggle-button>:not(:first-child){margin-left:2.5px}.depict.plp .sort-and-filter-buttons .toggle-button>:not(:last-child){margin-right:2.5px}.depict.plp .sort-and-filter-buttons .toggle-button svg path{transition-duration:.25s}.depict.plp .sort-and-filter-buttons .toggle-button.major.for-sorting>:not(:first-child){margin-left:5px}.depict.plp .sort-and-filter-buttons .toggle-button.major.for-sorting>:not(:last-child){margin-right:5px}.depict.plp .sort-and-filter-buttons .num-filters{color:#fff;width:20px;height:20px;z-index:calc(1 + 1);background:#0f0f0f;border-radius:13px;justify-content:center;align-items:center;font-size:12px;line-height:1;transition:opacity .25s ease-in-out;display:flex;position:absolute;top:-4px;right:-4px}.depict.plp .sort-and-filter-buttons .open-filters-button-container{position:relative}.depict.plp label{margin:0}.depict.plp .PLP-results .sorting,.depict.plp .PLP-results .filters{flex-shrink:0;flex-basis:330px}.depict.plp .filters .body,.depict.plp .sorting .body{flex-direction:column;display:flex}.depict.plp .filters .body .input-row,.depict.plp .sorting .body .input-row{position:relative}.depict.plp .filters .body .input-row:not(.count-0),.depict.plp .sorting .body .input-row:not(.count-0){cursor:pointer}.depict.plp .filters .body .input-row .custom-indicator,.depict.plp .sorting .body .input-row .custom-indicator{margin-right:10px;position:relative}.depict.plp .filters .body .input-row input,.depict.plp .sorting .body .input-row input{opacity:0;cursor:pointer;height:0;width:0;position:absolute}.depict.plp .filters .body .input-row .custom-indicator:after,.depict.plp .sorting .body .input-row .custom-indicator:after{content:"";display:none;position:absolute}.depict.plp .filters .body .input-row input[type=checkbox]~.custom-indicator,.depict.plp .sorting .body .input-row input[type=checkbox]~.custom-indicator{background-color:#fff;border-radius:2px;padding:9px}.depict.plp .filters .body .input-row input[type=checkbox]~.custom-indicator:not(.color),.depict.plp .sorting .body .input-row input[type=checkbox]~.custom-indicator:not(.color){border:1px solid #0f0f0f}.depict.plp .filters .body .input-row input[type=checkbox]~.custom-indicator.color,.depict.plp .sorting .body .input-row input[type=checkbox]~.custom-indicator.color{border:.5px solid #868689;padding:9.5px}.depict.plp .filters .body .input-row input[type=checkbox]:checked~.custom-indicator,.depict.plp .sorting .body .input-row input[type=checkbox]:checked~.custom-indicator{background-color:#0f0f0f}.depict.plp .filters .body .input-row input[type=checkbox]:checked~.custom-indicator:after,.depict.plp .sorting .body .input-row input[type=checkbox]:checked~.custom-indicator:after{fill:#fff;color:#fff;width:13px;height:10px;background-image:url("data:image/svg+xml;utf8,<svg fill=\"%23FFFFFF\" width=\"12\" height=\"10\" viewBox=\"0 0 12 10\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12 2.0001L10.6 0.600098L4 7.2001L1.4 4.6001L0 6.0001L4 10.0001L12 2.0001Z\" /></svg>");background-repeat:round;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.depict.plp .filters .body .input-row input[type=checkbox]:checked~.custom-indicator.color:after,.depict.plp .sorting .body .input-row input[type=checkbox]:checked~.custom-indicator.color:after{background-image:url("data:image/svg+xml;utf8,<svg fill=\"%23FFFFFF\" width=\"12\" height=\"10\" viewBox=\"0 0 12 10\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12 2.0001L10.6 0.600098L4 7.2001L1.4 4.6001L0 6.0001L4 10.0001L12 2.0001Z\" /></svg>")}.depict.plp .filters .body .input-row input[type=checkbox]:checked~.custom-indicator.color.black-check:after,.depict.plp .sorting .body .input-row input[type=checkbox]:checked~.custom-indicator.color.black-check:after{background-image:url("data:image/svg+xml;utf8,<svg fill=\"%23000000\" width=\"12\" height=\"10\" viewBox=\"0 0 12 10\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12 2.0001L10.6 0.600098L4 7.2001L1.4 4.6001L0 6.0001L4 10.0001L12 2.0001Z\" /></svg>")}.depict.plp .filters .body .input-row input[type=checkbox]:focus-visible~.custom-indicator,.depict.plp .sorting .body .input-row input[type=checkbox]:focus-visible~.custom-indicator{outline:2.5px solid #fff;box-shadow:0 0 0 4px #0f0f0f}@media not all and (hover:none){.depict.plp .filters .body .input-row:hover input[type=checkbox]:not([disabled])~.custom-indicator,.depict.plp .sorting .body .input-row:hover input[type=checkbox]:not([disabled])~.custom-indicator{background-color:#f3f3f5}.depict.plp .filters .body .input-row:hover input[type=checkbox]:not([disabled])~.custom-indicator:not(.color),.depict.plp .sorting .body .input-row:hover input[type=checkbox]:not([disabled])~.custom-indicator:not(.color){border:2px solid #0f0f0f;padding:8px}.depict.plp .filters .body .input-row:hover input[type=checkbox]:not([disabled]):checked~.custom-indicator,.depict.plp .sorting .body .input-row:hover input[type=checkbox]:not([disabled]):checked~.custom-indicator{background-color:#333335}}.depict.plp .filters .body .input-row input[type=checkbox][disabled]~.custom-indicator:not(.color),.depict.plp .sorting .body .input-row input[type=checkbox][disabled]~.custom-indicator:not(.color){border:1px solid #cbcbcc;padding:9px}.depict.plp .filters .body .input-row input[type=radio]~.custom-indicator,.depict.plp .sorting .body .input-row input[type=radio]~.custom-indicator{background-color:#fff;border:1px solid #0f0f0f;border-radius:50%;padding:9px}.depict.plp .filters .body .input-row input[type=radio]:checked~.custom-indicator,.depict.plp .sorting .body .input-row input[type=radio]:checked~.custom-indicator{background-color:#0000}.depict.plp .filters .body .input-row input[type=radio]:checked~.custom-indicator:after,.depict.plp .sorting .body .input-row input[type=radio]:checked~.custom-indicator:after{width:12px;height:12px;background-color:#0f0f0f;border-radius:50%;display:block;top:50%;left:50%;transform:translate(-50%,-50%)}.depict.plp .filters .body .input-row input[type=radio]:focus-visible~.custom-indicator,.depict.plp .sorting .body .input-row input[type=radio]:focus-visible~.custom-indicator{outline:2.5px solid #fff;box-shadow:0 0 0 4px #0f0f0f}@media not all and (hover:none){.depict.plp .filters .body .input-row:hover input[type=radio]:not([disabled])~.custom-indicator,.depict.plp .sorting .body .input-row:hover input[type=radio]:not([disabled])~.custom-indicator{background-color:#f3f3f5;border:2px solid #0f0f0f;padding:8px}.depict.plp .filters .body .input-row:hover input[type=radio]:checked~.custom-indicator:after,.depict.plp .sorting .body .input-row:hover input[type=radio]:checked~.custom-indicator:after{background-color:#333335}}.depict.plp .filters .search-in-filters{display:flex;position:relative}.depict.plp .filters .search-in-filters>:not(input){position:absolute}.depict.plp .filters .search-in-filters .clear-filter-search{cursor:pointer;background:0 0;transition:transform .1s ease-in-out;display:flex;right:10px}.depict.plp .filters .search-in-filters .clear-filter-search path{transition-duration:.1s}.depict.plp .filters .search-in-filters .clear-filter-search:focus{outline:none}.depict.plp .filters .search-in-filters .clear-filter-search:focus-visible{filter:drop-shadow(-2px -2px 4px #418fc3cc)drop-shadow(2px 2px 4px #418fc3cc);transform:scale(1.4)translateY(-35.7143%)}.depict.plp .filters .search-in-filters .clear-filter-search:focus-visible svg path{fill:#000}@media not all and (hover:none){.depict.plp .filters .search-in-filters .clear-filter-search:hover svg path{fill:#000}}.depict.plp .filters .search-in-filters .search-icon{pointer-events:none;order:0;left:10px}.depict.plp .filters .search-in-filters .search-icon path{transition-duration:.15s}.depict.plp .filters .search-in-filters .clear-filter-search,.depict.plp .filters .search-in-filters .search-icon{top:50%;transform:translateY(-50%)}.depict.plp .filters .search-in-filters .clear-filter-search path,.depict.plp .filters .search-in-filters .search-icon path{fill:#868689}.depict.plp .filters .search-in-filters .query{color:#333335;border:1px solid #cbcbcc;border-radius:4px;flex-grow:1;padding:10px 36px;font-size:1em;line-height:1}.depict.plp .filters .search-in-filters .query::-webkit-input-placeholder{color:#868689}.depict.plp .filters .search-in-filters .query:-moz-placeholder{color:#868689}.depict.plp .filters .search-in-filters .query::placeholder{color:#868689}@media not all and (hover:none){.depict.plp .filters .search-in-filters .query:hover{color:#0f0f0f}.depict.plp .filters .search-in-filters .query:hover~.search-icon path{fill:#0f0f0f}}.depict.plp .filters .search-in-filters .query:focus{color:#000;border:1px solid #0f0f0f;outline:none}.depict.plp .filters .search-in-filters .query:focus~svg path,.depict.plp .filters .search-in-filters .query:focus~button svg path{fill:#000}.depict.plp .filters .body .input-row{justify-content:space-between;padding-top:5px;padding-bottom:5px}.depict.plp .filters .body .input-row,.depict.plp .filters .body .input-row>.left{align-items:center;display:flex}.depict.plp .filters .body .input-row .text{color:#333335;-webkit-line-clamp:1;font-weight:400;line-height:20px}.depict.plp .filters .body .input-row :checked~.text,.depict.plp .filters .body .input-row .fake-checked~.text{color:#0f0f0f;font-weight:500}.depict.plp .filters .body .input-row.count-0 *+.text{color:#cbcbcc}.depict.plp .filters .body .count{color:#868689;font-weight:400}.depict.plp .filters .body .input-row:not(.count-0):hover .count{color:#000}.depict.plp .filters .body .count-0 .count,.depict.plp .filters .body .count.count-0{color:#cbcbcc}.depict.plp .filters .body .selected-w-sign{align-items:center;display:flex}.depict.plp .filters .body .selected-w-sign>:not(:first-child){margin-left:5px}.depict.plp .filters .body .selected-w-sign>:not(:last-child){margin-right:5px}.depict.plp .filters .body .selected-w-sign .show-selected{color:#868689;fill:#868689;align-items:center;display:flex}.depict.plp .filters .body .selected-w-sign .show-selected>:not(:first-child){margin-left:2.5px}.depict.plp .filters .body .selected-w-sign .show-selected>:not(:last-child){margin-right:2.5px}.depict.plp .filters .body .selected-w-sign .show-selected span{line-height:1}.depict.plp .filters .body .ungrouped{margin-top:25px}.depict.plp .filters .body .clear-all-filters{text-transform:uppercase;margin-top:5px;padding:.7em;font-size:1.1em;font-weight:400}.depict.plp .filters .body details summary{cursor:pointer;list-style:none}.depict.plp .filters .body details summary::-webkit-details-marker{display:none}.depict.plp .filters .body details summary>.summary{justify-content:space-between;align-items:center;display:flex}.depict.plp .filters .body details.filter-collapsible{border-top:1px solid #cbcbcc}.depict.plp .filters .body details.filter-collapsible .filter-group-summary:focus{outline:none}.depict.plp .filters .body details.filter-collapsible .filter-group-summary:focus-visible{background:#f3f3f5}@media not all and (hover:none){.depict.plp .filters .body details.filter-collapsible .filter-group-summary:hover{background:#f3f3f5}}.depict.plp .filters .body details.filter-collapsible .filter-group-summary:active{background:#eeeef0}.depict.plp .filters .body details.filter-collapsible .filter-group-summary>.summary{color:#333335;padding:15px 10px}.depict.plp .filters .body details.filter-collapsible .filter-group-summary>.summary>svg{transform:rotate(270deg)}.depict.plp .filters .body details.filter-collapsible[open] .filter-group-summary{border-bottom:1px solid #e4e4e5}.depict.plp .filters .body details.filter-collapsible[open] .filter-group-summary>.summary>span{font-weight:500}.depict.plp .filters .body .filter-collapsible-body{border-radius:0 0 4px 4px;flex-direction:column;margin-bottom:15px;display:flex;overflow:hidden}.depict.plp .filters .body .filter-collapsible-body>:not(:first-child){margin-top:.5px}.depict.plp .filters .body .filter-collapsible-body>:not(:last-child){margin-bottom:.5px}.depict.plp .filters .body .filter-collapsible-body .view-more-clear{border-top:1px solid #e4e4e5;justify-content:space-between;display:flex}.depict.plp .filters .body .filter-collapsible-body .view-more-clear .clear-group{margin-left:auto}.depict.plp .filters .body .filter-collapsible-body .view-more-clear .clear-group>:not(:first-child){margin-left:1.839px}.depict.plp .filters .body .filter-collapsible-body .view-more-clear .clear-group>:not(:last-child){margin-right:1.839px}.depict.plp .filters .body .filter-collapsible-body .view-more-clear .clear-group svg{width:11px;height:12px}.depict.plp .filters .body .filter-collapsible-body .view-more-clear .expand-filter{margin-right:auto}.depict.plp .filters .body .filter-collapsible-body .view-more-clear .expand-filter>:not(:first-child){margin-left:5px}.depict.plp .filters .body .filter-collapsible-body .view-more-clear .expand-filter>:not(:last-child){margin-right:5px}.depict.plp .filters .body .filter-collapsible-body .view-more-clear .expand-filter.expanded svg{clip-path:polygon(20% 48%,80% 48%,80% 50.8%,20% 50.8%);transform:scale(1.6)}.depict.plp .filters .body .filter-collapsible-body .view-more-clear button{color:#333335;cursor:pointer;text-transform:uppercase;background:0 0;border:none;justify-content:center;align-items:center;margin-bottom:0;margin-left:0;margin-right:0;padding:10px;display:flex}.depict.plp .filters .body .filter-collapsible-body .view-more-clear button svg path{fill:#333335}@media not all and (hover:none){.depict.plp .filters .body .filter-collapsible-body .view-more-clear button:hover{color:#4c4c4f}}.depict.plp .filters .body .filter-collapsible-body .view-more-clear button:active{color:#000}.depict.plp .filters .body .filter-collapsible-body .view-more-clear button:focus-visible{filter:drop-shadow(-2px -2px 4px #418fc3cc)drop-shadow(2px 2px 4px #418fc3cc);outline:none}.depict.plp .filters .body .filter-collapsible-body .filter-part{flex-direction:column;padding:15px 10px 20px;display:flex}.depict.plp .filters .body .filter-collapsible-body .filter-part>:not(:first-child){margin-top:5px}.depict.plp .filters .body .filter-collapsible-body .filter-part>:not(:last-child){margin-bottom:5px}.depict.plp .filters .body :not(.ungrouped)>form{margin-top:-5px;margin-bottom:-5px}.depict.plp .filters .body .hierarchical{margin-left:-20px}.depict.plp .filters .body .hierarchical.any-expandable .count{margin-right:30px}.depict.plp .filters .body .hierarchical .checkbox-details{padding-left:20px}.depict.plp .filters .body .hierarchical .checkbox-details.expandable{position:relative}.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:before,.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:after{pointer-events:none;content:"";height:1px;width:calc(100% - 20px);background:#f3f3f5;position:absolute;right:0}.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:before{top:-.5px}.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:after{bottom:-.5px}@media not all and (hover:none){.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:hover:after,.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:hover:before,.input-row:hover~details>.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:after,.input-row:hover~details>.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:before{z-index:1;background:#e4e4e5}}.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:focus-visible:after,.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:focus-visible:before,.input-row~details:focus-visible>.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:after,.input-row~details:focus-visible>.depict.plp .filters .body .hierarchical .checkbox-details.expandable summary:before{z-index:1;background:#e4e4e5}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>.input-row{padding-right:30px;position:absolute}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details:not([open]),.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details[open]>.category-parent>.summary{padding-top:5px;padding-bottom:5px}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:focus,.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:focus-visible{box-shadow:none;outline:none}@supports selector(:focus-visible){@media not all and (hover:none){.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:not(:focus-visible):not(:hover) .morphing-sign span{background:#333335}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:not(:focus-visible):not(:hover) .morphing-sign span:first-child{width:5%;left:47.5%}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:not(:focus-visible):not(:hover) .morphing-sign span:last-child{height:5%;top:47.5%}}@media (hover:none){.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:not(:focus-visible) .morphing-sign span{background:#333335}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:not(:focus-visible) .morphing-sign span:first-child{width:5%;left:47.5%}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:not(:focus-visible) .morphing-sign span:last-child{height:5%;top:47.5%}}@media not all and (hover:none){.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:hover .morphing-sign{transform:scale(1.5)}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:hover .count:not(.count-0){color:#000}}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:focus-visible .count{color:#000}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:focus-visible .morphing-sign{transform:scale(1.5)}}@supports not selector(:focus-visible){@media not all and (hover:none){.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:not(:hover) .morphing-sign span{background:#333335}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:not(:hover) .morphing-sign span:first-child{width:5%;left:47.5%}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:not(:hover) .morphing-sign span:last-child{height:5%;top:47.5%}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:hover .morphing-sign{transform:scale(1.5)}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent:hover .count:not(.count-0){color:#000}}@media (hover:none){.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent .morphing-sign span{background:#333335}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent .morphing-sign span:first-child{width:5%;left:47.5%}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent .morphing-sign span:last-child{height:5%;top:47.5%}}}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent>.summary{justify-content:flex-end}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent>.summary .count{margin-right:10px}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent>.summary .morphing-sign{width:20px;height:20px;transition-duration:.15s;transition-timing-function:ease-in-out}.depict.plp .filters .body .hierarchical .checkbox-details.expandable>details .category-parent>.summary .morphing-sign span{background:#333335;transition-duration:.15s;transition-timing-function:ease-in-out}.depict.plp .filters .body .range .input-group{width:100%;flex-wrap:nowrap;padding-top:10px;padding-bottom:25px;display:flex}.depict.plp .filters .body .range .input-group .field{width:100%;align-items:center;display:flex}.depict.plp .filters .body .range .input-group .field input{width:100%;text-align:center;-moz-appearance:textfield;color:#868689;background:#f3f3f5;border:.5px solid #0f0f0f;outline:none;padding-top:8px;padding-bottom:8px;transition-duration:50ms}.depict.plp .filters .body .range .input-group .field input:focus-visible{background:#e4e4e5}@media not all and (hover:none){.depict.plp .filters .body .range .input-group .field input:hover{background:#e4e4e5}}.depict.plp .filters .body .range .input-group .field input::-webkit-outer-spin-button,.depict.plp .filters .body .range .input-group .field input::-webkit-inner-spin-button{-webkit-appearance:none}.depict.plp .filters .body .range .input-group .separator{color:#333335;flex-shrink:0;flex-basis:25px;justify-content:center;align-items:center;font-size:19px;display:flex}.depict.plp .filters .body .range .slider{height:5px;background:#e4e4e5;border-radius:5px;position:relative}.depict.plp .filters .body .range .slider .progress{height:100%;background:#0f0f0f;border-radius:5px;position:absolute;left:25%;right:25%}.depict.plp .filters .body .range .range-group{position:relative}.depict.plp .filters .body .range .range-group input{width:100%;height:0;pointer-events:none;-webkit-appearance:none;-moz-appearance:none;background:0 0;margin:0;position:absolute;top:-2.5px}.depict.plp .filters .body .range .range-group input:focus{outline:none}.depict.plp .filters .body .range .range-group input::-webkit-slider-thumb{cursor:pointer;height:20px;width:20px;pointer-events:auto;-webkit-appearance:none;background:#0f0f0f;border-radius:50%;box-shadow:0 0 6px #0000000d}@media not all and (hover:none){.depict.plp .filters .body .range .range-group input::-webkit-slider-thumb:hover{background:#333335}}.depict.plp .filters .body .range .range-group input::-moz-range-thumb{cursor:pointer;height:20px;width:20px;pointer-events:auto;-moz-appearance:none;background:#0f0f0f;border:none;border-radius:50%;box-shadow:0 0 6px #0000000d}@media not all and (hover:none){.depict.plp .filters .body .range .range-group input::-moz-range-thumb:hover{background:#333335}}.depict.plp .filters .body .range .range-group input:focus-visible::-webkit-slider-thumb{background:#333335}.depict.plp .filters .body .range .range-group input:focus-visible::-moz-range-thumb{background:#333335}.depict.plp .filters .body .range .value-text{color:#333335;justify-content:space-between;padding-top:10px;display:flex}.depict.plp .filters .body .range.disabled .input-group .field input{color:#cbcbcc;background:#fafafc;border:.5px solid #0000}@media not all and (hover:none){.depict.plp .filters .body .range.disabled .input-group .field input:hover{background:#fafafc}}.depict.plp .filters .body .range.disabled .input-group .separator{color:#cbcbcc}.depict.plp .filters .body .range.disabled .slider .progress{background:#cbcbcc}.depict.plp .filters .body .range.disabled .range-group input{transform:translate(calc(50% - 10px))}.depict.plp .filters .body .range.disabled .range-group input::-webkit-slider-thumb{cursor:default;background:#cbcbcc}.depict.plp .filters .body .range.disabled .range-group input::-moz-range-thumb{cursor:default;background:#cbcbcc}.depict.plp .filters .body .filter-collapsible-body .filter-part .checkbox-grid{margin-bottom:0}.depict.plp .filters .body .checkbox-grid{flex-wrap:wrap;display:flex}.depict.plp .filters .body .checkbox-grid .minor{color:#333335;border:1px solid #e4e4e5}.depict.plp .filters .body .checkbox-grid .minor .count{color:#868689}.depict.plp .filters .body .checkbox-grid .major .count{color:#e4e4e5}.depict.plp .filters .body .checkbox-grid .major,.depict.plp .filters .body .checkbox-grid .minor{padding:6px 10px}.depict.plp .filters .body .checkbox-grid .major[disabled],.depict.plp .filters .body .checkbox-grid .minor[disabled]{cursor:default;color:#cbcbcc;border:1px solid #f3f3f5}.depict.plp .filters .body .checkbox-grid .major[disabled] .count,.depict.plp .filters .body .checkbox-grid .minor[disabled] .count{color:#cbcbcc;border-left-color:#f3f3f5}.depict.plp .filters .body .checkbox-grid .major .count-wrapper,.depict.plp .filters .body .checkbox-grid .minor .count-wrapper{height:100%;align-items:center;margin-left:8px;display:flex}.depict.plp .filters .body .checkbox-grid .major .count-wrapper .count,.depict.plp .filters .body .checkbox-grid .minor .count-wrapper .count{border-left:1px solid #e4e4e5;padding-left:4px;font-size:.75em;line-height:1}.depict.plp .filters .body .checkbox-color{flex-wrap:wrap;justify-content:space-between;display:flex}.depict.plp .filters .body .checkbox-color .input-row{width:calc(50% - 10px)}.depict.plp .filters .body .checkbox-color .custom-indicator{margin-right:0}.depict.plp .filters .body .checkbox-color .text{margin-left:10px}@media not all and (hover:none){.depict.plp .filters .body .checkbox-color .input-row:hover input:not([disabled])+.custom-indicator{box-shadow:0 0 0 2px #fff,0 0 0 3px #868689}}.depict.plp .sorting .body{color:#333335;line-height:1}.depict.plp .sorting .body>:not(:first-child){margin-top:.5px}.depict.plp .sorting .body>:not(:last-child){margin-bottom:.5px}.depict.plp .sorting .body .input-row{justify-content:flex-start;align-items:center;display:flex}.depict.plp .morphing-sign{width:1.5em;height:1.5em;border:0;position:relative}.depict.plp .morphing-sign span{background:#333335;border-radius:2px;position:absolute}.depict.plp .morphing-sign span:first-child{width:10%;top:25%;bottom:25%;left:45%}.depict.plp .morphing-sign span:last-child{height:10%;top:45%;left:25%;right:25%}.depict.plp .depict-filter-sort-modal-backdrop{z-index:5000;touch-action:none;will-change:opacity;opacity:0;background:#000000b3;position:fixed;inset:0}.depict.plp .dismiss-modal{z-index:5003;cursor:pointer;background:0 0;border:none;padding:0;line-height:0;position:fixed;top:14px;left:4px;transform:translateY(calc(-100% - 14px))}.depict.plp .dismiss-modal svg{transform:scale(.6646)}.depict.plp .dismiss-modal svg path{fill:#fff}.depict.plp .filter-sort-modal{z-index:calc(5000 + 2);width:calc(100% - 30px);height:100%;will-change:transform;background:#fff;flex-direction:column;justify-content:space-between;display:flex;position:fixed;top:0;left:30px;transform:translateY(100%)}.depict.plp .filter-sort-modal details.sorting>summary,.depict.plp .filter-sort-modal details.filters>summary{list-style:none}.depict.plp .filter-sort-modal details.sorting>summary::-webkit-details-marker,.depict.plp .filter-sort-modal details.filters>summary::-webkit-details-marker{display:none}.depict.plp .filter-sort-modal details.sorting .sort-filter-summary>.summary,.depict.plp .filter-sort-modal details.filters .sort-filter-summary>.summary{cursor:pointer;color:#0f0f0f;border-top:1px solid #ececec;justify-content:space-between;padding:13px 20px;font-weight:400;display:flex;box-shadow:0 4px 4px #0f0f0f1a}.depict.plp .filter-sort-modal details.sorting .sort-filter-summary>.summary .left-els,.depict.plp .filter-sort-modal details.filters .sort-filter-summary>.summary .left-els{align-items:center;display:flex}.depict.plp .filter-sort-modal details.sorting .sort-filter-summary>.summary .left-els>:not(:first-child),.depict.plp .filter-sort-modal details.filters .sort-filter-summary>.summary .left-els>:not(:first-child){margin-left:5px}.depict.plp .filter-sort-modal details.sorting .sort-filter-summary>.summary .left-els>:not(:last-child),.depict.plp .filter-sort-modal details.filters .sort-filter-summary>.summary .left-els>:not(:last-child){margin-right:5px}.depict.plp .filter-sort-modal details[open] .sort-filter-summary>.summary{font-weight:600}.depict.plp .filter-sort-modal .filter-icon,.depict.plp .filter-sort-modal .sort-icon{fill:#0f0f0f}.depict.plp .filter-sort-modal>.body{flex-direction:column;display:flex;overflow-y:auto}.depict.plp .filter-sort-modal>.body>:not(:first-child){margin-top:1px}.depict.plp .filter-sort-modal>.body>:not(:last-child){margin-bottom:1px}.depict.plp .filter-sort-modal .filters .body,.depict.plp .filter-sort-modal .sorting .body{color:#333335}.depict.plp .filter-sort-modal .filters>summary .morphing-sign span,.depict.plp .filter-sort-modal .sorting>summary .morphing-sign span{background:#0f0f0f}.depict.plp .filter-sort-modal .filters .filter-collapsible-body{background:0 0}.depict.plp .filter-sort-modal .filters .body{background:unset;padding:10px}.depict.plp .filter-sort-modal .sorting .body{border-radius:4px;margin:10px;padding:0}.depict.plp .filter-sort-modal .bottom-row{flex-shrink:0;justify-content:space-between;padding:10px;display:flex}.depict.plp .filter-sort-modal .bottom-row>:not(:first-child){margin-left:5px}.depict.plp .filter-sort-modal .bottom-row>:not(:last-child){margin-right:5px}.depict.plp .filter-sort-modal .bottom-row>button{border-radius:4px;padding-top:12px;padding-bottom:12px}.depict.plp .filter-sort-modal .bottom-row .show-results{flex-grow:1;font-size:1.1em;font-weight:500}.depict.plp .filter-sort-modal .bottom-row .clear{font-size:1.1em}.depict.plp .floating-buttons{z-index:calc(5000 + 4);opacity:0;justify-content:flex-start;align-items:center;padding-left:12px;transition-duration:.3s;transition-timing-function:ease-in-out;display:flex;position:sticky;bottom:12px}.depict.plp .floating-buttons:not(.show-them){pointer-events:none}.depict.plp .floating-buttons.show-them{opacity:1}.depict.plp .floating-buttons .filter{margin-right:5px}.depict.plp .floating-buttons .sort{margin-left:5px;margin-right:5px}.depict.plp .floating-buttons .up{margin-left:5px}.depict.plp .floating-buttons .sort,.depict.plp .floating-buttons .filter,.depict.plp .floating-buttons .up{filter:drop-shadow(2px 2px 4px #0000001a)drop-shadow(-2px -2px 4px #ffffff4d);background:#f3f3f5;border:1px solid #0f0f0f;border-radius:20px;padding:10px}@media not all and (hover:none){.depict.plp .floating-buttons .sort:hover,.depict.plp .floating-buttons .filter:hover,.depict.plp .floating-buttons .up:hover{background:#e4e4e5}}.depict.plp .floating-buttons .sort:focus,.depict.plp .floating-buttons .filter:focus,.depict.plp .floating-buttons .up:focus{outline:none}.depict.plp .floating-buttons .sort:focus-visible,.depict.plp .floating-buttons .filter:focus-visible,.depict.plp .floating-buttons .up:focus-visible{background:#e4e4e5}.depict.plp .floating-buttons .sort div,.depict.plp .floating-buttons .filter div,.depict.plp .floating-buttons .up div{display:flex}.depict.plp .floating-buttons .sort svg path,.depict.plp .floating-buttons .filter svg path,.depict.plp .floating-buttons .up svg path{fill:#333335}.depict.plp .depict-slider{width:100%;position:relative}.depict.plp .depict-slider .sliding{height:100%;-ms-overflow-style:none;scrollbar-width:none;flex-flow:row;align-items:stretch;display:flex;overflow-x:scroll}.depict.plp .depict-slider .sliding>:not(:first-child){margin-left:5px}.depict.plp .depict-slider .sliding>:not(:last-child){margin-right:5px}.depict.plp .depict-slider .sliding::-webkit-scrollbar{display:none}.depict.plp .depict-slider .sliding>*{flex-shrink:0}.depict.plp .depict-slider .d-navbutton{z-index:2;touch-action:manipulation;cursor:pointer;height:calc(100% + 2px);width:26px;background:linear-gradient(270deg,#fff 50%,#0000 105%);border:none;justify-content:flex-end;align-items:center;padding:0 1px 0 0;transition-duration:.2s;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.depict.plp .depict-slider .d-navbutton.hidden{cursor:default;opacity:0;animation-name:depict_slider_button_unclickable;animation-duration:5s;animation-fill-mode:forwards}.depict.plp .depict-slider .d-navbutton.left{left:-1px;transform:translateY(-50%)rotate(180deg)}.depict.plp .depict-slider .d-navbutton.right{right:-1px}.depict.plp .depict-slider .d-navbutton img{width:100%;height:100%}.depict.plp .depict-slider .d-navbutton>div{display:flex}@media not all and (hover:none){.depict.plp .depict-slider .d-navbutton:hover svg{transform:scale(1.2)}}.depict.plp .depict-slider .d-navbutton:focus-visible svg{transform:scale(1.5)}.depict.plp .depict-slider .d-navbutton:focus-visible svg path{filter:drop-shadow(-2px -2px 4px #418fc3cc)drop-shadow(2px 2px 4px #418fc3cc)}.depict.plp .depict-slider .d-navbutton svg{transition-duration:.15s}.depict.plp .depict-slider .d-navbutton:active{opacity:.9}@keyframes depict_slider_button_unclickable{0%{pointer-events:all}to{pointer-events:none;visibility:hidden}}.depict.plp button.major{color:#fff;white-space:pre-wrap;cursor:pointer;background:#0f0f0f;border:1px solid #0000;border-radius:4px;justify-content:center;align-items:center;padding:10px 20px;transition:filter .15s ease-in-out,background .1s ease-in-out;display:flex}.depict.plp button.major svg path{fill:#fff}@media not all and (hover:none){.depict.plp button.major:not([disabled]):hover{filter:drop-shadow(-2px -2px 4px #ffffff40)drop-shadow(2px 2px 4px #00000026);background:#333335}}.depict.plp button.major:not([disabled]):active{filter:drop-shadow(2px 2px 4px #ffffff40)drop-shadow(-2px -2px 4px #00000026);background:#000}.depict.plp button.major:focus{outline-style:none}.depict.plp button.major:focus-visible{filter:drop-shadow(2px 2px 4px #418fc3cc)drop-shadow(-2px -2px 4px #418fc3cc);background:#333335}.depict.plp button.minor{color:#0f0f0f;white-space:pre-wrap;cursor:pointer;background:#fff;border:1px solid #0f0f0f;border-radius:4px;justify-content:center;align-items:center;padding:10px 20px;transition:filter .15s ease-in-out,background .1s ease-in-out;display:flex}.depict.plp button.minor svg path{fill:#0f0f0f}@media not all and (hover:none){.depict.plp button.minor:not([disabled]):hover{filter:drop-shadow(-2px -2px 4px #ffffff40)drop-shadow(2px 2px 4px #00000026);background:#f3f3f5}}.depict.plp button.minor:not([disabled]):active{filter:drop-shadow(2px 2px 4px #ffffff40)drop-shadow(-2px -2px 4px #00000026);background:#e4e4e5}.depict.plp button.minor:focus{outline-style:none}.depict.plp button.minor:focus-visible{filter:drop-shadow(-2px -2px 4px #418fc3cc)drop-shadow(2px 2px 4px #418fc3cc);background:#f3f3f5}.depict.plp .line-clamp{text-overflow:ellipsis;white-space:pre-line;overflow-wrap:anywhere;word-break:break-word;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.depict.plp .previous-searches .item,.depict.plp .previous-searches .suggestion,.depict.plp .suggestions .item,.depict.plp .suggestions .suggestion,.depict.plp .has-match{color:#333335;font-weight:400}.depict.plp .has-match .highlighted-part{color:#333335;font-weight:500}.depict.plp button.major .has-match{color:#f3f3f5}.depict.plp button.major .has-match .highlighted-part{color:#fff}.depict.search .previous-searches{flex-direction:column;display:flex}.depict.search .previous-searches>:not(:first-child){margin-top:7.5px}.depict.search .previous-searches>:not(:last-child){margin-bottom:7.5px}.depict.search .previous-searches .list{flex-direction:column;display:flex}.depict.search .previous-searches .list>:not(:first-child){margin-top:2.5px}.depict.search .previous-searches .list>:not(:last-child){margin-bottom:2.5px}.depict.search .previous-searches .list .item{overflow-wrap:anywhere;border-radius:4px;justify-content:space-between;align-items:center;padding:10px 20px;display:flex}.depict.search .previous-searches .list .item .left{align-items:center;display:flex}.depict.search .previous-searches .list .item .left>:not(:first-child){margin-left:5px}.depict.search .previous-searches .list .item .left>:not(:last-child){margin-right:5px}.depict.search .previous-searches .list .item .left svg{min-width:12px}.depict.search .previous-searches .list .item .left svg path{fill:#333335}.depict.search .previous-searches .list .item .delete{height:100%;cursor:pointer;background:0 0;justify-content:center;align-items:center;padding:0 10px;display:flex}.depict.search .previous-searches .list .item .delete:focus{outline:none}.depict.search .previous-searches .list .item .delete svg{width:13px;height:13px;transition-duration:.15s}.depict.search .previous-searches .list .item .delete svg path{fill:#333335}.depict.search .previous-searches .list .item .delete:hover svg{transform:scale(1.2)}.depict.search .previous-searches .list .item .delete:hover svg path{fill:#000}.depict.search .previous-searches .list .item .delete:focus-visible{filter:drop-shadow(-2px -2px 4px #418fc3cc)drop-shadow(2px 2px 4px #418fc3cc)}.depict.search .previous-searches .list .item .delete:focus-visible svg{transform:scale(1.2)}.depict.search .previous-searches .list .item .delete:focus-visible svg path{fill:#000}.depict.search .previous-searches .line-clamp,.depict.search .suggestions .line-clamp{-webkit-line-clamp:1}.depict.search .previous-searches .text,.depict.search .suggestions .text{color:#333335;margin-top:0;font-size:16px;font-weight:700}.depict.search .previous-searches .item,.depict.search .previous-searches .suggestion,.depict.search .suggestions .item,.depict.search .suggestions .suggestion{background:#fff}.depict.search .previous-searches .item.selected,.depict.search .previous-searches .suggestion.selected,.depict.search .suggestions .item.selected,.depict.search .suggestions .suggestion.selected{background:#e4e4e5}.depict.search .previous-searches .item:focus-visible,.depict.search .previous-searches .suggestion:focus-visible,.depict.search .suggestions .item:focus-visible,.depict.search .suggestions .suggestion:focus-visible{filter:drop-shadow(-2px -2px 4px #418fc3cc)drop-shadow(2px 2px 4px #418fc3cc);outline:none}.depict.search .previous-searches .item:active,.depict.search .previous-searches .suggestion:active,.depict.search .suggestions .item:active,.depict.search .suggestions .suggestion:active{background:#cbcbcc}.depict.search .previous-searches .item .with-icon,.depict.search .previous-searches .suggestion .with-icon,.depict.search .suggestions .item .with-icon,.depict.search .suggestions .suggestion .with-icon{justify-content:center;align-items:center;display:flex}.depict.search .previous-searches .item .with-icon>:not(:first-child),.depict.search .previous-searches .suggestion .with-icon>:not(:first-child),.depict.search .suggestions .item .with-icon>:not(:first-child),.depict.search .suggestions .suggestion .with-icon>:not(:first-child){margin-left:4px}.depict.search .previous-searches .item .with-icon>:not(:last-child),.depict.search .previous-searches .suggestion .with-icon>:not(:last-child),.depict.search .suggestions .item .with-icon>:not(:last-child),.depict.search .suggestions .suggestion .with-icon>:not(:last-child){margin-right:4px}.depict.search .suggestions{flex-direction:column;display:flex}.depict.search .suggestions>:not(:first-child){margin-top:10px}.depict.search .suggestions>:not(:last-child){margin-bottom:10px}.depict.search .suggestions:not(.compact)>.suggestion-container>:not(:first-child),.depict.search .suggestions.compact>.suggestion-container:not(.query)>:not(:first-child){margin-top:2.5px}.depict.search .suggestions:not(.compact)>.suggestion-container>:not(:last-child),.depict.search .suggestions.compact>.suggestion-container:not(.query)>:not(:last-child){margin-bottom:2.5px}.depict.search .suggestions .suggestion-container{flex-direction:column;display:flex}.depict.search .suggestions .suggestion-container .suggestion{overflow-wrap:anywhere;border-radius:4px;justify-content:space-between;align-items:center;padding:10px 20px;display:flex}.depict.search .suggestions .suggestion-container .suggestion svg{flex-shrink:0}.depict.search .suggestions .suggestion-container .suggestion svg path{fill:#333335}.depict.search .suggestions .suggestion-container .suggestion.type-category .with-parent-title{justify-content:center;align-items:center;padding-right:8px;display:flex}.depict.search .suggestions .suggestion-container .suggestion .search-icon{max-width:12px;max-height:13px}.depict.search .suggestions .suggestion-container .suggestion .search-icon svg{transform:matrix(.6,0,0,.6,-4.14,-4.32)}.depict.search .suggestions .suggestion-container .suggestion .category{margin-right:20px}.depict.search .suggestions .suggestion-container .suggestion .type{color:#868689;text-transform:capitalize;white-space:nowrap}.depict.search .suggestions .suggestion-container.query{flex-direction:column}.depict.search .suggestions .suggestion-container.query .suggestion{justify-content:flex-start}.depict.search .suggestions .suggestion-container.query .suggestion>:not(:first-child){margin-left:4px}.depict.search .suggestions .suggestion-container.query .suggestion>:not(:last-child){margin-right:4px}.depict.search .suggestions.compact>.suggestion-container.query{flex-flow:wrap;margin:-2.5px}.depict.search .suggestions.compact>.suggestion-container.query>*{margin:2.5px}.depict.search .category-suggestions{display:flex}.depict.search .category-suggestions .sliding{margin-bottom:-2px;padding-bottom:2px}.depict.search .category-suggestions .title{font-weight:500}.depict.search .category-suggestions .category-suggestion{color:#0f0f0f;height:100%;background:#fff;border:1px solid #e4e4e5;justify-content:space-between;align-items:center;padding:10px 20px;transition:background .1s ease-in-out;display:flex}.depict.search .category-suggestions .category-suggestion:focus-visible{background:#f3f3f5}@media not all and (hover:none){.depict.search .category-suggestions .category-suggestion:hover{background:#f3f3f5}}.depict.search .category-suggestions .category-suggestion:active{background:#e4e4e5}.depict.search .category-suggestions .category-suggestion>:not(:first-child){margin-left:5px}.depict.search .category-suggestions .category-suggestion>:not(:last-child){margin-right:5px}.depict.search .category-suggestions .category-suggestion .parent-title{font-weight:300}.depict.search .category-suggestions .category-suggestion>*{white-space:nowrap;font-size:.85em}.depict.search .instant-results{flex-direction:column;display:flex}.depict.search .instant-results>:not(:first-child){margin-top:2.5px}.depict.search .instant-results>:not(:last-child){margin-bottom:2.5px}.depict.search .instant-results .instant-card{background:#fff;border-radius:4px;flex:100%;padding:5px 20px;display:flex;overflow:hidden}.depict.search .instant-results .instant-card:hover,.depict.search .instant-results .instant-card:focus{z-index:2;box-shadow:2px 2px 4px #00000026,-4px -4px 4px #ffffff4d}.depict.search .instant-results .instant-card>:not(:first-child){margin-left:.75vw}.depict.search .instant-results .instant-card>:not(:last-child){margin-right:.75vw}.depict.search .instant-results .instant-card .img-part{flex:0 0 100px}.depict.search .instant-results .instant-card .right-part{flex-grow:1;justify-content:space-between;display:flex}.depict.search .instant-results .instant-card .right-part>:not(:first-child){margin-left:.75vw}.depict.search .instant-results .instant-card .right-part>:not(:last-child){margin-right:.75vw}.depict.search .instant-results .instant-card .right-part .title-brand-tagline{justify-content:center;align-items:center;display:flex}@media (min-width:601px){.depict.search .instant-results .instant-card .right-part .title-brand-tagline>:not(:first-child){margin-left:.75vw}.depict.search .instant-results .instant-card .right-part .title-brand-tagline>:not(:last-child){margin-right:.75vw}}@media (max-width:600px){.depict.search .instant-results .instant-card .right-part .title-brand-tagline{flex-direction:column;align-items:flex-start}.depict.search .instant-results .instant-card .right-part .title-brand-tagline>:not(:first-child){margin-top:.75vw}.depict.search .instant-results .instant-card .right-part .title-brand-tagline>:not(:last-child){margin-bottom:.75vw}}.depict.search .instant-results .instant-card .right-part .title-brand-tagline .title{-webkit-line-clamp:2}.depict.search .instant-results .instant-card .right-part .title-brand-tagline .tagline{color:#868689;font-size:.9em}.depict.search .instant-results .instant-card .right-part .price-container{justify-content:center;align-items:center;display:flex}@media (min-width:601px){.depict.search .instant-results .instant-card .right-part .price-container>:not(:first-child){margin-left:.75vw}.depict.search .instant-results .instant-card .right-part .price-container>:not(:last-child){margin-right:.75vw}}.depict.search .instant-results .instant-card .right-part .price-container .price:not(.orig){color:#333335;font-weight:700}.depict.search .instant-results .instant-card .right-part .price-container .price.orig{color:#868689;text-decoration:line-through}.depict.search .instant-results .instant-card .right-part .price-container .price.sales-price{color:#ff2e3e}@media (max-width:600px){.depict.search .instant-results .instant-card .right-part .price-container{flex-direction:column}.depict.search .instant-results .instant-card .right-part .price-container>:not(:first-child){margin-top:.75vw}.depict.search .instant-results .instant-card .right-part .price-container>:not(:last-child){margin-bottom:.75vw}.depict.search .instant-results .instant-card .right-part .price-container .price:not(.orig){order:0}.depict.search .instant-results .instant-card .right-part .price-container .price.orig{order:1}}.depict.search .search-field{z-index:calc(1 + 5);border-radius:10px;display:flex;box-shadow:0 4px 4px #0000000d}.depict.search .search-field input,.depict.search .search-field button{margin:0}.depict.search .search-field .query{font-size:initial;width:100%;color:#333335;background-color:#fff;border:none;border-radius:10px 0 0 10px;flex-grow:1;padding:14px 55px 14px 20px}.depict.search .search-field .query:focus{color:#000;outline:none}@media not all and (hover:none){.depict.search .search-field .query:hover{color:#000;outline:none}}.depict.search .search-field .query.has-adjacent-back-button{border-top-left-radius:0;border-bottom-left-radius:0;padding-left:0}.depict.search .search-field .field{flex-grow:1;display:flex;position:relative}.depict.search .search-field .back{cursor:pointer;background-color:#fff;border:none;border-top-left-radius:10px;border-bottom-left-radius:10px;justify-content:center;align-items:center;padding:14px 15px 14px 10px;display:flex}.depict.search .search-field .back svg path{fill:#333335}.depict.search .search-field .back:focus{outline:none}.depict.search .search-field .back:focus-visible{filter:drop-shadow(-2px -2px 4px #418fc3cc)drop-shadow(2px 2px 4px #418fc3cc)}.depict.search .search-field .back:focus-visible svg path{fill:#0f0f0f}@media not all and (hover:none){.depict.search .search-field .back:hover svg path{fill:#0f0f0f}}.depict.search .search-field .clear,.depict.search .search-field .submit{cursor:pointer}.depict.search .search-field .clear{background-color:#fff;border:none;padding:0;position:absolute;top:50%;right:30px;transform:translateY(-50%)scale(.8)}.depict.search .search-field .clear svg path{fill:#333335}.depict.search .search-field .clear:focus{outline:none}.depict.search .search-field .clear:focus-visible{filter:drop-shadow(-2px -2px 4px #418fc3cc)drop-shadow(2px 2px 4px #418fc3cc)}.depict.search .search-field .clear:focus-visible svg path{fill:#000}@media not all and (hover:none){.depict.search .search-field .clear:hover svg path{fill:#000}}.depict.search .search-field .submit{min-width:50px;border:none;border-radius:0 10px 10px 0;padding:0}.depict.search .search-field:not(.in-modal) .query{border-top:1px solid #cbcbcc;border-bottom:1px solid #cbcbcc;border-left:1px solid #cbcbcc}.depict.search .search-field:not(.in-modal) .submit{border-top:1px solid #cbcbcc;border-bottom:1px solid #cbcbcc;border-right:1px solid #cbcbcc}.depict.search .depict-search-modal-backdrop{z-index:5000;touch-action:none;background:#0006;position:fixed;inset:0}.depict.search .depict-search-modal{justify-content:center;display:flex}.depict.search .depict-search-modal .search-field{z-index:calc(5000 + 5)}.depict.search .depict-search-modal .body{max-width:800px;z-index:calc(5000 + 1);background:#f3f3f5;border-radius:10px;flex-direction:column;display:flex}@media (hover:hover) and (pointer:fine) and (max-height:790px){.depict.search .depict-search-modal .body{max-height:100%;position:fixed;top:0}}@media (hover:hover) and (pointer:fine) and (max-height:790px) and (max-width:600px){.depict.search .depict-search-modal .body{width:calc(100% - 30px);left:30px}}@media not all and (hover:hover) and (pointer:fine){@media (max-height:1000px){.depict.search .depict-search-modal .body{max-height:100%;position:fixed;top:0}}@media (max-height:1000px) and (max-width:600px){.depict.search .depict-search-modal .body{width:calc(100% - 30px);left:30px}}}.depict.search .depict-search-modal .body .padded>*,.depict.search .depict-search-modal .body .search-field{flex-shrink:0}.depict.search .depict-search-modal .body .padded{flex-direction:column;padding-top:20px;padding-left:max(1vw,10px);padding-right:max(1vw,10px);display:flex;overflow:auto}.depict.search .depict-search-modal .body .padded>:not(:first-child){margin-top:10px}.depict.search .depict-search-modal .body .padded>:not(:last-child){margin-bottom:10px}.depict.search .depict-search-modal .body .discover-more{justify-content:center;display:flex}.depict.search .depict-search-modal .body .discover-more button{text-transform:uppercase;margin:20px 0;padding:12px 18px}.depict.search .listing-page .content-results{margin-bottom:20px}@media (max-width:651px){.depict.search .listing-page .content-results{margin-bottom:16px}}.depict.search .listing-page .search-field{width:min(100%,800px);align-self:center;margin-top:40px;margin-bottom:20px}@media (max-width:651px){.depict.search .listing-page .search-field{margin-top:16px;margin-bottom:16px}}.depict.search .listing-page .search-field~.category-suggestions .category-suggestion:last-child{margin-right:auto}.depict.search .listing-page .search-field~.category-suggestions .category-suggestion:first-child{margin-left:auto}.depict.search .listing-page .category-suggestions{margin-bottom:20px}@media (max-width:651px){.depict.search .listing-page .category-suggestions{margin-bottom:16px}}@media (min-width:652px){.depict.search .listing-page .search-field+.filter-results-for-one-row,.depict.search .listing-page .search-field+.results-for{margin-top:20px}}.depict.search .listing-page .search-recs{margin-top:60px;padding-top:60px}@media (max-width:651px){.depict.search .listing-page .search-recs{margin-top:48px;padding-top:48px}}.depict.search .listing-page .PLP-results.nothing+.search-recs{margin-top:30px;padding-top:30px}@media (max-width:651px){.depict.search .listing-page .PLP-results.nothing+.search-recs{margin-top:24px;padding-top:24px}}.depict.search .listing-page .search-recs{border-top:2px solid #e4e4e5;flex-direction:column;display:flex}.depict.search .listing-page .search-recs .search-recs-title{margin-top:0;margin-bottom:20px;font-size:24px;font-weight:600;line-height:1}.depict.search .listing-page .search-recs .load-more-container{margin-top:30px}.depict.search .results-for{overflow-wrap:anywhere;font-size:1.5em}.depict.search .listing-page .content-results{flex-direction:column;display:flex}.depict.search .listing-page .content-results .results-for{margin-bottom:20px}@media (max-width:651px){.depict.search .listing-page .content-results .results-for{margin-bottom:16px}}.depict.search .listing-page .content-results .load-more-container,.depict.search .listing-page .content-results .load-less-container{margin-top:8px}.depict.search .listing-page .content-results .view-more,.depict.search .listing-page .content-results .view-less{color:#0f0f0f;text-underline-offset:2px;background:0 0;border:none;padding:0;font-size:1em;text-decoration:underline}@media not all and (hover:none){.depict.search .listing-page .content-results .view-more:hover,.depict.search .listing-page .content-results .view-less:hover{color:#333335;cursor:pointer}}.depict.search .listing-page .content-results .view-more:focus-visible,.depict.search .listing-page .content-results .view-less:focus-visible{outline:1px solid #fff;box-shadow:0 0 0 3.5px #0f0f0f}.depict.search .listing-page .content-results .view-more:active,.depict.search .listing-page .content-results .view-less:active{color:#000}.depict.search .content-card{display:flex}.depict.search .content-card:has(.content-title:focus-visible){background:#e4e4e5}.depict.search .content-card .info{flex-direction:column;flex-grow:1;display:flex}.depict.search .content-card .info>:not(:first-child){margin-top:4px}.depict.search .content-card .info>:not(:last-child){margin-bottom:4px}.depict.search .content-card .highlighted-part{color:#000;font-weight:600}@media not all and (hover:none){.depict.search .content-card:has(.image a:hover) .content-title{color:#333335;text-decoration:underline}}.depict.search .content-card .content-title{-webkit-line-clamp:1;color:#0f0f0f;align-self:flex-start;font-size:1.2em;font-weight:500}@media not all and (hover:none){.depict.search .content-card .content-title:hover,.depict.search .content-card .content-title:hover .highlighted-part{color:#333335;text-decoration:underline}}.depict.search .content-card .content-title:focus-visible{color:#333335;text-decoration:underline}.depict.search .content-card .content-title:active,.depict.search .content-card .content-title:active .highlighted-part{color:#000}.depict.search .content-card .description{-webkit-line-clamp:2;color:#333335}.depict.search .content-card .image{flex-direction:column;display:flex}.depict.search .content-card .image>*{padding-right:8px}.depict.search .content-card .image svg path{fill:#0f0f0f}.depict.category .crumbs{flex-wrap:wrap;display:flex}.depict.category .crumbs .crumb{color:#333335}.depict.category .crumbs .crumb:hover{text-decoration:underline}.depict.category .crumbs .crumb:last-of-type{color:#0f0f0f;font-weight:500}.depict.category .crumbs .separator{color:#868689;margin-left:10px;margin-right:10px}.depict.category .quicklinks{overflow:hidden}.depict.category .quicklinks .quicklink{white-space:nowrap;color:#0f0f0f;background:#fff;border:1px solid #cbcbcc;border-radius:4px;padding:10px 20px;transition:all 75ms ease-in-out}.depict.category .quicklinks .quicklink:focus{outline:none}@media not all and (hover:none){.depict.category .quicklinks .quicklink:hover{background:#f3f3f5}}.depict.category .quicklinks .quicklink:focus-visible{filter:drop-shadow(-2px -2px 4px #418fc3cc)drop-shadow(2px 2px 4px #418fc3cc);background:#f3f3f5}.depict.category .quicklinks .quicklink:active{background:#e4e4e5}.depict.category .quicklinks .quicklink.selected{color:#fff;background:#0f0f0f;border:1px solid #0000}@media not all and (hover:none){.depict.category .quicklinks .quicklink.selected:hover{background:#333335}}.depict.category .quicklinks .quicklink.selected:focus-visible{filter:drop-shadow(2px 2px 4px #418fc3cc)drop-shadow(-2px -2px 4px #418fc3cc);background:#333335}.depict.category .quicklinks .quicklink.selected:active{background:#000}.depict.category .category-title{overflow-wrap:anywhere;flex-wrap:wrap;align-items:center;font-size:1.5em;display:flex}.depict.category .category-title *{align-items:center;display:flex}.depict.category .category-title .title{font-weight:700;font-size:inherit;margin-right:10px}.depict.category .category-title .explanation{color:#868689;font-weight:500}.depict.category .category-title .explanation .product-count{margin-left:10px}.depict.category .listing-page .quicklinks,.depict.category .listing-page .crumbs{margin-bottom:20px}@media (max-width:651px){.depict.category .listing-page .quicklinks,.depict.category .listing-page .crumbs{margin-bottom:16px}}.depict.plp.toast{z-index:calc(5000 + 5);white-space:nowrap;border-bottom-style:solid;border-bottom-width:2px;background:#fff;border-image-source:linear-gradient(90deg,#0f0f0f 0% 100%);border-image-slice:0 0 100%;border-radius:4px;padding:10px 20px;position:fixed;bottom:10px;left:50%;transform:translate(-50%);box-shadow:2px 2px 4px #0000000d}.depict.plp.toast *,.depict.plp.toast *{-webkit-user-select:none;user-select:none}@media (min-width:1000px){.depict.plp.toast{padding:10px 40px}}.depict.plp.toast,.depict.plp.toast .buttons{justify-content:center;align-items:center;display:flex}@media (max-width:999px){.depict.plp.toast>:not(:first-child),.depict.plp.toast .buttons>:not(:first-child){margin-left:5px}.depict.plp.toast>:not(:last-child),.depict.plp.toast .buttons>:not(:last-child){margin-right:5px}}@media (min-width:1000px){.depict.plp.toast>:not(:first-child),.depict.plp.toast .buttons>:not(:first-child){margin-left:15px}.depict.plp.toast>:not(:last-child),.depict.plp.toast .buttons>:not(:last-child){margin-right:15px}}.depict.plp.toast{color:#0f0f0f}.depict.plp.toast button{cursor:pointer;border-radius:4px;padding:5px 20px}.depict-placeholder{will-change:mask,-webkit-mask;mask-position-x:125%;mask-position-y:50%;-webkit-mask-image: ;-webkit-mask-image: ;mask-image: ;-webkit-mask-size: ;-webkit-mask-size: ;mask-size: ;background:#ddd;animation:1.5s linear infinite depict-placeholder;display:inline-block;overflow:hidden;-webkit-mask:linear-gradient(-60deg,#000 30%,#0005,#000 70%) 125%/300% 100%}@keyframes depict-placeholder{0%{mask-position-x:125%;-webkit-mask-position-x:125%}10%{mask-position-x:125%;-webkit-mask-position-x:125%}90%{mask-position-x:-25%;-webkit-mask-position-x:-25%}to{mask-position-x:-25%;-webkit-mask-position-x:-25%}}
package/latest/index.cjs CHANGED
@@ -38,7 +38,7 @@ $parcel$export(module.exports, "version", () => $db7b67857900028b$export$83d89fb
38
38
  $parcel$export(module.exports, "Navigation", () => $b742053c966024b4$export$b8a61e5c71402559);
39
39
  /*! Depict.ai search and product listing react SDK wrapper */ // This is where the actual source of your React stuff should live
40
40
  // Note, if you add an export here, also add one in src-server/main.ts
41
- const $db7b67857900028b$export$83d89fbfd8236492 = "2.1.10";
41
+ const $db7b67857900028b$export$83d89fbfd8236492 = "2.1.11";
42
42
  const $0b7cd4fb39fc3502$export$8e769ad4338a911e = {
43
43
  usedLocale: $2IzJs$solidjs.createSignal((0, $2IzJs$depictaiuilocales.defaultLocale)),
44
44
  search_instances: new Map(),
@@ -815,10 +815,13 @@ function $8ffd7da37fdd46be$export$5abb40edfde2a843(props, set_portals) {
815
815
  },
816
816
  get grid_spacing() {
817
817
  return props.gridSpacing ?? (0, $2IzJs$depictaiui.defaultGridSpacing);
818
+ },
819
+ get title() {
820
+ return props.title;
818
821
  }
819
822
  });
820
823
  }
821
- function $0aaa03f81d756b85$export$bd8acc07a8bae229(props, set_portals) {
824
+ function $c6b960f2a07285c8$export$e46079a2793e9ec7(props, set_portals) {
822
825
  const component_portals = new Set();
823
826
  return $2IzJs$depictaiui.RecommendationGrid({
824
827
  get recommendations() {
@@ -851,6 +854,9 @@ function $0aaa03f81d756b85$export$bd8acc07a8bae229(props, set_portals) {
851
854
  get max_rows() {
852
855
  return props.maxRows;
853
856
  },
857
+ get title() {
858
+ return props.title;
859
+ },
854
860
  get view_more_button() {
855
861
  const {
856
862
  viewMoreButton: viewMoreButton
@@ -866,7 +872,7 @@ function $0aaa03f81d756b85$export$bd8acc07a8bae229(props, set_portals) {
866
872
  function $48732d1a919ddb4c$export$b0a773486c1c2312(props) {
867
873
  $67657ea54664baa8$export$4daadad26e48a2c7(props);
868
874
  return $b4d0d98857ed9934$export$f6e64e17bd69eeef({
869
- solid_component: (0, $0aaa03f81d756b85$export$bd8acc07a8bae229),
875
+ solid_component: (0, $c6b960f2a07285c8$export$e46079a2793e9ec7),
870
876
  props: props,
871
877
  hydrate_function_when_ssr: (0, $2IzJs$solidjsweb.hydrate),
872
878
  wrapper_type: "section"
package/latest/index.d.ts CHANGED
@@ -3,7 +3,7 @@ import React, { PropsWithChildren, ReactNode, FC, ReactPortal, ReactElement } fr
3
3
  import { BaseProviderConfig, BaseSearchProviderConfig, BaseCategoryProviderConfig, ModernDisplayWithPageUrl, BaseProductListingConfig, BaseSearchPageConfig, BaseCategoryPageConfig, CategoryTitle, embedded_num_products, ImagePlaceholder as _ImagePlaceholder1, TextPlaceholder as _TextPlaceholder1, ExclusiveId, fetchDepictRecommendations } from "@depict-ai/ui/latest";
4
4
  import { Locale } from "@depict-ai/ui/locales/latest";
5
5
  import { Display, ModernDisplay } from "@depict-ai/utilishared/latest";
6
- export const version = "2.1.10";
6
+ export const version = "2.1.11";
7
7
  interface UsePerformanceClientReturn {
8
8
  dpc: DPC;
9
9
  }
@@ -365,6 +365,10 @@ interface RecommendationConfig<T extends Display> extends BaseProductListingConf
365
365
  * The product card function to use for rendering products.
366
366
  */
367
367
  productCard: DepictProductCard<T>;
368
+ /**
369
+ * Title to show when recommendations are being shown
370
+ */
371
+ title?: string;
368
372
  }
369
373
  interface RecommendationGridConfig<T extends Display> extends RecommendationConfig<T> {
370
374
  maxRows?: number;
@@ -374,7 +378,7 @@ interface RecommendationGridConfig<T extends Display> extends RecommendationConf
374
378
  rowsPerClick?: number;
375
379
  };
376
380
  }
377
- declare function SolidRecommendationWrapper<T extends Display>(props: RecommendationGridConfig<T>, set_portals: (portals: ReactPortal[]) => void): HTMLDivElement;
381
+ declare function SolidRecommendationGridWrapper<T extends Display>(props: RecommendationGridConfig<T>, set_portals: (portals: ReactPortal[]) => void): HTMLDivElement;
378
382
  interface RecommendationSliderConfig<T extends Display> extends RecommendationConfig<T> {
379
383
  viewMoreButton?: {
380
384
  text: string;
@@ -388,6 +392,7 @@ interface RecommendationSliderConfig<T extends Display> extends RecommendationCo
388
392
  * @param productCard a function that renders a product card or a placeholder for one
389
393
  * @param columnsAtSize the number of columns to show at each media breakpoint
390
394
  * @param gridSpacing the spacing between the product cards
395
+ * @param title Optional title to show when recommendations are being shown
391
396
  */
392
397
  export function RecommendationSlider<T extends Display>(props: Parameters<typeof SolidRecommendationSliderWrapper<T>>[0]): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
393
398
  declare function SolidRecommendationSliderWrapper<T extends Display>(props: RecommendationSliderConfig<T>, set_portals: (portals: ReactPortal[]) => void): HTMLDivElement;
@@ -399,8 +404,9 @@ declare function SolidRecommendationSliderWrapper<T extends Display>(props: Reco
399
404
  * @param gridSpacing the spacing between the product cards
400
405
  * @param maxRows the maximum number of rows to show.
401
406
  * @param viewMoreButton optional configuration for the view more button. If unset, all products will be shown by default. Otherwise, a view more button with the given text will be shown. With the properties startRows and rowsPerClick, you can configure how many rows should be shown initially and how many rows should be added on each click.
407
+ * @param title Optional title to show when recommendations are being shown
402
408
  */
403
- export function RecommendationGrid<T extends Display>(props: Parameters<typeof SolidRecommendationWrapper<T>>[0]): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
409
+ export function RecommendationGrid<T extends Display>(props: Parameters<typeof SolidRecommendationGridWrapper<T>>[0]): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
404
410
  /**
405
411
  * Parameters to configure the search modal.
406
412
  */
package/latest/index.js CHANGED
@@ -14,7 +14,7 @@ import { renderToString as $2GFvs$renderToString } from "react-dom/server";
14
14
  // Note, if you add an export here, also add one in src-server/main.ts
15
15
  import { register_es_version } from "../multi_import_deduplicator.mjs";
16
16
  register_es_version("react-ui", "latest");
17
- const $c9c4d066f9a5b51b$export$83d89fbfd8236492 = "2.1.10";
17
+ const $c9c4d066f9a5b51b$export$83d89fbfd8236492 = "2.1.11";
18
18
  const $42858f023ef23dab$export$8e769ad4338a911e = {
19
19
  usedLocale: $2GFvs$createSignal((0, $2GFvs$defaultLocale)),
20
20
  search_instances: new Map(),
@@ -791,10 +791,13 @@ function $4fd5dc0e231a60d9$export$5abb40edfde2a843(props, set_portals) {
791
791
  },
792
792
  get grid_spacing() {
793
793
  return props.gridSpacing ?? (0, $2GFvs$defaultGridSpacing);
794
+ },
795
+ get title() {
796
+ return props.title;
794
797
  }
795
798
  });
796
799
  }
797
- function $8bee51f55543fe0c$export$bd8acc07a8bae229(props, set_portals) {
800
+ function $4d5c3f13a5ae62a7$export$e46079a2793e9ec7(props, set_portals) {
798
801
  const component_portals = new Set();
799
802
  return $2GFvs$RecommendationGrid({
800
803
  get recommendations() {
@@ -827,6 +830,9 @@ function $8bee51f55543fe0c$export$bd8acc07a8bae229(props, set_portals) {
827
830
  get max_rows() {
828
831
  return props.maxRows;
829
832
  },
833
+ get title() {
834
+ return props.title;
835
+ },
830
836
  get view_more_button() {
831
837
  const {
832
838
  viewMoreButton: viewMoreButton
@@ -842,7 +848,7 @@ function $8bee51f55543fe0c$export$bd8acc07a8bae229(props, set_portals) {
842
848
  function $73b783bfc241b2d9$export$b0a773486c1c2312(props) {
843
849
  $ab2bb2d1f47a25b7$export$4daadad26e48a2c7(props);
844
850
  return $c83ba9ab79386687$export$f6e64e17bd69eeef({
845
- solid_component: (0, $8bee51f55543fe0c$export$bd8acc07a8bae229),
851
+ solid_component: (0, $4d5c3f13a5ae62a7$export$e46079a2793e9ec7),
846
852
  props: props,
847
853
  hydrate_function_when_ssr: (0, $2GFvs$hydrate),
848
854
  wrapper_type: "section"
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@depict-ai/react-ui",
3
- "version": "2.1.10",
3
+ "version": "2.1.11",
4
4
  "packageManager": "yarn@3.2.2",
5
5
  "source": "src/index.ts",
6
6
  "types": "ES10/index.d.ts",
@@ -136,8 +136,8 @@
136
136
  "@babel/runtime": "latest",
137
137
  "@babel/runtime-corejs3": "latest",
138
138
  "@depict-ai/dpc": "^1.0.42",
139
- "@depict-ai/plp-styling": "^1.2.12",
140
- "@depict-ai/ui": "^2.1.17",
139
+ "@depict-ai/plp-styling": "^1.2.14",
140
+ "@depict-ai/ui": "^2.1.18",
141
141
  "@depict-ai/utilishared": "^1.0.48",
142
142
  "solid-js": "^1.8.1"
143
143
  },
@@ -150,7 +150,7 @@
150
150
  "@babel/core": "latest",
151
151
  "@babel/preset-env": "latest",
152
152
  "@babel/preset-typescript": "latest",
153
- "@depict-ai/plp-styling": "^1.2.12",
153
+ "@depict-ai/plp-styling": "^1.2.14",
154
154
  "@jest/globals": "^29.3.1",
155
155
  "@parcel/babel-preset-env": "^2.9.3",
156
156
  "@parcel/transformer-sass": "^2.9.3",
@@ -1,11 +1,11 @@
1
1
  var $aNCHr$react = require("react");
2
2
  var $aNCHr$depictaiui = require("@depict-ai/ui/ES10");
3
3
  var $aNCHr$solidjsweb = require("solid-js/web");
4
+ var $aNCHr$depictaiutilishared = require("@depict-ai/utilishared/ES10");
4
5
  var $aNCHr$reactdomserver = require("react-dom/server");
5
6
  var $aNCHr$solidjs = require("solid-js");
6
7
  var $aNCHr$reactjsxruntime = require("react/jsx-runtime");
7
8
  var $aNCHr$reactdom = require("react-dom");
8
- var $aNCHr$depictaiutilishared = require("@depict-ai/utilishared/ES10");
9
9
  require("../../multi_import_deduplicator.cjs").register_es_version("react-ui", "ES10");
10
10
  function $parcel$export(e, n, v, s) {
11
11
  Object.defineProperty(e, n, {
@@ -49,6 +49,17 @@ function $f144be06c518d0ac$export$4b564d7f5a1b1d43(_ref) {
49
49
  }
50
50
  }));
51
51
  }
52
+
53
+ // Triggered by synsam trying to put null here and typescript somehow not complaining
54
+
55
+ function $6e5ce22b65512b0a$export$4daadad26e48a2c7(props) {
56
+ var _props$recommendation;
57
+ const us = "RecommendationSlider/RecommendationGrid:";
58
+ if (typeof (props === null || props === void 0 ? void 0 : (_props$recommendation = props.recommendations) === null || _props$recommendation === void 0 ? void 0 : _props$recommendation.then) !== "function") {
59
+ $aNCHr$depictaiutilishared.dwarn(us, "Got", props.recommendations, "which is not thenable");
60
+ throw new Error(us + " props.recommendations needs to be a promise that is either unresolved (`new Promise(() => {})`) so we can show placeholders, or resolved (`Promise.resolve(recommendation_array)`) to the recommendations to show");
61
+ }
62
+ }
52
63
  class $e9048b15cf1e8792$export$d0f82e3ef89b1f22 extends (0, $aNCHr$react.Component) {
53
64
  constructor(props) {
54
65
  super(props);
@@ -124,7 +135,7 @@ async function $3441d987b5ea85cb$export$32024253978abdc7(_ref) {
124
135
  await react_has_ran_hooks; // After React has created elements it still takes some time to actually connect the refs and run the hooks. We don't want to replace placeholders before then.
125
136
  return [solid_container];
126
137
  }
127
- function $27d583018ba6e604$export$bd8acc07a8bae229(props, set_portals) {
138
+ function $3b36cc844440a979$export$e46079a2793e9ec7(props, set_portals) {
128
139
  const component_portals = new Set();
129
140
  return $aNCHr$depictaiui.RecommendationGrid({
130
141
  get recommendations() {
@@ -158,6 +169,9 @@ function $27d583018ba6e604$export$bd8acc07a8bae229(props, set_portals) {
158
169
  get max_rows() {
159
170
  return props.maxRows;
160
171
  },
172
+ get title() {
173
+ return props.title;
174
+ },
161
175
  get view_more_button() {
162
176
  var _viewMoreButton$start;
163
177
  const {
@@ -171,18 +185,7 @@ function $27d583018ba6e604$export$bd8acc07a8bae229(props, set_portals) {
171
185
  }
172
186
  });
173
187
  }
174
-
175
- // Triggered by synsam trying to put null here and typescript somehow not complaining
176
-
177
- function $6e5ce22b65512b0a$export$4daadad26e48a2c7(props) {
178
- var _props$recommendation;
179
- const us = "RecommendationSlider/RecommendationGrid:";
180
- if (typeof (props === null || props === void 0 ? void 0 : (_props$recommendation = props.recommendations) === null || _props$recommendation === void 0 ? void 0 : _props$recommendation.then) !== "function") {
181
- $aNCHr$depictaiutilishared.dwarn(us, "Got", props.recommendations, "which is not thenable");
182
- throw new Error(us + " props.recommendations needs to be a promise that is either unresolved (`new Promise(() => {})`) so we can show placeholders, or resolved (`Promise.resolve(recommendation_array)`) to the recommendations to show");
183
- }
184
- }
185
- const $efbdd2dab4314170$export$83d89fbfd8236492 = "2.1.10";
188
+ const $efbdd2dab4314170$export$83d89fbfd8236492 = "2.1.11";
186
189
  function $202459d454907b31$export$9fac37a9c21c2f3b(props) {
187
190
  return props.children;
188
191
  }
@@ -234,7 +237,7 @@ function $202459d454907b31$export$3f37af283f8fb843(raw_react_props) {
234
237
  function $202459d454907b31$export$b0a773486c1c2312(props) {
235
238
  $6e5ce22b65512b0a$export$4daadad26e48a2c7(props);
236
239
  return $f144be06c518d0ac$export$4b564d7f5a1b1d43({
237
- solid_component: (0, $27d583018ba6e604$export$bd8acc07a8bae229),
240
+ solid_component: (0, $3b36cc844440a979$export$e46079a2793e9ec7),
238
241
  props: props,
239
242
  wrapper_type: "section"
240
243
  });
@@ -3,7 +3,7 @@ import React, { PropsWithChildren, ReactNode, FC, ReactPortal, ReactElement } fr
3
3
  import { BaseProviderConfig, BaseSearchProviderConfig, BaseCategoryProviderConfig, ModernDisplayWithPageUrl, BaseProductListingConfig, BaseSearchPageConfig, BaseCategoryPageConfig, CategoryTitle, embedded_num_products, ImagePlaceholder as _ImagePlaceholder1, TextPlaceholder as _TextPlaceholder1, ExclusiveId, fetchDepictRecommendations } from "@depict-ai/ui/ES10";
4
4
  import { Locale } from "@depict-ai/ui/locales/ES10";
5
5
  import { Display, ModernDisplay } from "@depict-ai/utilishared/ES10";
6
- export const version = "2.1.10";
6
+ export const version = "2.1.11";
7
7
  interface UsePerformanceClientReturn {
8
8
  dpc: DPC;
9
9
  }
@@ -365,6 +365,10 @@ interface RecommendationConfig<T extends Display> extends BaseProductListingConf
365
365
  * The product card function to use for rendering products.
366
366
  */
367
367
  productCard: DepictProductCard<T>;
368
+ /**
369
+ * Title to show when recommendations are being shown
370
+ */
371
+ title?: string;
368
372
  }
369
373
  interface RecommendationGridConfig<T extends Display> extends RecommendationConfig<T> {
370
374
  maxRows?: number;
@@ -374,7 +378,7 @@ interface RecommendationGridConfig<T extends Display> extends RecommendationConf
374
378
  rowsPerClick?: number;
375
379
  };
376
380
  }
377
- declare function SolidRecommendationWrapper<T extends Display>(props: RecommendationGridConfig<T>, set_portals: (portals: ReactPortal[]) => void): HTMLDivElement;
381
+ declare function SolidRecommendationGridWrapper<T extends Display>(props: RecommendationGridConfig<T>, set_portals: (portals: ReactPortal[]) => void): HTMLDivElement;
378
382
  interface RecommendationSliderConfig<T extends Display> extends RecommendationConfig<T> {
379
383
  viewMoreButton?: {
380
384
  text: string;
@@ -388,6 +392,7 @@ interface RecommendationSliderConfig<T extends Display> extends RecommendationCo
388
392
  * @param productCard a function that renders a product card or a placeholder for one
389
393
  * @param columnsAtSize the number of columns to show at each media breakpoint
390
394
  * @param gridSpacing the spacing between the product cards
395
+ * @param title Optional title to show when recommendations are being shown
391
396
  */
392
397
  export function RecommendationSlider<T extends Display>(props: Parameters<typeof SolidRecommendationSliderWrapper<T>>[0]): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
393
398
  declare function SolidRecommendationSliderWrapper<T extends Display>(props: RecommendationSliderConfig<T>, set_portals: (portals: ReactPortal[]) => void): HTMLDivElement;
@@ -399,8 +404,9 @@ declare function SolidRecommendationSliderWrapper<T extends Display>(props: Reco
399
404
  * @param gridSpacing the spacing between the product cards
400
405
  * @param maxRows the maximum number of rows to show.
401
406
  * @param viewMoreButton optional configuration for the view more button. If unset, all products will be shown by default. Otherwise, a view more button with the given text will be shown. With the properties startRows and rowsPerClick, you can configure how many rows should be shown initially and how many rows should be added on each click.
407
+ * @param title Optional title to show when recommendations are being shown
402
408
  */
403
- export function RecommendationGrid<T extends Display>(props: Parameters<typeof SolidRecommendationWrapper<T>>[0]): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
409
+ export function RecommendationGrid<T extends Display>(props: Parameters<typeof SolidRecommendationGridWrapper<T>>[0]): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
404
410
  /**
405
411
  * Parameters to configure the search modal.
406
412
  */
@@ -1,11 +1,11 @@
1
1
  import { createElement as $7h5e1$createElement, useRef as $7h5e1$useRef, Fragment as $7h5e1$Fragment, useEffect as $7h5e1$useEffect, useState as $7h5e1$useState, Component as $7h5e1$Component } from "react";
2
2
  import { ImagePlaceholder as $7h5e1$ImagePlaceholder, TextPlaceholder as $7h5e1$TextPlaceholder, RecommendationGrid as $7h5e1$RecommendationGrid, defaultColsAtSize as $7h5e1$defaultColsAtSize, defaultGridSpacing as $7h5e1$defaultGridSpacing, ProductCardError as $7h5e1$ProductCardError } from "@depict-ai/ui/ES10";
3
3
  import { generateHydrationScript as $7h5e1$generateHydrationScript, renderToString as $7h5e1$renderToString, isServer as $7h5e1$isServer } from "solid-js/web";
4
+ import { dwarn as $7h5e1$dwarn } from "@depict-ai/utilishared/ES10";
4
5
  import { renderToString as $7h5e1$renderToString1 } from "react-dom/server";
5
6
  import { getOwner as $7h5e1$getOwner, untrack as $7h5e1$untrack, runWithOwner as $7h5e1$runWithOwner, createEffect as $7h5e1$createEffect, on as $7h5e1$on, onCleanup as $7h5e1$onCleanup } from "solid-js";
6
7
  import { jsx as $7h5e1$jsx } from "react/jsx-runtime";
7
8
  import { createPortal as $7h5e1$createPortal } from "react-dom";
8
- import { dwarn as $7h5e1$dwarn } from "@depict-ai/utilishared/ES10";
9
9
  import { register_es_version } from "../../multi_import_deduplicator.mjs";
10
10
  register_es_version("react-ui", "ES10");
11
11
  function $e8e755ef02e716bf$export$4b564d7f5a1b1d43(_ref) {
@@ -26,6 +26,17 @@ function $e8e755ef02e716bf$export$4b564d7f5a1b1d43(_ref) {
26
26
  }
27
27
  }));
28
28
  }
29
+
30
+ // Triggered by synsam trying to put null here and typescript somehow not complaining
31
+
32
+ function $758339150fbfe9d5$export$4daadad26e48a2c7(props) {
33
+ var _props$recommendation;
34
+ const us = "RecommendationSlider/RecommendationGrid:";
35
+ if (typeof (props === null || props === void 0 ? void 0 : (_props$recommendation = props.recommendations) === null || _props$recommendation === void 0 ? void 0 : _props$recommendation.then) !== "function") {
36
+ $7h5e1$dwarn(us, "Got", props.recommendations, "which is not thenable");
37
+ throw new Error(us + " props.recommendations needs to be a promise that is either unresolved (`new Promise(() => {})`) so we can show placeholders, or resolved (`Promise.resolve(recommendation_array)`) to the recommendations to show");
38
+ }
39
+ }
29
40
  class $88d93ed7309e90d1$export$d0f82e3ef89b1f22 extends (0, $7h5e1$Component) {
30
41
  constructor(props) {
31
42
  super(props);
@@ -101,7 +112,7 @@ async function $cce08f18e2476cbf$export$32024253978abdc7(_ref) {
101
112
  await react_has_ran_hooks; // After React has created elements it still takes some time to actually connect the refs and run the hooks. We don't want to replace placeholders before then.
102
113
  return [solid_container];
103
114
  }
104
- function $48b0916cc674770c$export$bd8acc07a8bae229(props, set_portals) {
115
+ function $cd68097a7ee08669$export$e46079a2793e9ec7(props, set_portals) {
105
116
  const component_portals = new Set();
106
117
  return $7h5e1$RecommendationGrid({
107
118
  get recommendations() {
@@ -135,6 +146,9 @@ function $48b0916cc674770c$export$bd8acc07a8bae229(props, set_portals) {
135
146
  get max_rows() {
136
147
  return props.maxRows;
137
148
  },
149
+ get title() {
150
+ return props.title;
151
+ },
138
152
  get view_more_button() {
139
153
  var _viewMoreButton$start;
140
154
  const {
@@ -148,18 +162,7 @@ function $48b0916cc674770c$export$bd8acc07a8bae229(props, set_portals) {
148
162
  }
149
163
  });
150
164
  }
151
-
152
- // Triggered by synsam trying to put null here and typescript somehow not complaining
153
-
154
- function $758339150fbfe9d5$export$4daadad26e48a2c7(props) {
155
- var _props$recommendation;
156
- const us = "RecommendationSlider/RecommendationGrid:";
157
- if (typeof (props === null || props === void 0 ? void 0 : (_props$recommendation = props.recommendations) === null || _props$recommendation === void 0 ? void 0 : _props$recommendation.then) !== "function") {
158
- $7h5e1$dwarn(us, "Got", props.recommendations, "which is not thenable");
159
- throw new Error(us + " props.recommendations needs to be a promise that is either unresolved (`new Promise(() => {})`) so we can show placeholders, or resolved (`Promise.resolve(recommendation_array)`) to the recommendations to show");
160
- }
161
- }
162
- const $9bd9bb8700ab2ada$export$83d89fbfd8236492 = "2.1.10";
165
+ const $9bd9bb8700ab2ada$export$83d89fbfd8236492 = "2.1.11";
163
166
  function $5c4add0a8fe94894$export$9fac37a9c21c2f3b(props) {
164
167
  return props.children;
165
168
  }
@@ -211,7 +214,7 @@ function $5c4add0a8fe94894$export$3f37af283f8fb843(raw_react_props) {
211
214
  function $5c4add0a8fe94894$export$b0a773486c1c2312(props) {
212
215
  $758339150fbfe9d5$export$4daadad26e48a2c7(props);
213
216
  return $e8e755ef02e716bf$export$4b564d7f5a1b1d43({
214
- solid_component: (0, $48b0916cc674770c$export$bd8acc07a8bae229),
217
+ solid_component: (0, $cd68097a7ee08669$export$e46079a2793e9ec7),
215
218
  props: props,
216
219
  wrapper_type: "section"
217
220
  });
@@ -1,11 +1,11 @@
1
1
  var $7QqFM$react = require("react");
2
2
  var $7QqFM$depictaiui = require("@depict-ai/ui/latest");
3
3
  var $7QqFM$solidjsweb = require("solid-js/web");
4
+ var $7QqFM$depictaiutilishared = require("@depict-ai/utilishared/latest");
4
5
  var $7QqFM$reactdomserver = require("react-dom/server");
5
6
  var $7QqFM$solidjs = require("solid-js");
6
7
  var $7QqFM$reactjsxruntime = require("react/jsx-runtime");
7
8
  var $7QqFM$reactdom = require("react-dom");
8
- var $7QqFM$depictaiutilishared = require("@depict-ai/utilishared/latest");
9
9
  require("../../multi_import_deduplicator.cjs").register_es_version("react-ui", "latest");
10
10
  function $parcel$export(e, n, v, s) {
11
11
  Object.defineProperty(e, n, {
@@ -48,6 +48,16 @@ function $35dfe83eec81954c$export$4b564d7f5a1b1d43({
48
48
  }
49
49
  }));
50
50
  }
51
+
52
+ // Triggered by synsam trying to put null here and typescript somehow not complaining
53
+
54
+ function $67657ea54664baa8$export$4daadad26e48a2c7(props) {
55
+ const us = "RecommendationSlider/RecommendationGrid:";
56
+ if (typeof props?.recommendations?.then !== "function") {
57
+ $7QqFM$depictaiutilishared.dwarn(us, "Got", props.recommendations, "which is not thenable");
58
+ throw new Error(us + " props.recommendations needs to be a promise that is either unresolved (`new Promise(() => {})`) so we can show placeholders, or resolved (`Promise.resolve(recommendation_array)`) to the recommendations to show");
59
+ }
60
+ }
51
61
  class $d7a14567b529586f$export$d0f82e3ef89b1f22 extends (0, $7QqFM$react.Component) {
52
62
  constructor(props) {
53
63
  super(props);
@@ -119,7 +129,7 @@ async function $6081519c185fcf70$export$32024253978abdc7({
119
129
  await react_has_ran_hooks; // After React has created elements it still takes some time to actually connect the refs and run the hooks. We don't want to replace placeholders before then.
120
130
  return [solid_container];
121
131
  }
122
- function $0aaa03f81d756b85$export$bd8acc07a8bae229(props, set_portals) {
132
+ function $c6b960f2a07285c8$export$e46079a2793e9ec7(props, set_portals) {
123
133
  const component_portals = new Set();
124
134
  return $7QqFM$depictaiui.RecommendationGrid({
125
135
  get recommendations() {
@@ -152,6 +162,9 @@ function $0aaa03f81d756b85$export$bd8acc07a8bae229(props, set_portals) {
152
162
  get max_rows() {
153
163
  return props.maxRows;
154
164
  },
165
+ get title() {
166
+ return props.title;
167
+ },
155
168
  get view_more_button() {
156
169
  const {
157
170
  viewMoreButton: viewMoreButton
@@ -164,17 +177,7 @@ function $0aaa03f81d756b85$export$bd8acc07a8bae229(props, set_portals) {
164
177
  }
165
178
  });
166
179
  }
167
-
168
- // Triggered by synsam trying to put null here and typescript somehow not complaining
169
-
170
- function $67657ea54664baa8$export$4daadad26e48a2c7(props) {
171
- const us = "RecommendationSlider/RecommendationGrid:";
172
- if (typeof props?.recommendations?.then !== "function") {
173
- $7QqFM$depictaiutilishared.dwarn(us, "Got", props.recommendations, "which is not thenable");
174
- throw new Error(us + " props.recommendations needs to be a promise that is either unresolved (`new Promise(() => {})`) so we can show placeholders, or resolved (`Promise.resolve(recommendation_array)`) to the recommendations to show");
175
- }
176
- }
177
- const $db7b67857900028b$export$83d89fbfd8236492 = "2.1.10";
180
+ const $db7b67857900028b$export$83d89fbfd8236492 = "2.1.11";
178
181
  function $41e7e5d85b5e0d49$export$9fac37a9c21c2f3b(props) {
179
182
  return props.children;
180
183
  }
@@ -226,7 +229,7 @@ function $41e7e5d85b5e0d49$export$3f37af283f8fb843(raw_react_props) {
226
229
  function $41e7e5d85b5e0d49$export$b0a773486c1c2312(props) {
227
230
  $67657ea54664baa8$export$4daadad26e48a2c7(props);
228
231
  return $35dfe83eec81954c$export$4b564d7f5a1b1d43({
229
- solid_component: (0, $0aaa03f81d756b85$export$bd8acc07a8bae229),
232
+ solid_component: (0, $c6b960f2a07285c8$export$e46079a2793e9ec7),
230
233
  props: props,
231
234
  wrapper_type: "section"
232
235
  });
@@ -3,7 +3,7 @@ import React, { PropsWithChildren, ReactNode, FC, ReactPortal, ReactElement } fr
3
3
  import { BaseProviderConfig, BaseSearchProviderConfig, BaseCategoryProviderConfig, ModernDisplayWithPageUrl, BaseProductListingConfig, BaseSearchPageConfig, BaseCategoryPageConfig, CategoryTitle, embedded_num_products, ImagePlaceholder as _ImagePlaceholder1, TextPlaceholder as _TextPlaceholder1, ExclusiveId, fetchDepictRecommendations } from "@depict-ai/ui/latest";
4
4
  import { Locale } from "@depict-ai/ui/locales/latest";
5
5
  import { Display, ModernDisplay } from "@depict-ai/utilishared/latest";
6
- export const version = "2.1.10";
6
+ export const version = "2.1.11";
7
7
  interface UsePerformanceClientReturn {
8
8
  dpc: DPC;
9
9
  }
@@ -365,6 +365,10 @@ interface RecommendationConfig<T extends Display> extends BaseProductListingConf
365
365
  * The product card function to use for rendering products.
366
366
  */
367
367
  productCard: DepictProductCard<T>;
368
+ /**
369
+ * Title to show when recommendations are being shown
370
+ */
371
+ title?: string;
368
372
  }
369
373
  interface RecommendationGridConfig<T extends Display> extends RecommendationConfig<T> {
370
374
  maxRows?: number;
@@ -374,7 +378,7 @@ interface RecommendationGridConfig<T extends Display> extends RecommendationConf
374
378
  rowsPerClick?: number;
375
379
  };
376
380
  }
377
- declare function SolidRecommendationWrapper<T extends Display>(props: RecommendationGridConfig<T>, set_portals: (portals: ReactPortal[]) => void): HTMLDivElement;
381
+ declare function SolidRecommendationGridWrapper<T extends Display>(props: RecommendationGridConfig<T>, set_portals: (portals: ReactPortal[]) => void): HTMLDivElement;
378
382
  interface RecommendationSliderConfig<T extends Display> extends RecommendationConfig<T> {
379
383
  viewMoreButton?: {
380
384
  text: string;
@@ -388,6 +392,7 @@ interface RecommendationSliderConfig<T extends Display> extends RecommendationCo
388
392
  * @param productCard a function that renders a product card or a placeholder for one
389
393
  * @param columnsAtSize the number of columns to show at each media breakpoint
390
394
  * @param gridSpacing the spacing between the product cards
395
+ * @param title Optional title to show when recommendations are being shown
391
396
  */
392
397
  export function RecommendationSlider<T extends Display>(props: Parameters<typeof SolidRecommendationSliderWrapper<T>>[0]): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
393
398
  declare function SolidRecommendationSliderWrapper<T extends Display>(props: RecommendationSliderConfig<T>, set_portals: (portals: ReactPortal[]) => void): HTMLDivElement;
@@ -399,8 +404,9 @@ declare function SolidRecommendationSliderWrapper<T extends Display>(props: Reco
399
404
  * @param gridSpacing the spacing between the product cards
400
405
  * @param maxRows the maximum number of rows to show.
401
406
  * @param viewMoreButton optional configuration for the view more button. If unset, all products will be shown by default. Otherwise, a view more button with the given text will be shown. With the properties startRows and rowsPerClick, you can configure how many rows should be shown initially and how many rows should be added on each click.
407
+ * @param title Optional title to show when recommendations are being shown
402
408
  */
403
- export function RecommendationGrid<T extends Display>(props: Parameters<typeof SolidRecommendationWrapper<T>>[0]): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
409
+ export function RecommendationGrid<T extends Display>(props: Parameters<typeof SolidRecommendationGridWrapper<T>>[0]): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
404
410
  /**
405
411
  * Parameters to configure the search modal.
406
412
  */
@@ -1,11 +1,11 @@
1
1
  import { createElement as $eOXet$createElement, useRef as $eOXet$useRef, Fragment as $eOXet$Fragment, useEffect as $eOXet$useEffect, useState as $eOXet$useState, Component as $eOXet$Component } from "react";
2
2
  import { ImagePlaceholder as $eOXet$ImagePlaceholder, TextPlaceholder as $eOXet$TextPlaceholder, RecommendationGrid as $eOXet$RecommendationGrid, defaultColsAtSize as $eOXet$defaultColsAtSize, defaultGridSpacing as $eOXet$defaultGridSpacing, ProductCardError as $eOXet$ProductCardError } from "@depict-ai/ui/latest";
3
3
  import { generateHydrationScript as $eOXet$generateHydrationScript, renderToString as $eOXet$renderToString, isServer as $eOXet$isServer } from "solid-js/web";
4
+ import { dwarn as $eOXet$dwarn } from "@depict-ai/utilishared/latest";
4
5
  import { renderToString as $eOXet$renderToString1 } from "react-dom/server";
5
6
  import { getOwner as $eOXet$getOwner, untrack as $eOXet$untrack, runWithOwner as $eOXet$runWithOwner, createEffect as $eOXet$createEffect, on as $eOXet$on, onCleanup as $eOXet$onCleanup } from "solid-js";
6
7
  import { jsx as $eOXet$jsx } from "react/jsx-runtime";
7
8
  import { createPortal as $eOXet$createPortal } from "react-dom";
8
- import { dwarn as $eOXet$dwarn } from "@depict-ai/utilishared/latest";
9
9
  import { register_es_version } from "../../multi_import_deduplicator.mjs";
10
10
  register_es_version("react-ui", "latest");
11
11
  function $4568c09979447ab1$export$4b564d7f5a1b1d43({
@@ -25,6 +25,16 @@ function $4568c09979447ab1$export$4b564d7f5a1b1d43({
25
25
  }
26
26
  }));
27
27
  }
28
+
29
+ // Triggered by synsam trying to put null here and typescript somehow not complaining
30
+
31
+ function $ab2bb2d1f47a25b7$export$4daadad26e48a2c7(props) {
32
+ const us = "RecommendationSlider/RecommendationGrid:";
33
+ if (typeof props?.recommendations?.then !== "function") {
34
+ $eOXet$dwarn(us, "Got", props.recommendations, "which is not thenable");
35
+ throw new Error(us + " props.recommendations needs to be a promise that is either unresolved (`new Promise(() => {})`) so we can show placeholders, or resolved (`Promise.resolve(recommendation_array)`) to the recommendations to show");
36
+ }
37
+ }
28
38
  class $d5c9e1f3545b4984$export$d0f82e3ef89b1f22 extends (0, $eOXet$Component) {
29
39
  constructor(props) {
30
40
  super(props);
@@ -96,7 +106,7 @@ async function $bcf84a32dc612a43$export$32024253978abdc7({
96
106
  await react_has_ran_hooks; // After React has created elements it still takes some time to actually connect the refs and run the hooks. We don't want to replace placeholders before then.
97
107
  return [solid_container];
98
108
  }
99
- function $8bee51f55543fe0c$export$bd8acc07a8bae229(props, set_portals) {
109
+ function $4d5c3f13a5ae62a7$export$e46079a2793e9ec7(props, set_portals) {
100
110
  const component_portals = new Set();
101
111
  return $eOXet$RecommendationGrid({
102
112
  get recommendations() {
@@ -129,6 +139,9 @@ function $8bee51f55543fe0c$export$bd8acc07a8bae229(props, set_portals) {
129
139
  get max_rows() {
130
140
  return props.maxRows;
131
141
  },
142
+ get title() {
143
+ return props.title;
144
+ },
132
145
  get view_more_button() {
133
146
  const {
134
147
  viewMoreButton: viewMoreButton
@@ -141,17 +154,7 @@ function $8bee51f55543fe0c$export$bd8acc07a8bae229(props, set_portals) {
141
154
  }
142
155
  });
143
156
  }
144
-
145
- // Triggered by synsam trying to put null here and typescript somehow not complaining
146
-
147
- function $ab2bb2d1f47a25b7$export$4daadad26e48a2c7(props) {
148
- const us = "RecommendationSlider/RecommendationGrid:";
149
- if (typeof props?.recommendations?.then !== "function") {
150
- $eOXet$dwarn(us, "Got", props.recommendations, "which is not thenable");
151
- throw new Error(us + " props.recommendations needs to be a promise that is either unresolved (`new Promise(() => {})`) so we can show placeholders, or resolved (`Promise.resolve(recommendation_array)`) to the recommendations to show");
152
- }
153
- }
154
- const $c9c4d066f9a5b51b$export$83d89fbfd8236492 = "2.1.10";
157
+ const $c9c4d066f9a5b51b$export$83d89fbfd8236492 = "2.1.11";
155
158
  function $2b1fdeb83610500f$export$9fac37a9c21c2f3b(props) {
156
159
  return props.children;
157
160
  }
@@ -203,7 +206,7 @@ function $2b1fdeb83610500f$export$3f37af283f8fb843(raw_react_props) {
203
206
  function $2b1fdeb83610500f$export$b0a773486c1c2312(props) {
204
207
  $ab2bb2d1f47a25b7$export$4daadad26e48a2c7(props);
205
208
  return $4568c09979447ab1$export$4b564d7f5a1b1d43({
206
- solid_component: (0, $8bee51f55543fe0c$export$bd8acc07a8bae229),
209
+ solid_component: (0, $4d5c3f13a5ae62a7$export$e46079a2793e9ec7),
207
210
  props: props,
208
211
  wrapper_type: "section"
209
212
  });