/* ══════════════════════════════════════════════════════════════
   ORTAK BEDEN ŞERİDİ (ProductSizeStrip) — ana sayfadaki TÜM ürün
   kartlarında aynı görünüm ve davranış. KANONİK KOPYA:
   src/sub-components/ProductSizeStrip/styles.css
   Build sub-component CSS paketlemediği için kullanan her section
   styles.css dosyasına kopyalanır; değişiklikte hepsini senkron tut.

   FAZ 13: bedenler BAŞLANGIÇTA GİZLİ.
   - Yer .product-size-reveal ile rezerve edilir → kart yüksekliği ve
     ad/fiyat konumu hover'da DEĞİŞMEZ (sıçrama yok).
   - Hover'lı cihaz: kart :hover / :focus-within olduğunda açılır.
     `*:hover > .product-size-reveal` — doğrudan EBEVEYN kart seçicisi;
     kart sınıfı componentten componente değiştiği için tek kural
     dört kart tipinde de çalışır.
   - Dokunmatik cihaz: "Beden Seç" kontrolü ile açılır.
   ══════════════════════════════════════════════════════════════ */

.cc_XcQIJrFooc_LxZmuA6EGr .product-size-reveal, .cc_XcQIJrFooc_T0dzCNT1RF .product-size-reveal, .cc_XcQIJrFooc_RGj2dIXTA6 .product-size-reveal, .cc_XcQIJrFooc_5OTV4s9lpc .product-size-reveal, .cc_XcQIJrFooc_1zyT8KQRyf .product-size-reveal, .cc_XcQIJrFooc_multi_tab_product_slider .product-size-reveal {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.375rem;
  min-height: 2.25rem;
  padding: 0.25rem 1rem 0.875rem;
  box-sizing: border-box;
}

.cc_XcQIJrFooc_LxZmuA6EGr .product-size-strip, .cc_XcQIJrFooc_T0dzCNT1RF .product-size-strip, .cc_XcQIJrFooc_RGj2dIXTA6 .product-size-strip, .cc_XcQIJrFooc_5OTV4s9lpc .product-size-strip, .cc_XcQIJrFooc_1zyT8KQRyf .product-size-strip, .cc_XcQIJrFooc_multi_tab_product_slider .product-size-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.375rem;
  /* Gizli fakat DOM'da: display:none değil → :focus-within açıldığında
     klavye kullanıcısı Tab ile beden butonlarına ulaşabilir. */
  opacity: 0;
  visibility: hidden;
  transform: translateY(4px);
  transition: opacity 180ms ease, transform 180ms ease,
    visibility 0s linear 180ms;
}

/* Hover'lı cihazlar: kartın üzerine gelince / kart içinde odak varken aç */
@media (hover: hover) and (pointer: fine) {
  .cc_XcQIJrFooc_LxZmuA6EGr *:hover > .product-size-reveal > .product-size-strip, .cc_XcQIJrFooc_T0dzCNT1RF *:hover > .product-size-reveal > .product-size-strip, .cc_XcQIJrFooc_RGj2dIXTA6 *:hover > .product-size-reveal > .product-size-strip, .cc_XcQIJrFooc_5OTV4s9lpc *:hover > .product-size-reveal > .product-size-strip, .cc_XcQIJrFooc_1zyT8KQRyf *:hover > .product-size-reveal > .product-size-strip, .cc_XcQIJrFooc_multi_tab_product_slider *:hover > .product-size-reveal > .product-size-strip, .cc_XcQIJrFooc_LxZmuA6EGr *:focus-within > .product-size-reveal > .product-size-strip, .cc_XcQIJrFooc_T0dzCNT1RF *:focus-within > .product-size-reveal > .product-size-strip, .cc_XcQIJrFooc_RGj2dIXTA6 *:focus-within > .product-size-reveal > .product-size-strip, .cc_XcQIJrFooc_5OTV4s9lpc *:focus-within > .product-size-reveal > .product-size-strip, .cc_XcQIJrFooc_1zyT8KQRyf *:focus-within > .product-size-reveal > .product-size-strip, .cc_XcQIJrFooc_multi_tab_product_slider *:focus-within > .product-size-reveal > .product-size-strip, .cc_XcQIJrFooc_LxZmuA6EGr .product-size-reveal:focus-within > .product-size-strip, .cc_XcQIJrFooc_T0dzCNT1RF .product-size-reveal:focus-within > .product-size-strip, .cc_XcQIJrFooc_RGj2dIXTA6 .product-size-reveal:focus-within > .product-size-strip, .cc_XcQIJrFooc_5OTV4s9lpc .product-size-reveal:focus-within > .product-size-strip, .cc_XcQIJrFooc_1zyT8KQRyf .product-size-reveal:focus-within > .product-size-strip, .cc_XcQIJrFooc_multi_tab_product_slider .product-size-reveal:focus-within > .product-size-strip {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition: opacity 180ms ease, transform 180ms ease,
      visibility 0s linear 0s;
  }
}

/* "Beden Seç" kontrolü — YALNIZ hover'sız (dokunmatik) cihazlarda */
.cc_XcQIJrFooc_LxZmuA6EGr .product-size-toggle, .cc_XcQIJrFooc_T0dzCNT1RF .product-size-toggle, .cc_XcQIJrFooc_RGj2dIXTA6 .product-size-toggle, .cc_XcQIJrFooc_5OTV4s9lpc .product-size-toggle, .cc_XcQIJrFooc_1zyT8KQRyf .product-size-toggle, .cc_XcQIJrFooc_multi_tab_product_slider .product-size-toggle {
  display: none;
  align-items: center;
  gap: 0.375rem;
  min-height: 44px;
  padding: 0.3125rem 0.625rem;
  border: 1px solid rgba(7, 23, 13, 0.18);
  border-radius: 6px;
  background: var(--card-surface, #ffffff);
  color: var(--card-ink, #1d2721);
  font-family: var(--font-label);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  line-height: 1;
  cursor: pointer;
}

.cc_XcQIJrFooc_LxZmuA6EGr .product-size-toggle:focus-visible, .cc_XcQIJrFooc_T0dzCNT1RF .product-size-toggle:focus-visible, .cc_XcQIJrFooc_RGj2dIXTA6 .product-size-toggle:focus-visible, .cc_XcQIJrFooc_5OTV4s9lpc .product-size-toggle:focus-visible, .cc_XcQIJrFooc_1zyT8KQRyf .product-size-toggle:focus-visible, .cc_XcQIJrFooc_multi_tab_product_slider .product-size-toggle:focus-visible {
  outline: 2px solid var(--color-amed-green, #0a6845);
  outline-offset: 2px;
}

@media (hover: none) {
  .cc_XcQIJrFooc_LxZmuA6EGr .product-size-toggle, .cc_XcQIJrFooc_T0dzCNT1RF .product-size-toggle, .cc_XcQIJrFooc_RGj2dIXTA6 .product-size-toggle, .cc_XcQIJrFooc_5OTV4s9lpc .product-size-toggle, .cc_XcQIJrFooc_1zyT8KQRyf .product-size-toggle, .cc_XcQIJrFooc_multi_tab_product_slider .product-size-toggle {
    display: inline-flex;
  }

  /* Açıkken şerit kontrolün ÜZERİNİ kaplar → kart yüksekliği değişmez */
  .cc_XcQIJrFooc_LxZmuA6EGr .product-size-reveal.is-open > .product-size-strip, .cc_XcQIJrFooc_T0dzCNT1RF .product-size-reveal.is-open > .product-size-strip, .cc_XcQIJrFooc_RGj2dIXTA6 .product-size-reveal.is-open > .product-size-strip, .cc_XcQIJrFooc_5OTV4s9lpc .product-size-reveal.is-open > .product-size-strip, .cc_XcQIJrFooc_1zyT8KQRyf .product-size-reveal.is-open > .product-size-strip, .cc_XcQIJrFooc_multi_tab_product_slider .product-size-reveal.is-open > .product-size-strip {
    position: absolute;
    inset: 0.25rem 1rem 0.875rem;
    align-content: center;
    background: var(--card-surface, #ffffff);
    opacity: 1;
    visibility: visible;
    transform: none;
    transition: opacity 180ms ease, visibility 0s linear 0s;
  }
}

.cc_XcQIJrFooc_LxZmuA6EGr .product-size, .cc_XcQIJrFooc_T0dzCNT1RF .product-size, .cc_XcQIJrFooc_RGj2dIXTA6 .product-size, .cc_XcQIJrFooc_5OTV4s9lpc .product-size, .cc_XcQIJrFooc_1zyT8KQRyf .product-size, .cc_XcQIJrFooc_multi_tab_product_slider .product-size {
  position: relative;
  font-family: var(--font-label);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  line-height: 1;
  padding: 0.3125rem 0.5rem;
  border: 1px solid rgba(7, 23, 13, 0.18);
  border-radius: 6px;
  color: var(--card-ink, #1D2721);
  background: var(--card-surface, #FFFFFF);
  white-space: nowrap;
  cursor: pointer;
  transition: border-color 160ms ease, color 160ms ease;
}

/* Görünmez dokunma alanı — minimum 44px hedef */
.cc_XcQIJrFooc_LxZmuA6EGr .product-size::after, .cc_XcQIJrFooc_T0dzCNT1RF .product-size::after, .cc_XcQIJrFooc_RGj2dIXTA6 .product-size::after, .cc_XcQIJrFooc_5OTV4s9lpc .product-size::after, .cc_XcQIJrFooc_1zyT8KQRyf .product-size::after, .cc_XcQIJrFooc_multi_tab_product_slider .product-size::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 44px;
}

.cc_XcQIJrFooc_LxZmuA6EGr .product-size:hover:not(:disabled), .cc_XcQIJrFooc_T0dzCNT1RF .product-size:hover:not(:disabled), .cc_XcQIJrFooc_RGj2dIXTA6 .product-size:hover:not(:disabled), .cc_XcQIJrFooc_5OTV4s9lpc .product-size:hover:not(:disabled), .cc_XcQIJrFooc_1zyT8KQRyf .product-size:hover:not(:disabled), .cc_XcQIJrFooc_multi_tab_product_slider .product-size:hover:not(:disabled), .cc_XcQIJrFooc_LxZmuA6EGr .product-size:focus-visible, .cc_XcQIJrFooc_T0dzCNT1RF .product-size:focus-visible, .cc_XcQIJrFooc_RGj2dIXTA6 .product-size:focus-visible, .cc_XcQIJrFooc_5OTV4s9lpc .product-size:focus-visible, .cc_XcQIJrFooc_1zyT8KQRyf .product-size:focus-visible, .cc_XcQIJrFooc_multi_tab_product_slider .product-size:focus-visible {
  border-color: var(--color-amed-green, #0A6845);
  color: var(--color-amed-green, #0A6845);
}

.cc_XcQIJrFooc_LxZmuA6EGr .product-size:focus-visible, .cc_XcQIJrFooc_T0dzCNT1RF .product-size:focus-visible, .cc_XcQIJrFooc_RGj2dIXTA6 .product-size:focus-visible, .cc_XcQIJrFooc_5OTV4s9lpc .product-size:focus-visible, .cc_XcQIJrFooc_1zyT8KQRyf .product-size:focus-visible, .cc_XcQIJrFooc_multi_tab_product_slider .product-size:focus-visible {
  outline: 2px solid var(--color-amed-green, #0A6845);
  outline-offset: 2px;
}

/* Stokta olmayan beden: gerçek disabled + üstü çizili + tıklanamaz */
.cc_XcQIJrFooc_LxZmuA6EGr .product-size:disabled, .cc_XcQIJrFooc_T0dzCNT1RF .product-size:disabled, .cc_XcQIJrFooc_RGj2dIXTA6 .product-size:disabled, .cc_XcQIJrFooc_5OTV4s9lpc .product-size:disabled, .cc_XcQIJrFooc_1zyT8KQRyf .product-size:disabled, .cc_XcQIJrFooc_multi_tab_product_slider .product-size:disabled, .cc_XcQIJrFooc_LxZmuA6EGr .product-size.is-oos, .cc_XcQIJrFooc_T0dzCNT1RF .product-size.is-oos, .cc_XcQIJrFooc_RGj2dIXTA6 .product-size.is-oos, .cc_XcQIJrFooc_5OTV4s9lpc .product-size.is-oos, .cc_XcQIJrFooc_1zyT8KQRyf .product-size.is-oos, .cc_XcQIJrFooc_multi_tab_product_slider .product-size.is-oos {
  opacity: 0.4;
  text-decoration: line-through;
  cursor: default;
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .cc_XcQIJrFooc_LxZmuA6EGr .product-size-strip, .cc_XcQIJrFooc_T0dzCNT1RF .product-size-strip, .cc_XcQIJrFooc_RGj2dIXTA6 .product-size-strip, .cc_XcQIJrFooc_5OTV4s9lpc .product-size-strip, .cc_XcQIJrFooc_1zyT8KQRyf .product-size-strip, .cc_XcQIJrFooc_multi_tab_product_slider .product-size-strip {
    transition: none;
  }
}