.cc_2df2d5y5_multi_tab_product_slider .multi-tab-product-slider {
  width: 100%;
  padding: var(--space-xl) 0;
}

@media (min-width: 1024px) {
  .cc_2df2d5y5_multi_tab_product_slider .multi-tab-product-slider {
    padding: var(--space-xl) 0;
  }
}

.cc_2df2d5y5_multi_tab_product_slider .multi-tab-product-slider-inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 clamp(16px, 5vw, 80px);
}

.cc_2df2d5y5_multi_tab_product_slider .mtps-header {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  margin-bottom: var(--space-lg);
}

.cc_2df2d5y5_multi_tab_product_slider .mtps-header.has-tabs {
  align-items: flex-start;
}

@media (min-width: 768px) {
  .cc_2df2d5y5_multi_tab_product_slider .mtps-header {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-lg);
    margin-bottom: var(--space-xl);
  }
}

.cc_2df2d5y5_multi_tab_product_slider .mtps-title {
  font-family: var(--font-display);
  font-size: var(--text-h2);
  font-weight: var(--weight-display);
  line-height: 1.15;
  color: var(--slider-text-color, var(--color-text-primary));
  margin: 0;
  text-wrap: balance;
  letter-spacing: var(--tracking-display);
}

.cc_2df2d5y5_multi_tab_product_slider .mtps-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0;
  font-family: var(--font-label);
  font-size: var(--text-label);
  font-weight: var(--weight-regular);
}

.cc_2df2d5y5_multi_tab_product_slider .mtps-tab-item {
  display: inline-flex;
  align-items: center;
}

.cc_2df2d5y5_multi_tab_product_slider .mtps-tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: none;
  border: none;
  padding: 6px 0;
  cursor: pointer;
  font: inherit;
  color: var(--slider-tab-inactive, var(--color-text-muted));
}

.cc_2df2d5y5_multi_tab_product_slider .mtps-tab.is-active {
  color: var(--slider-tab-active, var(--color-text-primary));
  font-weight: var(--weight-medium);
}

.cc_2df2d5y5_multi_tab_product_slider .mtps-tab-bullet {
  font-size: var(--text-small);
  line-height: 1;
}

.cc_2df2d5y5_multi_tab_product_slider .mtps-tab-sep {
  margin: 0 12px;
  color: var(--slider-tab-inactive, var(--color-text-muted));
}

.cc_2df2d5y5_multi_tab_product_slider .mtps-track-area {
  position: relative;
  width: 100%;
}

@media (prefers-reduced-motion: no-preference) {
  .cc_2df2d5y5_multi_tab_product_slider .mtps-tab {
    transition: color 200ms ease;
  }

  .cc_2df2d5y5_multi_tab_product_slider .mtps-tab:hover {
    color: var(--slider-tab-active, var(--color-text-primary));
  }
}

/* ===== Slider track (sub-component) ===== */

.cc_2df2d5y5_multi_tab_product_slider .product-slider-track-wrapper {
  --track-gap: 12px;
  position: relative;
  width: 100%;
}

@media (min-width: 768px) {
  .cc_2df2d5y5_multi_tab_product_slider .product-slider-track-wrapper {
    --track-gap: var(--space-md);
  }
}

.cc_2df2d5y5_multi_tab_product_slider .product-slider-track {
  display: flex;
  flex-wrap: nowrap;
  gap: var(--track-gap);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding: 6px 0 8px;
}

.cc_2df2d5y5_multi_tab_product_slider .product-slider-track::-webkit-scrollbar {
  display: none;
}

.cc_2df2d5y5_multi_tab_product_slider .product-slider-track > .product-card, .cc_2df2d5y5_multi_tab_product_slider .product-slider-track > .product-slide {
  scroll-snap-align: start;
  flex: 0 0 calc(100% - 24px);
}

/* Phones: two compact cards and a sliver of the third, matching the
   two-column category grid. */
.cc_2df2d5y5_multi_tab_product_slider .product-slider-track > .product-slide {
  flex-basis: calc((100% - var(--track-gap)) / 2.15);
}

@media (min-width: 768px) {
  .cc_2df2d5y5_multi_tab_product_slider .product-slider-track > .product-card, .cc_2df2d5y5_multi_tab_product_slider .product-slider-track > .product-slide {
    flex: 0 0 calc((100% - var(--track-gap) * 1.5) / 2.5);
  }
}

@media (min-width: 1024px) {
  .cc_2df2d5y5_multi_tab_product_slider .product-slider-track > .product-card, .cc_2df2d5y5_multi_tab_product_slider .product-slider-track > .product-slide {
    flex: 0 0 calc(
      (100% - (var(--track-gap) * (var(--products-per-view) - 1))) /
        var(--products-per-view)
    );
  }
}

/* Arrows: translucent "glass" discs centred on the card's height, so they
   float over the row without covering it; they firm up on hover. */
.cc_2df2d5y5_multi_tab_product_slider .product-slider-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 48px;
  height: 48px;
  display: none;
  align-items: center;
  justify-content: center;
  background-color: color-mix(in srgb, var(--color-surface) 55%, transparent);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  border: 1px solid color-mix(in srgb, var(--color-text-primary) 12%, transparent);
  border-radius: var(--radius-circle);
  color: var(--color-text-primary);
  box-shadow: var(--shadow-card);
  cursor: pointer;
  z-index: 2;
  padding: 0;
}

.cc_2df2d5y5_multi_tab_product_slider .product-slider-arrow svg {
  width: 22px;
  height: 22px;
  stroke-width: 2.4;
}

.cc_2df2d5y5_multi_tab_product_slider .product-slider-arrow[aria-hidden="true"] {
  opacity: 0;
  pointer-events: none;
}

.cc_2df2d5y5_multi_tab_product_slider .product-slider-arrow--prev {
  left: -24px;
}

.cc_2df2d5y5_multi_tab_product_slider .product-slider-arrow--next {
  right: -24px;
}

@media (min-width: 768px) {
  .cc_2df2d5y5_multi_tab_product_slider .product-slider-arrow {
    display: flex;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .cc_2df2d5y5_multi_tab_product_slider .product-slider-arrow {
    transition: background-color 200ms ease, transform 200ms ease, opacity 200ms ease;
  }

  .cc_2df2d5y5_multi_tab_product_slider .product-slider-arrow--prev:hover {
    transform: translateY(-50%) translateX(-3px);
  }

  .cc_2df2d5y5_multi_tab_product_slider .product-slider-arrow--next:hover {
    transform: translateY(-50%) translateX(3px);
  }
}

.cc_2df2d5y5_multi_tab_product_slider .product-slider-arrow:hover {
  background-color: color-mix(in srgb, var(--color-surface) 92%, transparent);
  box-shadow: var(--shadow-hover);
}

.cc_2df2d5y5_multi_tab_product_slider .product-slider-arrow:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 3px;
}

/* ===== Product card (sub-component) =====
 * NOTE: Build does not auto-bundle sub-component CSS into parent sections.
 * Manual copy of src/sub-components/ProductCard/styles.css plus
 * src/sub-components/ProductRating/styles.css scoped to .product-card-body.
 * Keep in sync when either changes.
 */

/* ProductCard — the slider card. A white bordered card with the product shown
 * whole (packshot, never cropped), a discount badge top-left and a favourite
 * heart top-right, then brand / name / rating / options, and a price + black
 * pill button anchored to the bottom so every card in a row lines up.
 */

.cc_2df2d5y5_multi_tab_product_slider .product-card {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  flex: 0 0 auto;
  min-width: 0;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-card);
  transition: box-shadow 300ms ease, transform 300ms ease, border-color 300ms ease;
}

@media (hover: hover) {
  .cc_2df2d5y5_multi_tab_product_slider .product-card:hover {
    box-shadow: var(--shadow-hover);
    border-color: transparent;
    transform: translateY(-4px);
  }
}

/* ─── Media ──────────────────────────────────────────────────── */

.cc_2df2d5y5_multi_tab_product_slider .product-card-media {
  position: relative;
  width: 100%;
  overflow: hidden;
  background: var(--color-surface);
}

.cc_2df2d5y5_multi_tab_product_slider .product-card.is-portrait .product-card-media {
  aspect-ratio: 3 / 4;
}

.cc_2df2d5y5_multi_tab_product_slider .product-card.is-square .product-card-media {
  aspect-ratio: 1 / 1;
}

/* cover, so every card shows an identical, edge-to-edge picture whatever
   the source photo's proportions — a landscape shot and a portrait one land
   in the same box instead of one floating inside the other. */
.cc_2df2d5y5_multi_tab_product_slider .product-card-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-image--empty {
  background: linear-gradient(135deg, var(--color-surface-alt), var(--color-border));
}

.cc_2df2d5y5_multi_tab_product_slider .product-card.has-hover-image .product-card-image--primary, .cc_2df2d5y5_multi_tab_product_slider .product-card-image--hover {
  position: absolute;
  inset: 0;
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-image--hover {
  opacity: 0;
  pointer-events: none;
}

/* A real crossfade: the first picture fades OUT as the second fades IN.
   Fading only the second in leaves the first showing through wherever the
   second is smaller or transparent — two photos on top of each other. */
@media (hover: hover) {
  .cc_2df2d5y5_multi_tab_product_slider .product-card.has-hover-image:hover .product-card-image--hover {
    opacity: 1;
  }

  .cc_2df2d5y5_multi_tab_product_slider .product-card.has-hover-image:hover .product-card-image--primary {
    opacity: 0;
  }
}

/* ─── Badge (top-left) ───────────────────────────────────────── */

.cc_2df2d5y5_multi_tab_product_slider .product-card-badge {
  position: absolute;
  top: var(--space-sm);
  left: var(--space-sm);
  z-index: 1;
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  border-radius: var(--radius-pill);
  font-family: var(--font-label);
  font-size: var(--text-label);
  font-weight: var(--weight-heading);
  line-height: 1.4;
  white-space: nowrap;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.16);
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-badge--sale {
  background-color: var(--slider-savings-bg, var(--color-tag));
  color: var(--slider-savings-fg, var(--color-accent-contrast));
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-badge--sold-out {
  background-color: var(--slider-soldout-bg, var(--color-text-primary));
  color: var(--slider-soldout-fg, var(--color-bg));
}

/* ─── Favourite (top-right) ──────────────────────────────────── */

.cc_2df2d5y5_multi_tab_product_slider .product-card-fav {
  position: absolute;
  top: var(--space-sm);
  right: var(--space-sm);
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-circle);
  background: var(--color-surface);
  color: var(--color-text-primary);
  cursor: pointer;
  transition: border-color 200ms ease, color 200ms ease, transform 200ms ease;
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-fav svg {
  width: 18px;
  height: 18px;
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-fav:hover:not(:disabled) {
  border-color: var(--color-text-primary);
  transform: scale(1.06);
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-fav.is-active {
  color: var(--color-error);
  border-color: var(--color-error);
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-fav:disabled {
  cursor: default;
  opacity: 0.6;
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-fav:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

/* ─── Body ───────────────────────────────────────────────────── */

.cc_2df2d5y5_multi_tab_product_slider .product-card-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 6px;
  padding: 12px var(--space-sm) var(--space-sm);
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-brand {
  font-family: var(--font-label);
  font-size: var(--text-label);
  font-weight: var(--weight-heading);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-name {
  font-family: var(--font-body);
  font-size: var(--text-body);
  font-weight: var(--weight-heading);
  line-height: 1.4;
  color: var(--slider-text-color, var(--color-text-primary));
  /* Single line, always — a name that wraps only on some cards throws the
     row out of alignment. */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 6px var(--space-xs);
  min-height: 18px;
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-variants {
  display: inline-flex;
  align-items: center;
  padding: 3px 9px;
  border-radius: var(--radius-pill);
  background: var(--color-surface-alt);
  font-family: var(--font-label);
  font-size: var(--text-label);
  font-weight: var(--weight-heading);
  line-height: 1.3;
  color: var(--color-text-secondary);
  white-space: nowrap;
}

/* ─── Footer: price + button, pinned to the bottom ───────────── */

.cc_2df2d5y5_multi_tab_product_slider .product-card-footer {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: auto;
  padding-top: 10px;
  border-top: 1px solid var(--color-border);
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-price-row {
  display: inline-flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: var(--space-xs);
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-price {
  font-family: var(--font-body);
  font-size: var(--text-body-lg);
  font-weight: var(--weight-heading);
  line-height: 1.3;
  color: var(--slider-text-color, var(--color-text-primary));
  font-variant-numeric: tabular-nums;
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-price--original {
  font-family: var(--font-body);
  font-size: var(--text-small);
  font-weight: var(--weight-regular);
  color: var(--color-text-muted);
  text-decoration: line-through;
  font-variant-numeric: tabular-nums;
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-cart-btn {
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px var(--space-sm);
  border: none;
  border-radius: var(--radius-pill);
  background-color: var(--color-btn);
  color: var(--color-accent-contrast);
  font-family: var(--font-label);
  font-size: var(--text-small);
  font-weight: var(--weight-heading);
  text-align: center;
  cursor: pointer;
  transition: background-color 200ms ease, transform 150ms ease;
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-cart-icon {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-cart-btn:hover:not(:disabled) {
  background-color: var(--slider-accent, var(--color-btn-hover));
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-cart-btn:active:not(:disabled) {
  transform: scale(0.98);
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-cart-btn:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

@media (prefers-reduced-motion: no-preference) {
  /* One rule for both — a later `transition: transform` on its own would
     silently drop the opacity fade and make the swap snap. */
  .cc_2df2d5y5_multi_tab_product_slider .product-card-image {
    transition: opacity 700ms cubic-bezier(0.4, 0, 0.2, 1), transform 400ms ease-out;
  }

  .cc_2df2d5y5_multi_tab_product_slider .product-card:hover .product-card-image {
    transform: scale(1.04);
  }
}

@media (prefers-reduced-motion: reduce) {
  .cc_2df2d5y5_multi_tab_product_slider .product-card, .cc_2df2d5y5_multi_tab_product_slider .product-card-image, .cc_2df2d5y5_multi_tab_product_slider .product-card-fav, .cc_2df2d5y5_multi_tab_product_slider .product-card-cart-btn {
    transition: none;
  }

  .cc_2df2d5y5_multi_tab_product_slider .product-card:hover {
    transform: none;
  }
}

/* ProductRating (sub-component), scoped */
.cc_2df2d5y5_multi_tab_product_slider .product-card-body .rating {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  line-height: 1;
  color: inherit;
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-body .rating-stars {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 2px;
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-body .rating-star {
  position: relative;
  display: inline-block;
  width: 1em;
  height: 1em;
  color: var(--color-border);
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-body .rating-star-bg {
  display: block;
  width: 100%;
  height: 100%;
  fill: currentColor;
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-body .rating-star-fill {
  position: absolute;
  inset: 0 auto 0 0;
  overflow: hidden;
  color: var(--color-rating);
  pointer-events: none;
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-body .rating-star-fg {
  display: block;
  height: 100%;
  width: 1em;
  fill: currentColor;
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-body .rating-value {
  font-family: var(--font-body);
  font-size: 0.875em;
  font-weight: var(--weight-heading);
  color: var(--color-text-primary);
  font-variant-numeric: tabular-nums;
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-body .rating-count {
  font-family: var(--font-body);
  font-size: 0.875em;
  color: var(--color-text-muted);
  white-space: nowrap;
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-body .rating--sm {
  font-size: 14px;
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-body .rating--sm .rating-value, .cc_2df2d5y5_multi_tab_product_slider .product-card-body .rating--sm .rating-count {
  font-size: 12px;
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-body .rating--md {
  font-size: 18px;
}

.cc_2df2d5y5_multi_tab_product_slider .product-card-body .rating--md .rating-value, .cc_2df2d5y5_multi_tab_product_slider .product-card-body .rating--md .rating-count {
  font-size: 14px;
}

/* Section heading block: title with an optional supporting line under it. */

.cc_2df2d5y5_multi_tab_product_slider .mtps-heading {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.cc_2df2d5y5_multi_tab_product_slider .mtps-subtitle {
  margin: 0;
  max-width: 72ch;
  font-family: var(--font-body);
  font-size: var(--text-body);
  font-weight: var(--weight-regular);
  line-height: 1.55;
  color: var(--color-text-secondary);
}

@media (max-width: 767px) {
  .cc_2df2d5y5_multi_tab_product_slider .mtps-subtitle { font-size: var(--text-small); }
}

.cc_2df2d5y5_multi_tab_product_slider .product-slide {
  display: flex;
  min-width: 0;
}

.cc_2df2d5y5_multi_tab_product_slider .product-slide > .pl-card {
  width: 100%;
}

/* ═══════════════════════════════════════════════════════════════
   MultiTabProductSlider sub-components — manual copies
   NOTE: generated by sync-sub-css.py from
   src/sub-components/ProductListCard/styles.css and
   src/sub-components/ProductRating/styles.css (scoped to .pl-card).
   Do not edit below; edit the source files and re-run the sync.
   ═══════════════════════════════════════════════════════════════ */

/* ProductListCard — the category-page grid card. Same language as the slider
 * card (white bordered card, whole packshot, badge + heart on the image,
 * brand / name / rating / options, price + button pinned to the bottom) with
 * a quantity stepper beside the button.
 */

.cc_2df2d5y5_multi_tab_product_slider .pl-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-width: 0;
  text-decoration: none;
  color: inherit;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-card);
  transition: box-shadow 300ms ease, transform 300ms ease, border-color 300ms ease;
}

@media (hover: hover) {
  .cc_2df2d5y5_multi_tab_product_slider .pl-card:hover {
    box-shadow: var(--shadow-hover);
    border-color: transparent;
    transform: translateY(-4px);
  }
}

/* ─── Media ──────────────────────────────────────────────────── */

.cc_2df2d5y5_multi_tab_product_slider .pl-card-media {
  position: relative;
  width: 100%;
  overflow: hidden;
  background: var(--color-surface);
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card.is-portrait .pl-card-media {
  aspect-ratio: 3 / 4;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card.is-square .pl-card-media {
  aspect-ratio: 1 / 1;
}

/* cover, so every card shows an identical, edge-to-edge picture whatever
   the source photo's proportions — a landscape shot and a portrait one land
   in the same box instead of one floating inside the other. */
.cc_2df2d5y5_multi_tab_product_slider .pl-card-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-image--empty {
  background: linear-gradient(135deg, var(--color-surface-alt), var(--color-border));
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card.has-hover-image .pl-card-image--primary, .cc_2df2d5y5_multi_tab_product_slider .pl-card-image--hover {
  position: absolute;
  inset: 0;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-image--hover {
  opacity: 0;
  pointer-events: none;
}

/* A real crossfade: the first picture fades OUT as the second fades IN.
   Fading only the second in leaves the first showing through wherever the
   second is smaller or transparent — two photos on top of each other. */
@media (hover: hover) {
  .cc_2df2d5y5_multi_tab_product_slider .pl-card.has-hover-image:hover .pl-card-image--hover {
    opacity: 1;
  }

  .cc_2df2d5y5_multi_tab_product_slider .pl-card.has-hover-image:hover .pl-card-image--primary {
    opacity: 0;
  }
}

/* ─── Badge (top-left) ───────────────────────────────────────── */

.cc_2df2d5y5_multi_tab_product_slider .pl-card-badge {
  position: absolute;
  top: var(--space-sm);
  left: var(--space-sm);
  z-index: 1;
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  border-radius: var(--radius-pill);
  font-family: var(--font-label);
  font-size: var(--text-label);
  font-weight: var(--weight-heading);
  line-height: 1.4;
  white-space: nowrap;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.16);
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-badge--sale {
  background-color: var(--color-tag);
  color: var(--color-accent-contrast);
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-badge--sold-out {
  background-color: var(--color-text-primary);
  color: var(--color-bg);
}

/* ─── Favourite (top-right) ──────────────────────────────────── */

.cc_2df2d5y5_multi_tab_product_slider .pl-card-fav {
  position: absolute;
  top: var(--space-sm);
  right: var(--space-sm);
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-circle);
  background: var(--color-surface);
  color: var(--color-text-primary);
  cursor: pointer;
  transition: border-color 200ms ease, color 200ms ease, transform 200ms ease;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-fav svg {
  width: 18px;
  height: 18px;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-fav:hover:not(:disabled) {
  border-color: var(--color-text-primary);
  transform: scale(1.06);
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-fav.is-active {
  color: var(--color-error);
  border-color: var(--color-error);
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-fav:disabled {
  cursor: default;
  opacity: 0.6;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-fav:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

/* ─── Body ───────────────────────────────────────────────────── */

.cc_2df2d5y5_multi_tab_product_slider .pl-card-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 6px;
  padding: 12px var(--space-sm) var(--space-sm);
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-brand {
  font-family: var(--font-label);
  font-size: var(--text-label);
  font-weight: var(--weight-heading);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-name {
  font-family: var(--font-body);
  font-size: var(--text-body);
  font-weight: var(--weight-heading);
  line-height: 1.4;
  color: var(--list-text-color, var(--color-text-primary));
  /* Single line, always — a name that wraps only on some cards throws the
     row out of alignment. */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 6px var(--space-xs);
  min-height: 18px;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-variants {
  display: inline-flex;
  align-items: center;
  padding: 3px 9px;
  border-radius: var(--radius-pill);
  background: var(--color-surface-alt);
  font-family: var(--font-label);
  font-size: var(--text-label);
  font-weight: var(--weight-heading);
  line-height: 1.3;
  color: var(--color-text-secondary);
  white-space: nowrap;
}

/* ─── Footer: price + stepper + button, pinned to the bottom ─── */

.cc_2df2d5y5_multi_tab_product_slider .pl-card-footer {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: auto;
  padding-top: 10px;
  border-top: 1px solid var(--color-border);
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-price-row {
  display: inline-flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: var(--space-xs);
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-price {
  font-family: var(--font-body);
  font-size: var(--text-body-lg);
  font-weight: var(--weight-heading);
  line-height: 1.3;
  color: var(--list-text-color, var(--color-text-primary));
  font-variant-numeric: tabular-nums;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-price--original {
  font-family: var(--font-body);
  font-size: var(--text-small);
  font-weight: var(--weight-regular);
  color: var(--color-text-muted);
  text-decoration: line-through;
  font-variant-numeric: tabular-nums;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-cart-row {
  display: flex;
  align-items: stretch;
  gap: 8px;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-qty {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-pill);
  overflow: hidden;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-qty-btn {
  width: 32px;
  align-self: stretch;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  background: var(--color-surface-alt);
  color: var(--color-text-primary);
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  transition: background-color 200ms ease;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-qty-btn:hover:not(:disabled) {
  background: var(--color-border);
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-qty-btn:disabled {
  cursor: not-allowed;
  opacity: 0.4;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-qty-value {
  min-width: 28px;
  padding: 0 4px;
  text-align: center;
  font-family: var(--font-body);
  font-size: var(--text-small);
  font-weight: var(--weight-heading);
  color: var(--color-text-primary);
  font-variant-numeric: tabular-nums;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-cart-btn {
  flex: 1 1 auto;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px var(--space-sm);
  border: none;
  border-radius: var(--radius-pill);
  background-color: var(--color-btn);
  color: var(--color-accent-contrast);
  font-family: var(--font-label);
  font-size: var(--text-small);
  font-weight: var(--weight-heading);
  text-align: center;
  cursor: pointer;
  transition: background-color 200ms ease, transform 150ms ease;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-cart-icon {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-cart-btn:hover:not(:disabled) {
  background-color: var(--list-accent, var(--color-btn-hover));
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-cart-btn:active:not(:disabled) {
  transform: scale(0.98);
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-cart-btn:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

@media (prefers-reduced-motion: no-preference) {
  /* One rule for both — a later `transition: transform` on its own would
     silently drop the opacity fade and make the swap snap. */
  .cc_2df2d5y5_multi_tab_product_slider .pl-card-image {
    transition: opacity 700ms cubic-bezier(0.4, 0, 0.2, 1), transform 400ms ease-out;
  }

  .cc_2df2d5y5_multi_tab_product_slider .pl-card:hover .pl-card-image {
    transform: scale(1.04);
  }
}

@media (prefers-reduced-motion: reduce) {
  .cc_2df2d5y5_multi_tab_product_slider .pl-card, .cc_2df2d5y5_multi_tab_product_slider .pl-card-image, .cc_2df2d5y5_multi_tab_product_slider .pl-card-fav, .cc_2df2d5y5_multi_tab_product_slider .pl-card-cart-btn {
    transition: none;
  }

  .cc_2df2d5y5_multi_tab_product_slider .pl-card:hover {
    transform: none;
  }
}

/* ═══════════════════════════════════════════════════════════════
   Catalog card (marketplace listing style)
   No card chrome: a square grey stage, then the name in
   two weights, a model-code chip, up to four feature lines, the recommended
   price struck through above a large sale price, and two full-width pill
   buttons. Everything below the picture aligns to the picture's edges.
   ═══════════════════════════════════════════════════════════════ */

/* Card: a thin soft frame around the whole product (picture, text, price,
   buttons) with inner padding, so neighbouring products read as separate
   cards. Hover deepens the frame to the accent and lifts it slightly. */
.cc_2df2d5y5_multi_tab_product_slider .pl-card.pl-card--catalog {
  height: 100%;
  padding: 12px;
  /* Soft grey frame (a light tint of the text colour) with the resting card
     shadow, so cards stay distinct without a hard black outline. */
  border: 1px solid color-mix(in srgb, var(--color-text-primary) 16%, var(--color-surface));
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-card);
  background: var(--color-surface);
  overflow: visible;
  transition: border-color 200ms ease, box-shadow 200ms ease, transform 200ms ease;
}

@media (min-width: 1024px) {
  .cc_2df2d5y5_multi_tab_product_slider .pl-card.pl-card--catalog {
    padding: 14px;
  }
}

@media (hover: hover) {
  .cc_2df2d5y5_multi_tab_product_slider .pl-card.pl-card--catalog:hover {
    border-color: var(--color-accent);
    box-shadow: var(--shadow-hover);
    transform: translateY(-3px);
  }

  .cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog:hover .pl-card-name {
    text-decoration: underline;
    text-underline-offset: 4px;
    text-decoration-thickness: 1px;
  }

  .cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog:hover .pl-card-image--primary {
    transform: scale(1.03);
  }
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .pl-card-media, .cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog.is-portrait .pl-card-media, .cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog.is-square .pl-card-media {
  aspect-ratio: 1 / 1;
  border-radius: var(--radius-sm);
  background: var(--color-surface-alt);
}

/* Contain with no inset: the whole product is always visible and it grows
   to the edge of the stage on its longer side — as large as it can be
   without anything being cropped. */
.cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .pl-card-image {
  object-fit: contain;
  padding: 0;
  mix-blend-mode: multiply;
  transition: transform 500ms cubic-bezier(0.2, 0, 0, 1);
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .pl-card-body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  gap: 12px;
  padding: 20px 0 0;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-title {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .pl-card-name {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  font-family: var(--font-display);
  font-size: 19px;
  font-weight: var(--weight-heading);
  line-height: 1.3;
  color: var(--color-text-primary);
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-subname {
  font-family: var(--font-body);
  font-size: 17px;
  font-weight: var(--weight-regular);
  line-height: 1.35;
  color: var(--color-text-primary);
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-features {
  margin: 0;
  padding: 0 0 0 20px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.45;
  color: var(--color-text-secondary);
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-features li::marker {
  color: var(--color-text-muted);
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .pl-card-footer {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: auto;
  padding-top: 8px;
  border-top: 0;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-prices {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-rrp {
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.35;
  color: var(--color-text-muted);
  text-decoration-thickness: 1px;
  font-variant-numeric: tabular-nums;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .pl-card-price {
  font-family: var(--font-display);
  font-size: clamp(24px, 2.2vw, 30px);
  font-weight: var(--weight-heading);
  line-height: 1.15;
  letter-spacing: -0.01em;
  color: var(--color-text-primary);
  font-variant-numeric: tabular-nums;
}

/* Two buttons side by side (Dyson style): add-to-cart filled in the MKİO
   green, "view" in a soft grey that turns MKİO blue on hover. Corners are
   only slightly rounded. Phones stack them — the card is too narrow there. */
.cc_2df2d5y5_multi_tab_product_slider .pl-card-actions {
  display: flex;
  flex-direction: row;
  gap: 8px;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .pl-card-cart-btn, .cc_2df2d5y5_multi_tab_product_slider .pl-card-view-btn {
  flex: 1 1 0;
  min-width: 0;
  height: 48px;
  padding: 0 10px;
  border: 0;
  border-radius: var(--radius-sm);
  font-family: var(--font-body);
  font-size: 15px;
  font-weight: var(--weight-heading);
  white-space: nowrap;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .pl-card-cart-btn {
  justify-content: center;
  gap: 8px;
  background: var(--color-buy);
  color: var(--color-accent-contrast);
  transition: background-color 200ms ease;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .pl-card-cart-btn:hover:not(:disabled) {
  background: var(--color-buy-hover);
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .pl-card-cart-icon {
  flex-shrink: 0;
  width: 19px;
  height: 19px;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .pl-card-cart-label {
  overflow: hidden;
  text-overflow: ellipsis;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card-view-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  text-overflow: ellipsis;
  background: var(--color-accent-light);
  color: var(--color-text-primary);
  transition: background-color 200ms ease, color 200ms ease;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .pl-card-view-btn:hover {
  background: var(--color-accent);
  color: var(--color-accent-contrast);
}

/* Phones: two cards to a row, so the card itself gets compact — smaller
   type, lighter spacing, slimmer buttons, and the feature list (which
   would wrap into a column of fragments at this width) is left out. */
@media (max-width: 639px) {
  .cc_2df2d5y5_multi_tab_product_slider .pl-card.pl-card--catalog {
    padding: 8px;
  }

  .cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .pl-card-body {
    gap: 8px;
    padding-top: 12px;
  }

  .cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .pl-card-name {
    font-size: 15px;
  }

  .cc_2df2d5y5_multi_tab_product_slider .pl-card-subname {
    font-size: 13px;
    color: var(--color-text-secondary);
  }

  .cc_2df2d5y5_multi_tab_product_slider .pl-card-features {
    display: none;
  }

  .cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .pl-card-footer {
    gap: 8px;
  }

  .cc_2df2d5y5_multi_tab_product_slider .pl-card-rrp {
    font-size: 11px;
  }

  .cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .pl-card-price {
    font-size: 20px;
  }

  .cc_2df2d5y5_multi_tab_product_slider .pl-card-actions {
    flex-direction: column;
    gap: 6px;
  }

  .cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .pl-card-cart-btn, .cc_2df2d5y5_multi_tab_product_slider .pl-card-view-btn {
    flex: 0 0 auto;
    height: 40px;
    font-size: 14px;
  }

  .cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .pl-card-cart-icon {
    width: 18px;
    height: 18px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cc_2df2d5y5_multi_tab_product_slider .pl-card.pl-card--catalog, .cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .pl-card-image, .cc_2df2d5y5_multi_tab_product_slider .pl-card-view-btn {
    transition: none;
  }

  .cc_2df2d5y5_multi_tab_product_slider .pl-card.pl-card--catalog:hover {
    transform: none;
  }
}

/* Stars sit directly above the price; an unrated product shows five empty
   stars so every card in a row keeps the same rhythm. */
.cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .rating-count {
  color: var(--color-text-muted);
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .rating--empty .rating-star-bg {
  fill: var(--color-border);
}

/* ─── Phones: compact card ───────────────────────────────────────
   Narrow two-up cards: a smaller sale badge that can never run under
   the heart, a smaller heart, smaller stars, and the old price on its
   own line under the price. */
@media (max-width: 639px) {
  .cc_2df2d5y5_multi_tab_product_slider .pl-card-badge {
    top: 8px;
    left: 8px;
    max-width: calc(100% - 52px);
    padding: 4px 8px;
    font-size: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .cc_2df2d5y5_multi_tab_product_slider .pl-card-fav {
    top: 8px;
    right: 8px;
    width: 32px;
    height: 32px;
  }

  .cc_2df2d5y5_multi_tab_product_slider .pl-card-fav svg {
    width: 16px;
    height: 16px;
  }

  .cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .rating {
    font-size: 12px;
    gap: 4px;
  }

  .cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .rating-value, .cc_2df2d5y5_multi_tab_product_slider .pl-card--catalog .rating-count {
    font-size: 11px;
  }

  .cc_2df2d5y5_multi_tab_product_slider .pl-card-prices {
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
  }

  .cc_2df2d5y5_multi_tab_product_slider .pl-card-rrp {
    font-size: 12px;
  }
}

/* ProductRating, scoped */
.cc_2df2d5y5_multi_tab_product_slider .pl-card .rating {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  line-height: 1;
  color: inherit;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card .rating-stars {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 2px;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card .rating-star {
  position: relative;
  display: inline-block;
  width: 1em;
  height: 1em;
  color: var(--color-border);
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card .rating-star-bg {
  display: block;
  width: 100%;
  height: 100%;
  fill: currentColor;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card .rating-star-fill {
  position: absolute;
  inset: 0 auto 0 0;
  overflow: hidden;
  color: var(--color-rating);
  pointer-events: none;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card .rating-star-fg {
  display: block;
  height: 100%;
  width: 1em;
  fill: currentColor;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card .rating-value {
  font-family: var(--font-body);
  font-size: 0.875em;
  font-weight: var(--weight-heading);
  color: var(--color-text-primary);
  font-variant-numeric: tabular-nums;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card .rating-count {
  font-family: var(--font-body);
  font-size: 0.875em;
  color: var(--color-text-muted);
  white-space: nowrap;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card .rating--sm {
  font-size: 14px;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card .rating--sm .rating-value, .cc_2df2d5y5_multi_tab_product_slider .pl-card .rating--sm .rating-count {
  font-size: 12px;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card .rating--md {
  font-size: 18px;
}

.cc_2df2d5y5_multi_tab_product_slider .pl-card .rating--md .rating-value, .cc_2df2d5y5_multi_tab_product_slider .pl-card .rating--md .rating-count {
  font-size: 14px;
}

.cc_2df2d5y5_multi_tab_product_slider .product-slider-track-wrapper {
  --track-gap: 12px;
  position: relative;
  width: 100%;
}

@media (min-width: 768px) {
  .cc_2df2d5y5_multi_tab_product_slider .product-slider-track-wrapper {
    --track-gap: var(--space-md);
  }
}

.cc_2df2d5y5_multi_tab_product_slider .product-slider-track {
  display: flex;
  flex-wrap: nowrap;
  gap: var(--track-gap);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding: 6px 0 8px;
}

.cc_2df2d5y5_multi_tab_product_slider .product-slider-track::-webkit-scrollbar {
  display: none;
}

.cc_2df2d5y5_multi_tab_product_slider .product-slider-track > .product-card {
  scroll-snap-align: start;
  flex: 0 0 calc(100% - 24px);
}

@media (min-width: 768px) {
  .cc_2df2d5y5_multi_tab_product_slider .product-slider-track > .product-card {
    flex: 0 0 calc((100% - var(--track-gap) * 1.5) / 2.5);
  }
}

@media (min-width: 1024px) {
  .cc_2df2d5y5_multi_tab_product_slider .product-slider-track > .product-card {
    flex: 0 0 calc(
      (100% - (var(--track-gap) * (var(--products-per-view) - 1))) /
        var(--products-per-view)
    );
  }
}

/* Arrows: translucent "glass" discs centred on the card's height, so they
   float over the row without covering it; they firm up on hover. */
.cc_2df2d5y5_multi_tab_product_slider .product-slider-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 48px;
  height: 48px;
  display: none;
  align-items: center;
  justify-content: center;
  background-color: color-mix(in srgb, var(--color-surface) 55%, transparent);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  border: 1px solid color-mix(in srgb, var(--color-text-primary) 12%, transparent);
  border-radius: var(--radius-circle);
  color: var(--color-text-primary);
  box-shadow: var(--shadow-card);
  cursor: pointer;
  z-index: 2;
  padding: 0;
}

.cc_2df2d5y5_multi_tab_product_slider .product-slider-arrow svg {
  width: 22px;
  height: 22px;
  stroke-width: 2.4;
}

.cc_2df2d5y5_multi_tab_product_slider .product-slider-arrow[aria-hidden="true"] {
  opacity: 0;
  pointer-events: none;
}

.cc_2df2d5y5_multi_tab_product_slider .product-slider-arrow--prev {
  left: -24px;
}

.cc_2df2d5y5_multi_tab_product_slider .product-slider-arrow--next {
  right: -24px;
}

@media (min-width: 768px) {
  .cc_2df2d5y5_multi_tab_product_slider .product-slider-arrow {
    display: flex;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .cc_2df2d5y5_multi_tab_product_slider .product-slider-arrow {
    transition: background-color 200ms ease, transform 200ms ease, opacity 200ms ease;
  }

  .cc_2df2d5y5_multi_tab_product_slider .product-slider-arrow--prev:hover {
    transform: translateY(-50%) translateX(-3px);
  }

  .cc_2df2d5y5_multi_tab_product_slider .product-slider-arrow--next:hover {
    transform: translateY(-50%) translateX(3px);
  }
}

.cc_2df2d5y5_multi_tab_product_slider .product-slider-arrow:hover {
  background-color: color-mix(in srgb, var(--color-surface) 92%, transparent);
  box-shadow: var(--shadow-hover);
}

.cc_2df2d5y5_multi_tab_product_slider .product-slider-arrow:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 3px;
}