/* ══════════════════════════════════════════════════════════════════════
   YERLEŞİK SAYFA DÜZENLERİ — admin ayarlarına bağlı varyantlar
   (admin: Sayfa Ayarları → Kategori / Ürün / Sepet …)
   Tema CSS'i sonra yüklenir → tema bunları ezebilir.
   ══════════════════════════════════════════════════════════════════════ */

/* ── ÜRÜN IZGARASI (çekirdek) ───────────────────────────────────────
   Bu kural ÇEKİRDEKTİR: her tema ürün ızgarasını aynı düzende görür,
   sütun sayısı admin ayarından (--pcols) gelir. Tema kendi CSS'iyle
   kartın İÇİNİ (renk, köşe, gölge) farklılaştırır. */
.pgrid,.grid{
  display:grid;grid-template-columns:repeat(var(--pcols,4),minmax(0,1fr));
  gap:var(--oc-l) var(--oc-m)
}
@media (max-width:1100px){.pgrid,.grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){.pgrid,.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.pgrid,.grid{grid-template-columns:minmax(0,1fr)}}
.pgrid>*,.grid>*{min-width:0}
.pcard{min-width:0}
.pcard .pimg img,.pgrid .pimg img{max-width:100%}

/* ── Ürün sayfası: galeri düzenleri ─────────────────────────────── */
.product{display:grid;gap:34px;align-items:start}
.product .gallery{min-width:0}
.product .pinfo{min-width:0}
.pr-left{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}
.pr-wide{grid-template-columns:minmax(0,1.35fr) minmax(0,.9fr)}
.pr-vertical{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}
.pr-sticky{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}
/* Sticky bilgi: sağ sütun kaydırılırken sabit kalır */
.pr-sticky .pinfo{position:sticky;top:96px}
.pr-sticky .gallery{gap:14px}
.pr-wide .gmain{aspect-ratio:4/3}
.pr-vertical .gthumbs{flex-direction:column;max-height:none}
.pr-vertical .gmain{aspect-ratio:3/4}
@media (max-width:900px){
  .pr-left,.pr-wide,.pr-vertical,.pr-sticky{grid-template-columns:1fr}
  .pr-sticky .pinfo{position:static}
  .pr-vertical .gthumbs{flex-direction:row}
}
/* Yakınlaştırma ipucu */
.pr-zoom .gmain{cursor:zoom-in;position:relative}
.pr-zoom .gmain::after{
  content:"+";position:absolute;right:12px;bottom:12px;width:34px;height:34px;border-radius:50%;
  background:rgba(0,0,0,.55);color:#fff;display:grid;place-items:center;font-size:17px;pointer-events:none
}
/* Marka / ürün kodu */
.p-brand{display:block;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--oc-accent);margin-top:4px}
.p-sku{display:block;font-size:11.5px;color:var(--oc-muted);margin-top:4px}

/* ── Kategori: filtre düzenleri ─────────────────────────────────── */
.cg-bar--side{flex-wrap:wrap}
.cg-bar--side .cg-fbar{
  flex-direction:column;align-items:stretch;width:100%;gap:0;
  border-top:1px solid var(--oc-line);padding-top:10px;margin-top:8px
}
.cg-bar--side .cg-fg{border-bottom:1px solid var(--oc-line);padding:2px 0}
.cg-bar--side .cg-fbtn{width:100%;justify-content:space-between;border-radius:0;padding:11px 2px;background:transparent}
.cg-bar--side .cg-pop{
  position:static!important;display:block!important;opacity:1!important;visibility:visible!important;
  transform:none!important;box-shadow:none;border:0;border-left:2px solid var(--oc-accent);
  border-radius:0;margin:0 0 12px;padding:4px 0 4px 12px;max-height:none;overflow:visible
}
.cg-bar--side .cg-pop-v{display:flex;flex-wrap:wrap;gap:6px}
.cg-bar--side .cg-vc{border:1px solid var(--oc-line);border-radius:999px;padding:5px 11px}
.cg-bar--side .cg-pop-h{display:none}
/* Akordeon: düğmeye tıklayınca liste aşağı açılır (JS mevcut) */
.cg-bar--acc .cg-pop{
  position:absolute;left:0;right:0;top:100%;z-index:30;background:var(--oc-surface);
  border:1px solid var(--oc-line);border-radius:14px;padding:12px;box-shadow:var(--oc-shadow-lift)
}
.cg-bar--acc .cg-fbar{position:relative}
.cg-bar--acc .cg-fg{position:relative}

/* ── Ürün kartı oranı ───────────────────────────────────────────── */
.pgrid[data-ratio="square"]{--pratio:1/1}
.pgrid[data-ratio="portrait"]{--pratio:3/4}
.pgrid[data-ratio="auto"]{--pratio:auto}