@sonic-equipment/ui 0.0.80 → 0.0.82

package/dist/styles.css

@@ -226,6 +226,7 @@
   --search-input-height: 76px;
 }
 
+/* stylelint-disable no-descending-specificity */
 .link-module-xLqBn {
   all: unset;
   position: relative;
@@ -234,52 +235,43 @@
   cursor: pointer;
   font: inherit;
   gap: var(--space-4);
+  -webkit-tap-highlight-color: transparent;
 }
-
-  .link-module-xLqBn > svg {
+.link-module-xLqBn > svg {
     display: block;
     width: 12px;
     height: 12px;
   }
-
-  .link-module-xLqBn:where(.link-module-bGD6u) {
-    color: var(--color-black);
+.link-module-xLqBn:where([data-disabled]) {
+    cursor: default;
+    opacity: 0.4;
   }
-
-  .link-module-xLqBn:where(.link-module-bGD6u)[data-pressed],
-    .link-module-xLqBn:where(.link-module-bGD6u)[data-hovered] {
-      color: var(--color-brand-red);
+.link-module-xLqBn:where(.link-module-UuCEp) {
+    text-decoration: underline;
+  }
+.link-module-xLqBn:where(.link-module-UuCEp)::after {
+      display: none;
     }
-
-  .link-module-xLqBn:where(.link-module-bGD6u)[data-pressed]::after, .link-module-xLqBn:where(.link-module-bGD6u)[data-hovered]::after {
-        background-color: var(--color-brand-red);
-      }
-
-  .link-module-xLqBn:where(.link-module-v31wH) {
+.link-module-xLqBn:where(.link-module-v31wH) {
     color: var(--color-brand-red);
   }
-
-  .link-module-xLqBn:where(.link-module-v31wH)[data-pressed],
-    .link-module-xLqBn:where(.link-module-v31wH)[data-hovered] {
+.link-module-xLqBn:where(.link-module-v31wH):where(:not([data-disabled]):focus),
+    .link-module-xLqBn:where(.link-module-v31wH):where(:not([data-disabled]):hover) {
       color: var(--color-brand-dark-red);
     }
-
-  .link-module-xLqBn:where(.link-module-v31wH)[data-pressed]::after, .link-module-xLqBn:where(.link-module-v31wH)[data-hovered]::after {
+.link-module-xLqBn:where(.link-module-v31wH):where(:not([data-disabled]):focus)::after, .link-module-xLqBn:where(.link-module-v31wH):where(:not([data-disabled]):hover)::after {
         background-color: var(--color-brand-dark-red);
       }
-
-  .link-module-xLqBn:where([data-disabled]) {
-    cursor: default;
-    opacity: 0.4;
-  }
-
-  .link-module-xLqBn:where(.link-module-UuCEp) {
-    text-decoration: underline;
+.link-module-xLqBn:where(.link-module-bGD6u) {
+    color: var(--color-black);
   }
-
-  .link-module-xLqBn:where(.link-module-UuCEp)::after {
-      display: none;
+.link-module-xLqBn:where(.link-module-bGD6u):where(.link-module-xLqBn:where(.link-module-bGD6u):not([data-disabled]):focus),
+    .link-module-xLqBn:where(.link-module-bGD6u):where(.link-module-xLqBn:where(.link-module-bGD6u):not([data-disabled]):hover) {
+      color: var(--color-brand-red);
     }
+.link-module-xLqBn:where(.link-module-bGD6u):where(.link-module-xLqBn:where(.link-module-bGD6u):not([data-disabled]):focus)::after, .link-module-xLqBn:where(.link-module-bGD6u):where(.link-module-xLqBn:where(.link-module-bGD6u):not([data-disabled]):hover)::after {
+        background-color: var(--color-brand-red);
+      }
 
 .button-module-V4meK {
   all: unset;
@@ -357,7 +349,7 @@
     color: var(--color-brand-white);
   }
 
-.button-module-tmyk8:where(.button-module-vq9GI, .button-module-AjvlY):where([data-focused], .button-module-YzPAr, .button-module--xzsY, .button-module-XMFzj), .button-module-tmyk8:where(.button-module-vq9GI, .button-module-AjvlY):where([data-hovered], .button-module-YzPAr, .button-module--xzsY, .button-module-XMFzj), .button-module-tmyk8:where(.button-module-vq9GI, .button-module-AjvlY):where([data-pressed]) {
+.button-module-tmyk8:where(.button-module-vq9GI, .button-module-AjvlY):where(:focus, .button-module-YzPAr, .button-module--xzsY, .button-module-XMFzj), .button-module-tmyk8:where(.button-module-vq9GI, .button-module-AjvlY):where(:hover, .button-module-YzPAr, .button-module--xzsY, .button-module-XMFzj) {
       background-color: var(--color-brand-dark-red);
     }
 
@@ -365,7 +357,7 @@
     color: var(--color-brand-black);
   }
 
-.button-module-tmyk8:where(.button-module-f4UVe):where([data-focused], .button-module-YzPAr, .button-module--xzsY, .button-module-XMFzj), .button-module-tmyk8:where(.button-module-f4UVe):where([data-hovered], .button-module-YzPAr, .button-module--xzsY, .button-module-XMFzj), .button-module-tmyk8:where(.button-module-f4UVe):where([data-pressed]) {
+.button-module-tmyk8:where(.button-module-f4UVe):where(:focus, .button-module-YzPAr, .button-module--xzsY, .button-module-XMFzj), .button-module-tmyk8:where(.button-module-f4UVe):where(:hover, .button-module-YzPAr, .button-module--xzsY, .button-module-XMFzj) {
       color: var(--color-brand-red);
     }
 
@@ -389,7 +381,7 @@
     color: var(--color-brand-black);
   }
 
-.button-module--1bCH:where(.button-module-vq9GI, .button-module-AjvlY):where([data-focused], .button-module-YzPAr, .button-module--xzsY, .button-module-XMFzj), .button-module--1bCH:where(.button-module-vq9GI, .button-module-AjvlY):where([data-hovered], .button-module-YzPAr, .button-module--xzsY, .button-module-XMFzj), .button-module--1bCH:where(.button-module-vq9GI, .button-module-AjvlY):where([data-pressed]) {
+.button-module--1bCH:where(.button-module-vq9GI, .button-module-AjvlY):where(:focus, .button-module-YzPAr, .button-module--xzsY, .button-module-XMFzj), .button-module--1bCH:where(.button-module-vq9GI, .button-module-AjvlY):where(:hover, .button-module-YzPAr, .button-module--xzsY, .button-module-XMFzj) {
       background-color: var(--color-brand-light-gray);
     }
 
@@ -397,7 +389,7 @@
     color: var(--color-brand-black);
   }
 
-.button-module--1bCH:where(.button-module-f4UVe):where([data-focused], .button-module-YzPAr, .button-module--xzsY, .button-module-XMFzj), .button-module--1bCH:where(.button-module-f4UVe):where([data-hovered], .button-module-YzPAr, .button-module--xzsY, .button-module-XMFzj), .button-module--1bCH:where(.button-module-f4UVe):where([data-pressed]) {
+.button-module--1bCH:where(.button-module-f4UVe):where(:focus, .button-module-YzPAr, .button-module--xzsY, .button-module-XMFzj), .button-module--1bCH:where(.button-module-f4UVe):where(:hover, .button-module-YzPAr, .button-module--xzsY, .button-module-XMFzj) {
       color: var(--color-brand-red);
     }
 
@@ -405,7 +397,7 @@
     border: 1px solid var(--color-brand-medium-gray);
   }
 
-.button-module--1bCH:where(.button-module-vq9GI):where([data-focused], .button-module-YzPAr, .button-module--xzsY, .button-module-XMFzj), .button-module--1bCH:where(.button-module-vq9GI):where([data-hovered], .button-module-YzPAr, .button-module--xzsY, .button-module-XMFzj), .button-module--1bCH:where(.button-module-vq9GI):where([data-pressed]) {
+.button-module--1bCH:where(.button-module-vq9GI):where(:focus, .button-module-YzPAr, .button-module--xzsY, .button-module-XMFzj), .button-module--1bCH:where(.button-module-vq9GI):where(:hover, .button-module-YzPAr, .button-module--xzsY, .button-module-XMFzj) {
       border-color: var(--color-brand-light-gray);
     }
 
@@ -452,10 +444,10 @@
         box-shadow: var(--shadow-focus-outline);
         outline: none;
       }
-.breadcrumb-module-CQGse .breadcrumb-module-hxhDY .breadcrumb-module-fp2Q6[aria-disabled] {
+.breadcrumb-module-CQGse .breadcrumb-module-hxhDY .breadcrumb-module-fp2Q6[data-disabled] {
         cursor: default;
       }
-.breadcrumb-module-CQGse .breadcrumb-module-hxhDY .breadcrumb-module-fp2Q6:not([aria-disabled]):hover {
+.breadcrumb-module-CQGse .breadcrumb-module-hxhDY .breadcrumb-module-fp2Q6:not([data-disabled]):hover {
         color: var(--color-brand-red);
       }
 /* stylelint-disable-next-line no-descending-specificity */
@@ -495,6 +487,8 @@
   min-height: 48px;
   align-items: center;
   justify-content: center;
+  border: none;
+  background-color: transparent;
   cursor: pointer;
   -webkit-tap-highlight-color: transparent;
 }
@@ -868,8 +862,8 @@
 
 .image-module-lg7Kj {
   display: block;
-  max-width: 100%;
-  max-height: 100%;
+  width: 100%;
+  height: 100%;
 }
 
   .image-module-lg7Kj:where(.image-module-KFEgG) {
@@ -892,8 +886,8 @@
 
 .image-module-pNYjR {
   display: block;
-  max-width: 100%;
-  max-height: 100%;
+  width: 100%;
+  height: 100%;
 }
 
 .product-card-module-LepTy {
@@ -1323,6 +1317,34 @@
 
 /* Slide styles end */
 
+.carousel-navigation-button-module-a1-I4 {
+  width: 44px;
+  height: 44px;
+  border: 1px solid currentcolor;
+  border-radius: 100%;
+  background-color: var(--color-brand-white);
+  color: var(--color-brand-medium-gray);
+  cursor: pointer;
+  outline: none;
+  -webkit-tap-highlight-color: transparent;
+  transition: background-color 0.2s ease;
+}
+
+  .carousel-navigation-button-module-a1-I4[data-hovered] {
+    background-color: var(--color-brand-light-gray);
+  }
+
+  .carousel-navigation-button-module-a1-I4[data-disabled],
+  .carousel-navigation-button-module-a1-I4.swiper-button-disabled {
+    color: #bcbcbc66;
+    cursor: default;
+    pointer-events: none;
+  }
+
+  .carousel-navigation-button-module-a1-I4.swiper-button-lock {
+    display: none;
+  }
+
 .carousel-module-ealh- {
   position: relative;
   display: block;
@@ -1389,19 +1411,11 @@
     width: fit-content;
   }
 
-  .carousel-module-ealh- .carousel-module-kcqEE {
-    -webkit-tap-highlight-color: transparent;
-  }
-
-  .carousel-module-ealh- .carousel-module-kcqEE.carousel-module-uCrOA {
-      display: none;
-    }
-
   /* stylelint-disable-next-line no-descending-specificity */
 
   /* stylelint-disable-next-line no-descending-specificity */
 
-  .carousel-module-ealh-:has(.carousel-module-T7bTr .carousel-module-kcqEE:hover) .carousel-module-IftbN::after, .carousel-module-ealh-:has(.carousel-module-34OWD) .carousel-module-IftbN::after {
+  .carousel-module-ealh-:has(.carousel-module-T7bTr:hover) .carousel-module-IftbN::after, .carousel-module-ealh-:has(.carousel-module-34OWD) .carousel-module-IftbN::after {
         opacity: 0;
       }
 
@@ -1409,51 +1423,30 @@
 
   /* stylelint-disable-next-line no-descending-specificity */
 
-  .carousel-module-ealh-:has(.carousel-module-984Rr .carousel-module-kcqEE:hover) .carousel-module-IftbN::before, .carousel-module-ealh-:has(.carousel-module-34OWD) .carousel-module-IftbN::before {
+  .carousel-module-ealh-:has(.carousel-module-984Rr:hover) .carousel-module-IftbN::before, .carousel-module-ealh-:has(.carousel-module-34OWD) .carousel-module-IftbN::before {
         opacity: 0;
       }
 
-  .carousel-module-ealh- .carousel-module-k7Z4S .carousel-module-Hi-0z {
+  .carousel-module-ealh- .carousel-module-k7Z4S .carousel-module-kcqEE {
       position: absolute;
       z-index: var(--carousel-layer);
     }
 
-  .carousel-module-ealh- .carousel-module-k7Z4S .carousel-module-Hi-0z.carousel-module-984Rr {
+  .carousel-module-ealh- .carousel-module-k7Z4S .carousel-module-kcqEE.carousel-module-984Rr {
         left: 0;
         transform: translate(-50%, 0);
       }
 
-  .carousel-module-ealh- .carousel-module-k7Z4S .carousel-module-Hi-0z.carousel-module-T7bTr {
+  .carousel-module-ealh- .carousel-module-k7Z4S .carousel-module-kcqEE.carousel-module-T7bTr {
         right: 0;
         transform: translate(50%, 0);
       }
 
-  .carousel-module-ealh- .carousel-module-k7Z4S .carousel-module-Hi-0z .carousel-module-kcqEE {
-        width: 44px;
-        height: 44px;
-        border: 1px solid currentcolor;
-        border-radius: 100%;
-        background-color: var(--color-brand-white);
-        color: var(--color-brand-medium-gray);
-        cursor: pointer;
-        outline: none;
-        transition: background-color 0.2s ease;
-      }
-
-  .carousel-module-ealh- .carousel-module-k7Z4S .carousel-module-Hi-0z .carousel-module-kcqEE[data-hovered] {
-          background-color: var(--color-brand-light-gray);
-        }
-
-  .carousel-module-ealh- .carousel-module-k7Z4S .carousel-module-Hi-0z .carousel-module-kcqEE[data-disabled] {
-          color: #bcbcbc66;
-          cursor: default;
-        }
-
-  .carousel-module-ealh- .carousel-module-k7Z4S.carousel-module-nL-O8 .carousel-module-Hi-0z {
+  .carousel-module-ealh- .carousel-module-k7Z4S.carousel-module-nL-O8 .carousel-module-kcqEE {
         top: var(--space-24);
       }
 
-  .carousel-module-ealh- .carousel-module-k7Z4S.carousel-module-5SGYn .carousel-module-Hi-0z {
+  .carousel-module-ealh- .carousel-module-k7Z4S.carousel-module-5SGYn .carousel-module-kcqEE {
         top: 50%;
       }
 
@@ -1463,7 +1456,7 @@
       margin-left: -10px;
     }
 
-    .carousel-module-ealh- .carousel-module-Hi-0z {
+    .carousel-module-ealh- .carousel-module-kcqEE {
       display: none;
     }
   }
@@ -2248,8 +2241,12 @@
     animation: modal-module-63Uyl 150ms reverse ease-in;
   }
 
+  .modal-module-rVFJc:has(.modal-module-uwets) {
+    display: contents;
+  }
+
 .modal-module-6vlFt {
-  position: relative;
+  position: absolute;
   z-index: calc(var(--modal-layer) - 1);
   min-width: 300px;
   max-width: 90%;
@@ -2270,6 +2267,32 @@
     animation: modal-module-aPJ7X 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
   }
 
+.modal-module-6vlFt .modal-module-7c3-9 {
+    width: 100%;
+    height: 100%;
+  }
+
+.modal-module-6vlFt:where(.modal-module-uwets) {
+    position: fixed;
+    max-width: 100%;
+    border-radius: 0;
+    inset: 0;
+  }
+
+.modal-module-6vlFt:where(.modal-module-uwets)[data-entering] {
+      animation: modal-module-63Uyl 300ms;
+    }
+
+.modal-module-6vlFt:where(.modal-module-uwets)[data-exiting] {
+      animation: modal-module-63Uyl 300ms reverse;
+    }
+
+.modal-module-6vlFt .modal-module-7zIZE {
+    position: absolute;
+    top: 0;
+    right: 0;
+  }
+
 @keyframes modal-module-63Uyl {
   from {
     opacity: 0;
@@ -2410,6 +2433,93 @@
     }
 }
 
+.pagination-module-pQ-Pu .pagination-module-EnswA {
+    position: relative;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+  .pagination-module-pQ-Pu.pagination-module-4U0M3 {
+    padding: var(--space-4);
+    border-radius: 20px;
+    background-color: rgb(127 127 127 / 50%);
+  }
+
+.pagination-module-E-D6l {
+  display: flex;
+  width: var(--space-16);
+  height: var(--space-16);
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+}
+
+.pagination-module-E-D6l::before {
+    display: block;
+    width: 5px;
+    height: 5px;
+    box-sizing: border-box;
+    padding: 0;
+    border-radius: 50%;
+    margin: 0;
+    background-color: var(--color-brand-black);
+    content: '';
+    opacity: 1;
+    text-indent: -9999px;
+    transition: opacity 0.2s linear;
+  }
+
+.pagination-module-4U0M3 .pagination-module-E-D6l::before {
+      background-color: var(--color-brand-white);
+    }
+
+.pagination-module-E-D6l.active::before {
+    opacity: 0;
+  }
+
+.pagination-module-E-D6l:hover::before {
+      background-color: var(--color-brand-red);
+    }
+
+.pagination-module-rNIvD {
+  position: absolute;
+  left: 0;
+  width: var(--space-16);
+  height: var(--space-16);
+  pointer-events: none;
+  transition: transform 0.2s linear;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+}
+
+.pagination-module-rNIvD::before {
+    all: unset;
+  }
+
+.pagination-module-rNIvD .pagination-module-4--ee {
+    display: block;
+    width: var(--size);
+    height: var(--size);
+    box-sizing: border-box;
+    padding: 0;
+    border: 2px solid var(--color-brand-red);
+    border-radius: 50%;
+    margin: 0;
+    background-color: transparent;
+    content: '';
+    text-indent: -9999px;
+    transition:
+      width 0.2s linear,
+      height 0.2s linear;
+
+    --size: 1px;
+  }
+
+.pagination-module-4U0M3 .pagination-module-rNIvD .pagination-module-4--ee {
+      border-color: var(--color-brand-white);
+    }
+
 :root {
   /*
   --swiper-pagination-color: var(--swiper-theme-color);
@@ -2674,8 +2784,6 @@ button.swiper-pagination-bullet {
   .usp-carousel-module-UCbpX .usp-carousel-module-rtIrb .usp-carousel-module-2fygw .usp-carousel-module-AOJJg .usp-carousel-module--xcF2 {
           margin-top: 0;
           margin-bottom: var(--space-24);
-          font-size: var(--header-font-size);
-          font-weight: var(--font-weight-bold);
           line-height: 1;
         }
 
@@ -2719,16 +2827,94 @@ button.swiper-pagination-bullet {
           }
     }
 
+.product-details-page-layout-module-IQFIn {
+  display: flex;
+  flex-direction: column;
+  padding-top: var(--space-24);
+  margin-bottom: var(--space-64);
+  gap: var(--space-64);
+}
+
+  .product-details-page-layout-module-IQFIn .product-details-page-layout-module--7oUp .product-details-page-layout-module-Efavu {
+      height: 100%;
+      align-self: flex-start;
+      margin-bottom: var(--space-16);
+    }
+
+  .product-details-page-layout-module-IQFIn .product-details-page-layout-module--7oUp .product-details-page-layout-module-Y2490 {
+      position: sticky;
+      top: 0;
+      height: -moz-fit-content;
+      height: fit-content;
+    }
+
+  .product-details-page-layout-module-IQFIn .product-details-page-layout-module-EDW8t,
+  .product-details-page-layout-module-IQFIn .product-details-page-layout-module-GSMls {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: var(--space-24);
+  }
+
+  .product-details-page-layout-module-IQFIn .product-details-page-layout-module-duq6v {
+    position: relative;
+    left: -10px;
+    width: 100dvw;
+  }
+
+  @media (width >= 768px) {
+    .product-details-page-layout-module-IQFIn .product-details-page-layout-module-duq6v {
+      position: relative;
+      left: auto;
+      width: auto;
+    }
+  }
+
+  @media (width >= 1024px) {
+    .product-details-page-layout-module-IQFIn .product-details-page-layout-module--7oUp {
+      display: grid;
+      gap: var(--space-24);
+      grid-template-columns: 396px 1fr;
+    }
+
+      .product-details-page-layout-module-IQFIn .product-details-page-layout-module--7oUp .product-details-page-layout-module-Efavu {
+        margin-bottom: 0;
+      }
+  }
+
+  @media (width >= 1440px) {
+    .product-details-page-layout-module-IQFIn .product-details-page-layout-module--7oUp {
+      gap: var(--space-32);
+      grid-template-columns: 600px 1fr;
+    }
+  }
+
+.blank-page-spacer-module-lXxle {
+  --header-height: var(--header-height-mobile);
+
+  display: grid;
+  width: 100%;
+  height: calc(100dvh - var(--header-height));
+  background-color: var(--color-white);
+  place-items: center;
+}
+
+@media (width >= 1024px) {
+  .blank-page-spacer-module-hbxDP {
+    --header-height: var(--header-height-desktop);
+  }
+}
+
 .images-grid-module-i5868 {
   display: grid;
   gap: var(--space-12);
   grid-template-columns: repeat(2, 1fr);
-  grid-template-rows: repeat(4, 1fr);
 }
 
   .images-grid-module-i5868 .images-grid-module-nY9-n {
     display: flex;
-    aspect-ratio: 1;
+    width: 100%;
+    aspect-ratio: 1 / 1;
     background-color: var(--color-gray-100);
     outline: none;
   }
@@ -2776,82 +2962,125 @@ button.swiper-pagination-bullet {
 }
   }
 
-.product-details-page-layout-module-IQFIn {
-  display: flex;
-  flex-direction: column;
-  padding-top: var(--space-24);
-  margin-bottom: var(--space-64);
-  gap: var(--space-64);
+.image-lightbox-module-9k3oJ {
+  --thumb-size: 80px;
+
+  width: 100%;
+  gap: var(--space-16);
 }
 
-  .product-details-page-layout-module-IQFIn .product-details-page-layout-module--7oUp {
-    display: grid;
-    gap: var(--space-16);
-    grid-template-columns: 1fr;
+  .image-lightbox-module-9k3oJ,
+  .image-lightbox-module-9k3oJ * {
+    box-sizing: border-box;
   }
 
-  .product-details-page-layout-module-IQFIn .product-details-page-layout-module--7oUp .product-details-page-layout-module-Efavu {
-      height: 100%;
-      align-self: flex-start;
+  .image-lightbox-module-9k3oJ .swiper {
+      margin: 0;
     }
 
-  .product-details-page-layout-module-IQFIn .product-details-page-layout-module--7oUp .product-details-page-layout-module-Y2490 {
-      position: sticky;
-      top: 0;
-      height: -moz-fit-content;
-      height: fit-content;
-    }
+  .image-lightbox-module-9k3oJ .image-lightbox-module-K5Gd0 {
+    width: auto;
+  }
 
-  .product-details-page-layout-module-IQFIn .product-details-page-layout-module-EDW8t,
-  .product-details-page-layout-module-IQFIn .product-details-page-layout-module-GSMls {
+  .image-lightbox-module-9k3oJ .image-lightbox-module-UNPOi,
+  .image-lightbox-module-9k3oJ .image-lightbox-module-PUOMT {
     display: flex;
-    flex-direction: column;
-    align-items: center;
-    gap: var(--space-24);
+    background-color: var(--color-brand-light-gray);
   }
 
-  .product-details-page-layout-module-IQFIn .product-details-page-layout-module-duq6v {
-    position: relative;
-    left: -10px;
-    width: 100dvw;
+  .image-lightbox-module-9k3oJ .image-lightbox-module-UNPOi .image-lightbox-module-4RKLg, .image-lightbox-module-9k3oJ .image-lightbox-module-PUOMT .image-lightbox-module-4RKLg {
+      mix-blend-mode: multiply;
+    }
+
+  .image-lightbox-module-9k3oJ .image-lightbox-module-UNPOi {
+    width: 100%;
+    aspect-ratio: 1;
   }
 
-  @media (width >= 768px) {
-    .product-details-page-layout-module-IQFIn .product-details-page-layout-module-duq6v {
-      position: relative;
-      left: auto;
-      width: auto;
-    }
+  .image-lightbox-module-9k3oJ .image-lightbox-module-PUOMT {
+    width: var(--thumb-size);
+    height: var(--thumb-size);
+    border: 2px solid transparent;
+    margin: auto;
+    cursor: pointer;
+    transition: border-color 0.2s ease;
   }
 
-  @media (width >= 1024px) {
-    .product-details-page-layout-module-IQFIn .product-details-page-layout-module--7oUp {
-      gap: var(--space-24);
-      grid-template-columns: 396px 1fr;
+  .image-lightbox-module-9k3oJ .swiper-slide-thumb-active .image-lightbox-module-PUOMT {
+      border: 2px solid var(--color-brand-red);
+      cursor: default;
     }
+
+  .image-lightbox-module-9k3oJ .image-lightbox-module-hAy3O {
+    position: relative;
   }
 
-  @media (width >= 1440px) {
-    .product-details-page-layout-module-IQFIn .product-details-page-layout-module--7oUp {
-      gap: var(--space-32);
-      grid-template-columns: 600px 1fr;
-    }
+  .image-lightbox-module-9k3oJ .image-lightbox-module-nN1Kr {
+    position: absolute;
+    z-index: 1;
+    bottom: 20px;
+    left: 50%;
+    width: -moz-fit-content;
+    width: fit-content;
+    transform: translateX(-50%);
   }
 
-.blank-page-spacer-module-lXxle {
-  --header-height: var(--header-height-mobile);
+  .image-lightbox-module-9k3oJ:where(.image-lightbox-module-1idAN) {
+    display: flex;
+    flex-direction: column-reverse;
+  }
 
-  display: grid;
-  width: 100%;
-  height: calc(100dvh - var(--header-height));
-  background-color: var(--color-white);
-  place-items: center;
-}
+  .image-lightbox-module-9k3oJ:where(.image-lightbox-module-1idAN) .image-lightbox-module-Xbxcn {
+      padding-inline: var(--space-16);
+    }
 
-@media (width >= 1024px) {
-  .blank-page-spacer-module-hbxDP {
-    --header-height: var(--header-height-desktop);
+  .image-lightbox-module-9k3oJ:where(.image-lightbox-module--V8Xo) {
+    display: grid;
+    grid-template-columns: var(--thumb-size) 1fr var(--thumb-size);
   }
+
+  .image-lightbox-module-9k3oJ:where(.image-lightbox-module--V8Xo) .image-lightbox-module-hAy3O {
+      max-width: 640px;
+      justify-self: center;
+    }
+
+  .image-lightbox-module-9k3oJ:where(.image-lightbox-module--V8Xo) .image-lightbox-module-Xbxcn {
+      align-self: center;
+    }
+
+  .image-lightbox-module-9k3oJ:where(.image-lightbox-module--V8Xo) .image-lightbox-module-K5Gd0 {
+      height: auto;
+    }
+
+  .image-lightbox-module-9k3oJ:where(.image-lightbox-module--V8Xo) .image-lightbox-module-RP7KS {
+      position: absolute;
+      z-index: var(--carousel-layer);
+      top: 50%;
+      transform: translateY(-50%);
+    }
+
+  .image-lightbox-module-9k3oJ:where(.image-lightbox-module--V8Xo) .image-lightbox-module-RP7KS.image-lightbox-module-wOPYF {
+        left: -22px;
+      }
+
+  .image-lightbox-module-9k3oJ:where(.image-lightbox-module--V8Xo) .image-lightbox-module-RP7KS.image-lightbox-module-knizp {
+        right: -22px;
+      }
+
+  @media (width >= 1440px) {
+      .image-lightbox-module-9k3oJ:where(.image-lightbox-module--V8Xo) .image-lightbox-module-hAy3O {
+        max-width: 768px;
+      }
+    }
+
+.product-detail-images-module-N3Ms- {
+  display: flex;
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+  align-items: center;
+  justify-content: center;
+  padding: 64px 48px;
 }
 
 .feature-list-module-cxc8U {
@@ -2926,32 +3155,32 @@ button.swiper-pagination-bullet {
     height: 20px;
   }
 
-.product-details-panel-module-qO4Hi {
+.product-details-panel-module-kfhpL {
   display: flex;
   flex-direction: column;
   gap: 24px;
 }
 
-  .product-details-panel-module-qO4Hi .product-details-panel-module-s42w- {
+  .product-details-panel-module-kfhpL .product-details-panel-module--1ODE {
     display: flex;
     flex-direction: column;
     gap: 8px;
   }
 
-  .product-details-panel-module-qO4Hi .product-details-panel-module-5AUJ4 {
+  .product-details-panel-module-kfhpL .product-details-panel-module-CCcmA {
     display: flex;
     width: 100%;
     align-items: flex-end;
     justify-content: space-between;
   }
 
-  .product-details-panel-module-qO4Hi .product-details-panel-module-5AUJ4 .product-details-panel-module-IZCrY {
+  .product-details-panel-module-kfhpL .product-details-panel-module-CCcmA .product-details-panel-module-1vyDM {
       display: flex;
       align-items: center;
-      gap: 8px;
     }
 
-  .product-details-panel-module-qO4Hi .product-details-panel-module-BqSmY {
+  .product-details-panel-module-kfhpL .product-details-panel-module-GfTab {
+    margin-top: var(--space-12);
     color: var(--color-brand-dark-gray);
     font-size: 16px;
     font-stretch: normal;
@@ -2961,7 +3190,12 @@ button.swiper-pagination-bullet {
     line-height: 1.5;
   }
 
-  .product-details-panel-module-qO4Hi .product-details-panel-module-J060x {
+  .product-details-panel-module-kfhpL .product-details-panel-module-GfTab p {
+      margin: 0;
+    }
+
+  .product-details-panel-module-kfhpL .product-details-panel-module-ze0my {
+    margin-top: var(--space-16);
     margin-bottom: var(--space-24);
   }
 
@@ -3125,6 +3359,7 @@ button.swiper-pagination-bullet {
     }
 
 & .promo-card-module-e2oii {
+  position: relative;
   display: block;
   height: 122px;
   outline: none;
@@ -3146,8 +3381,17 @@ button.swiper-pagination-bullet {
       width: 100%;
     }
 
-  & .promo-card-module-e2oii[data-focus-visible] {
-    box-shadow: var(--shadow-focus-outline);
+  & .promo-card-module-e2oii:focus-visible::after {
+    position: absolute;
+    display: block;
+    background-color: transparent;
+    box-shadow: var(--shadow-focus-outline) inset;
+    content: '';
+    inset: 0;
+    pointer-events: none;
+    -webkit-user-select: none;
+       -moz-user-select: none;
+            user-select: none;
   }
 
 @media (width >= 768px) {
@@ -3324,15 +3568,15 @@ button.swiper-pagination-bullet {
       color: var(--color-brand-red);
     }
 
-  .category-card-module-4NUjH[data-pressed] .category-card-module-RxWMW, .category-card-module-4NUjH[data-hovered] .category-card-module-RxWMW, .category-card-module-4NUjH[data-focused] .category-card-module-RxWMW {
+  .category-card-module-4NUjH:hover .category-card-module-RxWMW, .category-card-module-4NUjH:focus .category-card-module-RxWMW {
       scale: 1.15;
     }
 
-  .category-card-module-4NUjH[data-pressed] .category-card-module-LEhh3, .category-card-module-4NUjH[data-hovered] .category-card-module-LEhh3, .category-card-module-4NUjH[data-focused] .category-card-module-LEhh3 {
+  .category-card-module-4NUjH:hover .category-card-module-LEhh3, .category-card-module-4NUjH:focus .category-card-module-LEhh3 {
       color: var(--color-brand-red);
     }
 
-  .category-card-module-4NUjH[data-pressed] .category-card-module-LEhh3, .category-card-module-4NUjH[data-hovered] .category-card-module-LEhh3, .category-card-module-4NUjH[data-focused] .category-card-module-LEhh3, .category-card-module-4NUjH.category-card-module-vJ7vB .category-card-module-LEhh3 {
+  .category-card-module-4NUjH:hover .category-card-module-LEhh3, .category-card-module-4NUjH:focus .category-card-module-LEhh3, .category-card-module-4NUjH.category-card-module-vJ7vB .category-card-module-LEhh3 {
       color: var(--color-brand-red);
     }
 
@@ -3724,10 +3968,14 @@ button.swiper-pagination-bullet {
   .categories-grid-module-C751R .categories-grid-module-7OZS1 {
     position: relative;
     display: grid;
-    padding: var(--space-16);
+    padding: var(--space-16) var(--space-4);
     place-items: center;
   }
 
+  .categories-grid-module-C751R .categories-grid-module-Q7i00 {
+    width: 100%;
+  }
+
 @media (0 <= width < 576px) {
   .categories-grid-module-C751R {
     position: relative;