gw-customer-accounts 1.2.5 → 1.2.7

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.
@@ -1,21 +1,21 @@
1
- import{G as s,a as i}from"./assets/index-DI2a6rRk.js";customElements.whenDefined("gw-customer-accounts").then(()=>{customElements.define("gw-wishlist-button",class extends HTMLElement{constructor(){var r,o;super(),this.shadow=this.attachShadow({mode:"open"}),this.isIconOnly=this.hasAttribute("icon-only");const t=this.querySelector('template[name="icon"]');this.iconEl=this._createIcon(t,"icon");const e=this.querySelector('template[name="filled-icon"]');this.filledIconEl=this._createIcon(e,"filled-icon"),this.hasAttribute("icon-only")?this.shadowRoot.innerHTML=`
2
- <button class="wishlist-button wishlist-button--icon-only" part="button">
3
- ${this.iconEl}
4
- ${this.filledIconEl}
5
- </button>
6
- `:this.shadowRoot.innerHTML=`
7
- <button class="wishlist-button" part="button">
8
- <span class="icon-container" part="icon-container">
1
+ import{G as s,a}from"./assets/index-DI2a6rRk.js";customElements.whenDefined("gw-customer-accounts").then(()=>{class c extends HTMLElement{constructor(){super(),this.shadow=this.attachShadow({mode:"open"})}set variantId(t){this.setAttribute("variant-id",t)}get variantId(){return this.getAttribute("variant-id")}get productId(){return this.getAttribute("product-id")}connectedCallback(){this.renderButton(),this.button=this.shadowRoot.querySelector("button"),this.loader=this.shadowRoot.querySelector("[data-loader]"),this.addEventListener("click",t=>this._handleFavoriteButtonClick(t)),this._activateButton(this._isProductInFavorites()),document.addEventListener("variant:change",({detail:{productId:t,variant:e}})=>{t!==this.productId||!e||(this.variantId=e.id)}),s.app.addEventListener(a.CUSTOM_EVENTS.FAVORITES_STORAGE_UPDATED,()=>{this._activateButton(this._isProductInFavorites())})}log(t){const e="[GW_WISHLIST_BUTTON] Product ID: "+this.productId;console.log(e,t)}renderButton(){if(this.iconEl=this._createIcon("icon"),this.filledIconEl=this._createIcon("filled-icon"),this.hasAttribute("icon-only")){this.shadowRoot.innerHTML=`
2
+ <button class="wishlist-button wishlist-button--icon-only" part="button">
9
3
  ${this.iconEl}
10
4
  ${this.filledIconEl}
11
- </span>
12
- <span class="" data-button-label></span>
13
- <span class="loader" data-loader></span>
14
- </button>
15
- `,this.productId=this.getAttribute("product-id"),console.log("GWUtils.componentData",s.componentData),this.labels={inactive:((r=s.componentData.wishlist)==null?void 0:r.addToWishlistLabel)||"Add to wishlist",active:((o=s.componentData.wishlist)==null?void 0:o.addedToWishlistLabel)||"Added to wishlist"},this.button=this.shadowRoot.querySelector("button"),this.buttonLabel=this.shadowRoot.querySelector("[data-button-label]"),this.loader=this.shadowRoot.querySelector("[data-loader]"),this.buttonIcon=this.shadowRoot.querySelectorAll("[data-button-icon]")}set variantId(t){this.setAttribute("variant-id",t)}get variantId(){return this.getAttribute("variant-id")}connectedCallback(){this.addEventListener("click",t=>this._handleFavoriteButtonClick(t)),this._activateButton(this._isProductInFavorites()),document.addEventListener("variant:change",({detail:{productId:t,variant:e}})=>{t!==this.productId||!e||(this.variantId=e.id)}),s.app.addEventListener(i.CUSTOM_EVENTS.FAVORITES_STORAGE_UPDATED,()=>{this._activateButton(this._isProductInFavorites())})}_createIcon(t,e){if(!t)return"";const o=t.content.cloneNode(!0).querySelector("svg");return o.setAttribute("part",e),o.setAttribute("data-button-icon",""),o.setAttribute("hidden",""),o.outerHTML}_getVariantId(){const e=new URLSearchParams(window.location.search).get("variant");return e||this.variantId}async _handleFavoriteButtonClick(t){if(t.preventDefault(),t.stopPropagation(),this.button.disabled=!0,this.button.setAttribute("aria-disabled","true"),this.setAttribute("processing",""),this.loader&&(this.loader.hidden=!1),this.hasAttribute("saved")){this._activateButton(!1);try{const e=await this._removeFromFavorites();if(e.error)throw new Error(e.error);const r=e.products;if(!r)throw new Error("Product not found");s.dashboard._removeFavoriteItem(s.parseVariantId(r.id)),s.app.updateFavoriteItemsStorage({removeIds:[s.parseVariantId(r.id)]});const o=s.customerFirstName?`${s.customerFirstName}'s`:"Your";s.notify(`
5
+ </button>
6
+ `;return}this.shadowRoot.innerHTML=`
7
+ <button class="wishlist-button" part="button">
8
+ <span class="icon-container" part="icon-container">
9
+ ${this.iconEl}
10
+ ${this.filledIconEl}
11
+ </span>
12
+ <span class="" data-button-label></span>
13
+ <span class="loader" data-loader></span>
14
+ </button>
15
+ `}_createIcon(t){if(!t)return"";const e=this.querySelector(`template[name="${t}"]`);if(!e)return"";const o=e.content.cloneNode(!0).querySelector("svg");return this.log(o),o.setAttribute("part",t),o.setAttribute("data-button-icon",""),o.setAttribute("hidden",""),o.outerHTML}_getVariantId(){const e=new URLSearchParams(window.location.search).get("variant");return e||this.variantId}async _handleFavoriteButtonClick(t){if(t.preventDefault(),t.stopPropagation(),this.button.disabled=!0,this.button.setAttribute("aria-disabled","true"),this.setAttribute("processing",""),this.loader&&(this.loader.hidden=!1),this.hasAttribute("saved")){this._activateButton(!1);try{const e=await this._removeFromFavorites();if(e.error)throw new Error(e.error);const r=e.products;if(!r)throw new Error("Product not found");s.dashboard._removeFavoriteItem(s.parseVariantId(r.id)),s.app.updateFavoriteItemsStorage({removeIds:[s.parseVariantId(r.id)]});const o=s.customerFirstName?`${s.customerFirstName}'s`:"Your";s.notify(`
16
16
  <span>Product removed from ${o} favorites</span>
17
17
  <a href="#my-favorites" class="gw-notification__link">View</a>
18
18
  `)}catch(e){console.error(e),this._activateButton(!0),s.notify("An error occurred. Please try again later.")}}else{this._activateButton(!0);try{const e=await this._addToFavorites();if(e.error)throw new Error(e.error);const r=e.products;if(!r)throw new Error("Product not found");s.app.updateFavoriteItemsStorage({addIds:[s.parseVariantId(r.id)]}),s.dashboard._renderSingleFavoriteItem(r);const o=s.customerFirstName?`${s.customerFirstName}'s`:"Your";s.notify(`
19
19
  <span>Added to ${o} favorites</span>
20
20
  <a href="#my-favorites" class="gw-notification__link">View</a>
21
- `),document.dispatchEvent(new CustomEvent("wishlist:add",{detail:{product:{id:this.productData.id,title:this.productData.title},variant:this.currentVariant}}))}catch(e){console.error(e),this._activateButton(!1),s.notify("An error occurred. Please try again later.")}}this.loader&&(this.loader.hidden=!0),this.button.disabled=!1,this.button.removeAttribute("aria-disabled"),this.removeAttribute("Processing")}get productData(){if(!this._productData){const t=this.querySelector("[data-product-data]");this._productData=JSON.parse(t.textContent)}return this._productData}get productVariants(){var t;return((t=this.productData.variants)==null?void 0:t.nodes)||[]}get currentVariant(){return this.productVariants.find(t=>t.id==this.variantId)}async _addToFavorites(){if(!s.hasCustomer){const e=this.querySelector("[data-product-data]"),r=JSON.parse(e.textContent),o=localStorage.getItem(i.STORAGE_KEYS.TEMP_WISHLIST_PRODUCTS)||"[]",a=JSON.parse(o).filter(d=>d.id!==r.id);return a.push(r),localStorage.setItem(i.STORAGE_KEYS.TEMP_WISHLIST_PRODUCTS,JSON.stringify(a)),{success:!0,products:r}}const t=await s.request(i.ENDPOINTS.FAVORITES.ADD,{prodID:this.productId,varID:this.variantId||this._getVariantId()});if(t.error)throw new Error(t.error);return t}async _removeFromFavorites(){if(!s.hasCustomer){const e=this.querySelector("[data-product-data]"),r=JSON.parse(e.textContent),o=localStorage.getItem(i.STORAGE_KEYS.TEMP_WISHLIST_PRODUCTS)||"[]",a=JSON.parse(o).filter(d=>d.id!==r.id);return localStorage.setItem(i.STORAGE_KEYS.TEMP_WISHLIST_PRODUCTS,JSON.stringify(a)),{success:!0,products:r}}const t=await s.request(i.ENDPOINTS.FAVORITES.REMOVE,{prodID:this.productId});if(t.error)throw new Error(t.error);return t}_activateButton(t){this.buttonIcon.length&&this.buttonIcon.forEach(e=>e.removeAttribute("hidden")),this.loader&&this.loader.setAttribute("hidden",""),t?(this.setAttribute("saved",""),this.button.setAttribute("aria-label",this.labels.active),this.buttonLabel&&(this.buttonLabel.textContent=this.labels.active)):(this.removeAttribute("saved"),this.button.setAttribute("aria-label",this.labels.inactive),this.buttonLabel&&(this.buttonLabel.textContent=this.labels.inactive))}_isProductInFavorites(){if(!s.hasCustomer){const r=localStorage.getItem(i.STORAGE_KEYS.TEMP_WISHLIST_PRODUCTS);return(r?JSON.parse(r):[]).some(n=>n.id===this.productId)}const t=sessionStorage.getItem(i.STORAGE_KEYS.WISHLIST_PRODUCT_IDS);return(t?JSON.parse(t):[]).includes(this.productId)}})});
21
+ `),document.dispatchEvent(new CustomEvent("wishlist:add",{detail:{product:{id:this.productData.id,title:this.productData.title},variant:this.currentVariant}}))}catch(e){console.error(e),this._activateButton(!1),s.notify("An error occurred. Please try again later.")}}this.loader&&(this.loader.hidden=!0),this.button.disabled=!1,this.button.removeAttribute("aria-disabled"),this.removeAttribute("Processing")}get productData(){if(!this._productData){const t=this.querySelector("[data-product-data]");this._productData=JSON.parse(t.textContent)}return this._productData}get productVariants(){var t;return((t=this.productData.variants)==null?void 0:t.nodes)||[]}get currentVariant(){return this.productVariants.find(t=>t.id==this.variantId)}async _addToFavorites(){if(!s.hasCustomer){const e=this.querySelector("[data-product-data]"),r=JSON.parse(e.textContent),o=localStorage.getItem(a.STORAGE_KEYS.TEMP_WISHLIST_PRODUCTS)||"[]",i=JSON.parse(o).filter(d=>d.id!==r.id);return i.push(r),localStorage.setItem(a.STORAGE_KEYS.TEMP_WISHLIST_PRODUCTS,JSON.stringify(i)),{success:!0,products:r}}const t=await s.request(a.ENDPOINTS.FAVORITES.ADD,{prodID:this.productId,varID:this.variantId||this._getVariantId()});if(t.error)throw new Error(t.error);return t}async _removeFromFavorites(){if(!s.hasCustomer){const e=this.querySelector("[data-product-data]"),r=JSON.parse(e.textContent),o=localStorage.getItem(a.STORAGE_KEYS.TEMP_WISHLIST_PRODUCTS)||"[]",i=JSON.parse(o).filter(d=>d.id!==r.id);return localStorage.setItem(a.STORAGE_KEYS.TEMP_WISHLIST_PRODUCTS,JSON.stringify(i)),{success:!0,products:r}}const t=await s.request(a.ENDPOINTS.FAVORITES.REMOVE,{prodID:this.productId});if(t.error)throw new Error(t.error);return t}_activateButton(t){var n,i;const e=this.shadowRoot.querySelectorAll("[data-button-icon]"),r=this.shadowRoot.querySelector("[data-button-label]"),o={inactive:((n=s.componentData.wishlist)==null?void 0:n.addToWishlistLabel)||"Add to wishlist",active:((i=s.componentData.wishlist)==null?void 0:i.addedToWishlistLabel)||"Added to wishlist"};e.length&&e.forEach(d=>d.removeAttribute("hidden")),this.loader&&this.loader.setAttribute("hidden",""),t?(this.setAttribute("saved",""),this.button.setAttribute("aria-label",o.active),r&&(r.textContent=o.active)):(this.removeAttribute("saved"),this.button.setAttribute("aria-label",o.inactive),r&&(r.textContent=o.inactive))}_isProductInFavorites(){if(!s.hasCustomer){const r=localStorage.getItem(a.STORAGE_KEYS.TEMP_WISHLIST_PRODUCTS);return(r?JSON.parse(r):[]).some(n=>n.id===this.productId)}const t=sessionStorage.getItem(a.STORAGE_KEYS.WISHLIST_PRODUCT_IDS);return(t?JSON.parse(t):[]).includes(this.productId)}}document.readyState==="loading"?document.addEventListener("DOMContentLoaded",()=>{}):customElements.define("gw-wishlist-button",c)});
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "gw-customer-accounts",
3
- "version": "1.2.5",
3
+ "version": "1.2.7",
4
4
  "description": "",
5
5
  "main": "gw-customer-accounts.js",
6
6
  "type": "module",
@@ -2,382 +2,391 @@ import { GWUtils } from '../utils';
2
2
  import { GWCA } from '../utils/constants';
3
3
 
4
4
  customElements.whenDefined('gw-customer-accounts').then(() => {
5
- customElements.define(
6
- 'gw-wishlist-button',
7
- class GWWishlistButton extends HTMLElement {
8
- constructor() {
9
- super();
10
- this.shadow = this.attachShadow({ mode: 'open' });
11
- this.isIconOnly = this.hasAttribute('icon-only');
12
-
13
- const iconTemplate = this.querySelector('template[name="icon"]');
14
- this.iconEl = this._createIcon(iconTemplate, 'icon');
15
-
16
- const filledIconTemplate = this.querySelector(
17
- 'template[name="filled-icon"]'
18
- );
19
- this.filledIconEl = this._createIcon(filledIconTemplate, 'filled-icon');
20
-
21
- if (this.hasAttribute('icon-only')) {
22
- this.shadowRoot.innerHTML = `
23
- <button class="wishlist-button wishlist-button--icon-only" part="button">
24
- ${this.iconEl}
25
- ${this.filledIconEl}
26
- </button>
27
- `;
28
- } else {
29
- this.shadowRoot.innerHTML = `
30
- <button class="wishlist-button" part="button">
31
- <span class="icon-container" part="icon-container">
32
- ${this.iconEl}
33
- ${this.filledIconEl}
34
- </span>
35
- <span class="" data-button-label></span>
36
- <span class="loader" data-loader></span>
37
- </button>
38
- `;
39
- }
5
+ class GWWishlistButton extends HTMLElement {
6
+ constructor() {
7
+ super();
8
+ this.shadow = this.attachShadow({ mode: 'open' });
9
+ }
40
10
 
41
- this.productId = this.getAttribute('product-id');
42
- console.log('GWUtils.componentData', GWUtils.componentData);
43
- this.labels = {
44
- inactive:
45
- GWUtils.componentData.wishlist?.addToWishlistLabel ||
46
- 'Add to wishlist',
47
- active:
48
- GWUtils.componentData.wishlist?.addedToWishlistLabel ||
49
- 'Added to wishlist',
50
- };
11
+ set variantId(value) {
12
+ this.setAttribute('variant-id', value);
13
+ }
51
14
 
52
- this.button = this.shadowRoot.querySelector('button');
53
- this.buttonLabel = this.shadowRoot.querySelector('[data-button-label]');
54
- this.loader = this.shadowRoot.querySelector('[data-loader]');
55
- this.buttonIcon =
56
- this.shadowRoot.querySelectorAll('[data-button-icon]');
57
- }
15
+ get variantId() {
16
+ return this.getAttribute('variant-id');
17
+ }
58
18
 
59
- set variantId(value) {
60
- this.setAttribute('variant-id', value);
61
- }
19
+ get productId() {
20
+ return this.getAttribute('product-id');
21
+ }
62
22
 
63
- get variantId() {
64
- return this.getAttribute('variant-id');
65
- }
23
+ connectedCallback() {
24
+ this.renderButton();
66
25
 
67
- connectedCallback() {
68
- // Add the event listener for the button click
69
- this.addEventListener('click', (e) =>
70
- this._handleFavoriteButtonClick(e)
71
- );
26
+ this.button = this.shadowRoot.querySelector('button');
27
+ this.loader = this.shadowRoot.querySelector('[data-loader]');
72
28
 
73
- // Display initial state of the button
74
- this._activateButton(this._isProductInFavorites());
29
+ // Add the event listener for the button click
30
+ this.addEventListener('click', (e) => this._handleFavoriteButtonClick(e));
75
31
 
76
- document.addEventListener(
77
- 'variant:change',
78
- ({ detail: { productId, variant } }) => {
79
- if (productId !== this.productId || !variant) return;
32
+ // Display initial state of the button
33
+ this._activateButton(this._isProductInFavorites());
80
34
 
81
- this.variantId = variant.id;
82
- }
83
- );
35
+ document.addEventListener(
36
+ 'variant:change',
37
+ ({ detail: { productId, variant } }) => {
38
+ if (productId !== this.productId || !variant) return;
84
39
 
85
- // Listen for the wishlist initialization event
86
- GWUtils.app.addEventListener(
87
- GWCA.CUSTOM_EVENTS.FAVORITES_STORAGE_UPDATED,
88
- () => {
89
- this._activateButton(this._isProductInFavorites());
90
- }
91
- );
92
- }
40
+ this.variantId = variant.id;
41
+ }
42
+ );
93
43
 
94
- _createIcon(template, partName) {
95
- if (!template) {
96
- return '';
44
+ // Listen for the wishlist initialization event
45
+ GWUtils.app.addEventListener(
46
+ GWCA.CUSTOM_EVENTS.FAVORITES_STORAGE_UPDATED,
47
+ () => {
48
+ this._activateButton(this._isProductInFavorites());
97
49
  }
50
+ );
51
+ }
98
52
 
99
- const clone = template.content.cloneNode(true);
100
- const svgEl = clone.querySelector('svg');
101
- svgEl.setAttribute('part', partName);
102
- svgEl.setAttribute('data-button-icon', '');
103
- svgEl.setAttribute('hidden', '');
104
- return svgEl.outerHTML;
105
- }
53
+ log(log) {
54
+ const logKey = '[GW_WISHLIST_BUTTON] ' + 'Product ID: ' + this.productId;
106
55
 
107
- /**
108
- * Gets the variant ID from the URL if it exists.
109
- * @returns {number} The variant ID.
110
- */
111
- _getVariantId() {
112
- const params = new URLSearchParams(window.location.search);
113
- const variantIdFromUrl = params.get('variant');
56
+ console.log(logKey, log);
57
+ }
114
58
 
115
- if (!variantIdFromUrl) return this.variantId;
59
+ renderButton() {
60
+ this.iconEl = this._createIcon('icon');
61
+ this.filledIconEl = this._createIcon('filled-icon');
116
62
 
117
- return variantIdFromUrl;
63
+ // If icon-only attribute is present, render the button with only the icon
64
+ if (this.hasAttribute('icon-only')) {
65
+ this.shadowRoot.innerHTML = `
66
+ <button class="wishlist-button wishlist-button--icon-only" part="button">
67
+ ${this.iconEl}
68
+ ${this.filledIconEl}
69
+ </button>
70
+ `;
71
+
72
+ return;
118
73
  }
119
74
 
120
- async _handleFavoriteButtonClick(event) {
121
- event.preventDefault();
122
- event.stopPropagation();
75
+ // Render the button with the icon and label
76
+ this.shadowRoot.innerHTML = `
77
+ <button class="wishlist-button" part="button">
78
+ <span class="icon-container" part="icon-container">
79
+ ${this.iconEl}
80
+ ${this.filledIconEl}
81
+ </span>
82
+ <span class="" data-button-label></span>
83
+ <span class="loader" data-loader></span>
84
+ </button>
85
+ `;
86
+ }
123
87
 
124
- this.button.disabled = true;
125
- this.button.setAttribute('aria-disabled', 'true');
126
- this.setAttribute('processing', '');
88
+ _createIcon(iconType) {
89
+ if (!iconType) return '';
90
+ const templateEl = this.querySelector(`template[name="${iconType}"]`);
91
+ if (!templateEl) return '';
92
+
93
+ const clone = templateEl.content.cloneNode(true);
94
+ const svgEl = clone.querySelector('svg');
95
+ this.log(svgEl);
96
+ svgEl.setAttribute('part', iconType);
97
+ svgEl.setAttribute('data-button-icon', '');
98
+ svgEl.setAttribute('hidden', '');
99
+ return svgEl.outerHTML;
100
+ }
127
101
 
128
- if (this.loader) this.loader.hidden = false;
102
+ /**
103
+ * Gets the variant ID from the URL if it exists.
104
+ * @returns {number} The variant ID.
105
+ */
106
+ _getVariantId() {
107
+ const params = new URLSearchParams(window.location.search);
108
+ const variantIdFromUrl = params.get('variant');
129
109
 
130
- if (!this.hasAttribute('saved')) {
131
- // Activate the button to prevent multiple clicks
132
- this._activateButton(true);
110
+ if (!variantIdFromUrl) return this.variantId;
133
111
 
134
- try {
135
- // Add the product to the favorites list
136
- const favResponse = await this._addToFavorites();
112
+ return variantIdFromUrl;
113
+ }
114
+
115
+ async _handleFavoriteButtonClick(event) {
116
+ event.preventDefault();
117
+ event.stopPropagation();
137
118
 
138
- if (favResponse.error) {
139
- throw new Error(favResponse.error);
140
- }
119
+ this.button.disabled = true;
120
+ this.button.setAttribute('aria-disabled', 'true');
121
+ this.setAttribute('processing', '');
141
122
 
142
- const favoritedProduct = favResponse.products;
143
- if (!favoritedProduct) {
144
- throw new Error('Product not found');
145
- }
123
+ if (this.loader) this.loader.hidden = false;
146
124
 
147
- // Add the favorited product id to the storage and reinitialize all wishlist buttons
148
- GWUtils.app.updateFavoriteItemsStorage({
149
- addIds: [GWUtils.parseVariantId(favoritedProduct.id)],
150
- });
125
+ if (!this.hasAttribute('saved')) {
126
+ // Activate the button to prevent multiple clicks
127
+ this._activateButton(true);
151
128
 
152
- // Render the favorited product to the customer's dashboard
153
- GWUtils.dashboard._renderSingleFavoriteItem(favoritedProduct);
129
+ try {
130
+ // Add the product to the favorites list
131
+ const favResponse = await this._addToFavorites();
154
132
 
155
- // Notify the customer
156
- const customerFirstName = GWUtils.customerFirstName
157
- ? `${GWUtils.customerFirstName}'s`
158
- : 'Your';
159
- GWUtils.notify(`
133
+ if (favResponse.error) {
134
+ throw new Error(favResponse.error);
135
+ }
136
+
137
+ const favoritedProduct = favResponse.products;
138
+ if (!favoritedProduct) {
139
+ throw new Error('Product not found');
140
+ }
141
+
142
+ // Add the favorited product id to the storage and reinitialize all wishlist buttons
143
+ GWUtils.app.updateFavoriteItemsStorage({
144
+ addIds: [GWUtils.parseVariantId(favoritedProduct.id)],
145
+ });
146
+
147
+ // Render the favorited product to the customer's dashboard
148
+ GWUtils.dashboard._renderSingleFavoriteItem(favoritedProduct);
149
+
150
+ // Notify the customer
151
+ const customerFirstName = GWUtils.customerFirstName
152
+ ? `${GWUtils.customerFirstName}'s`
153
+ : 'Your';
154
+ GWUtils.notify(`
160
155
  <span>Added to ${customerFirstName} favorites</span>
161
156
  <a href="#my-favorites" class="gw-notification__link">View</a>
162
157
  `);
163
158
 
164
- // Dispatch event
165
- document.dispatchEvent(
166
- new CustomEvent('wishlist:add', {
167
- detail: {
168
- product: {
169
- id: this.productData.id,
170
- title: this.productData.title,
171
- },
172
- variant: this.currentVariant,
159
+ // Dispatch event
160
+ document.dispatchEvent(
161
+ new CustomEvent('wishlist:add', {
162
+ detail: {
163
+ product: {
164
+ id: this.productData.id,
165
+ title: this.productData.title,
173
166
  },
174
- })
175
- );
176
- } catch (error) {
177
- console.error(error);
178
- this._activateButton(false);
179
- GWUtils.notify('An error occurred. Please try again later.');
180
- }
181
- } else {
167
+ variant: this.currentVariant,
168
+ },
169
+ })
170
+ );
171
+ } catch (error) {
172
+ console.error(error);
182
173
  this._activateButton(false);
174
+ GWUtils.notify('An error occurred. Please try again later.');
175
+ }
176
+ } else {
177
+ this._activateButton(false);
178
+
179
+ try {
180
+ // Remove the product from the favorites list
181
+ const removeFavResponse = await this._removeFromFavorites();
183
182
 
184
- try {
185
- // Remove the product from the favorites list
186
- const removeFavResponse = await this._removeFromFavorites();
187
-
188
- if (removeFavResponse.error) {
189
- throw new Error(removeFavResponse.error);
190
- }
191
-
192
- const unfavoritedProduct = removeFavResponse.products;
193
- if (!unfavoritedProduct) {
194
- throw new Error('Product not found');
195
- }
196
-
197
- // Remove the favorited product from carousel and drawer
198
- GWUtils.dashboard._removeFavoriteItem(
199
- GWUtils.parseVariantId(unfavoritedProduct.id)
200
- );
201
-
202
- // Reinitialize all wishlist buttons
203
- GWUtils.app.updateFavoriteItemsStorage({
204
- removeIds: [GWUtils.parseVariantId(unfavoritedProduct.id)],
205
- });
206
-
207
- // Notify the user
208
- const customerFirstName = GWUtils.customerFirstName
209
- ? `${GWUtils.customerFirstName}'s`
210
- : 'Your';
211
- GWUtils.notify(`
183
+ if (removeFavResponse.error) {
184
+ throw new Error(removeFavResponse.error);
185
+ }
186
+
187
+ const unfavoritedProduct = removeFavResponse.products;
188
+ if (!unfavoritedProduct) {
189
+ throw new Error('Product not found');
190
+ }
191
+
192
+ // Remove the favorited product from carousel and drawer
193
+ GWUtils.dashboard._removeFavoriteItem(
194
+ GWUtils.parseVariantId(unfavoritedProduct.id)
195
+ );
196
+
197
+ // Reinitialize all wishlist buttons
198
+ GWUtils.app.updateFavoriteItemsStorage({
199
+ removeIds: [GWUtils.parseVariantId(unfavoritedProduct.id)],
200
+ });
201
+
202
+ // Notify the user
203
+ const customerFirstName = GWUtils.customerFirstName
204
+ ? `${GWUtils.customerFirstName}'s`
205
+ : 'Your';
206
+ GWUtils.notify(`
212
207
  <span>Product removed from ${customerFirstName} favorites</span>
213
208
  <a href="#my-favorites" class="gw-notification__link">View</a>
214
209
  `);
215
- } catch (error) {
216
- console.error(error);
217
- this._activateButton(true);
218
- GWUtils.notify('An error occurred. Please try again later.');
219
- }
210
+ } catch (error) {
211
+ console.error(error);
212
+ this._activateButton(true);
213
+ GWUtils.notify('An error occurred. Please try again later.');
220
214
  }
221
-
222
- if (this.loader) this.loader.hidden = true;
223
- this.button.disabled = false;
224
- this.button.removeAttribute('aria-disabled');
225
- this.removeAttribute('Processing');
226
215
  }
227
216
 
228
- // TODO: Update methods to use this getter
229
- get productData() {
230
- if (!this._productData) {
231
- const productDataElement = this.querySelector('[data-product-data]');
232
- this._productData = JSON.parse(productDataElement.textContent);
233
- }
217
+ if (this.loader) this.loader.hidden = true;
218
+ this.button.disabled = false;
219
+ this.button.removeAttribute('aria-disabled');
220
+ this.removeAttribute('Processing');
221
+ }
234
222
 
235
- return this._productData;
223
+ // TODO: Update methods to use this getter
224
+ get productData() {
225
+ if (!this._productData) {
226
+ const productDataElement = this.querySelector('[data-product-data]');
227
+ this._productData = JSON.parse(productDataElement.textContent);
236
228
  }
237
229
 
238
- // TODO: Update methods to use this getter
239
- get productVariants() {
240
- return this.productData.variants?.nodes || [];
241
- }
230
+ return this._productData;
231
+ }
242
232
 
243
- get currentVariant() {
244
- return this.productVariants.find(
245
- (variant) => variant.id == this.variantId
246
- );
247
- }
233
+ // TODO: Update methods to use this getter
234
+ get productVariants() {
235
+ return this.productData.variants?.nodes || [];
236
+ }
248
237
 
249
- /**
250
- * Adds the product to the favorites list.
251
- * @returns {Promise<void>}
252
- */
253
- async _addToFavorites() {
254
- if (!GWUtils.hasCustomer) {
255
- const productDataElement = this.querySelector('[data-product-data]');
256
- const parsedProductData = JSON.parse(productDataElement.textContent);
257
-
258
- const stored =
259
- localStorage.getItem(GWCA.STORAGE_KEYS.TEMP_WISHLIST_PRODUCTS) ||
260
- '[]';
261
- const items = JSON.parse(stored);
262
-
263
- const updatedItems = items.filter(
264
- (item) => item.id !== parsedProductData.id
265
- );
266
- updatedItems.push(parsedProductData);
238
+ get currentVariant() {
239
+ return this.productVariants.find(
240
+ (variant) => variant.id == this.variantId
241
+ );
242
+ }
267
243
 
268
- localStorage.setItem(
269
- GWCA.STORAGE_KEYS.TEMP_WISHLIST_PRODUCTS,
270
- JSON.stringify(updatedItems)
271
- );
244
+ /**
245
+ * Adds the product to the favorites list.
246
+ * @returns {Promise<void>}
247
+ */
248
+ async _addToFavorites() {
249
+ if (!GWUtils.hasCustomer) {
250
+ const productDataElement = this.querySelector('[data-product-data]');
251
+ const parsedProductData = JSON.parse(productDataElement.textContent);
252
+
253
+ const stored =
254
+ localStorage.getItem(GWCA.STORAGE_KEYS.TEMP_WISHLIST_PRODUCTS) ||
255
+ '[]';
256
+ const items = JSON.parse(stored);
257
+
258
+ const updatedItems = items.filter(
259
+ (item) => item.id !== parsedProductData.id
260
+ );
261
+ updatedItems.push(parsedProductData);
272
262
 
273
- return {
274
- success: true,
275
- products: parsedProductData,
276
- };
277
- }
263
+ localStorage.setItem(
264
+ GWCA.STORAGE_KEYS.TEMP_WISHLIST_PRODUCTS,
265
+ JSON.stringify(updatedItems)
266
+ );
278
267
 
279
- const response = await GWUtils.request(GWCA.ENDPOINTS.FAVORITES.ADD, {
280
- prodID: this.productId,
281
- varID: this.variantId || this._getVariantId(),
282
- });
268
+ return {
269
+ success: true,
270
+ products: parsedProductData,
271
+ };
272
+ }
283
273
 
284
- if (response.error) {
285
- throw new Error(response.error);
286
- }
274
+ const response = await GWUtils.request(GWCA.ENDPOINTS.FAVORITES.ADD, {
275
+ prodID: this.productId,
276
+ varID: this.variantId || this._getVariantId(),
277
+ });
287
278
 
288
- return response;
279
+ if (response.error) {
280
+ throw new Error(response.error);
289
281
  }
290
282
 
291
- /**
292
- * Removes the product from the favorites list.
293
- * @returns {Promise<void>}
294
- */
295
- async _removeFromFavorites() {
296
- if (!GWUtils.hasCustomer) {
297
- const productData = this.querySelector('[data-product-data]');
298
- const parsedProductData = JSON.parse(productData.textContent);
299
-
300
- const stored =
301
- localStorage.getItem(GWCA.STORAGE_KEYS.TEMP_WISHLIST_PRODUCTS) ||
302
- '[]';
303
- const items = JSON.parse(stored);
304
-
305
- const updatedItems = items.filter(
306
- (item) => item.id !== parsedProductData.id
307
- );
308
- localStorage.setItem(
309
- GWCA.STORAGE_KEYS.TEMP_WISHLIST_PRODUCTS,
310
- JSON.stringify(updatedItems)
311
- );
312
-
313
- return {
314
- success: true,
315
- products: parsedProductData,
316
- };
317
- }
283
+ return response;
284
+ }
318
285
 
319
- const response = await GWUtils.request(
320
- GWCA.ENDPOINTS.FAVORITES.REMOVE,
321
- {
322
- prodID: this.productId,
323
- }
286
+ /**
287
+ * Removes the product from the favorites list.
288
+ * @returns {Promise<void>}
289
+ */
290
+ async _removeFromFavorites() {
291
+ if (!GWUtils.hasCustomer) {
292
+ const productData = this.querySelector('[data-product-data]');
293
+ const parsedProductData = JSON.parse(productData.textContent);
294
+
295
+ const stored =
296
+ localStorage.getItem(GWCA.STORAGE_KEYS.TEMP_WISHLIST_PRODUCTS) ||
297
+ '[]';
298
+ const items = JSON.parse(stored);
299
+
300
+ const updatedItems = items.filter(
301
+ (item) => item.id !== parsedProductData.id
302
+ );
303
+ localStorage.setItem(
304
+ GWCA.STORAGE_KEYS.TEMP_WISHLIST_PRODUCTS,
305
+ JSON.stringify(updatedItems)
324
306
  );
325
307
 
326
- if (response.error) {
327
- throw new Error(response.error);
328
- }
329
-
330
- return response;
308
+ return {
309
+ success: true,
310
+ products: parsedProductData,
311
+ };
331
312
  }
332
313
 
333
- /**
334
- * Activates the button based on whether the product is in the favorites list.
335
- * @param {boolean} isProductInFavorites - True if the product is in the favorites list, otherwise false.
336
- * @returns {void}
337
- */
338
- _activateButton(isProductInFavorites) {
339
- if (this.buttonIcon.length)
340
- this.buttonIcon.forEach((icon) => icon.removeAttribute('hidden'));
341
- if (this.loader) this.loader.setAttribute('hidden', '');
342
-
343
- if (isProductInFavorites) {
344
- this.setAttribute('saved', '');
345
- this.button.setAttribute('aria-label', this.labels.active);
346
- if (this.buttonLabel)
347
- this.buttonLabel.textContent = this.labels.active;
348
- } else {
349
- this.removeAttribute('saved');
350
- this.button.setAttribute('aria-label', this.labels.inactive);
351
- if (this.buttonLabel)
352
- this.buttonLabel.textContent = this.labels.inactive;
353
- }
314
+ const response = await GWUtils.request(GWCA.ENDPOINTS.FAVORITES.REMOVE, {
315
+ prodID: this.productId,
316
+ });
317
+
318
+ if (response.error) {
319
+ throw new Error(response.error);
354
320
  }
355
321
 
356
- /**
357
- * Checks if the product is in the favorites list.
358
- * @returns {boolean} True if the product is in the favorites list, otherwise false.
359
- */
360
- _isProductInFavorites() {
361
- if (!GWUtils.hasCustomer) {
362
- const tempWishlistItemsStorage = localStorage.getItem(
363
- GWCA.STORAGE_KEYS.TEMP_WISHLIST_PRODUCTS
364
- );
365
- const tempWishlistItems = tempWishlistItemsStorage
366
- ? JSON.parse(tempWishlistItemsStorage)
367
- : [];
322
+ return response;
323
+ }
368
324
 
369
- return tempWishlistItems.some((item) => item.id === this.productId);
370
- }
325
+ /**
326
+ * Activates the button based on whether the product is in the favorites list.
327
+ * @param {boolean} isProductInFavorites - True if the product is in the favorites list, otherwise false.
328
+ * @returns {void}
329
+ */
330
+ _activateButton(isProductInFavorites) {
331
+ const buttonIcon = this.shadowRoot.querySelectorAll('[data-button-icon]');
332
+ const buttonLabel = this.shadowRoot.querySelector('[data-button-label]');
333
+
334
+ const labels = {
335
+ inactive:
336
+ GWUtils.componentData.wishlist?.addToWishlistLabel ||
337
+ 'Add to wishlist',
338
+ active:
339
+ GWUtils.componentData.wishlist?.addedToWishlistLabel ||
340
+ 'Added to wishlist',
341
+ };
342
+
343
+ if (buttonIcon.length)
344
+ buttonIcon.forEach((icon) => icon.removeAttribute('hidden'));
345
+ if (this.loader) this.loader.setAttribute('hidden', '');
346
+
347
+ if (isProductInFavorites) {
348
+ this.setAttribute('saved', '');
349
+ this.button.setAttribute('aria-label', labels.active);
350
+ if (buttonLabel) buttonLabel.textContent = labels.active;
351
+ } else {
352
+ this.removeAttribute('saved');
353
+ this.button.setAttribute('aria-label', labels.inactive);
354
+ if (buttonLabel) buttonLabel.textContent = labels.inactive;
355
+ }
356
+ }
371
357
 
372
- const wishlistItemsStorage = sessionStorage.getItem(
373
- GWCA.STORAGE_KEYS.WISHLIST_PRODUCT_IDS
358
+ /**
359
+ * Checks if the product is in the favorites list.
360
+ * @returns {boolean} True if the product is in the favorites list, otherwise false.
361
+ */
362
+ _isProductInFavorites() {
363
+ if (!GWUtils.hasCustomer) {
364
+ const tempWishlistItemsStorage = localStorage.getItem(
365
+ GWCA.STORAGE_KEYS.TEMP_WISHLIST_PRODUCTS
374
366
  );
375
- const wishlistItems = wishlistItemsStorage
376
- ? JSON.parse(wishlistItemsStorage)
367
+ const tempWishlistItems = tempWishlistItemsStorage
368
+ ? JSON.parse(tempWishlistItemsStorage)
377
369
  : [];
378
370
 
379
- return wishlistItems.includes(this.productId);
371
+ return tempWishlistItems.some((item) => item.id === this.productId);
380
372
  }
373
+
374
+ const wishlistItemsStorage = sessionStorage.getItem(
375
+ GWCA.STORAGE_KEYS.WISHLIST_PRODUCT_IDS
376
+ );
377
+ const wishlistItems = wishlistItemsStorage
378
+ ? JSON.parse(wishlistItemsStorage)
379
+ : [];
380
+
381
+ return wishlistItems.includes(this.productId);
381
382
  }
382
- );
383
+ }
384
+
385
+ if (document.readyState === 'loading') {
386
+ document.addEventListener('DOMContentLoaded', () => {
387
+ 'gw-wishlist-button', GWWishlistButton;
388
+ });
389
+ } else {
390
+ customElements.define('gw-wishlist-button', GWWishlistButton);
391
+ }
383
392
  });
package/dist/main.css DELETED
@@ -1 +0,0 @@
1
- @layer resets, tokens, utilities, components, shoelace, main, overrides;@layer shoelace{.sl-theme-light,:host,:root{color-scheme:light;--sl-color-gray-50:#f9f9f9;--sl-color-gray-100:#f4f4f5;--sl-color-gray-200:#e4e4e7;--sl-color-gray-300:#d4d4d8;--sl-color-gray-400:#a1a1aa;--sl-color-gray-500:#71717a;--sl-color-gray-600:#52525b;--sl-color-gray-700:#3f3f46;--sl-color-gray-800:#27272a;--sl-color-gray-900:#18181b;--sl-color-gray-950:#131316;--sl-color-red-50:#fef2f2;--sl-color-red-100:#fee2e2;--sl-color-red-200:#fecaca;--sl-color-red-300:#fca5a5;--sl-color-red-400:#f87171;--sl-color-red-500:#ef4444;--sl-color-red-600:#dc2626;--sl-color-red-700:#b91c1c;--sl-color-red-800:#991b1b;--sl-color-red-900:#7f1d1d;--sl-color-red-950:#501414;--sl-color-orange-50:#fff7ed;--sl-color-orange-100:#ffedd5;--sl-color-orange-200:#fed7aa;--sl-color-orange-300:#fdba74;--sl-color-orange-400:#fb923c;--sl-color-orange-500:#f97316;--sl-color-orange-600:#ea580c;--sl-color-orange-700:#c2410c;--sl-color-orange-800:#9a3412;--sl-color-orange-900:#7c2d12;--sl-color-orange-950:#52200f;--sl-color-amber-50:#fffbeb;--sl-color-amber-100:#fef3c7;--sl-color-amber-200:#fde68a;--sl-color-amber-300:#fcd34d;--sl-color-amber-400:#fbbf24;--sl-color-amber-500:#f59e0b;--sl-color-amber-600:#d97706;--sl-color-amber-700:#b45309;--sl-color-amber-800:#92400e;--sl-color-amber-900:#78350f;--sl-color-amber-950:#4a230b;--sl-color-yellow-50:#fefce8;--sl-color-yellow-100:#fef9c3;--sl-color-yellow-200:#fef08a;--sl-color-yellow-300:#fde047;--sl-color-yellow-400:#facc15;--sl-color-yellow-500:#eab308;--sl-color-yellow-600:#ca8a04;--sl-color-yellow-700:#a16207;--sl-color-yellow-800:#854d0e;--sl-color-yellow-900:#713f12;--sl-color-yellow-950:#3c260b;--sl-color-lime-50:#f7fee7;--sl-color-lime-100:#ecfccb;--sl-color-lime-200:#d9f99d;--sl-color-lime-300:#bef264;--sl-color-lime-400:#a3e635;--sl-color-lime-500:#84cc16;--sl-color-lime-600:#65a30d;--sl-color-lime-700:#4d7c0f;--sl-color-lime-800:#3f6212;--sl-color-lime-900:#365314;--sl-color-lime-950:#26390e;--sl-color-green-50:#f0fdf4;--sl-color-green-100:#dcfce7;--sl-color-green-200:#bbf7d0;--sl-color-green-300:#86efac;--sl-color-green-400:#4ade80;--sl-color-green-500:#22c55e;--sl-color-green-600:#16a34a;--sl-color-green-700:#15803d;--sl-color-green-800:#166534;--sl-color-green-900:#14532d;--sl-color-green-950:#0c311b;--sl-color-emerald-50:#ecfdf5;--sl-color-emerald-100:#d1fae5;--sl-color-emerald-200:#a7f3d0;--sl-color-emerald-300:#6ee7b7;--sl-color-emerald-400:#34d399;--sl-color-emerald-500:#10b981;--sl-color-emerald-600:#059669;--sl-color-emerald-700:#047857;--sl-color-emerald-800:#065f46;--sl-color-emerald-900:#064e3b;--sl-color-emerald-950:#032d22;--sl-color-teal-50:#f0fdfa;--sl-color-teal-100:#ccfbf1;--sl-color-teal-200:#99f6e4;--sl-color-teal-300:#5eead4;--sl-color-teal-400:#2dd4bf;--sl-color-teal-500:#14b8a6;--sl-color-teal-600:#0d9488;--sl-color-teal-700:#0f766e;--sl-color-teal-800:#115e59;--sl-color-teal-900:#134e4a;--sl-color-teal-950:#0c2e2c;--sl-color-cyan-50:#ecfeff;--sl-color-cyan-100:#cffafe;--sl-color-cyan-200:#a5f3fc;--sl-color-cyan-300:#67e8f9;--sl-color-cyan-400:#22d3ee;--sl-color-cyan-500:#06b6d4;--sl-color-cyan-600:#0891b2;--sl-color-cyan-700:#0e7490;--sl-color-cyan-800:#155e75;--sl-color-cyan-900:#164e63;--sl-color-cyan-950:#103442;--sl-color-sky-50:#f0f9ff;--sl-color-sky-100:#e0f2fe;--sl-color-sky-200:#bae6fd;--sl-color-sky-300:#7dd3fc;--sl-color-sky-400:#38bdf8;--sl-color-sky-500:#0ea5e9;--sl-color-sky-600:#0284c7;--sl-color-sky-700:#0369a1;--sl-color-sky-800:#075985;--sl-color-sky-900:#0c4a6e;--sl-color-sky-950:#0b3249;--sl-color-blue-50:#eff6ff;--sl-color-blue-100:#dbeafe;--sl-color-blue-200:#bfdbfe;--sl-color-blue-300:#93c5fd;--sl-color-blue-400:#60a5fa;--sl-color-blue-500:#3b82f6;--sl-color-blue-600:#2563eb;--sl-color-blue-700:#1d4ed8;--sl-color-blue-800:#1e40af;--sl-color-blue-900:#1e3a8a;--sl-color-blue-950:#152149;--sl-color-indigo-50:#eef2ff;--sl-color-indigo-100:#e0e7ff;--sl-color-indigo-200:#c7d2fe;--sl-color-indigo-300:#a5b4fc;--sl-color-indigo-400:#818cf8;--sl-color-indigo-500:#6366f1;--sl-color-indigo-600:#4f46e5;--sl-color-indigo-700:#4338ca;--sl-color-indigo-800:#3730a3;--sl-color-indigo-900:#312e81;--sl-color-indigo-950:#242154;--sl-color-violet-50:#f5f3ff;--sl-color-violet-100:#ede9fe;--sl-color-violet-200:#ddd6fe;--sl-color-violet-300:#c4b5fd;--sl-color-violet-400:#a78bfa;--sl-color-violet-500:#8b5cf6;--sl-color-violet-600:#7c3aed;--sl-color-violet-700:#6d28d9;--sl-color-violet-800:#5b21b6;--sl-color-violet-900:#4c1d95;--sl-color-violet-950:#311558;--sl-color-purple-50:#faf5ff;--sl-color-purple-100:#f3e8ff;--sl-color-purple-200:#e9d5ff;--sl-color-purple-300:#d8b4fe;--sl-color-purple-400:#c084fc;--sl-color-purple-500:#a855f7;--sl-color-purple-600:#9333ea;--sl-color-purple-700:#7e22ce;--sl-color-purple-800:#6b21a8;--sl-color-purple-900:#581c87;--sl-color-purple-950:#2f1143;--sl-color-fuchsia-50:#fdf4ff;--sl-color-fuchsia-100:#fae8ff;--sl-color-fuchsia-200:#f5d0fe;--sl-color-fuchsia-300:#f0abfc;--sl-color-fuchsia-400:#e879f9;--sl-color-fuchsia-500:#d946ef;--sl-color-fuchsia-600:#c026d3;--sl-color-fuchsia-700:#a21caf;--sl-color-fuchsia-800:#86198f;--sl-color-fuchsia-900:#701a75;--sl-color-fuchsia-950:#38103a;--sl-color-pink-50:#fdf2f8;--sl-color-pink-100:#fce7f3;--sl-color-pink-200:#fbcfe8;--sl-color-pink-300:#f9a8d4;--sl-color-pink-400:#f472b6;--sl-color-pink-500:#ec4899;--sl-color-pink-600:#db2777;--sl-color-pink-700:#be185d;--sl-color-pink-800:#9d174d;--sl-color-pink-900:#831843;--sl-color-pink-950:#430e23;--sl-color-rose-50:#fff1f2;--sl-color-rose-100:#ffe4e6;--sl-color-rose-200:#fecdd3;--sl-color-rose-300:#fda4af;--sl-color-rose-400:#fb7185;--sl-color-rose-500:#f43f5e;--sl-color-rose-600:#e11d48;--sl-color-rose-700:#be123c;--sl-color-rose-800:#9f1239;--sl-color-rose-900:#881337;--sl-color-rose-950:#4a0d20;--sl-color-primary-50:var(--sl-color-sky-50);--sl-color-primary-100:var(--sl-color-sky-100);--sl-color-primary-200:var(--sl-color-sky-200);--sl-color-primary-300:var(--sl-color-sky-300);--sl-color-primary-400:var(--sl-color-sky-400);--sl-color-primary-500:var(--sl-color-sky-500);--sl-color-primary-600:var(--sl-color-sky-600);--sl-color-primary-700:var(--sl-color-sky-700);--sl-color-primary-800:var(--sl-color-sky-800);--sl-color-primary-900:var(--sl-color-sky-900);--sl-color-primary-950:var(--sl-color-sky-950);--sl-color-success-50:var(--sl-color-green-50);--sl-color-success-100:var(--sl-color-green-100);--sl-color-success-200:var(--sl-color-green-200);--sl-color-success-300:var(--sl-color-green-300);--sl-color-success-400:var(--sl-color-green-400);--sl-color-success-500:var(--sl-color-green-500);--sl-color-success-600:var(--sl-color-green-600);--sl-color-success-700:var(--sl-color-green-700);--sl-color-success-800:var(--sl-color-green-800);--sl-color-success-900:var(--sl-color-green-900);--sl-color-success-950:var(--sl-color-green-950);--sl-color-warning-50:var(--sl-color-amber-50);--sl-color-warning-100:var(--sl-color-amber-100);--sl-color-warning-200:var(--sl-color-amber-200);--sl-color-warning-300:var(--sl-color-amber-300);--sl-color-warning-400:var(--sl-color-amber-400);--sl-color-warning-500:var(--sl-color-amber-500);--sl-color-warning-600:var(--sl-color-amber-600);--sl-color-warning-700:var(--sl-color-amber-700);--sl-color-warning-800:var(--sl-color-amber-800);--sl-color-warning-900:var(--sl-color-amber-900);--sl-color-warning-950:var(--sl-color-amber-950);--sl-color-danger-50:var(--sl-color-red-50);--sl-color-danger-100:var(--sl-color-red-100);--sl-color-danger-200:var(--sl-color-red-200);--sl-color-danger-300:var(--sl-color-red-300);--sl-color-danger-400:var(--sl-color-red-400);--sl-color-danger-500:var(--sl-color-red-500);--sl-color-danger-600:var(--sl-color-red-600);--sl-color-danger-700:var(--sl-color-red-700);--sl-color-danger-800:var(--sl-color-red-800);--sl-color-danger-900:var(--sl-color-red-900);--sl-color-danger-950:var(--sl-color-red-950);--sl-color-neutral-50:var(--sl-color-gray-50);--sl-color-neutral-100:var(--sl-color-gray-100);--sl-color-neutral-200:var(--sl-color-gray-200);--sl-color-neutral-300:var(--sl-color-gray-300);--sl-color-neutral-400:var(--sl-color-gray-400);--sl-color-neutral-500:var(--sl-color-gray-500);--sl-color-neutral-600:var(--sl-color-gray-600);--sl-color-neutral-700:var(--sl-color-gray-700);--sl-color-neutral-800:var(--sl-color-gray-800);--sl-color-neutral-900:var(--sl-color-gray-900);--sl-color-neutral-950:var(--sl-color-gray-950);--sl-color-neutral-0:#fff;--sl-color-neutral-1000:#000;--sl-border-radius-small:0.1875rem;--sl-border-radius-medium:0.25rem;--sl-border-radius-large:0.5rem;--sl-border-radius-x-large:1rem;--sl-border-radius-circle:50%;--sl-border-radius-pill:9999px;--sl-shadow-x-small:0 1px 2px hsla(240,4%,46%,.06);--sl-shadow-small:0 1px 2px hsla(240,4%,46%,.12);--sl-shadow-medium:0 2px 4px hsla(240,4%,46%,.12);--sl-shadow-large:0 2px 8px hsla(240,4%,46%,.12);--sl-shadow-x-large:0 4px 16px hsla(240,4%,46%,.12);--sl-spacing-3x-small:0.125rem;--sl-spacing-2x-small:0.25rem;--sl-spacing-x-small:0.5rem;--sl-spacing-small:0.75rem;--sl-spacing-medium:1rem;--sl-spacing-large:1.25rem;--sl-spacing-x-large:1.75rem;--sl-spacing-2x-large:2.25rem;--sl-spacing-3x-large:3rem;--sl-spacing-4x-large:4.5rem;--sl-transition-x-slow:1000ms;--sl-transition-slow:500ms;--sl-transition-medium:250ms;--sl-transition-fast:150ms;--sl-transition-x-fast:50ms;--sl-font-mono:SFMono-Regular,Consolas,"Liberation Mono",Menlo,monospace;--sl-font-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";--sl-font-serif:Georgia,"Times New Roman",serif;--sl-font-size-2x-small:0.625rem;--sl-font-size-x-small:0.75rem;--sl-font-size-small:0.875rem;--sl-font-size-medium:1rem;--sl-font-size-large:1.25rem;--sl-font-size-x-large:1.5rem;--sl-font-size-2x-large:2.25rem;--sl-font-size-3x-large:3rem;--sl-font-size-4x-large:4.5rem;--sl-font-weight-light:300;--sl-font-weight-normal:400;--sl-font-weight-semibold:500;--sl-font-weight-bold:700;--sl-letter-spacing-denser:-0.03em;--sl-letter-spacing-dense:-0.015em;--sl-letter-spacing-normal:normal;--sl-letter-spacing-loose:0.075em;--sl-letter-spacing-looser:0.15em;--sl-line-height-denser:1;--sl-line-height-dense:1.4;--sl-line-height-normal:1.8;--sl-line-height-loose:2.2;--sl-line-height-looser:2.6;--sl-focus-ring-color:var(--sl-color-primary-600);--sl-focus-ring-style:solid;--sl-focus-ring-width:3px;--sl-focus-ring:var(--sl-focus-ring-style) var(--sl-focus-ring-width) var(--sl-focus-ring-color);--sl-focus-ring-offset:1px;--sl-button-font-size-small:var(--sl-font-size-x-small);--sl-button-font-size-medium:var(--sl-font-size-small);--sl-button-font-size-large:var(--sl-font-size-medium);--sl-input-height-small:1.875rem;--sl-input-height-medium:2.5rem;--sl-input-height-large:3.125rem;--sl-input-background-color:var(--sl-color-neutral-0);--sl-input-background-color-hover:var(--sl-input-background-color);--sl-input-background-color-focus:var(--sl-input-background-color);--sl-input-background-color-disabled:var(--sl-color-neutral-100);--sl-input-border-color:var(--sl-color-neutral-300);--sl-input-border-color-hover:var(--sl-color-neutral-400);--sl-input-border-color-focus:var(--sl-color-primary-500);--sl-input-border-color-disabled:var(--sl-color-neutral-300);--sl-input-border-width:1px;--sl-input-required-content:"*";--sl-input-required-content-offset:-2px;--sl-input-required-content-color:var(--sl-input-label-color);--sl-input-border-radius-small:var(--sl-border-radius-medium);--sl-input-border-radius-medium:var(--sl-border-radius-medium);--sl-input-border-radius-large:var(--sl-border-radius-medium);--sl-input-font-family:var(--sl-font-sans);--sl-input-font-weight:var(--sl-font-weight-normal);--sl-input-font-size-small:var(--sl-font-size-small);--sl-input-font-size-medium:var(--sl-font-size-medium);--sl-input-font-size-large:var(--sl-font-size-large);--sl-input-letter-spacing:var(--sl-letter-spacing-normal);--sl-input-color:var(--sl-color-neutral-700);--sl-input-color-hover:var(--sl-color-neutral-700);--sl-input-color-focus:var(--sl-color-neutral-700);--sl-input-color-disabled:var(--sl-color-neutral-900);--sl-input-icon-color:var(--sl-color-neutral-500);--sl-input-icon-color-hover:var(--sl-color-neutral-600);--sl-input-icon-color-focus:var(--sl-color-neutral-600);--sl-input-placeholder-color:var(--sl-color-neutral-500);--sl-input-placeholder-color-disabled:var(--sl-color-neutral-600);--sl-input-spacing-small:var(--sl-spacing-small);--sl-input-spacing-medium:var(--sl-spacing-medium);--sl-input-spacing-large:var(--sl-spacing-large);--sl-input-focus-ring-color:rgba(14,165,233,.4);--sl-input-focus-ring-offset:0;--sl-input-filled-background-color:var(--sl-color-neutral-100);--sl-input-filled-background-color-hover:var(--sl-color-neutral-100);--sl-input-filled-background-color-focus:var(--sl-color-neutral-100);--sl-input-filled-background-color-disabled:var(--sl-color-neutral-100);--sl-input-filled-color:var(--sl-color-neutral-800);--sl-input-filled-color-hover:var(--sl-color-neutral-800);--sl-input-filled-color-focus:var(--sl-color-neutral-700);--sl-input-filled-color-disabled:var(--sl-color-neutral-800);--sl-input-label-font-size-small:var(--sl-font-size-small);--sl-input-label-font-size-medium:var(--sl-font-size-medium);--sl-input-label-font-size-large:var(--sl-font-size-large);--sl-input-label-color:inherit;--sl-input-help-text-font-size-small:var(--sl-font-size-x-small);--sl-input-help-text-font-size-medium:var(--sl-font-size-small);--sl-input-help-text-font-size-large:var(--sl-font-size-medium);--sl-input-help-text-color:var(--sl-color-neutral-500);--sl-toggle-size-small:0.875rem;--sl-toggle-size-medium:1.125rem;--sl-toggle-size-large:1.375rem;--sl-overlay-background-color:hsla(240,4%,46%,.33);--sl-panel-background-color:var(--sl-color-neutral-0);--sl-panel-border-color:var(--sl-color-neutral-200);--sl-panel-border-width:1px;--sl-tooltip-border-radius:var(--sl-border-radius-medium);--sl-tooltip-background-color:var(--sl-color-neutral-800);--sl-tooltip-color:var(--sl-color-neutral-0);--sl-tooltip-font-family:var(--sl-font-sans);--sl-tooltip-font-weight:var(--sl-font-weight-normal);--sl-tooltip-font-size:var(--sl-font-size-small);--sl-tooltip-line-height:var(--sl-line-height-dense);--sl-tooltip-padding:var(--sl-spacing-2x-small) var(--sl-spacing-x-small);--sl-tooltip-arrow-size:6px;--sl-z-index-drawer:700;--sl-z-index-dialog:800;--sl-z-index-dropdown:900;--sl-z-index-toast:950;--sl-z-index-tooltip:1000}@supports (scrollbar-gutter:stable){.sl-scroll-lock{scrollbar-gutter:var(--sl-scroll-lock-gutter)!important}.sl-scroll-lock body{overflow:hidden!important}}@supports not (scrollbar-gutter:stable){.sl-scroll-lock body{overflow:hidden!important;padding-right:var(--sl-scroll-lock-size)!important}}.sl-toast-stack{inset-inline-end:0;max-height:100%;max-width:100%;overflow:auto;position:fixed;top:0;width:28rem;z-index:var(--sl-z-index-toast)}.sl-toast-stack sl-alert{margin:var(--sl-spacing-medium)}.sl-toast-stack sl-alert::part(base){box-shadow:var(--sl-shadow-large)}}@layer resets{*{box-sizing:border-box}[hidden]{display:none!important}h1,h2,h3,h4,h5,h6,p{font-family:inherit;font-size:inherit;margin:0;padding:0}a{color:inherit;text-decoration:underline;text-underline-offset:2px}ul{list-style:none;margin:0}button svg{pointer-events:none}}@layer components{.gw-header{font-family:var(--header-font-family);font-size:18px;font-style:normal;font-weight:var(--header-font-weight);line-height:20px}.gw-header--large{font-size:24px;line-height:30px}.gw-body{font-size:14px;font-style:normal;font-weight:var(--body-font-weight);line-height:18px}.gw-body--strong{font-weight:600}.gw-body--small{font-size:12px}.gw-small-text{font-size:13px;font-style:normal;font-weight:var(--body-font-weight);line-height:1.2}.gw-uppercase-text{font-weight:var(--body-font-weight)}.gw-button-text,.gw-uppercase-text{font-size:11px;font-style:normal;line-height:14px;text-transform:uppercase}.gw-button,.gw-button-text{font-weight:var(--button-font-weight);letter-spacing:2.2px}.gw-button{border:none;border-radius:var(--corner-radius-button);cursor:pointer;font-family:var(--button-font-family);font-size:11px;font-style:normal;line-height:14px;padding:13px;text-transform:var(--text-case-button);width:100%}.gw-button--solid{background-color:var(--color-solid-button-background);border:var(--thickness-button) solid var(--color-solid-button-border);color:var(--color-solid-button-text);transition:background-color .3s,color .3s,border-color .3s}.gw-button--solid:hover{background-color:var(--color-solid-button-hover-background);border-color:var(--color-solid-button-hover-border);color:var(--color-solid-button-hover-text)}.gw-button--stroke{background-color:var(--color-stroke-button-background);border:var(--thickness-button) solid var(--color-stroke-button-border);color:var(--color-stroke-button-text);transition:background-color .3s,color .3s,border-color .3s}.gw-button--stroke:hover{background-color:var(--color-stroke-button-hover-background);border-color:var(--color-stroke-button-hover-border);color:var(--color-stroke-button-hover-text)}.gw-button--disabled{background-color:var(--color-disabled-button-background);color:var(--color-disabled-button-text);cursor:not-allowed}.gw-button--text{background-color:transparent;color:var(--color-text-subdued);padding:5px;text-decoration-line:underline}.gw-button svg{pointer-events:none}}@layer utilities{.gw-unstyled-link{color:inherit;text-decoration:none}.gw-button[href]{display:block;text-align:center;text-decoration:none}.gw-empty-button{background:transparent;border:none;cursor:pointer}.gw-main-content-container{display:flex;flex-direction:column;gap:var(--tab-panel-vertical-gap);padding-bottom:var(--tab-panel-vertical-gap)}.gw-main-content-container--small-gap{--tab-panel-vertical-gap:16px}.gw-empty-list{padding:0 var(--tab-panel-edge-padding);text-align:center}.gw-empty-list-inner{border:1px solid var(--border-color);border-radius:var(--border-radius);padding:30px}.gw-error-message{color:#a50000;font-size:13px;margin-top:8px}.gw-loader-container{--loader-size:14px;--loader-border-weight:1px;position:relative}.gw-loader-container--block{display:block;height:var(--loader-size);margin:24px auto;width:var(--loader-size)}.gw-loader-container--large{--loader-size:24px;--loader-border-weight:3px}.gw-loader{animation:rotation 1s linear infinite;border:var(--loader-border-weight) solid transparent;border-bottom-color:inherit;border-radius:50%;box-sizing:border-box;display:inline-block;height:var(--loader-size);left:8px;position:absolute;width:var(--loader-size)}.gw-loader-container--block .gw-loader{left:0}.gw-loader--white{border:2px solid var(--border-color);border-bottom-color:var(--color-text)}.visually-hidden{height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;clip:rect(0,0,0,0);border:0}@keyframes rotation{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}}@layer main{:host{--sl-input-font-size-medium:14px;--sl-font-size-medium:14px;--tab-panel-edge-padding:20px;--tab-panel-vertical-gap:24px;all:initial;color:var(--color-text);font-family:var(--body-font-family);font-size:14px;font-style:normal;font-weight:var(--body-font-weight);line-height:18px;position:relative;z-index:2147483647}sl-drawer{--size:var(--drawer-width);--body-spacing:0;--header-spacing:20px}sl-drawer::part(close-button){display:none}sl-drawer[main-drawer]::part(body){background-color:var(--color-drawer-background);display:flex;flex-direction:column}sl-drawer[main-drawer]::part(header){background-color:var(--color-drawer-header-background)}sl-drawer[main-drawer].inner-drawer-open::part(header){display:none}sl-drawer[main-drawer].inner-drawer-open sl-tab-group::part(nav){display:none}sl-drawer[main-drawer].inner-drawer-open gw-customer-accounts-sign-in{display:none}sl-drawer[main-drawer] sl-tab{background-color:var(--color-drawer-footer-background)}.gw-customer-accounts-drawer__header,.gw-secondary-drawer__header{align-items:center;display:flex;gap:8px}.gw-secondary-drawer__header{background-color:transparent;border:none;color:var(--color-text);cursor:pointer;padding:0}.gw-product-card{position:relative;width:100%}.gw-product-card--splitted{align-items:center;display:flex;flex-direction:row-reverse;gap:16px}.gw-product-card--splitted .gw-product-card__image-container{flex-shrink:0}.gw-product-card--reversed{display:flex;flex-direction:column-reverse}.gw-product-card--removing:after{background:hsla(0,0%,100%,.5);content:"";height:100%;left:0;position:absolute;top:0;width:100%;z-index:1}.gw-product-card--splitted .gw-product-card__image-container{width:120px}.gw-product-card__image-container:after{content:"";display:block;padding-bottom:var(--product-card-image-ratio);width:100%}.gw-product-card__info{display:flex;flex:1;flex-direction:column;gap:8px}.gw-product-card__info--no-gap{gap:0}.gw-product-card__link{display:block;width:100%}.gw-product-card__link:focus{outline:2px solid #005fcc}.gw-product-card__link:after{content:"";height:100%;left:0;position:absolute;top:0;width:100%;z-index:10}.gw-product-card__link--hide-after:after{content:none}.gw-product-card__image-container{border:1px solid var(--border-color);position:relative;width:100%}.gw-product-card__image{height:100%;left:0;object-fit:contain;position:absolute;top:0;width:100%}.gw-product-card__info{margin-top:8px}.gw-product-card__form{display:flex;flex-direction:column;gap:10px}.gw-product-card__actions{display:flex}.gw-product-card__variant-selector{border:1px solid var(--border-color);border-radius:0;color:var(--color-text);padding:4px 8px;width:100%}.gw-product-card__price{display:flex;font-size:13px;font-style:normal;font-weight:var(--body-font-weight);gap:4px;line-height:1.2}.gw-product-card__price-compare{text-decoration:line-through}.gw-product-card__price--sale{color:#c70100}.gw-notifications{bottom:54px;left:20px;position:fixed;z-index:900}.gw-notifications sl-alert::part(base){background-color:var(--color-notifications-background);border:none;border-radius:var(--border-radius);min-width:300px;width:100%}.gw-notifications *{color:var(--color-notifications-label);font-family:var(--body-font-family);font-size:16px}.gw-notifications [data-notification-message]{align-items:center;display:flex;gap:8px;justify-content:space-between}.gw-customer-accounts-orders__empty{padding:40px var(--tab-panel-edge-padding) 0;text-align:center}.gw-customer-accounts-order__carousel::part(base){display:block}.gw-customer-accounts-order__header{align-items:center;cursor:pointer;display:flex;gap:8px;margin-bottom:16px;padding:0 var(--tab-panel-edge-padding)}.gw-order-detail{padding-bottom:var(--tab-panel-vertical-gap)}.gw-order-detail__delivery,.gw-order-detail__integrations,.gw-order-detail__line-items,.gw-order-detail__payment{display:flex;flex-direction:column;gap:var(--tab-panel-vertical-gap);padding:0 var(--tab-panel-edge-padding)}.gw-order-detail__integrations{gap:8px}.gw-order-detail__line-item{align-items:center;display:flex;gap:16px}.gw-order-detail__line-item:first-child{margin-top:16px}.gw-order-detail__status{align-items:center;background-color:#a13818;color:#fff;display:flex;gap:8px;padding:12px var(--tab-panel-edge-padding)}.gw-order-detail__line-item-image-container{border:1px solid var(--border-color);flex-shrink:0;position:relative;width:120px}.gw-order-detail__line-item-image-container:after{content:"";display:block;padding-bottom:var(--product-card-image-ratio);width:100%}.gw-order-detail__line-item-image{border-radius:var(--border-radius);height:100%;left:0;object-fit:contain;position:absolute;top:0;width:100%}.gw-order-detail__line-item-quantity{background-color:var(--color-text);border-radius:50%;color:#fff;font-size:10px;font-weight:600;line-height:14px;padding:2px 7px;position:absolute;right:0;top:0;transform:translate(50%,-50%)}.gw-order-detail__line-item-price{margin-left:auto}.gw-order-detail__price-breakdown{border-bottom:1px solid var(--border-color);border-top:1px solid var(--border-color);display:flex;flex-direction:column;padding:var(--tab-panel-vertical-gap) var(--tab-panel-edge-padding) 0}.gw-order-detail__price-breakdown-item{align-items:center;display:flex;justify-content:space-between}.gw-order-detail__price-breakdown-item+.gw-order-detail__price-breakdown-item{margin-top:14px}.gw-order-detail__price-breakdown-item--total{border-top:1px solid var(--border-color);margin-top:var(--tab-panel-vertical-gap)!important;padding:var(--tab-panel-vertical-gap) 0}.gw-order-detail__discount-title{text-transform:uppercase}.gw-order-detail__delivery-info p:first-child,.gw-order-detail__payment-info p:first-child{margin-bottom:10px}.gw-order-detail__additional-info{padding:0 var(--tab-panel-edge-padding)}.gw-order-detail__additional-info p:not(:last-child){margin-bottom:8px}.gw-icon--close{align-items:center;display:flex;height:18px;justify-content:center;width:18px}sl-input,sl-select{color:var(--color-text);font-family:var(--form-font-family);font-weight:var(--form-font-weight);position:relative;text-transform:var(--form-elements-text-case)}sl-input.input--empty::part(form-control-label),sl-select.input--empty::part(form-control-label){font-size:14px;padding-top:17px}sl-input.input--focus::part(form-control-label),sl-input::part(form-control-label),sl-select::part(form-control-label){font-size:10px;padding-left:12px;padding-top:6px;position:absolute;transition:all .3s ease;z-index:1}sl-input::part(base){border:var(--form-elements-thickness) solid var(--border-color);border-radius:var(--form-elements-corner-radius);height:50px;position:relative}sl-input::part(input){height:50px;padding-left:12px;padding-top:12px}sl-input[data-user-invalid]::part(base){--border-color:#a50000}sl-select::part(combobox){border:var(--form-elements-thickness) solid var(--border-color);border-radius:var(--form-elements-corner-radius);height:50px}sl-select::part(display-input){top:8px}sl-checkbox::part(base){align-items:center}sl-checkbox::part(control){--toggle-size:16px;--sl-focus-ring:solid 2px #000;border-color:#181818;border-radius:0}sl-checkbox[checked]::part(control){background-color:#000;color:#fff}sl-option[value="---"]{display:none}.gw-recently-viewed-collections sl-carousel::part(scroll-container){grid-auto-columns:auto;justify-content:flex-start}.gw-recently-viewed-collection{border:1px solid #000;padding:8px 18px;white-space:nowrap}.gw-favorites-tab,.gw-saved-from-cart-tab{display:flex;flex-direction:column;gap:var(--tab-panel-vertical-gap);padding:0 var(--tab-panel-edge-padding) var(--tab-panel-vertical-gap)}.gw-recently-viewed-items-tab{display:grid;gap:24px 16px;grid-template-columns:1fr 1fr;padding:0 var(--tab-panel-edge-padding) var(--tab-panel-vertical-gap)}.gw-quick-links{display:flex;flex-direction:column;gap:12px;list-style:none;margin:0;padding:0 var(--tab-panel-edge-padding)}.gw-quick-link{align-items:center;display:flex;gap:8px}.gw-card__item{display:flex;flex-direction:column;gap:8px;padding:0 var(--tab-panel-edge-padding);position:relative}.gw-card__item a{height:100%;left:0;position:absolute;top:0;width:100%;z-index:10}.gw-card__item-image-wrapper{overflow:hidden;width:100%}.gw-card__item-image{display:block;height:100%;object-fit:cover;transition:transform .5s ease;width:100%}.gw-card__item:hover .gw-card__item-image{transform:scale(1.05)}.gw-sign-in{display:flex;flex-direction:column;gap:14px;margin-bottom:24px;padding:0 var(--tab-panel-edge-padding)}.gw-sign-in__form button[type=submit]{margin-top:16px}.gw-sign-in__link{margin-bottom:24px;padding:0 var(--tab-panel-edge-padding)}.gw-verify-code{margin-bottom:24px;text-align:center}.gw-verify-code .input-code-group{display:flex;gap:8px;justify-content:center;margin:35px 0 16px}.gw-verify-code .code-input{appearance:textfield;-moz-appearance:textfield;background:#fff;border:1px solid var(--border-color);font-family:var(--form-font-family);font-size:22px;font-weight:600;height:68px;text-align:center;width:56px}.gw-verify-code .code-input::-webkit-inner-spin-button,.gw-verify-code .code-input::-webkit-outer-spin-button{-webkit-appearance:none}.gw-verify-code__actions .gw-error-message{margin:16px 0}.my-preferences{padding:0 var(--tab-panel-edge-padding)}.my-preferences__header{align-items:center;cursor:pointer;display:flex;gap:8px;margin-bottom:22px}.my-preferences__field{border:1px solid var(--border-color);display:flex;flex-direction:column;padding:16px 20px}.my-preferences__field+.my-preferences__field{border-top:0}.my-preferences__fields+.my-preferences__fields{margin-top:22px}.my-preferences__fields{cursor:pointer}.gw-preference-details__notification{border-bottom:1px solid var(--border-color);display:flex;flex-direction:column;gap:var(--tab-panel-vertical-gap);padding:0 var(--tab-panel-edge-padding) var(--tab-panel-vertical-gap)}.gw-preference-details__email{display:flex;flex-direction:column;gap:16px}.gw-preference-details__email sl-input::part(form-control-help-text){margin-top:8px}.gw-preference-details__email sl-checkbox::part(base){align-items:center}.gw-preference-details__email sl-checkbox::part(control){--sl-focus-ring:solid 2px #000;border-color:#181818;border-radius:0}.gw-preference-details__email sl-checkbox[checked]::part(control){background-color:#000;color:#fff}.gw-preference-details__phone{display:flex;flex-direction:column;gap:16px}.gw-preference-details__phone sl-checkbox::part(form-control-help-text){margin-top:8px}.gw-preference-details__personal-info{display:flex;flex-direction:column;gap:var(--tab-panel-vertical-gap)}.gw-address,.gw-preference-details__personal-info{padding:var(--tab-panel-vertical-gap) var(--tab-panel-edge-padding)}.gw-address{border-bottom:1px solid var(--border-color);cursor:pointer}.gw-address p:first-child{margin-bottom:8px}.gw-address-add,.gw-address-edit{padding:var(--tab-panel-vertical-gap) var(--tab-panel-edge-padding)}.gw-address__icon{position:absolute;right:16px;top:50%;transform:translateY(-50%)}.gw-button-wrapper{padding:0 var(--tab-panel-edge-padding)}.my-addresses{cursor:pointer}.my-addresses sl-carousel::part(scroll-container){grid-auto-columns:auto}.my-addresses__header{align-items:center;cursor:pointer;display:flex;gap:8px;margin-bottom:22px}.my-addresses__header,.my-addresses__list--single{padding:0 var(--tab-panel-edge-padding)}.my-addresses__address{border:1px solid var(--border-color);min-height:160px;min-width:270px;padding:16px 20px}.my-addresses__address p:first-child{margin-bottom:8px}.my-addresses__default-badge{background-color:var(--border-color);padding:2px 8px;white-space:nowrap}.gw-latest-order-wrapper{padding:0 20px}.gw-latest-order{background:#fff;border:1px solid rgba(0,0,0,.1);box-shadow:0 0 20px 0 rgba(0,0,0,.1);cursor:pointer;display:flex;gap:16px;padding:16px}.gw-latest-order__image-container{flex-shrink:0;position:relative;width:56px}.gw-latest-order__image-container:after{content:"";display:block;padding-bottom:var(--product-card-image-ratio);width:100%}.gw-latest-order__image{height:100%;left:0;object-fit:cover;position:absolute;top:0;width:100%}.gw-latest-order__info{display:flex;flex-direction:column;gap:4px;justify-content:center}sl-tab-group{--indicator-color:var(--color-text);--track-color:var(--border-color);--track-width:2px;--sign-in-block-height:202px;--sign-in-block-margin-bottom:24px;flex:1;max-height:calc(100% - var(--sign-in-block-height) - var(--sign-in-block-margin-bottom))}sl-tab-group[sign-in-type-password]{--sign-in-block-height:70px}sl-tab-group[has-customer]{max-height:100%}sl-tab-group::part(base),sl-tab-group::part(body){height:100%}sl-tab-group::part(nav){padding:0}sl-tab-group sl-tab-panel{height:100%}sl-tab-group sl-tab-panel::part(base){height:100%;padding:0}sl-tab-group sl-tab{cursor:pointer;padding:16px 0;text-align:center;width:33.33333%}sl-tab-group sl-tab::part(base){all:unset}.gw-collections{display:flex;gap:8px}.gw-collections sl-skeleton{--border-radius:0;flex-shrink:0;height:30px;width:90px}.gw-collections sl-skeleton:nth-child(odd){width:120px}.gw-products-carousel{display:flex;flex-direction:column;gap:24px}.gw-products-carousel__header-wrapper{padding:0 20px}.gw-products-carousel__header{align-items:center;cursor:pointer;display:flex;gap:8px}.gw-products-carousel__feed{display:flex;gap:8px;padding:0 0 0 20px}.gw-products-carousel sl-skeleton{--border-radius:0;flex-shrink:0;width:115px}.gw-products-carousel sl-skeleton:after{content:"";display:block;padding-bottom:var(--product-card-image-ratio);width:100%}sl-carousel::part(base){gap:0}sl-carousel::part(navigation-button){align-items:center;background-color:#fff;display:flex;height:42px;justify-content:center;opacity:0;position:absolute;transition:all .3s ease;width:32px;z-index:10}sl-carousel::part(navigation-button):hover{scale:1.1}sl-carousel::part(navigation-button--previous){border:1px solid var(--border-color);border-left:none;border-radius:0 8px 8px 0;left:0}sl-carousel::part(navigation-button--next){border-right:none;border:1px solid var(--border-color);border-radius:8px 0 0 8px;right:0}sl-carousel:focus-within::part(navigation-button),sl-carousel:focus::part(navigation-button),sl-carousel:hover::part(navigation-button){opacity:1}gw-wishlist-button{bottom:0;position:absolute;right:4px;z-index:10}gw-wishlist-button[processing]::part(button){opacity:.5;pointer-events:none}gw-wishlist-button:active::part(button){transform:scale(.9)}gw-wishlist-button::part(button){background-color:transparent;border:none;color:var(--color-text);cursor:pointer;height:14px;padding:0;transition:.2s cubic-bezier(.39,.575,.565,1);width:14px}gw-wishlist-button::part(filled-icon),gw-wishlist-button::part(icon){display:block;left:0;position:absolute;top:0;transition:opacity .3s}gw-wishlist-button::part(filled-icon),gw-wishlist-button:hover::part(icon){opacity:0}gw-wishlist-button:hover::part(filled-icon),gw-wishlist-button[saved]::part(filled-icon){opacity:1}gw-integrations-loyalty-points{padding:0 var(--tab-panel-edge-padding)}.gw-loyalty-points__link{align-items:center;background-color:var(--background-color);border-radius:var(--border-radius);color:var(--text-color);display:flex;gap:8px;min-height:54px;padding:16px}.gw-loyalty-points__link:hover .gw-loyalty-points__link-label{transform:translateX(0)}.gw-loyalty-points__link-label{align-items:center;display:flex;gap:4px;margin-left:auto;transform:translateX(-5px);transition:transform .3s ease-in-out}.gw-loyalty-points__id-container{align-items:center;display:flex;gap:8px;justify-content:space-between;padding:16px 20px}.gw-loyalty-points__copy-button{align-items:center;background-color:transparent;border:none;color:var(--color-text);cursor:pointer;display:flex;font-family:var(--body-font-family);gap:4px}.gw-loyalty-points__copy-button svg{height:12px;width:12px}}