/* ===== Showcase tab panel (one tab's slider) ===== */
.cc_pxqp5f8i_GKizWDGCYg .fab-cat {
  width: 100%;
  min-width: 0;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-cat[hidden] {
  display: none;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-cat__empty {
  margin: 0;
  padding: var(--space-xl) 0;
  text-align: center;
  font-family: var(--font-body);
  font-size: var(--text-body);
  color: var(--color-text-muted);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-cat__slider {
  position: relative;
}

/* Scroll-snap track — native finger swipe on touch, button-driven on desktop */
.cc_pxqp5f8i_GKizWDGCYg .fab-cat__track {
  display: flex;
  gap: 12px;
  width: 100%;
  overflow-x: auto;
  /* proximity (not mandatory) so the loop's seamless jump never fights snap */
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding-bottom: 4px;
}

/* Scroll progress — thin track under the carousel, ink thumb */
.cc_pxqp5f8i_GKizWDGCYg .fab-cat__progress {
  position: relative;
  height: 3px;
  margin-top: 40px;
  border-radius: var(--radius-pill);
  background: var(--color-border-soft);
  overflow: hidden;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-cat__progress[hidden] {
  display: none;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-cat__progress-thumb {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: calc(var(--fab-progress-size, 0.33) * 100%);
  border-radius: inherit;
  background: var(--color-text);
  transform: translateX(calc(var(--fab-progress-pos, 0) * (1 / var(--fab-progress-size, 0.33) - 1) * 100%));
  transition: transform 120ms linear;
}

@media (max-width: 767px) {
  .cc_pxqp5f8i_GKizWDGCYg .fab-cat__progress {
    margin-top: var(--space-lg);
  }
}

.cc_pxqp5f8i_GKizWDGCYg .fab-cat__track::-webkit-scrollbar {
  display: none;
}

/* Mobile: ~1.4 cards in view so the next one peeks (swipe affordance) */
.cc_pxqp5f8i_GKizWDGCYg .fab-cat__cell {
  flex: 0 0 70%;
  min-width: 0;
  scroll-snap-align: start;
}

/* Arrows — appearance is driven by inherited custom props the section sets
   from its `arrowStyle` prop, so a single rule serves circle/square/minimal. */
.cc_pxqp5f8i_GKizWDGCYg .fab-cat__arrow {
  position: absolute;
  top: calc(37.5% - 19px); /* roughly the vertical middle of the 3:4 image */
  z-index: 3;
  display: none; /* hidden on mobile — swipe instead */
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  color: var(--fab-arrow-color, var(--color-text));
  background: var(--fab-arrow-bg, var(--color-surface));
  border: var(--fab-arrow-border, 1px solid var(--color-border-soft));
  border-radius: var(--fab-arrow-radius, 50%);
  box-shadow: var(--fab-arrow-shadow, none);
  cursor: pointer;
  opacity: 1;
  transition: opacity 200ms ease, background 200ms ease, color 200ms ease,
    box-shadow 200ms ease, transform 200ms ease;
}

/* Crisp, perfectly centred glyph (kills the inline-SVG baseline gap) */
.cc_pxqp5f8i_GKizWDGCYg .fab-cat__arrow svg {
  display: block;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-cat__arrow--left {
  left: -8px;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-cat__arrow--right {
  right: -8px;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-cat__arrow:hover:not(:disabled) {
  background: var(--fab-arrow-hover-bg, var(--color-text));
  color: var(--fab-arrow-hover-color, var(--color-bg));
  box-shadow: var(--fab-arrow-hover-shadow, none);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-cat__arrow:active:not(:disabled) {
  transform: scale(0.94);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-cat__arrow:disabled {
  opacity: 0;
  pointer-events: none;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-cat__arrow:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
}

/* ===== Tablet: ~3 cards in view + arrows (no more giant 1.4-card cells) ===== */
@media (min-width: 768px) {
  .cc_pxqp5f8i_GKizWDGCYg .fab-cat__cell {
    flex: 0 0 calc((100% - 2 * 12px) / 3);
  }

  .cc_pxqp5f8i_GKizWDGCYg .fab-cat__arrow {
    display: inline-flex;
  }
}

/* ===== Desktop ===== */
@media (min-width: 1024px) {
  .cc_pxqp5f8i_GKizWDGCYg .fab-cat__track {
    gap: 24px;
  }

  .cc_pxqp5f8i_GKizWDGCYg .fab-cat__cell {
    /* N columns from the section's productsPerView prop */
    flex-basis: calc(
      (100% - (var(--fab-cols) - 1) * 24px) / var(--fab-cols)
    );
  }

  .cc_pxqp5f8i_GKizWDGCYg .fab-cat__arrow {
    display: inline-flex;
  }

  .cc_pxqp5f8i_GKizWDGCYg .fab-cat__arrow--left {
    left: -20px;
  }

  .cc_pxqp5f8i_GKizWDGCYg .fab-cat__arrow--right {
    right: -20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cc_pxqp5f8i_GKizWDGCYg .fab-cat__track {
    scroll-behavior: auto;
  }
  .cc_pxqp5f8i_GKizWDGCYg .fab-cat__arrow {
    transition: none;
  }
}

/* @card-sync */
/* ===========================================================================
   Product card (.fab-card) — Patimo DS / 07 "Ürün kartı"
   Canonical card skin, shared verbatim by every stylesheet that renders
   ShowcaseProductCard (.fab-card) or CategoryProductCard (.plp-card).
   No shadows: the card separates on its tinted image tile and whitespace.
   =========================================================================== */
.cc_pxqp5f8i_GKizWDGCYg .fab-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
}

/* Positioning context for the quick-add action, which is a SIBLING of the media
   link (not nested inside the <a>, which would hijack taps into navigation). */
.cc_pxqp5f8i_GKizWDGCYg .fab-card__media-wrap {
  position: relative;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__media {
  position: relative;
  display: block;
  aspect-ratio: var(--card-ratio, 4 / 5);
  overflow: hidden;
  border-radius: var(--radius-md);
  background: var(--color-surface-alt);
  text-decoration: none;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: var(--card-fit, cover);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__img--main {
  transition: transform 600ms cubic-bezier(0.2, 0.7, 0.2, 1), opacity 400ms ease;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__img--empty {
  background: var(--color-surface-alt);
}

/* Secondary shot crossfades in on hover */
.cc_pxqp5f8i_GKizWDGCYg .fab-card__img--hover {
  opacity: 0;
  transition: opacity 450ms ease;
}


.cc_pxqp5f8i_GKizWDGCYg .fab-card__media:hover .fab-card__img--hover {
  opacity: 1;
}

/* Badges — stacked chips, top-left of the image */
.cc_pxqp5f8i_GKizWDGCYg .fab-card__badges {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  pointer-events: none;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  border-radius: var(--radius-sm);
  background: var(--color-primary);
  color: var(--color-on-primary);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__badge:not([data-ts]) {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__badge--oos {
  background: var(--color-surface);
  color: var(--color-text);
  box-shadow: inset 0 0 0 1px var(--color-border);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__badge--new {
  background: var(--color-text);
  color: var(--color-bg);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__badge--bestseller {
  background: var(--color-text);
  color: var(--color-bg);
}

/* Favourite — round heart, top-right of the image */
.cc_pxqp5f8i_GKizWDGCYg .fab-card__fav {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 3;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__fav .pd-fav-icon {
  display: inline-grid;
  place-items: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 0;
  border-radius: var(--radius-pill);
  background: var(--cream-50);
  color: var(--color-text);
  cursor: pointer;
  transition: color 160ms ease, transform 160ms ease;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__fav .pd-fav-icon svg {
  width: 18px;
  height: 18px;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__fav .pd-fav-icon:hover {
  transform: scale(1.06);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__fav .pd-fav-icon.is-active {
  color: var(--color-primary);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__fav .pd-fav-icon.is-pending {
  opacity: 0.6;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__fav .pd-fav-icon:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
}

@media (max-width: 767px) {
  .cc_pxqp5f8i_GKizWDGCYg .fab-card__fav {
    top: 8px;
    right: 8px;
  }
  .cc_pxqp5f8i_GKizWDGCYg .fab-card__fav .pd-fav-icon {
    width: 32px;
    height: 32px;
  }
}

/* Quick add — round "+" on the image; the label stays visually hidden (aria-label
   carries it). */
.cc_pxqp5f8i_GKizWDGCYg .fab-card__action {
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 12px;
  z-index: 2;
  display: flex;
  justify-content: flex-end;
  pointer-events: none;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__qa {
  pointer-events: auto;
  display: inline-flex;
  flex-direction: row-reverse;
  align-items: center;
  justify-content: center;
  gap: 0;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: var(--radius-pill);
  background: var(--cream-50);
  color: var(--color-text);
  font-family: var(--font-body);
  cursor: pointer;
  transition: width 260ms cubic-bezier(0.2, 0.7, 0.2, 1), height 260ms ease,
    background 200ms ease, color 200ms ease;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__qa-icon {
  display: inline-flex;
  flex: 0 0 auto;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__qa-label {
  max-width: 0;
  overflow: hidden;
  white-space: nowrap;
  font-size: var(--text-button);
  font-weight: 600;
  letter-spacing: -0.01em;
  opacity: 0;
  transition: opacity 180ms ease;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__qa:hover:not(:disabled) {
  background: var(--color-primary);
  color: var(--color-on-primary);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__qa[data-state="added"] {
  background: var(--color-success);
  color: var(--color-on-success);
}

/* Sold out: nothing to add — the quick-add disappears (design "Tükendi") */
.cc_pxqp5f8i_GKizWDGCYg .fab-card__qa:disabled {
  display: none;
}


/* Body */
.cc_pxqp5f8i_GKizWDGCYg .fab-card__body {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  color: inherit;
  text-decoration: none;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__brand {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
  color: var(--color-text-muted);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__name {
  margin: 0;
  color: var(--color-text);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__name:not([data-ts]) {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  font-family: var(--font-body);
  font-size: var(--card-name-size-m, 15px);
  font-weight: 500;
  line-height: 1.55;
  letter-spacing: var(--ls-body);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__body:hover .fab-card__name {
  color: var(--color-link);
}

/* Rating — gold stars filled to the average over a muted row */
.cc_pxqp5f8i_GKizWDGCYg .fab-card__rating {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__stars {
  position: relative;
  display: inline-flex;
  line-height: 0;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__stars-base, .cc_pxqp5f8i_GKizWDGCYg .fab-card__stars-fill {
  display: inline-flex;
  gap: 2px;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__stars-base {
  color: var(--color-border);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__stars-fill {
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  white-space: nowrap;
  color: var(--color-accent);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__stars svg {
  flex: 0 0 auto;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__rating-text {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
  color: var(--color-text-muted);
}

/* Price — sale price turns bordo next to the struck original */
.cc_pxqp5f8i_GKizWDGCYg .fab-card__price {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 8px;
  margin: 0;
  font-family: var(--font-body);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__price-final {
  color: var(--color-text);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__price-final:not([data-ts]) {
  font-size: var(--card-price-size-m, var(--text-price));
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: var(--ls-body);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__price:has(.fab-card__price-old) .fab-card__price-final {
  color: var(--color-sale);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__price-old {
  color: var(--color-text-muted);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__price-old:not([data-ts]) {
  font-size: 14px;
  line-height: 1.5;
  text-decoration: line-through;
}

@media (min-width: 768px) {
  .cc_pxqp5f8i_GKizWDGCYg .fab-card__name:not([data-ts]) {
    font-size: var(--card-name-size, 16px);
  }
  .cc_pxqp5f8i_GKizWDGCYg .fab-card__price-final:not([data-ts]) {
    font-size: var(--card-price-size, var(--text-price));
  }
}

/* Swatches — always visible (the old colour-count line is retired) */
.cc_pxqp5f8i_GKizWDGCYg .fab-card__meta {
  display: flex;
  min-height: 0;
  padding-top: 4px;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__meta--empty, .cc_pxqp5f8i_GKizWDGCYg .fab-card__colors {
  display: none;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__swatches {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 2px;
  min-width: 0;
  overflow: hidden;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__swatch {
  position: relative;
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  padding: 2px;
  border: 1px solid transparent;
  border-radius: 50%;
  background: none;
  cursor: pointer;
  transition: border-color 160ms ease;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__swatch:hover {
  border-color: var(--color-border);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__swatch.is-active {
  border-color: var(--color-text);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__swatch img, .cc_pxqp5f8i_GKizWDGCYg .fab-card__swatch-color, .cc_pxqp5f8i_GKizWDGCYg .fab-card__swatch-empty {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  box-shadow: inset 0 0 0 1px rgba(28, 27, 27, 0.15);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__swatch-empty {
  background: var(--color-surface-alt);
}

/* Sold-out colour: one diagonal stroke across the chip */
.cc_pxqp5f8i_GKizWDGCYg .fab-card__swatch.is-oos::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 1px;
  right: 1px;
  height: 1.5px;
  background: var(--color-text);
  transform: rotate(-45deg);
  pointer-events: none;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__swatch.is-text {
  width: auto;
  min-width: 28px;
  padding: 0 8px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-pill);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__swatch.is-text.is-active {
  border-color: var(--color-text);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__swatch-text {
  display: inline-block;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  color: var(--color-text);
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__swatch-more {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  height: 28px;
  padding-left: 4px;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 500;
  color: var(--color-text-muted);
  white-space: nowrap;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__swatch-more--mobile, .cc_pxqp5f8i_GKizWDGCYg .fab-card__swatch.is-extra-desktop {
  display: none;
}

/* Visually-hidden keyboard-reachable label */
.cc_pxqp5f8i_GKizWDGCYg .fab-card__view {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.cc_pxqp5f8i_GKizWDGCYg .fab-card__qa:focus-visible, .cc_pxqp5f8i_GKizWDGCYg .fab-card__swatch:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
}

@media (max-width: 767px) {
  .cc_pxqp5f8i_GKizWDGCYg .fab-card {
    gap: 12px;
  }
  .cc_pxqp5f8i_GKizWDGCYg .fab-card__badges {
    top: 8px;
    left: 8px;
  }
  .cc_pxqp5f8i_GKizWDGCYg .fab-card__action {
    left: 8px;
    right: 8px;
    bottom: 8px;
  }
  .cc_pxqp5f8i_GKizWDGCYg .fab-card__qa {
    width: 36px;
    height: 36px;
  }
  .cc_pxqp5f8i_GKizWDGCYg .fab-card__swatch {
    width: 24px;
    height: 24px;
  }
  .cc_pxqp5f8i_GKizWDGCYg .fab-card__swatch-more {
    height: 24px;
  }
  .cc_pxqp5f8i_GKizWDGCYg .fab-card__swatch.is-extra-desktop {
    display: block;
  }
  .cc_pxqp5f8i_GKizWDGCYg .fab-card__swatch.is-extra-mobile, .cc_pxqp5f8i_GKizWDGCYg .fab-card__swatch-more--desktop {
    display: none;
  }
  .cc_pxqp5f8i_GKizWDGCYg .fab-card__swatch-more--mobile {
    display: inline-flex;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cc_pxqp5f8i_GKizWDGCYg .fab-card__img--main, .cc_pxqp5f8i_GKizWDGCYg .fab-card__img--hover, .cc_pxqp5f8i_GKizWDGCYg .fab-card__qa, .cc_pxqp5f8i_GKizWDGCYg .fab-card__qa-label, .cc_pxqp5f8i_GKizWDGCYg .fab-card__swatch {
    transition: none;
  }
  .cc_pxqp5f8i_GKizWDGCYg .fab-card__media:hover .fab-card__img--main {
    transform: none;
  }
}