@sonic-equipment/ui 187.0.0 → 189.0.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.
Files changed (108) hide show
  1. package/dist/cards/data-card/data-card.js +1 -1
  2. package/dist/country-selector/connected-country-selector.js +0 -11
  3. package/dist/country-selector/use-countries-languages.js +0 -11
  4. package/dist/delivery-time/delivery-time.js +3 -4
  5. package/dist/exports.d.ts +13 -3
  6. package/dist/footer/connected-footer.js +8 -1
  7. package/dist/footer/footer.d.ts +5 -10
  8. package/dist/footer/footer.js +23 -18
  9. package/dist/forms/fields/select-field/select-field.js +1 -1
  10. package/dist/forms/layout/form/form.js +1 -1
  11. package/dist/header/connected-header.js +9 -1
  12. package/dist/header/drawers/desktop-navigation-drawer.d.ts +3 -3
  13. package/dist/header/drawers/desktop-navigation-drawer.js +2 -4
  14. package/dist/header/drawers/mobile-navigation-drawer.d.ts +3 -3
  15. package/dist/header/drawers/mobile-navigation-drawer.js +2 -2
  16. package/dist/header/header.d.ts +3 -3
  17. package/dist/header/header.js +15 -9
  18. package/dist/header/link-list/navigation-link-list.d.ts +5 -5
  19. package/dist/header/link-list/navigation-link-list.js +20 -5
  20. package/dist/index.js +14 -4
  21. package/dist/intl/formatted-date.d.ts +4 -0
  22. package/dist/intl/formatted-date.js +8 -0
  23. package/dist/intl/translation-id.d.ts +1 -1
  24. package/dist/intl/use-formatted-date.d.ts +6 -0
  25. package/dist/intl/use-formatted-date.js +19 -0
  26. package/dist/lists/menu-list/menu-list-header.d.ts +1 -1
  27. package/dist/lists/menu-list/menu-list-item.d.ts +2 -2
  28. package/dist/lists/menu-list/menu-list-item.js +3 -1
  29. package/dist/lists/menu-list/menu-list-provider.d.ts +11 -0
  30. package/dist/lists/menu-list/menu-list-provider.js +30 -0
  31. package/dist/lists/menu-list/menu-list.d.ts +8 -5
  32. package/dist/lists/menu-list/menu-list.js +6 -5
  33. package/dist/lists/menu-list/menu-list.module.css.js +1 -1
  34. package/dist/lists/menu-list/use-menu-list-item.d.ts +5 -0
  35. package/dist/lists/menu-list/use-menu-list-item.js +12 -0
  36. package/dist/lists/menu-list/use-menu-list.d.ts +1 -0
  37. package/dist/lists/menu-list/use-menu-list.js +11 -0
  38. package/dist/loading/dynamic-loading-overlay.d.ts +5 -0
  39. package/dist/loading/dynamic-loading-overlay.js +26 -0
  40. package/dist/loading/dynamic-loading-overlay.module.css.js +3 -0
  41. package/dist/media/image-lightbox/image-lightbox.js +12 -2
  42. package/dist/media/zoom-image/zoom-image.js +6 -1
  43. package/dist/navigation/mobile-navigation/mobile-navigation.d.ts +3 -3
  44. package/dist/navigation/mobile-navigation/mobile-navigation.js +2 -2
  45. package/dist/navigation/panel-navigation/panel-navigation.d.ts +5 -7
  46. package/dist/navigation/panel-navigation/panel-navigation.js +11 -14
  47. package/dist/pages/checkout/cart-page/cart-page.js +1 -1
  48. package/dist/pages/checkout/order-confirmation-page/order-confirmation-page-content.js +2 -4
  49. package/dist/pages/error-page/error-page.js +2 -7
  50. package/dist/pages/my-sonic/actions/change-password/connected-change-password-dialog.js +0 -2
  51. package/dist/pages/my-sonic/navigation/my-sonic-desktop-navigation.js +1 -1
  52. package/dist/pages/my-sonic/pages/order-history/order-history.d.ts +1 -0
  53. package/dist/pages/my-sonic/pages/order-history/order-history.js +166 -0
  54. package/dist/pages/my-sonic/pages/order-history/order-history.module.css.js +3 -0
  55. package/dist/pages/product/product-listing-page/product-listing.js +1 -1
  56. package/dist/pages/product/search-result-page/search-results-page.js +1 -1
  57. package/dist/shared/api/bff/hooks/use-fetch-navigation-links.d.ts +1 -1
  58. package/dist/shared/api/bff/model/bff.model.d.ts +22 -14
  59. package/dist/shared/api/bff/model/bff.model.js +11 -0
  60. package/dist/shared/api/bff/services/bff-service.d.ts +2 -2
  61. package/dist/shared/api/bff/services/bff-service.js +1 -1
  62. package/dist/shared/api/storefront/hooks/orders/use-fetch-orders.d.ts +10 -0
  63. package/dist/shared/api/storefront/hooks/orders/use-fetch-orders.js +13 -0
  64. package/dist/shared/api/storefront/model/storefront.model.d.ts +13 -1
  65. package/dist/shared/api/storefront/model/storefront.model.js +28 -1
  66. package/dist/shared/api/storefront/services/order-service.d.ts +12 -0
  67. package/dist/shared/api/storefront/services/order-service.js +29 -0
  68. package/dist/shared/data/navigation.d.ts +2 -0
  69. package/dist/shared/data/navigation.js +2605 -0
  70. package/dist/shared/hooks/use-intersection-observer.d.ts +3 -1
  71. package/dist/shared/hooks/use-intersection-observer.js +3 -2
  72. package/dist/shared/utils/date.d.ts +4 -1
  73. package/dist/shared/utils/date.js +6 -5
  74. package/dist/shared/utils/price.d.ts +1 -1
  75. package/dist/shared/{hooks/use-scroll-to.d.ts → utils/scrolling.d.ts} +1 -1
  76. package/dist/shared/utils/scrolling.js +16 -0
  77. package/dist/shared/utils/uuid.d.ts +2 -1
  78. package/dist/styles.css +896 -634
  79. package/dist/table/data-table.d.ts +37 -10
  80. package/dist/table/data-table.js +72 -17
  81. package/dist/table/data-table.module.css.js +1 -1
  82. package/dist/table/elements/switch-sort-direction.d.ts +2 -0
  83. package/dist/table/elements/switch-sort-direction.js +11 -0
  84. package/dist/table/elements/table-context.d.ts +6 -5
  85. package/dist/table/elements/table-context.js +1 -16
  86. package/dist/table/elements/table-provider.d.ts +6 -5
  87. package/dist/table/elements/table-provider.js +23 -17
  88. package/dist/table/elements/table-row-context.d.ts +2 -2
  89. package/dist/table/elements/table-row-provider.js +4 -4
  90. package/dist/table/elements/table-sort-button.d.ts +8 -7
  91. package/dist/table/elements/table-sort-button.js +5 -4
  92. package/dist/table/elements/table.d.ts +1 -1
  93. package/dist/table/elements/table.js +2 -2
  94. package/dist/table/elements/table.module.css.js +1 -1
  95. package/dist/table/elements/td.d.ts +1 -1
  96. package/dist/table/elements/th.d.ts +1 -7
  97. package/dist/table/elements/th.js +2 -3
  98. package/dist/table/elements/tr.d.ts +2 -8
  99. package/dist/table/elements/tr.js +1 -3
  100. package/dist/table/elements/types.d.ts +36 -0
  101. package/dist/table/elements/use-table.js +1 -3
  102. package/dist/table/elements/use-td.d.ts +1 -1
  103. package/dist/table/elements/use-th.d.ts +2 -2
  104. package/package.json +1 -1
  105. package/dist/shared/hooks/use-scroll-to.js +0 -19
  106. package/dist/table/elements/table-column-properties.d.ts +0 -10
  107. package/dist/table/elements/use-tr.d.ts +0 -2
  108. package/dist/table/elements/use-tr.js +0 -16
package/dist/styles.css CHANGED
@@ -4653,6 +4653,13 @@ button.swiper-pagination-bullet {
4653
4653
  justify-self: center;
4654
4654
  }
4655
4655
 
4656
+ .select-field-module-T07fb .select-field-module-uGX30 .select-field-module-NyDa0 {
4657
+ block-size: 20px;
4658
+ grid-area: icon;
4659
+ inline-size: 20px;
4660
+ justify-self: center;
4661
+ }
4662
+
4656
4663
  .select-field-module-T07fb[data-invalid] .select-field-module-uGX30 {
4657
4664
  border-bottom-color: var(--color-brand-red);
4658
4665
  }
@@ -4994,7 +5001,7 @@ button.swiper-pagination-bullet {
4994
5001
  }
4995
5002
 
4996
5003
  .footer-module-YzJ68 .footer-module-TZq-4 .footer-module-5eyFH {
4997
- --gap: var(--space-32);
5004
+ --gap: var(--space-16);
4998
5005
 
4999
5006
  display: flex;
5000
5007
  flex-direction: column;
@@ -5006,6 +5013,8 @@ button.swiper-pagination-bullet {
5006
5013
  @media (width >= 1024px) {
5007
5014
 
5008
5015
  .footer-module-YzJ68 .footer-module-TZq-4 .footer-module-5eyFH {
5016
+ --gap: var(--space-32);
5017
+
5009
5018
  flex-direction: row;
5010
5019
  justify-self: center
5011
5020
  }
@@ -5889,44 +5898,31 @@ button.swiper-pagination-bullet {
5889
5898
  --ml-item-inner-spacing: var(--space-12);
5890
5899
  --ml-item-outer-spacing: var(--space-16);
5891
5900
  --ml-icon-size: 16px;
5901
+ --ml-min-size: 56px;
5892
5902
 
5893
5903
  position: relative;
5894
5904
  display: grid;
5895
5905
  overflow: hidden;
5896
5906
  color: currentcolor;
5907
+ container-type: inline-size;
5897
5908
  font-size: var(--ml-font-size);
5898
5909
  grid-template: auto 1fr / 1fr;
5899
5910
  grid-template-areas:
5900
5911
  'back-button'
5901
5912
  'scroll-area';
5913
+ min-inline-size: var(--ml-min-size);
5902
5914
  -webkit-user-select: none;
5903
5915
  -moz-user-select: none;
5904
5916
  user-select: none;
5905
5917
  }
5906
5918
 
5907
- /* TODO: scroll area row should stretch to avail height, but also enforce the scroll-area to scroll if overflowing */
5908
-
5909
- .menu-list-module-TloB9.menu-list-module-xUg6i {
5910
- --ml-font-size: var(--font-size-18);
5911
- --ml-font-weight: var(--font-weight-bold);
5912
- --ml-button-hover-color: var(--color-white);
5913
- --ml-button-hover-bgcolor: var(--color-brand-red);
5914
- --ml-link-hover-color: var(--color-white);
5915
- --ml-link-hover-bgcolor: var(--color-brand-red);
5916
- --ml-selected-color: var(--color-white);
5917
- --ml-selected-bgcolor: var(--color-brand-red);
5918
- }
5919
-
5920
5919
  /* scroll area */
5921
-
5922
5920
  .menu-list-module-TloB9.menu-list-module-AiDgG .menu-list-module-x3D-V {
5921
+ overflow: hidden auto;
5923
5922
  grid-area: scroll-area;
5924
- overflow-y: auto;
5925
5923
  scrollbar-width: thin;
5926
5924
  }
5927
-
5928
5925
  /* list */
5929
-
5930
5926
  .menu-list-module-TloB9 .menu-list-module-m3rpo {
5931
5927
  display: grid;
5932
5928
  padding: 0 0 1px;
@@ -5934,10 +5930,56 @@ button.swiper-pagination-bullet {
5934
5930
  grid-template-columns: 1fr;
5935
5931
  list-style: none;
5936
5932
  }
5937
-
5938
5933
  .menu-list-module-TloB9 .menu-list-module-m3rpo > * {
5939
5934
  margin-block: 0 -1px;
5940
5935
  }
5936
+ /* primary variant */
5937
+ .menu-list-module-TloB9.menu-list-module-xUg6i {
5938
+ --ml-font-size: var(--font-size-18);
5939
+ --ml-font-weight: var(--font-weight-bold);
5940
+ --ml-button-hover-color: var(--color-white);
5941
+ --ml-button-hover-bgcolor: var(--color-brand-red);
5942
+ --ml-link-hover-color: var(--color-white);
5943
+ --ml-link-hover-bgcolor: var(--color-brand-red);
5944
+ --ml-selected-color: var(--color-white);
5945
+ --ml-selected-bgcolor: var(--color-brand-red);
5946
+ }
5947
+ /* badges variant */
5948
+ @container (inline-size < 216px) {
5949
+ .menu-list-module-TloB9.menu-list-module-vd14x .menu-list-module-m3rpo {
5950
+ /* switch to fixed width below certain container sizes */
5951
+ inline-size: var(--ml-min-size);
5952
+ }
5953
+ /* no separator lines */
5954
+ .menu-list-module-TloB9.menu-list-module-vd14x .menu-list-module-4QhF4::before,
5955
+ .menu-list-module-TloB9.menu-list-module-vd14x .menu-list-module-4QhF4::after {
5956
+ display: none;
5957
+ }
5958
+
5959
+ /* hide the label */
5960
+ .menu-list-module-TloB9.menu-list-module-vd14x .menu-list-module-4QhF4 .menu-list-module-xFYyo > span {
5961
+ position: absolute;
5962
+ overflow: hidden;
5963
+ block-size: 0;
5964
+ inline-size: 0;
5965
+ }
5966
+
5967
+ .menu-list-module-TloB9.menu-list-module-vd14x .menu-list-module-4QhF4 .menu-list-module-4PbP- {
5968
+ margin: 0;
5969
+ }
5970
+
5971
+ .menu-list-module-TloB9.menu-list-module-vd14x .menu-list-module-4QhF4.menu-list-module-61uJb {
5972
+ grid-template-areas: '. imagebadge .';
5973
+ grid-template-columns: var(--mli-outer-spacing) max-content var(
5974
+ --mli-outer-spacing
5975
+ );
5976
+ }
5977
+
5978
+ /* stylelint-disable-next-line max-nesting-depth */
5979
+ .menu-list-module-TloB9.menu-list-module-vd14x .menu-list-module-4QhF4.menu-list-module-61uJb .menu-list-module-syyw9 {
5980
+ display: none;
5981
+ }
5982
+ }
5941
5983
 
5942
5984
  /* menu list back button */
5943
5985
 
@@ -6046,7 +6088,7 @@ button.swiper-pagination-bullet {
6046
6088
  minmax(var(--ml-item-minimal-height, 48px), min-content) / var(
6047
6089
  --mli-outer-spacing
6048
6090
  )
6049
- minmax(0, min-content) 1fr var(--mli-outer-spacing);
6091
+ max-content 1fr var(--mli-outer-spacing);
6050
6092
  grid-template-areas: '. imagebadge label .';
6051
6093
 
6052
6094
  /* children icon */
@@ -6186,13 +6228,14 @@ button.swiper-pagination-bullet {
6186
6228
  /* has children */
6187
6229
 
6188
6230
  .menu-list-module-4QhF4.menu-list-module-61uJb {
6231
+ --arrow-space: calc(
6232
+ var(--mli-inner-spacing) + var(--mli-icon-size) + var(--mli-inner-spacing)
6233
+ );
6234
+
6189
6235
  grid-template-areas: '. imagebadge label icon';
6190
6236
  grid-template-columns:
6191
- var(--mli-outer-spacing) minmax(0, min-content)
6192
- 1fr calc(
6193
- var(--mli-inner-spacing) + var(--mli-icon-size) +
6194
- var(--mli-inner-spacing)
6195
- );
6237
+ var(--mli-outer-spacing) max-content
6238
+ 1fr var(--arrow-space);
6196
6239
  }
6197
6240
 
6198
6241
  .menu-list-module-4QhF4.menu-list-module-61uJb:not(.menu-list-module-hiMca):has(.menu-list-module-xFYyo:hover) {
@@ -6710,6 +6753,61 @@ button.swiper-pagination-bullet {
6710
6753
  place-items: center;
6711
6754
  }
6712
6755
 
6756
+ .dynamic-loading-overlay-module-CAecM {
6757
+ --content-opacity: 0.35;
6758
+ --indicator-min-size: 176px;
6759
+ --intersected-height: 0px;
6760
+ --transition-duration: var(--transition-duration-short);
6761
+ --transition-delay: var(--transition-duration-short);
6762
+
6763
+ position: relative;
6764
+ display: grid;
6765
+ box-sizing: border-box;
6766
+ align-self: start;
6767
+ }
6768
+
6769
+ .dynamic-loading-overlay-module-CAecM .dynamic-loading-overlay-module-XeFAb {
6770
+ z-index: 1;
6771
+ grid-column: 1;
6772
+ grid-row: 1;
6773
+ transition: opacity var(--transition-duration);
6774
+ }
6775
+
6776
+ .dynamic-loading-overlay-module-CAecM .dynamic-loading-overlay-module-lhL5i {
6777
+ position: sticky;
6778
+ z-index: 2;
6779
+ box-sizing: border-box;
6780
+ block-size: var(--intersected-height);
6781
+ grid-column: 1;
6782
+ grid-row: 1;
6783
+ inset: 0;
6784
+ max-block-size: 100svh;
6785
+ min-block-size: var(--indicator-min-size);
6786
+ opacity: 0;
6787
+ pointer-events: none;
6788
+ transition:
6789
+ visibility var(--transition-duration),
6790
+ opacity var(--transition-duration);
6791
+ visibility: hidden;
6792
+ }
6793
+
6794
+ .dynamic-loading-overlay-module-CAecM .dynamic-loading-overlay-module-lhL5i .dynamic-loading-overlay-module-cpo4H {
6795
+ position: absolute;
6796
+ margin: auto;
6797
+ inset: 0;
6798
+ }
6799
+
6800
+ .dynamic-loading-overlay-module-CAecM.dynamic-loading-overlay-module-3bed- .dynamic-loading-overlay-module-XeFAb {
6801
+ opacity: var(--content-opacity);
6802
+ transition-delay: var(--transition-delay);
6803
+ }
6804
+
6805
+ .dynamic-loading-overlay-module-CAecM.dynamic-loading-overlay-module-3bed- .dynamic-loading-overlay-module-lhL5i {
6806
+ opacity: 1;
6807
+ transition-delay: var(--transition-delay);
6808
+ visibility: visible;
6809
+ }
6810
+
6713
6811
  .loading-overlay-module-L67Gy {
6714
6812
  position: fixed;
6715
6813
  display: grid;
@@ -7723,9 +7821,20 @@ button.swiper-pagination-bullet {
7723
7821
  }
7724
7822
 
7725
7823
  @media (width >= 768px) {.my-sonic-layout-module-ep0n3 {
7726
- --aside-size: clamp(236px, 22%, 308px);
7727
7824
  --gap: var(--space-20);
7728
7825
  --margin: 0;
7826
+ --aside-size: 56px;
7827
+ --aside-sticky-top: calc(var(--header-bottom, 0) + var(--space-16));
7828
+
7829
+ grid-template-areas:
7830
+ '. . title'
7831
+ 'aside . main';
7832
+ grid-template-columns: var(--aside-size) var(--gap) 1fr
7833
+ }
7834
+ }
7835
+
7836
+ @media (width >= 1024px) {.my-sonic-layout-module-ep0n3 {
7837
+ --aside-size: clamp(56px, 22%, 308px);
7729
7838
 
7730
7839
  grid-template-areas:
7731
7840
  'pre-aside . title'
@@ -7736,32 +7845,50 @@ button.swiper-pagination-bullet {
7736
7845
 
7737
7846
  @media (width >= 1440px) {.my-sonic-layout-module-ep0n3 {
7738
7847
  --gap: var(--space-40);
7739
- --padding: var(--space-48)
7848
+ --padding: var(--space-48);
7849
+ --aside-sticky-top: calc(var(--header-bottom, 0) + var(--space-20))
7740
7850
  }
7741
7851
  }
7742
7852
 
7853
+ /* title */
7854
+
7743
7855
  .my-sonic-layout-module-ep0n3 .my-sonic-layout-module-yMdPQ {
7744
7856
  align-self: last baseline;
7745
7857
  grid-area: title;
7746
7858
  margin-block-end: var(--margin);
7747
7859
  }
7748
7860
 
7861
+ /* main */
7862
+
7749
7863
  .my-sonic-layout-module-ep0n3 .my-sonic-layout-module-f0Bhf {
7750
7864
  container-type: inline-size;
7751
7865
  grid-area: main;
7752
7866
  }
7753
7867
 
7868
+ /* pre aside */
7869
+
7754
7870
  .my-sonic-layout-module-ep0n3 .my-sonic-layout-module-6pWHC {
7755
7871
  align-self: last baseline;
7756
7872
  grid-area: pre-aside;
7757
7873
  margin-block-end: var(--margin);
7758
7874
  }
7759
7875
 
7876
+ /* aside */
7877
+
7760
7878
  .my-sonic-layout-module-ep0n3 .my-sonic-layout-module--OEV- {
7879
+ align-self: start;
7761
7880
  grid-area: aside;
7762
7881
  margin-block-end: var(--margin);
7763
7882
  }
7764
7883
 
7884
+ @media (width >= 768px) {
7885
+
7886
+ .my-sonic-layout-module-ep0n3 .my-sonic-layout-module--OEV- {
7887
+ position: sticky;
7888
+ inset-block-start: var(--aside-sticky-top)
7889
+ }
7890
+ }
7891
+
7765
7892
  .my-sonic-desktop-navigation-module-f8Y3F {
7766
7893
  font-weight: bold;
7767
7894
  }
@@ -7778,794 +7905,929 @@ button.swiper-pagination-bullet {
7778
7905
  }
7779
7906
  }
7780
7907
 
7781
- .product-details-page-layout-module-pPtZX {
7782
- display: flex;
7783
- flex-direction: column;
7784
- padding-top: var(--space-24);
7785
- margin-bottom: var(--space-64);
7786
- gap: var(--space-64);
7908
+ .table-module-pevNG {
7909
+ position: relative;
7910
+ box-sizing: border-box;
7911
+ container-name: table-container;
7912
+ container-type: inline-size;
7913
+ overflow-x: auto;
7787
7914
  }
7788
7915
 
7789
- .product-details-page-layout-module-pPtZX .product-details-page-layout-module-KCKLZ .product-details-page-layout-module-0uf92 {
7790
- height: 100%;
7791
- align-self: flex-start;
7792
- margin-bottom: var(--space-16);
7793
- }
7916
+ .table-module-k47fT {
7917
+ --columns: 1;
7918
+ --border-color: var(--color-gray-200);
7919
+ --bgcolor-odd: var(--color-white);
7920
+ --bgcolor-even: var(--color-gray-50);
7921
+ --bgcolor-col-selected: rgb(0 0 0 / 5%);
7922
+ --bgcolor-row-selected: rgb(0 0 0 / 10%);
7923
+ --bgcolor-col-highlight: rgb(0 0 0 / 2.5%);
7924
+ --bgcolor-row-highlight: rgb(0 0 0 / 2.5%);
7925
+ --cell-padding: var(--space-12);
7926
+ --grid-columns-default: repeat(var(--columns), minmax(min-content, auto));
7927
+ --shadow: rgb(0 0 0 / 12.5%);
7928
+ --z-column: 10;
7929
+ --z-sticky: 11;
7930
+ --z-selected: 12;
7794
7931
 
7795
- .product-details-page-layout-module-pPtZX .product-details-page-layout-module-KCKLZ .product-details-page-layout-module-3-19O {
7796
- position: sticky;
7797
- top: calc(var(--header-bottom) + var(--space-8));
7798
- height: -moz-fit-content;
7799
- height: fit-content;
7800
- }
7932
+ @property --columns {
7933
+ initial-value: 1;
7934
+ syntax: '<integer>';
7935
+ }
7801
7936
 
7802
- .product-details-page-layout-module-pPtZX .product-details-page-layout-module-lfAgH {
7803
- display: flex;
7804
- flex-direction: column;
7805
- align-items: center;
7806
- gap: var(--space-24);
7937
+ position: relative;
7938
+ display: grid;
7939
+ box-sizing: border-box;
7940
+ padding: 0;
7941
+ background: var(--color-white);
7942
+ grid-template-columns: var(--grid-columns, var(--grid-columns-default));
7943
+ grid-template-rows:
7944
+ [clmns-start thead-start]
7945
+ auto
7946
+ [thead-end tbody-start]
7947
+ auto
7948
+ [tbody-end clmns-end];
7949
+ line-height: 1.25;
7950
+ max-inline-size: -moz-fit-content;
7951
+ max-inline-size: fit-content;
7952
+
7953
+ /* column highlighting (just 10 columns) */
7954
+ }
7955
+
7956
+ /* columns */
7957
+
7958
+ .table-module-k47fT .table-module-1lgqE {
7959
+ display: grid;
7960
+ grid-column: 1 / -1;
7961
+ grid-row: clmns;
7962
+ grid-template-columns: subgrid;
7963
+ pointer-events: none;
7807
7964
  }
7808
7965
 
7809
- .product-details-page-layout-module-pPtZX .product-details-page-layout-module-e8ZNQ {
7966
+ .table-module-k47fT .table-module-dISOo {
7810
7967
  position: relative;
7811
- left: -10px;
7812
- width: 100dvw;
7968
+ z-index: var(--z-column);
7813
7969
  }
7814
7970
 
7815
- @media (width >= 768px) {
7816
- .product-details-page-layout-module-pPtZX .product-details-page-layout-module-e8ZNQ {
7817
- position: relative;
7818
- left: auto;
7819
- width: auto;
7971
+ .table-module-k47fT .table-module-dISOo.table-module-WGz-I {
7972
+ background-blend-mode: multiply;
7973
+ background-color: var(--bgcolor-col-selected);
7820
7974
  }
7821
- }
7822
7975
 
7823
- @media (width >= 1024px) {
7824
- .product-details-page-layout-module-pPtZX .product-details-page-layout-module-KCKLZ {
7825
- display: grid;
7826
- gap: var(--space-24);
7827
- grid-template-columns: 396px 1fr;
7976
+ .table-module-k47fT .table-module-dISOo.table-module-PQejy {
7977
+ position: sticky;
7978
+ z-index: var(--z-selected);
7979
+ container-name: sticky-column;
7980
+ /* stylelint-disable-next-line declaration-property-value-no-unknown */
7981
+ container-type: scroll-state;
7982
+ inset-inline: 0;
7828
7983
  }
7829
7984
 
7830
- .product-details-page-layout-module-pPtZX .product-details-page-layout-module-KCKLZ .product-details-page-layout-module-0uf92 {
7831
- margin-bottom: 0;
7985
+ .table-module-k47fT .table-module-dISOo.table-module-PQejy::before,
7986
+ .table-module-k47fT .table-module-dISOo.table-module-PQejy::after {
7987
+ position: absolute;
7988
+ background: linear-gradient(-90deg, var(--shadow) 0%, transparent 100%);
7989
+ content: '';
7990
+ inline-size: var(--space-8);
7991
+ inset-block: 0;
7992
+ opacity: 0;
7993
+ transition: opacity var(--transition-duration-short);
7832
7994
  }
7833
- }
7834
7995
 
7835
- @media (width >= 1440px) {
7836
- .product-details-page-layout-module-pPtZX .product-details-page-layout-module-KCKLZ {
7837
- gap: var(--space-32);
7838
- grid-template-columns: 600px 1fr;
7839
- }
7840
- }
7996
+ .table-module-k47fT .table-module-dISOo.table-module-PQejy::before {
7997
+ inset-inline: auto 100%;
7998
+ }
7841
7999
 
7842
- .product-detail-images-module-ERzjA {
7843
- display: flex;
7844
- width: 100%;
7845
- height: 100%;
7846
- box-sizing: border-box;
7847
- align-items: center;
7848
- justify-content: center;
7849
- padding: 64px 48px;
7850
- }
8000
+ @container sticky-column scroll-state(stuck: inline-end) {
7851
8001
 
7852
- .product-details-panel-module-MXfPm {
7853
- display: flex;
7854
- flex-direction: column;
7855
- gap: 24px;
7856
- }
8002
+ .table-module-k47fT .table-module-dISOo.table-module-PQejy::before {
8003
+ opacity: 1
8004
+ }
8005
+ }
7857
8006
 
7858
- .product-details-panel-module-MXfPm .product-details-panel-module-rtZYR {
7859
- display: flex;
7860
- flex-direction: column;
7861
- gap: 8px;
7862
- }
8007
+ .table-module-k47fT .table-module-dISOo.table-module-PQejy::after {
8008
+ inset-inline: 100% auto;
8009
+ rotate: 180deg;
8010
+ }
7863
8011
 
7864
- .product-details-panel-module-MXfPm .product-details-panel-module-IbS9- {
7865
- align-self: start;
7866
- }
8012
+ @container sticky-column scroll-state(stuck: inline-start) {
7867
8013
 
7868
- .product-details-panel-module-MXfPm .product-details-panel-module-wHZCr {
7869
- display: flex;
7870
- width: 100%;
7871
- align-items: flex-end;
7872
- justify-content: space-between;
8014
+ .table-module-k47fT .table-module-dISOo.table-module-PQejy::after {
8015
+ opacity: 1
8016
+ }
8017
+ }
8018
+
8019
+ /* cells */
8020
+
8021
+ .table-module-k47fT .table-module-jRXnY,
8022
+ .table-module-k47fT .table-module-wJwSq {
8023
+ overflow: hidden;
8024
+ box-sizing: border-box;
8025
+ padding: var(--cell-padding);
8026
+ text-align: start;
8027
+ text-wrap: balance;
7873
8028
  }
7874
8029
 
7875
- .product-details-panel-module-MXfPm .product-details-panel-module-wHZCr .product-details-panel-module-dI2JL {
7876
- --price-toggle-size: var(--price-size-larger);
8030
+ .table-module-k47fT .table-module-jRXnY.table-module-h7qdo, .table-module-k47fT .table-module-wJwSq.table-module-h7qdo {
8031
+ text-wrap: nowrap;
7877
8032
  }
7878
8033
 
7879
- .product-details-panel-module-MXfPm .product-details-panel-module-wHZCr .product-details-panel-module-QLafW {
7880
- display: flex;
7881
- align-items: center;
8034
+ .table-module-k47fT .table-module-jRXnY.table-module-PQejy, .table-module-k47fT .table-module-wJwSq.table-module-PQejy {
8035
+ position: sticky;
8036
+ z-index: var(--z-sticky);
8037
+ inset-inline: 0;
7882
8038
  }
7883
8039
 
7884
- .product-details-panel-module-MXfPm .product-details-panel-module-9L-Nm {
7885
- margin-top: var(--space-12);
7886
- color: var(--color-brand-dark-gray);
7887
- font-size: 16px;
7888
- font-stretch: normal;
7889
- font-style: normal;
7890
- font-weight: normal;
7891
- letter-spacing: normal;
7892
- line-height: 1.5;
8040
+ .table-module-k47fT thead th {
8041
+ position: relative;
7893
8042
  }
7894
8043
 
7895
- .product-details-panel-module-MXfPm .product-details-panel-module-9L-Nm p {
7896
- margin: 0;
8044
+ .table-module-k47fT thead th:not(:last-child)::after {
8045
+ position: absolute;
8046
+ border-inline-end: 1px solid var(--border-color);
8047
+ content: '';
8048
+ inset: var(--space-8) 0 var(--space-8) auto;
7897
8049
  }
7898
8050
 
7899
- .product-details-panel-module-MXfPm .product-details-panel-module-NC2nx {
7900
- margin-top: var(--space-16);
7901
- margin-bottom: var(--space-24);
7902
- }
8051
+ .table-module-k47fT tbody th.table-module-EWdty, .table-module-k47fT tbody td.table-module-EWdty {
8052
+ text-align: start;
8053
+ }
7903
8054
 
7904
- .product-details-recently-viewed-section-module-cGFgH {
7905
- display: flex;
7906
- flex-direction: column;
7907
- align-items: center;
7908
- gap: var(--space-24);
7909
- }
8055
+ .table-module-k47fT tbody th.table-module-yJD74, .table-module-k47fT tbody td.table-module-yJD74 {
8056
+ text-align: end;
8057
+ }
7910
8058
 
7911
- & .promo-banner-module-yuVEO {
7912
- position: relative;
7913
- display: block;
7914
- height: 122px;
7915
- outline: none;
7916
- }
8059
+ .table-module-k47fT tbody th.table-module-XAdfy, .table-module-k47fT tbody td.table-module-XAdfy {
8060
+ text-align: center;
8061
+ }
7917
8062
 
7918
- & .promo-banner-module-yuVEO.promo-banner-module-ut8Kd {
7919
- width: 250px;
7920
- }
8063
+ /* rows */
7921
8064
 
7922
- & .promo-banner-module-yuVEO.promo-banner-module-CSkIw {
7923
- width: 310px;
8065
+ .table-module-k47fT .table-module-Nisf1 {
8066
+ display: grid;
8067
+ border-block-end: 1px solid var(--border-color);
8068
+ grid-column: 1 / -1;
8069
+ grid-template-columns: subgrid;
8070
+ grid-template-rows: subgrid;
7924
8071
  }
7925
8072
 
7926
- & .promo-banner-module-yuVEO picture {
7927
- width: 100%;
7928
- }
8073
+ .table-module-k47fT .table-module-Nisf1 .table-module-jRXnY,
8074
+ .table-module-k47fT .table-module-Nisf1 .table-module-wJwSq {
8075
+ background-color: var(--bgcolor-odd);
8076
+ }
7929
8077
 
7930
- & .promo-banner-module-yuVEO picture img {
7931
- width: 100%;
8078
+ .table-module-k47fT .table-module-Nisf1:nth-child(even) .table-module-jRXnY,
8079
+ .table-module-k47fT .table-module-Nisf1:nth-child(even) .table-module-wJwSq {
8080
+ background-color: var(--bgcolor-even);
8081
+ }
8082
+
8083
+ :has(.table-module-3zZB6) .table-module-k47fT .table-module-Nisf1::after {
8084
+ z-index: var(--z-selected);
8085
+ background-blend-mode: multiply;
8086
+ background-color: var(--bgcolor-row-highlight);
8087
+ content: '';
8088
+ grid-column: 1 / -1;
8089
+ opacity: 0;
8090
+ pointer-events: none;
8091
+ }
8092
+
8093
+ @media (pointer: fine) {
8094
+
8095
+ :has(.table-module-3zZB6) .table-module-k47fT .table-module-Nisf1:hover::after {
8096
+ opacity: 1
8097
+ }
8098
+ }
8099
+
8100
+ .table-module-k47fT .table-module-Nisf1.table-module-WGz-I::after {
8101
+ z-index: var(--z-selected);
8102
+ background-blend-mode: multiply;
8103
+ background-color: var(--bgcolor-row-selected);
8104
+ content: '';
8105
+ grid-column: 1 / -1;
8106
+ opacity: 1;
8107
+ pointer-events: none;
8108
+ }
8109
+
8110
+ .table-module-k47fT .table-module-Nisf1.table-module-qRfjM {
8111
+ cursor: pointer;
7932
8112
  }
7933
8113
 
7934
- & .promo-banner-module-yuVEO:focus-visible::after {
7935
- position: absolute;
7936
- display: block;
7937
- background-color: transparent;
7938
- box-shadow: var(--shadow-focus-outline) inset;
7939
- content: '';
7940
- inset: 0;
7941
- pointer-events: none;
7942
- -webkit-user-select: none;
7943
- -moz-user-select: none;
7944
- user-select: none;
7945
- }
8114
+ /* table header */
7946
8115
 
7947
- @media (width >= 768px) {
7948
- & .promo-banner-module-yuVEO {
7949
- height: 230px;
8116
+ .table-module-k47fT .table-module-DK-wn {
8117
+ display: grid;
8118
+ grid-column: 1 / -1;
8119
+ grid-row: thead;
8120
+ grid-template-columns: subgrid;
7950
8121
  }
7951
8122
 
7952
- & .promo-banner-module-yuVEO.promo-banner-module-CSkIw,
7953
- & .promo-banner-module-yuVEO.promo-banner-module-ut8Kd {
7954
- width: auto;
8123
+ .table-module-k47fT .table-module-DK-wn .table-module-Nisf1 {
8124
+ border-block-start: 0;
7955
8125
  }
7956
- }
7957
8126
 
7958
- .promo-banners-module-uVyxh {
7959
- margin-bottom: var(--space-24);
7960
- }
8127
+ .table-module-k47fT .table-module-DK-wn .table-module-Nisf1 .table-module-jRXnY,
8128
+ .table-module-k47fT .table-module-DK-wn .table-module-Nisf1 .table-module-wJwSq {
8129
+ background-color: var(--bgcolor-even);
8130
+ font-weight: var(--font-weight-bold);
8131
+ }
7961
8132
 
7962
- @media (width >= 768px) {
7963
- .promo-banners-module-uVyxh {
8133
+ /* table body */
8134
+
8135
+ .table-module-k47fT .table-module-tygZb {
7964
8136
  display: grid;
7965
- margin-bottom: var(--space-32);
7966
- gap: var(--space-16);
7967
- grid-template-columns: 2fr 1fr;
8137
+ grid-column: 1 / -1;
8138
+ grid-row: tbody;
8139
+ grid-template-columns: subgrid;
8140
+ transition: opacity var(--transition-duration-short);
7968
8141
  }
7969
- }
7970
8142
 
7971
- @media (width >= 1440px) {
7972
- .promo-banners-module-uVyxh {
7973
- gap: var(--space-24);
7974
- grid-template-columns: 1.5fr 1fr;
8143
+ /* full width table */
8144
+
8145
+ .table-module-k47fT.table-module-YnmWV {
8146
+ min-inline-size: 100%;
7975
8147
  }
7976
- }
7977
8148
 
7978
- .sidebar-module-fSa9Q.sidebar-module-AIq0M {
7979
- --transition-timing-function: ease-in-out;
8149
+ .table-module-k47fT.table-module-YnmWV .table-module-skhNZ {
8150
+ text-align: start;
8151
+ }
7980
8152
 
7981
- position: fixed;
7982
- z-index: calc(var(--sidebar-layer) + 1);
7983
- top: 0;
7984
- left: 0;
7985
- width: 382px;
7986
- max-width: 100vw;
7987
- height: 100%;
7988
- box-sizing: border-box;
7989
- padding-top: 46px;
7990
- padding-bottom: 56px;
7991
- background: var(--color-white);
7992
- }
8153
+ /* no text wrap for entire table */
7993
8154
 
7994
- .sidebar-module-fSa9Q.sidebar-module-AIq0M.sidebar-module-LEZgg {
7995
- transition: transform var(--transition-duration)
7996
- var(--transition-timing-function);
7997
- }
8155
+ .table-module-k47fT.table-module-h7qdo .table-module-Nisf1 .table-module-jRXnY,
8156
+ .table-module-k47fT.table-module-h7qdo .table-module-Nisf1 .table-module-wJwSq {
8157
+ text-wrap: nowrap;
8158
+ }
7998
8159
 
7999
- .sidebar-module-fSa9Q.sidebar-module-AIq0M.sidebar-module-lV7wp {
8000
- box-shadow: var(--box-shadow-heavy);
8001
- pointer-events: auto;
8002
- transform: translateX(0);
8160
+ .table-module-k47fT col:hover {
8161
+ background-color: red;
8003
8162
  }
8004
8163
 
8005
- .sidebar-module-fSa9Q.sidebar-module-AIq0M.sidebar-module-dGDrr {
8006
- box-shadow: none;
8007
- pointer-events: none;
8008
- transform: translateX(-100%);
8009
- }
8164
+ @media (pointer: fine) {
8010
8165
 
8011
- .sidebar-module-fSa9Q.sidebar-module-AIq0M .sidebar-module-2puGC {
8012
- position: absolute;
8013
- z-index: calc(var(--sidebar-layer) + 2);
8014
- top: 36px;
8015
- right: 8px;
8166
+ .table-module-k47fT.table-module-JEp5f:has(.table-module-DK-wn th.table-module-hyPmy:nth-child(1):hover) .table-module-dISOo:nth-child(1),
8167
+ .table-module-k47fT.table-module-JEp5f:has(.table-module-DK-wn th.table-module-hyPmy:nth-child(2):hover) .table-module-dISOo:nth-child(2),
8168
+ .table-module-k47fT.table-module-JEp5f:has(.table-module-DK-wn th.table-module-hyPmy:nth-child(3):hover) .table-module-dISOo:nth-child(3),
8169
+ .table-module-k47fT.table-module-JEp5f:has(.table-module-DK-wn th.table-module-hyPmy:nth-child(4):hover) .table-module-dISOo:nth-child(4),
8170
+ .table-module-k47fT.table-module-JEp5f:has(.table-module-DK-wn th.table-module-hyPmy:nth-child(5):hover) .table-module-dISOo:nth-child(5),
8171
+ .table-module-k47fT.table-module-JEp5f:has(.table-module-DK-wn th.table-module-hyPmy:nth-child(6):hover) .table-module-dISOo:nth-child(6),
8172
+ .table-module-k47fT.table-module-JEp5f:has(.table-module-DK-wn th.table-module-hyPmy:nth-child(7):hover) .table-module-dISOo:nth-child(7),
8173
+ .table-module-k47fT.table-module-JEp5f:has(.table-module-DK-wn th.table-module-hyPmy:nth-child(8):hover) .table-module-dISOo:nth-child(8),
8174
+ .table-module-k47fT.table-module-JEp5f:has(.table-module-DK-wn th.table-module-hyPmy:nth-child(9):hover) .table-module-dISOo:nth-child(9),
8175
+ .table-module-k47fT.table-module-JEp5f:has(.table-module-DK-wn th.table-module-hyPmy:nth-child(10):hover) .table-module-dISOo:nth-child(10) {
8176
+ background-blend-mode: multiply;
8177
+ background-color: var(--bgcolor-col-highlight)
8016
8178
  }
8017
-
8018
- .sidebar-module-fSa9Q.sidebar-module-AIq0M .sidebar-module-2puGC svg {
8019
- display: block;
8020
- width: 32px;
8021
- height: 32px;
8022
8179
  }
8023
8180
 
8024
- .sidebar-module-fSa9Q.sidebar-module-AIq0M .sidebar-module-2puGC button {
8025
- -webkit-tap-highlight-color: transparent;
8026
- }
8181
+ /* table sort buttons */
8027
8182
 
8028
- .sidebar-module-fSa9Q.sidebar-module-Scw7D {
8029
- --transition-timing-function: ease-in-out;
8183
+ .table-module-RtOV- {
8184
+ --icon-space: 12px;
8185
+ --icon-size: 12px;
8186
+ --icon-rotation: 0deg;
8187
+ --icon-visibility: hidden;
8188
+ --gap: var(--space-4);
8030
8189
 
8031
- position: static;
8032
- z-index: initial;
8033
- overflow: hidden;
8034
- width: 0;
8035
- padding: 0;
8036
- transform: translateX(0);
8037
- white-space: nowrap;
8190
+ all: unset;
8191
+ display: grid;
8192
+ align-items: baseline;
8193
+ padding: var(--cell-padding);
8194
+ cursor: pointer;
8195
+ gap: var(--gap);
8196
+ grid-template-areas: 'label icon';
8197
+ grid-template-columns: 1fr var(--icon-space);
8198
+ inline-size: 100%;
8199
+ text-align: start;
8038
8200
  }
8039
8201
 
8040
- .sidebar-module-fSa9Q.sidebar-module-Scw7D.sidebar-module-LEZgg {
8041
- transition:
8042
- width var(--transition-duration) var(--transition-timing-function),
8043
- transform var(--transition-duration) var(--transition-timing-function);
8202
+ .table-module-RtOV-:focus-visible {
8203
+ box-shadow: var(--shadow-focus-outline) inset;
8204
+ outline: none;
8044
8205
  }
8045
8206
 
8046
- .sidebar-module-fSa9Q.sidebar-module-Scw7D.sidebar-module-lV7wp {
8047
- width: 324px;
8048
- box-shadow: none;
8207
+ .table-module-RtOV- .table-module-ukG8s {
8208
+ grid-area: label;
8049
8209
  }
8050
8210
 
8051
- .sidebar-module-fSa9Q.sidebar-module-Scw7D.sidebar-module-dGDrr {
8052
- transform: translateX(0);
8211
+ .table-module-RtOV- .table-module-QdiLJ {
8212
+ grid-area: icon;
8213
+ justify-self: center;
8214
+ rotate: var(--icon-rotation);
8215
+ visibility: var(--icon-visibility);
8053
8216
  }
8054
8217
 
8055
- .sidebar-module-fSa9Q.sidebar-module-Scw7D .sidebar-module-2puGC {
8056
- display: none;
8218
+ .table-module-RtOV-.table-module-gWy-a {
8219
+ --icon-visibility: visible;
8057
8220
  }
8058
8221
 
8059
- .product-listing-page-module-U0zLZ .product-listing-page-module-9a0ps {
8060
- margin-bottom: 44px;
8222
+ .table-module-RtOV-.table-module-9AwNp {
8223
+ --icon-rotation: 0deg;
8061
8224
  }
8062
- .product-listing-page-module-U0zLZ .product-listing-page-module-VvYG3 {
8063
- margin-bottom: var(--space-24);
8225
+
8226
+ .table-module-RtOV-.table-module-aYS8r {
8227
+ --icon-rotation: 180deg;
8064
8228
  }
8065
- .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo {
8066
- display: grid;
8067
- gap: var(--space-16);
8068
- justify-items: center;
8229
+
8230
+ .table-module-DK-wn .table-module-RtOV- {
8231
+ margin: calc(var(--cell-padding) * -1);
8232
+ }
8233
+
8234
+ .truncated-module-bwo1A {
8235
+ display: -webkit-box;
8236
+ text-wrap: auto;
8237
+ }
8238
+
8239
+ .truncated-module-bwo1A.truncated-module-JHMUL {
8240
+ overflow: hidden;
8241
+ -webkit-box-orient: vertical;
8242
+ -webkit-line-clamp: var(--lines, 1);
8243
+ line-clamp: var(--lines, 1);
8244
+ text-overflow: ellipsis;
8069
8245
  }
8070
- .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-qhR-J,
8071
- .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-3LRKg {
8072
- width: 100%;
8073
- }
8074
- .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-qhR-J > *, .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-3LRKg > * {
8075
- display: flex;
8076
- width: 100%;
8077
- justify-content: center;
8078
- }
8079
- .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-3Jtw- {
8080
- order: 2;
8081
- }
8082
- .product-listing-page-module-U0zLZ .product-listing-page-module-UwMEE {
8083
- margin-bottom: var(--space-44);
8246
+
8247
+ .data-table-module-7CcZR {
8248
+ display: flex;
8249
+ flex-direction: column;
8250
+ gap: var(--space-16);
8251
+ }
8252
+
8253
+ .data-table-module-WFG32 .data-table-module-9UZ8I {
8254
+ display: block;
8255
+ margin: 0 auto;
8256
+ block-size: var(--space-20);
8257
+ inline-size: var(--space-20);
8084
8258
  }
8085
- .product-listing-page-module-U0zLZ .product-listing-page-module-cUe4a {
8086
- display: grid;
8087
- grid-template-columns: 1fr;
8259
+
8260
+ .order-history-module-LrkiZ {
8261
+ --gap-col: var(--space-8);
8262
+ --gap-row: var(--space-8);
8263
+ --z-index-sticky: 10;
8264
+ --sticky-top: var(--header-bottom, 0);
8265
+ --shadow: rgb(0 0 0 / 12.5%);
8266
+
8267
+ display: grid;
8268
+ gap: var(--gap-row) var(--gap-col);
8269
+ grid-template:
8270
+ [bar-start] auto [bar-end] repeat(3, auto)
8271
+ / [bar-start] 1fr [bar-end];
8272
+ grid-template-areas:
8273
+ 'search'
8274
+ 'filter'
8275
+ 'results'
8276
+ 'paging';
8277
+ scroll-margin-block: calc(var(--sticky-top) + var(--gap-row));
8278
+ }
8279
+
8280
+ @media (width >= 768px) {.order-history-module-LrkiZ {
8281
+ --gap-row: var(--space-16);
8282
+
8283
+ grid-template-areas:
8284
+ 'search filter'
8285
+ 'results results'
8286
+ 'paging paging';
8287
+ grid-template-columns: [bar-start] 1fr 1fr [bar-end]
8288
+ }
8088
8289
  }
8089
- .product-listing-page-module-U0zLZ .product-listing-page-module-dtbXB {
8090
- display: flex;
8091
- flex-direction: column;
8290
+
8291
+ @media (width >= 1024px) {.order-history-module-LrkiZ {
8292
+ grid-template-areas:
8293
+ '. search filter'
8294
+ 'results results results'
8295
+ 'paging paging paging';
8296
+ grid-template-columns: [bar-start] 1fr 26ch 26ch [bar-end]
8297
+ }
8092
8298
  }
8093
- .product-listing-page-module-U0zLZ .product-listing-page-module-zKOQv {
8094
- margin-top: var(--space-24);
8095
- grid-column: span 2;
8299
+
8300
+ @media (width >= 1440px) {.order-history-module-LrkiZ {
8301
+ --gap-row: var(--space-20)
8302
+ }
8096
8303
  }
8097
- @media (width >= 768px) {
8098
- .product-listing-page-module-U0zLZ .product-listing-page-module-UwMEE {
8099
- margin-bottom: var(--space-64);
8100
- }
8101
8304
 
8102
- .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo {
8103
- display: grid;
8104
- align-items: center;
8105
- justify-content: space-between;
8106
- margin-bottom: var(--space-24);
8107
- grid-template-columns: repeat(3, 1fr);
8108
- row-gap: var(--space-8);
8109
- }
8305
+ /* search */
8110
8306
 
8111
- .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-qhR-J,
8112
- .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-3LRKg {
8113
- width: initial;
8114
- }
8307
+ .order-history-module-LrkiZ .order-history-module-Y18m7 {
8308
+ position: sticky;
8309
+ z-index: var(--z-index-sticky);
8310
+ grid-area: search;
8311
+ inset-block-start: calc(var(--sticky-top, 0) + var(--gap-row));
8312
+ }
8115
8313
 
8116
- .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-qhR-J > *, .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-3LRKg > * {
8117
- width: initial;
8118
- }
8314
+ /* filter */
8119
8315
 
8120
- .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-qhR-J {
8121
- justify-self: flex-start;
8122
- }
8316
+ .order-history-module-LrkiZ .order-history-module-tBrZG {
8317
+ grid-area: filter;
8318
+ }
8123
8319
 
8124
- .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-3LRKg {
8125
- display: flex;
8126
- justify-self: flex-end;
8127
- }
8320
+ @media (width >= 768px) {
8128
8321
 
8129
- .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-3Jtw- {
8130
- order: initial;
8131
- margin: auto;
8132
- }
8322
+ .order-history-module-LrkiZ .order-history-module-tBrZG {
8323
+ position: sticky;
8324
+ z-index: var(--z-index-sticky);
8325
+ inset-block-start: calc(var(--sticky-top) + var(--gap-row))
8133
8326
  }
8134
- @media (width >= 1440px) {
8135
- .product-listing-page-module-U0zLZ .product-listing-page-module-cUe4a {
8136
- grid-template-columns: auto 1fr;
8137
8327
  }
8328
+
8329
+ /* results */
8330
+
8331
+ .order-history-module-LrkiZ .order-history-module-5mST2 {
8332
+ grid-area: results;
8333
+ }
8334
+
8335
+ .order-history-module-LrkiZ .order-history-module-5mST2 .order-history-module-g-FzV {
8336
+ margin-block: var(--space-8);
8337
+ }
8338
+
8339
+ /* paging */
8340
+
8341
+ .order-history-module-LrkiZ .order-history-module-POsiS {
8342
+ grid-area: paging;
8343
+ justify-self: center;
8344
+ padding-block: var(--gap-row);
8138
8345
  }
8139
8346
 
8140
- .search-results-page-module-uE5NE .search-results-page-module-grXkv {
8141
- margin-bottom: 44px;
8347
+ /* white bar behind sticky elements */
8348
+
8349
+ .order-history-module-LrkiZ .order-history-module-98Tvf {
8350
+ position: sticky;
8351
+ z-index: calc(var(--z-index-sticky) - 1);
8352
+ margin: calc(var(--gap-row) * -1)
8353
+ calc(var(--page-container-padding-inline) * -1);
8354
+ background-color: var(--color-white);
8355
+ container-name: sticky-bar;
8356
+ /* stylelint-disable-next-line declaration-property-value-no-unknown */
8357
+ container-type: scroll-state;
8358
+ grid-area: bar;
8359
+ inset-block: var(--sticky-top, 0);
8142
8360
  }
8143
- .search-results-page-module-uE5NE .search-results-page-module--GBRi {
8144
- display: grid;
8145
- gap: var(--space-16);
8146
- justify-items: center;
8361
+
8362
+ @media (width >= 768px) {
8363
+
8364
+ .order-history-module-LrkiZ .order-history-module-98Tvf {
8365
+ margin-inline: 0
8147
8366
  }
8148
- .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-7G8Fo,
8149
- .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-MzRkN {
8150
- width: 100%;
8151
8367
  }
8152
- .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-7G8Fo > *, .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-MzRkN > * {
8153
- display: flex;
8154
- width: 100%;
8155
- justify-content: center;
8368
+
8369
+ .order-history-module-LrkiZ .order-history-module-98Tvf::after {
8370
+ position: absolute;
8371
+ background: linear-gradient(180deg, var(--shadow) 0%, transparent 100%);
8372
+ block-size: var(--space-8);
8373
+ content: '';
8374
+ inset: 100% 0 auto;
8375
+ opacity: 0;
8376
+ transition: opacity var(--transition-duration-short);
8377
+ }
8378
+
8379
+ @container sticky-bar scroll-state(stuck: block-start) {
8380
+
8381
+ .order-history-module-LrkiZ .order-history-module-98Tvf::after {
8382
+ opacity: 1
8383
+ }
8156
8384
  }
8157
- .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-rhDU1 {
8158
- order: 2;
8385
+
8386
+ .product-details-page-layout-module-pPtZX {
8387
+ display: flex;
8388
+ flex-direction: column;
8389
+ padding-top: var(--space-24);
8390
+ margin-bottom: var(--space-64);
8391
+ gap: var(--space-64);
8392
+ }
8393
+
8394
+ .product-details-page-layout-module-pPtZX .product-details-page-layout-module-KCKLZ .product-details-page-layout-module-0uf92 {
8395
+ height: 100%;
8396
+ align-self: flex-start;
8397
+ margin-bottom: var(--space-16);
8159
8398
  }
8160
- .search-results-page-module-uE5NE .search-results-page-module-uxlXw {
8161
- margin-bottom: var(--space-44);
8162
- }
8163
- .search-results-page-module-uE5NE .search-results-page-module-p6Qod {
8164
- display: grid;
8165
- grid-template-columns: 1fr;
8166
- }
8167
- .search-results-page-module-uE5NE .search-results-page-module-7T07c {
8399
+
8400
+ .product-details-page-layout-module-pPtZX .product-details-page-layout-module-KCKLZ .product-details-page-layout-module-3-19O {
8401
+ position: sticky;
8402
+ top: calc(var(--header-bottom) + var(--space-8));
8403
+ height: -moz-fit-content;
8404
+ height: fit-content;
8405
+ }
8406
+
8407
+ .product-details-page-layout-module-pPtZX .product-details-page-layout-module-lfAgH {
8168
8408
  display: flex;
8169
8409
  flex-direction: column;
8410
+ align-items: center;
8411
+ gap: var(--space-24);
8170
8412
  }
8171
- .search-results-page-module-uE5NE .search-results-page-module-zcJy7 {
8172
- margin-top: var(--space-24);
8173
- grid-column: span 2;
8413
+
8414
+ .product-details-page-layout-module-pPtZX .product-details-page-layout-module-e8ZNQ {
8415
+ position: relative;
8416
+ left: -10px;
8417
+ width: 100dvw;
8174
8418
  }
8419
+
8175
8420
  @media (width >= 768px) {
8176
- .search-results-page-module-uE5NE .search-results-page-module-uxlXw {
8177
- margin-bottom: var(--space-64);
8421
+ .product-details-page-layout-module-pPtZX .product-details-page-layout-module-e8ZNQ {
8422
+ position: relative;
8423
+ left: auto;
8424
+ width: auto;
8178
8425
  }
8426
+ }
8179
8427
 
8180
- .search-results-page-module-uE5NE .search-results-page-module--GBRi {
8428
+ @media (width >= 1024px) {
8429
+ .product-details-page-layout-module-pPtZX .product-details-page-layout-module-KCKLZ {
8181
8430
  display: grid;
8182
- align-items: center;
8183
- justify-content: space-between;
8184
- margin-bottom: var(--space-24);
8185
- grid-template-columns: repeat(3, 1fr);
8186
- row-gap: var(--space-8);
8431
+ gap: var(--space-24);
8432
+ grid-template-columns: 396px 1fr;
8187
8433
  }
8188
8434
 
8189
- .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-7G8Fo,
8190
- .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-MzRkN {
8191
- width: initial;
8192
- }
8193
-
8194
- .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-7G8Fo > *, .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-MzRkN > * {
8195
- width: initial;
8196
- }
8197
-
8198
- .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-7G8Fo {
8199
- justify-self: flex-start;
8200
- }
8201
-
8202
- .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-MzRkN {
8203
- display: flex;
8204
- justify-self: flex-end;
8205
- }
8206
-
8207
- .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-rhDU1 {
8208
- order: initial;
8209
- margin: auto;
8435
+ .product-details-page-layout-module-pPtZX .product-details-page-layout-module-KCKLZ .product-details-page-layout-module-0uf92 {
8436
+ margin-bottom: 0;
8210
8437
  }
8211
8438
  }
8439
+
8212
8440
  @media (width >= 1440px) {
8213
- .search-results-page-module-uE5NE .search-results-page-module-p6Qod {
8214
- grid-template-columns: auto 1fr;
8441
+ .product-details-page-layout-module-pPtZX .product-details-page-layout-module-KCKLZ {
8442
+ gap: var(--space-32);
8443
+ grid-template-columns: 600px 1fr;
8215
8444
  }
8216
8445
  }
8217
8446
 
8218
- .sidebar-provider-module-rjeCL {
8219
- --transition-duration: 0;
8220
- }
8221
-
8222
- .sidebar-provider-module-rjeCL.sidebar-provider-module-C0cKR {
8223
- --transition-duration: 0.3s;
8224
- }
8225
-
8226
- .table-module-pevNG {
8447
+ .product-detail-images-module-ERzjA {
8448
+ display: flex;
8449
+ width: 100%;
8450
+ height: 100%;
8227
8451
  box-sizing: border-box;
8228
- container-name: table-container;
8229
- container-type: inline-size;
8230
- overflow-x: auto;
8452
+ align-items: center;
8453
+ justify-content: center;
8454
+ padding: 64px 48px;
8231
8455
  }
8232
8456
 
8233
- .table-module-k47fT {
8234
- --columns: 1;
8235
- --border-color: var(--color-gray-200);
8236
- --bgcolor-odd: var(--color-white);
8237
- --bgcolor-even: var(--color-gray-50);
8238
- --bgcolor-col-selected: rgb(0 0 0 / 5%);
8239
- --bgcolor-row-selected: rgb(0 0 0 / 10%);
8240
- --bgcolor-col-highlight: rgb(0 0 0 / 2.5%);
8241
- --bgcolor-row-highlight: rgb(0 0 0 / 2.5%);
8242
- --cell-padding: var(--space-12);
8243
- --grid-columns-default: repeat(var(--columns), minmax(min-content, auto));
8244
- --shadow: rgb(0 0 0 / 12.5%);
8245
- --z-column: 10;
8246
- --z-sticky: 11;
8247
- --z-selected: 12;
8457
+ .product-details-panel-module-MXfPm {
8458
+ display: flex;
8459
+ flex-direction: column;
8460
+ gap: 24px;
8461
+ }
8248
8462
 
8249
- @property --columns {
8250
- initial-value: 1;
8251
- syntax: '<integer>';
8463
+ .product-details-panel-module-MXfPm .product-details-panel-module-rtZYR {
8464
+ display: flex;
8465
+ flex-direction: column;
8466
+ gap: 8px;
8252
8467
  }
8253
8468
 
8254
- position: relative;
8255
- display: grid;
8256
- box-sizing: border-box;
8257
- align-content: flex-end;
8258
- padding: 0;
8259
- background: var(--color-white);
8260
- grid-template-columns: var(--grid-columns, var(--grid-columns-default));
8261
- grid-template-rows:
8262
- [clmns-start thead-start]
8263
- auto
8264
- [thead-end tbody-start]
8265
- auto
8266
- [tbody-end clmns-end];
8267
- line-height: 1.25;
8268
- max-inline-size: -moz-fit-content;
8269
- max-inline-size: fit-content;
8469
+ .product-details-panel-module-MXfPm .product-details-panel-module-IbS9- {
8470
+ align-self: start;
8471
+ }
8270
8472
 
8271
- /* column highlighting (just 10 columns) */
8473
+ .product-details-panel-module-MXfPm .product-details-panel-module-wHZCr {
8474
+ display: flex;
8475
+ width: 100%;
8476
+ align-items: flex-end;
8477
+ justify-content: space-between;
8478
+ }
8479
+
8480
+ .product-details-panel-module-MXfPm .product-details-panel-module-wHZCr .product-details-panel-module-dI2JL {
8481
+ --price-toggle-size: var(--price-size-larger);
8482
+ }
8483
+
8484
+ .product-details-panel-module-MXfPm .product-details-panel-module-wHZCr .product-details-panel-module-QLafW {
8485
+ display: flex;
8486
+ align-items: center;
8487
+ }
8488
+
8489
+ .product-details-panel-module-MXfPm .product-details-panel-module-9L-Nm {
8490
+ margin-top: var(--space-12);
8491
+ color: var(--color-brand-dark-gray);
8492
+ font-size: 16px;
8493
+ font-stretch: normal;
8494
+ font-style: normal;
8495
+ font-weight: normal;
8496
+ letter-spacing: normal;
8497
+ line-height: 1.5;
8498
+ }
8499
+
8500
+ .product-details-panel-module-MXfPm .product-details-panel-module-9L-Nm p {
8501
+ margin: 0;
8502
+ }
8503
+
8504
+ .product-details-panel-module-MXfPm .product-details-panel-module-NC2nx {
8505
+ margin-top: var(--space-16);
8506
+ margin-bottom: var(--space-24);
8507
+ }
8508
+
8509
+ .product-details-recently-viewed-section-module-cGFgH {
8510
+ display: flex;
8511
+ flex-direction: column;
8512
+ align-items: center;
8513
+ gap: var(--space-24);
8272
8514
  }
8273
8515
 
8274
- /* columns */
8516
+ & .promo-banner-module-yuVEO {
8517
+ position: relative;
8518
+ display: block;
8519
+ height: 122px;
8520
+ outline: none;
8521
+ }
8275
8522
 
8276
- .table-module-k47fT .table-module-1lgqE {
8277
- display: grid;
8278
- grid-column: 1 / -1;
8279
- grid-row: clmns;
8280
- grid-template-columns: subgrid;
8281
- pointer-events: none;
8523
+ & .promo-banner-module-yuVEO.promo-banner-module-ut8Kd {
8524
+ width: 250px;
8282
8525
  }
8283
8526
 
8284
- .table-module-k47fT .table-module-dISOo {
8285
- position: relative;
8286
- z-index: var(--z-column);
8527
+ & .promo-banner-module-yuVEO.promo-banner-module-CSkIw {
8528
+ width: 310px;
8287
8529
  }
8288
8530
 
8289
- .table-module-k47fT .table-module-dISOo.table-module-WGz-I {
8290
- background-blend-mode: multiply;
8291
- background-color: var(--bgcolor-col-selected);
8292
- }
8531
+ & .promo-banner-module-yuVEO picture {
8532
+ width: 100%;
8533
+ }
8293
8534
 
8294
- .table-module-k47fT .table-module-dISOo.table-module-PQejy {
8295
- position: sticky;
8296
- z-index: var(--z-selected);
8297
- container-name: sticky-column;
8298
- /* stylelint-disable-next-line declaration-property-value-no-unknown */
8299
- container-type: scroll-state;
8300
- inset-inline: 0;
8535
+ & .promo-banner-module-yuVEO picture img {
8536
+ width: 100%;
8301
8537
  }
8302
8538
 
8303
- .table-module-k47fT .table-module-dISOo.table-module-PQejy::before,
8304
- .table-module-k47fT .table-module-dISOo.table-module-PQejy::after {
8305
- position: absolute;
8306
- background: linear-gradient(-90deg, var(--shadow) 0%, transparent 100%);
8307
- content: '';
8308
- inline-size: var(--space-8);
8309
- inset-block: 0;
8310
- opacity: 0;
8311
- transition: opacity var(--transition-duration-short);
8312
- }
8539
+ & .promo-banner-module-yuVEO:focus-visible::after {
8540
+ position: absolute;
8541
+ display: block;
8542
+ background-color: transparent;
8543
+ box-shadow: var(--shadow-focus-outline) inset;
8544
+ content: '';
8545
+ inset: 0;
8546
+ pointer-events: none;
8547
+ -webkit-user-select: none;
8548
+ -moz-user-select: none;
8549
+ user-select: none;
8550
+ }
8313
8551
 
8314
- @supports not (container-type: scroll-state) {
8552
+ @media (width >= 768px) {
8553
+ & .promo-banner-module-yuVEO {
8554
+ height: 230px;
8555
+ }
8315
8556
 
8316
- .table-module-k47fT .table-module-dISOo.table-module-PQejy::before,
8317
- .table-module-k47fT .table-module-dISOo.table-module-PQejy::after {
8318
- background: var(--shadow);
8319
- inline-size: 1px;
8320
- opacity: 1
8321
- }
8322
- }
8557
+ & .promo-banner-module-yuVEO.promo-banner-module-CSkIw,
8558
+ & .promo-banner-module-yuVEO.promo-banner-module-ut8Kd {
8559
+ width: auto;
8560
+ }
8561
+ }
8323
8562
 
8324
- .table-module-k47fT .table-module-dISOo.table-module-PQejy::before {
8325
- inset-inline: auto 100%;
8326
- }
8563
+ .promo-banners-module-uVyxh {
8564
+ margin-bottom: var(--space-24);
8565
+ }
8327
8566
 
8328
- @container sticky-column scroll-state(stuck: inline-end) {
8567
+ @media (width >= 768px) {
8568
+ .promo-banners-module-uVyxh {
8569
+ display: grid;
8570
+ margin-bottom: var(--space-32);
8571
+ gap: var(--space-16);
8572
+ grid-template-columns: 2fr 1fr;
8573
+ }
8574
+ }
8329
8575
 
8330
- .table-module-k47fT .table-module-dISOo.table-module-PQejy::before {
8331
- opacity: 1
8332
- }
8333
- }
8576
+ @media (width >= 1440px) {
8577
+ .promo-banners-module-uVyxh {
8578
+ gap: var(--space-24);
8579
+ grid-template-columns: 1.5fr 1fr;
8580
+ }
8581
+ }
8334
8582
 
8335
- .table-module-k47fT .table-module-dISOo.table-module-PQejy::after {
8336
- inset-inline: 100% auto;
8337
- rotate: 180deg;
8338
- }
8583
+ .sidebar-module-fSa9Q.sidebar-module-AIq0M {
8584
+ --transition-timing-function: ease-in-out;
8339
8585
 
8340
- @container sticky-column scroll-state(stuck: inline-start) {
8586
+ position: fixed;
8587
+ z-index: calc(var(--sidebar-layer) + 1);
8588
+ top: 0;
8589
+ left: 0;
8590
+ width: 382px;
8591
+ max-width: 100vw;
8592
+ height: 100%;
8593
+ box-sizing: border-box;
8594
+ padding-top: 46px;
8595
+ padding-bottom: 56px;
8596
+ background: var(--color-white);
8597
+ }
8341
8598
 
8342
- .table-module-k47fT .table-module-dISOo.table-module-PQejy::after {
8343
- opacity: 1
8344
- }
8345
- }
8599
+ .sidebar-module-fSa9Q.sidebar-module-AIq0M.sidebar-module-LEZgg {
8600
+ transition: transform var(--transition-duration)
8601
+ var(--transition-timing-function);
8602
+ }
8346
8603
 
8347
- /* cells */
8604
+ .sidebar-module-fSa9Q.sidebar-module-AIq0M.sidebar-module-lV7wp {
8605
+ box-shadow: var(--box-shadow-heavy);
8606
+ pointer-events: auto;
8607
+ transform: translateX(0);
8608
+ }
8348
8609
 
8349
- .table-module-k47fT .table-module-jRXnY,
8350
- .table-module-k47fT .table-module-wJwSq {
8351
- overflow: hidden;
8352
- box-sizing: border-box;
8353
- padding: var(--cell-padding);
8354
- text-wrap: balance;
8610
+ .sidebar-module-fSa9Q.sidebar-module-AIq0M.sidebar-module-dGDrr {
8611
+ box-shadow: none;
8612
+ pointer-events: none;
8613
+ transform: translateX(-100%);
8355
8614
  }
8356
8615
 
8357
- .table-module-k47fT .table-module-jRXnY.table-module-EWdty, .table-module-k47fT .table-module-wJwSq.table-module-EWdty {
8358
- text-align: start;
8359
- }
8616
+ .sidebar-module-fSa9Q.sidebar-module-AIq0M .sidebar-module-2puGC {
8617
+ position: absolute;
8618
+ z-index: calc(var(--sidebar-layer) + 2);
8619
+ top: 36px;
8620
+ right: 8px;
8621
+ }
8360
8622
 
8361
- .table-module-k47fT .table-module-jRXnY.table-module-yJD74, .table-module-k47fT .table-module-wJwSq.table-module-yJD74 {
8362
- text-align: end;
8623
+ .sidebar-module-fSa9Q.sidebar-module-AIq0M .sidebar-module-2puGC svg {
8624
+ display: block;
8625
+ width: 32px;
8626
+ height: 32px;
8363
8627
  }
8364
8628
 
8365
- .table-module-k47fT .table-module-jRXnY.table-module-XAdfy, .table-module-k47fT .table-module-wJwSq.table-module-XAdfy {
8366
- text-align: center;
8629
+ .sidebar-module-fSa9Q.sidebar-module-AIq0M .sidebar-module-2puGC button {
8630
+ -webkit-tap-highlight-color: transparent;
8367
8631
  }
8368
8632
 
8369
- .table-module-k47fT .table-module-jRXnY.table-module-h7qdo, .table-module-k47fT .table-module-wJwSq.table-module-h7qdo {
8370
- text-wrap: nowrap;
8633
+ .sidebar-module-fSa9Q.sidebar-module-Scw7D {
8634
+ --transition-timing-function: ease-in-out;
8635
+
8636
+ position: static;
8637
+ z-index: initial;
8638
+ overflow: hidden;
8639
+ width: 0;
8640
+ padding: 0;
8641
+ transform: translateX(0);
8642
+ white-space: nowrap;
8643
+ }
8644
+
8645
+ .sidebar-module-fSa9Q.sidebar-module-Scw7D.sidebar-module-LEZgg {
8646
+ transition:
8647
+ width var(--transition-duration) var(--transition-timing-function),
8648
+ transform var(--transition-duration) var(--transition-timing-function);
8649
+ }
8650
+
8651
+ .sidebar-module-fSa9Q.sidebar-module-Scw7D.sidebar-module-lV7wp {
8652
+ width: 324px;
8653
+ box-shadow: none;
8654
+ }
8655
+
8656
+ .sidebar-module-fSa9Q.sidebar-module-Scw7D.sidebar-module-dGDrr {
8657
+ transform: translateX(0);
8658
+ }
8659
+
8660
+ .sidebar-module-fSa9Q.sidebar-module-Scw7D .sidebar-module-2puGC {
8661
+ display: none;
8662
+ }
8663
+
8664
+ .product-listing-page-module-U0zLZ .product-listing-page-module-9a0ps {
8665
+ margin-bottom: 44px;
8666
+ }
8667
+ .product-listing-page-module-U0zLZ .product-listing-page-module-VvYG3 {
8668
+ margin-bottom: var(--space-24);
8669
+ }
8670
+ .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo {
8671
+ display: grid;
8672
+ gap: var(--space-16);
8673
+ justify-items: center;
8674
+ }
8675
+ .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-qhR-J,
8676
+ .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-3LRKg {
8677
+ width: 100%;
8371
8678
  }
8372
-
8373
- .table-module-k47fT .table-module-jRXnY.table-module-PQejy, .table-module-k47fT .table-module-wJwSq.table-module-PQejy {
8374
- position: sticky;
8375
- z-index: var(--z-sticky);
8376
- inset-inline: 0;
8679
+ .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-qhR-J > *, .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-3LRKg > * {
8680
+ display: flex;
8681
+ width: 100%;
8682
+ justify-content: center;
8683
+ }
8684
+ .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-3Jtw- {
8685
+ order: 2;
8377
8686
  }
8378
-
8379
- /* rows */
8380
-
8381
- .table-module-k47fT .table-module-Nisf1 {
8687
+ .product-listing-page-module-U0zLZ .product-listing-page-module-UwMEE {
8688
+ margin-bottom: var(--space-44);
8689
+ }
8690
+ .product-listing-page-module-U0zLZ .product-listing-page-module-cUe4a {
8382
8691
  display: grid;
8383
- border-block-end: 1px solid var(--border-color);
8384
- grid-column: 1 / -1;
8385
- grid-template-columns: subgrid;
8386
- grid-template-rows: subgrid;
8692
+ grid-template-columns: 1fr;
8387
8693
  }
8388
-
8389
- .table-module-k47fT .table-module-Nisf1 .table-module-jRXnY,
8390
- .table-module-k47fT .table-module-Nisf1 .table-module-wJwSq {
8391
- background-color: var(--bgcolor-odd);
8694
+ .product-listing-page-module-U0zLZ .product-listing-page-module-dtbXB {
8695
+ display: flex;
8696
+ flex-direction: column;
8697
+ }
8698
+ .product-listing-page-module-U0zLZ .product-listing-page-module-zKOQv {
8699
+ margin-top: var(--space-24);
8700
+ grid-column: span 2;
8701
+ }
8702
+ @media (width >= 768px) {
8703
+ .product-listing-page-module-U0zLZ .product-listing-page-module-UwMEE {
8704
+ margin-bottom: var(--space-64);
8392
8705
  }
8393
8706
 
8394
- .table-module-k47fT .table-module-Nisf1:nth-child(even) .table-module-jRXnY,
8395
- .table-module-k47fT .table-module-Nisf1:nth-child(even) .table-module-wJwSq {
8396
- background-color: var(--bgcolor-even);
8397
- }
8707
+ .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo {
8708
+ display: grid;
8709
+ align-items: center;
8710
+ justify-content: space-between;
8711
+ margin-bottom: var(--space-24);
8712
+ grid-template-columns: repeat(3, 1fr);
8713
+ row-gap: var(--space-8);
8714
+ }
8398
8715
 
8399
- :has(.table-module-3zZB6) .table-module-k47fT .table-module-Nisf1::after {
8400
- z-index: var(--z-selected);
8401
- background-blend-mode: multiply;
8402
- background-color: var(--bgcolor-row-highlight);
8403
- content: '';
8404
- grid-column: 1 / -1;
8405
- opacity: 0;
8406
- pointer-events: none;
8716
+ .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-qhR-J,
8717
+ .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-3LRKg {
8718
+ width: initial;
8407
8719
  }
8408
8720
 
8409
- @media (pointer: fine) {
8721
+ .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-qhR-J > *, .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-3LRKg > * {
8722
+ width: initial;
8723
+ }
8410
8724
 
8411
- :has(.table-module-3zZB6) .table-module-k47fT .table-module-Nisf1:hover::after {
8412
- opacity: 1
8725
+ .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-qhR-J {
8726
+ justify-self: flex-start;
8413
8727
  }
8414
- }
8415
8728
 
8416
- .table-module-k47fT .table-module-Nisf1.table-module-WGz-I::after {
8417
- z-index: var(--z-selected);
8418
- background-blend-mode: multiply;
8419
- background-color: var(--bgcolor-row-selected);
8420
- content: '';
8421
- grid-column: 1 / -1;
8422
- opacity: 1;
8423
- pointer-events: none;
8729
+ .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-3LRKg {
8730
+ display: flex;
8731
+ justify-self: flex-end;
8424
8732
  }
8425
8733
 
8426
- .table-module-k47fT .table-module-Nisf1.table-module-qRfjM {
8427
- cursor: pointer;
8734
+ .product-listing-page-module-U0zLZ .product-listing-page-module-jGACo .product-listing-page-module-3Jtw- {
8735
+ order: initial;
8736
+ margin: auto;
8737
+ }
8738
+ }
8739
+ @media (width >= 1440px) {
8740
+ .product-listing-page-module-U0zLZ .product-listing-page-module-cUe4a {
8741
+ grid-template-columns: auto 1fr;
8428
8742
  }
8743
+ }
8429
8744
 
8430
- /* table header */
8431
-
8432
- .table-module-k47fT .table-module-DK-wn {
8745
+ .search-results-page-module-uE5NE .search-results-page-module-grXkv {
8746
+ margin-bottom: 44px;
8747
+ }
8748
+ .search-results-page-module-uE5NE .search-results-page-module--GBRi {
8433
8749
  display: grid;
8434
- grid-column: 1 / -1;
8435
- grid-row: thead;
8436
- grid-template-columns: subgrid;
8750
+ gap: var(--space-16);
8751
+ justify-items: center;
8437
8752
  }
8438
-
8439
- .table-module-k47fT .table-module-DK-wn .table-module-Nisf1 {
8440
- border-block-start: 0;
8753
+ .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-7G8Fo,
8754
+ .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-MzRkN {
8755
+ width: 100%;
8441
8756
  }
8442
-
8443
- .table-module-k47fT .table-module-DK-wn .table-module-Nisf1 .table-module-jRXnY,
8444
- .table-module-k47fT .table-module-DK-wn .table-module-Nisf1 .table-module-wJwSq {
8445
- background-color: var(--bgcolor-even);
8446
- font-weight: var(--font-weight-bold);
8757
+ .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-7G8Fo > *, .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-MzRkN > * {
8758
+ display: flex;
8759
+ width: 100%;
8760
+ justify-content: center;
8447
8761
  }
8448
-
8449
- /* table body */
8450
-
8451
- .table-module-k47fT .table-module-tygZb {
8762
+ .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-rhDU1 {
8763
+ order: 2;
8764
+ }
8765
+ .search-results-page-module-uE5NE .search-results-page-module-uxlXw {
8766
+ margin-bottom: var(--space-44);
8767
+ }
8768
+ .search-results-page-module-uE5NE .search-results-page-module-p6Qod {
8452
8769
  display: grid;
8453
- grid-column: 1 / -1;
8454
- grid-row: tbody;
8455
- grid-template-columns: subgrid;
8770
+ grid-template-columns: 1fr;
8456
8771
  }
8457
-
8458
- /* full width table */
8459
-
8460
- .table-module-k47fT.table-module-YnmWV {
8461
- min-inline-size: 100%;
8772
+ .search-results-page-module-uE5NE .search-results-page-module-7T07c {
8773
+ display: flex;
8774
+ flex-direction: column;
8462
8775
  }
8463
-
8464
- .table-module-k47fT.table-module-YnmWV .table-module-skhNZ {
8465
- text-align: start;
8466
- }
8467
-
8468
- /* no text wrap for entire table */
8469
-
8470
- .table-module-k47fT.table-module-h7qdo .table-module-Nisf1 .table-module-jRXnY,
8471
- .table-module-k47fT.table-module-h7qdo .table-module-Nisf1 .table-module-wJwSq {
8472
- text-wrap: nowrap;
8473
- }
8474
-
8475
- @media (pointer: fine) {
8476
-
8477
- .table-module-k47fT.table-module-JEp5f:has(.table-module-DK-wn th:nth-child(1):hover) .table-module-dISOo:nth-child(1),
8478
- .table-module-k47fT.table-module-JEp5f:has(.table-module-DK-wn th:nth-child(2):hover) .table-module-dISOo:nth-child(2),
8479
- .table-module-k47fT.table-module-JEp5f:has(.table-module-DK-wn th:nth-child(3):hover) .table-module-dISOo:nth-child(3),
8480
- .table-module-k47fT.table-module-JEp5f:has(.table-module-DK-wn th:nth-child(4):hover) .table-module-dISOo:nth-child(4),
8481
- .table-module-k47fT.table-module-JEp5f:has(.table-module-DK-wn th:nth-child(5):hover) .table-module-dISOo:nth-child(5),
8482
- .table-module-k47fT.table-module-JEp5f:has(.table-module-DK-wn th:nth-child(6):hover) .table-module-dISOo:nth-child(6),
8483
- .table-module-k47fT.table-module-JEp5f:has(.table-module-DK-wn th:nth-child(7):hover) .table-module-dISOo:nth-child(7),
8484
- .table-module-k47fT.table-module-JEp5f:has(.table-module-DK-wn th:nth-child(8):hover) .table-module-dISOo:nth-child(8),
8485
- .table-module-k47fT.table-module-JEp5f:has(.table-module-DK-wn th:nth-child(9):hover) .table-module-dISOo:nth-child(9),
8486
- .table-module-k47fT.table-module-JEp5f:has(.table-module-DK-wn th:nth-child(10):hover) .table-module-dISOo:nth-child(10) {
8487
- background-blend-mode: multiply;
8488
- background-color: var(--bgcolor-col-highlight)
8776
+ .search-results-page-module-uE5NE .search-results-page-module-zcJy7 {
8777
+ margin-top: var(--space-24);
8778
+ grid-column: span 2;
8489
8779
  }
8780
+ @media (width >= 768px) {
8781
+ .search-results-page-module-uE5NE .search-results-page-module-uxlXw {
8782
+ margin-bottom: var(--space-64);
8490
8783
  }
8491
8784
 
8492
- /* table sort buttons */
8493
-
8494
- .table-module-RtOV- {
8495
- --icon-space: 24px;
8496
- --icon-size: 12px;
8497
- --icon-rotation: 0deg;
8498
- --icon-visibility: hidden;
8499
-
8500
- all: unset;
8501
- display: grid;
8502
- align-items: baseline;
8503
- padding: var(--cell-padding);
8504
- cursor: pointer;
8505
- grid-template-areas: 'label icon .';
8506
- grid-template-columns: auto var(--icon-space) 1fr;
8507
- inline-size: 100%;
8508
- text-align: start;
8509
- }
8510
-
8511
- .table-module-RtOV- .table-module-ukG8s {
8512
- grid-area: label;
8513
- }
8785
+ .search-results-page-module-uE5NE .search-results-page-module--GBRi {
8786
+ display: grid;
8787
+ align-items: center;
8788
+ justify-content: space-between;
8789
+ margin-bottom: var(--space-24);
8790
+ grid-template-columns: repeat(3, 1fr);
8791
+ row-gap: var(--space-8);
8792
+ }
8514
8793
 
8515
- .table-module-RtOV- .table-module-QdiLJ {
8516
- grid-area: icon;
8517
- justify-self: center;
8518
- rotate: var(--icon-rotation);
8519
- visibility: var(--icon-visibility);
8520
- }
8794
+ .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-7G8Fo,
8795
+ .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-MzRkN {
8796
+ width: initial;
8797
+ }
8521
8798
 
8522
- .table-module-RtOV-.table-module-gWy-a {
8523
- --icon-visibility: visible;
8524
- }
8799
+ .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-7G8Fo > *, .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-MzRkN > * {
8800
+ width: initial;
8801
+ }
8525
8802
 
8526
- .table-module-RtOV-.table-module-SjJ57 {
8527
- --icon-rotation: 0deg;
8528
- }
8803
+ .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-7G8Fo {
8804
+ justify-self: flex-start;
8805
+ }
8529
8806
 
8530
- .table-module-RtOV-.table-module--p8TF {
8531
- --icon-rotation: 180deg;
8532
- }
8807
+ .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-MzRkN {
8808
+ display: flex;
8809
+ justify-self: flex-end;
8810
+ }
8533
8811
 
8534
- .table-module-RtOV-.table-module-XAdfy {
8535
- grid-template-areas: '. . label icon .';
8536
- grid-template-columns: 1fr var(--icon-space) auto var(--icon-space) 1fr;
8537
- text-align: center;
8812
+ .search-results-page-module-uE5NE .search-results-page-module--GBRi .search-results-page-module-rhDU1 {
8813
+ order: initial;
8814
+ margin: auto;
8815
+ }
8538
8816
  }
8539
-
8540
- .table-module-RtOV-.table-module-yJD74 {
8541
- grid-template-areas: '. icon label';
8542
- grid-template-columns: 1fr var(--icon-space) auto;
8543
- text-align: end;
8817
+ @media (width >= 1440px) {
8818
+ .search-results-page-module-uE5NE .search-results-page-module-p6Qod {
8819
+ grid-template-columns: auto 1fr;
8820
+ }
8544
8821
  }
8545
8822
 
8546
- .table-module-DK-wn .table-module-RtOV- {
8547
- margin: calc(var(--cell-padding) * -1);
8548
- }
8549
-
8550
- .truncated-module-bwo1A {
8551
- display: -webkit-box;
8552
- text-wrap: balance;
8823
+ .sidebar-provider-module-rjeCL {
8824
+ --transition-duration: 0;
8553
8825
  }
8554
8826
 
8555
- .truncated-module-bwo1A.truncated-module-JHMUL {
8556
- overflow: hidden;
8557
- -webkit-box-orient: vertical;
8558
- -webkit-line-clamp: var(--lines, 1);
8559
- line-clamp: var(--lines, 1);
8560
- text-overflow: ellipsis;
8827
+ .sidebar-provider-module-rjeCL.sidebar-provider-module-C0cKR {
8828
+ --transition-duration: 0.3s;
8561
8829
  }
8562
8830
 
8563
- .data-table-module-7CcZR {
8564
- display: flex;
8565
- flex-direction: column;
8566
- gap: var(--space-16);
8567
- }
8568
-
8569
8831
  :root {
8570
8832
  --toastify-color-light: #fff;
8571
8833
  --toastify-color-dark: #121212;