/* ==========================================================================
   OMNIA — Çok sektörlü department-store tasarım sistemi
   Renk/font değişkenleri header.php :root'tan gelir (--renk-*, --font*).
   ========================================================================== */

:root{
    --indigo: var(--renk-birincil, #1b1f4b);
    --indigo-koyu: var(--renk-ikincil, #2c3170);
    --mercan: var(--renk-vurgu, #ff5a36);
    --mercan-koyu: color-mix(in srgb, var(--mercan) 86%, #000);
    --mercan-sis: color-mix(in srgb, var(--mercan) 12%, #fff);
    --indigo-sis: color-mix(in srgb, var(--indigo) 8%, #fff);
    --basari: var(--renk-basari, #1f7a5c);
    --uyari: var(--renk-uyari, #c23b2e);
    --bg: var(--renk-arkaplan, #f6f5f1);
    --yuzey: var(--renk-kart, #ffffff);
    --ink: var(--renk-yazi, #17171c);
    --gri: var(--renk-yazi-acik, #6b6b73);
    --cizgi: var(--renk-kenar, #e7e5df);
    --r-kart: var(--radius, 10px);
    --r-buton: var(--buton-radius, 8px);
    --r-pill: 999px;
    --golge: 0 1px 2px rgba(17,17,28,.04);
    --golge-orta: 0 2px 10px rgba(17,17,28,.06);
    --golge-yuksek: 0 12px 34px rgba(17,17,28,.12);
    --gecis: .18s ease;
    --en: var(--gov-genislik, 1320px);
    --font: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --font-display: 'Space Grotesk', 'Inter', system-ui, sans-serif;
}

/* --------------------------------------------------------- reset & taban */
*,*::before,*::after{ box-sizing:border-box; }
html{ overflow-x:clip; scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
    margin:0; font-family:var(--font); background:var(--bg); color:var(--ink);
    font-size:15px; line-height:1.6; font-weight:400;
    -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
    display:flex; flex-direction:column; min-height:100vh;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; }
input,select,textarea,button{ font-family:inherit; font-size:1rem; }
h1,h2,h3,h4,h5{ font-family:var(--font-display); font-weight:600; line-height:1.15; margin:0; letter-spacing:-.01em; color:var(--ink); }
p{ margin:0 0 1em; }
:focus-visible{ outline:2px solid var(--indigo); outline-offset:2px; border-radius:3px; }
main.ana{ flex:1 0 auto; display:block; }

.kapsayici{ width:100%; max-width:var(--en); margin-inline:auto; padding-inline:clamp(16px,4vw,32px); }
.eyebrow{
    font-family:var(--font-display); font-size:.72rem; font-weight:600; letter-spacing:.14em;
    text-transform:uppercase; color:var(--mercan); display:inline-block; margin-bottom:8px;
}
.d-inline{ display:inline-block; }

/* --------------------------------------------------------- butonlar */
.buton{
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
    font-family:var(--font-display); font-weight:600; font-size:.9rem; line-height:1;
    padding:12px 22px; border-radius:var(--r-buton); border:1.5px solid transparent;
    cursor:pointer; transition:background var(--gecis),color var(--gecis),border-color var(--gecis),transform var(--gecis);
    white-space:nowrap; text-align:center;
}
.buton svg{ width:1.05em; height:1.05em; flex:none; }
.buton:active{ transform:translateY(1px); }
.buton-birincil{ background:var(--indigo); color:#fff; }
.buton-birincil:hover{ background:var(--indigo-koyu); }
.buton-vurgu{ background:var(--mercan); color:#fff; }
.buton-vurgu:hover{ background:var(--mercan-koyu); }
.buton-katmanli{ background:var(--yuzey); color:var(--ink); border-color:var(--cizgi); }
.buton-katmanli:hover{ border-color:var(--indigo); color:var(--indigo); }
.buton-hayalet{ background:transparent; color:var(--indigo); border-color:transparent; padding-inline:8px; }
.buton-hayalet:hover{ color:var(--mercan); }
.buton-buyuk{ padding:16px 30px; font-size:1rem; }
.buton-kucuk{ padding:8px 14px; font-size:.82rem; }
.buton-blok{ width:100%; }
.buton:disabled{ opacity:.55; cursor:not-allowed; }

/* --------------------------------------------------------- rozet / çip */
.cip{
    display:inline-flex; align-items:center; gap:6px; padding:5px 12px; border-radius:var(--r-pill);
    background:var(--yuzey); border:1px solid var(--cizgi); font-size:.8rem; font-weight:500; color:var(--gri);
}
.cip-aktif{ background:var(--indigo); color:#fff; border-color:var(--indigo); }
.etiket-rozet{
    display:inline-flex; align-items:center; padding:4px 9px; border-radius:6px;
    font-family:var(--font-display); font-size:.68rem; font-weight:600; letter-spacing:.04em; text-transform:uppercase;
}
.rozet-mercan{ background:var(--mercan); color:#fff; }
.rozet-indigo{ background:var(--indigo); color:#fff; }
.rozet-yumusak{ background:var(--indigo-sis); color:var(--indigo); }

/* --------------------------------------------------------- duyuru şeridi */
.duyuru-serit{
    background:var(--indigo); color:#fff; font-size:.82rem; text-align:center;
    padding:9px 16px; letter-spacing:.01em;
}
.duyuru-serit b{ color:#fff; }
.duyuru-serit .mercan{ color:var(--mercan); font-weight:700; }
.duyuru-serit a{ color:#fff; text-decoration:underline; text-underline-offset:2px; }

/* --------------------------------------------------------- ÜST BAR / HEADER */
.ust-bar{ background:var(--yuzey); border-bottom:1px solid var(--cizgi); position:sticky; top:0; z-index:60; }
.ust-bar-ic{ display:flex; align-items:center; gap:clamp(14px,3vw,32px); min-height:74px; padding-block:12px; }

.menu-tetik{
    display:none; background:none; border:none; color:var(--ink); padding:6px; border-radius:8px;
}
.menu-tetik:hover{ background:var(--bg); }

.logo{ display:inline-flex; align-items:center; gap:10px; flex:none; }
.logo img{ height:36px; width:auto; }
.logo-isaret{
    display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px;
    background:var(--indigo); color:#fff; border-radius:9px; font-family:var(--font-display);
    font-weight:700; font-size:1.25rem; line-height:1;
}
.logo-yazi{
    font-family:var(--font-display); font-weight:700; font-size:1.5rem; letter-spacing:.02em; color:var(--ink);
}

.arama-form{
    flex:1 1 auto; display:flex; align-items:stretch; max-width:640px;
    background:var(--bg); border:1.5px solid var(--cizgi); border-radius:var(--r-pill); overflow:hidden;
    transition:border-color var(--gecis),background var(--gecis);
}
.arama-form:focus-within{ border-color:var(--indigo); background:var(--yuzey); }
.arama-form input{
    flex:1; border:none; background:transparent; padding:12px 20px; color:var(--ink); outline:none; font-size:.92rem;
}
.arama-form input::placeholder{ color:var(--gri); }
.arama-form button{
    border:none; background:var(--indigo); color:#fff; padding:0 20px; display:flex; align-items:center;
    transition:background var(--gecis);
}
.arama-form button:hover{ background:var(--mercan); }

.ust-aksiyonlar{ display:flex; align-items:center; gap:4px; flex:none; margin-left:auto; }
.aksiyon{
    position:relative; display:inline-flex; flex-direction:column; align-items:center; gap:2px;
    color:var(--ink); padding:8px 10px; border-radius:9px; transition:color var(--gecis),background var(--gecis);
    font-size:.68rem; font-weight:500;
}
.aksiyon:hover{ color:var(--mercan); background:var(--bg); }
.aksiyon .rozet{
    position:absolute; top:2px; right:4px; min-width:18px; height:18px; padding:0 4px;
    background:var(--mercan); color:#fff; border-radius:var(--r-pill); font-size:.66rem; font-weight:700;
    display:flex; align-items:center; justify-content:center; line-height:1; font-family:var(--font-display);
}

/* dil/para mini dropdown */
.dil-para-secici{ display:flex; align-items:center; gap:2px; }
.dropdown-mini{ position:relative; }
.dropdown-mini > .dil-buton{
    display:inline-flex; align-items:center; gap:5px; background:none; border:1px solid transparent; color:var(--ink);
    font-size:.8rem; font-weight:600; padding:8px 10px; border-radius:8px; font-family:var(--font-display);
    transition:background var(--gecis),border-color var(--gecis);
}
.dropdown-mini > .dil-buton:hover{ background:var(--bg); border-color:var(--cizgi); }
.dropdown-mini .dps-ok{ transition:transform var(--gecis); }
.dropdown-mini ul{
    position:absolute; top:calc(100% + 8px); right:0; min-width:196px; margin:0; padding:6px; list-style:none;
    background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart); box-shadow:var(--golge-yuksek);
    opacity:0; visibility:hidden; transform:translateY(-6px); transition:all var(--gecis); z-index:80;
}
.dropdown-mini:hover ul,.dropdown-mini:focus-within ul{ opacity:1; visibility:visible; transform:translateY(0); }
.dropdown-mini:hover .dps-ok,.dropdown-mini:focus-within .dps-ok{ transform:rotate(180deg); }
.dropdown-mini li a{
    display:flex; align-items:center; gap:8px; padding:9px 11px; border-radius:8px; font-size:.85rem; color:var(--ink);
}
.dropdown-mini li a:hover{ background:var(--bg); }
.dropdown-mini li a b{ color:var(--indigo); min-width:26px; }
.dropdown-mini li a.dps-aktif{ background:var(--indigo-sis); color:var(--indigo); }

/* --------------------------------------------------------- MEGA MENÜ / kategori bar */
.kategori-bar{ background:var(--yuzey); border-bottom:1px solid var(--cizgi); }
.kategori-bar-ic{ display:flex; align-items:stretch; gap:2px; }
.mega{ position:relative; }
.mega > a{
    display:inline-flex; align-items:center; gap:6px; padding:13px 15px; font-size:.88rem; font-weight:500;
    color:var(--ink); border-bottom:2px solid transparent; transition:color var(--gecis),border-color var(--gecis);
    white-space:nowrap;
}
.mega > a:hover{ color:var(--indigo); border-bottom-color:var(--mercan); }
.mega > a.kampanya{ color:var(--mercan); font-weight:600; }
.mega > a .mega-ok{ transition:transform var(--gecis); opacity:.5; }
.mega:hover > a .mega-ok{ transform:rotate(180deg); }

.mega-panel{
    position:absolute; top:100%; left:0; min-width:250px; padding:10px; margin-top:-1px;
    background:var(--yuzey); border:1px solid var(--cizgi); border-radius:0 0 var(--r-kart) var(--r-kart);
    box-shadow:var(--golge-yuksek); opacity:0; visibility:hidden; transform:translateY(-8px);
    transition:all var(--gecis); z-index:70;
}
.mega:hover .mega-panel,.mega:focus-within .mega-panel{ opacity:1; visibility:visible; transform:translateY(0); }
.mega-panel a{
    display:block; padding:9px 12px; border-radius:8px; font-size:.86rem; color:var(--gri);
    transition:background var(--gecis),color var(--gecis);
}
.mega-panel a:hover{ background:var(--bg); color:var(--indigo); }
.mega-panel .mega-tumu{ color:var(--mercan); font-weight:600; margin-top:2px; }

/* --------------------------------------------------------- MOBİL MENÜ */
.mobil-menu{
    position:fixed; inset:0 auto 0 0; width:min(340px,86vw); background:var(--yuzey); z-index:200;
    transform:translateX(-100%); transition:transform .28s cubic-bezier(.4,0,.2,1); overflow-y:auto;
    box-shadow:var(--golge-yuksek); padding:20px;
}
.mobil-menu.acik{ transform:translateX(0); }
.mobil-menu::before{
    content:''; position:fixed; inset:0; background:rgba(17,17,28,.45); opacity:0; visibility:hidden;
    transition:opacity .28s; z-index:-1; width:100vw;
}
.mobil-menu.acik::before{ opacity:1; visibility:visible; }
.mobil-menu .kapat{
    position:absolute; top:16px; right:16px; background:var(--bg); border:none; border-radius:8px; padding:6px;
    color:var(--ink);
}
.mobil-kullanici{ display:flex; align-items:center; gap:12px; padding:6px 0 18px; border-bottom:1px solid var(--cizgi); margin-bottom:14px; }
.mobil-kullanici > svg{ color:var(--indigo); flex:none; }
.mobil-kullanici b{ font-family:var(--font-display); display:block; }
.mobil-kullanici small{ color:var(--gri); }
.mobil-kullanici small a{ color:var(--indigo); }
.mobil-kullanici .buton{ margin-top:4px; }
.mobil-menu h4{
    font-family:var(--font-display); font-size:.72rem; text-transform:uppercase; letter-spacing:.12em;
    color:var(--gri); margin:18px 0 6px;
}
.mobil-kategoriler{ list-style:none; margin:0; padding:0; }
.mobil-kategoriler li a{ display:block; padding:11px 4px; border-bottom:1px solid var(--cizgi); font-size:.92rem; font-weight:500; }
.mobil-kategoriler li a:hover{ color:var(--mercan); }

/* --------------------------------------------------------- FLASH */
.flash{
    max-width:var(--en); margin:14px auto; padding:13px 18px; border-radius:var(--r-kart);
    font-size:.9rem; font-weight:500; border:1px solid var(--cizgi); background:var(--yuzey);
    display:flex; align-items:center; gap:10px;
}
.flash-basari{ background:color-mix(in srgb,var(--basari) 10%,#fff); border-color:color-mix(in srgb,var(--basari) 30%,#fff); color:var(--basari); }
.flash-hata,.flash-uyari{ background:color-mix(in srgb,var(--uyari) 10%,#fff); border-color:color-mix(in srgb,var(--uyari) 30%,#fff); color:var(--uyari); }
.flash-bilgi{ background:var(--indigo-sis); border-color:color-mix(in srgb,var(--indigo) 25%,#fff); color:var(--indigo); }

/* --------------------------------------------------------- HERO */
.hero{ padding:clamp(16px,3vw,28px) 0 0; }
.hero-izgara{
    max-width:var(--en); margin-inline:auto; padding-inline:clamp(16px,4vw,32px);
    display:grid; grid-template-columns:1.55fr 1fr; grid-template-rows:1fr 1fr; gap:16px; min-height:460px;
}
.hero-izgara > *{ min-width:0; }
.hero-ana{ grid-row:1 / span 2; }
.hero-slayt{ position:relative; height:100%; border-radius:var(--r-kart); overflow:hidden; background:var(--indigo); }
.hero-slayt .slayt{
    position:absolute; inset:0; opacity:0; visibility:hidden; transition:opacity .6s ease;
    background-size:cover; background-position:center; display:flex; align-items:flex-end;
}
.hero-slayt .slayt.aktif{ opacity:1; visibility:visible; position:relative; }
.hero-slayt .slayt::after{
    content:''; position:absolute; inset:0;
    background:linear-gradient(90deg, rgba(15,17,40,.86) 0%, rgba(15,17,40,.5) 42%, rgba(15,17,40,.05) 78%);
}
.slayt-icerik{ position:relative; z-index:2; padding:clamp(24px,4vw,48px); max-width:560px; color:#fff; }
.slayt-icerik h1,.slayt-icerik h2,.slayt-icerik h3{ color:#fff; }
.slayt-etiket{
    font-family:var(--font-display); font-size:.72rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
    color:var(--mercan); display:inline-block; margin-bottom:12px;
}
.slayt-icerik h1{ font-size:clamp(1.8rem,4vw,3rem); margin-bottom:14px; }
.slayt-icerik p{ font-size:1.02rem; color:rgba(255,255,255,.82); max-width:440px; margin-bottom:22px; }
.hero-noktalar{ position:absolute; bottom:18px; right:22px; z-index:3; display:flex; gap:8px; }
.hero-noktalar button{
    width:9px; height:9px; border-radius:var(--r-pill); border:none; background:rgba(255,255,255,.4); padding:0;
    transition:all var(--gecis);
}
.hero-noktalar button.aktif{ background:var(--mercan); width:24px; }

.hero-yan{
    position:relative; border-radius:var(--r-kart); overflow:hidden; background:var(--indigo-koyu); color:#fff;
    display:flex; align-items:flex-end; min-height:180px; background-size:cover; background-position:center;
}
.hero-yan::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(15,17,40,.1),rgba(15,17,40,.82)); }
.hero-yan-ic{ position:relative; z-index:2; padding:22px 24px; }
.hero-yan-ic .slayt-etiket{ margin-bottom:6px; }
.hero-yan-ic h3{ font-size:1.25rem; margin-bottom:10px; color:#fff; }
.hero-yan-ic a{ font-family:var(--font-display); font-weight:600; font-size:.85rem; color:#fff; display:inline-flex; align-items:center; gap:6px; }
.hero-yan-ic a:hover{ color:var(--mercan); }
.hero-yan-mercan{ background:var(--mercan); }
.hero-yan-mercan::after{ background:linear-gradient(180deg,rgba(0,0,0,0),rgba(120,30,10,.5)); }

/* --------------------------------------------------------- GÜVEN BANDI */
.guven-bandi{
    max-width:var(--en); margin:clamp(28px,4vw,44px) auto 0; padding-inline:clamp(16px,4vw,32px);
    display:grid; grid-template-columns:repeat(4,1fr); gap:14px;
}
.guven-bandi > *{ min-width:0; }
.guven-oge{
    display:flex; align-items:center; gap:14px; background:var(--yuzey); border:1px solid var(--cizgi);
    border-radius:var(--r-kart); padding:16px 18px; box-shadow:var(--golge);
}
.guven-ikon{
    flex:none; width:44px; height:44px; border-radius:10px; background:var(--indigo-sis); color:var(--indigo);
    display:flex; align-items:center; justify-content:center;
}
.guven-oge b{ font-family:var(--font-display); font-size:.92rem; display:block; }
.guven-oge small{ color:var(--gri); font-size:.8rem; }

/* --------------------------------------------------------- BÖLÜM başlıkları */
.bolum{ margin-top:clamp(38px,5vw,60px); }
.bolum-bas{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:20px; }
.bolum-bas h2{ font-size:clamp(1.4rem,2.6vw,2rem); }
.bolum-alt{ display:block; color:var(--gri); font-size:.9rem; margin-top:6px; }
.merkez-bas{ flex-direction:column; align-items:center; text-align:center; }
.bolum-tum{
    font-family:var(--font-display); font-weight:600; font-size:.85rem; color:var(--indigo);
    display:inline-flex; align-items:center; gap:6px; flex:none; white-space:nowrap;
}
.bolum-tum:hover{ color:var(--mercan); }

/* --------------------------------------------------------- KATEGORİ VİTRİNİ */
.kategori-izgara{ display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:16px; }
.kategori-izgara > *{ min-width:0; }
.kategori-kart{
    position:relative; border-radius:var(--r-kart); overflow:hidden; aspect-ratio:4/3; background:var(--indigo);
    box-shadow:var(--golge); transition:transform var(--gecis),box-shadow var(--gecis);
}
.kategori-kart:hover{ transform:translateY(-3px); box-shadow:var(--golge-orta); }
.kategori-kart img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.kategori-kart:hover img{ transform:scale(1.05); }
.kategori-kart::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(15,17,40,0) 38%,rgba(15,17,40,.8)); }
.kategori-kart-ic{ position:absolute; left:0; right:0; bottom:0; z-index:2; padding:16px 18px; color:#fff; }
.kategori-kart-ic h3{ color:#fff; font-size:1.1rem; }
.kategori-kart-ic span{ display:inline-flex; align-items:center; gap:5px; font-size:.8rem; color:rgba(255,255,255,.85); margin-top:3px; }
.kategori-kart:hover .kategori-kart-ic span{ color:var(--mercan); }

/* geniş vitrin (department öne çıkan başlıklar) */
.vitrin-izgara{ display:grid; grid-template-columns:repeat(6,1fr); gap:14px; }
.vitrin-izgara > *{ min-width:0; }
.vitrin-oge{
    background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart); padding:18px 12px;
    text-align:center; transition:border-color var(--gecis),transform var(--gecis),box-shadow var(--gecis);
    display:block;
}
.vitrin-oge:hover{ border-color:var(--indigo); transform:translateY(-3px); box-shadow:var(--golge-orta); }
.vitrin-oge-ikon{
    width:56px; height:56px; margin:0 auto 12px; border-radius:14px; background:var(--indigo-sis); color:var(--indigo);
    display:flex; align-items:center; justify-content:center; transition:background var(--gecis),color var(--gecis);
}
.vitrin-oge:hover .vitrin-oge-ikon{ background:var(--mercan); color:#fff; }
.vitrin-oge b{ font-family:var(--font-display); font-size:.88rem; display:block; color:var(--ink); }
.vitrin-oge small{ color:var(--gri); font-size:.74rem; }

/* --------------------------------------------------------- ÜRÜN IZGARASI + KART */
.urun-izgara{ display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:clamp(12px,1.5vw,20px); }
.urun-izgara > *{ min-width:0; }
.urun-kart{
    position:relative; background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart);
    overflow:hidden; display:flex; flex-direction:column; transition:border-color var(--gecis),box-shadow var(--gecis),transform var(--gecis);
}
.urun-kart:hover{ border-color:color-mix(in srgb,var(--indigo) 40%,#fff); box-shadow:var(--golge-orta); transform:translateY(-2px); }
.urun-link{ display:flex; flex-direction:column; flex:1; }
.urun-gorsel{ position:relative; aspect-ratio:1/1; background:var(--bg); overflow:hidden; }
.urun-gorsel img{ width:100%; height:100%; object-fit:cover; transition:opacity .35s ease,transform .5s ease; }
.urun-gorsel .ikincil-gorsel{ position:absolute; inset:0; opacity:0; }
.urun-kart:hover .ikincil-gorsel{ opacity:1; }
.urun-kart:hover .birincil-gorsel{ transform:scale(1.03); }
.indirim-rozet{
    position:absolute; top:10px; left:10px; z-index:2; background:var(--mercan); color:#fff;
    font-family:var(--font-display); font-weight:700; font-size:.74rem; padding:4px 9px; border-radius:6px;
}
.yeni-rozet{
    position:absolute; top:10px; left:10px; z-index:2; background:var(--indigo); color:#fff;
    font-family:var(--font-display); font-weight:600; font-size:.7rem; padding:4px 9px; border-radius:6px; letter-spacing:.03em;
}
.indirim-rozet + .yeni-rozet{ top:38px; }
.favori-mini{
    position:absolute; top:8px; right:8px; z-index:2; width:34px; height:34px; border-radius:var(--r-pill);
    background:rgba(255,255,255,.92); border:1px solid var(--cizgi); color:var(--ink); display:flex;
    align-items:center; justify-content:center; opacity:0; transform:translateY(-4px);
    transition:opacity var(--gecis),transform var(--gecis),color var(--gecis),background var(--gecis);
}
.urun-kart:hover .favori-mini{ opacity:1; transform:translateY(0); }
.favori-mini:hover,.favori-mini.aktif{ background:var(--mercan); color:#fff; border-color:var(--mercan); }
.favori-mini.aktif svg{ fill:#fff; }
.urun-bilgi{ padding:13px 14px 14px; display:flex; flex-direction:column; gap:5px; flex:1; }
.urun-marka{ font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; color:var(--gri); font-weight:600; font-family:var(--font-display); }
.urun-ad{
    font-family:var(--font); font-size:.9rem; font-weight:500; line-height:1.35; color:var(--ink);
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:2.4em;
}
.urun-puan{ display:flex; align-items:center; gap:4px; font-size:.8rem; color:var(--gri); font-weight:600; }
.urun-puan svg{ color:var(--mercan); fill:var(--mercan); }
.urun-puan small{ font-weight:400; }
.urun-fiyat-blok{ display:flex; align-items:baseline; gap:8px; margin-top:auto; padding-top:4px; flex-wrap:wrap; }
.urun-fiyat-blok .eski{ color:var(--gri); text-decoration:line-through; font-size:.82rem; }
.urun-fiyat-blok .guncel{ font-family:var(--font-display); font-weight:700; font-size:1.08rem; color:var(--ink); }
.urun-fiyat-blok .guncel.indirimli{ color:var(--mercan); }
.urun-sepet{ margin:0 14px 14px; }

/* --------------------------------------------------------- KAMPANYA ŞERİT / orta banner */
.orta-banner{
    position:relative; display:flex; align-items:center; min-height:280px; border-radius:var(--r-kart);
    overflow:hidden; background-size:cover; background-position:center; color:#fff; box-shadow:var(--golge);
}
.orta-banner::after{ content:''; position:absolute; inset:0; background:linear-gradient(90deg,rgba(15,17,40,.82),rgba(15,17,40,.25)); }
.orta-banner > div{ position:relative; z-index:2; padding:clamp(24px,4vw,48px); max-width:520px; }
.orta-banner h2{ color:#fff; font-size:clamp(1.5rem,3vw,2.2rem); margin-bottom:12px; }
.orta-banner p{ color:rgba(255,255,255,.82); margin-bottom:20px; }

.kampanya-ikili{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.kampanya-ikili > *{ min-width:0; }
.kampanya-panel{
    position:relative; min-height:220px; border-radius:var(--r-kart); overflow:hidden; display:flex; align-items:flex-end;
    background-size:cover; background-position:center; color:#fff; box-shadow:var(--golge);
}
.kampanya-panel::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(15,17,40,.05),rgba(15,17,40,.8)); }
.kampanya-panel-ic{ position:relative; z-index:2; padding:24px; }
.kampanya-panel-ic h3{ color:#fff; font-size:1.4rem; margin-bottom:12px; }

/* --------------------------------------------------------- YORUM / SOSYAL KANIT */
.yorum-bolum{ margin-top:clamp(38px,5vw,60px); background:var(--yuzey); border-block:1px solid var(--cizgi); padding:clamp(38px,5vw,60px) 0; }
.yorum-izgara{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:24px; }
.yorum-izgara > *{ min-width:0; }
.yorum-kart{ background:var(--bg); border:1px solid var(--cizgi); border-radius:var(--r-kart); padding:22px; }
.yorum-yildizlar{ color:var(--mercan); font-size:1.05rem; letter-spacing:2px; margin-bottom:10px; }
.yorum-kart h4{ font-size:1rem; margin-bottom:8px; }
.yorum-kart p{ color:var(--gri); font-size:.9rem; }
.yorum-urun{ display:flex; align-items:center; gap:10px; margin-top:14px; padding-top:14px; border-top:1px solid var(--cizgi); }
.yorum-urun img{ width:44px; height:44px; border-radius:8px; object-fit:cover; }
.yorum-urun b{ font-family:var(--font-display); font-size:.85rem; display:block; }
.yorum-urun small{ color:var(--gri); font-size:.78rem; }

/* --------------------------------------------------------- BLOG kartları */
.blog-izgara{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.blog-izgara > *{ min-width:0; }
.blog-kart{ background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart); overflow:hidden; transition:box-shadow var(--gecis),transform var(--gecis); }
.blog-kart:hover{ box-shadow:var(--golge-orta); transform:translateY(-2px); }
.blog-kart-resim{ aspect-ratio:16/10; overflow:hidden; background:var(--bg); }
.blog-kart-resim img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.blog-kart:hover .blog-kart-resim img{ transform:scale(1.04); }
.blog-kart-bilgi{ padding:18px; }
.blog-etiket{ display:inline-block; font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; color:var(--mercan); font-weight:600; font-family:var(--font-display); margin-bottom:8px; }
.blog-kart-bilgi h3{ font-size:1.1rem; margin-bottom:8px; }
.blog-kart-bilgi p{ color:var(--gri); font-size:.86rem; }

/* --------------------------------------------------------- MARKA ŞERİDİ */
.marka-serit{ margin-top:clamp(38px,5vw,60px); border-top:1px solid var(--cizgi); padding:34px 0; }
.marka-serit small{ display:block; text-align:center; color:var(--gri); font-size:.8rem; text-transform:uppercase; letter-spacing:.12em; margin-bottom:18px; }
.marka-liste{ display:flex; flex-wrap:wrap; justify-content:center; gap:12px 28px; }
.marka-liste a{ font-family:var(--font-display); font-weight:600; font-size:1.05rem; color:var(--gri); transition:color var(--gecis); }
.marka-liste a:hover{ color:var(--indigo); }

/* --------------------------------------------------------- BÜLTEN */
.bulten{ margin-top:clamp(38px,5vw,60px); background:var(--indigo); color:#fff; }
.bulten-ic{ display:grid; grid-template-columns:1.2fr 1fr; gap:28px; align-items:center; padding:clamp(32px,5vw,56px) 0; }
.bulten .eyebrow{ color:var(--mercan); }
.bulten h3{ color:#fff; font-size:clamp(1.3rem,2.4vw,1.8rem); margin-bottom:10px; }
.bulten p{ color:rgba(255,255,255,.75); margin:0; }
.bulten-form{ display:flex; gap:10px; }
.bulten-form input{
    flex:1; border:1.5px solid rgba(255,255,255,.25); background:rgba(255,255,255,.08); color:#fff;
    padding:14px 18px; border-radius:var(--r-buton); outline:none; min-width:0;
}
.bulten-form input::placeholder{ color:rgba(255,255,255,.6); }
.bulten-form input:focus{ border-color:var(--mercan); }

/* --------------------------------------------------------- ALT BAR / FOOTER */
.alt-bar{ background:var(--yuzey); border-top:1px solid var(--cizgi); margin-top:clamp(40px,5vw,64px); }
.alt-bar-ic{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1.2fr; gap:32px; padding:clamp(38px,5vw,56px) clamp(16px,4vw,32px); }
.alt-bar-ic > *{ min-width:0; }
.alt-blok .logo{ margin-bottom:14px; }
.alt-blok > p{ color:var(--gri); font-size:.88rem; max-width:340px; }
.alt-blok h4{ font-family:var(--font-display); font-size:.78rem; text-transform:uppercase; letter-spacing:.1em; color:var(--ink); margin-bottom:14px; }
.alt-blok ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px; }
.alt-blok ul a{ color:var(--gri); font-size:.88rem; transition:color var(--gecis); }
.alt-blok ul a:hover{ color:var(--mercan); }
.iletisim-liste li{ display:flex; align-items:flex-start; gap:9px; color:var(--gri); font-size:.88rem; overflow-wrap:anywhere; }
.iletisim-liste li svg{ color:var(--indigo); flex:none; margin-top:2px; }
.sosyal{ display:flex; gap:10px; margin-top:16px; }
.sosyal a{
    width:38px; height:38px; border-radius:9px; border:1px solid var(--cizgi); display:flex; align-items:center;
    justify-content:center; color:var(--ink); transition:all var(--gecis);
}
.sosyal a:hover{ background:var(--indigo); color:#fff; border-color:var(--indigo); }
.alt-serit{ border-top:1px solid var(--cizgi); }
.alt-serit-ic{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px clamp(16px,4vw,32px); flex-wrap:wrap; }
.alt-serit-ic > span{ color:var(--gri); font-size:.82rem; }
.odeme-rozetler{ display:flex; gap:8px; flex-wrap:wrap; }
.odeme-rozetler span{
    font-family:var(--font-display); font-size:.68rem; font-weight:600; letter-spacing:.04em; color:var(--gri);
    border:1px solid var(--cizgi); border-radius:6px; padding:4px 8px;
}

/* --------------------------------------------------------- BREADCRUMB / SAYFALAMA */
.breadcrumb{ display:flex; flex-wrap:wrap; align-items:center; gap:7px; font-size:.82rem; color:var(--gri); padding:16px 0; }
.breadcrumb a{ color:var(--gri); }
.breadcrumb a:hover{ color:var(--indigo); }
.breadcrumb .ayrac{ opacity:.5; }
.breadcrumb .aktif{ color:var(--ink); font-weight:500; }
.sayfalama{ display:flex; justify-content:center; gap:6px; margin:36px 0; flex-wrap:wrap; }
.sayfalama a{
    min-width:40px; height:40px; padding:0 12px; display:inline-flex; align-items:center; justify-content:center;
    border:1px solid var(--cizgi); border-radius:8px; font-family:var(--font-display); font-weight:600; font-size:.88rem;
    color:var(--ink); background:var(--yuzey); transition:all var(--gecis);
}
.sayfalama a:hover{ border-color:var(--indigo); color:var(--indigo); }
.sayfalama a.aktif{ background:var(--indigo); color:#fff; border-color:var(--indigo); }

/* --------------------------------------------------------- ORTAK: kategori/PDP/sepet/checkout (2. aşama tabanı) */
.icerik-duzen{ display:grid; grid-template-columns:260px 1fr; gap:28px; align-items:start; margin:24px 0; }
.icerik-duzen > *{ min-width:0; }
.filtre-yan{ background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart); padding:20px; position:sticky; top:96px; }
.filtre-grup{ padding-block:14px; border-bottom:1px solid var(--cizgi); }
.filtre-grup:last-child{ border-bottom:none; }
.filtre-grup h4{ font-family:var(--font-display); font-size:.82rem; text-transform:uppercase; letter-spacing:.06em; margin-bottom:12px; }
.filtre-grup label{ display:flex; align-items:center; gap:9px; padding:5px 0; font-size:.88rem; color:var(--gri); cursor:pointer; }
.filtre-grup label:hover{ color:var(--ink); }
.filtre-tetik{ display:none; }
.liste-arac{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:18px; flex-wrap:wrap; }
.liste-arac select{ border:1px solid var(--cizgi); border-radius:8px; padding:9px 14px; background:var(--yuzey); color:var(--ink); }

/* PDP galeri */
.pdp-duzen{ display:grid; grid-template-columns:1.1fr 1fr; gap:clamp(24px,4vw,48px); align-items:start; margin:24px 0; }
.pdp-duzen > *{ min-width:0; }
.pdp-galeri{ display:grid; grid-template-columns:76px 1fr; gap:12px; align-items:start; }
.pdp-kucukler{ display:flex; flex-direction:column; gap:10px; }
.pdp-ana-gorsel{ border:1px solid var(--cizgi); border-radius:var(--r-kart); overflow:hidden; background:var(--bg); aspect-ratio:1/1; }
.pdp-ana-gorsel img{ width:100%; height:100%; object-fit:cover; }
.kucuk-resim{ border:1.5px solid var(--cizgi); border-radius:8px; overflow:hidden; padding:0; background:var(--bg); aspect-ratio:1/1; }
.kucuk-resim.aktif{ border-color:var(--indigo); }
.pdp-fiyat{ font-family:var(--font-display); font-weight:700; font-size:1.8rem; color:var(--ink); }
.pdp-fiyat .eski{ font-size:1.05rem; color:var(--gri); text-decoration:line-through; font-weight:500; margin-right:10px; }
.pdp-fiyat .indirimli{ color:var(--mercan); }
.adet-arttir{ display:inline-flex; align-items:center; border:1px solid var(--cizgi); border-radius:var(--r-buton); overflow:hidden; }
.adet-arttir button{ background:var(--yuzey); border:none; padding:10px 14px; color:var(--ink); }
.adet-arttir button:hover{ background:var(--bg); color:var(--mercan); }
.adet-arttir input{ width:52px; text-align:center; border:none; border-inline:1px solid var(--cizgi); padding:10px 0; }
.varyant-secim{ display:flex; flex-wrap:wrap; gap:8px; }
.varyant-secim label{ position:relative; }
.varyant-secim input{ position:absolute; opacity:0; }
.varyant-secim span{
    display:inline-flex; align-items:center; justify-content:center; min-width:46px; padding:9px 14px; border:1.5px solid var(--cizgi);
    border-radius:8px; font-size:.85rem; font-weight:500; cursor:pointer; transition:all var(--gecis);
}
.varyant-secim input:checked + span{ border-color:var(--indigo); background:var(--indigo); color:#fff; }

/* sekmeler */
.sekme-bar{ display:flex; gap:4px; border-bottom:1px solid var(--cizgi); margin:28px 0 20px; flex-wrap:wrap; }
.sekme-bar button{ background:none; border:none; padding:12px 18px; font-family:var(--font-display); font-weight:600; font-size:.9rem; color:var(--gri); border-bottom:2px solid transparent; }
.sekme-bar button.aktif{ color:var(--indigo); border-bottom-color:var(--mercan); }
.sekme-icerik{ display:none; }
.sekme-icerik.aktif{ display:block; }

/* sepet satırı */
.sepet-satir{ display:grid; grid-template-columns:88px 1fr auto; gap:16px; align-items:center; padding:16px 0; border-bottom:1px solid var(--cizgi); }
.sepet-satir > *{ min-width:0; }
.sepet-satir-gorsel{ width:88px; height:88px; border-radius:8px; overflow:hidden; border:1px solid var(--cizgi); background:var(--bg); }
.sepet-satir-gorsel img{ width:100%; height:100%; object-fit:cover; }
.sepet-ozet{ background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart); padding:22px; position:sticky; top:96px; }
.ozet-satir{ display:flex; justify-content:space-between; padding:8px 0; font-size:.9rem; color:var(--gri); }
.ozet-satir.toplam{ border-top:1px solid var(--cizgi); margin-top:8px; padding-top:14px; font-family:var(--font-display); font-weight:700; font-size:1.15rem; color:var(--ink); }

/* checkout adımları */
.checkout-adim{ display:flex; align-items:center; gap:10px; margin-bottom:24px; flex-wrap:wrap; }
.checkout-adim .adim{ display:flex; align-items:center; gap:8px; color:var(--gri); font-size:.85rem; font-weight:500; }
.checkout-adim .adim .no{ width:26px; height:26px; border-radius:var(--r-pill); background:var(--bg); border:1px solid var(--cizgi); display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-weight:700; font-size:.8rem; }
.checkout-adim .adim.aktif{ color:var(--ink); }
.checkout-adim .adim.aktif .no{ background:var(--indigo); color:#fff; border-color:var(--indigo); }
.checkout-adim .cizgi{ flex:1; height:1px; background:var(--cizgi); min-width:16px; }

/* taksit tablosu */
.taksit-tablo{ width:100%; border-collapse:collapse; font-size:.86rem; }
.taksit-tablo th,.taksit-tablo td{ padding:11px 14px; border-bottom:1px solid var(--cizgi); text-align:left; }
.taksit-tablo th{ font-family:var(--font-display); font-size:.74rem; text-transform:uppercase; letter-spacing:.06em; color:var(--gri); }
.taksit-tablo tr:hover td{ background:var(--bg); }
.taksit-tablo .vurgu{ color:var(--mercan); font-weight:700; }

/* kargo takip */
.kargo-takip-liste{ list-style:none; margin:0; padding:0; position:relative; }
.kargo-takip-liste li{ position:relative; padding:0 0 22px 30px; }
.kargo-takip-liste li::before{ content:''; position:absolute; left:7px; top:4px; width:11px; height:11px; border-radius:var(--r-pill); background:var(--yuzey); border:2px solid var(--cizgi); z-index:1; }
.kargo-takip-liste li::after{ content:''; position:absolute; left:11px; top:15px; bottom:-4px; width:2px; background:var(--cizgi); }
.kargo-takip-liste li:last-child::after{ display:none; }
.kargo-takip-liste li.tamam::before{ background:var(--basari); border-color:var(--basari); }
.kargo-takip-liste li.aktif::before{ background:var(--mercan); border-color:var(--mercan); }
.kargo-takip-liste b{ font-family:var(--font-display); font-size:.9rem; display:block; }
.kargo-takip-liste small{ color:var(--gri); font-size:.8rem; }

/* form öğeleri (ortak) */
.form-alan{ margin-bottom:16px; }
.form-alan label{ display:block; font-size:.84rem; font-weight:600; margin-bottom:6px; color:var(--ink); }
.form-alan input,.form-alan select,.form-alan textarea{
    width:100%; border:1.5px solid var(--cizgi); border-radius:var(--r-buton); padding:12px 14px;
    background:var(--yuzey); color:var(--ink); outline:none; transition:border-color var(--gecis);
}
.form-alan input:focus,.form-alan select:focus,.form-alan textarea:focus{ border-color:var(--indigo); }
.form-kart{ background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart); padding:clamp(20px,3vw,32px); box-shadow:var(--golge); }

/* --------------------------------------------------------- TOAST */
.toast{
    position:fixed; bottom:90px; left:50%; transform:translateX(-50%); background:var(--indigo); color:#fff;
    padding:12px 20px; border-radius:var(--r-buton); z-index:9999; box-shadow:var(--golge-yuksek);
    font-weight:600; font-size:.88rem; font-family:var(--font-display);
}
.toast-basari{ background:var(--basari); }
.toast-uyari{ background:var(--uyari); }

/* --------------------------------------------------------- MOBİL ALT NAV */
.mobil-bottom-nav{ display:none; }

/* --------------------------------------------------------- CHAT / WP / ÇEREZ */
.wp-buton{
    position:fixed; bottom:22px; right:22px; z-index:120; width:54px; height:54px; border-radius:var(--r-pill);
    background:#25d366; display:flex; align-items:center; justify-content:center; box-shadow:var(--golge-yuksek);
}
.chat-widget{ position:fixed; bottom:22px; right:86px; z-index:120; }
.chat-tetik{ width:54px; height:54px; border-radius:var(--r-pill); background:var(--indigo); color:#fff; border:none; display:flex; align-items:center; justify-content:center; box-shadow:var(--golge-yuksek); }
.chat-tetik:hover{ background:var(--indigo-koyu); }
.chat-panel{ position:absolute; bottom:66px; right:0; width:min(340px,90vw); background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart); box-shadow:var(--golge-yuksek); overflow:hidden; }
.chat-bas{ background:var(--indigo); color:#fff; padding:16px 18px; display:flex; justify-content:space-between; align-items:flex-start; }
.chat-bas b{ font-family:var(--font-display); color:#fff; }
.chat-bas small{ color:rgba(255,255,255,.7); display:block; font-size:.76rem; }
.chat-kapat{ background:none; border:none; color:#fff; font-size:1.3rem; line-height:1; }
.chat-govde{ padding:16px; max-height:280px; overflow-y:auto; display:flex; flex-direction:column; gap:8px; }
.chat-mesaj{ background:var(--bg); border:1px solid var(--cizgi); border-radius:10px; padding:9px 13px; font-size:.86rem; max-width:85%; align-self:flex-start; }
.chat-mesaj.benim{ background:var(--indigo); color:#fff; border-color:var(--indigo); align-self:flex-end; }
.chat-form{ border-top:1px solid var(--cizgi); padding:12px; display:flex; flex-direction:column; gap:8px; }
.chat-misafir{ display:flex; gap:8px; }
.chat-misafir input,.chat-yaz input{ flex:1; border:1px solid var(--cizgi); border-radius:8px; padding:9px 12px; outline:none; min-width:0; }
.chat-yaz{ display:flex; gap:8px; }
.chat-yaz button{ background:var(--indigo); color:#fff; border:none; border-radius:8px; padding:0 14px; display:flex; align-items:center; }
.cerez-mini{ position:fixed; bottom:16px; left:16px; z-index:150; width:min(360px,92vw); background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart); box-shadow:var(--golge-yuksek); padding:18px; }
.cerez-mini-bas{ display:flex; align-items:center; gap:8px; margin-bottom:8px; }
.cerez-mini-bas b{ font-family:var(--font-display); }
.cerez-mini-govde p{ color:var(--gri); font-size:.86rem; margin-bottom:12px; }
.cerez-mini-aksiyon{ display:flex; gap:8px; }
.cerez-mini-aksiyon .buton{ flex:1; }
.cerez-mini-detay{ margin-top:10px; font-size:.8rem; }
.cerez-mini-detay a{ color:var(--indigo); }
.cerez-modal{ border:none; border-radius:var(--r-kart); padding:26px; max-width:460px; width:92vw; box-shadow:var(--golge-yuksek); color:var(--ink); }
.cerez-modal::backdrop{ background:rgba(17,17,28,.5); }
.cerez-modal h3{ margin-bottom:6px; }
.cerez-modal .alt{ color:var(--gri); font-size:.86rem; margin-bottom:16px; }
.cerez-secim-satir{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 0; border-top:1px solid var(--cizgi); }
.cerez-secim-satir small{ display:block; color:var(--gri); font-size:.78rem; }
.cerez-switch{ position:relative; width:44px; height:24px; flex:none; }
.cerez-switch input{ position:absolute; opacity:0; }
.cerez-switch span{ position:absolute; inset:0; background:var(--cizgi); border-radius:var(--r-pill); transition:background var(--gecis); }
.cerez-switch span::before{ content:''; position:absolute; top:3px; left:3px; width:18px; height:18px; background:#fff; border-radius:50%; transition:transform var(--gecis); }
.cerez-switch input:checked + span{ background:var(--indigo); }
.cerez-switch input:checked + span::before{ transform:translateX(20px); }
.cerez-modal-aksiyon{ display:flex; gap:10px; justify-content:flex-end; margin-top:20px; }

/* bakım */
.bakim-perdesi{ min-height:100vh; display:flex; align-items:center; justify-content:center; background:var(--indigo); color:#fff; padding:24px; }
.bakim-kart{ text-align:center; max-width:480px; }
.bakim-kart h1{ color:#fff; font-size:2.4rem; margin-bottom:14px; }

/* --------------------------------------------------------- RESPONSIVE */
@media (max-width:1080px){
    .vitrin-izgara{ grid-template-columns:repeat(4,1fr); }
    .alt-bar-ic{ grid-template-columns:1fr 1fr; gap:28px; }
    .hero-izgara{ grid-template-columns:1.4fr 1fr; }
}
@media (max-width:900px){
    .kategori-bar{ display:none; }
    .menu-tetik{ display:inline-flex; }
    .ust-bar-ic{ flex-wrap:wrap; }
    .arama-form{ order:5; max-width:none; flex-basis:100%; }
    .gizle-mobil{ display:none !important; }
    .yorum-izgara,.blog-izgara{ grid-template-columns:1fr; }
    .bulten-ic{ grid-template-columns:1fr; gap:18px; }
    .hero-izgara{ grid-template-columns:1fr; grid-template-rows:auto; min-height:0; }
    .hero-ana{ grid-row:auto; }
    .hero-slayt{ min-height:340px; }
    .guven-bandi{ grid-template-columns:1fr 1fr; }
    .icerik-duzen,.pdp-duzen{ grid-template-columns:1fr; }
    .pdp-galeri{ grid-template-columns:1fr; }
    .pdp-kucukler{ flex-direction:row; order:2; }
    .filtre-yan{ position:fixed; inset:0 auto 0 0; width:min(320px,88vw); z-index:200; transform:translateX(-100%); transition:transform .28s; border-radius:0; overflow-y:auto; }
    .filtre-yan.acik{ transform:translateX(0); }
    .filtre-tetik{ display:inline-flex; }
    .mobil-bottom-nav{
        display:flex; position:fixed; bottom:0; left:0; right:0; z-index:110; background:var(--yuzey);
        border-top:1px solid var(--cizgi); padding:6px 4px calc(6px + env(safe-area-inset-bottom));
    }
    .mobil-bottom-nav a{
        flex:1; display:flex; flex-direction:column; align-items:center; gap:2px; padding:6px 2px; font-size:.66rem;
        color:var(--gri); position:relative; font-weight:500;
    }
    .mobil-bottom-nav a.aktif{ color:var(--indigo); }
    .mobil-bottom-nav a .rozet{ position:absolute; top:2px; right:22%; min-width:16px; height:16px; background:var(--mercan); color:#fff; border-radius:var(--r-pill); font-size:.6rem; font-weight:700; display:flex; align-items:center; justify-content:center; }
    body{ padding-bottom:64px; }
    .wp-buton,.chat-widget{ bottom:76px; }
}
@media (max-width:620px){
    .vitrin-izgara{ grid-template-columns:repeat(3,1fr); }
    .urun-izgara{ grid-template-columns:1fr 1fr; gap:12px; }
    .kategori-izgara{ grid-template-columns:1fr 1fr; }
    .kampanya-ikili{ grid-template-columns:1fr; }
    .guven-bandi{ grid-template-columns:1fr; }
    .alt-bar-ic{ grid-template-columns:1fr; }
    .bulten-form{ flex-direction:column; }
    .sepet-satir{ grid-template-columns:72px 1fr; }
    .slayt-icerik h1{ font-size:1.6rem; }
    .bolum-bas{ align-items:flex-start; }
}
@media (max-width:400px){
    .urun-izgara,.kategori-izgara{ grid-template-columns:1fr; }
    .vitrin-izgara{ grid-template-columns:1fr 1fr; }
    .favori-mini{ opacity:1; transform:none; }
}

/* --------------------------------------------------------- SCROLLBAR */
*{ scrollbar-width:thin; scrollbar-color:var(--cizgi) transparent; }
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-track{ background:transparent; }
::-webkit-scrollbar-thumb{ background:color-mix(in srgb,var(--indigo) 22%,var(--bg)); border-radius:var(--r-pill); border:2px solid var(--bg); }
::-webkit-scrollbar-thumb:hover{ background:color-mix(in srgb,var(--indigo) 40%,var(--bg)); }

/* ==========================================================================
   2. AŞAMA — İÇ SAYFA BİLEŞENLERİ (PDP / kategori / sepet / checkout / hesap)
   Aynı :root değişkenleri; inline stil yerine sınıf.
   ========================================================================== */

/* ---------- yardımcılar ---------- */
.sayfa-baslik{ font-size:clamp(1.5rem,3vw,2.1rem); margin:6px 0 22px; }
.sayfa-baslik small{ font-family:var(--font); font-size:.9rem; font-weight:500; color:var(--gri); margin-left:8px; }
.metin-basari{ color:var(--basari); }
.metin-uyari{ color:var(--uyari); }
.kilcal{ border:none; border-top:1px solid var(--cizgi); margin:14px 0; }
.buton-link{ display:inline-flex; align-items:center; gap:6px; font-family:var(--font-display); font-weight:600; font-size:.85rem; color:var(--indigo); background:none; border:none; padding:0; }
.buton-link:hover{ color:var(--mercan); }
.buton-link.metin-uyari{ color:var(--uyari); }
.buton-link.metin-uyari:hover{ color:var(--mercan); }
.bilgi-kutu{ background:var(--indigo-sis); border:1px solid color-mix(in srgb,var(--indigo) 20%,#fff); border-radius:var(--r-buton); padding:12px 14px; font-size:.86rem; color:var(--gri); }
.bilgi-kutu b{ color:var(--ink); }
.alan-cifti{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.alan-uclu{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px; }
.alan-cifti>*,.alan-uclu>*{ min-width:0; }
.d-blok{ display:block; }

/* ---------- boş durum ---------- */
.bos-durum{ text-align:center; padding:clamp(28px,5vw,52px); background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart); }
.bos-durum svg{ color:color-mix(in srgb,var(--indigo) 35%,#fff); margin-bottom:14px; }
.bos-durum h3{ font-size:1.25rem; margin-bottom:8px; }
.bos-durum p{ color:var(--gri); margin-bottom:20px; }
.bos-durum .buton{ margin-top:2px; }

/* ---------- çip serit (alt kategori) ---------- */
.cip-serit{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 20px; }
.cip-serit a{ display:inline-flex; align-items:center; padding:7px 14px; border-radius:var(--r-pill); background:var(--yuzey); border:1px solid var(--cizgi); font-size:.83rem; font-weight:500; color:var(--gri); transition:all var(--gecis); }
.cip-serit a:hover{ border-color:var(--indigo); color:var(--indigo); }

/* ---------- liste başlığı (kategori/arama) ---------- */
.liste-bas{ margin:6px 0 20px; }
.liste-bas h1{ font-size:clamp(1.5rem,3vw,2.1rem); margin:6px 0 8px; }
.liste-bas p{ color:var(--gri); max-width:640px; margin:0; }
.liste-bas .sayi{ color:var(--gri); font-size:.85rem; font-weight:600; }

/* ---------- filtre grup ek ---------- */
.filtre-yan .kapat{ display:none; position:absolute; top:14px; right:14px; background:var(--bg); border:none; border-radius:8px; padding:5px; color:var(--ink); }
.filtre-grup select,.filtre-grup input[type=number]{ width:100%; border:1.5px solid var(--cizgi); border-radius:var(--r-buton); padding:10px 12px; background:var(--yuzey); color:var(--ink); outline:none; }
.filtre-grup select:focus,.filtre-grup input:focus{ border-color:var(--indigo); }
.filtre-grup .alan-cifti{ gap:10px; }
.filtre-yan .filtre-aksiyon{ margin-top:6px; display:flex; flex-direction:column; gap:10px; align-items:flex-start; }

/* ---------- PDP ek ---------- */
.pdp-marka{ font-family:var(--font-display); font-size:.74rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--mercan); display:inline-block; margin-bottom:8px; }
.pdp-bilgi h1{ font-size:clamp(1.4rem,2.6vw,2rem); margin-bottom:12px; }
.pdp-puan{ display:flex; align-items:center; gap:8px; margin-bottom:16px; font-size:.85rem; color:var(--gri); }
.pdp-yildiz{ display:inline-flex; color:var(--cizgi); }
.pdp-yildiz .dolu{ color:var(--mercan); }
.pdp-yildiz svg{ fill:currentColor; }
.pdp-ana-gorsel{ position:relative; }
.pdp-ana-gorsel .indirim-rozet,.pdp-ana-gorsel .yeni-rozet{ font-size:.82rem; padding:5px 11px; }
.pdp-fiyat-satir{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:18px; }
.pdp-fiyat-satir .etiket-rozet{ align-self:center; }
.pdp-kisa{ color:var(--gri); font-size:.95rem; margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid var(--cizgi); }
.varyant-grup{ margin-bottom:20px; }
.varyant-bas{ display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.varyant-bas .varyant-etiket{ font-family:var(--font-display); font-size:.85rem; font-weight:600; }
.varyant-bas button{ background:none; border:none; color:var(--indigo); font-size:.8rem; font-weight:600; text-decoration:underline; text-underline-offset:2px; }
.varyant-secim input:disabled + span{ opacity:.4; cursor:not-allowed; text-decoration:line-through; }
.varyant-renk{ display:flex; flex-wrap:wrap; gap:10px; }
.varyant-renk label{ position:relative; display:flex; flex-direction:column; align-items:center; gap:5px; cursor:pointer; }
.varyant-renk input{ position:absolute; opacity:0; }
.varyant-renk .swatch{ width:38px; height:38px; border-radius:50%; border:2px solid var(--cizgi); box-shadow:inset 0 0 0 2px var(--yuzey); transition:border-color var(--gecis); }
.varyant-renk input:checked + .swatch{ border-color:var(--indigo); }
.varyant-renk input:disabled + .swatch{ opacity:.4; cursor:not-allowed; }
.varyant-renk em{ font-size:.72rem; color:var(--gri); font-style:normal; }
.pdp-adet-satir{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin:22px 0; }
.pdp-adet-satir > label{ font-family:var(--font-display); font-size:.85rem; font-weight:600; }
.pdp-stok{ font-size:.82rem; font-weight:600; color:var(--basari); }
.pdp-stok.az{ color:var(--mercan); }
.pdp-stok.yok{ color:var(--uyari); }
.pdp-satin{ display:flex; gap:12px; margin:8px 0 4px; }
.pdp-satin .urun-sepete{ flex:1; }
.pdp-satin .urun-favoriye{ background:var(--yuzey); border:1.5px solid var(--cizgi); color:var(--ink); width:54px; flex:none; padding:0; }
.pdp-satin .urun-favoriye:hover,.pdp-satin .urun-favoriye.aktif{ border-color:var(--mercan); color:var(--mercan); }
.pdp-guvence{ list-style:none; margin:22px 0 0; padding:20px 0 0; border-top:1px solid var(--cizgi); display:flex; flex-direction:column; gap:11px; }
.pdp-guvence li{ display:flex; align-items:center; gap:10px; font-size:.86rem; color:var(--gri); }
.pdp-guvence li svg{ color:var(--indigo); flex:none; }
.stok-bitti-kutu{ background:var(--bg); border:1px solid var(--cizgi); border-radius:var(--r-kart); padding:18px; margin:18px 0; }
.stok-bitti-kutu h4{ font-size:1rem; margin-bottom:6px; }
.stok-bitti-kutu p{ color:var(--gri); font-size:.86rem; margin-bottom:12px; }
.stok-bitti-kutu .alan-cifti{ grid-template-columns:1fr auto; align-items:stretch; }
.stok-bitti-kutu input{ border:1.5px solid var(--cizgi); border-radius:var(--r-buton); padding:11px 14px; background:var(--yuzey); color:var(--ink); outline:none; }
.stok-bitti-kutu input:focus{ border-color:var(--indigo); }

/* flaş sayaç */
.flas-sayac{ background:var(--indigo); color:#fff; border-radius:var(--r-kart); padding:14px 18px; margin:0 0 20px; display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.flas-sayac .flas-etiket{ display:inline-flex; align-items:center; gap:7px; font-family:var(--font-display); font-weight:600; font-size:.82rem; color:var(--mercan); }
.flas-sayac .sayac-blok{ display:flex; gap:10px; margin-left:auto; }
.flas-sayac .sayac-blok > div{ text-align:center; min-width:42px; background:rgba(255,255,255,.12); border-radius:8px; padding:6px 8px; }
.flas-sayac .sayac-blok b{ font-family:var(--font-display); font-size:1.15rem; display:block; line-height:1; }
.flas-sayac .sayac-blok small{ font-size:.62rem; text-transform:uppercase; letter-spacing:.05em; color:rgba(255,255,255,.7); }

/* PDP sekme içerikleri */
.detay-tablo{ width:100%; border-collapse:collapse; font-size:.9rem; }
.detay-tablo th,.detay-tablo td{ padding:11px 14px; border-bottom:1px solid var(--cizgi); text-align:left; }
.detay-tablo th{ font-family:var(--font-display); font-weight:600; color:var(--gri); width:180px; }
.sekme-icerik p{ color:var(--ink); }
.sekme-icerik .alt{ color:var(--gri); }
.bos-mini{ color:var(--gri); font-size:.9rem; padding:16px 0; }
.urun-video{ border:1px solid var(--cizgi); border-radius:var(--r-kart); overflow:hidden; margin-bottom:20px; }

/* yorum & soru */
.yorum-form{ background:var(--bg); border:1px solid var(--cizgi); border-radius:var(--r-kart); padding:20px; margin-bottom:22px; }
.yorum-form h4{ font-size:1rem; margin-bottom:14px; }
.yorum-form input[type=text],.yorum-form textarea{ width:100%; border:1.5px solid var(--cizgi); border-radius:var(--r-buton); padding:11px 14px; background:var(--yuzey); color:var(--ink); outline:none; margin-bottom:12px; }
.yorum-form input:focus,.yorum-form textarea:focus{ border-color:var(--indigo); }
.puan-secim{ display:inline-flex; flex-direction:row-reverse; gap:4px; margin-bottom:14px; }
.puan-secim input{ position:absolute; opacity:0; width:0; }
.puan-secim label{ color:var(--cizgi); cursor:pointer; transition:color var(--gecis); }
.puan-secim label:hover,.puan-secim label:hover ~ label,.puan-secim input:checked ~ label{ color:var(--mercan); }
.puan-secim svg{ fill:currentColor; }
.cb-satir{ display:flex; align-items:center; gap:8px; margin:0 0 14px; font-size:.85rem; color:var(--gri); }
.cb-satir input{ width:auto; }
.yorum{ padding:18px 0; border-bottom:1px solid var(--cizgi); }
.yorum-bas{ display:flex; align-items:center; gap:10px; margin-bottom:8px; flex-wrap:wrap; }
.yorum-bas b{ font-family:var(--font-display); font-size:.9rem; }
.yorum-yildiz{ display:inline-flex; color:var(--cizgi); }
.yorum-yildiz .dolu{ color:var(--mercan); }
.yorum-yildiz svg{ fill:currentColor; }
.yorum-bas small{ color:var(--gri); font-size:.78rem; margin-left:auto; }
.yorum h5{ font-size:.92rem; margin-bottom:4px; }
.yorum p{ color:var(--gri); font-size:.9rem; margin:0; }
.soru-blok{ padding:18px 0; border-bottom:1px solid var(--cizgi); }
.soru-blok .soru-bas,.soru-blok .cevap-blok{ display:flex; gap:12px; }
.soru-blok .cevap-blok{ margin-top:12px; padding-left:16px; }
.soru-ikon,.cevap-ikon{ flex:none; width:28px; height:28px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-weight:700; font-size:.82rem; }
.soru-ikon{ background:var(--indigo-sis); color:var(--indigo); }
.cevap-ikon{ background:var(--mercan); color:#fff; }
.soru-blok b{ font-family:var(--font-display); font-size:.88rem; }
.soru-blok p{ color:var(--ink); font-size:.9rem; margin:4px 0 0; }
.soru-blok .cevap-blok p{ color:var(--gri); }

/* sticky PDP CTA (mobil) */
.sticky-urun-cta{ display:none; }
.beden-modal{ border:none; border-radius:var(--r-kart); padding:24px; max-width:560px; width:92vw; box-shadow:var(--golge-yuksek); color:var(--ink); }
.beden-modal::backdrop{ background:rgba(17,17,28,.5); }
.beden-modal-bas{ display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; }
.beden-modal-bas button{ background:none; border:none; color:var(--ink); line-height:0; }
.beden-modal table{ width:100%; border-collapse:collapse; font-size:.88rem; }
.beden-modal th,.beden-modal td{ border:1px solid var(--cizgi); padding:8px 10px; text-align:center; }

/* ---------- SEPET ---------- */
.sepet-duzen{ display:grid; grid-template-columns:1fr 360px; gap:28px; align-items:start; margin:20px 0 40px; }
.sepet-duzen > *{ min-width:0; }
.sepet-liste-kart{ background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart); padding:8px 22px; }
.sepet-satir-bilgi{ display:flex; flex-direction:column; gap:6px; }
.sepet-satir-bilgi h3{ font-size:.95rem; font-family:var(--font); font-weight:600; }
.sepet-satir-bilgi small{ color:var(--gri); font-size:.8rem; }
.sepet-satir-bilgi .birim{ font-size:.82rem; color:var(--gri); }
.sepet-satir-bilgi .birim b{ color:var(--ink); font-family:var(--font-display); }
.sepet-satir-sag{ display:flex; flex-direction:column; align-items:flex-end; gap:10px; }
.sepet-satir-sag .tutar{ font-family:var(--font-display); font-weight:700; font-size:1.05rem; }
.sepet-sil{ background:none; border:none; color:var(--gri); padding:4px; border-radius:6px; transition:color var(--gecis),background var(--gecis); }
.sepet-sil:hover{ color:var(--uyari); background:var(--bg); }
.sepet-alt-aksiyon{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:18px 0 8px; flex-wrap:wrap; }
.sepet-ozet .eyebrow{ margin-bottom:2px; }
.sepet-ozet h3{ font-size:1.15rem; margin-bottom:16px; }
.kupon-form{ display:flex; gap:8px; margin:16px 0; }
.kupon-form input{ flex:1; min-width:0; border:1.5px solid var(--cizgi); border-radius:var(--r-buton); padding:11px 14px; background:var(--yuzey); color:var(--ink); outline:none; }
.kupon-form input:focus{ border-color:var(--indigo); }
.mini-guvence{ list-style:none; margin:18px 0 0; padding:16px 0 0; border-top:1px solid var(--cizgi); display:flex; flex-direction:column; gap:9px; }
.mini-guvence li{ display:flex; align-items:center; gap:8px; font-size:.8rem; color:var(--gri); }
.mini-guvence li svg{ color:var(--indigo); flex:none; }
.ozet-satir.buyuk,.ozet-satir.toplam{ border-top:1px solid var(--cizgi); margin-top:8px; padding-top:14px; font-family:var(--font-display); font-weight:700; font-size:1.15rem; color:var(--ink); }
.ozet-satir b{ color:var(--ink); }

/* ---------- CHECKOUT ---------- */
.odeme-duzen{ display:grid; grid-template-columns:1fr 370px; gap:28px; align-items:start; margin:8px 0 40px; }
.odeme-duzen > *{ min-width:0; }
.odeme-sol{ display:flex; flex-direction:column; gap:18px; }
.odeme-bolum{ background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart); padding:clamp(18px,2.5vw,26px); box-shadow:var(--golge); }
.odeme-bolum > h3{ font-size:1.1rem; margin:2px 0 16px; }
.odeme-bolum textarea{ width:100%; border:1.5px solid var(--cizgi); border-radius:var(--r-buton); padding:12px 14px; background:var(--yuzey); color:var(--ink); outline:none; margin-top:12px; }
.odeme-bolum textarea:focus{ border-color:var(--indigo); }
.odeme-bolum input[type=text],.odeme-bolum input[type=tel],.odeme-bolum input[type=email],.odeme-bolum input[type=number]{ width:100%; border:1.5px solid var(--cizgi); border-radius:var(--r-buton); padding:12px 14px; background:var(--yuzey); color:var(--ink); outline:none; }
.odeme-bolum input:focus{ border-color:var(--indigo); }
.odeme-bolum .alan-cifti,.odeme-bolum .alan-uclu{ margin-bottom:12px; }
.kayit-adres{ margin-bottom:14px; }
.kayit-adres label{ display:block; font-size:.82rem; font-weight:600; margin-bottom:6px; }
.kayit-adres select{ width:100%; border:1.5px solid var(--cizgi); border-radius:var(--r-buton); padding:11px 14px; background:var(--yuzey); color:var(--ink); }
.secim-liste{ display:flex; flex-direction:column; gap:10px; }
.secim-kart{ display:flex; align-items:center; gap:14px; border:1.5px solid var(--cizgi); border-radius:var(--r-kart); padding:14px 16px; cursor:pointer; transition:border-color var(--gecis),background var(--gecis); }
.secim-kart:hover{ border-color:color-mix(in srgb,var(--indigo) 40%,#fff); }
.secim-kart input{ accent-color:var(--indigo); width:18px; height:18px; flex:none; }
.secim-kart:has(input:checked){ border-color:var(--indigo); background:var(--indigo-sis); }
.secim-kart > div{ flex:1; min-width:0; }
.secim-kart b{ font-family:var(--font-display); font-size:.92rem; display:block; }
.secim-kart small{ color:var(--gri); font-size:.82rem; display:block; }
.secim-kart > span{ font-family:var(--font-display); font-weight:700; white-space:nowrap; }
.havale-detay{ margin-top:8px; background:var(--bg); border:1px solid var(--cizgi); border-radius:8px; padding:10px 12px; font-size:.82rem; line-height:1.6; overflow-wrap:anywhere; }
.havale-detay b{ color:var(--ink); }
.kart-form{ margin-top:14px; padding-top:14px; border-top:1px dashed var(--cizgi); }
.kart-form .alan-cifti{ margin-bottom:12px; }
.kart-form .alan-uclu{ margin-bottom:12px; }
.taksit-sarmal{ margin-top:14px; }
.taksit-sarmal h4{ font-family:var(--font-display); font-size:.82rem; text-transform:uppercase; letter-spacing:.05em; color:var(--gri); margin-bottom:8px; }
.taksit-tablo-sarmal{ overflow-x:auto; border:1px solid var(--cizgi); border-radius:var(--r-kart); }
.taksit-tablo .tk-toplam b{ color:var(--ink); }
.odeme-ozet{ background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart); padding:22px; position:sticky; top:96px; }
.odeme-ozet h3{ font-size:1.15rem; margin-bottom:14px; }
.ozet-urunler{ display:flex; flex-direction:column; gap:12px; max-height:290px; overflow-y:auto; }
.ozet-urun{ display:flex; align-items:center; gap:12px; }
.oz-gorsel{ position:relative; width:52px; height:52px; border-radius:8px; overflow:hidden; border:1px solid var(--cizgi); background:var(--bg); flex:none; }
.oz-gorsel img{ width:100%; height:100%; object-fit:cover; }
.oz-gorsel span{ position:absolute; top:-6px; right:-6px; min-width:20px; height:20px; padding:0 5px; background:var(--indigo); color:#fff; border-radius:var(--r-pill); font-size:.7rem; font-weight:700; display:flex; align-items:center; justify-content:center; font-family:var(--font-display); }
.oz-bilgi{ flex:1; min-width:0; }
.oz-bilgi b{ font-family:var(--font); font-weight:600; font-size:.84rem; display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.oz-bilgi small{ color:var(--gri); font-size:.76rem; }
.oz-fiyat{ font-family:var(--font-display); font-weight:700; font-size:.86rem; white-space:nowrap; }
.sozlesme{ display:flex; align-items:flex-start; gap:10px; margin:16px 0; font-size:.85rem; color:var(--gri); }
.sozlesme input{ margin-top:2px; accent-color:var(--indigo); flex:none; }
.sozlesme a{ color:var(--indigo); text-decoration:underline; text-underline-offset:2px; }

/* ---------- HESABIM ---------- */
.hesap-duzen{ display:grid; grid-template-columns:250px 1fr; gap:28px; align-items:start; margin:20px 0 40px; }
.hesap-duzen > *{ min-width:0; }
.hesap-yan{ background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart); padding:10px; position:sticky; top:96px; display:flex; flex-direction:column; gap:2px; }
.hesap-yan a{ display:flex; align-items:center; gap:11px; padding:11px 14px; border-radius:var(--r-buton); font-size:.88rem; font-weight:500; color:var(--gri); transition:background var(--gecis),color var(--gecis); }
.hesap-yan a svg{ flex:none; }
.hesap-yan a:hover{ background:var(--bg); color:var(--ink); }
.hesap-yan a.aktif{ background:var(--indigo); color:#fff; }
.hesap-icerik{ display:flex; flex-direction:column; gap:18px; }
.hesap-istatistik{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.hesap-istatistik > *{ min-width:0; }
.ist-kutu{ background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart); padding:16px; text-align:center; }
.ist-kutu b{ font-family:var(--font-display); font-size:1.4rem; display:block; }
.ist-kutu small{ color:var(--gri); font-size:.78rem; }
.hesap-kart{ background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart); padding:clamp(18px,2.5vw,26px); box-shadow:var(--golge); }
.hesap-kart > h3{ font-size:1.1rem; margin-bottom:16px; }
.hesap-form label{ display:block; font-size:.82rem; font-weight:600; margin-bottom:12px; }
.hesap-form label input,.hesap-form label select{ width:100%; margin-top:6px; border:1.5px solid var(--cizgi); border-radius:var(--r-buton); padding:11px 14px; background:var(--yuzey); color:var(--ink); outline:none; font-weight:400; }
.hesap-form input:focus{ border-color:var(--indigo); }
.hesap-form .alan-cifti label,.hesap-form .alan-uclu label{ margin-bottom:0; }
.hesap-form textarea{ width:100%; border:1.5px solid var(--cizgi); border-radius:var(--r-buton); padding:11px 14px; background:var(--yuzey); color:var(--ink); outline:none; margin-bottom:12px; }
.hesap-form > .buton{ margin-top:14px; }
.adres-liste{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:16px; }
.adres-liste > *{ min-width:0; }
.adres-kart{ border:1px solid var(--cizgi); border-radius:var(--r-kart); padding:16px; }
.adres-kart > b{ font-family:var(--font-display); display:flex; align-items:center; gap:8px; margin-bottom:8px; }
.adres-kart p{ color:var(--gri); font-size:.86rem; margin:0 0 4px; }
.adres-kart form{ margin-top:8px; }
.pill{ display:inline-flex; align-items:center; padding:2px 9px; border-radius:var(--r-pill); background:var(--indigo-sis); color:var(--indigo); font-size:.68rem; font-weight:600; font-family:var(--font-display); text-transform:uppercase; letter-spacing:.03em; }
.form-katlama{ border-top:1px solid var(--cizgi); padding-top:14px; }
.form-katlama summary{ cursor:pointer; font-family:var(--font-display); font-weight:600; font-size:.88rem; color:var(--indigo); }
.form-katlama[open] summary{ margin-bottom:14px; }

/* ---------- durum rozetleri / tablo ---------- */
.durum{ display:inline-flex; align-items:center; padding:4px 11px; border-radius:var(--r-pill); font-size:.75rem; font-weight:600; font-family:var(--font-display); text-transform:capitalize; background:var(--bg); border:1px solid var(--cizgi); color:var(--gri); }
.durum-onaylandi,.durum-hazirlaniyor{ background:var(--indigo-sis); color:var(--indigo); border-color:transparent; }
.durum-kargoda,.durum-kargolandi{ background:color-mix(in srgb,#56d9b4 18%,#fff); color:#0f6e57; border-color:transparent; }
.durum-teslim_edildi,.durum-odendi,.durum-tamamlandi{ background:color-mix(in srgb,var(--basari) 14%,#fff); color:var(--basari); border-color:transparent; }
.durum-iptal,.durum-iade,.durum-iade_edildi,.durum-basarisiz{ background:color-mix(in srgb,var(--uyari) 12%,#fff); color:var(--uyari); border-color:transparent; }
.durum-beklemede,.durum-dogrulama_bekliyor{ background:color-mix(in srgb,var(--mercan) 12%,#fff); color:var(--mercan-koyu); border-color:transparent; }
.veri-tablo{ width:100%; border-collapse:collapse; font-size:.88rem; }
.veri-tablo th{ text-align:left; font-family:var(--font-display); font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; color:var(--gri); padding:10px 12px; border-bottom:2px solid var(--cizgi); }
.veri-tablo td{ padding:12px; border-bottom:1px solid var(--cizgi); vertical-align:middle; }
.veri-tablo tr:last-child td{ border-bottom:none; }
.veri-tablo .sag{ text-align:right; }
.veri-tablo-sarmal{ overflow-x:auto; background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart); }
.mini-resim{ width:48px; height:48px; border-radius:8px; object-fit:cover; border:1px solid var(--cizgi); }

/* sipariş detay */
.siparis-bas{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; flex-wrap:wrap; }
.siparis-bas h3{ font-size:1.1rem; }
.siparis-bas small{ color:var(--gri); font-size:.82rem; }
.siparis-ozet-mini{ display:flex; flex-direction:column; gap:6px; margin:16px 0; padding:16px; background:var(--bg); border-radius:var(--r-kart); }
.siparis-ozet-mini > div{ display:flex; justify-content:space-between; font-size:.88rem; color:var(--gri); }
.siparis-ozet-mini > div.buyuk{ border-top:1px solid var(--cizgi); margin-top:6px; padding-top:10px; font-family:var(--font-display); font-weight:700; font-size:1.05rem; color:var(--ink); }
.siparis-ozet-mini b{ color:var(--ink); }
.teslimat-kutu{ background:var(--bg); border-radius:var(--r-kart); padding:16px; margin-top:14px; }
.teslimat-kutu h4{ font-size:.9rem; margin-bottom:8px; }
.teslimat-kutu p{ color:var(--gri); font-size:.88rem; margin:0; }
.takip-kart{ margin-top:16px; }
.takip-kart h4{ font-size:.95rem; margin-bottom:14px; }

/* ---------- SİPARİŞ TAMAM ---------- */
.basari-kutu{ max-width:640px; margin:24px auto 48px; background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart); padding:clamp(28px,5vw,44px); text-align:center; box-shadow:var(--golge-orta); }
.basari-ikon{ width:68px; height:68px; margin:0 auto 18px; border-radius:50%; background:color-mix(in srgb,var(--basari) 14%,#fff); color:var(--basari); display:flex; align-items:center; justify-content:center; font-size:2rem; font-weight:700; }
.basari-kutu h1{ font-size:1.7rem; margin-bottom:10px; }
.basari-kutu > p{ color:var(--gri); margin-bottom:6px; }
.basari-kutu > p b{ color:var(--ink); }
.siparis-ozet-kutu{ text-align:left; margin:24px 0; border:1px solid var(--cizgi); border-radius:var(--r-kart); overflow:hidden; }
.siparis-ozet-kutu table{ width:100%; border-collapse:collapse; font-size:.88rem; }
.siparis-ozet-kutu td{ padding:11px 14px; border-bottom:1px solid var(--cizgi); }
.siparis-ozet-kutu tr.toplam-satir td{ border-bottom:none; font-family:var(--font-display); font-size:1.02rem; background:var(--bg); }
.siparis-ozet-kutu .sag{ text-align:right; white-space:nowrap; }
.merkezde{ justify-content:center; }
.aksiyon-blok{ display:flex; gap:12px; flex-wrap:wrap; }

/* ---------- STRIPE ---------- */
.odeme-tekli{ max-width:520px; margin:24px auto 48px; }
.odeme-tekli .odeme-bolum{ padding:clamp(22px,4vw,32px); }
.odeme-tekli h1{ font-size:1.5rem; margin-bottom:6px; }
.odeme-tekli .alt{ color:var(--gri); font-size:.9rem; margin-bottom:22px; }
#stripe-element{ min-height:44px; margin-bottom:18px; }
#stripe-hata{ color:var(--uyari); font-size:.85rem; margin-bottom:14px; min-height:1em; }
.odeme-tutar-serit{ display:flex; align-items:center; justify-content:space-between; padding:14px 16px; background:var(--bg); border-radius:var(--r-kart); margin-bottom:20px; }
.odeme-tutar-serit span{ color:var(--gri); font-size:.88rem; }
.odeme-tutar-serit b{ font-family:var(--font-display); font-size:1.3rem; }

/* ---------- İÇ SAYFA RESPONSIVE ---------- */
@media (max-width:900px){
    .sepet-duzen,.odeme-duzen,.hesap-duzen{ grid-template-columns:1fr; }
    .sepet-ozet,.odeme-ozet,.hesap-yan,.filtre-yan{ position:static; }
    .hesap-yan{ flex-direction:row; flex-wrap:wrap; }
    .hesap-yan a{ flex:1 1 auto; }
    .filtre-yan .kapat{ display:inline-flex; }
    .sticky-urun-cta{
        display:flex; position:fixed; bottom:0; left:0; right:0; z-index:100; align-items:center; gap:14px;
        background:var(--yuzey); border-top:1px solid var(--cizgi); padding:12px clamp(16px,4vw,24px) calc(12px + env(safe-area-inset-bottom));
        box-shadow:0 -4px 20px rgba(17,17,28,.08);
    }
    .sticky-urun-cta .fiyat{ display:flex; flex-direction:column; line-height:1.2; }
    .sticky-urun-cta .fiyat s{ font-size:.78rem; color:var(--gri); }
    .sticky-urun-cta .fiyat b{ font-family:var(--font-display); font-size:1.15rem; }
    .sticky-urun-cta .buton{ flex:1; }
    body.sayfa-urun{ padding-bottom:76px; }
}
@media (max-width:620px){
    .hesap-istatistik{ grid-template-columns:1fr 1fr; }
    .adres-liste{ grid-template-columns:1fr; }
    .alan-uclu{ grid-template-columns:1fr; }
    .flas-sayac .sayac-blok{ margin-left:0; }
    .sepet-satir-sag{ align-items:flex-start; }
}