/* =========================================================================
   PT Ürün Sayfası — Faz 1
   Dönüşüm odaklı ürün özet kolonu + sticky galeri + mobil sepet barı.
   ========================================================================= */

:root {
	--ptus-ink: #000;            /* XD: başlık/metin saf siyah */
	--ptus-ink-soft: #6e6e73;
	--ptus-line: #e6e6ea;
	--ptus-line-soft: #f1f1f4;
	--ptus-accent: #165EC9;      /* XD ana mavi (interaktif + seçili durum) */
	--ptus-accent-dk: #104a9f;
	--ptus-ribbon: #165EC9;      /* Eğitim İndirimi ribbon mavisi */
	--ptus-price: #000;          /* fiyatlar siyah */
	--ptus-green: #1a7f37;
	--ptus-bg-soft: #f6f6f8;
	--ptus-card-bg: #f5f5f7;     /* Hizmetler kart zemini (XD gri) */
	--ptus-card-line: #d9d9d9;   /* Hizmetler kart çerçevesi (XD) */
	--ptus-radius: 16px;
	--ptus-radius-sm: 12px;
	--ptus-radius-card: 20px;    /* Hizmetler kartları (XD) */
	--ptus-pill: 999px;
	--ptus-shadow: 0 1px 2px rgba(0,0,0,.04), 0 8px 24px rgba(0,0,0,.05);
}

/* ---- Genel özet kolonu ---- */
.pt-us,
.pt-us-stickybar {
	/* Site gövde fontu — XD tasarımıyla aynı (Poppins). */
	font-family: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
.pt-us {
	color: var(--ptus-ink);
	max-width: 560px;
}
.pt-us * { box-sizing: border-box; }

/* wc_price çıktısı (.woocommerce-Price-amount) tema rengini taşıyor;
   bizim renkli fiyat alanlarımızda daima kapsayıcının rengini alsın. */
.pt-us .woocommerce-Price-amount,
.pt-us .woocommerce-Price-currencySymbol,
.pt-us .woocommerce-Price-amount bdi,
.pt-us-stickybar .woocommerce-Price-amount,
.pt-us-stickybar .woocommerce-Price-amount bdi { color: inherit !important; }

.pt-us-title {
	font-size: 30px;
	line-height: 1.15;
	font-weight: 700;
	letter-spacing: -0.02em;
	margin: 0 0 10px;
	text-wrap: balance;
}
/* Marka + Ürün Kodu + Teslimat: TEK SATIR.
   Ölçüm (kolon 438px, Poppins): üç parça 12,5px'te 378px sürüyor, uzun bir
   SKU'da ("...-Teşhir") 423px. Etiket "Kargoya veriliş" iken tek başına ~90px
   fazla yer kaplıyor ve satır sarıyordu; "Teslimat"a inince sığdı.
   Parçaların İÇİ nowrap (etiket değerinden kopmaz); satırın kendisi son çare
   olarak sarabilir — sığmayan aşırı bir üründe taşmak yerine alta insin. */
.pt-us-idrow {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 13px;
	font-size: 12.5px;
	color: var(--ptus-ink-soft);
	margin-bottom: 12px;
}
.pt-us-idrow > span { white-space: nowrap; }
/* Etiketler <i> ama italik değil — mobilde gizlenebilsinler diye eleman oldular. */
.pt-us-idlabel { font-style: normal; }
.pt-us-idrow b { color: var(--ptus-ink); font-weight: 600; }
/* Marka adı marka arşivine gider. Gri künye satırında mavi bir link fazla
   yüksek sesli kalıyor: renk aynı kalır, ince bir alt çizgi tıklanabilirliği
   söyler; hover'da aksana döner. */
.pt-us-idrow a {
	color: inherit;
	text-decoration: underline;
	text-decoration-color: rgba(0, 0, 0, .25);
	text-underline-offset: 2px;
	transition: color .15s, text-decoration-color .15s;
}
.pt-us-idrow a:hover {
	color: var(--ptus-accent);
	text-decoration-color: currentColor;
}

/* ---- Puan ---- */
.pt-us-rating {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 16px;
}
.pt-us-rating .star-rating { font-size: 15px; color: #f5a623; }
.pt-us-rating-count { font-size: 13px; color: var(--ptus-ink-soft); }

/* ---- Yetkili rozetleri ----
   İKİ rozet (üçüncüsü kaldırıldı) ve büyük punto: bunlar sayfanın güven
   argümanı, 12px'te fark edilmiyorlardı.

   İki kural pazarlıksız:
   1) Elma işareti ile metni AYIRMA — rozetin kendisi nowrap, metin ancak
      kendi <span>'i içinde sarar. Bu yüzden metin ayrı bir eleman.
   2) Logo EZİLMEZ/KIRPILMAZ — svg'ye flex:0 0 auto ve oranına (18.4/21.9 ≈
      0.84) uyan sabit ölçü verilir; yüzde/stretch verilmez.

   Dar ekranda satır kırılmak yerine rozetler alt alta iner (aşağıdaki
   media query) — yan yana sıkışıp metni üç satıra bölmesinler. */
/* İki rozet, İKİSİ DE TEK SATIR — metin sarmıyor.
   Ölçüm (kolon 438px, Poppins 600): iki rozetin metni + iki elma + boşluklar
   17px'te 384px, 18px'te 403px, 20px'te 444px sürüyor. 20px sığmadığı için
   metin ikiye bölünüyordu; 17px hem tek satırı garantiliyor hem de eski
   12px'e göre belirgin biçimde büyük.
   flex-wrap: wrap bilerek duruyor — daha dar bir kolonda taşmak yerine
   rozetler alt alta insin (kırpma/yatay kaydırma olmaz). */
.pt-us-badges {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 22px;
	margin-bottom: 22px;
}
.pt-us-badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 17px;
	line-height: 1.15;
	font-weight: 600;
	letter-spacing: -0.01em;
	color: var(--ptus-ink);
	/* Logo ile metin arasında satır kırılmaz. */
	flex-wrap: nowrap;
}
.pt-us-badge > span {
	text-align: left;
	/* Metin ikiye bölünmesin — rozetin tamamı tek satır. */
	white-space: nowrap;
}
/* Dar ekranın kendi kuralı aşağıda, @media (max-width: 600px) içinde: rozetler
   orada da YAN YANA. Burada bir zamanlar 480px'lik bir "alt alta" bloğu vardı;
   600px kuralı flex-direction'ı yazmadığı için o blok mobilde kalıyor ve iki
   rozeti dikey/ortalı diziyordu (8 Eyl). Tek yerden yönetiliyor. */

/* Ürün kodu satırındaki kargo vaadi. */
.pt-us-ship {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
.pt-us-apple {
	/* Asla esnemesin/daralmasın: flex kabında shrink 0. */
	flex: 0 0 auto;
	color: var(--ptus-ink);
	/* Ölçüler glifin kendi oranında (18.4 / 21.9 ≈ 0.84). viewBox artık glife
	   birebir oturduğu için ek bir hiza düzeltmesi gerekmiyor. Punto büyüdüğü
	   için işaret de büyüdü; oran korunuyor (25 / 30 = 0.833). */
	width: 24px;
	height: 28px;
}

/* ---- Bölüm başlıkları ---- */
.pt-us-section-title {
	font-size: 18px;
	font-weight: 700;
	letter-spacing: -0.01em;
	margin: 4px 0 12px;
}

/* ---- Fiyat kutusu (eğitim + bireysel kart) ---- */
.pt-us-pricebox { display: flex; flex-direction: column; gap: 12px; margin-bottom: 24px; }
.pt-us-pricecard {
	position: relative;
	border: 1px solid var(--ptus-line);
	border-radius: var(--ptus-radius);
	/* Kutu kısıldı: eğitim kartı gereğinden yüksekti ve şerit büyüyünce
	   dengelenmesi gerekti. */
	padding: 13px 16px;
	background: #fff;
	box-shadow: var(--ptus-shadow);
	overflow: hidden;
}
.pt-us-pricecard--edu { border-color: #d7e6fb; }

/* Seçilebilir kartlar (hesap türü) — seçili kart BÜYÜK, diğeri kompakt tek satır.
   DİKKAT: imleç/hover yalnız role="button" taşıyan (gerçekten seçilebilir) kartta.
   Misafir ve kilitli kullanıcıda kart buton gibi durup hiçbir şey yapmıyordu. */
.pt-us-pricecard[data-pt-us-account-card][role="button"] { cursor: pointer; }
.pt-us-pricecard[data-pt-us-account-card][role="button"]:hover { border-color: #b9cde8; }
.pt-us-pricecard[data-pt-us-account-card]:not([role="button"]) { cursor: default; }
.pt-us-pricecard.is-selected {
	border-color: var(--ptus-accent);
	box-shadow: 0 0 0 3px rgba(0, 113, 227, .10);
}
.pt-us-pricecard[data-pt-us-account-card][role="button"]:focus-visible {
	outline: 2px solid var(--ptus-accent);
	outline-offset: 2px;
}
.pt-us-pricecard { transition: border-color .15s, box-shadow .15s, padding .2s; }

/* Eğitim kartı seçili DEĞİLKEN kompakt satıra iner: pill solda, fiyat sağda. */
.pt-us-pricecard--edu:not(.is-selected) {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 14px 18px;
}
.pt-us-pricecard--edu:not(.is-selected) .pt-us-pill { margin: 0; background: transparent; padding: 0; }
.pt-us-pricecard--edu:not(.is-selected) .pt-us-ribbon,
.pt-us-pricecard--edu:not(.is-selected) .pt-us-price-prefix,
.pt-us-pricecard--edu:not(.is-selected) .pt-us-taksit-toggle,
.pt-us-pricecard--edu:not(.is-selected) .pt-us-havale-line { display: none; }
.pt-us-pricecard--edu:not(.is-selected) .pt-us-price-value { font-size: 24px; white-space: nowrap; }

/* Taksit butonu YALNIZ seçili kartta. Bireysel kart da butonu aldıktan sonra
   (kapalı hâli dar bir satır) metin üç satıra bölünüyordu; buton zaten seçili
   tier'ın tablosunu açıyor, kapalı kartta durmasının anlamı yok. */
.pt-us-pricecard:not(.is-selected) .pt-us-taksit-toggle { display: none; }

/* Bireysel kart seçiliyken büyür: dikey düzen + büyük fiyat + havale satırı belirgin. */
.pt-us-pricecard--bireysel.is-selected {
	flex-direction: column;
	align-items: stretch;
	gap: 10px;
	padding: 16px 18px 18px;
}
.pt-us-pricecard--bireysel.is-selected .pt-us-price-value { font-size: 34px; }
.pt-us-pricecard--bireysel.is-selected .pt-us-havale-mini { font-size: 13px; }

/* Misafir bilgilendirme + toggle ipucu */
.pt-us-account-note {
	font-size: 13px;
	color: var(--ptus-ink-soft);
	background: var(--ptus-bg-soft);
	border-radius: var(--ptus-radius-sm);
	padding: 10px 14px;
}
.pt-us-account-note a { color: var(--ptus-accent); font-weight: 600; }
.pt-us-account-hint { font-size: 12px; color: var(--ptus-ink-soft); margin-top: -4px; }

/* "Eğitim İndirimi" rozeti.
   Tarihçe: önce köşeye 45° döndürülmüş bir şeritti (kartın overflow:hidden'ı
   kesiyor, "EğitimİndirimI" gibi okunuyordu) → yatay bir rozete çevrildi ama
   sağ üst köşeye MUTLAK konumlandırıldı → 8 Eyl 2026'da akışa alındı: pill ile
   aynı satırda, sağ uçta (bkz. .pt-us-card-head). Mutlak konum iki sorun
   üretiyordu: mobilde pill'in üstüne biniyordu, masaüstünde de pill ile aynı
   hizada durmuyordu. */
.pt-us-ribbon {
	display: inline-flex;
	align-items: center;
	background: var(--ptus-ribbon);
	color: #fff;
	font-size: 12px;
	font-weight: 800;
	line-height: 1;
	letter-spacing: .01em;
	white-space: nowrap;
	padding: 7px 12px;
	border-radius: 999px;
}

/* Rozet + pill kabı — HER EKRANDA tek satır: solda "Öğrenci ve Öğretmene Özel"
   pill'i, sağ uçta "Eğitim İndirimi" rozeti.
   Rozet eskiden mutlak konumluydu (kartın sağ üst köşesine yapışık) ve pill ile
   aynı hizada durmuyordu; mobilde de pill'in üstüne biniyordu. Artık akışta.
   flex-wrap bilerek duruyor: çok dar bir kartta rozet üst üste binmek yerine
   alt satıra düşüp sağa yaslanır. */
.pt-us-card-head {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 10px;
}
.pt-us-card-head .pt-us-ribbon { order: 2; margin-left: auto; }
.pt-us-card-head .pt-us-pill { margin-bottom: 0; }

/* Pill başlık — ribbon'a alan bırakmak için bir tık küçültüldü. */
.pt-us-pill {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: var(--ptus-bg-soft);
	border-radius: 999px;
	padding: 5px 11px;
	font-size: 11.5px;
	font-weight: 600;
	color: var(--ptus-ink);
	margin-bottom: 10px;
}
.pt-us-pill--plain { background: transparent; padding: 0; margin-bottom: 6px; }
.pt-us-ic-people { color: var(--ptus-accent); }
.pt-us-info {
	display: inline-flex; align-items: center; justify-content: center;
	width: 15px; height: 15px; border-radius: 50%;
	background: #c7c7cf; color: #fff; font-size: 10px; font-style: normal; font-weight: 700;
	/* Artık tooltip değil, popup açıyor — imleç pill ile aynı olmalı. */
	cursor: inherit;
}
.pt-us-pill--edu-info:hover .pt-us-info { background: var(--ptus-accent); }

.pt-us-price-prefix { font-size: 12px; color: var(--ptus-ink-soft); margin-bottom: 4px; }

.pt-us-price-row { display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px; }
.pt-us-price-value {
	font-size: 34px;
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--ptus-price);
	line-height: 1.05;
}
/* Üstü çizili "yerine" fiyat ve indirim yüzdesi rozeti bilinçli olarak yok —
   tema genelindeki kuralın aynısı (themes/pt/inc/product/price.php). */

/* En avantajlı taksit satırı */
.pt-us-installment {
	display: flex;
	align-items: center;
	gap: 7px;
	margin-top: 10px;
	font-size: 13px;
	color: var(--ptus-ink-soft);
}
.pt-us-installment .pt-us-ic-card { color: var(--ptus-accent); flex: 0 0 auto; }
.pt-us-installment b { color: var(--ptus-ink); font-weight: 600; }
.pt-us-installment .pt-us-installment-amt { color: var(--ptus-accent); font-weight: 700; }
/* Kompakt kartlarda taksit satırı gizli */
.pt-us-pricecard--edu:not(.is-selected) .pt-us-installment,
.pt-us-pricecard--bireysel:not(.is-selected) .pt-us-installment { display: none; }

/* Taksit linki */
.pt-us-taksit-toggle {
	appearance: none; border: 0; background: none; padding: 0;
	display: inline-flex; align-items: center; gap: 4px;
	color: var(--ptus-ink);
	font-size: 13px; font-weight: 600;
	text-decoration: underline; text-underline-offset: 3px;
	cursor: pointer;
	margin-top: 10px;
}
.pt-us-taksit-toggle svg { transition: transform .2s; }
.pt-us-taksit-toggle.is-open svg { transform: rotate(180deg); }

/* Havale satırı (eğitim kartı içi).
   Tutar artık cümlenin İÇİNDE ("Havale / EFT ile 440 ₺ ekstra indirim").
   Eskiden satırın sağ ucunda ayrı bir blok olarak duruyordu (margin-left:auto)
   ve dar ekranda alt satıra düşüp yüzdeden kopuyordu. */
.pt-us-havale-line {
	display: flex; align-items: center; gap: 7px;
	margin-top: 12px; padding-top: 12px;
	border-top: 1px solid var(--ptus-line-soft);
	font-size: 13px; color: var(--ptus-ink-soft);
}
.pt-us-havale-line .pt-us-ic-card { color: var(--ptus-green); flex: 0 0 auto; }
.pt-us-havale-line b { color: var(--ptus-green); }
.pt-us-havale-value { color: var(--ptus-green); font-weight: 700; font-size: 15px; }

/* Bireysel kart */
.pt-us-pricecard--bireysel {
	display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.pt-us-bireysel-info { display: flex; flex-direction: column; gap: 2px; }
.pt-us-havale-mini { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--ptus-ink-soft); }
/* Havale vaadi YALNIZ seçili kartta. Kapalı kartta müşteri o fiyatı henüz
   seçmemiş; orada durunca hangi fiyatın kazancı olduğu karışıyor ve kompakt
   satırı şişiriyordu. Misafirde yerini giriş notu alır (aşağıda). */
.pt-us-pricecard--bireysel:not(.is-selected) .pt-us-havale-mini { display: none; }
/* Misafir notu kartın İÇİNDE: gri kutu değil, etiketin altında düz satır. */
.pt-us-bireysel-info .pt-us-account-note {
	background: transparent;
	padding: 0;
	margin-top: 2px;
	font-size: 12.5px;
	line-height: 1.35;
}
/* "giriş yapın" iki satıra bölünmesin — bağlantı tek parça okunur. */
.pt-us-bireysel-info .pt-us-account-note a { white-space: nowrap; }
.pt-us-havale-mini .pt-us-ic-card { color: var(--ptus-green); }
.pt-us-havale-mini b { color: var(--ptus-green); }
.pt-us-pricecard--bireysel .pt-us-price-value { font-size: 24px; white-space: nowrap; }

/* ---- Varyasyon buton grid ---- */
.pt-us-variations { display: flex; flex-direction: column; gap: 18px; margin-bottom: 22px; }
.pt-us-varhead {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	margin-bottom: 10px;
}
.pt-us-varlabel { font-size: 14px; font-weight: 600; }
.pt-us-varchosen { font-size: 13px; color: var(--ptus-ink-soft); }
.pt-us-varopts { display: flex; flex-wrap: wrap; gap: 10px; }
.pt-us-varopt {
	appearance: none;
	border: 1.5px solid var(--ptus-line);
	background: #fff;
	color: var(--ptus-ink);
	border-radius: 16px;
	padding: 25px 14px;
	min-width: 96px;
	text-align: center;
	font-size: 15px;
	font-weight: 400;
	cursor: pointer;
	transition: border-color .15s, box-shadow .15s, background .15s;
	line-height: 1.2;
}
.pt-us-varopt:hover { border-color: #c7c7cf; }
.pt-us-varopt.is-selected {
	border-color: var(--ptus-accent);
	box-shadow: 0 0 0 1px var(--ptus-accent);
	background: #fff;
	color: var(--ptus-accent);
	font-weight: 700;
}
.pt-us-varopt.is-unavailable {
	/* XD gri dili — üstü çizili/yıkanmış görünüm yerine sakin gri pill */
	color: #a1a1a6;
	cursor: not-allowed;
	background: #fff;
	border-color: var(--ptus-line);
}
.pt-us-vargroup.pt-us-shake { animation: ptus-shake .4s; }
@keyframes ptus-shake {
	0%,100% { transform: translateX(0); }
	25% { transform: translateX(-6px); }
	75% { transform: translateX(6px); }
}

/* ---- Bağlı ürün seçicileri (WPClever Linked Variation) ----
   Kardeş simple ürünlere yönlendiren Renk/İşlemci/Bellek… seçicileri —
   varyasyon buton grid'iyle aynı görsel dil. */
.pt-us-linked { margin: 4px 0 26px; }
.pt-us-linked .wpclv-attributes { margin: 0; display: flex; flex-direction: column; gap: 26px; }
.pt-us-linked .wpclv-attribute { margin: 0 !important; }
.pt-us-linked .wpclv-attribute-label {
	/* XD: "Renk seçin." — cümle biçimi, koyu ve belirgin */
	font-size: 17px;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--ptus-ink);
	margin: 0 0 12px;
}
.pt-us-linked .wpclv-terms { display: flex; flex-wrap: wrap; gap: 12px; margin: 0; }
.pt-us-linked .wpclv-term {
	border: 1.5px solid var(--ptus-line) !important;
	border-radius: var(--ptus-radius-sm) !important;
	background: #fff !important;
	margin: 0 !important;
	cursor: pointer;
	transition: border-color .15s, box-shadow .15s, opacity .15s;
	line-height: 1.2;
	/* wpclv frontend.css sabitleri: 42px yükseklik + float, padding'imizle taşma yapıyor */
	height: auto !important;
	float: none !important;
}
.pt-us-linked .wpclv-term span,
.pt-us-linked .wpclv-term a {
	/* wpclv'nin gri iç kutusu (bg #efefef, 34px satır) — düz metne indir */
	display: block;
	padding: 0 !important;
	height: auto !important;
	line-height: 1.2 !important;
	background: transparent !important;
	border-radius: 0;
	width: auto;
}
/* XD pill: KARE forma yakın oval köşeli kutu (~96×70), ortalanmış metin; seçili mavi bold */
.pt-us-linked .wpclv-term-button {
	padding: 25px 14px !important;
	min-width: 96px !important;
	text-align: center;
	font-size: 15px;
	font-weight: 400;
	color: var(--ptus-ink);
	border-radius: 16px !important;
}
/* Seçili olmayan termlerin içi <a> (kardeş ürün linki) — tema link rengini alma */
.pt-us-linked .wpclv-term-button a { color: inherit !important; text-decoration: none !important; }
/* XD swatch: çerçeve İÇ span'da (görsel kartı), isim etiketi kartın DIŞINDA altta */
.pt-us-linked .wpclv-term.wpclv-term-image {
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	padding: 0 !important;
	border-radius: 0 !important;
}
/* Tema style.css'i .wpclv-term-image'a width:70px !important basıyor (eski sayfa
   düzeni) — tema DÜZENLENMEZ, daha spesifik seçiciyle ezilir. */
.pt-us-linked .wpclv-attributes .wpclv-terms .wpclv-term.wpclv-term-image {
	min-width: 0 !important;
	width: auto !important;
	height: auto !important;
}
.pt-us-linked .wpclv-term.wpclv-term-image > span,
.pt-us-linked .wpclv-term.wpclv-term-image > a {
	/* Diğer varyant pill'leriyle AYNI kutu: 96×70 */
	display: flex;
	align-items: center;
	justify-content: center;
	width: 96px !important;
	height: 70px !important;
	border: 1.5px solid var(--ptus-line) !important;
	border-radius: 16px !important;
	background: #fff !important;
	padding: 6px !important;
	transition: border-color .15s, box-shadow .15s;
}
.pt-us-linked .wpclv-term.wpclv-term-image:hover > span,
.pt-us-linked .wpclv-term.wpclv-term-image:hover > a { border-color: #c7c7cf !important; }
.pt-us-linked .wpclv-term.wpclv-term-image.active > span,
.pt-us-linked .wpclv-term.wpclv-term-image.active > a {
	border-color: var(--ptus-accent) !important;
	box-shadow: 0 0 0 1px var(--ptus-accent);
}
/* picture sarmalayıcısı flex item olarak tam genişlik alıyor — görseli o ortalar */
.pt-us-linked .wpclv-term-image picture {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
}
.pt-us-linked .wpclv-attributes .wpclv-terms .wpclv-term-image img {
	display: block;
	border-radius: 6px;
	width: auto;
	height: 52px;
	object-fit: contain;
	max-width: 82px; /* kutudan taşmasın */
	margin: 0 auto !important; /* wpclv margin:0!important'ını ez, ortala */
}
/* XD: swatch altında renk adı — wpclv aria-label'ından. hint.css aynı ::after'ı
   hover tooltip'i için kullanıyor; kalıcı etikete çevirmek için ezilir. */
.pt-us-linked .wpclv-term-image::before { display: none !important; } /* tooltip oku */
.pt-us-linked .wpclv-term-image::after {
	content: attr(aria-label) !important;
	position: static !important;
	transform: none !important;
	opacity: 1 !important;
	visibility: visible !important;
	display: block !important;
	background: transparent !important;
	box-shadow: none !important;
	white-space: normal !important;
	padding: 0 !important;
	margin: 5px 0 0 !important;
	text-align: center;
	font-size: 13.5px !important;
	line-height: 1.3;
	font-family: inherit !important;
	color: var(--ptus-ink-soft) !important;
	white-space: nowrap !important;
	text-shadow: none !important; /* hint.css tooltip gölgesi metni kirletiyordu */
	letter-spacing: 0 !important;
}
.pt-us-linked .wpclv-term-image::after { margin-top: 9px !important; }
.pt-us-linked .wpclv-term-image.active::after { color: var(--ptus-ink) !important; font-weight: 700; }
.pt-us-linked .wpclv-term:hover { border-color: #c7c7cf !important; }
.pt-us-linked .wpclv-term.active {
	border-color: var(--ptus-accent) !important;
	box-shadow: 0 0 0 1px var(--ptus-accent);
}
.pt-us-linked .wpclv-term-button.active { color: var(--ptus-accent); font-weight: 700; }
/* Eksik kombinasyon: XD gri pill dili — yıkanmış opaklık YOK, gri metin + normal çerçeve */
.pt-us-linked .wpclv-term.imperfect { opacity: 1; }
.pt-us-linked .wpclv-term-button.imperfect { color: #a1a1a6; }
.pt-us-linked .wpclv-term-button.imperfect:hover { color: var(--ptus-ink); }
.pt-us-linked .wpclv-term-image.imperfect img { opacity: .55; }
.pt-us-linked .wpclv-term-image.imperfect::after { color: #a1a1a6 !important; font-weight: 400; }

/* ---- Hizmetler bölümü — ana başlık ortada (XD), altında DT + hizmet kartları ---- */
.pt-us-services-title {
	text-align: center;
	font-size: 20px;
	margin: 10px 0 14px;
}
.pt-us-services { display: flex; flex-direction: column; gap: 12px; margin-bottom: 12px; }
.pt-us-services:empty { display: none; }

/* ---- Birlikte Al, Tasarruf Et — Hizmetler kartlarıyla aynı dil (XD) ---- */
.pt-us-bundle { margin: 0 0 24px; }
.pt-us-bundle-card {
	border: 1px solid var(--ptus-card-line);
	border-radius: var(--ptus-radius-card);
	background: var(--ptus-card-bg);
	padding: 14px 16px 16px;
}
.pt-us-bundle-head { display: flex; align-items: center; margin-bottom: 6px; }
.pt-us-bundle-title { font-size: 17px; font-weight: 700; color: var(--ptus-ink); }
.pt-us-bundle-desc { font-size: 13.5px; color: var(--ptus-ink-soft); line-height: 1.5; margin: 0 0 14px; }
.pt-us-bundle-items { display: flex; flex-direction: column; gap: 10px; }
.pt-us-bundle-item {
	appearance: none;
	display: flex;
	align-items: center;
	gap: 14px;
	width: 100%;
	border: 2px solid #fff;
	background: #fff;
	border-radius: 10px;
	/* Blok "çok dar" bulundu: satır nefesi ve görsel ağırlığı arttırıldı. */
	padding: 13px 14px;
	font: inherit;
	cursor: pointer;
	text-align: left;
	transition: border-color .15s;
}
.pt-us-bundle-item:focus-visible { outline: 2px solid var(--ptus-accent); outline-offset: 2px; }
.pt-us-bundle-item:hover { border-color: #c9d8f0; }
.pt-us-bundle-item.is-selected { border-color: var(--ptus-accent); }
/* XD'de işaret kutusu yok — satır seçimi çerçeve + buton metniyle anlatılır */
.pt-us-bundle-check { display: none; }
/* Katalog görselleri 247×296 (dikey). Kare kutuya `contain` ile oturunca yanlarda
   gri bantlar kalıyor ve ürün boşlukta duruyordu. Çözüm: kutu BEYAZ (ürünler beyaz
   fonda çekiliyor), ince çerçeve ve iç boşlukla bilinçli bir "ürün karesi" oluyor. */
.pt-us-bundle-thumb {
	width: 68px; height: 68px;
	object-fit: contain;
	border-radius: 10px;
	background: #fff;
	border: 1px solid var(--ptus-line);
	padding: 5px;
	flex: 0 0 auto;
}
.pt-us-bundle-info { display: flex; flex-direction: column; gap: 4px; min-width: 0; flex: 1 1 auto; }
.pt-us-bundle-name {
	font-size: 14.5px;
	font-weight: 500;
	color: var(--ptus-ink);
	line-height: 1.35;
}
/* Ürün adı ayrı bir link: kartı seçmez, ürünü yeni sekmede açar. */
.pt-us-bundle-name a { color: inherit; text-decoration: none; }
.pt-us-bundle-name a:hover { color: var(--ptus-accent); text-decoration: underline; }
.pt-us-bundle-prices { display: flex; align-items: baseline; gap: 8px; font-size: 15px; flex-wrap: wrap; }
.pt-us-bundle-prices b { color: var(--ptus-ink); font-weight: 700; }
.pt-us-bundle-save {
	font-style: normal;
	font-size: 11.5px;
	font-weight: 700;
	color: var(--ptus-green);
	background: rgba(26,127,55,.10);
	border-radius: 6px;
	padding: 1px 7px;
}
/* Satır sonundaki sahte buton — seçimle metni değişir */
.pt-us-bundle-cta {
	flex: 0 0 auto;
	background: var(--ptus-accent);
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	line-height: 1;
	padding: 9px 14px;
	border-radius: 8px;
	white-space: nowrap;
	transition: background .15s;
}
.pt-us-bundle-cta::after { content: "Birlikte Al"; }
.pt-us-bundle-item.is-selected .pt-us-bundle-cta { background: var(--ptus-ink); }
.pt-us-bundle-item.is-selected .pt-us-bundle-cta::after { content: "Eklendi ✓"; }

/* ---- Satın alma bloğu ---- */
.pt-us-purchase {
	border-top: 1px solid var(--ptus-line);
	padding-top: 18px;
	margin-top: 4px;
}
/* Özet dökümü — yumuşak zemin kartı; baz ürün koyu, hizmet satırları sakin gri,
   eklenen tutarlar yeşil "+" ile. */
.pt-us-summary-lines {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-bottom: 14px;
	background: var(--ptus-bg-soft);
	border-radius: var(--ptus-radius-sm);
	padding: 13px 16px;
}
.pt-us-summary-lines:has(> .pt-us-line--base:only-child) { background: transparent; padding: 0; }
.pt-us-line { display: flex; justify-content: space-between; align-items: baseline; font-size: 13.5px; gap: 12px; }
.pt-us-line--base { font-size: 14px; }
.pt-us-line--base .pt-us-line-name { color: var(--ptus-ink); font-weight: 600; }
.pt-us-line-name { color: var(--ptus-ink-soft); }
/* Hizmetler birim fiyata eklendiği için adetle çarpılır; çarpan görünür olmalı. */
.pt-us-line-mult {
	flex: 0 0 auto;
	margin-left: -6px;
	margin-right: auto;
	font-size: 11.5px;
	font-weight: 600;
	color: var(--ptus-ink-soft);
	background: rgba(0, 0, 0, .05);
	border-radius: 5px;
	padding: 1px 6px;
	white-space: nowrap;
}
.pt-us-line-price { font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; }
.pt-us-line--service { animation: ptus-linein .22s ease; }
.pt-us-line--service .pt-us-line-price { color: var(--ptus-ink); }
@keyframes ptus-linein {
	from { opacity: 0; transform: translateY(-3px); }
	to { opacity: 1; transform: translateY(0); }
}
.pt-us-subtotal {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	margin-bottom: 16px;
	padding-top: 12px;
	border-top: 1px solid var(--ptus-line-soft);
}
.pt-us-subtotal span { font-size: 15px; color: var(--ptus-ink-soft); }
.pt-us-subtotal-amount {
	font-size: 26px;
	font-weight: 700;
	letter-spacing: -0.02em;
	font-variant-numeric: tabular-nums;
}
.pt-us-subtotal-amount.is-bump { animation: ptus-bump .3s ease; }
@keyframes ptus-bump {
	0% { transform: scale(1); }
	40% { transform: scale(1.045); }
	100% { transform: scale(1); }
}

.pt-us-buy { display: flex; gap: 12px; align-items: stretch; }

/* Adet — hap biçimli segmented stepper. Tema input stilleri (genişlik,
   çerçeve, gölge) daha spesifik seçicilerle SIFIRLANIR. */
.pt-us-qty {
	display: inline-flex;
	align-items: center;
	border: 1.5px solid var(--ptus-line);
	border-radius: var(--ptus-pill);
	overflow: hidden;
	flex: 0 0 auto;
	background: #fff;
	height: 54px;
}
.pt-us .pt-us-qty .pt-us-qty-btn {
	appearance: none;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 0;
	margin: 0;
	padding: 0;
	background: transparent;
	box-shadow: none;
	border-radius: 0;
	width: 46px;
	height: 100%;
	min-height: 0;
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
	color: var(--ptus-ink);
	transition: background .15s;
}
.pt-us .pt-us-qty .pt-us-qty-btn:hover { background: var(--ptus-bg-soft); }
.pt-us .pt-us-qty input.pt-us-qty-input {
	width: 40px;
	min-width: 0;
	max-width: 40px;
	height: 100%;
	margin: 0;
	padding: 0;
	border: 0 !important;         /* tema input[type=number] çerçevesini ez */
	box-shadow: none !important;  /* tema inset gölgesini ez */
	background: transparent !important;
	border-radius: 0;
	text-align: center;
	font-size: 16px;
	font-weight: 700;
	color: var(--ptus-ink);
	-moz-appearance: textfield;
}
.pt-us .pt-us-qty input.pt-us-qty-input:focus { outline: none; }
.pt-us-qty-input::-webkit-outer-spin-button,
.pt-us-qty-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.pt-us-cart-btn {
	appearance: none;
	border: 0;
	flex: 1 1 auto;
	background: var(--ptus-accent);
	color: #fff;
	font-size: 16px;
	font-weight: 700;
	border-radius: var(--ptus-pill);
	cursor: pointer;
	min-height: 54px;
	transition: background .15s, transform .05s;
}
.pt-us-cart-btn:hover { background: var(--ptus-accent-dk); }
.pt-us-cart-btn:active { transform: scale(.99); }
.pt-us-cart-btn:disabled { background: #c7c7cf; cursor: not-allowed; }

/* ---- Native WC formunu gizle (buton grid sürer) ---- */
.pt-us-native {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
}

/* ---- Sabit satın alma barı — yüzen kapsül (desktop + mobil) ---- */
.pt-us-stickybar {
	position: fixed;
	/* Soldan geniş pay: chat balonu (tawk) ile çakışmaz. */
	left: 96px;
	right: 24px;
	/* Çerez bildirimi (.flatsome-cookies, z:999) ekranın altına sabit ve barı
	   örtüyordu. Z-index savaşı yerine barı yukarı kaldırıyoruz: JS bandın
	   yüksekliğini --ptus-sb-offset'e yazar, banner kapanınca 0'a döner. */
	bottom: calc(20px + var(--ptus-sb-offset, 0px));
	z-index: 998;
	transition: bottom .2s ease;
	max-width: 1040px;
	margin: 0 auto;
	/* Opak beyaz: blur/şeffaflık içerik üstünde kirli görünüyordu. */
	background: #fff;
	border: 1px solid var(--ptus-line);
	border-radius: 22px;
	box-shadow: 0 20px 60px rgba(0, 0, 0, .18), 0 4px 14px rgba(0, 0, 0, .06);
	animation: ptus-floatin .28s ease;
}
@keyframes ptus-floatin {
	from { transform: translateY(16px); opacity: 0; }
	to { transform: translateY(0); opacity: 1; }
}
.pt-us-sb-inner {
	display: flex;
	align-items: center;
	gap: 18px;
	padding: 10px 12px 10px 12px;
	/* Bloklar farklı satır sayısına sahip (ürün 2, kargo 2, toplam 3);
	   ortak bir yükseklik vermek dikey kaymayı bitiriyor. */
	min-height: 62px;
}
/* Ürün bloğu: görsel solda, sağında isim + seçili konfigürasyon satırı */
.pt-us-sb-product {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	column-gap: 12px;
	row-gap: 2px;
	align-items: center;
	min-width: 0;
	/* Ortadaki boşluğu kapatır: isim bloğu gereğinden fazla yayılmaz. */
	flex: 0 1 auto;
	max-width: 40%;
}
.pt-us-sb-img {
	grid-row: 1 / 3;
	width: 46px; height: 46px;
	object-fit: contain;
	border-radius: 12px;
	background: #fff;
	border: 1px solid var(--ptus-line);
	flex: 0 0 auto;
	padding: 4px;
}
.pt-us-sb-dot {
	grid-row: 1 / 3;
	width: 46px; height: 46px; border-radius: 12px; flex: 0 0 auto;
	border: 1px solid var(--ptus-line);
	background: #fff url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%236e6e73" stroke-width="1.6"><rect x="3" y="5" width="18" height="12" rx="1.5"/><path d="M2 20h20"/></svg>') center/22px no-repeat;
}
.pt-us-sb-name {
	font-weight: 600;
	font-size: 14px;
	line-height: 1.25;
	letter-spacing: -0.01em;
	color: var(--ptus-ink);
	/* Ad karakter bütçesiyle kısaltılıyor; bu yine de son güvenlik ağı. */
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	min-width: 0;
}
/* Konfigürasyon özeti: chip kutuları yerine sakin "14 inç · M5 · 16GB" satırı */
.pt-us-sb-chips { display: flex; flex-wrap: nowrap; overflow: hidden; min-width: 0; }
.pt-us-sb-chips:empty { display: none; }
.pt-us-sb-chips span {
	font-size: 11.5px; line-height: 1.25; color: var(--ptus-ink-soft);
	white-space: nowrap; background: none; padding: 0;
}
.pt-us-sb-chips span:not(:last-child)::after { content: "·"; margin: 0 6px; color: #c7c7cf; }
/* Kargo bloğu — Toplam bloğuyla simetrik: küçük gri etiket + koyu değer */
.pt-us-sb-ship {
	display: flex; align-items: center; gap: 10px;
	margin-left: auto;
	white-space: nowrap; /* kapsül tek satır kalsın, bar şişmesin */
}
@media (max-width: 1280px) {
	.pt-us-sb-ship { display: none; }
}
.pt-us-sb-ship svg {
	box-sizing: content-box;
	color: var(--ptus-accent);
	background: var(--ptus-bg-soft);
	border-radius: 12px;
	padding: 8px;
	flex: 0 0 auto;
}
/* Kargo ve Toplam blokları aynı tipografik ritmi paylaşır: küçük gri etiket
   satırı üstte, değer altta, satır yükseklikleri eşit. Ömer/Uğur'un bildirdiği
   dikey kayma buradaki farklı line-height'lardan geliyordu. */
.pt-us-sb-ship-text { display: flex; flex-direction: column; justify-content: center; gap: 2px; }
.pt-us-sb-ship-text em { font-style: normal; font-size: 11px; line-height: 1.3; color: var(--ptus-ink-soft); }
.pt-us-sb-ship-text b { font-size: 13.5px; line-height: 1.3; font-weight: 600; color: var(--ptus-ink); }

.pt-us-sb-buy {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-left: 8px;
	/* Kargo bloğundan ayıran ince dikey çizgi — barın sağ tarafını gruplar. */
	padding-left: 20px;
	border-left: 1px solid var(--ptus-line);
}
.pt-us-sb-total { display: flex; flex-direction: column; justify-content: center; gap: 2px; text-align: right; }
.pt-us-sb-total span { font-size: 11px; line-height: 1.3; color: var(--ptus-ink-soft); }
.pt-us-sb-total strong { font-size: 20px; line-height: 1.2; font-weight: 700; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.pt-us-sb-inst {
	font-style: normal;
	font-size: 11px;
	line-height: 1.3;
	font-weight: 600;
	color: var(--ptus-accent);
	white-space: nowrap;
}
.pt-us-sb-btn {
	/* Tema global button kuralı margin-bottom:15px veriyor; flex ortalaması
	   bunu sayınca buton bardaki diğer bloklardan 8px yukarıda duruyordu. */
	margin: 0;
	appearance: none; border: 0;
	background: var(--ptus-accent); color: #fff;
	font-size: 15px; font-weight: 700;
	padding: 14px 32px; border-radius: var(--ptus-pill);
	cursor: pointer; white-space: nowrap;
	transition: background .15s, transform .05s;
}
.pt-us-sb-btn:hover { background: var(--ptus-accent-dk); }
.pt-us-sb-btn:active { transform: scale(.98); }
.pt-us-sb-btn:disabled { background: #c7c7cf; cursor: not-allowed; transform: none; }

@media (max-width: 991px) {
	.pt-us-stickybar {
		left: 12px;
		right: 12px;
		bottom: calc(12px + var(--ptus-sb-offset, 0px) + env(safe-area-inset-bottom));
		border-radius: 20px;
	}
	.pt-us-sb-inner { gap: 12px; padding: 8px 8px 8px 76px; min-height: 0; } /* sol pay: chat balonu */
	.pt-us-sb-ship { display: none; }
	.pt-us-sb-chips { display: none; }
	.pt-us-sb-dot { display: none; }
	.pt-us-sb-name { display: none; }
	.pt-us-sb-product { display: none; }
	/* Tek blok kaldığı için ayırıcı çizgiye gerek yok. */
	.pt-us-sb-buy { margin-left: auto; gap: 12px; flex: 1 1 auto; justify-content: space-between; padding-left: 0; border-left: 0; }
	.pt-us-sb-total span { display: block; }
	/* "Bu ürün için toplam" mobilde uzun kalıyor: tutar ve butona alan bırakmak için
	   etiket küçülür ve gerekirse iki satıra iner; tutar asla kırpılmaz. */
	.pt-us-sb-total { text-align: left; min-width: 0; flex: 1 1 auto; }
	.pt-us-sb-total span { font-size: 10.5px; line-height: 1.25; }
	.pt-us-sb-total strong { font-size: 18px; white-space: nowrap; }
	.pt-us-sb-inst { font-size: 10.5px; }
	.pt-us-sb-btn { padding: 13px 22px; flex: 0 0 auto; }
}

/* =========================================================================
   Layout — flag'li sayfada sidebar gizle, galeri + özet iki kolon
   ========================================================================= */
.pt-us-active .product-page-wrapper .col.large-3,
.pt-us-active #secondary.widget-area,
.pt-us-active .single-product .related.products ~ aside { display: none; }

/* Tema'nın kendi sticky add-to-cart barını flag'li sayfada gizle (kendi barımız var) */
.pt-us-active .sticky-add-to-cart-pt,
.pt-us-active .sticky-add-to-cart { display: none !important; }

/* Galeri sticky — saf CSS. Flatsome'da sol kolon (.product-gallery.col) flex row
   içinde özet yüksekliğine uzar; .product-images (rozet + galeri) o kolonun içinde
   scroll boyunca yapışır, kolonun sonunda doğal olarak bırakır. */
@media (min-width: 992px) {
	/* Sticky kolonun KENDİSİ olmalı: thumbnail şeridi .product-images'ın kardeşi —
	   sadece .product-images yapışırsa görsel, thumb'ların üstüne kayıyor.
	   align-self: flex-start şart; yoksa flex kolon satır boyuna uzar ve
	   sticky'ye kayacak yer kalmaz. */
	.pt-us-active .product-main .product-gallery {
		position: sticky;
		/* Üst pay JS'te gerçek header alt sınırından ölçülür (admin bar +
		   kampanya bandı + küçülen sticky header hepsi hesaba girer). */
		top: var(--ptus-sticky-top, 110px);
		align-self: flex-start;
	}
}

/* Görsel alanı — kart diliyle aynı oval köşeler */
.pt-us-active .product-images {
	border-radius: var(--ptus-radius);
	overflow: hidden;
}

/* ---- Köşe şeritleri (ribbon) ----
   Tema'nın ürün rozetleri ("M5", "Yakında Sizlerle!", "Outlet") 45° döndürülüp
   kutunun DIŞINA taşan clip-path'li şeritler (themes/pt/style.css). Yeni sayfada
   .product-images'a oval köşe + overflow:hidden verdiğimiz an bu şeritler
   kırpılıyor ve "patlak" görünüyorlar — yarısı görünüyor, yazı kesiliyor.

   Çözüm z-index/overflow oyunu DEĞİL: aynı sorunu fiyat kartındaki "Eğitim
   İndirimi" rozetinde de yaşadık ve orada da şeridi düz bir hapa çevirdik
   (bkz. .pt-us-ribbon). Burada da aynı dil: kutunun İÇİNDE, sol üstte,
   tamamen görünür, okunur bir etiket. Tema DÜZENLENMİYOR — yalnız
   .pt-us-active altında eziliyor, eski ürün sayfaları olduğu gibi kalıyor.

   Ezilmesi gereken her şey tek tek yazılı: dönüş, kırpma, kenar-görseli ve
   `padding-inline: 1lh` (satır yüksekliğine bağlı devasa yan boşluk). */
.pt-us-active .product-images .ribbon,
.pt-us-active .product-images .ribbon-outlet,
.pt-us-active .product-images .ribbon-coming-soon,
.pt-us-active .product-images .ribbon-product-message,
.pt-us-active .product-images .ribbon-product-outlet,
.pt-us-active .product-images .ribbon-product-page-outlet,
.pt-us-active .product-small.box > .ribbon,
.pt-us-active .product-small.box > .ribbon-outlet,
.pt-us-active .product-small.box > .ribbon-coming-soon,
.pt-us-active .product-small.box > .ribbon-product-message,
.pt-us-active .product-small.box > .ribbon-product-outlet {
	position: absolute;
	top: 14px;
	left: 14px;
	right: auto;
	transform: none;
	clip-path: none;
	border-image: none;
	border: 0;
	padding: 7px 13px;
	padding-inline: 13px;
	border-radius: 999px;
	white-space: nowrap;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .14);
	/* Tema bu iki değeri ≤600px'te !important ile basıyor (.ribbon-product-outlet);
	   spesifiklik yetmiyor, aynı silahla eziliyor. */
	font-size: 13px !important;
	line-height: 1.25 !important;
	font-weight: 700;
	letter-spacing: .01em;
}

/* `.ribbon-coming-soon` yukarıdakilerden FARKLI kuruluyor: kutunun soluna
   TAŞMAK üzere `left: calc(-1*var(--f))` alıyor ve şeklini clip-path + iki
   kenarlıkla (`border-bottom`/`border-right`) çiziyor. Bu yüzden ortak
   sıfırlama yetmiyor; taşma ve kenarlıklar ayrıca kapatılıyor.
   Renk DOKUNULMUYOR: `.ribbon-color-*` sınıfları `background-color`u
   `!important` ile basıyor, şerit rengi korunsun. */
.pt-us-active .product-images .ribbon-coming-soon,
.pt-us-active .product-small.box > .ribbon-coming-soon {
	--f: 0;
	--r: 0;
	border-bottom: 0;
	border-right: 0;
}

/* Öneri/ilgili ürün kartları küçük: aynı hap, bir tık kısılmış ölçüyle.
   Kart `overflow: hidden` taşıdığı için (oval köşe) şerit kutunun İÇİNDE
   kalmak zorunda — canlıda "İngilizce (US) Klavye" etiketi soldan kesiliyordu. */
.pt-us-active .product-small.box > .ribbon,
.pt-us-active .product-small.box > .ribbon-outlet,
.pt-us-active .product-small.box > .ribbon-coming-soon,
.pt-us-active .product-small.box > .ribbon-product-message,
.pt-us-active .product-small.box > .ribbon-product-outlet {
	top: 10px;
	left: 10px;
	padding: 5px 10px;
	padding-inline: 10px;
	font-size: 11.5px !important;
	line-height: 1.2 !important;
	/* Kartın yarısını kaplamasın; uzun etiket kırpılmadan iki satıra insin. */
	max-width: calc(100% - 20px);
	white-space: normal;
}
/* Özel konfigürasyon uyarı bandı (galeri üstü yeşil kutu) — aynı ovallik */
.pt-us-active .product-gallery .custom-message {
	border-radius: var(--ptus-radius);
	overflow: hidden;
}
/* Thumbnail çerçevesi img'yi saran anonim span'da (1px çerçeve + overflow:hidden) —
   radius img'e değil ONA verilmeli, yoksa köşeler kare kalıyor. */
.pt-us-active .product-thumbnails img { border-radius: var(--ptus-radius-sm); }
.pt-us-active .product-thumbnails .col > a > span,
.pt-us-active .product-thumbnails .col span { border-radius: var(--ptus-radius-sm); }

@media (min-width: 992px) {
}

/* =========================================================================
   Alt bölümler — sekmeler, paneller, öneri ürün kartları (aynı tasarım dili)
   ========================================================================= */

/* Sekme navigasyonu → hap biçimli chip'ler.
   TEK SATIR kilidi: alta kayma yok; sığmazsa görünmez yatay kaydırma. */
.pt-us-active .woocommerce-tabs ul.tabs.wc-tabs {
	display: flex;
	flex-wrap: nowrap;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	gap: 8px;
	border: 0;
	margin: 0 0 16px;
	padding: 0 0 2px;
}
.pt-us-active .woocommerce-tabs ul.tabs.wc-tabs::-webkit-scrollbar { display: none; }
.pt-us-active .woocommerce-tabs ul.tabs.wc-tabs li {
	margin: 0;
	border: 0;
	background: none;
	padding: 0;
}
.pt-us-active .woocommerce-tabs ul.tabs.wc-tabs li a {
	display: inline-flex;
	align-items: center;
	border: 1.5px solid var(--ptus-line);
	border-radius: var(--ptus-pill);
	background: #fff;
	color: var(--ptus-ink-soft);
	font-size: 13.5px;
	font-weight: 600;
	line-height: 1.2;
	padding: 10px 18px;
	white-space: nowrap; /* chip metni kırılmasın — satır kilidi bozulur */
	transition: border-color .15s, background .15s, color .15s;
}
.pt-us-active .woocommerce-tabs ul.tabs.wc-tabs li a:hover { border-color: #c7c7cf; color: var(--ptus-ink); }
/* custom_tab (Özel Konfigurasyon) kendi kırmızı background'ını basıyor —
   tasarım dilinde aktif chip TEK renk: koyu mürekkep. Hedefli important. */
.pt-us-active .woocommerce-tabs ul.tabs.wc-tabs li.active a {
	background: var(--ptus-ink) !important;
	border-color: var(--ptus-ink) !important;
	color: #fff !important;
}
.pt-us-active .woocommerce-tabs ul.tabs.wc-tabs li a::before,
.pt-us-active .woocommerce-tabs ul.tabs.wc-tabs li a::after { display: none; }

/* Panel içeriği → yumuşak kart. Flatsome'un .tab-panels sarmalayıcısındaki
   çerçeve + 30px padding kaldırılır — yoksa çift çerçeve oluşuyor. */
.pt-us-active .woocommerce-tabs { border: 0; }
.pt-us-active .woocommerce-tabs .tab-panels {
	border: 0;
	padding: 0;
	background: transparent;
}
.pt-us-active .woocommerce-tabs .woocommerce-Tabs-panel {
	border: 1px solid var(--ptus-line);
	border-radius: var(--ptus-radius);
	background: #fff;
	padding: 24px 26px;
}

/* "Bunlar da İlginizi Çekebilir" (WC Product Recommendations) başlığı —
   bölüm başlıklarıyla aynı tipografi. */
.pt-us-active .wc-prl-title,
.pt-us-active .wc-prl-title.h2 {
	font-size: 19px;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--ptus-ink);
	text-align: left;
	margin: 0 0 16px;
}

/* Öneri / ilgili ürün kartları → oval köşeli sakin kartlar */
.pt-us-active .product-small.box {
	border: 1px solid var(--ptus-line);
	border-radius: var(--ptus-radius);
	overflow: hidden;
	background: #fff;
	transition: box-shadow .2s, border-color .2s;
}
.pt-us-active .product-small.box:hover { box-shadow: var(--ptus-shadow); border-color: #d5d5db; }
/* Flatsome .row-box-shadow-*-hover satırı gölgeyi KÖŞELİ .col-inner'a basıyor —
   oval kartın etrafında kare halo yapıyordu. Gölge kartta (.box) kalır. */
.pt-us-active .products.row .col:hover .col-inner,
.pt-us-active .wc-prl-recommendations .col:hover .col-inner { box-shadow: none !important; }
.pt-us-active .products.row .col-inner { border-radius: var(--ptus-radius); }
.pt-us-active .product-small.box .box-text { padding: 4px 12px 14px; }
.pt-us-active .product-small.box .button,
.pt-us-active .product-small.box .add_to_cart_button {
	border-radius: var(--ptus-pill);
}
/* Fiyat satırı: SKT çipi fiyatın altına sarınca sabit 24px yükseklik taşıp
   "Sepete Ekle" butonunun ÜSTÜNE biniyordu — yükseklik serbest, dikey akış. */
.pt-us-active .product-small .price-wrapper {
	height: auto !important;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 3px;
}
.pt-us-active .product-small .price-wrapper .pt-admin-skt { margin: 0; border-radius: 6px; }

/* ---- Değerlendirmeler (reviews) — kart dilinde sakin görünüm ---- */
.pt-us-active .woocommerce-Reviews .woocommerce-Reviews-title {
	font-size: 17px;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--ptus-ink);
	margin: 0 0 10px;
}
.pt-us-active .woocommerce-Reviews .woocommerce-noreviews {
	font-size: 13.5px;
	color: var(--ptus-ink-soft);
	margin: 0 0 4px;
}
/* Yorum listesi — her yorum yumuşak kart */
.pt-us-active .woocommerce-Reviews .commentlist {
	list-style: none;
	margin: 0 0 18px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.pt-us-active .woocommerce-Reviews .commentlist li { margin: 0; }
.pt-us-active .woocommerce-Reviews .commentlist .comment_container {
	display: flex;
	gap: 14px;
	align-items: flex-start;
	background: #fff;
	border: 1px solid var(--ptus-line);
	border-radius: 14px;
	padding: 14px 16px;
}
.pt-us-active .woocommerce-Reviews .commentlist img.avatar {
	width: 40px; height: 40px;
	border-radius: 50%;
	flex: 0 0 auto;
	position: static;
	padding: 0;
	border: 0;
	background: var(--ptus-bg-soft);
}
.pt-us-active .woocommerce-Reviews .comment-text {
	margin: 0;
	border: 0;
	padding: 0;
	flex: 1 1 auto;
}
.pt-us-active .woocommerce-Reviews .comment-text .meta {
	font-size: 13px;
	color: var(--ptus-ink-soft);
	margin: 2px 0 6px;
}
.pt-us-active .woocommerce-Reviews .comment-text .meta strong { color: var(--ptus-ink); }
.pt-us-active .woocommerce-Reviews .comment-text .description { font-size: 13.5px; line-height: 1.55; }
.pt-us-active .woocommerce-Reviews .star-rating { color: #f5a623; }
/* "Satın almış müşteriler yorum yapabilir" notu — mavi vurgulu kutu yerine sakin gri */
.pt-us-active .woocommerce-Reviews #review_form_wrapper,
.pt-us-active .woocommerce-Reviews #respond,
.pt-us-active .woocommerce-Reviews .review-form-inner,
.pt-us-active .woocommerce-Reviews .review-form-inner.has-border {
	border: 0 !important;
	background: transparent !important;
	padding: 0 !important;
	box-shadow: none !important;
	border-radius: 0;
}
.pt-us-active .woocommerce-Reviews .woocommerce-verification-required {
	background: var(--ptus-bg-soft);
	border: 0 !important;
	border-radius: var(--ptus-radius-sm);
	padding: 12px 16px !important;
	font-size: 13px;
	color: var(--ptus-ink-soft);
	margin: 0;
}
/* Yorum formu görünürse: alanlar tasarım dilinde */
.pt-us-active .woocommerce-Reviews #respond input[type="text"],
.pt-us-active .woocommerce-Reviews #respond input[type="email"],
.pt-us-active .woocommerce-Reviews #respond textarea {
	height: auto;
	padding: 10px 14px;
	font-size: 13.5px;
	border: 1px solid #d2d2d7;
	border-radius: var(--ptus-radius-sm);
	background: #fff;
	box-shadow: none;
}
.pt-us-active .woocommerce-Reviews #respond input:focus,
.pt-us-active .woocommerce-Reviews #respond textarea:focus {
	outline: none;
	border-color: var(--ptus-accent);
	box-shadow: 0 0 0 3px rgba(22, 94, 201, .12);
}
.pt-us-active .woocommerce-Reviews #respond .form-submit input[type="submit"] {
	background: var(--ptus-accent);
	color: #fff;
	font-weight: 600;
	border: 0;
	border-radius: var(--ptus-pill);
	padding: 11px 24px;
}
.pt-us-active .woocommerce-Reviews #respond .form-submit input[type="submit"]:hover { background: var(--ptus-accent-dk); }

/* ---- Responsive ---- */
@media (max-width: 991px) {
	.pt-us { max-width: 100%; }
	.pt-us-title { font-size: 24px; }
	.pt-us-pricecard--edu .pt-us-price-value { font-size: 26px; }
	.pt-us-native .single_add_to_cart_button { } /* native gizli kalır */
	body.pt-us-active { padding-bottom: 92px; } /* yüzen mobil bar payı */
	.pt-us-active .woocommerce-tabs .woocommerce-Tabs-panel { padding: 18px 16px; }
}
@media (max-width: 600px) {
	.pt-us-title { font-size: 21px; }

	/* Kimlik satırı mobilde TEK SATIR: 390px'te "Marka: Apple  Ürün Kodu:
	   MD4E4TU/A  Teslimat: 1-2 İş Günü" sığmıyor ve üç parça alt alta iniyordu.
	   Etiketler atılır, DEĞERLER kalır: "Apple  MD4E4TU/A  Teslimat: 1-2 İş
	   Günü". Marka ve ürün kodu etiketsiz de okunuyor; "Teslimat:" kalır çünkü
	   "1-2 İş Günü" tek başına neyin süresi olduğunu söylemiyor. */
	.pt-us-idrow { font-size: 12px; gap: 4px 12px; flex-wrap: nowrap; }
	.pt-us-idlabel { display: none; }
	.pt-us-idlabel--keep { display: inline; }
	/* Son çare: aşırı uzun bir SKU'da satır taşmasın, kod kısalsın. */
	.pt-us-idrow .pt-us-code { overflow: hidden; text-overflow: ellipsis; min-width: 0; }

	/* Fiyat kartları mobil */
	.pt-us-pricecard { padding: 14px 16px; }

	/* Rozet + pill tek satır düzeni artık masaüstünde de var (yukarıya bak);
	   mobilde yalnız ölçüler kısılıyor ki 390px'lik kartta ikisi yan yana sığsın. */
	.pt-us-card-head { gap: 8px; }
	.pt-us-card-head .pt-us-ribbon { font-size: 11px; padding: 6px 10px; }
	.pt-us-card-head .pt-us-pill { font-size: 11px; padding: 5px 9px; }
	.pt-us-havale-line { font-size: 12.5px; }
	.pt-us-havale-value { font-size: 14px; }
	.pt-us-pricecard.is-selected .pt-us-price-value { font-size: 28px; }
	.pt-us-pricecard--edu:not(.is-selected) .pt-us-price-value,
	.pt-us-pricecard--bireysel:not(.is-selected) .pt-us-price-value { font-size: 19px; }
	.pt-us-pricecard--bireysel:not(.is-selected) { padding: 12px 16px; }
	.pt-us-installment { font-size: 12px; flex-wrap: wrap; }

	/* Özet + satın alma mobil */
	.pt-us-summary-lines { padding: 12px 14px; }
	.pt-us-subtotal-amount { font-size: 23px; }
	.pt-us-buy { flex-wrap: wrap; gap: 10px; }
	.pt-us-qty { height: 48px; }
	.pt-us .pt-us-qty .pt-us-qty-btn { width: 42px; font-size: 18px; }
	.pt-us-cart-btn { width: 100%; flex-basis: 100%; min-height: 50px; }

	/* Bundle mobil */
	.pt-us-bundle-item { padding: 11px 11px; gap: 11px; flex-wrap: wrap; }
	.pt-us-bundle-thumb { width: 56px; height: 56px; }
	.pt-us-bundle-title { font-size: 15.5px; }
	.pt-us-bundle-name { font-size: 13.5px; }
	.pt-us-bundle-prices { font-size: 14px; }
	.pt-us-bundle-cta { margin-left: auto; }

	/* ---- Yetkili rozetleri mobil ----
	   Eski kural üç rozet dönemindendi: repeat(3, 1fr) ızgara + ikon üstte,
	   metin altında. Rozet ikiye inince ızgara sağda boş bir sütun bırakıyor,
	   "Yetkili Servis Sağlayıcısı" iki satıra bölünüyor ve iki elma işareti
	   ortada asılı kalıyordu — dağınık görünüyordu.
	   Mobilde de masaüstündeki dil: ikon SOLDA, metin yanında, iki rozet yan
	   yana tek satır. 390px'te 11,5px punto ile ikisi rahat sığar. */
	.pt-us-badges {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		align-items: center;
		gap: 8px 18px;
		margin-bottom: 16px;
	}
	.pt-us-badge {
		flex-direction: row;
		gap: 6px;
		/* 13,5px: iki rozet + iki elma 390px ekranda ~291px sürüyor, 360px
		   ekranda bile tek satırda kalıyor. Daha büyüğü (15px) 360px'te sarıyor. */
		font-size: 13.5px;
		line-height: 1.2;
	}
	.pt-us-badge span { text-align: left; }
	.pt-us-apple { width: 15px; height: 18px; }

	/* ---- Seçenek kutuları (WPClever) mobil ----
	   4 seçenekli bir seçici (renkler) 96px'lik kutularla ikinci satıra düşüyor
	   ve sayfayı bir kutu boyu uzatıyordu. Mobilde kutular 4'ü tek satıra
	   sığdıracak ölçüde kısılır: 4 × 72 + 3 × 8 = 312px (390px ekranda kolon
	   ~330px). 3 seçenekli seçiciler de aynı ölçüye iner, seçiciler arası
	   ritim bozulmasın. */
	.pt-us-linked .wpclv-terms { gap: 8px; }
	.pt-us-linked .wpclv-term.wpclv-term-image > span,
	.pt-us-linked .wpclv-term.wpclv-term-image > a {
		width: 72px !important;
		height: 64px !important;
		padding: 5px !important;
	}
	.pt-us-linked .wpclv-attributes .wpclv-terms .wpclv-term-image img {
		height: 46px;
		max-width: 60px;
	}
	.pt-us-linked .wpclv-term-image::after { font-size: 12px !important; margin-top: 7px !important; }
	/* Metinli seçiciler (Bağlantı Türü, Depolama…) renk swatch'ıyla AYNI kutu:
	   72×64. Ölçüyü padding'le kurmak metin uzunluğuna göre farklı yükseklik
	   veriyordu ("Wi-Fi" ile "Wi-Fi + Cell" aynı satırda farklı boyda); kutu
	   sabit, metin flex ile ortalanıyor. Uzun etiket yalnız ENİNE büyür. */
	.pt-us-linked .wpclv-term-button {
		display: flex !important;
		align-items: center;
		justify-content: center;
		min-width: 72px !important;
		min-height: 64px !important;
		padding: 6px 10px !important;
		font-size: 14px;
	}
	.pt-us-linked .wpclv-term-button span,
	.pt-us-linked .wpclv-term-button a { text-align: center; }
	.pt-us-linked .wpclv-attribute-label { font-size: 16px; }
	.pt-us-varopt {
		display: flex;
		align-items: center;
		justify-content: center;
		min-width: 72px;
		min-height: 64px;
		padding: 6px 10px;
		font-size: 14px;
	}

	/* Sekme chip'leri mobil: yatay kaydırılabilir tek satır */
	.pt-us-active .woocommerce-tabs ul.tabs.wc-tabs {
		flex-wrap: nowrap;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		padding-bottom: 4px;
	}
	.pt-us-active .woocommerce-tabs ul.tabs.wc-tabs::-webkit-scrollbar { display: none; }
	.pt-us-active .woocommerce-tabs ul.tabs.wc-tabs li a { white-space: nowrap; padding: 9px 14px; font-size: 12.5px; }
}

/* =========================================================================
   Modal — taksit/ödeme seçenekleri ve eğitim indirimi bilgilendirmesi.
   Kabuklar wp_footer'da basılır (class-pt-us-modal.php); .pt-us dışında
   olduğu için seçiciler kendi başına ayakta durur.
   ========================================================================= */
body.pt-us-modal-open { overflow: hidden; }

.pt-us-modal {
	position: fixed;
	inset: 0;
	/* Flatsome'ın sticky header'ı (z:999) ve çerez bandının üstünde kalmalı. */
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
}
.pt-us-modal[hidden] { display: none; }

.pt-us-modal-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, .45);
	animation: ptus-modal-fade .18s ease;
}

.pt-us-modal-panel {
	position: relative;
	width: 100%;
	max-width: 620px;
	max-height: min(84vh, 760px);
	display: flex;
	flex-direction: column;
	background: #fff;
	border-radius: 18px;
	box-shadow: 0 30px 80px rgba(0, 0, 0, .28);
	/* DİKKAT: animation-fill-mode VERME. `both` denendi ve geri alındı —
	   animasyon bir şekilde ilerlemezse panel ilk karede (mobilde ekranın
	   tamamen dışında) KALICI olarak donuyor. Fill-mode yokken dinlenme hâli
	   her zaman doğru konum; animasyon sadece girişi süslüyor. */
	animation: ptus-modal-in .2s ease;
	overflow: hidden;
}
.pt-us-modal-panel--narrow { max-width: 480px; }

@keyframes ptus-modal-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes ptus-modal-in {
	from { opacity: 0; transform: translateY(12px) scale(.985); }
	to { opacity: 1; transform: translateY(0) scale(1); }
}
/* Mobil bottom sheet kendi girişi: SADECE aşağıdan yukarı kayar, ölçek yok.
   Ölçekli giriş sheet'te yanlara 3px boşluk ve alta taşma üretiyor. */
@keyframes ptus-sheet-in {
	from { transform: translateY(100%); }
	to { transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
	.pt-us-modal-panel, .pt-us-modal-backdrop { animation: none; }
}

.pt-us-modal-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px 20px 14px;
	border-bottom: 1px solid var(--ptus-line);
	flex: 0 0 auto;
}
.pt-us-modal-head h3 {
	margin: 0;
	font-size: 18px;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--ptus-ink);
}
.pt-us-modal-x {
	appearance: none;
	border: 0;
	background: #ebebef;
	color: #1d1d1f;
	width: 34px; height: 34px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	cursor: pointer;
	flex: 0 0 auto;
	transition: background .14s;
}
.pt-us-modal-x svg { display: block; }
.pt-us-modal-x:hover { background: #dcdce3; }
.pt-us-modal-x:active { background: #d0d0d8; }
.pt-us-modal-x:focus-visible { outline: 2px solid var(--ptus-accent); outline-offset: 3px; }

.pt-us-modal-body {
	padding: 18px 20px 22px;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}

/* Hesaplanan tutar — modalın çıpası; hangi rakam üzerinden konuşulduğu belli olsun. */
.pt-us-modal-amount {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 14px;
	padding-bottom: 14px;
	margin-bottom: 16px;
	border-bottom: 1px solid var(--ptus-line);
}
.pt-us-modal-amount span { font-size: 13px; color: var(--ptus-ink-soft); }
.pt-us-modal-amount strong {
	font-size: 22px;
	font-weight: 700;
	letter-spacing: -0.02em;
	font-variant-numeric: tabular-nums;
	color: var(--ptus-ink);
}

/* Havale/EFT — taksitin alternatifi, bu yüzden tabloya girmiyor, kendi şeridinde. */
.pt-us-modal-havale {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	background: rgba(26,127,55,.07);
	border: 1px solid rgba(26,127,55,.18);
	border-radius: 12px;
	padding: 12px 15px;
	margin-bottom: 22px;
}
.pt-us-modal-havale-l { display: flex; flex-direction: column; gap: 2px; }
.pt-us-modal-havale-l > b { font-size: 13.5px; font-weight: 700; color: var(--ptus-ink); }
.pt-us-modal-havale-l > span { font-size: 12.5px; color: var(--ptus-ink-soft); }
.pt-us-modal-havale-l > span b { color: var(--ptus-green); font-weight: 700; }
.pt-us-modal-havale > strong {
	font-size: 18px;
	font-weight: 700;
	color: var(--ptus-green);
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.pt-us-modal-section { margin-bottom: 22px; }
.pt-us-modal-section:last-child { margin-bottom: 0; }
.pt-us-modal-section h4 {
	margin: 0 0 12px;
	font-size: 14px;
	font-weight: 700;
	color: var(--ptus-ink);
}
.pt-us-modal-section p { margin: 0; font-size: 13.5px; line-height: 1.55; color: var(--ptus-ink-soft); }
.pt-us-modal-section p b { color: var(--ptus-ink); }

/* Banka seçici — 9 bankayı alt alta tablo olarak basmak yerine tek satır chip. */
/* Banka seçici: ızgara, kaydırma YOK.
   Eskiden tek satırda yatay kaydırılıyordu; müşteri kaydırması gerektiğini
   anlamıyor, kenarda kalan bankaların da taksit sunduğunu göremiyordu.
   Hepsi bir bakışta görünsün diye sabit genişlikli ızgaraya alındı. */
.pt-us-modal-bankbar {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(118px, 1fr));
	gap: 8px;
	margin-bottom: 16px;
}
.pt-us-modal-bankchip {
	appearance: none;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 5px;
	min-height: 62px;
	border: 1px solid var(--ptus-line);
	background: #fff;
	color: var(--ptus-ink-soft);
	font: inherit;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
	padding: 8px 6px;
	border-radius: 12px;
	cursor: pointer;
	transition: background .14s, color .14s, border-color .14s, box-shadow .14s;
}
.pt-us-bankchip-logo {
	max-width: 76px;
	max-height: 20px;
	width: auto;
	height: auto;
	object-fit: contain;
}
.pt-us-bankchip-ad {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 100%;
}
.pt-us-modal-bankchip:hover { border-color: #b9cde8; color: var(--ptus-ink); }
.pt-us-modal-bankchip.is-active {
	border-color: var(--ptus-accent);
	box-shadow: inset 0 0 0 1px var(--ptus-accent);
	color: var(--ptus-ink);
	background: #f2f7ff;
}
/* Seçili çipte logo koyu zeminde kaybolmasın diye arka plan açık tutuldu;
   ayırt edici işaret çerçeve + hafif dolgu. */
.pt-us-modal-bankchip:focus-visible { outline: 2px solid var(--ptus-accent); outline-offset: 2px; }

/* Tablo artık kırpılmıyor: sütunlar panel genişliğine sığacak şekilde
   dağıtılıyor, taşma olursa yine kaydırılabilir kalıyor. */
.pt-us-modal-tablewrap { overflow-x: auto; }
.pt-us-modal-table { table-layout: fixed; }
.pt-us-modal-table th:first-child,
.pt-us-modal-table td:first-child { width: 38%; }
.pt-us-modal-table th:not(:first-child),
.pt-us-modal-table td:not(:first-child) { width: 31%; }
.pt-us-modal-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13.5px;
}
.pt-us-modal-table th {
	text-align: left;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var(--ptus-ink-soft);
	padding: 0 0 9px;
	border-bottom: 1px solid var(--ptus-line);
	white-space: nowrap;
}
.pt-us-modal-table th:not(:first-child) { text-align: right; }
.pt-us-modal-table td {
	padding: 11px 0;
	border-bottom: 1px solid var(--ptus-line-soft);
	color: var(--ptus-ink);
	vertical-align: top;
}
.pt-us-modal-table td:first-child { color: var(--ptus-ink-soft); padding-right: 12px; }
.pt-us-modal-table td.num {
	text-align: right;
	font-variant-numeric: tabular-nums;
	font-weight: 600;
	white-space: nowrap;
	padding-left: 12px;
}
.pt-us-modal-table tr:last-child td { border-bottom: 0; }
.pt-us-modal-table td em {
	display: block;
	font-style: normal;
	font-size: 11px;
	font-weight: 500;
	color: var(--ptus-ink-soft);
	margin-top: 2px;
}
/* En düşük aylık ödeme — tabloda aranan tek şey genelde bu. */
.pt-us-modal-table tr.is-best td { background: rgba(22,94,201,.05); }
.pt-us-modal-table tr.is-best td:first-child { color: var(--ptus-ink); font-weight: 600; }
.pt-us-modal-table tr.is-best td:first-child em { color: var(--ptus-accent); font-weight: 600; }
.pt-us-modal-table tr.is-best td.num { color: var(--ptus-accent); }

.pt-us-modal-note { margin-top: 14px !important; font-size: 12px !important; }
.pt-us-modal-body--prose { font-size: 14px; line-height: 1.6; color: var(--ptus-ink-soft); }
.pt-us-modal-body--prose p { margin: 0 0 12px; }
.pt-us-modal-body--prose ul { margin: 0; padding-left: 18px; }
.pt-us-modal-body--prose li { margin-bottom: 8px; }
.pt-us-modal-body--prose b { color: var(--ptus-ink); }
/* Popup sonundaki bilgi sayfası bağlantısı — listeden ince bir çizgiyle ayrılır
   ki "devamı için buraya" olduğu anlaşılsın, madde gibi okunmasın. */
.pt-us-modal-body--prose .pt-us-modal-link {
	margin: 16px 0 0;
	padding-top: 14px;
	border-top: 1px solid var(--ptus-line-soft);
}
.pt-us-modal-body--prose .pt-us-modal-link a {
	color: var(--ptus-accent);
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Bilgi pill'i artık tıklanabilir — bunu görsel olarak da belli et. */
.pt-us-pill--edu-info { cursor: pointer; transition: background .15s; }
.pt-us-pill--edu-info:hover { background: #e8e8ed; }
.pt-us-pill--edu-info:focus-visible { outline: 2px solid var(--ptus-accent); outline-offset: 2px; }

/* Puan bloğu yorumlara link — metin rengi korunur. */
a.pt-us-rating { text-decoration: none; color: inherit; }
a.pt-us-rating:hover .pt-us-rating-count { color: var(--ptus-accent); text-decoration: underline; }

/* ---- Modal mobil: alttan açılan sayfa (bottom sheet) ---- */
@media (max-width: 600px) {
	.pt-us-modal {
		padding: 0;
		align-items: flex-end;
		/* Mobil tarayıcılarda `inset: 0` + `vh` BÜYÜK viewport'u (adres çubuğu
		   gizliyken) ölçüyor; çubuk görünürken sheet'in altı — kapat düğmesi
		   dahil — tarayıcı çubuğunun altında kalıyor. dvh gerçek görünür alanı
		   verir; desteklemeyen tarayıcı bir önceki satırdaki vh'yi kullanır. */
		height: 100vh;
		height: 100dvh;
	}
	.pt-us-modal-panel {
		/* Sağ/sol SIFIR: sheet ekranın tamamını kaplasın, kenarda ince şerit
		   kalmasın. max-width: 100% tek başına yetmiyordu — ölçekli animasyon
		   iki yanda 3px boşluk bırakıyordu. */
		width: 100%;
		max-width: none;
		max-height: 88vh;
		max-height: 88dvh;
		border-radius: 16px 16px 0 0;
		/* Ortada açılan diyaloğun ölçekli girişi değil, sheet girişi. */
		animation-name: ptus-sheet-in;
	}
	/* Tutamaç — "bu alttan açılan bir sayfa" işareti. Kapatma yalnız X'e
	   kalmasın; zemine dokunmak da kapatıyor. */
	.pt-us-modal-panel::before {
		content: '';
		position: absolute;
		top: 8px;
		left: 50%;
		transform: translateX(-50%);
		width: 38px;
		height: 4px;
		border-radius: 999px;
		background: #d4d4dc;
		z-index: 2;
	}
	.pt-us-modal-head { padding: 22px 14px 12px; }
	.pt-us-modal-head h3 { font-size: 16.5px; }
	/* Kapat düğmesi parmakla rahat vurulsun. */
	.pt-us-modal-x { width: 40px; height: 40px; }
	.pt-us-modal-body { padding: 15px 14px calc(20px + env(safe-area-inset-bottom)); }

	/* Tutar ve havale şeritleri dar ekranda tek satıra sığmıyor — alt alta insinler. */
	.pt-us-modal-amount { flex-wrap: wrap; gap: 2px 12px; }
	.pt-us-modal-amount strong { font-size: 20px; }
	.pt-us-modal-havale { flex-wrap: wrap; gap: 6px 12px; padding: 11px 13px; }
	.pt-us-modal-havale > strong { font-size: 17px; }

	/* Chip şeridi kenara yapışmasın; kaydırılabilir olduğu görünsün. */
	.pt-us-modal-bankbar {
		margin-left: -14px;
		margin-right: -14px;
		padding-left: 14px;
		padding-right: 14px;
	}

	/* Tablo 3 kolon + alt satırlar; dar ekranda punto ve boşluk kısılır. */
	.pt-us-modal-table { font-size: 12.5px; }
	.pt-us-modal-table th { font-size: 10px; }
	.pt-us-modal-table td { padding: 9px 0; }
	.pt-us-modal-table td:first-child { padding-right: 8px; }
	.pt-us-modal-table td.num { padding-left: 8px; }
	.pt-us-modal-table td em { font-size: 10px; }

	.pt-us-modal-body--prose { font-size: 13.5px; }
}

/* ==========================================================================
   Yerleşim rötuşları (28 Ağu 2026)
   ========================================================================== */

/* #7 — Görsel 60, içerik 40. Flatsome kolonlara .large-6 ile %50 veriyor;
   yeni sayfada görsel daha baskın olmalı, sağ kolon da dar kalıp okunur
   bir ölçüye insin. */
@media (min-width: 850px) {
	body.pt-us-active .product-main .content-row > .product-gallery.large-6 {
		flex-basis: 60%;
		max-width: 60%;
	}

	body.pt-us-active .product-main .content-row > .product-summary {
		flex-basis: 40%;
		max-width: 40%;
	}
}

/* #5 — Sağ kolonda öğeler arası nefes payı. Bloklar birbirine yapışıktı;
   fiyat kartı, seçiciler ve hizmetler arasındaki ritim açıldı. */
body.pt-us-active .pt-us-section-title {
	margin-top: 26px;
	margin-bottom: 12px;
}

body.pt-us-active .pt-us-linked {
	margin-top: 22px;
}

body.pt-us-active .pt-us-services-title {
	margin-top: 34px;
}

body.pt-us-active .pt-us-pricebox {
	margin-bottom: 4px;
}

/* Thumbnail şeridi — Flickity kurulmadan önceki taşma.
   Şerit Flatsome'ın row-slider'ı; Flickity kurulunca kendi viewport'unu açıp
   fazla hücreleri gizliyor. Ama bu sitede JS delay var, Flickity ancak gerçek
   etkileşimle kuruluyor. O ana kadar 8 küçük görselin hepsi yan yana diziliyor
   ve 5.'den sonrası galeri kolonunun DIŞINA, sağdaki içerik sütununun üstüne
   taşıyordu ("thumbnail'lar yarım kesiliyor").

   :not(.flickity-enabled) → yalnız kurulmamış hâli kırpıyoruz; Flickity
   devreye girdiğinde bu kural düşer ve carousel kendi davranışını sürdürür. */
body.pt-us-active .product-thumbnails:not(.flickity-enabled) {
	overflow: hidden;
}

/* =========================================================================
   13 inç dizüstü (≈1280×800 mantıksal) — sıkışık masaüstü
   =========================================================================
   1280–1440 arası hâlâ "masaüstü" sayılıyor (iki kolon + sticky galeri), ama
   1600px'lik bir ekran için ayarlanmış puntolar, kutu payları ve seçici
   kareleri bu genişlikte özet kolonunu taşırıyor; 800px yükseklikte de fiyat
   kartı ekrandan çıkıyor. Burada layout DEĞİŞMİYOR — yalnız ölçek kısılıyor.

   Yatay eşik 1440px: 13" MacBook'ta tarayıcı tam ekranken viewport 1280,
   ölçeklenmiş modlarda 1440'a kadar çıkabiliyor. */
@media (min-width: 992px) and (max-width: 1440px) {
	.pt-us { max-width: 520px; }

	.pt-us-title { font-size: 26px; }
	.pt-us-idrow { gap: 4px 11px; font-size: 12px; }

	/* Rozetler tek satır kalmalı: kolon daralınca punto bir tık iner. */
	.pt-us-badges { gap: 10px 18px; margin-bottom: 18px; }
	.pt-us-badge { font-size: 16px; gap: 7px; }
	.pt-us-apple { width: 22px; height: 26px; }

	.pt-us-section-title { font-size: 17px; margin: 2px 0 10px; }

	/* Fiyat kartları — dikey ritim kısılır, punto neredeyse korunur. */
	.pt-us-pricebox { gap: 10px; margin-bottom: 18px; }
	.pt-us-pricecard { padding: 12px 14px; }
	.pt-us-pricecard--bireysel.is-selected { padding: 14px 16px 16px; }
	.pt-us-pricecard--bireysel.is-selected .pt-us-price-value,
	.pt-us-price-value { font-size: 30px; }
	.pt-us-pricecard--edu:not(.is-selected) .pt-us-price-value,
	.pt-us-pricecard--bireysel .pt-us-price-value { font-size: 22px; }
	.pt-us-installment { margin-top: 8px; font-size: 12.5px; }
	.pt-us-havale-line { margin-top: 10px; padding-top: 10px; font-size: 12.5px; }

	/* Seçici kareleri: 96×70'lik kutular üç sütunda taşıyordu. */
	.pt-us-varopt,
	.pt-us-linked .wpclv-term-button {
		padding: 18px 12px !important;
		min-width: 84px !important;
		font-size: 14px;
	}
	.pt-us-varopts,
	.pt-us-linked .wpclv-terms { gap: 9px; }
	.pt-us-linked { margin: 4px 0 20px; }
	.pt-us-linked .wpclv-attributes { gap: 20px; }
	.pt-us-linked .wpclv-attribute-label { font-size: 16px; margin-bottom: 10px; }
	.pt-us-variations { gap: 14px; margin-bottom: 18px; }

	/* Sticky bar: kargo bloğu 1280'de zaten gizli; buton ve tutar da kısılır ki
	   ürün adı + konfigürasyon satırı ezilmeden sığsın. */
	.pt-us-stickybar { left: 16px; right: 16px; }
	.pt-us-sb-inner { gap: 14px; padding: 8px 10px; min-height: 58px; }
	.pt-us-sb-btn { padding: 12px 24px; font-size: 14px; }
	.pt-us-sb-total strong { font-size: 18px; }
	.pt-us-sb-buy { gap: 12px; padding-left: 16px; }
}
