/**
 * Ürün sayfası düzeltmeleri (yalnızca tekil ürün) — 2026-09-08.
 *
 * 1) WPC Linked Variation ("Adet: Tekli / 6'lı") seçicisinin elden geçirilmesi.
 * 2) Mobilde sayfa akışındaki "Sepete Ekle" butonu (tema formu alta
 *    sabitlediği için sayfada hiç buton kalmıyordu).
 */

/* =====================================================================
   1) Paket seçici — WPC Linked Variation (.wpclv-*)

   Eklentinin varsayılanı: dış kutu beyaz + 1px solid rgb(0,128,0) (ham HTML
   yeşili), iç <span>/<a> ayrıca #efefef gri zemin → iç içe iki kutu, 2px köşe.
   İlk denememde hap biçimli çiplere çevirdim; kısa metinle (5 harf) savruk
   lekeler gibi durdu ve asıl eksik giderilmemişti.

   Asıl eksik BİLGİYDİ: markette "tekli mi, 24'lü mü" sorusunun cevabı fiyat.
   Artık her seçenek kendi fiyatını, çoklu paketler adet başı fiyatı taşıyor
   (bkz. functions.php `bacola_child_wpclv_fiyatli_cip`). Bu yüzden biçim de
   hap değil, eşit genişlikte RAF KARTI: sağdaki bilgi kutusuyla aynı 10px
   köşe, aynı hizada okunan bir karşılaştırma seti.

   Fiyatlar tabular-nums ile dizilir ki iki kart arasında rakamlar hizalansın.
   ===================================================================== */
.wpclv-attributes {
	margin: 0 0 20px;
	/* Eklenti kapsayıcıyı içeriğe göre büzüyor: mobilde ebeveyn 360px iken
	   .wpclv-attributes 140px kalıyor ve ızgara tek sütuna düşüyordu. */
	display: block !important;
	width: 100% !important;
}
.wpclv-attributes .wpclv-attribute {
	display: block !important;
	width: 100% !important;
}
.wpclv-attribute + .wpclv-attribute {
	margin-top: 16px;
}
.wpclv-attribute-label {
	margin-bottom: 10px;
	font-size: 14px;
	font-weight: 600;
	color: #202435;
}
/* NOT: eklenti `.wpclv-terms`'e `display: inline-block`, iç span'lara da
   `padding: 0 20px` veriyor ve seçicileri daha özgül; bu yüzden ızgara ve
   satır yerleşimi !important ile zorlanıyor. */
.wpclv-attribute .wpclv-terms {
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
	gap: 10px;
	max-width: 420px;
	margin: 0;
	padding: 0;
}

/* Dış kutu artık yalnızca ızgara hücresi; görünen yüzey iç <span>/<a>.
   Eklentinin `.wpclv-attributes .wpclv-terms .wpclv-term.active` kuralı
   dış kutuya YEŞİL kenar basıyor (0,3,0) — aynı prefiksle sıfırlanmalı. */
.wpclv-attributes .wpclv-terms .wpclv-term-button,
.wpclv-attributes .wpclv-terms .wpclv-term-button.active,
.wpclv-attributes .wpclv-terms .wpclv-term-button:hover {
	/* NOT: burada `display:flex` DENENDİ ve yanlıştı — iç yüzey flex öğesi
	   olunca `align-items:stretch` yüzünden yüksekliği ızgara satırına
	   kilitleniyor, fiyat satırları taşıyordu (ölçüldü: içerik 41px, kutu
	   42px'te kalıyordu). Blok akışında bırakılıyor; eşit yükseklik zaten
	   ızgaranın kendi stretch davranışından geliyor. */
	display: block !important;
	height: 100%;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	outline: 0 !important;
	background: none !important;
	box-shadow: none !important;
	border-radius: 0 !important;
}

/* DİKKAT — eklentinin şu kuralı her şeyi eziyordu:
     .wpclv-attributes .wpclv-terms .wpclv-term span,
     .wpclv-attributes .wpclv-terms .wpclv-term a {
       display:block; padding:0 20px; white-space:nowrap;
       height:34px; line-height:34px; width:100%;
       background-color:#efefef; border-radius:2px; }
   Seçici (0,3,1) olduğu için child'daki (0,2,1) kurallar kaybediyordu ve
   `height:34px` + `nowrap` yüzünden karta eklediğimiz fiyat satırları
   KIRPILIYORDU (ekranda yalnızca ürün adı + gri kutu görünüyordu).
   Bu yüzden hem aynı prefiks kullanılıyor hem de sabit yükseklik/nowrap
   açıkça sıfırlanıyor. */
.wpclv-attributes .wpclv-terms .wpclv-term-button > span,
.wpclv-attributes .wpclv-terms .wpclv-term-button > a {
	display: block !important;
	width: auto !important;
	/* Izgara hücresini doldur ki iki kart eşit yükseklikte olsun
	   (auto bırakılınca 67px / 85px gibi asimetrik duruyordu). */
	height: 100% !important;
	min-height: 0 !important;
	box-sizing: border-box;
	margin: 0 !important;
	padding: 12px 14px !important;
	border: 1px solid #e2e4ec !important;
	border-radius: 10px !important;
	background: #fff !important;
	color: #202435 !important;
	line-height: 1.3 !important;
	white-space: normal !important;
	text-align: left;
	text-decoration: none !important;
	transition: border-color .15s, background-color .15s;
}
.wpclv-attributes .wpclv-terms .wpclv-term-button > a:hover,
.wpclv-attributes .wpclv-terms .wpclv-term-button > a:focus-visible {
	border-color: #f47a20 !important;
	background: #fffaf5 !important;
}
.wpclv-attributes .wpclv-terms .wpclv-term-button > a:focus-visible {
	outline: 2px solid #f47a20;
	outline-offset: 2px;
}

/* Seçili paket: turuncu kenar + hafif turuncu zemin. */
.wpclv-attributes .wpclv-terms .wpclv-term-button.active > span,
.wpclv-attributes .wpclv-terms .wpclv-term-button.active > a {
	border-color: #f47a20 !important;
	border-width: 2px !important;
	padding: 11px 13px !important; /* 2px kenar telafisi — kart zıplamasın */
	background: #fff7f0 !important;
	cursor: default;
}

/* Kart içi satırlar — eklentinin span kuralı burada da sıfırlanmalı. */
.wpclv-attributes .wpclv-terms .wpclv-term-button .pt-adet,
.wpclv-attributes .wpclv-terms .wpclv-term-button .pt-adet > span {
	width: auto !important;
	height: auto !important;
	margin: 0 !important;
	padding: 0 !important;
	background: none !important;
	border: 0 !important;
	border-radius: 0 !important;
	white-space: normal !important;
}
.wpclv-attributes .wpclv-terms .wpclv-term-button .pt-adet {
	display: flex !important;
	flex-direction: column;
	gap: 2px;
}
.wpclv-attributes .wpclv-terms .wpclv-term-button .pt-adet > span {
	display: block !important;
}
.pt-adet__ad {
	font-size: 15px !important;
	font-weight: 600;
	line-height: 1.25 !important;
	color: #202435;
}
.pt-adet__fiyat {
	font-size: 17px !important;
	font-weight: 700;
	line-height: 1.2 !important;
	color: #202435;
	font-variant-numeric: tabular-nums;
}
.pt-adet__birim {
	font-size: 12.5px !important;
	font-weight: 500;
	line-height: 1.3 !important;
	color: #5c6b76;
	font-variant-numeric: tabular-nums;
}
.pt-adet__stok {
	font-size: 12px !important;
	font-weight: 600;
	line-height: 1.3 !important;
	color: #b91c02;
}

/* Stokta olmayan paket. */
.wpclv-terms .wpclv-term-button.disabled > a,
.wpclv-terms .wpclv-term-button.out-of-stock > a {
	background: #f6f7f9 !important;
	border-color: #e6e8ee !important;
}
.wpclv-terms .wpclv-term-button.disabled .pt-adet__ad,
.wpclv-terms .wpclv-term-button.out-of-stock .pt-adet__ad,
.wpclv-terms .wpclv-term-button.disabled .pt-adet__fiyat,
.wpclv-terms .wpclv-term-button.out-of-stock .pt-adet__fiyat {
	color: #9aa3ad;
}

@media (max-width: 767px) {
	.wpclv-attribute .wpclv-terms {
		grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
		max-width: none;
	}
	.pt-adet__fiyat { font-size: 16px; }
}

/* =====================================================================
   1b) Sosyal paylaşım — ul.social-container

   Dört doymuş renkli daire (Facebook'un 2010 mavisi #3b5998, Twitter kuşu
   #1da1f2, Pinterest #e60023, WhatsApp #25d366) sayfadaki asıl eylemle
   ("Sepete Ekle") görsel olarak yarışıyordu ve Twitter markası artık yok.
   Sessiz hâle çevrildi: nötr zemin + lacivert ikon, marka rengi YALNIZCA
   hover'da. Twitter kuşu X logosuyla değiştirildi (ikon fontunda X yok,
   bu yüzden maskeli SVG).
   ===================================================================== */
.social-container {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.social-container li {
	margin: 0;
	list-style: none;
}
.social-container li a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	/* Tema `border-color: transparent` basıyor (daha özgül) — kenarlık
	   görünmüyordu; bu yüzden zorlanıyor. */
	border: 1px solid #e2e4ec !important;
	border-radius: 10px !important;
	background: #fff !important;
	color: #3e445a !important;
	font-size: 15px;
	transition: border-color .15s, background-color .15s, color .15s;
}
.social-container li a:hover,
.social-container li a:focus-visible {
	border-color: currentColor !important;
}
.social-container li a:focus-visible {
	outline: 2px solid #f47a20;
	outline-offset: 2px;
}
.social-container li a.facebook:hover { color: #0866ff !important; background: #f3f7ff !important; }
.social-container li a.twitter:hover  { color: #000 !important;    background: #f4f4f5 !important; }
.social-container li a.pinterest:hover { color: #e60023 !important; background: #fff4f5 !important; }
.social-container li a.whatsapp:hover { color: #1da851 !important; background: #f2fbf6 !important; }

/* Twitter kuşu -> X. İkon fontunda X glifi yok; glif gizlenip yerine
   currentColor'ı alan maskeli SVG konuyor (hover rengi de çalışsın diye). */
.social-container li a.twitter i {
	display: none;
}
.social-container li a.twitter::before {
	content: "";
	width: 15px;
	height: 15px;
	background-color: currentColor;
	-webkit-mask: var(--pt-x-logo) center / contain no-repeat;
	mask: var(--pt-x-logo) center / contain no-repeat;
}
:root {
	--pt-x-logo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z'/%3E%3C/svg%3E");
}

/* =====================================================================
   2) Mobilde sayfa akışındaki "Sepete Ekle"

   Tema `@media (max-width: 64rem)` altında
   `.single .single-content .product-type-simple form.cart`'ı
   `position: fixed; bottom: 0` yapıyor — yani TEK olan sepete ekle formu
   komple alt çubuğa taşınıyor ve sayfanın kendi akışında hiçbir buton
   kalmıyor. Kullanıcı sabit çubuğun kalmasını, ama butonun kendi yerinde
   de (istek listesi butonunun üstünde) görünmesini istiyor.

   Bu yüzden akışa ikinci bir buton basıyoruz; tıklama gerçek forma
   iletiliyor (bkz. assets/js/product-mobile.js), böylece adet ve AJAX
   davranışı tek yerden yönetilmeye devam ediyor.
   ===================================================================== */
.pt-akis-sepete-ekle {
	display: none;
}
@media (max-width: 64rem) {
	.pt-akis-sepete-ekle {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		min-height: 48px;
		margin: 4px 0 14px;
		padding: 0 20px;
		border: 0;
		border-radius: 999px;
		background: #f47a20;
		/* 2026-09-09 DÜZELTME: burada #241200 (koyu kahve) vardı — sepet
		   sayfasındaki pasif "Sepeti güncelle" için seçilmiş bir a11y rengiydi
		   ve buraya yanlışlıkla taşındı. Alt çubuktaki GERÇEK sepete ekle
		   butonu beyaz yazılı; iki buton üst üste durduğu için yazının biri
		   siyah biri beyaz görünüyordu. Aynı butonun kopyası olduğu için
		   görünümü de birebir aynı olmalı. */
		color: #fff;
		font-size: 15px;
		font-weight: 600;
		line-height: 1.2;
		cursor: pointer;
	}
	.pt-akis-sepete-ekle:hover,
	.pt-akis-sepete-ekle:focus-visible {
		background: #e06d16;
		color: #fff;
	}
	.pt-akis-sepete-ekle[disabled] {
		background: #e9ecf3;
		color: #2f3545;
		cursor: not-allowed;
	}
}

/* =====================================================================
   3) "Sepete Ekle" + "İstek Listesine Ekle" tek format — 2026-09-09

   Ölçüldü (390px): sepete ekle 360x48 / 15px-600 / normal yazı,
   istek listesi 158x33 / 12px-600 / BÜYÜK HARF. Alt alta duran iki
   eylem birbirine hiç benzemiyordu.

   Çözüm: aynı yükseklik, aynı köşe, aynı tipografi; mobilde aynı
   genişlik. Hiyerarşi renkle kuruluyor — birincil dolu turuncu,
   ikincil beyaz + kenarlık. Etiket metnine DOKUNULMUYOR: eklenti
   tıklamadan sonra metni kendisi değiştiriyor ("İstek listende"),
   sabitlenirse o durum kaybolur.
   ===================================================================== */
.product-actions .tinvwl_add_to_wishlist_button {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 48px;
	padding: 0 22px !important;
	border: 1.5px solid #d8dde6 !important;
	border-radius: 999px !important;
	background: #fff !important;
	color: #202435 !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	line-height: 1.2;
	text-transform: none !important;
	letter-spacing: 0 !important;
	transition: border-color .15s, background-color .15s;
}
.product-actions .tinvwl_add_to_wishlist_button:hover,
.product-actions .tinvwl_add_to_wishlist_button:focus-visible {
	border-color: #f47a20 !important;
	background: #fffaf5 !important;
	color: #202435 !important;
}
.product-actions .tinvwl_add_to_wishlist_button:focus-visible {
	outline: 2px solid #f47a20;
	outline-offset: 2px;
}

/* Mobil/tablet: ikisi de tam genişlik, eşit boy, aralarında nefes payı. */
@media (max-width: 64rem) {
	.pt-akis-sepete-ekle {
		margin-bottom: 10px;
	}
	.product-actions,
	.product-actions .tinv-wraper {
		display: block !important;
		width: 100% !important;
	}
	.product-actions .tinvwl_add_to_wishlist_button {
		display: flex !important;
		width: 100% !important;
	}
}