/**
 * PDP — Mango tarzı özet sütunu, varyasyonlar, CTA (EKLE + kalp).
 * Kapsam: body.single-product .pc-pdp (woocommerce/single-product.php main.pc-pdp)
 */

:root{
  /* Mango: PDP product wrapper artık merkezlemeden tam genişliği kullanıyor;
   * galeri viewport sol kenarına dayanıyor, summary kolonu sağa genişletildi. */
  --pc-pdp-max-width: 100%;
  --pc-pdp-media-col: minmax(0, 1fr);
  /* Mango: summary kolonu enlemesine maksimum genişletildi — EKLE/RENK/BEDEN
   * bloğu sola doğru çok daha geniş yer kaplasın diye min 760px / max 920px. */
  --pc-pdp-summary-col: minmax(760px, 920px);
  --pc-pdp-gap: 0;
  --pc-pdp-summary-pad: clamp(24px, 2.4vw, 44px);
  --pc-pdp-section-gap: 24px;
  --pc-pdp-cta-height: 56px;
  --pc-pdp-wishlist-w: 56px;
  --pc-pdp-gallery-gap: 4px;
  --pc-pdp-color-tone-size: 26px;
  --pc-pdp-text: #111111;
  --pc-pdp-side-pad: 0;
}

body.single-product .pc-pdp{
  padding-top: 0;
  padding-bottom: clamp(32px, 5vw, 64px);
}

/* Mango: galeri viewport SOL KENARINA dayanır; merkezlemeyi tamamen kaldırdık.
 * `.pc-pdp__product` tam genişliği alır, sağ summary kolonu doğal olarak
 * sağ tarafa hizalanır. Sağ tarafta küçük bir nefes payı bırakıyoruz ki
 * favori/sepet kalp slot'u viewport kenarına yapışmasın. */
body.single-product .pc-pdp .pc-pdp__product{
  max-width: 100%;
  margin: 0;
  padding: 0 clamp(0px, 0.6vw, 12px) 0 0;
  box-sizing: border-box;
}

body.single-product .pc-pdp .pc-pdp__grid{
  display: grid;
  grid-template-columns: var(--pc-pdp-media-col) var(--pc-pdp-summary-col);
  gap: var(--pc-pdp-gap);
  align-items: start;
}

body.single-product .pc-pdp .pc-pdp__media{
  padding: 0;
}

/* Mango: galeri media kolonunu doğal olarak doldurur; merkezlemiyoruz, sola
 * dayalı kalır. Çok geniş monitörlerde (≥2200px) görsel hücreleri orantısız
 * büyümesin diye yumuşak bir tavan; bu seviyeye kadar mevcut görsel ölçeği
 * korunur. */
body.single-product .pc-pdp .pc-pdp__media .pc-pdp-gallery-grid{
  max-width: 1320px;
  margin: 0;
}

body.single-product .pc-pdp .pc-pdp__summary{
  padding: 28px var(--pc-pdp-summary-pad) 36px var(--pc-pdp-summary-pad);
}

body.single-product .pc-pdp .pc-pdp__media,
body.single-product .pc-pdp .pc-pdp__summary{
  min-width: 0;
}

body.single-product .pc-pdp .pc-pdp__summary{
  position: sticky;
  top: calc(64px + 18px);
  align-self: start;
}

body.single-product .pc-pdp .pc-pdp__panel{
  box-sizing: border-box;
}

/* WooCommerce'in `woocommerce-layout.css` dosyasındaki
 * `.woocommerce #content div.product div.summary { float:right; width:48%; }`
 * kuralı `#content` ID'si nedeniyle bizim 4-class selektörümüzü yeniyor.
 * Bu yüzden `.summary` PDP içinde sağa float edip ~%48'e büzüşüyor ve
 * başlık/fiyat/EKLE dahil tüm içerik dar bir kolona sıkışıyordu. Aşağıdaki
 * defansif kurallar bu davranışı PunkyCat PDP scope'unda kapatır. */
body.single-product .pc-pdp .pc-pdp__summary .summary,
body.single-product .pc-pdp .pc-pdp__summary div.summary,
body.single-product.woocommerce #content div.product div.summary,
body.single-product.woocommerce div.product div.summary,
body.single-product.woocommerce-page #content div.product div.summary,
body.single-product.woocommerce-page div.product div.summary{
  float: none !important;
  clear: both !important;
  margin: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body.single-product .pc-pdp .pc-pdp__header{
  display: grid;
  gap: 8px;
}

body.single-product .pc-pdp .pc-pdp__summary .product_title{
  margin: 0;
  font-size: clamp(1.05rem, 1.25vw, 1.25rem);
  line-height: 1.18;
  letter-spacing: 0.02em;
  font-weight: 700;
  text-transform: uppercase;
}

body.single-product .pc-pdp .pc-pdp__meta{
  margin-top: 0;
  color: #7a7a7a;
  font-size: 11px;
  line-height: 1.5;
}

body.single-product .pc-pdp .pc-pdp__meta .product_meta{
  display: none;
}

body.single-product .pc-pdp .pc-pdp__price{
  margin-top: 10px;
  padding-top: 0;
  border-top: none;
}

/* Mango: fiyat siyah, regular, küçük. Plugin'deki turuncu !important
 * override'larını yenmek için yüksek özgüllükte selector + bdi hedeflemesi. */
body.single-product .pc-pdp .pc-pdp__price,
body.single-product .pc-pdp .pc-pdp__price .price,
body.single-product .pc-pdp .pc-pdp__price .amount,
body.single-product .pc-pdp .pc-pdp__price .woocommerce-Price-amount,
body.single-product .pc-pdp .pc-pdp__price .woocommerce-Price-amount.amount,
body.single-product .pc-pdp .pc-pdp__price .price bdi,
body.single-product .pc-pdp .pc-pdp__price .price ins .woocommerce-Price-amount,
body.single-product .pc-pdp .pc-pdp__price .price ins bdi,
body.single-product .pc-pdp .pc-pdp__price .punkycat-price-plain,
body.single-product .pc-pdp .pc-pdp__price .punkycat-price-box,
body.single-product .pc-pdp .pc-pdp__price .punkycat-price-box ins .woocommerce-Price-amount,
body.single-product .pc-pdp .pc-pdp__price .punkycat-price-box ins bdi,
body.single-product .pc-pdp .summary .price,
body.single-product .pc-pdp .summary .price bdi,
body.single-product .pc-pdp .summary .woocommerce-Price-amount,
body.single-product .pc-pdp .summary .woocommerce-Price-amount bdi{
  color: var(--pc-pdp-text) !important;
  font-size: 0.95rem !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
}

body.single-product .pc-pdp .pc-pdp__price .price del .woocommerce-Price-amount,
body.single-product .pc-pdp .pc-pdp__price .price del bdi,
body.single-product .pc-pdp .pc-pdp__price .punkycat-price-box del .woocommerce-Price-amount,
body.single-product .pc-pdp .pc-pdp__price .punkycat-price-box del bdi{
  color: #999999 !important;
  font-size: 1rem !important;
  font-weight: 400 !important;
  text-decoration: line-through !important;
}

/* Mango: "TL" sembol etiketi rakamlarla aynı boyut/ağırlıkta görünür; bazı
 * yerleştirmelerde kendi içsel `font-size` değeri (rem-based) miras almıyor,
 * bu yüzden açık `1em` ile sabitliyoruz ki hiçbir koşulda rakamdan büyük
 * görünmesin. */
body.single-product .pc-pdp .pc-pdp__price .woocommerce-Price-currencySymbol,
body.single-product .pc-pdp .pc-pdp__price .price bdi .woocommerce-Price-currencySymbol,
body.single-product .pc-pdp .summary .price .woocommerce-Price-currencySymbol{
  font-size: 1em !important;
  font-weight: inherit !important;
  color: inherit !important;
  line-height: inherit !important;
  letter-spacing: 0 !important;
  vertical-align: baseline !important;
  margin-left: 2px;
}

body.single-product .pc-pdp .pc-pdp__options{
  margin-top: var(--pc-pdp-section-gap);
  display: grid;
  gap: var(--pc-pdp-section-gap);
}

body.single-product .pc-pdp .pc-pdp__actions{
  margin-top: var(--pc-pdp-section-gap);
  padding-top: 0;
  border-top: none;
}

/* PDP altındaki açıklama / özellikler / değerlendirmeler bloğu: galeri sola
 * dayalı olduğundan, alt bölümü de sola dayalı tutuyoruz; sadece sağa nefes
 * payı bırakıyoruz. */
body.single-product .pc-pdp .pc-pdp__below{
  margin: clamp(40px, 6vw, 72px) 0 0 0;
  padding: 0 clamp(16px, 2vw, 32px);
  max-width: 1280px;
}

/* Woo chrome */
body.single-product .pc-pdp .woocommerce-breadcrumb,
body.single-product .pc-pdp .star-rating,
body.single-product .pc-pdp .woocommerce-review-link,
body.single-product .pc-pdp .product .onsale{
  display: none !important;
}

body.single-product .pc-pdp .single_variation{
  display: none !important;
}

body.single-product .pc-pdp form.cart{
  margin-bottom: 0;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  display: block;
}

/* Defensive: variations_form alt katmanları sumary kolon genişliğine yayılsın
 * (varsayılan <table> shrink-to-fit ve `single_variation_wrap` block stretch
 * davranışları core/woocommerce kombinasyonunda dar görünüme sebep oluyor). */
body.single-product .pc-pdp form.variations_form{
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
}

body.single-product .pc-pdp form.variations_form > table.variations{
  display: table !important;
  width: 100% !important;
  max-width: 100% !important;
  table-layout: fixed;
}

body.single-product .pc-pdp form.variations_form > .single_variation_wrap,
body.single-product .pc-pdp .single_variation_wrap{
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
}

body.single-product .pc-pdp form.cart .quantity{
  display: none !important;
}

body.single-product .pc-pdp form.cart:not(.variations_form):has(.pc-pdp-wishlist){
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--pc-pdp-wishlist-w);
  grid-template-areas: "pc-cta pc-wish";
  align-items: stretch;
  column-gap: 1px;
  direction: ltr;
}

body.single-product .pc-pdp form.cart:not(.variations_form):has(.pc-pdp-wishlist) .single_add_to_cart_button{
  grid-area: pc-cta;
}

body.single-product .pc-pdp form.cart:not(.variations_form):has(.pc-pdp-wishlist) .pc-pdp-wishlist{
  grid-area: pc-wish;
}

body.single-product .pc-pdp table.variations{
  margin-bottom: 0;
}

body.single-product .pc-pdp .variations_form .punkycat-buy-now{
  display: none !important;
}

body.single-product .pc-pdp .variations_button,
body.single-product .pc-pdp .woocommerce-variation-add-to-cart.variations_button{
  margin-top: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) var(--pc-pdp-wishlist-w) !important;
  grid-template-areas: "pc-cta pc-wish" !important;
  align-items: stretch !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  column-gap: 1px;
  min-height: var(--pc-pdp-cta-height);
  background: #ffffff;
  direction: ltr;
}

body.single-product .pc-pdp .variations_form .variations_button > *:not(.single_add_to_cart_button):not(input[type="hidden"]):not(.pc-pdp-wishlist){
  display: none !important;
}

body.single-product .pc-pdp .variations_form .variations_button input[type="hidden"]{
  display: none !important;
}

body.single-product .pc-pdp .variations_form .variations_button .single_add_to_cart_button{
  grid-area: pc-cta !important;
  justify-self: stretch;
}

body.single-product .pc-pdp .variations_form .variations_button .pc-pdp-wishlist{
  grid-area: pc-wish !important;
  justify-self: stretch;
}

body.single-product .pc-pdp .variations_form .single_add_to_cart_button{
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: var(--pc-pdp-cta-height) !important;
  padding: 0 18px !important;
  border: none !important;
  border-radius: 0 !important;
  background: #111111 !important;
  color: #ffffff !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  box-shadow: none !important;
  white-space: nowrap;
}

body.single-product .pc-pdp .variations_form .single_add_to_cart_button:hover{
  background: #222222 !important;
}

body.single-product .pc-pdp form.cart:not(.variations_form) .single_add_to_cart_button{
  min-height: var(--pc-pdp-cta-height) !important;
  padding: 0 18px !important;
  border: none !important;
  border-radius: 0 !important;
  background: #111111 !important;
  color: #ffffff !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

body.single-product .pc-pdp .pc-pdp-wishlist{
  box-sizing: border-box;
  width: 100% !important;
  min-width: 0 !important;
  min-height: var(--pc-pdp-cta-height) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  border-radius: 0 !important;
  background: #111111 !important;
  color: #ffffff !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  cursor: default;
}

body.single-product .pc-pdp .pc-pdp-wishlist:hover{
  background: #1a1a1a !important;
}

body.single-product .pc-pdp .pc-pdp-wishlist__icon,
body.single-product .pc-pdp .pc-plp-favorite__icons{
  display: inline-flex;
  position: relative;
  width: 22px;
  height: 22px;
  line-height: 0;
  align-items: center;
  justify-content: center;
}

body.single-product .pc-pdp .pc-plp-favorite__icon{
  display: block;
  width: 100%;
  height: 100%;
}

/* Mango: kalp slot'unda tek ikon. Default olarak outline çizgili kalp;
 * favoriye eklendiğinde dolu kalbe geçer. */
body.single-product .pc-pdp .pc-pdp-wishlist .pc-plp-favorite__icon--line,
body.single-product .pc-pdp .pc-plp-favorite .pc-plp-favorite__icon--line{
  display: block !important;
}
body.single-product .pc-pdp .pc-pdp-wishlist .pc-plp-favorite__icon--fill,
body.single-product .pc-pdp .pc-plp-favorite .pc-plp-favorite__icon--fill{
  display: none !important;
}
body.single-product .pc-pdp .pc-pdp-wishlist[aria-pressed="true"] .pc-plp-favorite__icon--line,
body.single-product .pc-pdp .pc-plp-favorite[aria-pressed="true"] .pc-plp-favorite__icon--line{
  display: none !important;
}
body.single-product .pc-pdp .pc-pdp-wishlist[aria-pressed="true"] .pc-plp-favorite__icon--fill,
body.single-product .pc-pdp .pc-plp-favorite[aria-pressed="true"] .pc-plp-favorite__icon--fill{
  display: block !important;
}
body.single-product .pc-pdp .pc-pdp-wishlist[aria-pressed="true"]{
  color: #ffffff !important;
}
body.single-product .pc-pdp .pc-pdp-wishlist[aria-pressed="true"] .pc-plp-favorite__fill-path{
  fill: #ffffff !important;
}

body.single-product .pc-pdp table.variations tbody,
body.single-product .pc-pdp table.variations tr,
body.single-product .pc-pdp table.variations td,
body.single-product .pc-pdp table.variations th{
  display: block;
  width: 100%;
}

body.single-product .pc-pdp table.variations tr + tr{
  margin-top: var(--pc-pdp-section-gap);
}

body.single-product .pc-pdp table.variations th.label{
  padding: 0 0 8px !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: #111111 !important;
}

body.single-product .pc-pdp table.variations td.value{
  padding: 0 !important;
}

/* Renk */
body.single-product .pc-pdp .punkycat-color-ui{
  margin-top: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 16px;
}

body.single-product .pc-pdp .punkycat-selected-color-display{
  position: static !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  clip: auto !important;
  white-space: normal !important;
  border: 0 !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  letter-spacing: 0.03em !important;
  color: #111111 !important;
  line-height: 1.3 !important;
  order: 2;
  flex: 1 1 auto;
  text-align: right;
}

body.single-product .pc-pdp .punkycat-color-swatches{
  gap: 8px !important;
  align-items: center;
  flex: 0 0 auto;
  order: 1;
  padding-bottom: 2px;
}

body.single-product .pc-pdp .punkycat-color-swatch{
  position: relative;
  width: var(--pc-pdp-color-tone-size) !important;
  height: var(--pc-pdp-color-tone-size) !important;
  padding: 2px !important;
  border: 1px solid transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  overflow: visible;
  cursor: pointer;
  box-sizing: content-box;
  transition: border-color 0.15s ease;
}

body.single-product .pc-pdp .punkycat-color-swatch:hover{
  border-color: rgba(17, 17, 17, 0.35) !important;
}

body.single-product .pc-pdp .punkycat-color-swatch.is-active{
  border-color: #111111 !important;
}

body.single-product .pc-pdp .pc-pdp-color-tone{
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 0;
  border: 1px solid #cfcfcf;
  background: #d7d9de;
  box-sizing: border-box;
}

body.single-product .pc-pdp .pc-sr-only{
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Boyanmamış (palette eşleşmeyen) swatch'larda görsel fallback'i de aynı kareye sıkıştır */
body.single-product .pc-pdp .punkycat-color-swatch__img{
  display: block;
  overflow: hidden;
  width: 100%;
  height: 100%;
  border: 1px solid #cfcfcf;
}

body.single-product .pc-pdp .punkycat-color-swatch__img img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

body.single-product .pc-pdp .punkycat-color-swatch__fallback{
  font-size: 0 !important;
  color: transparent !important;
  background: currentColor;
}

/* Beden listesi + Mango çubuğu */
body.single-product .pc-pdp .punkycat-attr-buttons{
  display: grid !important;
  grid-template-columns: 1fr;
  gap: 0 !important;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.22s ease;
}

body.single-product .pc-pdp .punkycat-attr-buttons.is-open{
  max-height: 360px;
}

body.single-product .pc-pdp .pc-pdp-size-toggle{
  width: 100%;
  min-height: var(--pc-pdp-cta-height);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 2px 0 0;
  margin: 0;
  border: none;
  border-top: 1px solid rgba(17, 17, 17, 0.14);
  border-bottom: 1px solid rgba(17, 17, 17, 0.14);
  background: transparent;
  color: #111111;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-align: left;
  cursor: pointer;
  box-sizing: border-box;
}

body.single-product .pc-pdp .pc-pdp-size-toggle::after{
  content: "";
  width: 7px;
  height: 7px;
  border-right: 1.5px solid #111111;
  border-bottom: 1.5px solid #111111;
  transform: rotate(45deg);
  transition: transform 0.18s ease;
  flex: 0 0 auto;
  margin-top: -3px;
}

body.single-product .pc-pdp .pc-pdp-size-toggle.is-open::after{
  transform: rotate(-135deg);
  margin-top: 2px;
}

body.single-product .pc-pdp .pc-pdp-size-guide{
  margin: 14px 0 0;
  padding: 0;
  text-align: left;
}

body.single-product .pc-pdp .pc-pdp-size-guide a{
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #111111;
  text-decoration: none;
  display: inline-block;
  line-height: 1.35;
}

body.single-product .pc-pdp .pc-pdp-size-guide a:hover{
  text-decoration: underline;
  text-underline-offset: 3px;
}

body.single-product .pc-pdp .punkycat-attr-button{
  min-width: 0 !important;
  padding: 12px 0 !important;
  border: none !important;
  border-bottom: 1px solid rgba(17, 17, 17, 0.08) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #111111 !important;
  text-align: left;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em;
  justify-content: flex-start;
}

body.single-product .pc-pdp .punkycat-attr-button:last-child{
  border-bottom: none !important;
}

body.single-product .pc-pdp .punkycat-attr-button.is-active{
  text-decoration: underline;
  text-underline-offset: 3px;
}

body.single-product .pc-pdp .punkycat-attr-button.is-disabled,
body.single-product .pc-pdp .punkycat-attr-button[aria-disabled="true"]{
  color: #b4b4b4 !important;
  text-decoration: line-through;
}

body.single-product .pc-pdp .reset_variations{
  display: none !important;
}

body.single-product .pc-pdp .summary .button + .button:not(.pc-pdp-wishlist):not(.pc-pdp-look),
body.single-product .pc-pdp .summary .single_add_to_cart_button ~ .button:not(.pc-pdp-wishlist):not(.pc-pdp-look),
body.single-product .pc-pdp .summary .single_add_to_cart_button ~ a.button:not(.pc-pdp-wishlist):not(.pc-pdp-look),
body.single-product .pc-pdp .summary .single_add_to_cart_button ~ button.button:not(.pc-pdp-wishlist):not(.pc-pdp-look),
body.single-product .pc-pdp .summary [class*="look"]:not(.pc-pdp-look){
  display: none !important;
}

/* Galeri — çekirdek WooCommerce slider'ı PHP tarafında zaten kapatıldı; kalan
 * artıkları (eski cache, eklenti çıktıları) gizle. Mango grid'i tek kaynak. */
body.single-product .pc-pdp .woocommerce-product-gallery{
  display: none !important;
}

body.single-product .pc-pdp .flex-control-thumbs,
body.single-product .pc-pdp ol.flex-control-nav,
body.single-product .pc-pdp ol.flex-control-thumbs{
  display: none !important;
}

/* Mango tarzı 2 sütunlu büyük görsel grid'i. */
body.single-product .pc-pdp .pc-pdp-gallery-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--pc-pdp-gallery-gap);
  margin: 0;
  padding: 0;
  width: 100%;
  background: #f6f5f3;
}

body.single-product .pc-pdp .pc-pdp-gallery-grid__item{
  position: relative;
  margin: 0;
  padding: 0;
  background: #f6f5f3;
  overflow: hidden;
  aspect-ratio: 3 / 4;
}

body.single-product .pc-pdp .pc-pdp-gallery-grid__item.is-hidden,
body.single-product .pc-pdp .pc-pdp-gallery-grid__item[hidden]{
  display: none !important;
}

body.single-product .pc-pdp .pc-pdp-gallery-grid__btn{
  position: absolute;
  inset: 0;
  display: block;
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
  cursor: zoom-in;
  appearance: none;
  -webkit-appearance: none;
  width: 100%;
  height: 100%;
}

body.single-product .pc-pdp .pc-pdp-gallery-grid__img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  pointer-events: none;
}

/* Mango'daki sağ üst "+" zoom işareti — sadece hover'da görünür */
body.single-product .pc-pdp .pc-pdp-gallery-grid__hint{
  position: absolute;
  top: 18px;
  right: 18px;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.92);
  color: #111111;
  font-size: 22px;
  font-weight: 300;
  line-height: 1;
  border-radius: 0;
  opacity: 0;
  transform: translateY(-4px);
  transition: opacity 0.18s ease, transform 0.18s ease;
  pointer-events: none;
}

body.single-product .pc-pdp .pc-pdp-gallery-grid__btn:hover .pc-pdp-gallery-grid__hint,
body.single-product .pc-pdp .pc-pdp-gallery-grid__btn:focus-visible .pc-pdp-gallery-grid__hint{
  opacity: 1;
  transform: translateY(0);
}

/* Tek görselli ürünlerde tek sütun yerine sol slotu kapla */
body.single-product .pc-pdp .pc-pdp-gallery-grid:has(.pc-pdp-gallery-grid__item:only-child) .pc-pdp-gallery-grid__item{
  grid-column: 1 / -1;
}

/* Aktif renkte tek görsel kalırsa onu da tek sütuna yay */
body.single-product .pc-pdp .pc-pdp-gallery-grid[data-pc-active-color] .pc-pdp-gallery-grid__item:not(.is-hidden):only-of-type{
  grid-column: 1 / -1;
}

/* CTA: Mango ölçüsünde daha belirgin EKLE butonu + kalp slot'u */
body.single-product .pc-pdp .variations_form .single_add_to_cart_button,
body.single-product .pc-pdp form.cart:not(.variations_form) .single_add_to_cart_button{
  font-size: 13px !important;
  letter-spacing: 0.18em !important;
}

/* Mango EKLE butonu disabled durumda da siyah kalır; tarayıcı disabled
 * görünümünü tamamen geçersiz kıl. Beden seçilmemişken bile hover/odak
 * stili korunur, tıklamayı WooCommerce'in kendi varyasyon mantığı engeller. */
body.single-product .pc-pdp .single_add_to_cart_button,
body.single-product .pc-pdp .single_add_to_cart_button:disabled,
body.single-product .pc-pdp .single_add_to_cart_button[disabled],
body.single-product .pc-pdp .single_add_to_cart_button.disabled,
body.single-product .pc-pdp .single_add_to_cart_button.wc-variation-selection-needed{
  background-color: #111111 !important;
  color: #ffffff !important;
  opacity: 1 !important;
  cursor: pointer !important;
  text-shadow: none !important;
}

body.single-product .pc-pdp .single_add_to_cart_button:hover,
body.single-product .pc-pdp .single_add_to_cart_button:focus-visible{
  background-color: #222222 !important;
}

@media (max-width: 1600px){
  body.single-product .pc-pdp .pc-pdp__grid{
    grid-template-columns: minmax(0, 1fr) minmax(680px, 820px);
    gap: 0;
  }
  body.single-product .pc-pdp .pc-pdp__media .pc-pdp-gallery-grid{
    max-width: none;
  }
}

@media (max-width: 1280px){
  body.single-product .pc-pdp .pc-pdp__grid{
    grid-template-columns: minmax(0, 1fr) minmax(560px, 680px);
  }
}

@media (max-width: 1024px){
  body.single-product .pc-pdp .pc-pdp__grid{
    grid-template-columns: minmax(0, 1fr) minmax(460px, 540px);
  }
}

/* ----- Related Products (PDP altı "Şunlar da hoşunuza gidebilir") -----
 * woocommerce/single-product/related.php override'ı section'a
 * `pc-pdp-related pc-pdp-related--strip pc-archive pc-archive--mango`
 * sınıflarını ekler. Buradaki kurallar SADECE bu scope'ta etkilidir;
 * ana PLP kategori sayfası (.pc-archive page wrapper) etkilenmez.
 *
 * MİMARİ: Cart sayfasındaki "İlgini çekebilir" yatay strip'in PDP
 * versiyonu. 2 sıra × 7 kart (=14 ürün) full-bleed (viewport'tan kenara
 * kadar) bir şerit; sığmayanlar sağ/sol oklarla kaydırılır.
 *
 *   .pc-pdp__below'da max-width: 1280px var ve `.pc-pdp-related--strip`
 *   bunu calc(50% - 50vw) trick'iyle aşarak edge-to-edge görünür hale
 *   gelir. Aynı trick cart.css'te de kullanılıyor.                  */

body.single-product .pc-pdp-related--strip{
  /* Above-section nefes payı, alt boşluk yok (footer'la doğal akış). */
  margin-top: clamp(40px, 6vw, 72px);
  margin-bottom: 0;
  /* Full-bleed: artık `.pc-pdp__below` (max-width 1280px) DIŞINDA
   * basılıyoruz; doğrudan `.pc-pdp__product` çocuğuyuz. Parent'ın tek
   * kısıtı sağdaki ufak nefes padding'i (clamp 0..12px); onu da
   * negatif margin ile iptal ediyoruz. Sol kenar zaten viewport x=0'a
   * dayalı (parent'ta sol padding yok). Sonuç: x=0 → x=100vw arası
   * gerçek viewport-wide şerit. */
  margin-left: 0;
  margin-right: calc(-1 * clamp(0px, 0.6vw, 12px));
  width: 100vw;
  max-width: 100vw;
  padding: 0;
  box-sizing: border-box;
}

/* 100vw güvenliği: ekstrem responsive durumlarda strip'in yatay
 * scroll açmasını engelle. Body düzeyi etkisi sadece PDP scope'unda. */
body.single-product{
  overflow-x: clip;
}

/* `.pc-archive` wrapper'ın PLP kategori sayfasından miras gelen
 * üst/alt/yan padding'lerini bu strip için kapat. */
body.single-product .pc-pdp-related--strip.pc-archive{
  padding: 0;
}

/* Üst başlık + ok navigasyonu çubuğu. */
body.single-product .pc-pdp-related--strip .pc-pdp-related__bar{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 0 0 20px 0;
  padding-left: clamp(16px, 2.4vw, 32px);
  padding-right: clamp(16px, 2.4vw, 32px);
}
body.single-product .pc-pdp-related--strip .pc-pdp-related__title{
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #111111;
  line-height: 1.3;
  margin: 0;
  padding: 0;
}
body.single-product .pc-pdp-related--strip .pc-pdp-related__nav{
  display: flex;
  align-items: center;
  gap: 8px;
  /* JS overflow algıladığında .has-overflow ekler; o ana kadar oklar
   * görsel olarak yer tutmasın. */
  visibility: hidden;
  opacity: 0;
  transition: opacity .18s ease;
}
body.single-product .pc-pdp-related--strip.has-overflow .pc-pdp-related__nav{
  visibility: visible;
  opacity: 1;
}
body.single-product .pc-pdp-related--strip .pc-pdp-related__btn{
  width: 36px;
  height: 36px;
  border-radius: 999px;
  border: 1px solid var(--pc-border);
  background: #fff;
  color: var(--pc-fg, #111);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  cursor: pointer;
  transition: background-color .18s ease, color .18s ease, border-color .18s ease, opacity .18s ease;
}
body.single-product .pc-pdp-related--strip .pc-pdp-related__btn svg{
  width: 14px;
  height: 14px;
  display: block;
}
body.single-product .pc-pdp-related--strip .pc-pdp-related__btn:hover{
  background: var(--pc-fg, #111);
  color: #fff;
  border-color: var(--pc-fg, #111);
}
body.single-product .pc-pdp-related--strip .pc-pdp-related__btn:focus-visible{
  outline: 2px solid var(--pc-fg, #111);
  outline-offset: 2px;
}
body.single-product .pc-pdp-related--strip .pc-pdp-related__btn:disabled{
  opacity: 0.35;
  cursor: default;
  background: #fff;
  color: var(--pc-fg, #111);
  border-color: var(--pc-border);
}

/* Yatay scrollable viewport. */
body.single-product .pc-pdp-related--strip .pc-pdp-related__viewport{
  position: relative;
  overflow: hidden;
  padding-left: clamp(16px, 2.4vw, 32px);
  padding-right: clamp(16px, 2.4vw, 32px);
  box-sizing: border-box;
}

/* 2 SIRALI grid: dikey 2 satır, yatay otomatik kolon. Kartlar üst-alt
 * kolon-kolon dolar (Mango/Zara related strip mantığı). */
body.single-product .pc-pdp-related--strip .pc-pdp-related__track{
  display: grid !important;
  grid-auto-flow: column !important;
  grid-template-rows: repeat(2, auto) !important;
  /* Her kolonun (sıra başına bir kart) ortak genişliği. */
  grid-auto-columns: calc((100% - (12px * 6)) / 7);
  column-gap: 12px;
  row-gap: 18px;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
  scroll-snap-type: x mandatory;
  width: 100%;
  align-items: start;
}
body.single-product .pc-pdp-related--strip .pc-pdp-related__track::-webkit-scrollbar{
  display: none;
}

/* Her kart bir grid hücresi. Eski Woo `column-N` sınıflarından gelen
 * `width:` / `float:` kalıntılarını ezelim, scroll-snap noktası ekleyelim. */
body.single-product .pc-pdp-related--strip .pc-pdp-related__track::before,
body.single-product .pc-pdp-related--strip .pc-pdp-related__track::after{
  content: none !important;
}
body.single-product .pc-pdp-related--strip .pc-pdp-related__track > li.product{
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  max-width: 100%;
  min-width: 0;
  scroll-snap-align: start;
}

/* Breakpoint'lerde sıra başına gösterilen kart sayısı: 7 → 6 → 5 → 4 → 2.
 * Cart strip'iyle aynı aile. */
@media (max-width: 1599px){
  body.single-product .pc-pdp-related--strip .pc-pdp-related__track{
    grid-auto-columns: calc((100% - (12px * 5)) / 6);
  }
}
@media (max-width: 1279px){
  body.single-product .pc-pdp-related--strip .pc-pdp-related__track{
    grid-auto-columns: calc((100% - (12px * 4)) / 5);
  }
}
@media (max-width: 979px){
  body.single-product .pc-pdp-related--strip .pc-pdp-related__track{
    grid-auto-columns: calc((100% - (12px * 3)) / 4);
  }
}
@media (max-width: 719px){
  body.single-product .pc-pdp-related--strip .pc-pdp-related__track{
    grid-auto-columns: calc((100% - 12px) / 2);
  }
}

/* PLP'den gelen .columns-N kuralları PLP CSS'te `display: grid` veriyor
 * olabilir; bizim 2-row grid'imizi ezmesinler. */
body.single-product .pc-pdp-related--strip ul.products[class*="columns-"]{
  display: grid !important;
}

/* Strip içi kart chrome'u — cart related kartlarıyla aynı aile:
 * yumuşak surface bg + 1px border + 6px radius. PLP kart markup'ında
 * `__media` zaten position: relative; biz sadece chrome ekliyoruz. */
body.single-product .pc-pdp-related--strip .pc-card-product__media{
  position: relative;
  background: var(--pc-surface-2);
  border: 1px solid var(--pc-border);
  border-radius: 6px;
  overflow: hidden;
  isolation: isolate;
  transition: border-color .18s ease;
}
body.single-product .pc-pdp-related--strip .pc-card-product__media:hover{
  border-color: rgba(17, 17, 17, 0.18);
}

/* Kart altı bilgi alanı: sıkıştırılmış, ürün adı + fiyat. PLP'den gelen
 * swatch/hint/CTA satırlarını burada gizle — strip temiz kalsın. */
body.single-product .pc-pdp-related--strip .pc-plp-row,
body.single-product .pc-pdp-related--strip .pc-plp-row--colors,
body.single-product .pc-pdp-related--strip .pc-plp-hint,
body.single-product .pc-pdp-related--strip .pc-card-product__actions,
body.single-product .pc-pdp-related--strip .pc-card-product__gallery-dots{
  display: none !important;
}
body.single-product .pc-pdp-related--strip .pc-card-product__body{
  padding-top: 10px;
}

/* Image link tüm media'yı kaplar — başlık-only click bug'ı bitir.
 * Hover beden şeridi (sizes--overlay) sadece buton'ların pointer-events
 * 'auto' olduğu, geri kalan opak background'unun pointer-events:none
 * olduğu MANGO davranışına çevrilir. */
body.single-product .pc-pdp-related--strip .pc-card-product__imglink{
  position: absolute;
  inset: 0;
  display: block;
  z-index: 2;
  cursor: pointer;
}
body.single-product .pc-pdp-related--strip .pc-card-product__imglink img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Hover beden şeridi: imajın alt kenarına yapışır, hover'da yukarı
 * kayarak çıkar. Cart strip'iyle birebir davranış. */
body.single-product .pc-pdp-related--strip .pc-plp-hover-overlay[data-plp-image-overlay]{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: auto;
  display: block;
  background: rgba(255, 255, 255, 0.96);
  /* Eskiden 10px 8px idi → arşivdeki min-height: 40px ile birlikte
   * yaklaşık 60px yüksekliğe çıkıyordu. Kullanıcı geri bildirimi:
   * "beden çıkan beyaz kutucuk çok yüksek". Dikey padding ve
   * içerideki min-height'ı kıstık → ~38px. */
  padding: 5px 8px;
  border-top: 1px solid var(--pc-border);
  pointer-events: none;
  z-index: 3;
}
body.single-product .pc-pdp-related--strip .pc-plp-hover-overlay .pc-plp-sizes--overlay{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 4px 4px;
  margin: 0;
  padding: 0;
  /* archive.css'teki 40px min-height'ı override et. */
  min-height: 28px;
  pointer-events: none !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.single-product .pc-pdp-related--strip .pc-plp-hover-overlay .pc-plp-sizes--overlay .pc-plp-size{
  pointer-events: auto;
  background: transparent;
  border: 0;
  font-size: 0.75rem;
  font-weight: 500;
  color: var(--pc-fg, #111);
  letter-spacing: 0.04em;
  padding: 0 6px;
  min-width: 24px;
  /* archive.css'in 40px min-height/line-height'ını override et. */
  min-height: 28px;
  line-height: 28px;
  text-transform: uppercase;
  cursor: pointer;
  border-radius: 2px;
  transition: background-color .15s ease, color .15s ease;
}
body.single-product .pc-pdp-related--strip .pc-plp-hover-overlay .pc-plp-sizes--overlay .pc-plp-size:hover:not(:disabled){
  background: var(--pc-fg, #111);
  color: #fff;
}
body.single-product .pc-pdp-related--strip .pc-plp-hover-overlay .pc-plp-sizes--overlay .pc-plp-size:disabled,
body.single-product .pc-pdp-related--strip .pc-plp-hover-overlay .pc-plp-sizes--overlay .pc-plp-size.is-unavailable{
  color: var(--pc-text-tertiary, #888);
  text-decoration: line-through;
  cursor: not-allowed;
}
@media (hover: hover) and (pointer: fine){
  body.single-product .pc-pdp-related--strip .pc-plp-hover-overlay[data-plp-image-overlay]{
    opacity: 0;
    visibility: hidden;
    transform: translate3d(0, 100%, 0);
    transition: opacity .22s ease, transform .22s ease, visibility .22s;
  }
  body.single-product .pc-pdp-related--strip .pc-card-product__media:hover .pc-plp-hover-overlay[data-plp-image-overlay],
  body.single-product .pc-pdp-related--strip .pc-card-product__media:focus-within .pc-plp-hover-overlay[data-plp-image-overlay]{
    opacity: 1;
    visibility: visible;
    transform: translate3d(0, 0, 0);
  }
}

/* Per-card galeri okları: küçük 28×28 pill, sadece hover'da fade-in.
 * Cart strip'iyle aynı görsel aile. */
body.single-product .pc-pdp-related--strip .pc-card-product__gallery-btn{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: 1px solid rgba(17, 17, 17, 0.08);
  background: rgba(255, 255, 255, 0.94);
  color: var(--pc-fg, #111);
  font-size: 14px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin: 0;
  cursor: pointer;
  z-index: 4;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .18s ease, visibility .18s, background-color .18s ease;
  box-shadow: 0 1px 2px rgba(17, 17, 17, 0.06);
}
body.single-product .pc-pdp-related--strip .pc-card-product__gallery-btn--prev{ left: 8px; }
body.single-product .pc-pdp-related--strip .pc-card-product__gallery-btn--next{ right: 8px; }
body.single-product .pc-pdp-related--strip .pc-card-product__gallery-btn:hover{
  background: #ffffff;
  border-color: rgba(17, 17, 17, 0.18);
}
body.single-product .pc-pdp-related--strip .pc-card-product__gallery-btn:focus-visible{
  outline: 2px solid var(--pc-fg, #111);
  outline-offset: 2px;
}
@media (hover: hover) and (pointer: fine){
  body.single-product .pc-pdp-related--strip .pc-card-product--has-gallery .pc-card-product__media:hover .pc-card-product__gallery-btn,
  body.single-product .pc-pdp-related--strip .pc-card-product--has-gallery .pc-card-product__media:focus-within .pc-card-product__gallery-btn{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }
}
@media (hover: none), (pointer: coarse){
  body.single-product .pc-pdp-related--strip .pc-card-product--has-gallery .pc-card-product__gallery-btn{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }
}

/* Related kartlarını PDP içindeki CTA / kalp / wishlist override'larından
 * koru: PLP kart yerleşimleri etkilenmesin diye scope'a göre ayır. */
body.single-product .pc-pdp-related .pc-card-product .pc-plp-favorite{
  background: transparent !important;
  color: inherit !important;
  border: none !important;
  width: auto !important;
  min-height: 0 !important;
  min-width: 0 !important;
  padding: 2px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}

@media (max-width: 900px){
  body.single-product .pc-pdp .pc-pdp__grid{
    grid-template-columns: 1fr;
  }

  body.single-product .pc-pdp .pc-pdp__summary{
    position: static;
    padding: 16px 16px 24px;
  }

  body.single-product .pc-pdp .pc-pdp-gallery-grid{
    grid-template-columns: 1fr;
  }
}

/* ----- Mango: "GÖRÜNÜMÜ GÖRÜNTÜLE" sekonder buton ----- */
body.single-product .pc-pdp .pc-pdp-look{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: var(--pc-pdp-cta-height);
  margin-top: 10px;
  padding: 0 18px;
  border: 1px solid #111111;
  background: #ffffff;
  color: #111111;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  box-sizing: border-box;
  appearance: none;
  -webkit-appearance: none;
}

body.single-product .pc-pdp .pc-pdp-look:hover,
body.single-product .pc-pdp .pc-pdp-look:focus-visible{
  background: #f4f4f4;
  outline: none;
}

/* ----- Lightbox / Zoom modal ----- */
.pc-pdp-lightbox{
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(255, 255, 255, 0.98);
  display: none;
  flex-direction: row;
  align-items: stretch;
}

.pc-pdp-lightbox.is-open{
  display: flex;
}

body.pc-pdp-lightbox-open{
  overflow: hidden;
}

.pc-pdp-lightbox__thumbs{
  flex: 0 0 64px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 32px 8px 32px;
  overflow-y: auto;
  background: transparent;
  -ms-overflow-style: none;
  scrollbar-width: thin;
}

.pc-pdp-lightbox__thumb{
  width: 48px;
  height: 64px;
  margin: 0;
  padding: 0;
  border: 1px solid transparent;
  background: #f6f5f3;
  cursor: pointer;
  overflow: hidden;
  appearance: none;
  -webkit-appearance: none;
  flex: 0 0 auto;
  opacity: 0.55;
  transition: opacity 0.15s ease, border-color 0.15s ease;
}

.pc-pdp-lightbox__thumb:hover{
  opacity: 0.85;
}

.pc-pdp-lightbox__thumb.is-active{
  opacity: 1;
  border-color: #111111;
}

.pc-pdp-lightbox__thumb img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.pc-pdp-lightbox__stage{
  flex: 1 1 auto;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 0;
  background: #f6f5f3;
}

.pc-pdp-lightbox__stage img{
  display: block;
  max-width: 100%;
  max-height: 100vh;
  width: auto;
  height: 100vh;
  object-fit: contain;
}

.pc-pdp-lightbox__close{
  position: absolute;
  top: 16px;
  right: 16px;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  color: #111111;
  border: none;
  cursor: pointer;
  font-size: 22px;
  line-height: 1;
  z-index: 2;
  appearance: none;
}

.pc-pdp-lightbox__close::before{
  content: "";
  width: 18px;
  height: 18px;
  background:
    linear-gradient(45deg, transparent 46%, #111 46%, #111 54%, transparent 54%),
    linear-gradient(-45deg, transparent 46%, #111 46%, #111 54%, transparent 54%);
}

.pc-pdp-lightbox__nav{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.6);
  color: #111111;
  border: none;
  cursor: pointer;
  font-size: 24px;
  line-height: 1;
  appearance: none;
  z-index: 2;
}

.pc-pdp-lightbox__nav:hover{
  background: rgba(255, 255, 255, 0.85);
}

.pc-pdp-lightbox__nav--prev{ left: 16px; }
.pc-pdp-lightbox__nav--next{ right: 16px; }

@media (max-width: 700px){
  .pc-pdp-lightbox{ flex-direction: column-reverse; }
  .pc-pdp-lightbox__thumbs{
    flex: 0 0 80px;
    flex-direction: row;
    width: 100%;
    padding: 8px 12px;
    overflow-x: auto;
    overflow-y: hidden;
  }
  .pc-pdp-lightbox__thumb{
    width: 56px;
    height: 72px;
  }
  .pc-pdp-lightbox__stage img{
    height: auto;
    max-height: calc(100vh - 90px);
  }
  .pc-pdp-lightbox__nav{ display: none; }
}
