@depict-ai/react-ui 3.0.18 → 3.1.0
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 +14 -30
- package/ES10/index.d.ts +1 -1
- package/ES10/index.js +14 -30
- package/README.md +2 -1
- package/dist/styles/plain-css-fallback-styling.css +1 -1
- package/latest/index.cjs +13 -29
- package/latest/index.d.ts +1 -1
- package/latest/index.js +13 -29
- package/package.json +5 -5
- package/server/ES10/index.cjs +2 -45
- package/server/ES10/index.d.ts +1 -1
- package/server/ES10/index.js +3 -46
- package/server/latest/index.cjs +2 -44
- package/server/latest/index.d.ts +1 -1
- package/server/latest/index.js +3 -45
package/ES10/index.cjs
CHANGED
|
@@ -39,7 +39,7 @@ $parcel$export(module.exports, "version", () => $efbdd2dab4314170$export$83d89fb
|
|
|
39
39
|
$parcel$export(module.exports, "Navigation", () => $0d3a2413fdeb34b9$export$b8a61e5c71402559);
|
|
40
40
|
/*! Depict.ai search and product listing react SDK wrapper */ // This is where the actual source of your React stuff should live
|
|
41
41
|
// Note, if you add an export here, also add one in src-server/main.ts
|
|
42
|
-
const $efbdd2dab4314170$export$83d89fbfd8236492 = "3.0
|
|
42
|
+
const $efbdd2dab4314170$export$83d89fbfd8236492 = "3.1.0";
|
|
43
43
|
const $ef516b1f92253963$export$8e769ad4338a911e = {
|
|
44
44
|
usedLocale: $2kiy7$solidjs.createSignal((0, $2kiy7$depictaiuilocales.defaultLocale)),
|
|
45
45
|
search_instances: new Map(),
|
|
@@ -842,31 +842,6 @@ function $6e5ce22b65512b0a$export$4daadad26e48a2c7(props) {
|
|
|
842
842
|
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");
|
|
843
843
|
}
|
|
844
844
|
}
|
|
845
|
-
function $7b4cd941f15b2582$export$12250cb2badef3d2(props) {
|
|
846
|
-
const recs = props.recommendations;
|
|
847
|
-
if ("then" in recs)
|
|
848
|
-
// Run displayTransformers for RecommendationSlider and RecommendationGrid
|
|
849
|
-
return recs.then(async displays => {
|
|
850
|
-
var _globalState$api, _globalState$api$disp;
|
|
851
|
-
const transformFunction = (_globalState$api = (0, $ef516b1f92253963$export$8e769ad4338a911e).api) === null || _globalState$api === void 0 ? void 0 : (_globalState$api$disp = _globalState$api.display_transformers) === null || _globalState$api$disp === void 0 ? void 0 : _globalState$api$disp.products;
|
|
852
|
-
if (transformFunction) try {
|
|
853
|
-
return await transformFunction({
|
|
854
|
-
merchant: (0, $ef516b1f92253963$export$8e769ad4338a911e).merchant[0](),
|
|
855
|
-
market: (0, $ef516b1f92253963$export$8e769ad4338a911e).market[0](),
|
|
856
|
-
locale: (0, $ef516b1f92253963$export$8e769ad4338a911e).usedLocale[0]().backend_locale_,
|
|
857
|
-
displays: displays
|
|
858
|
-
});
|
|
859
|
-
} catch (e) {
|
|
860
|
-
console.error(e);
|
|
861
|
-
throw new Error("Error running display transformer for recommendations", {
|
|
862
|
-
cause: e
|
|
863
|
-
}); // To stop recommendation grid from rendering
|
|
864
|
-
}
|
|
865
|
-
|
|
866
|
-
return displays;
|
|
867
|
-
});
|
|
868
|
-
return recs;
|
|
869
|
-
}
|
|
870
845
|
function $745b83c12baac3c0$export$82cfdc85a4d15688(props) {
|
|
871
846
|
$6e5ce22b65512b0a$export$4daadad26e48a2c7(props);
|
|
872
847
|
return $e7ba61a7074c02d3$export$f6e64e17bd69eeef({
|
|
@@ -878,7 +853,7 @@ function $745b83c12baac3c0$export$5abb40edfde2a843(props, set_portals) {
|
|
|
878
853
|
const component_portals = new Set();
|
|
879
854
|
return $2kiy7$depictaiui.RecommendationSlider({
|
|
880
855
|
get recommendations() {
|
|
881
|
-
return
|
|
856
|
+
return props.recommendations;
|
|
882
857
|
},
|
|
883
858
|
product_card_template: display => $3441d987b5ea85cb$export$32024253978abdc7({
|
|
884
859
|
component_props: {
|
|
@@ -904,7 +879,7 @@ function $3b36cc844440a979$export$e46079a2793e9ec7(props, set_portals) {
|
|
|
904
879
|
const component_portals = new Set();
|
|
905
880
|
return $2kiy7$depictaiui.RecommendationGrid({
|
|
906
881
|
get recommendations() {
|
|
907
|
-
return
|
|
882
|
+
return props.recommendations;
|
|
908
883
|
},
|
|
909
884
|
product_card_template: display => {
|
|
910
885
|
if (0, $2kiy7$solidjsweb.isServer) {
|
|
@@ -1033,7 +1008,8 @@ function $2ea1d71b29581906$export$6501da23a2770fc() {
|
|
|
1033
1008
|
fetchRecommendations: $2ea1d71b29581906$var$fetchRecommendations
|
|
1034
1009
|
};
|
|
1035
1010
|
}
|
|
1036
|
-
function $2ea1d71b29581906$var$fetchRecommendations(opts) {
|
|
1011
|
+
async function $2ea1d71b29581906$var$fetchRecommendations(opts) {
|
|
1012
|
+
var _globalState$api, _globalState$api$disp;
|
|
1037
1013
|
const {
|
|
1038
1014
|
merchant: [get_merchant],
|
|
1039
1015
|
market: [get_market],
|
|
@@ -1044,13 +1020,21 @@ function $2ea1d71b29581906$var$fetchRecommendations(opts) {
|
|
|
1044
1020
|
const market = $2kiy7$solidjs.untrack(get_market);
|
|
1045
1021
|
const locale = $2kiy7$solidjs.untrack(get_usedLocale).backend_locale_;
|
|
1046
1022
|
if (!merchant || !market || !locale) throw new Error("Depict recommendations are not configured (merchant, market or locale is falsy). Wrap your app in a DepictProvider.");
|
|
1047
|
-
|
|
1023
|
+
const fetchedRecs = await $2kiy7$depictaiui.fetchDepictRecommendations({
|
|
1048
1024
|
merchant: merchant,
|
|
1049
1025
|
market: market,
|
|
1050
1026
|
locale: locale,
|
|
1051
1027
|
sessionId: $2kiy7$solidjs.untrack(get_sessionId),
|
|
1052
1028
|
...opts
|
|
1053
1029
|
});
|
|
1030
|
+
const transformFunction = (_globalState$api = (0, $ef516b1f92253963$export$8e769ad4338a911e).api) === null || _globalState$api === void 0 ? void 0 : (_globalState$api$disp = _globalState$api.display_transformers) === null || _globalState$api$disp === void 0 ? void 0 : _globalState$api$disp.products;
|
|
1031
|
+
if (transformFunction) return await transformFunction({
|
|
1032
|
+
merchant: merchant,
|
|
1033
|
+
market: market,
|
|
1034
|
+
locale: locale,
|
|
1035
|
+
displays: fetchedRecs
|
|
1036
|
+
});
|
|
1037
|
+
return fetchedRecs;
|
|
1054
1038
|
}
|
|
1055
1039
|
const $6bf91538dbdf0252$export$804fac5697cfbe35 = router => (relativeUrl, _ref) => {
|
|
1056
1040
|
let {
|
package/ES10/index.d.ts
CHANGED
|
@@ -3,7 +3,7 @@ import React, { PropsWithChildren, FC, ReactNode, ReactPortal, ReactElement } fr
|
|
|
3
3
|
import { BaseCategoryProviderConfig, BaseProviderConfig, BaseSearchProviderConfig, ModernDisplayWithPageUrl, BaseProductListingConfig, BaseSearchPageConfig, BaseCategoryPageConfig, CategoryTitle, embedded_num_products, ListingQuery, 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 = "3.0
|
|
6
|
+
export const version = "3.1.0";
|
|
7
7
|
interface UsePerformanceClientReturn {
|
|
8
8
|
dpc: DPC;
|
|
9
9
|
}
|
package/ES10/index.js
CHANGED
|
@@ -15,7 +15,7 @@ import { renderToString as $jb2Oo$renderToString } from "react-dom/server";
|
|
|
15
15
|
// Note, if you add an export here, also add one in src-server/main.ts
|
|
16
16
|
import { register_es_version } from "../multi_import_deduplicator.mjs";
|
|
17
17
|
register_es_version("react-ui", "ES10");
|
|
18
|
-
const $9bd9bb8700ab2ada$export$83d89fbfd8236492 = "3.0
|
|
18
|
+
const $9bd9bb8700ab2ada$export$83d89fbfd8236492 = "3.1.0";
|
|
19
19
|
const $8c691d7f86317052$export$8e769ad4338a911e = {
|
|
20
20
|
usedLocale: $jb2Oo$createSignal((0, $jb2Oo$defaultLocale)),
|
|
21
21
|
search_instances: new Map(),
|
|
@@ -818,31 +818,6 @@ function $758339150fbfe9d5$export$4daadad26e48a2c7(props) {
|
|
|
818
818
|
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");
|
|
819
819
|
}
|
|
820
820
|
}
|
|
821
|
-
function $9da62538e07f038e$export$12250cb2badef3d2(props) {
|
|
822
|
-
const recs = props.recommendations;
|
|
823
|
-
if ("then" in recs)
|
|
824
|
-
// Run displayTransformers for RecommendationSlider and RecommendationGrid
|
|
825
|
-
return recs.then(async displays => {
|
|
826
|
-
var _globalState$api, _globalState$api$disp;
|
|
827
|
-
const transformFunction = (_globalState$api = (0, $8c691d7f86317052$export$8e769ad4338a911e).api) === null || _globalState$api === void 0 ? void 0 : (_globalState$api$disp = _globalState$api.display_transformers) === null || _globalState$api$disp === void 0 ? void 0 : _globalState$api$disp.products;
|
|
828
|
-
if (transformFunction) try {
|
|
829
|
-
return await transformFunction({
|
|
830
|
-
merchant: (0, $8c691d7f86317052$export$8e769ad4338a911e).merchant[0](),
|
|
831
|
-
market: (0, $8c691d7f86317052$export$8e769ad4338a911e).market[0](),
|
|
832
|
-
locale: (0, $8c691d7f86317052$export$8e769ad4338a911e).usedLocale[0]().backend_locale_,
|
|
833
|
-
displays: displays
|
|
834
|
-
});
|
|
835
|
-
} catch (e) {
|
|
836
|
-
console.error(e);
|
|
837
|
-
throw new Error("Error running display transformer for recommendations", {
|
|
838
|
-
cause: e
|
|
839
|
-
}); // To stop recommendation grid from rendering
|
|
840
|
-
}
|
|
841
|
-
|
|
842
|
-
return displays;
|
|
843
|
-
});
|
|
844
|
-
return recs;
|
|
845
|
-
}
|
|
846
821
|
function $c02e9fd51f31a1bd$export$82cfdc85a4d15688(props) {
|
|
847
822
|
$758339150fbfe9d5$export$4daadad26e48a2c7(props);
|
|
848
823
|
return $0dd9d9a9c7da4c1d$export$f6e64e17bd69eeef({
|
|
@@ -854,7 +829,7 @@ function $c02e9fd51f31a1bd$export$5abb40edfde2a843(props, set_portals) {
|
|
|
854
829
|
const component_portals = new Set();
|
|
855
830
|
return $jb2Oo$RecommendationSlider({
|
|
856
831
|
get recommendations() {
|
|
857
|
-
return
|
|
832
|
+
return props.recommendations;
|
|
858
833
|
},
|
|
859
834
|
product_card_template: display => $cce08f18e2476cbf$export$32024253978abdc7({
|
|
860
835
|
component_props: {
|
|
@@ -880,7 +855,7 @@ function $cd68097a7ee08669$export$e46079a2793e9ec7(props, set_portals) {
|
|
|
880
855
|
const component_portals = new Set();
|
|
881
856
|
return $jb2Oo$RecommendationGrid({
|
|
882
857
|
get recommendations() {
|
|
883
|
-
return
|
|
858
|
+
return props.recommendations;
|
|
884
859
|
},
|
|
885
860
|
product_card_template: display => {
|
|
886
861
|
if (0, $jb2Oo$isServer) {
|
|
@@ -1009,7 +984,8 @@ function $1895644749ca8d8a$export$6501da23a2770fc() {
|
|
|
1009
984
|
fetchRecommendations: $1895644749ca8d8a$var$fetchRecommendations
|
|
1010
985
|
};
|
|
1011
986
|
}
|
|
1012
|
-
function $1895644749ca8d8a$var$fetchRecommendations(opts) {
|
|
987
|
+
async function $1895644749ca8d8a$var$fetchRecommendations(opts) {
|
|
988
|
+
var _globalState$api, _globalState$api$disp;
|
|
1013
989
|
const {
|
|
1014
990
|
merchant: [get_merchant],
|
|
1015
991
|
market: [get_market],
|
|
@@ -1020,13 +996,21 @@ function $1895644749ca8d8a$var$fetchRecommendations(opts) {
|
|
|
1020
996
|
const market = $jb2Oo$untrack(get_market);
|
|
1021
997
|
const locale = $jb2Oo$untrack(get_usedLocale).backend_locale_;
|
|
1022
998
|
if (!merchant || !market || !locale) throw new Error("Depict recommendations are not configured (merchant, market or locale is falsy). Wrap your app in a DepictProvider.");
|
|
1023
|
-
|
|
999
|
+
const fetchedRecs = await $jb2Oo$fetchDepictRecommendations({
|
|
1024
1000
|
merchant: merchant,
|
|
1025
1001
|
market: market,
|
|
1026
1002
|
locale: locale,
|
|
1027
1003
|
sessionId: $jb2Oo$untrack(get_sessionId),
|
|
1028
1004
|
...opts
|
|
1029
1005
|
});
|
|
1006
|
+
const transformFunction = (_globalState$api = (0, $8c691d7f86317052$export$8e769ad4338a911e).api) === null || _globalState$api === void 0 ? void 0 : (_globalState$api$disp = _globalState$api.display_transformers) === null || _globalState$api$disp === void 0 ? void 0 : _globalState$api$disp.products;
|
|
1007
|
+
if (transformFunction) return await transformFunction({
|
|
1008
|
+
merchant: merchant,
|
|
1009
|
+
market: market,
|
|
1010
|
+
locale: locale,
|
|
1011
|
+
displays: fetchedRecs
|
|
1012
|
+
});
|
|
1013
|
+
return fetchedRecs;
|
|
1030
1014
|
}
|
|
1031
1015
|
const $05726fa9c7eda0a1$export$804fac5697cfbe35 = router => (relativeUrl, _ref) => {
|
|
1032
1016
|
let {
|
package/README.md
CHANGED
|
@@ -8,4 +8,5 @@ Breaking changes:
|
|
|
8
8
|
- 1.4.0 Added `brand_` translation string to Locale.
|
|
9
9
|
- 1.5.0: Don't allow creating two `DepictProvider` instances. Don't allow two synced SearchPage and CategoryPage's to be created. Add `stateKey` property to all the components which can be used to create two instances of everything with completely different states.
|
|
10
10
|
- 2.0.0 Made `enableContentSearch` `true` by default. Redesigned filter counts. Added RecommendationGrid and RecommendationSlider.
|
|
11
|
-
- 3.0.
|
|
11
|
+
- 3.0.18 (first `latest` tagged release of version 3): Please see this [migration guide](https://docs.depict.ai/other-guides/sdk-migration-v2-v3)
|
|
12
|
+
- 3.1.0: Changed `fetchRecommendations` to run the `displayTransformers` instead of `RecommendationSlider` and `RecommendationGrid`
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.depict button{border:none}.depict a{text-decoration:none}.depict,.depict *{box-sizing:border-box}.depict.plp{color:#0f0f0f}.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>.depict-slider{align-self:flex-start}.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 .depict-slider>.scroll-status{position:absolute;left:50%;transform:translate(-50%)}.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;width:100%;border:1px solid #cbcbcc;border-radius:4px;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 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.plp .depict-slider,.depict.recommendations .depict-slider{min-width:0;flex-grow:1;position:relative}.depict.plp .depict-slider .sliding,.depict.recommendations .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::-webkit-scrollbar,.depict.recommendations .depict-slider .sliding::-webkit-scrollbar{display:none}.depict.plp .depict-slider .sliding>*,.depict.recommendations .depict-slider .sliding>*{flex-shrink:0}.depict.plp .depict-slider .d-navbutton,.depict.recommendations .depict-slider .d-navbutton{z-index:2;touch-action:manipulation;cursor:pointer;justify-content:flex-end;align-items:center;transition-duration:.2s;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.depict.plp .depict-slider .d-navbutton>div,.depict.recommendations .depict-slider .d-navbutton>div{display:flex}.depict.plp .depict-slider .d-navbutton.left,.depict.recommendations .depict-slider .d-navbutton.left{transform:translateY(-50%)rotate(180deg)}.depict.plp .depict-slider:not(.products) .sliding>:not(:first-child),.depict.recommendations .depict-slider:not(.products) .sliding>:not(:first-child){margin-left:5px}.depict.plp .depict-slider:not(.products) .sliding>:not(:last-child),.depict.recommendations .depict-slider:not(.products) .sliding>:not(:last-child){margin-right:5px}.depict.plp .depict-slider:not(.products) .d-navbutton,.depict.recommendations .depict-slider:not(.products) .d-navbutton{height:calc(100% + 2px);width:26px;background:linear-gradient(270deg,#fff 50%,#0000 105%);padding:0 1px 0 0}.depict.plp .depict-slider:not(.products) .d-navbutton.left,.depict.recommendations .depict-slider:not(.products) .d-navbutton.left{left:-1px}.depict.plp .depict-slider:not(.products) .d-navbutton.right,.depict.recommendations .depict-slider:not(.products) .d-navbutton.right{right:-1px}.depict.plp .depict-slider:not(.products) .d-navbutton img,.depict.recommendations .depict-slider:not(.products) .d-navbutton img{width:100%;height:100%}@media not all and (hover:none){.depict.plp .depict-slider:not(.products) .d-navbutton:hover svg,.depict.recommendations .depict-slider:not(.products) .d-navbutton:hover svg{transform:scale(1.2)}}.depict.plp .depict-slider:not(.products) .d-navbutton:focus-visible svg,.depict.recommendations .depict-slider:not(.products) .d-navbutton:focus-visible svg{transform:scale(1.5)}.depict.plp .depict-slider:not(.products) .d-navbutton:focus-visible svg path,.depict.recommendations .depict-slider:not(.products) .d-navbutton:focus-visible svg path{filter:drop-shadow(-2px -2px 4px #418fc3cc)drop-shadow(2px 2px 4px #418fc3cc)}.depict.plp .depict-slider:not(.products) .d-navbutton svg,.depict.recommendations .depict-slider:not(.products) .d-navbutton svg{transition-duration:.15s}.depict.plp .depict-slider:not(.products) .d-navbutton:active,.depict.recommendations .depict-slider:not(.products) .d-navbutton:active{opacity:.9}.depict.plp .depict-slider.products .d-navbutton,.depict.recommendations .depict-slider.products .d-navbutton{opacity:.7;background:#fff;border-radius:12px 0 0 12px;padding:15px 10px 15px 15px}.depict.plp .depict-slider.products .d-navbutton:not(.hidden):hover,.depict.recommendations .depict-slider.products .d-navbutton:not(.hidden):hover{opacity:1}.depict.plp .depict-slider.products .d-navbutton:focus-visible,.depict.recommendations .depict-slider.products .d-navbutton:focus-visible{opacity:1;filter:drop-shadow(-2px -2px 4px #418fc3cc)drop-shadow(2px 2px 4px #418fc3cc);outline:none}.depict.plp .depict-slider.products .d-navbutton:focus-visible svg,.depict.recommendations .depict-slider.products .d-navbutton:focus-visible svg{transform:scale(1.5)}.depict.plp .depict-slider.products .d-navbutton.left,.depict.recommendations .depict-slider.products .d-navbutton.left{left:0}.depict.plp .depict-slider.products .d-navbutton.right,.depict.recommendations .depict-slider.products .d-navbutton.right{right:0}.depict.plp .depict-slider.products .d-navbutton svg path,.depict.recommendations .depict-slider.products .d-navbutton svg path{fill:#333335}.depict.plp .depict-slider button.d-navbutton.hidden,.depict.recommendations .depict-slider button.d-navbutton.hidden{cursor:default;opacity:0;animation-name:depict_slider_button_unclickable;animation-duration:5s;animation-fill-mode:forwards}@keyframes depict_slider_button_unclickable{0%{pointer-events:all}to{pointer-events:none;visibility:hidden}}.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-listing .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:#868689}.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:#cbcbcc;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>.depict-slider{align-self:flex-start}.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 .depict-slider>.scroll-status{position:absolute;bottom:10%;left:50%;transform:translate(-50%)}.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;width:100%;border:1px solid #cbcbcc;border-radius:4px;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 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.plp .depict-slider,.depict.recommendations .depict-slider{min-width:0;flex-grow:1;position:relative}.depict.plp .depict-slider .sliding,.depict.recommendations .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::-webkit-scrollbar,.depict.recommendations .depict-slider .sliding::-webkit-scrollbar{display:none}.depict.plp .depict-slider .sliding>*,.depict.recommendations .depict-slider .sliding>*{flex-shrink:0}.depict.plp .depict-slider .d-navbutton,.depict.recommendations .depict-slider .d-navbutton{z-index:2;touch-action:manipulation;cursor:pointer;justify-content:flex-end;align-items:center;transition-duration:.2s;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.depict.plp .depict-slider .d-navbutton>div,.depict.recommendations .depict-slider .d-navbutton>div{display:flex}.depict.plp .depict-slider .d-navbutton.left,.depict.recommendations .depict-slider .d-navbutton.left{transform:translateY(-50%)rotate(180deg)}.depict.plp .depict-slider:not(.products) .sliding>:not(:first-child),.depict.recommendations .depict-slider:not(.products) .sliding>:not(:first-child){margin-left:5px}.depict.plp .depict-slider:not(.products) .sliding>:not(:last-child),.depict.recommendations .depict-slider:not(.products) .sliding>:not(:last-child){margin-right:5px}.depict.plp .depict-slider:not(.products) .d-navbutton,.depict.recommendations .depict-slider:not(.products) .d-navbutton{height:calc(100% + 2px);width:26px;background:linear-gradient(270deg,#fff 50%,#0000 105%);padding:0 1px 0 0}.depict.plp .depict-slider:not(.products) .d-navbutton.left,.depict.recommendations .depict-slider:not(.products) .d-navbutton.left{left:-1px}.depict.plp .depict-slider:not(.products) .d-navbutton.right,.depict.recommendations .depict-slider:not(.products) .d-navbutton.right{right:-1px}.depict.plp .depict-slider:not(.products) .d-navbutton img,.depict.recommendations .depict-slider:not(.products) .d-navbutton img{width:100%;height:100%}@media not all and (hover:none){.depict.plp .depict-slider:not(.products) .d-navbutton:hover svg,.depict.recommendations .depict-slider:not(.products) .d-navbutton:hover svg{transform:scale(1.2)}}.depict.plp .depict-slider:not(.products) .d-navbutton:focus-visible svg,.depict.recommendations .depict-slider:not(.products) .d-navbutton:focus-visible svg{transform:scale(1.5)}.depict.plp .depict-slider:not(.products) .d-navbutton:focus-visible svg path,.depict.recommendations .depict-slider:not(.products) .d-navbutton:focus-visible svg path{filter:drop-shadow(-2px -2px 4px #418fc3cc)drop-shadow(2px 2px 4px #418fc3cc)}.depict.plp .depict-slider:not(.products) .d-navbutton svg,.depict.recommendations .depict-slider:not(.products) .d-navbutton svg{transition-duration:.15s}.depict.plp .depict-slider:not(.products) .d-navbutton:active,.depict.recommendations .depict-slider:not(.products) .d-navbutton:active{opacity:.9}.depict.plp .depict-slider.products .d-navbutton,.depict.recommendations .depict-slider.products .d-navbutton{opacity:.7;background:#fff;border-radius:12px 0 0 12px;padding:15px 10px 15px 15px}.depict.plp .depict-slider.products .d-navbutton:not(.hidden):hover,.depict.recommendations .depict-slider.products .d-navbutton:not(.hidden):hover{opacity:1}.depict.plp .depict-slider.products .d-navbutton:focus-visible,.depict.recommendations .depict-slider.products .d-navbutton:focus-visible{opacity:1;filter:drop-shadow(-2px -2px 4px #418fc3cc)drop-shadow(2px 2px 4px #418fc3cc);outline:none}.depict.plp .depict-slider.products .d-navbutton:focus-visible svg,.depict.recommendations .depict-slider.products .d-navbutton:focus-visible svg{transform:scale(1.5)}.depict.plp .depict-slider.products .d-navbutton.left,.depict.recommendations .depict-slider.products .d-navbutton.left{left:0}.depict.plp .depict-slider.products .d-navbutton.right,.depict.recommendations .depict-slider.products .d-navbutton.right{right:0}.depict.plp .depict-slider.products .d-navbutton svg path,.depict.recommendations .depict-slider.products .d-navbutton svg path{fill:#333335}.depict.plp .depict-slider button.d-navbutton.hidden,.depict.recommendations .depict-slider button.d-navbutton.hidden{cursor:default;opacity:0;animation-name:depict_slider_button_unclickable;animation-duration:5s;animation-fill-mode:forwards}@keyframes depict_slider_button_unclickable{0%{pointer-events:all}to{pointer-events:none;visibility:hidden}}.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-listing .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:#868689}.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:#cbcbcc;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
|
@@ -39,7 +39,7 @@ $parcel$export(module.exports, "version", () => $db7b67857900028b$export$83d89fb
|
|
|
39
39
|
$parcel$export(module.exports, "Navigation", () => $b742053c966024b4$export$b8a61e5c71402559);
|
|
40
40
|
/*! Depict.ai search and product listing react SDK wrapper */ // This is where the actual source of your React stuff should live
|
|
41
41
|
// Note, if you add an export here, also add one in src-server/main.ts
|
|
42
|
-
const $db7b67857900028b$export$83d89fbfd8236492 = "3.0
|
|
42
|
+
const $db7b67857900028b$export$83d89fbfd8236492 = "3.1.0";
|
|
43
43
|
const $0b7cd4fb39fc3502$export$8e769ad4338a911e = {
|
|
44
44
|
usedLocale: $2IzJs$solidjs.createSignal((0, $2IzJs$depictaiuilocales.defaultLocale)),
|
|
45
45
|
search_instances: new Map(),
|
|
@@ -802,30 +802,6 @@ function $67657ea54664baa8$export$4daadad26e48a2c7(props) {
|
|
|
802
802
|
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");
|
|
803
803
|
}
|
|
804
804
|
}
|
|
805
|
-
function $3d35ad83c8fdfa92$export$12250cb2badef3d2(props) {
|
|
806
|
-
const recs = props.recommendations;
|
|
807
|
-
if ("then" in recs)
|
|
808
|
-
// Run displayTransformers for RecommendationSlider and RecommendationGrid
|
|
809
|
-
return recs.then(async displays => {
|
|
810
|
-
const transformFunction = (0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).api?.display_transformers?.products;
|
|
811
|
-
if (transformFunction) try {
|
|
812
|
-
return await transformFunction({
|
|
813
|
-
merchant: (0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).merchant[0](),
|
|
814
|
-
market: (0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).market[0](),
|
|
815
|
-
locale: (0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).usedLocale[0]().backend_locale_,
|
|
816
|
-
displays: displays
|
|
817
|
-
});
|
|
818
|
-
} catch (e) {
|
|
819
|
-
console.error(e);
|
|
820
|
-
throw new Error("Error running display transformer for recommendations", {
|
|
821
|
-
cause: e
|
|
822
|
-
}); // To stop recommendation grid from rendering
|
|
823
|
-
}
|
|
824
|
-
|
|
825
|
-
return displays;
|
|
826
|
-
});
|
|
827
|
-
return recs;
|
|
828
|
-
}
|
|
829
805
|
function $8ffd7da37fdd46be$export$82cfdc85a4d15688(props) {
|
|
830
806
|
$67657ea54664baa8$export$4daadad26e48a2c7(props);
|
|
831
807
|
return $b4d0d98857ed9934$export$f6e64e17bd69eeef({
|
|
@@ -837,7 +813,7 @@ function $8ffd7da37fdd46be$export$5abb40edfde2a843(props, set_portals) {
|
|
|
837
813
|
const component_portals = new Set();
|
|
838
814
|
return $2IzJs$depictaiui.RecommendationSlider({
|
|
839
815
|
get recommendations() {
|
|
840
|
-
return
|
|
816
|
+
return props.recommendations;
|
|
841
817
|
},
|
|
842
818
|
product_card_template: display => $6081519c185fcf70$export$32024253978abdc7({
|
|
843
819
|
component_props: {
|
|
@@ -862,7 +838,7 @@ function $c6b960f2a07285c8$export$e46079a2793e9ec7(props, set_portals) {
|
|
|
862
838
|
const component_portals = new Set();
|
|
863
839
|
return $2IzJs$depictaiui.RecommendationGrid({
|
|
864
840
|
get recommendations() {
|
|
865
|
-
return
|
|
841
|
+
return props.recommendations;
|
|
866
842
|
},
|
|
867
843
|
product_card_template: display => {
|
|
868
844
|
if (0, $2IzJs$solidjsweb.isServer) {
|
|
@@ -983,7 +959,7 @@ function $a134ea100690b628$export$6501da23a2770fc() {
|
|
|
983
959
|
fetchRecommendations: $a134ea100690b628$var$fetchRecommendations
|
|
984
960
|
};
|
|
985
961
|
}
|
|
986
|
-
function $a134ea100690b628$var$fetchRecommendations(opts) {
|
|
962
|
+
async function $a134ea100690b628$var$fetchRecommendations(opts) {
|
|
987
963
|
const {
|
|
988
964
|
merchant: [get_merchant],
|
|
989
965
|
market: [get_market],
|
|
@@ -994,13 +970,21 @@ function $a134ea100690b628$var$fetchRecommendations(opts) {
|
|
|
994
970
|
const market = $2IzJs$solidjs.untrack(get_market);
|
|
995
971
|
const locale = $2IzJs$solidjs.untrack(get_usedLocale).backend_locale_;
|
|
996
972
|
if (!merchant || !market || !locale) throw new Error("Depict recommendations are not configured (merchant, market or locale is falsy). Wrap your app in a DepictProvider.");
|
|
997
|
-
|
|
973
|
+
const fetchedRecs = await $2IzJs$depictaiui.fetchDepictRecommendations({
|
|
998
974
|
merchant: merchant,
|
|
999
975
|
market: market,
|
|
1000
976
|
locale: locale,
|
|
1001
977
|
sessionId: $2IzJs$solidjs.untrack(get_sessionId),
|
|
1002
978
|
...opts
|
|
1003
979
|
});
|
|
980
|
+
const transformFunction = (0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).api?.display_transformers?.products;
|
|
981
|
+
if (transformFunction) return await transformFunction({
|
|
982
|
+
merchant: merchant,
|
|
983
|
+
market: market,
|
|
984
|
+
locale: locale,
|
|
985
|
+
displays: fetchedRecs
|
|
986
|
+
});
|
|
987
|
+
return fetchedRecs;
|
|
1004
988
|
}
|
|
1005
989
|
const $e387bd534de10acd$export$804fac5697cfbe35 = router => (relativeUrl, {
|
|
1006
990
|
scroll: scroll,
|
package/latest/index.d.ts
CHANGED
|
@@ -3,7 +3,7 @@ import React, { PropsWithChildren, FC, ReactNode, ReactPortal, ReactElement } fr
|
|
|
3
3
|
import { BaseCategoryProviderConfig, BaseProviderConfig, BaseSearchProviderConfig, ModernDisplayWithPageUrl, BaseProductListingConfig, BaseSearchPageConfig, BaseCategoryPageConfig, CategoryTitle, embedded_num_products, ListingQuery, 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 = "3.0
|
|
6
|
+
export const version = "3.1.0";
|
|
7
7
|
interface UsePerformanceClientReturn {
|
|
8
8
|
dpc: DPC;
|
|
9
9
|
}
|
package/latest/index.js
CHANGED
|
@@ -15,7 +15,7 @@ import { renderToString as $2GFvs$renderToString } from "react-dom/server";
|
|
|
15
15
|
// Note, if you add an export here, also add one in src-server/main.ts
|
|
16
16
|
import { register_es_version } from "../multi_import_deduplicator.mjs";
|
|
17
17
|
register_es_version("react-ui", "latest");
|
|
18
|
-
const $c9c4d066f9a5b51b$export$83d89fbfd8236492 = "3.0
|
|
18
|
+
const $c9c4d066f9a5b51b$export$83d89fbfd8236492 = "3.1.0";
|
|
19
19
|
const $42858f023ef23dab$export$8e769ad4338a911e = {
|
|
20
20
|
usedLocale: $2GFvs$createSignal((0, $2GFvs$defaultLocale)),
|
|
21
21
|
search_instances: new Map(),
|
|
@@ -778,30 +778,6 @@ function $ab2bb2d1f47a25b7$export$4daadad26e48a2c7(props) {
|
|
|
778
778
|
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");
|
|
779
779
|
}
|
|
780
780
|
}
|
|
781
|
-
function $5ee8e057dabc10d4$export$12250cb2badef3d2(props) {
|
|
782
|
-
const recs = props.recommendations;
|
|
783
|
-
if ("then" in recs)
|
|
784
|
-
// Run displayTransformers for RecommendationSlider and RecommendationGrid
|
|
785
|
-
return recs.then(async displays => {
|
|
786
|
-
const transformFunction = (0, $42858f023ef23dab$export$8e769ad4338a911e).api?.display_transformers?.products;
|
|
787
|
-
if (transformFunction) try {
|
|
788
|
-
return await transformFunction({
|
|
789
|
-
merchant: (0, $42858f023ef23dab$export$8e769ad4338a911e).merchant[0](),
|
|
790
|
-
market: (0, $42858f023ef23dab$export$8e769ad4338a911e).market[0](),
|
|
791
|
-
locale: (0, $42858f023ef23dab$export$8e769ad4338a911e).usedLocale[0]().backend_locale_,
|
|
792
|
-
displays: displays
|
|
793
|
-
});
|
|
794
|
-
} catch (e) {
|
|
795
|
-
console.error(e);
|
|
796
|
-
throw new Error("Error running display transformer for recommendations", {
|
|
797
|
-
cause: e
|
|
798
|
-
}); // To stop recommendation grid from rendering
|
|
799
|
-
}
|
|
800
|
-
|
|
801
|
-
return displays;
|
|
802
|
-
});
|
|
803
|
-
return recs;
|
|
804
|
-
}
|
|
805
781
|
function $4fd5dc0e231a60d9$export$82cfdc85a4d15688(props) {
|
|
806
782
|
$ab2bb2d1f47a25b7$export$4daadad26e48a2c7(props);
|
|
807
783
|
return $c83ba9ab79386687$export$f6e64e17bd69eeef({
|
|
@@ -813,7 +789,7 @@ function $4fd5dc0e231a60d9$export$5abb40edfde2a843(props, set_portals) {
|
|
|
813
789
|
const component_portals = new Set();
|
|
814
790
|
return $2GFvs$RecommendationSlider({
|
|
815
791
|
get recommendations() {
|
|
816
|
-
return
|
|
792
|
+
return props.recommendations;
|
|
817
793
|
},
|
|
818
794
|
product_card_template: display => $bcf84a32dc612a43$export$32024253978abdc7({
|
|
819
795
|
component_props: {
|
|
@@ -838,7 +814,7 @@ function $4d5c3f13a5ae62a7$export$e46079a2793e9ec7(props, set_portals) {
|
|
|
838
814
|
const component_portals = new Set();
|
|
839
815
|
return $2GFvs$RecommendationGrid({
|
|
840
816
|
get recommendations() {
|
|
841
|
-
return
|
|
817
|
+
return props.recommendations;
|
|
842
818
|
},
|
|
843
819
|
product_card_template: display => {
|
|
844
820
|
if (0, $2GFvs$isServer) {
|
|
@@ -959,7 +935,7 @@ function $1bb4271dc44722e2$export$6501da23a2770fc() {
|
|
|
959
935
|
fetchRecommendations: $1bb4271dc44722e2$var$fetchRecommendations
|
|
960
936
|
};
|
|
961
937
|
}
|
|
962
|
-
function $1bb4271dc44722e2$var$fetchRecommendations(opts) {
|
|
938
|
+
async function $1bb4271dc44722e2$var$fetchRecommendations(opts) {
|
|
963
939
|
const {
|
|
964
940
|
merchant: [get_merchant],
|
|
965
941
|
market: [get_market],
|
|
@@ -970,13 +946,21 @@ function $1bb4271dc44722e2$var$fetchRecommendations(opts) {
|
|
|
970
946
|
const market = $2GFvs$untrack(get_market);
|
|
971
947
|
const locale = $2GFvs$untrack(get_usedLocale).backend_locale_;
|
|
972
948
|
if (!merchant || !market || !locale) throw new Error("Depict recommendations are not configured (merchant, market or locale is falsy). Wrap your app in a DepictProvider.");
|
|
973
|
-
|
|
949
|
+
const fetchedRecs = await $2GFvs$fetchDepictRecommendations({
|
|
974
950
|
merchant: merchant,
|
|
975
951
|
market: market,
|
|
976
952
|
locale: locale,
|
|
977
953
|
sessionId: $2GFvs$untrack(get_sessionId),
|
|
978
954
|
...opts
|
|
979
955
|
});
|
|
956
|
+
const transformFunction = (0, $42858f023ef23dab$export$8e769ad4338a911e).api?.display_transformers?.products;
|
|
957
|
+
if (transformFunction) return await transformFunction({
|
|
958
|
+
merchant: merchant,
|
|
959
|
+
market: market,
|
|
960
|
+
locale: locale,
|
|
961
|
+
displays: fetchedRecs
|
|
962
|
+
});
|
|
963
|
+
return fetchedRecs;
|
|
980
964
|
}
|
|
981
965
|
const $a92aa2beb560b8af$export$804fac5697cfbe35 = router => (relativeUrl, {
|
|
982
966
|
scroll: scroll,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@depict-ai/react-ui",
|
|
3
|
-
"version": "3.0
|
|
3
|
+
"version": "3.1.0",
|
|
4
4
|
"packageManager": "yarn@3.2.2",
|
|
5
5
|
"source": "src/index.ts",
|
|
6
6
|
"types": "ES10/index.d.ts",
|
|
@@ -136,9 +136,9 @@
|
|
|
136
136
|
"@babel/runtime": "latest",
|
|
137
137
|
"@babel/runtime-corejs3": "latest",
|
|
138
138
|
"@depict-ai/dpc": "^2.0.4",
|
|
139
|
-
"@depict-ai/plp-styling": "^2.0.
|
|
140
|
-
"@depict-ai/ui": "^3.0.
|
|
141
|
-
"@depict-ai/utilishared": "^2.0.
|
|
139
|
+
"@depict-ai/plp-styling": "^2.0.6",
|
|
140
|
+
"@depict-ai/ui": "^3.0.21",
|
|
141
|
+
"@depict-ai/utilishared": "^2.0.8",
|
|
142
142
|
"solid-js": "^1.8.1"
|
|
143
143
|
},
|
|
144
144
|
"peerDependencies": {
|
|
@@ -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": "^2.0.
|
|
153
|
+
"@depict-ai/plp-styling": "^2.0.6",
|
|
154
154
|
"@jest/globals": "^29.3.1",
|
|
155
155
|
"@parcel/babel-preset-env": "^2.10.3",
|
|
156
156
|
"@parcel/transformer-sass": "^2.10.3",
|
package/server/ES10/index.cjs
CHANGED
|
@@ -7,7 +7,6 @@ var $aNCHr$reactdomserver = require("react-dom/server");
|
|
|
7
7
|
var $aNCHr$solidjs = require("solid-js");
|
|
8
8
|
var $aNCHr$reactjsxruntime = require("react/jsx-runtime");
|
|
9
9
|
var $aNCHr$reactdom = require("react-dom");
|
|
10
|
-
var $aNCHr$depictaiuilocales = require("@depict-ai/ui/locales/ES10");
|
|
11
10
|
require("../../multi_import_deduplicator.cjs").register_es_version("react-ui", "ES10");
|
|
12
11
|
function $parcel$export(e, n, v, s) {
|
|
13
12
|
Object.defineProperty(e, n, {
|
|
@@ -141,53 +140,11 @@ async function $3441d987b5ea85cb$export$32024253978abdc7(_ref) {
|
|
|
141
140
|
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.
|
|
142
141
|
return [solid_container];
|
|
143
142
|
}
|
|
144
|
-
const $ef516b1f92253963$export$8e769ad4338a911e = {
|
|
145
|
-
usedLocale: $aNCHr$solidjs.createSignal((0, $aNCHr$depictaiuilocales.defaultLocale)),
|
|
146
|
-
search_instances: new Map(),
|
|
147
|
-
category_instances: new Map(),
|
|
148
|
-
api: null,
|
|
149
|
-
dpc: null,
|
|
150
|
-
merchant: $aNCHr$solidjs.createSignal(),
|
|
151
|
-
market: $aNCHr$solidjs.createSignal(),
|
|
152
|
-
sessionId: $aNCHr$solidjs.createSignal(),
|
|
153
|
-
known_category_paths: new Set(),
|
|
154
|
-
search_page_path_: $aNCHr$solidjs.createSignal(),
|
|
155
|
-
search_page_in_dom: $aNCHr$solidjs.createSignal(false),
|
|
156
|
-
category_page_in_dom: $aNCHr$solidjs.createSignal(false),
|
|
157
|
-
provider_is_updating: $aNCHr$solidjs.createSignal(false),
|
|
158
|
-
enable_content_search: $aNCHr$solidjs.createSignal(),
|
|
159
|
-
disable_override_listing_id: $aNCHr$solidjs.createSignal()
|
|
160
|
-
};
|
|
161
|
-
function $7b4cd941f15b2582$export$12250cb2badef3d2(props) {
|
|
162
|
-
const recs = props.recommendations;
|
|
163
|
-
if ("then" in recs)
|
|
164
|
-
// Run displayTransformers for RecommendationSlider and RecommendationGrid
|
|
165
|
-
return recs.then(async displays => {
|
|
166
|
-
var _globalState$api, _globalState$api$disp;
|
|
167
|
-
const transformFunction = (_globalState$api = (0, $ef516b1f92253963$export$8e769ad4338a911e).api) === null || _globalState$api === void 0 ? void 0 : (_globalState$api$disp = _globalState$api.display_transformers) === null || _globalState$api$disp === void 0 ? void 0 : _globalState$api$disp.products;
|
|
168
|
-
if (transformFunction) try {
|
|
169
|
-
return await transformFunction({
|
|
170
|
-
merchant: (0, $ef516b1f92253963$export$8e769ad4338a911e).merchant[0](),
|
|
171
|
-
market: (0, $ef516b1f92253963$export$8e769ad4338a911e).market[0](),
|
|
172
|
-
locale: (0, $ef516b1f92253963$export$8e769ad4338a911e).usedLocale[0]().backend_locale_,
|
|
173
|
-
displays: displays
|
|
174
|
-
});
|
|
175
|
-
} catch (e) {
|
|
176
|
-
console.error(e);
|
|
177
|
-
throw new Error("Error running display transformer for recommendations", {
|
|
178
|
-
cause: e
|
|
179
|
-
}); // To stop recommendation grid from rendering
|
|
180
|
-
}
|
|
181
|
-
|
|
182
|
-
return displays;
|
|
183
|
-
});
|
|
184
|
-
return recs;
|
|
185
|
-
}
|
|
186
143
|
function $3b36cc844440a979$export$e46079a2793e9ec7(props, set_portals) {
|
|
187
144
|
const component_portals = new Set();
|
|
188
145
|
return $aNCHr$depictaiui.RecommendationGrid({
|
|
189
146
|
get recommendations() {
|
|
190
|
-
return
|
|
147
|
+
return props.recommendations;
|
|
191
148
|
},
|
|
192
149
|
product_card_template: display => {
|
|
193
150
|
if (0, $aNCHr$solidjsweb.isServer) {
|
|
@@ -233,7 +190,7 @@ function $3b36cc844440a979$export$e46079a2793e9ec7(props, set_portals) {
|
|
|
233
190
|
}
|
|
234
191
|
});
|
|
235
192
|
}
|
|
236
|
-
const $efbdd2dab4314170$export$83d89fbfd8236492 = "3.0
|
|
193
|
+
const $efbdd2dab4314170$export$83d89fbfd8236492 = "3.1.0";
|
|
237
194
|
function $202459d454907b31$export$9fac37a9c21c2f3b(props) {
|
|
238
195
|
return props.children;
|
|
239
196
|
}
|
package/server/ES10/index.d.ts
CHANGED
|
@@ -3,7 +3,7 @@ import React, { PropsWithChildren, FC, ReactNode, ReactPortal, ReactElement } fr
|
|
|
3
3
|
import { BaseCategoryProviderConfig, BaseProviderConfig, BaseSearchProviderConfig, ModernDisplayWithPageUrl, BaseProductListingConfig, BaseSearchPageConfig, BaseCategoryPageConfig, CategoryTitle, embedded_num_products, ListingQuery, 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 = "3.0
|
|
6
|
+
export const version = "3.1.0";
|
|
7
7
|
interface UsePerformanceClientReturn {
|
|
8
8
|
dpc: DPC;
|
|
9
9
|
}
|
package/server/ES10/index.js
CHANGED
|
@@ -4,10 +4,9 @@ import { ImagePlaceholder as $7h5e1$ImagePlaceholder, TextPlaceholder as $7h5e1$
|
|
|
4
4
|
import { generateHydrationScript as $7h5e1$generateHydrationScript, renderToString as $7h5e1$renderToString, isServer as $7h5e1$isServer, ssr as $7h5e1$ssr, ssrHydrationKey as $7h5e1$ssrHydrationKey } from "solid-js/web";
|
|
5
5
|
import { dwarn as $7h5e1$dwarn } from "@depict-ai/utilishared/ES10";
|
|
6
6
|
import { renderToString as $7h5e1$renderToString1 } from "react-dom/server";
|
|
7
|
-
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
|
|
7
|
+
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";
|
|
8
8
|
import { jsx as $7h5e1$jsx } from "react/jsx-runtime";
|
|
9
9
|
import { createPortal as $7h5e1$createPortal } from "react-dom";
|
|
10
|
-
import { defaultLocale as $7h5e1$defaultLocale } from "@depict-ai/ui/locales/ES10";
|
|
11
10
|
|
|
12
11
|
//"use client"; // <- opt out of react server components to the rendering method where components are rendered both on the client and on the server and then hydrated on the client, see https://www.joshwcomeau.com/react/server-components/#:~:text=Client%20Components%20render%20on%20both%20the%20client%20and%20the%20server.
|
|
13
12
|
// This "use client" actually just gets deleted by parcel, but I'm leaving it because we re-add it in the build scripts and this makes you more aware of that
|
|
@@ -118,53 +117,11 @@ async function $cce08f18e2476cbf$export$32024253978abdc7(_ref) {
|
|
|
118
117
|
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.
|
|
119
118
|
return [solid_container];
|
|
120
119
|
}
|
|
121
|
-
const $8c691d7f86317052$export$8e769ad4338a911e = {
|
|
122
|
-
usedLocale: $7h5e1$createSignal((0, $7h5e1$defaultLocale)),
|
|
123
|
-
search_instances: new Map(),
|
|
124
|
-
category_instances: new Map(),
|
|
125
|
-
api: null,
|
|
126
|
-
dpc: null,
|
|
127
|
-
merchant: $7h5e1$createSignal(),
|
|
128
|
-
market: $7h5e1$createSignal(),
|
|
129
|
-
sessionId: $7h5e1$createSignal(),
|
|
130
|
-
known_category_paths: new Set(),
|
|
131
|
-
search_page_path_: $7h5e1$createSignal(),
|
|
132
|
-
search_page_in_dom: $7h5e1$createSignal(false),
|
|
133
|
-
category_page_in_dom: $7h5e1$createSignal(false),
|
|
134
|
-
provider_is_updating: $7h5e1$createSignal(false),
|
|
135
|
-
enable_content_search: $7h5e1$createSignal(),
|
|
136
|
-
disable_override_listing_id: $7h5e1$createSignal()
|
|
137
|
-
};
|
|
138
|
-
function $9da62538e07f038e$export$12250cb2badef3d2(props) {
|
|
139
|
-
const recs = props.recommendations;
|
|
140
|
-
if ("then" in recs)
|
|
141
|
-
// Run displayTransformers for RecommendationSlider and RecommendationGrid
|
|
142
|
-
return recs.then(async displays => {
|
|
143
|
-
var _globalState$api, _globalState$api$disp;
|
|
144
|
-
const transformFunction = (_globalState$api = (0, $8c691d7f86317052$export$8e769ad4338a911e).api) === null || _globalState$api === void 0 ? void 0 : (_globalState$api$disp = _globalState$api.display_transformers) === null || _globalState$api$disp === void 0 ? void 0 : _globalState$api$disp.products;
|
|
145
|
-
if (transformFunction) try {
|
|
146
|
-
return await transformFunction({
|
|
147
|
-
merchant: (0, $8c691d7f86317052$export$8e769ad4338a911e).merchant[0](),
|
|
148
|
-
market: (0, $8c691d7f86317052$export$8e769ad4338a911e).market[0](),
|
|
149
|
-
locale: (0, $8c691d7f86317052$export$8e769ad4338a911e).usedLocale[0]().backend_locale_,
|
|
150
|
-
displays: displays
|
|
151
|
-
});
|
|
152
|
-
} catch (e) {
|
|
153
|
-
console.error(e);
|
|
154
|
-
throw new Error("Error running display transformer for recommendations", {
|
|
155
|
-
cause: e
|
|
156
|
-
}); // To stop recommendation grid from rendering
|
|
157
|
-
}
|
|
158
|
-
|
|
159
|
-
return displays;
|
|
160
|
-
});
|
|
161
|
-
return recs;
|
|
162
|
-
}
|
|
163
120
|
function $cd68097a7ee08669$export$e46079a2793e9ec7(props, set_portals) {
|
|
164
121
|
const component_portals = new Set();
|
|
165
122
|
return $7h5e1$RecommendationGrid({
|
|
166
123
|
get recommendations() {
|
|
167
|
-
return
|
|
124
|
+
return props.recommendations;
|
|
168
125
|
},
|
|
169
126
|
product_card_template: display => {
|
|
170
127
|
if (0, $7h5e1$isServer) {
|
|
@@ -210,7 +167,7 @@ function $cd68097a7ee08669$export$e46079a2793e9ec7(props, set_portals) {
|
|
|
210
167
|
}
|
|
211
168
|
});
|
|
212
169
|
}
|
|
213
|
-
const $9bd9bb8700ab2ada$export$83d89fbfd8236492 = "3.0
|
|
170
|
+
const $9bd9bb8700ab2ada$export$83d89fbfd8236492 = "3.1.0";
|
|
214
171
|
function $5c4add0a8fe94894$export$9fac37a9c21c2f3b(props) {
|
|
215
172
|
return props.children;
|
|
216
173
|
}
|
package/server/latest/index.cjs
CHANGED
|
@@ -7,7 +7,6 @@ var $7QqFM$reactdomserver = require("react-dom/server");
|
|
|
7
7
|
var $7QqFM$solidjs = require("solid-js");
|
|
8
8
|
var $7QqFM$reactjsxruntime = require("react/jsx-runtime");
|
|
9
9
|
var $7QqFM$reactdom = require("react-dom");
|
|
10
|
-
var $7QqFM$depictaiuilocales = require("@depict-ai/ui/locales/latest");
|
|
11
10
|
require("../../multi_import_deduplicator.cjs").register_es_version("react-ui", "latest");
|
|
12
11
|
function $parcel$export(e, n, v, s) {
|
|
13
12
|
Object.defineProperty(e, n, {
|
|
@@ -135,52 +134,11 @@ async function $6081519c185fcf70$export$32024253978abdc7({
|
|
|
135
134
|
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.
|
|
136
135
|
return [solid_container];
|
|
137
136
|
}
|
|
138
|
-
const $0b7cd4fb39fc3502$export$8e769ad4338a911e = {
|
|
139
|
-
usedLocale: $7QqFM$solidjs.createSignal((0, $7QqFM$depictaiuilocales.defaultLocale)),
|
|
140
|
-
search_instances: new Map(),
|
|
141
|
-
category_instances: new Map(),
|
|
142
|
-
api: null,
|
|
143
|
-
dpc: null,
|
|
144
|
-
merchant: $7QqFM$solidjs.createSignal(),
|
|
145
|
-
market: $7QqFM$solidjs.createSignal(),
|
|
146
|
-
sessionId: $7QqFM$solidjs.createSignal(),
|
|
147
|
-
known_category_paths: new Set(),
|
|
148
|
-
search_page_path_: $7QqFM$solidjs.createSignal(),
|
|
149
|
-
search_page_in_dom: $7QqFM$solidjs.createSignal(false),
|
|
150
|
-
category_page_in_dom: $7QqFM$solidjs.createSignal(false),
|
|
151
|
-
provider_is_updating: $7QqFM$solidjs.createSignal(false),
|
|
152
|
-
enable_content_search: $7QqFM$solidjs.createSignal(),
|
|
153
|
-
disable_override_listing_id: $7QqFM$solidjs.createSignal()
|
|
154
|
-
};
|
|
155
|
-
function $3d35ad83c8fdfa92$export$12250cb2badef3d2(props) {
|
|
156
|
-
const recs = props.recommendations;
|
|
157
|
-
if ("then" in recs)
|
|
158
|
-
// Run displayTransformers for RecommendationSlider and RecommendationGrid
|
|
159
|
-
return recs.then(async displays => {
|
|
160
|
-
const transformFunction = (0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).api?.display_transformers?.products;
|
|
161
|
-
if (transformFunction) try {
|
|
162
|
-
return await transformFunction({
|
|
163
|
-
merchant: (0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).merchant[0](),
|
|
164
|
-
market: (0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).market[0](),
|
|
165
|
-
locale: (0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).usedLocale[0]().backend_locale_,
|
|
166
|
-
displays: displays
|
|
167
|
-
});
|
|
168
|
-
} catch (e) {
|
|
169
|
-
console.error(e);
|
|
170
|
-
throw new Error("Error running display transformer for recommendations", {
|
|
171
|
-
cause: e
|
|
172
|
-
}); // To stop recommendation grid from rendering
|
|
173
|
-
}
|
|
174
|
-
|
|
175
|
-
return displays;
|
|
176
|
-
});
|
|
177
|
-
return recs;
|
|
178
|
-
}
|
|
179
137
|
function $c6b960f2a07285c8$export$e46079a2793e9ec7(props, set_portals) {
|
|
180
138
|
const component_portals = new Set();
|
|
181
139
|
return $7QqFM$depictaiui.RecommendationGrid({
|
|
182
140
|
get recommendations() {
|
|
183
|
-
return
|
|
141
|
+
return props.recommendations;
|
|
184
142
|
},
|
|
185
143
|
product_card_template: display => {
|
|
186
144
|
if (0, $7QqFM$solidjsweb.isServer) {
|
|
@@ -224,7 +182,7 @@ function $c6b960f2a07285c8$export$e46079a2793e9ec7(props, set_portals) {
|
|
|
224
182
|
}
|
|
225
183
|
});
|
|
226
184
|
}
|
|
227
|
-
const $db7b67857900028b$export$83d89fbfd8236492 = "3.0
|
|
185
|
+
const $db7b67857900028b$export$83d89fbfd8236492 = "3.1.0";
|
|
228
186
|
function $41e7e5d85b5e0d49$export$9fac37a9c21c2f3b(props) {
|
|
229
187
|
return props.children;
|
|
230
188
|
}
|
package/server/latest/index.d.ts
CHANGED
|
@@ -3,7 +3,7 @@ import React, { PropsWithChildren, FC, ReactNode, ReactPortal, ReactElement } fr
|
|
|
3
3
|
import { BaseCategoryProviderConfig, BaseProviderConfig, BaseSearchProviderConfig, ModernDisplayWithPageUrl, BaseProductListingConfig, BaseSearchPageConfig, BaseCategoryPageConfig, CategoryTitle, embedded_num_products, ListingQuery, 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 = "3.0
|
|
6
|
+
export const version = "3.1.0";
|
|
7
7
|
interface UsePerformanceClientReturn {
|
|
8
8
|
dpc: DPC;
|
|
9
9
|
}
|
package/server/latest/index.js
CHANGED
|
@@ -4,10 +4,9 @@ import { ImagePlaceholder as $eOXet$ImagePlaceholder, TextPlaceholder as $eOXet$
|
|
|
4
4
|
import { generateHydrationScript as $eOXet$generateHydrationScript, renderToString as $eOXet$renderToString, isServer as $eOXet$isServer, ssr as $eOXet$ssr, ssrHydrationKey as $eOXet$ssrHydrationKey } from "solid-js/web";
|
|
5
5
|
import { dwarn as $eOXet$dwarn } from "@depict-ai/utilishared/latest";
|
|
6
6
|
import { renderToString as $eOXet$renderToString1 } from "react-dom/server";
|
|
7
|
-
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
|
|
7
|
+
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";
|
|
8
8
|
import { jsx as $eOXet$jsx } from "react/jsx-runtime";
|
|
9
9
|
import { createPortal as $eOXet$createPortal } from "react-dom";
|
|
10
|
-
import { defaultLocale as $eOXet$defaultLocale } from "@depict-ai/ui/locales/latest";
|
|
11
10
|
|
|
12
11
|
//"use client"; // <- opt out of react server components to the rendering method where components are rendered both on the client and on the server and then hydrated on the client, see https://www.joshwcomeau.com/react/server-components/#:~:text=Client%20Components%20render%20on%20both%20the%20client%20and%20the%20server.
|
|
13
12
|
// This "use client" actually just gets deleted by parcel, but I'm leaving it because we re-add it in the build scripts and this makes you more aware of that
|
|
@@ -112,52 +111,11 @@ async function $bcf84a32dc612a43$export$32024253978abdc7({
|
|
|
112
111
|
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.
|
|
113
112
|
return [solid_container];
|
|
114
113
|
}
|
|
115
|
-
const $42858f023ef23dab$export$8e769ad4338a911e = {
|
|
116
|
-
usedLocale: $eOXet$createSignal((0, $eOXet$defaultLocale)),
|
|
117
|
-
search_instances: new Map(),
|
|
118
|
-
category_instances: new Map(),
|
|
119
|
-
api: null,
|
|
120
|
-
dpc: null,
|
|
121
|
-
merchant: $eOXet$createSignal(),
|
|
122
|
-
market: $eOXet$createSignal(),
|
|
123
|
-
sessionId: $eOXet$createSignal(),
|
|
124
|
-
known_category_paths: new Set(),
|
|
125
|
-
search_page_path_: $eOXet$createSignal(),
|
|
126
|
-
search_page_in_dom: $eOXet$createSignal(false),
|
|
127
|
-
category_page_in_dom: $eOXet$createSignal(false),
|
|
128
|
-
provider_is_updating: $eOXet$createSignal(false),
|
|
129
|
-
enable_content_search: $eOXet$createSignal(),
|
|
130
|
-
disable_override_listing_id: $eOXet$createSignal()
|
|
131
|
-
};
|
|
132
|
-
function $5ee8e057dabc10d4$export$12250cb2badef3d2(props) {
|
|
133
|
-
const recs = props.recommendations;
|
|
134
|
-
if ("then" in recs)
|
|
135
|
-
// Run displayTransformers for RecommendationSlider and RecommendationGrid
|
|
136
|
-
return recs.then(async displays => {
|
|
137
|
-
const transformFunction = (0, $42858f023ef23dab$export$8e769ad4338a911e).api?.display_transformers?.products;
|
|
138
|
-
if (transformFunction) try {
|
|
139
|
-
return await transformFunction({
|
|
140
|
-
merchant: (0, $42858f023ef23dab$export$8e769ad4338a911e).merchant[0](),
|
|
141
|
-
market: (0, $42858f023ef23dab$export$8e769ad4338a911e).market[0](),
|
|
142
|
-
locale: (0, $42858f023ef23dab$export$8e769ad4338a911e).usedLocale[0]().backend_locale_,
|
|
143
|
-
displays: displays
|
|
144
|
-
});
|
|
145
|
-
} catch (e) {
|
|
146
|
-
console.error(e);
|
|
147
|
-
throw new Error("Error running display transformer for recommendations", {
|
|
148
|
-
cause: e
|
|
149
|
-
}); // To stop recommendation grid from rendering
|
|
150
|
-
}
|
|
151
|
-
|
|
152
|
-
return displays;
|
|
153
|
-
});
|
|
154
|
-
return recs;
|
|
155
|
-
}
|
|
156
114
|
function $4d5c3f13a5ae62a7$export$e46079a2793e9ec7(props, set_portals) {
|
|
157
115
|
const component_portals = new Set();
|
|
158
116
|
return $eOXet$RecommendationGrid({
|
|
159
117
|
get recommendations() {
|
|
160
|
-
return
|
|
118
|
+
return props.recommendations;
|
|
161
119
|
},
|
|
162
120
|
product_card_template: display => {
|
|
163
121
|
if (0, $eOXet$isServer) {
|
|
@@ -201,7 +159,7 @@ function $4d5c3f13a5ae62a7$export$e46079a2793e9ec7(props, set_portals) {
|
|
|
201
159
|
}
|
|
202
160
|
});
|
|
203
161
|
}
|
|
204
|
-
const $c9c4d066f9a5b51b$export$83d89fbfd8236492 = "3.0
|
|
162
|
+
const $c9c4d066f9a5b51b$export$83d89fbfd8236492 = "3.1.0";
|
|
205
163
|
function $2b1fdeb83610500f$export$9fac37a9c21c2f3b(props) {
|
|
206
164
|
return props.children;
|
|
207
165
|
}
|