/* ==========================================================================
   PTX-CATEGORY-VERSION: 9.0
   ==========================================================================
   Pietra Technology — Kategori arşiv sayfası
   Banner / başlık / alt kategori kartları
   ========================================================================== */

.ptx-cat,
.ptx-cat-grid{
  --ptx-navy:#0E1F1C;
  --ptx-teal:#1F7A5C;
  --ptx-teal-dark:#155C45;
  --ptx-slate:#5B6B66;
  --ptx-band:#EEF3EC;
  --ptx-card:#FFFFFF;
  --ptx-border:#E1E7E2;
  --ptx-page:#F4F6F4;
  --ptx-sans:'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --ptx-max:1180px;
  --ptx-gutter:24px;

  font-family:var(--ptx-sans);
  color:var(--ptx-navy);
}

/* Elementlerin KENDISI de dahil olmali: tam genislik bloklarda
   width:100vw uzerine padding eklenirse yatay tasma olusur. */
.ptx-cat,
.ptx-cat-grid,
.ptx-cat *,
.ptx-cat-grid *,
.ptx-cat-grid *::before,
.ptx-cat-grid *::after{ box-sizing:border-box; }

.ptx-cat :focus-visible,
.ptx-cat-grid :focus-visible{
  outline:2px solid var(--ptx-teal);
  outline-offset:3px;
}

/* --------------------------------------------------------------------------
   Banner — tema konteynerinden taşıp tam genişliğe yayılır
   -------------------------------------------------------------------------- */

.ptx-cat-banner{
  /* Tema konteyneri içinde olsa bile kenardan kenara uzanır. */
  margin-left:calc(-50vw + 50%);
  margin-right:calc(-50vw + 50%);
  overflow:hidden;
  line-height:0;
  background:var(--ptx-page);
}

.ptx-cat-banner img{
  width:100%;
  height:clamp(180px,22vw,300px);
  object-fit:cover;
  object-position:center;
  display:block;
}

/* --------------------------------------------------------------------------
   Başlık
   -------------------------------------------------------------------------- */

/* Başlık normal akışta kalır: temanın kendi konteynerine hizalanır.
   Daha önce tam genişliğe taşınıyordu; bu, bazı tema yerleşimlerinde
   bloğu viewport'un soluna taşırıp metni kesiyordu. Akışta bırakmak
   hizalamayı temaya devreder ve kesilme riskini tamamen kaldırır. */
.ptx-cat-head{
  padding-top:34px;
  padding-bottom:26px;
}

.ptx-cat-title{
  font-size:clamp(26px,3.2vw,34px);
  font-weight:700;
  letter-spacing:-.015em;
  line-height:1.15;
  color:var(--ptx-teal);
  margin:0;
}

/* Açıklama konteyner genişliğini kullanır. Daha önce 70ch (~630 px) ile
   sınırlıydı ve sayfanın sadece yarısını dolduruyordu. */
.ptx-cat-intro{
  max-width:none;
  margin-top:14px;
  font-size:14.5px;
  line-height:1.65;
  color:var(--ptx-slate);
}
.ptx-cat-intro p{ margin:0 0 12px; }
.ptx-cat-intro p:last-child{ margin-bottom:0; }

/* --------------------------------------------------------------------------
   Alt kategori kartları
   -------------------------------------------------------------------------- */

/* Kartlar normal akışta — temanın konteynerine hizalanır, başlıkla aynı
   sütunda durur. Tam genişlik gri zemin bir pseudo-element ile çiziliyor:
   hesap yanlış giderse en kötü ihtimalde ZEMİN kayar, içerik kesilmez. */
.ptx-cat-grid{
  position:relative;
  padding:28px 0 64px;

  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}

.ptx-cat-grid::before{
  content:'';
  position:absolute;
  z-index:-1;
  top:0;
  bottom:0;
  left:calc(-50vw + 50%);
  right:calc(-50vw + 50%);
  background:var(--ptx-page);
}

.ptx-cat-card{
  background:var(--ptx-card);
  display:grid;
  grid-template-columns:190px minmax(0,1fr);
  gap:22px;
  padding:22px;
  align-items:start;
}

.ptx-cat-card-media{
  display:block;
  line-height:0;
}
.ptx-cat-card-media img{
  width:100%;
  height:auto;
  aspect-ratio:4/3;
  object-fit:contain;
  display:block;
}

.ptx-cat-card-body{
  min-width:0;
  display:flex;
  flex-direction:column;
  height:100%;
}

.ptx-cat-card-title{
  font-size:17px;
  font-weight:700;
  line-height:1.25;
  margin:0 0 10px;
}
.ptx-cat-card-title a{
  color:var(--ptx-teal) !important;
  text-decoration:none !important;
}
.ptx-cat-card-title a:hover{ color:var(--ptx-teal-dark) !important; }

/* Açıklamalar 120–1770 karakter arasında değişiyor; kırpılmazsa kartlar
   birbirinin üç katı yükseklikte oluyor ve ızgara dağılıyor.
   4 satırda kesilir, gerisi kategori sayfasında okunur. */
.ptx-cat-card-text{
  font-size:13.5px;
  line-height:1.6;
  color:var(--ptx-slate);
  margin:0 0 18px;

  display:-webkit-box;
  -webkit-line-clamp:4;
  -webkit-box-orient:vertical;
  line-clamp:4;
  overflow:hidden;
}


.ptx-cat-card-actions{
  margin-top:auto;
  display:flex;
  align-items:center;
  gap:20px;
  flex-wrap:wrap;
}

/* Birincil eylem: çerçeveli buton */
.ptx-cat-grid a.ptx-btn-cat{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:9px 16px;
  font-size:13.5px;
  font-weight:600;
  color:var(--ptx-navy) !important;
  background:transparent;
  border:1.5px solid var(--ptx-border);
  border-radius:2px;
  text-decoration:none !important;
  transition:border-color .15s ease, background .15s ease;
}
.ptx-cat-grid a.ptx-btn-cat:hover{
  border-color:var(--ptx-navy);
  background:var(--ptx-band);
}

/* İkincil eylem: düz bağlantı */
.ptx-cat-grid a.ptx-link-cat{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:13.5px;
  font-weight:600;
  color:var(--ptx-navy) !important;
  text-decoration:none !important;
}
.ptx-cat-grid a.ptx-link-cat:hover{ color:var(--ptx-teal) !important; }

/* Kart modunda ürün listesi hiç gösterilmiyor; tema veya bir eklenti
   yine de "ürün bulunamadı" bildirimi basarsa gizle. */
.ptx-cat-cards .woocommerce-no-products-found,
.ptx-cat-cards .woocommerce-info,
.ptx-cat-cards .woocommerce-notice--info,
.ptx-cat-cards ul.products:empty,
.ptx-cat-cards nav.woocommerce-pagination{
  display:none !important;
}

/* --------------------------------------------------------------------------
   Duyarlı düzen
   -------------------------------------------------------------------------- */

@media (max-width:1080px){
  .ptx-cat-card{ grid-template-columns:150px minmax(0,1fr); gap:18px; }
}

@media (max-width:860px){
  .ptx-cat-grid{ grid-template-columns:1fr; }
}

@media (max-width:560px){
  .ptx-cat-card-text{ -webkit-line-clamp:3; line-clamp:3; }
  .ptx-cat-card{
    grid-template-columns:1fr;
    gap:14px;
  }
  .ptx-cat-card-media img{ aspect-ratio:16/9; }
  .ptx-cat-card-actions{ gap:14px; }
  .ptx-cat-grid a.ptx-btn-cat{ flex:1; justify-content:center; }
}

@media (prefers-reduced-motion:reduce){
  .ptx-cat *,
  .ptx-cat-grid *{ transition-duration:.01ms !important; }
}

@media print{
  .ptx-cat-banner{ display:none; }
  .ptx-cat-grid{ grid-template-columns:1fr; background:none; padding:0; }
  .ptx-cat-card{ page-break-inside:avoid; border:1px solid var(--ptx-border); }
  .ptx-cat-card-actions{ display:none; }
}

/* ==========================================================================
   Ürün listeleme kartları (content-product.php)
   ========================================================================== */

.woocommerce ul.products.ptx-plist,
ul.products.ptx-plist,
body.ptx-shop ul.products{
  --ptx-navy:#0E1F1C;
  --ptx-teal:#1F7A5C;
  --ptx-teal-dark:#155C45;
  --ptx-slate:#5B6B66;
  --ptx-border:#E1E7E2;
  --ptx-mono:'IBM Plex Mono', ui-monospace, SFMono-Regular, monospace;

  display:grid !important;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:16px;
  margin:0 0 40px !important;
  padding:0 !important;
  list-style:none !important;
}
ul.products.ptx-plist::before,
ul.products.ptx-plist::after,
body.ptx-shop ul.products::before,
body.ptx-shop ul.products::after{ content:none !important; }

/* WooCommerce'in float tabanlı ızgarasını devre dışı bırak */
ul.products.ptx-plist > li.product,
body.ptx-shop ul.products > li.product{
  width:auto !important;
  margin:0 !important;
  padding:0 !important;
  float:none !important;
  clear:none !important;
}

/* Ürün kartları `.ptx-cat` kapsamı dışında; border-box'ı ayrıca vermek
   gerekiyor. Aksi halde padding max-width'e eklenir, metin bloğu
   hesaplandığından geniş olur ve görselin üzerine biner. */
li.product.ptx-pcard,
li.product.ptx-pcard *,
li.product.ptx-pcard *::before,
li.product.ptx-pcard *::after{ box-sizing:border-box; }

li.product.ptx-pcard{
  position:relative;
  /* flex sütunu: gövde kartın tamamını kaplar, böylece `margin-top:auto`
     ile alt blok (Fiyat / Teklif) gerçekten en alta yapışır. `height:100%`
     blok bağlamında çözülmediği için içerik karttan taşıyordu. */
  display:flex;
  flex-direction:column;
  background:#fff;
  border:1px solid var(--ptx-border);
  min-height:290px;
  overflow:hidden;
  transition:border-color .18s ease, box-shadow .18s ease;
}
li.product.ptx-pcard:hover{
  border-color:var(--ptx-teal);
  box-shadow:0 8px 26px rgba(14,31,28,.07);
}

/* Öne çıkarılan şeridi */
.ptx-pcard-ribbon{
  position:absolute;
  top:0;
  right:20px;
  z-index:3;
  color:var(--ptx-teal);
  line-height:0;
  pointer-events:none;
}

/* Metin bloğu.
   DİKKAT: `position:relative` DEĞİL. Görsel mutlak konumlu ve kartı
   referans almalı; metin bloğu konumlandırılmış olursa (bir eklenti
   görseli buraya nest ederse) görsel kartı değil metin bloğunu referans
   alır, ortada kalıp yazıyı keser. */
.ptx-pcard-body{
  z-index:2;
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  padding:26px 28px 22px;
  /* Görsel sağda mutlak konumlu; metin bloğu ona yer bırakmalı.
     Görselin sabit üst sınırı (190px) geniş kartlarda yüzdeden büyük
     kaldığı için metin payı buna göre hesaplanır — yüzde tek başına
     yetmiyor, sabit bir güvenlik payı gerekiyor. */
  max-width:calc(100% - 210px);
}

.ptx-pcard-sku{
  display:block;
  font-family:var(--ptx-mono);
  font-size:12px;
  letter-spacing:.04em;
  color:var(--ptx-slate);
  margin-bottom:4px;
}

.ptx-pcard-title{
  font-size:20px;
  font-weight:700;
  line-height:1.2;
  margin:0 0 16px;
}
li.product.ptx-pcard .ptx-pcard-title a{
  color:var(--ptx-teal) !important;
  text-decoration:none !important;
}
li.product.ptx-pcard .ptx-pcard-title a:hover{ color:var(--ptx-teal-dark) !important; }

.ptx-pcard-label{
  font-size:12px;
  font-weight:700;
  letter-spacing:.03em;
  text-transform:uppercase;
  color:var(--ptx-navy);
  margin:0 0 8px;
}

.ptx-pcard-benefits{
  list-style:none;
  margin:0 0 20px;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:5px;
}
.ptx-pcard-benefits li{
  display:flex;
  gap:9px;
  font-size:13px;
  line-height:1.45;
  color:var(--ptx-slate);
}
.ptx-pcard-benefits li::before{
  content:'';
  flex:none;
  width:5px;
  height:5px;
  margin-top:6px;
  background:var(--ptx-teal);
}

/* “Ürünü İncele” — kartın alt bloğunu aşağı iter */
li.product.ptx-pcard a.ptx-pcard-link{
  display:inline-flex;
  align-items:center;
  gap:7px;
  margin-top:auto;
  font-size:13.5px;
  font-weight:700;
  color:var(--ptx-navy) !important;
  text-decoration:none !important;
}
li.product.ptx-pcard a.ptx-pcard-link:hover{ color:var(--ptx-teal) !important; }

.ptx-pcard-price{
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid var(--ptx-border);
}
.ptx-pcard-price-label{
  display:block;
  font-size:12px;
  color:var(--ptx-slate);
  margin-bottom:2px;
}
li.product.ptx-pcard a.ptx-pcard-quote{
  font-size:13.5px;
  font-weight:700;
  color:var(--ptx-navy) !important;
  text-decoration:none !important;
}
li.product.ptx-pcard a.ptx-pcard-quote:hover{ color:var(--ptx-teal) !important; }

/* Görsel nerede olursa olsun KARTI referans alsın: metin bloğu
   konumlandırılmamış olduğu için en yakın konumlandırılmış ata
   li.product.ptx-pcard olur. */
.ptx-pcard-body .ptx-pcard-media{
  position:absolute;
}

/* Görsel — SAĞA HİZALI, sağ altta.
   `left:auto` ve `margin-left:auto` bilerek yazıldı: eski bir sürüm
   yüklü kalırsa ya da tema `left` değeri dayatırsa görsel sola kayıp
   metnin üzerine biniyordu. Bu üç satır sağa yaslanmayı garanti eder. */
.ptx-pcard-media{
  position:absolute;
  right:12px;
  left:auto !important;
  bottom:58px;
  z-index:1;
  width:34%;
  max-width:190px;
  line-height:0;
  pointer-events:none;
  display:flex;
  justify-content:flex-end;
  text-align:right;
}
.ptx-pcard-media img{
  width:auto;
  max-width:100%;
  max-height:150px;
  height:auto;
  display:block;
  margin-left:auto;        /* dar görselde bile sağa yaslanır */
  margin-right:0;
  object-fit:contain;
}

@media (max-width:1080px){
  .ptx-pcard-body{ max-width:58%; }
  .ptx-pcard-media{ width:34%; max-width:150px; }
  .ptx-pcard-title{ font-size:18px; }
}

/* İki sütun sürerken kart iyice daralıyor; görseli daha da küçült,
   metne yer aç. Bu aralık atlanınca uzun maddeler görsele biniyordu. */
@media (max-width:1000px) and (min-width:861px){
  .ptx-pcard-body{ max-width:62%; padding:20px 22px 18px; }
  .ptx-pcard-media{ width:30%; max-width:120px; bottom:52px; right:10px; }
  .ptx-pcard-benefits li{ font-size:12.5px; }
}

@media (max-width:860px){
  .woocommerce ul.products.ptx-plist,
  ul.products.ptx-plist,
  body.ptx-shop ul.products{ grid-template-columns:1fr; }
}

@media (max-width:560px){
  li.product.ptx-pcard{ min-height:0; }
  .ptx-pcard-body{ max-width:100%; padding:20px; }
  .ptx-pcard-media{
    position:static;
    width:100%;
    max-width:none;
    padding:0 20px 20px;
    order:-1;
  }
  .ptx-pcard-media img{ max-height:150px; margin:0 auto; width:auto; }
}

/* Kaçan kartlar için hasar sınırlama: bir eklenti dengesiz HTML üretip
   <ul>'nin erken kapanmasına yol açarsa, listeden düşen kartlar da en
   azından kart görünümünü korusun (tam genişlik bir bloğa dönüşmesin). */
body.ptx-shop > li.product,
body.ptx-shop .page_content_wrap > li.product,
body.ptx-shop [class*="content"] > li.product{
  display:block;
  max-width:640px;
  margin:0 auto 16px;
  background:#fff;
  border:1px solid var(--ptx-border, #E1E7E2);
}