@charset "utf-8";

@media (max-width: 767.98px) {
  .sq--shop-by-slides.full__width { padding: 0px 32px; }
}

.sq--shop-by-slides .swiper { width: 100%; }

.sq--shop-by-slides .swiper-wrapper { position: relative; }

.sq--shop-by-slides .swiper-wrapper.has-category-item { width: 100%; margin: 0px !important; }

.sq--shop-by-slides .swiper-wrapper.has-device-item { width: fit-content; margin: 0px auto !important; }

.sq--shop-by-slides .sq--slide-item-category { flex: 0 1 auto; display: flex; max-width: 100%; width: 100%; min-width: 200px; }

.sq--shop-by-slides .sq--slide-item-category:not(:last-child) { margin-right: 16px; }

.sq--shop-by-slides .sq--slide-item-category .sq--slide__container { display: flex; justify-content: start; align-items: center; width: 100%; height: 120px; }

.sq--shop-by-slides .sq--slide-item-category, .sq--shop-by-slides .sq--slide__container.has-rounded-corners { border-radius: 16px; overflow: hidden; }

.sq--shop-by-slides .sq--slide__container .sq--slide__category__media { flex: 0 0 auto; width: 40%; height: 100%; order: 12; }

.sq--shop-by-slides .sq--slide__container .sq--category-thumbnail-image { width: 160px; height: 120px; aspect-ratio: 1 / 1; object-fit: cover; position: absolute; left: 50%; transform: translate(-10%); object-position: left top; transition: 0.3s; }

@media screen and (min-width: 768px) {
  .sq--shop-by-slides .sq--slide__container:hover .sq--category-thumbnail-image { transition: 0.3s; transform: translate(-20%); }
}

.sq--shop-by-slides .sq--slide__container .sq--slide__category__content { flex: 0 0 auto; width: 60%; order: 0; display: flex; padding: 24px; }

.sq--shop-by-slides .sq--slide-item-device { flex: 0 1 auto; display: flex; max-width: 100%; width: 180px; }

.sq--shop-by-slides .sq--slide-item-device:not(:last-child) { margin-right: 8px; }

.sq--slide__device__media { display: flex; justify-content: center; align-items: end; }

.sq--device-thumbnail-image { width: auto; height: 120px; transform-origin: center bottom; transition: transform 0.35s; }

.sq--shop-by-slides .sq--slide-item-device:hover .sq--device-thumbnail-image { transition: 0.3s; transform: scale(1.075); }

.sq--shop-by-slides .sq--slide-item-device .sq--slide__container { width: 100%; }

.sq--shop-by-slides .sq--slide__device__content { text-align: center; }

@media (min-width: 768px) {
  .sq--category-title, .sq--device-title { font-family: dm-sans, sans-serif; font-weight: 500; font-style: normal; font-size: 16px; line-height: 130%; letter-spacing: -0.334px; }
  .sq--shop-by-slides .sq--slide-item-device { width: 180px; }
}

@media (max-width: 767.98px) {
  .sq--category-title, .sq--device-title { font-family: dm-sans, sans-serif; font-weight: 500; font-style: normal; font-size: 14px; line-height: 115%; letter-spacing: -0.308px; }
  .sq--shop-by-slides .sq--slide-item-device { width: 130px; }
}

.sq--shop-by-slides div[class^="sq--swiper-navigation-template"] { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; justify-content: space-between; width: 100%; z-index: 10; }

.sq--shop-by-slides .sq--swiper-button-prev, .sq--shop-by-slides .sq--swiper-button-next { width: 60px; height: 60px; padding: 0px 16px; }

.sq--shop-by-slides .sq--swiper-button-prev svg, .sq--shop-by-slides .sq--swiper-button-next svg { width: 100%; height: 100%; }

div[class^="sq--shop-by-slides-pagination-"] { display: flex; align-items: center; justify-content: center; width: 100%; z-index: 10; }

div[class^="sq--shop-by-slides-pagination-"] .swiper-pagination-bullet { width: var(--swiper-pagination-bullet-size); height: var(--swiper-pagination-bullet-size); border-radius: 100px; background-color: rgb(99, 99, 100); opacity: 0.5; transition: 0.5s; border: none !important; margin: 0px !important; }

div[class^="sq--shop-by-slides-pagination-"] .swiper-pagination-bullet-active { width: 64px; opacity: 1; border: none !important; background-color: rgb(99, 99, 100) !important; }

div[class^="sq--shop-by-slides-pagination-"] .swiper-pagination-bullet::after, div[class^="sq--shop-by-slides-pagination-"] .swiper-pagination-bullet::before { content: none; display: none; }

@media screen and (min-width: 768px) {
  div[class^="sq--shop-by-slides-pagination-"] { --swiper-pagination-bullet-size: 18px; }
  div[class^="sq--shop-by-slides-pagination-"] .swiper-pagination-bullet-active { width: 64px; }
  div[class^="sq--shop-by-slides-pagination-"] { gap: var(--swiper-pagination-bullet-size); padding: 40px 16px; }
}

@media screen and (max-width: 767.98px) {
  div[class^="sq--shop-by-slides-pagination-"] { --swiper-pagination-bullet-size: 12px; }
  div[class^="sq--shop-by-slides-pagination-"] .swiper-pagination-bullet-active { width: 32px; }
  div[class^="sq--shop-by-slides-pagination-"] { gap: calc(var(--swiper-pagination-bullet-size)/2); padding: 32px 8px; }
}