/* Roboyol sade ürün kartı (2026-11-02) — kategori / arama / marka / kampanya ızgarası + aynı şablonu kullanan anasayfa modülleri.
   Tasarım: assets/tasarim/2026-11-02-kategori-kart-duzeni.md · Belge: assets/kart/kategori-kart.md
   Şablon: template/journal3/product_card.twig (.ry-stok-hap stok hapı, adet seçici/sepet düğmesi erişilebilirlik etiketleri).
   Yükleme: catalog/controller/common/footer.php (tüm sayfalar; header'dan önce çalıştığı için <head> içine girer).
   Journal3 skin CSS'i ve customCSS (<style>) bu dosyadan SONRA geldiği için seçiciler "html body" ile güçlendirildi.
   Kapsam yalnızca .product-grid: liste görünümü (.product-list, customCSS "liste görünümü" bloğu) etkilenmez.
   45° kurdele etiketler customCSS'te (deploy/2026-11-02-kategori-kart.sql, "kurdele etiketler" bloğu).
   Satır başı kart sayısı Journal3 skin ayarı globalItemsPerRow'dan gelir (aynı paket): ≥1200 5 · 992–1199 4 · 768–991 3 · <768 2. */

/* ---------- yerleşim: sağ sütun kalkınca (Journal3 düzeni 3) içerik sağ kenara yapışmasın — sol sütunla simetrik 16 px ---------- */
html.one-column.column-left:is(.route-product-category,.route-product-search,.route-product-manufacturer-info,.route-product-special) #content{padding-right:16px !important}
/* kampanya sayfası varsayılan düzende (yan sütunsuz) ızgara kenara yapışıyordu: iki yana 16 px */
html.desktop.route-product-special:not(.column-left) #content{padding-left:16px !important;padding-right:16px !important}

/* ---------- kart kutusu: 10 px iç boşluk, alt 12 px, gölge yalnızca üzerine gelince ---------- */
html body .product-grid .product-layout>.product-thumb{padding:10px 10px 12px !important;border:1px solid #e2e8f0 !important;border-radius:10px !important;box-shadow:none !important;background:#fff !important;transition:box-shadow .15s ease,border-color .15s ease}
html body .product-grid .product-layout>.product-thumb:hover{box-shadow:0 6px 18px rgba(16,24,40,.12) !important;border-color:#cfd8e3 !important}
html body .product-grid .product-layout.has-extra-button>.product-thumb{padding-bottom:12px !important}

/* ---------- 1. görsel alanı: kare, tam genişlik, 8 px köşe ---------- */
html body .product-grid .product-thumb>.image{position:relative !important;width:100% !important;margin:0 0 8px !important;padding:0 !important;border-radius:8px;overflow:hidden !important;background:#fff}
html body .product-grid .product-thumb>.image .product-img{display:block;width:100%;aspect-ratio:1/1}
html body .product-grid .product-thumb>.image .product-img>div{width:100%;height:100%}
html body .product-grid .product-thumb>.image .product-img img{width:100%;height:100%;object-fit:contain}
/* istek listesi kalbi: görselin sağ üst köşesi (mevcut düğme, konumu kart iç boşluğuna göre) */
html body .product-grid .product-thumb .wish-group{position:absolute !important;top:16px !important;right:16px !important;left:auto !important;bottom:auto !important;z-index:4 !important;margin:0 !important;padding:0 !important;width:auto !important}
html body .product-grid .product-thumb .btn-wishlist{width:30px !important;height:30px !important;min-width:0 !important;padding:0 !important;display:inline-flex !important;align-items:center;justify-content:center;background:rgba(255,255,255,.92) !important;box-shadow:0 1px 3px rgba(16,24,40,.15) !important;border-radius:50% !important}
html body .product-grid .product-thumb .btn-wishlist::before{font-size:15px !important}
html body .product-grid .product-thumb .btn-compare{display:none !important}

/* stok hapı: görselin sağ alt köşesi; yarı saydam beyaz zemin, 11 px yazı, renkli nokta */
.product-thumb .ry-stok-hap{display:none}
html body .product-grid .product-thumb .ry-stok-hap{position:absolute;right:6px;bottom:6px;z-index:3;display:inline-flex;align-items:center;gap:5px;max-width:calc(100% - 12px);padding:3px 7px 3px 6px;border-radius:4px;background:rgba(255,255,255,.9);box-shadow:0 0 0 1px rgba(16,24,40,.06);font-size:11px;font-weight:600;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}
html body .product-grid .product-thumb .ry-stok-hap::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:currentColor}
html body .product-grid .product-thumb .ry-stok-hap-var{color:#166534}
html body .product-grid .product-thumb .ry-stok-hap-var::before{background:#16a34a}
html body .product-grid .product-thumb .ry-stok-hap-yok{color:#4b5563}
html body .product-grid .product-thumb .ry-stok-hap-yok::before{background:#9ca3af}
html body .product-grid .product-thumb .ry-stok-hap-temin{color:#9a3412}
html body .product-grid .product-thumb .ry-stok-hap-temin::before{background:#ea580c}
/* eski "● Stokta Var · Hızlı Kargo" satırı ızgarada kalkar (bilgi hapta); liste görünümü .stats'ı kullanmaya devam eder */
html body .product-grid .product-thumb .caption>.stats{display:none !important}

/* ---------- kart gövdesi ---------- */
html body .product-grid .product-thumb>.caption{display:flex !important;flex-direction:column !important;padding:0 !important;margin:0 !important;gap:0 !important;flex:1 1 auto}
html body .product-grid .product-thumb .caption>.description,
html body .product-grid .product-thumb .caption>.rating,
html body .product-grid .product-thumb .caption>.extra-group,
html body .product-grid .product-thumb .caption>.ry-details,
html body .product-grid .product-thumb .price-tax{display:none !important}

/* 2. ad: 2 satır, 13 px, sabit yükseklik */
html body .product-grid .product-thumb .caption>.name{order:1 !important;display:block !important;height:2.6em;min-height:0 !important;margin:0 0 4px !important;padding:0 !important;font-size:13px !important;line-height:1.3 !important;text-align:left !important;width:100% !important}
html body .product-grid .product-thumb .caption>.name a{display:-webkit-box !important;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:13px !important;line-height:1.3 !important;font-weight:600 !important;color:#1b2431;white-space:normal !important}

/* 3. fiyat: 15 px kalın; kampanyada eski fiyat üstü çizili, küçük, yanında */
html body .product-grid .product-thumb .caption>.price{order:2 !important;display:block !important;height:22px;margin:0 0 8px !important;padding:0 !important;text-align:left !important;width:100% !important}
html body .product-grid .product-thumb .caption>.price>div{display:flex !important;flex-direction:row !important;flex-wrap:nowrap !important;align-items:baseline !important;justify-content:flex-start !important;gap:6px;line-height:22px;white-space:nowrap;overflow:hidden}
html body .product-grid .product-thumb .price-normal,
html body .product-grid .product-thumb .price-new{order:1;font-size:15px !important;font-weight:700 !important;line-height:22px !important;white-space:nowrap}
html body .product-grid .product-thumb .price-normal{color:#0d2340 !important}
html body .product-grid .product-thumb .price-new{color:#dc2626 !important}
html body .product-grid .product-thumb .price-old{order:2 !important;font-size:11.5px !important;font-weight:400 !important;color:#6b7684 !important;text-decoration:line-through;white-space:nowrap;margin:0 !important}

/* 4. eylem satırı: −/1/+ (28 px) + turuncu sepet düğmesi (simge, kalan genişlik) */
html body .product-grid .product-thumb .caption>.buttons-wrapper{order:3 !important;position:static !important;display:block !important;width:100% !important;margin:auto 0 0 !important;padding:0 !important;transform:none !important;opacity:1 !important;visibility:visible !important}
html body .product-grid .product-thumb .button-group{display:flex !important;width:100% !important;margin:0 !important;padding:0 !important;position:static !important}
html body .product-grid .product-thumb .cart-group{display:flex !important;align-items:center !important;flex:1 1 auto !important;gap:6px !important;width:100% !important;margin:0 !important;padding:0 !important}
html body .product-grid .product-thumb .cart-group .stepper{display:flex !important;align-items:center !important;flex:0 0 auto !important;position:static !important;width:auto !important;height:28px !important;min-height:0 !important;max-height:none !important;margin:0 !important;padding:0 !important;border:1px solid #dbe1e8 !important;border-radius:6px !important;overflow:hidden !important;background:#fff !important}
html body .product-grid .product-thumb .cart-group .stepper>span{display:contents !important}
html body .product-grid .product-thumb .cart-group .stepper span i{position:static !important;display:inline-flex !important;align-items:center;justify-content:center;width:22px !important;min-width:22px !important;height:26px !important;margin:0 !important;padding:0 !important;border:0 !important;background:#f4f6f9 !important;color:#1b2431 !important;font-size:10px !important;line-height:1 !important;cursor:pointer;transform:none !important;box-shadow:none !important}
html body .product-grid .product-thumb .cart-group .stepper span i:hover{background:#e2e8f0 !important}
html body .product-grid .product-thumb .cart-group .stepper span i::before{font-family:FontAwesome !important;transform:none !important}
html body .product-grid .product-thumb .cart-group .stepper span i.fa-angle-down{order:1}
html body .product-grid .product-thumb .cart-group .stepper span i.fa-angle-up{order:3}
html body .product-grid .product-thumb .cart-group .stepper span i.fa-angle-down::before{content:"\f068" !important}
html body .product-grid .product-thumb .cart-group .stepper span i.fa-angle-up::before{content:"\f067" !important}
html body .product-grid .product-thumb .cart-group .stepper input.form-control{order:2;width:26px !important;min-width:0 !important;height:26px !important;min-height:0 !important;margin:0 !important;padding:0 !important;border:0 !important;border-radius:0 !important;background:#fff !important;text-align:center;font-size:12px !important;font-weight:600;color:#1b2431;box-shadow:none !important}
html body .product-grid .product-thumb .btn-cart{flex:1 1 auto !important;display:flex !important;align-items:center !important;justify-content:center !important;width:auto !important;min-width:0 !important;height:32px !important;min-height:0 !important;margin:0 !important;padding:0 8px !important;border-radius:6px !important;line-height:1 !important}
html body .product-grid .product-thumb .btn-cart::before{display:inline-block !important;margin:0 !important;font-size:15px !important}
/* yazı görünmez, ekran okuyucuya açık (düğmede aria-label da var) */
html body .product-grid .product-thumb .btn-cart .btn-text{display:block !important;position:absolute !important;width:1px !important;height:1px !important;margin:-1px !important;padding:0 !important;overflow:hidden !important;clip:rect(0 0 0 0) !important;white-space:nowrap !important;border:0 !important}
html body .product-grid .product-thumb .btn-cart{position:relative}
/* stoksuz ürün: eylem satırı yerine "Gelince haber ver" bağlantısı (stok bildirimi işi, roboyol-stok.css), tek satır */
html body .product-grid .product-thumb .ry-stok-kart{min-height:0 !important;height:32px !important;padding:0 8px !important;border-radius:6px !important;font-size:12px !important;gap:6px !important}
html body .product-grid .product-thumb .ry-stok-kart .btn-text{display:inline !important;overflow:hidden;text-overflow:ellipsis}
html body .product-grid .product-thumb .ry-stok-kart::before{font-size:13px !important}

/* ---------- telefon: kurdele dışındaki küçük ayarlar ---------- */
@media (max-width:767px){
  html body .product-grid .product-layout>.product-thumb{padding:8px 8px 10px !important}
  html body .product-grid .product-thumb .wish-group{top:13px !important;right:13px !important}
  html body .product-grid .product-thumb .btn-wishlist{width:28px !important;height:28px !important}
  html body .product-grid .product-thumb .ry-stok-hap{right:5px;bottom:5px;padding:2px 6px 2px 5px;font-size:10.5px}
  html body .product-grid .product-thumb .cart-group{gap:5px !important}
  html body .product-grid .product-thumb .cart-group .stepper span i{width:20px !important;min-width:20px !important}
  html body .product-grid .product-thumb .cart-group .stepper input.form-control{width:22px !important}
}
