/* ==========================================================
   Mağaza teması — renkleri değiştirmek için aşağıdaki
   :root bloğundaki değerleri düzenlemeniz yeterli.
   ========================================================== */
:root{
  --ana:#0B5FBF;          /* ana renk (butonlar, linkler) — logo mavisi */
  --ana-koyu:#094C99;
  --ana-acik:#E8F1FC;     /* çok açık mavi zemin */
  --vurgu:#0EA5E9;        /* indirim etiketi ve sepet rozeti */
  --lacivert:#0B2545;     /* alt bilgi zemini */
  --metin:#0F1B2D;
  --soluk:#5A6B82;
  --cizgi:#DCE7F3;
  --zemin:#ffffff;
  --zemin-alt:#F4F8FD;
  --yesil:#15803d;
  --kirmizi:#b91c1c;
  --golge:0 1px 3px rgba(11,95,191,.07), 0 1px 2px rgba(11,95,191,.05);
  --radius:12px;
  --menu-zemin:#F2F5F8;   /* üst kategori şeridi */
  --menu-yazi:#4B5A6E;
  --menu-ayrac:#D5DEE8;
  --gorsel-zemin:#ffffff; /* ürün fotoğraflarının altlığı */
  --ustbar-zemin:var(--ana);
}

/* ==========================================================
   KOYU MOD
   Sağ üstteki ay/güneş düğmesiyle açılır, seçim 1 yıl hatırlanır.
   Ziyaretçi hiç seçim yapmadıysa telefon/bilgisayarının tercihi kullanılır.
   ========================================================== */
html[data-tema="koyu"]{
  --ana:#4C9AFF;
  --ana-koyu:#3A87EC;
  --ana-acik:#15263C;
  --vurgu:#38BDF8;
  --lacivert:#0A1523;
  --metin:#E7EEF8;
  --soluk:#9DB0C8;
  --cizgi:#25374F;
  --zemin:#141E2E;
  --zemin-alt:#0C1421;
  --yesil:#4ADE80;
  --kirmizi:#F87171;
  --golge:0 1px 3px rgba(0,0,0,.5), 0 1px 2px rgba(0,0,0,.4);
  --menu-zemin:#101A28;
  --menu-yazi:#B6C6DA;
  --menu-ayrac:#25374F;
  --gorsel-zemin:#F3F6FA;  /* fotoğraflar açık altlıkta daha doğru görünür */
  --ustbar-zemin:#122A47;
}
html[data-tema="koyu"] body{background:var(--zemin-alt)}
html[data-tema="koyu"] .urun-kart:hover{box-shadow:0 8px 20px rgba(0,0,0,.5)}
html[data-tema="koyu"] .acilir-kutu{box-shadow:0 10px 30px rgba(0,0,0,.55)}
html[data-tema="koyu"] .btn:disabled{background:#2C3E56;color:#8296AE}
html[data-tema="koyu"] .btn-ikincil:hover{background:var(--ana-acik);color:#8FC0FF}
html[data-tema="koyu"] .uyari-basari{background:#0E2E1C;border-color:#1E5B37;color:#A7F3C4}
html[data-tema="koyu"] .uyari-hata{background:#3A1414;border-color:#7F2626;color:#FCA5A5}
html[data-tema="koyu"] .uyari-bilgi{background:#0D2739;border-color:#1D4E6F;color:#A5D8F5}
html[data-tema="koyu"] .uyari-dikkat{background:#332A0C;border-color:#6B5A18;color:#FCE38A}
html[data-tema="koyu"] .durum-beklemede{background:#3A2F0B;color:#F5D77A}
html[data-tema="koyu"] .durum-onaylandi{background:#132A4B;color:#9CC5FF}
html[data-tema="koyu"] .durum-hazirlaniyor{background:#1D1F4A;color:#B4B8FF}
html[data-tema="koyu"] .durum-kargoda{background:#0C3038;color:#8EE0EF}
html[data-tema="koyu"] .durum-teslim{background:#0E2E1C;color:#8DEBB2}
html[data-tema="koyu"] .durum-iptal{background:#3A1414;color:#FCA5A5}
html[data-tema="koyu"] .eski-fiyat{color:#8296AE}
html[data-tema="koyu"] .guven-bandi{color:#8FA6C2}
html[data-tema="koyu"] .banner-slayt{background:#16233A}
html[data-tema="koyu"] img.odeme-logo{background:#fff;border-radius:4px;padding:1px 3px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;
  color:var(--metin);background:var(--zemin-alt);line-height:1.6;font-size:16px;
}
img{max-width:100%;display:block}
a{color:var(--ana);text-decoration:none}
a:hover{text-decoration:underline}
/* Sayfa genişliği: ekrana tam yayılır, çok geniş ekranlarda kenar boşluğu artar.
   Dar bir görünüm isterseniz max-width değerini 1180px yapmanız yeterli. */
.kap{max-width:100%;margin:0 auto;padding:0 clamp(14px, 2.5vw, 44px)}

/* ---------- Koyu mod anahtarı (sağ üst) ---------- */
.tema-anahtar{
  position:relative;flex-shrink:0;
  width:54px;height:30px;padding:0;margin-right:6px;
  border:1px solid var(--cizgi);border-radius:999px;cursor:pointer;
  background:var(--zemin-alt);
  transition:background .25s ease,border-color .25s ease
}
.tema-anahtar:hover{border-color:var(--ana)}
.tema-anahtar:focus-visible{outline:2px solid var(--ana);outline-offset:2px}
/* İz üzerindeki soluk güneş/ay */
.tema-iz{position:absolute;inset:0;display:flex;align-items:center;justify-content:space-between;padding:0 6px;color:var(--soluk);opacity:.65}
/* Kayan topuz */
.tema-topuz{
  position:absolute;top:2px;left:2px;width:24px;height:24px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:#fff;color:#F59E0B;
  box-shadow:0 1px 3px rgba(11,37,69,.3);
  transition:transform .28s cubic-bezier(.34,1.4,.5,1),background .25s,color .25s
}
.topuz-ay,.iz-gunes{display:none}
html[data-tema="koyu"] .tema-anahtar{background:#1B2B42;border-color:#2E4463}
html[data-tema="koyu"] .tema-topuz{transform:translateX(24px);background:#0C1421;color:#FBBF24}
html[data-tema="koyu"] .topuz-gunes,html[data-tema="koyu"] .iz-ay{display:none}
html[data-tema="koyu"] .topuz-ay,html[data-tema="koyu"] .iz-gunes{display:block}
/* Koyu zeminli yönetim panelinde */
.yonetim-ust .tema-anahtar{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.28)}
.yonetim-ust .tema-iz{color:#C8D8EC;opacity:.75}
@media(prefers-reduced-motion:reduce){.tema-topuz{transition:none}}
@media(max-width:560px){.tema-anahtar{width:48px;height:27px;margin-right:2px}
  .tema-topuz{width:21px;height:21px}
  html[data-tema="koyu"] .tema-topuz{transform:translateX(21px)}}

/* ---------- Üst bar ---------- */
.ustbar{background:var(--ustbar-zemin);color:#fff;font-size:13.5px}
.ustbar .kap{display:flex;justify-content:space-between;gap:16px;padding-top:8px;padding-bottom:8px;flex-wrap:wrap}
.ustbar a{color:#fff;opacity:.9}

/* ---------- Başlık ---------- */
header.site{background:var(--zemin);border-bottom:1px solid var(--cizgi);position:sticky;top:0;z-index:60}
header.site .kap{display:flex;align-items:center;gap:20px;padding-top:10px;padding-bottom:10px}
.logo{display:flex;align-items:center;font-size:26px;font-weight:800;color:var(--metin);white-space:nowrap;letter-spacing:-.3px;flex-shrink:0}
.logo:hover{text-decoration:none;color:var(--ana)}
.logo img{max-height:96px;max-width:400px;width:auto;object-fit:contain}
.arama{flex:1;display:flex;min-width:0;max-width:440px;margin:0 auto}
.arama input{flex:1;min-width:0;padding:11px 15px;border:1.5px solid var(--cizgi);border-right:0;border-radius:9px 0 0 9px;font-size:15px;font-family:inherit}
.arama input:focus{outline:0;border-color:var(--ana)}
.arama button{display:flex;align-items:center;gap:7px;padding:0 18px;border:0;background:var(--ana);color:#fff;border-radius:0 9px 9px 0;cursor:pointer;font-size:15px;font-weight:600;font-family:inherit}
.arama button:hover{background:var(--ana-koyu)}

/* ---------- Aramanın yanındaki iletişim numarası ---------- */

/* ---------- Sağ üst simgeler ---------- */
.ust-simgeler{display:flex;align-items:center;gap:4px;flex-shrink:0}
.simge-btn{display:flex;align-items:center;gap:9px;padding:8px 12px;border-radius:9px;color:var(--metin);white-space:nowrap;border:1px solid transparent}
/* Tıklamadan önce renk değişmesin; sadece imleç ve hafif bir vurgu */
.simge-btn:hover{text-decoration:none}
.simge-btn:active,.acilir.acik > .simge-btn{background:var(--zemin-alt);border-color:var(--cizgi)}
.simge-yazi{display:flex;flex-direction:column;line-height:1.25}
.simge-yazi small{font-size:11.5px;color:var(--soluk)}
.simge-yazi strong{font-size:13.5px;font-weight:700}
.sepet-ikon{position:relative;display:flex}
.rozet{background:var(--vurgu);color:#fff;border-radius:999px;padding:1px 7px;font-size:11.5px;font-weight:700;line-height:1.5}
.sepet-ikon .rozet{position:absolute;top:-6px;right:-8px;box-shadow:0 0 0 2px var(--zemin)}
.mobil-menu-btn{display:none;background:none;border:0;padding:8px;cursor:pointer;color:var(--metin)}

/* ---------- Açılır menüler ---------- */
.acilir{position:relative}
.acilir-kutu{
  position:absolute;top:calc(100% + 6px);right:0;min-width:230px;background:var(--zemin);border:1px solid var(--cizgi);
  border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.12);padding:12px;z-index:80;
  opacity:0;visibility:hidden;transform:translateY(-6px);transition:.15s
}
.acilir:not(.hesap-menu):hover > .acilir-kutu,
.acilir.acik > .acilir-kutu{opacity:1;visibility:visible;transform:translateY(0)}
.acilir-kutu a{display:block;padding:8px 10px;border-radius:7px;color:var(--metin);font-size:14px}
.acilir-kutu a:hover{background:var(--zemin-alt);text-decoration:none;color:var(--ana)}
.acilir-kutu .ayrac{height:1px;background:var(--cizgi);margin:8px 0}
.hesap-kutu{min-width:250px}
.marka-kutu{left:0;right:auto;min-width:440px}
.marka-izgara{display:grid;grid-template-columns:repeat(3,1fr);gap:2px}
.marka-izgara a.aktif{color:var(--ana);font-weight:700;background:var(--zemin-alt)}

/* ---------- Hesap menüsü (Hesabım kutusu + açılır panel) ---------- */
.hesap-tetik{
  display:flex;align-items:center;gap:10px;
  background:var(--zemin);border:1.5px solid var(--cizgi);border-radius:10px;
  padding:7px 12px;cursor:pointer;color:var(--metin);font:inherit;white-space:nowrap;
  transition:border-color .15s
}
.hesap-tetik .hesap-yazi{display:flex;flex-direction:column;align-items:flex-start;line-height:1.2}
.hesap-tetik .hesap-yazi strong{font-size:14.5px;font-weight:700}
.hesap-tetik .hesap-yazi small{font-size:12px;color:var(--soluk)}
.hesap-tetik .hesap-ok{color:var(--soluk);transition:transform .2s}
.acilir.acik > .hesap-tetik{border-color:var(--ana)}
.acilir.acik > .hesap-tetik .hesap-ok{transform:rotate(180deg)}

.hesap-kutu{
  min-width:290px;padding:0;
  border-radius:14px;box-shadow:0 14px 40px rgba(11,37,69,.18)
}
/* Tetiğin altındaki küçük ok */
.hesap-kutu::before{
  content:"";position:absolute;top:-7px;right:30px;
  width:13px;height:13px;background:var(--ana-acik);
  border-left:1px solid var(--cizgi);border-top:1px solid var(--cizgi);
  transform:rotate(45deg);border-radius:2px
}
.hesap-ust{
  display:flex;align-items:center;gap:11px;
  background:var(--ana-acik);padding:16px 18px;position:relative;
  border-radius:13px 13px 0 0
}
.hesap-bolum:last-child{border-radius:0 0 13px 13px}
.hesap-ust strong{display:block;font-size:14.5px;line-height:1.3}
.hesap-ust small{display:block;font-size:12.5px;color:var(--soluk);margin-top:2px}
.hesap-rozet{
  flex-shrink:0;width:40px;height:40px;border-radius:50%;
  background:var(--ana);color:#fff;font-weight:700;font-size:17px;
  display:flex;align-items:center;justify-content:center;text-transform:uppercase
}
.hesap-ust-giris{flex-direction:column;align-items:stretch;gap:4px}
.hesap-butonlar{display:flex;gap:8px;margin-top:12px}
.hesap-butonlar .btn{flex:1}

.hesap-bolum{padding:8px 10px;border-top:1px solid var(--cizgi)}
.hesap-kutu .hesap-bolum a{
  display:block;padding:9px 12px;border-radius:8px;
  color:var(--metin);font-size:14.5px;font-weight:600
}
.hesap-kutu .hesap-bolum a:hover{background:var(--zemin-alt);color:var(--ana);text-decoration:none}

/* ---------- Ana menü ---------- */
nav.ana-menu{background:var(--menu-zemin);border-bottom:1px solid var(--cizgi);position:relative;z-index:55}
nav.ana-menu .menu-oge{position:static;display:flex}
nav.ana-menu .kap{
  display:flex;justify-content:center;align-items:stretch;flex-wrap:wrap;
  padding-top:0;padding-bottom:0;overflow:visible;
}
nav.ana-menu .kap > a,
nav.ana-menu .menu-oge > a{
  position:relative;display:flex;align-items:center;justify-content:center;text-align:center;
  padding:0 22px;min-height:50px;
  font-size:14.5px;font-weight:500;line-height:1.3;color:var(--menu-yazi);
  white-space:nowrap;   /* menü yazıları tek satır */
}
/* Ögeler arasındaki ince dikey ayraç */
nav.ana-menu .menu-oge + .menu-oge > a::before,
nav.ana-menu .menu-oge + a::before{
  content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
  width:1px;height:28px;background:var(--menu-ayrac);
}
nav.ana-menu .kap > a:hover,
nav.ana-menu .menu-oge > a:hover,
nav.ana-menu .menu-oge.acik > a{color:var(--ana);background:var(--zemin);text-decoration:none}
nav.ana-menu a.aktif{color:var(--ana);font-weight:700;background:var(--zemin)}
nav.ana-menu a.vurgulu{color:var(--vurgu);font-weight:700}
nav.ana-menu a.vurgulu:hover{color:var(--ana-koyu)}

/* ---------- Kategori üstüne gelince açılan büyük menü ---------- */
.menu-panel{
  position:absolute;left:0;right:0;top:100%;
  background:var(--zemin);border-top:1px solid var(--cizgi);
  box-shadow:0 18px 34px rgba(11,37,69,.18);
  padding:22px 0 26px;z-index:70;
  opacity:0;visibility:hidden;transform:translateY(-6px);transition:.15s
}
.menu-oge:hover > .menu-panel,
.menu-oge.acik > .menu-panel{opacity:1;visibility:visible;transform:translateY(0)}
/* Üzerine gelinen başlık, sekme gibi öne çıkar */
.menu-oge:hover > a{background:var(--zemin);color:var(--ana);border-radius:8px 8px 0 0;font-weight:700}
.menu-oge:hover + .menu-oge > a::before{opacity:0}

/* Panel içindeki .kap, menü şeridinin flex kurallarından etkilenmemeli */
nav.ana-menu .menu-panel .kap{display:block;justify-content:flex-start;flex-wrap:nowrap;overflow:visible;padding-top:0;padding-bottom:0}
.menu-panel-ic{display:flex;gap:34px;align-items:flex-start}
.menu-sutun{display:flex;flex-direction:column;gap:2px;min-width:190px;max-width:250px;flex:0 0 auto}
.menu-sutun-baslik{
  display:block;font-size:14.5px;font-weight:800;color:var(--ana);
  margin-bottom:6px;white-space:normal;line-height:1.3
}
.menu-sutun a.menu-sutun-baslik{display:block;color:var(--ana);font-weight:800;font-size:14.5px;padding:0}
.menu-sutun a.menu-sutun-baslik:hover{text-decoration:underline}
.menu-alt-baslik{font-size:13.5px;font-weight:700;color:var(--metin);margin:8px 0 2px}
.menu-sutun a{
  display:flex;justify-content:space-between;gap:10px;align-items:center;
  padding:5px 0;color:var(--metin);font-size:14px;line-height:1.35
}
.menu-sutun a:hover{color:var(--ana);text-decoration:none}
.menu-sutun .sayi{color:var(--soluk);font-size:12px}

/* Sağdaki ürün kartları */
.menu-vitrin{margin-left:auto;display:grid;grid-template-columns:repeat(2,minmax(0,150px));gap:10px}
.menu-vitrin-kart{
  display:flex;flex-direction:column;gap:6px;
  background:var(--zemin-alt);border:1px solid var(--cizgi);border-radius:10px;padding:8px;
  color:var(--metin)
}
.menu-vitrin-kart:hover{border-color:var(--ana);text-decoration:none}
.menu-vitrin-kart img{width:100%;height:82px;object-fit:contain;background:var(--gorsel-zemin);border-radius:7px}
.menu-vitrin-kart strong{display:block;font-size:12.5px;font-weight:600;line-height:1.3}
.menu-vitrin-kart small{display:block;font-size:13px;font-weight:800;color:var(--ana);margin-top:2px}

@media(max-width:1200px){.menu-vitrin{display:none}}
@media(max-width:820px){.menu-panel{display:none}}

/* ---------- Ödeme logoları ---------- */
.odeme-logolari{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.odeme-logo{height:26px;width:auto;display:block}
.iyzico-rozet{display:inline-flex;align-items:center}
.guven-bandi{display:flex;gap:18px;flex-wrap:wrap;align-items:center;font-size:13px;color:#9FB6D1}
.guven-bandi span{display:inline-flex;align-items:center;gap:6px}
.odeme-bandi{display:flex;justify-content:space-between;align-items:center;gap:28px;flex-wrap:wrap;
  border-top:1px solid #1B3A63;margin-top:28px;padding-top:22px}

/* ---------- WhatsApp ve sosyal medya ----------
   Not: kurallar footer.site ile nitelendirildi; aksi halde
   "footer.site a{display:block}" kuralı bu butonları eziyor. */
footer.site .iletisim-bandi{display:flex;flex-direction:column;align-items:flex-end;gap:12px;flex-shrink:0}
footer.site .sosyal{display:flex;gap:8px}
footer.site .sosyal a{display:flex;align-items:center;justify-content:center;width:38px;height:38px;
  border-radius:10px;background:#16365E;color:#E4EEFA;transition:.15s;padding:0}
footer.site .sosyal a:hover{background:var(--ana);color:#fff;transform:translateY(-2px)}

/* ---------- Yüzen WhatsApp balonu ---------- */
.wa-balon{
  position:fixed;right:22px;bottom:22px;z-index:200;
  display:flex;align-items:center;gap:0;
  width:60px;height:60px;padding:0 15px;overflow:hidden;
  background:#25D366;color:#fff;border-radius:999px;
  box-shadow:0 6px 20px rgba(37,211,102,.45), 0 2px 6px rgba(0,0,0,.2);
  transition:width .25s ease, gap .25s ease, background .15s;
  animation:wa-nabiz 2.6s ease-in-out 1.5s 3;
}
.wa-balon:hover,.wa-balon:focus-visible{
  width:214px;gap:11px;background:#1eb955;text-decoration:none;color:#fff;animation:none;
}
.wa-balon svg{flex-shrink:0}
.wa-balon-yazi{
  white-space:nowrap;font-weight:700;font-size:15px;opacity:0;transition:opacity .2s ease .05s;
}
.wa-balon:hover .wa-balon-yazi,.wa-balon:focus-visible .wa-balon-yazi{opacity:1}
@keyframes wa-nabiz{
  0%,100%{box-shadow:0 6px 20px rgba(37,211,102,.45), 0 2px 6px rgba(0,0,0,.2), 0 0 0 0 rgba(37,211,102,.55)}
  50%    {box-shadow:0 6px 20px rgba(37,211,102,.45), 0 2px 6px rgba(0,0,0,.2), 0 0 0 16px rgba(37,211,102,0)}
}
@media(prefers-reduced-motion:reduce){.wa-balon{animation:none;transition:none}}
@media(max-width:560px){
  .wa-balon{right:16px;bottom:16px;width:56px;height:56px;padding:0 13px}
  .wa-balon:hover{width:56px;gap:0}
  .wa-balon-yazi{display:none}
}
@media print{.wa-balon{display:none!important}}

/* ---------- Ana sayfa banner slaydı + fırsat kutusu ---------- */
.banner-bolum{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:18px;margin:0 0 26px;align-items:stretch}
.banner-bolum.tek-sutun{grid-template-columns:minmax(0,1fr)}
.banner-slayt{position:relative;border-radius:14px;overflow:hidden;background:var(--ana-acik);aspect-ratio:1400/450;max-height:430px}
.banner-bolum .banner-slayt{margin:0;height:100%;max-height:none;aspect-ratio:auto;min-height:300px}
.banner-bolum.tek-sutun .banner-slayt{aspect-ratio:1400/450;min-height:0;max-height:430px}
.banner-ray{position:relative;width:100%;height:100%}
.banner-slayt-tek{position:absolute;inset:0;opacity:0;transition:opacity .45s ease;display:block;pointer-events:none}
.banner-slayt-tek.aktif{opacity:1;pointer-events:auto}
.banner-slayt-tek img{width:100%;height:100%;object-fit:cover;display:block}
.banner-ok{
  position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:44px;height:44px;border-radius:50%;cursor:pointer;
  /* Saydam: arkadaki görsel okun içinden görünür */
  background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.55);
  color:#fff;
  -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);
  display:flex;align-items:center;justify-content:center;
  filter:drop-shadow(0 1px 3px rgba(0,0,0,.35));
  transition:background .2s,border-color .2s
}
.banner-ok:hover{background:rgba(255,255,255,.38);border-color:rgba(255,255,255,.85)}
.banner-onceki{left:14px}
.banner-sonraki{right:14px}
.banner-noktalar{position:absolute;left:0;right:0;bottom:12px;z-index:3;display:flex;gap:7px;justify-content:center}
.banner-noktalar button{
  width:9px;height:9px;padding:0;border:0;border-radius:50%;cursor:pointer;
  background:rgba(255,255,255,.6);transition:width .2s,background .2s
}
.banner-noktalar button.aktif{width:22px;border-radius:6px;background:#fff}
.banner-sayac{
  position:absolute;right:14px;bottom:12px;z-index:3;
  background:rgba(11,37,69,.62);color:#fff;font-size:12.5px;font-weight:600;
  padding:3px 10px;border-radius:20px
}

/* Fırsat Ürünleri kutusu (banner'ın sağında) */
.firsat-kutu{
  display:flex;flex-direction:column;min-width:0;
  background:var(--zemin);border:1px solid var(--cizgi);border-radius:14px;
  overflow:hidden;box-shadow:var(--golge)
}
.firsat-baslik{
  display:flex;align-items:center;justify-content:center;gap:9px;
  background:var(--ana);color:#fff;padding:11px 12px;
  font-size:13.5px;font-weight:800;letter-spacing:.6px;text-transform:uppercase
}
.firsat-govde{position:relative;flex:1;display:flex;align-items:center;padding:14px 34px 10px}
.firsat-urun{display:none;width:100%;text-align:center;color:var(--metin)}
.firsat-urun.aktif{display:block}
.firsat-urun:hover{text-decoration:none}
.firsat-gorsel{position:relative;display:block;background:var(--gorsel-zemin);border-radius:10px;padding:10px}
.firsat-gorsel img{width:100%;height:160px;object-fit:contain;margin:0 auto}
.firsat-rozet{
  position:absolute;top:8px;left:8px;z-index:2;
  background:var(--vurgu);color:#fff;font-size:11.5px;font-weight:700;
  padding:3px 8px;border-radius:6px
}
.firsat-ad{
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  margin-top:12px;font-size:14px;font-weight:600;line-height:1.35;min-height:38px
}
.firsat-urun:hover .firsat-ad{color:var(--ana)}
.firsat-fiyat{display:block;margin-top:8px}
.firsat-fiyat .eski-fiyat{display:block;font-size:13px;margin:0 0 2px}
.firsat-fiyat strong{font-size:21px;font-weight:800;color:var(--ana)}
.firsat-ok{
  position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:30px;height:30px;border-radius:50%;cursor:pointer;
  background:var(--zemin);border:1px solid var(--cizgi);color:var(--metin);
  display:flex;align-items:center;justify-content:center;box-shadow:var(--golge)
}
.firsat-ok:hover{border-color:var(--ana);color:var(--ana)}
.firsat-onceki{left:6px}
.firsat-sonraki{right:6px}
.firsat-alt{border-top:1px solid var(--cizgi);padding:10px;text-align:center}
.firsat-alt a{font-size:13.5px;font-weight:600}

@media(max-width:1100px){
  .banner-bolum{grid-template-columns:minmax(0,1fr)}
  .banner-bolum .banner-slayt{aspect-ratio:1400/450;min-height:0;max-height:430px}
  .firsat-govde{padding:14px 40px 10px}
  .firsat-gorsel img{height:190px}
}
@media(max-width:820px){
  .banner-slayt{border-radius:10px}
  .banner-bolum{margin-bottom:18px;gap:14px}
  .banner-ok{width:34px;height:34px}
  .banner-onceki{left:8px}
  .banner-sonraki{right:8px}
  .banner-sayac{display:none}
}
@media(prefers-reduced-motion:reduce){.banner-slayt-tek{transition:none}}

/* ---------- Ürün detayı öneri satırları ---------- */
.oneri-bolum{margin-top:34px;background:var(--zemin);border:1px solid var(--cizgi);border-radius:var(--radius);padding:18px 14px 20px;box-shadow:var(--golge)}
.oneri-baslik{
  margin:0 0 18px;text-align:center;font-size:19px;font-weight:800;color:var(--ana);
  text-transform:uppercase;letter-spacing:.3px;position:relative;padding-bottom:12px
}
.oneri-baslik::after{
  content:"";position:absolute;left:50%;bottom:0;transform:translateX(-50%);
  width:190px;max-width:60%;height:3px;background:var(--kirmizi);border-radius:2px
}
.oneri-sarmal{position:relative}
.oneri-ray{
  display:flex;gap:12px;overflow-x:auto;scroll-behavior:smooth;
  padding:4px 2px 6px;scrollbar-width:thin
}
.oneri-ray::-webkit-scrollbar{height:7px}
.oneri-ray::-webkit-scrollbar-thumb{background:var(--cizgi);border-radius:4px}
.oneri-kart{
  flex:0 0 214px;display:flex;flex-direction:column;
  border:1px solid var(--cizgi);border-radius:10px;padding:12px;background:var(--zemin);
  transition:.15s
}
.oneri-kart:hover{border-color:var(--ana);box-shadow:0 6px 18px rgba(11,95,191,.12)}
.oneri-gorsel{position:relative;display:block;background:var(--gorsel-zemin);border-radius:8px;overflow:hidden}
.oneri-gorsel img{width:100%;height:165px;object-fit:contain;padding:10px}
.oneri-rozet{
  position:absolute;top:0;right:0;z-index:2;
  background:var(--ana);color:#fff;font-size:11.5px;font-weight:700;
  padding:3px 9px;border-radius:0 8px 0 8px;letter-spacing:.3px
}
.oneri-ad{
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  margin:11px 0 0;font-size:14px;font-weight:600;line-height:1.35;min-height:38px;color:var(--metin)
}
.oneri-ad:hover{color:var(--ana);text-decoration:none}
.oneri-fiyat{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin:12px 0 10px;min-height:44px}
.oneri-fiyat strong{font-size:19px;font-weight:800;width:100%}
.oneri-oran{background:var(--yesil);color:#fff;font-size:12px;font-weight:700;padding:2px 7px;border-radius:5px}
.oneri-fiyat .eski-fiyat{margin:0;font-size:13px}
.oneri-btn{display:flex;align-items:center;justify-content:center;gap:7px;font-size:13px;letter-spacing:.3px;margin-top:auto}
.oneri-ok{
  position:absolute;top:50%;transform:translateY(-50%);z-index:4;
  width:36px;height:36px;border-radius:50%;cursor:pointer;
  background:var(--zemin);border:1px solid var(--cizgi);color:var(--metin);
  display:flex;align-items:center;justify-content:center;box-shadow:0 2px 10px rgba(11,37,69,.16)
}
.oneri-ok:hover{border-color:var(--ana);color:var(--ana)}
.oneri-onceki{left:-10px}
.oneri-sonraki{right:-10px}
@media(max-width:560px){
  .oneri-kart{flex:0 0 168px}
  .oneri-gorsel img{height:130px}
  .oneri-baslik{font-size:16px}
  .oneri-ok{display:none}
}

/* ---------- Yorumlar ve puanlama ---------- */
svg.yildizlar{display:inline-block;vertical-align:middle;flex:none}
.puan-ozet{display:inline-flex;align-items:center;gap:8px;margin-top:8px;font-size:13.5px;color:var(--metin)}
.puan-ozet:hover{text-decoration:none}
.puan-ozet strong{font-size:14.5px}
.yorum-ozet{display:flex;gap:24px;flex-wrap:wrap;align-items:center;margin-top:12px;padding:12px 0;border-top:1px solid var(--cizgi);border-bottom:1px solid var(--cizgi)}
.yorum-puan{display:flex;align-items:center;gap:9px;min-width:0}
.yorum-puan strong{font-size:26px;font-weight:800;line-height:1}
.yorum-puan .soluk{font-size:13px}
.yorum-dagilim{flex:1;min-width:210px;max-width:340px}
.dagilim-satir{display:flex;align-items:center;gap:8px;font-size:12.5px;padding:1px 0}
.dagilim-satir > span:first-child{min-width:46px;color:var(--soluk)}
.dagilim-satir .cubuk{flex:1;height:7px;border-radius:4px;background:var(--zemin-alt);overflow:hidden}
.dagilim-satir .cubuk span{display:block;height:100%;background:#F5A524;border-radius:4px}
.yorum-listesi{margin-top:14px;display:flex;flex-direction:column;gap:0}
.yorum{border-top:1px solid var(--cizgi);padding:12px 0}
.yorum:first-child{border-top:0;padding-top:4px}
.yorum-bas{display:flex;align-items:center;gap:10px}
.yorum-avatar{
  width:32px;height:32px;font-size:14px;border-radius:50%;flex-shrink:0;
  background:var(--ana-acik);color:var(--ana);font-weight:700;font-size:16px;text-transform:uppercase;
  display:flex;align-items:center;justify-content:center
}
.yorum p{margin:7px 0 0 42px;font-size:14px;line-height:1.55}
.yorum-bas strong{font-size:14px}
.yorum-form{max-width:560px;margin-top:4px}
.yorum-yaz{margin-top:16px;border-top:1px solid var(--cizgi);padding-top:12px}
.yorum-yaz > summary{
  display:flex;align-items:center;gap:8px;cursor:pointer;list-style:none;
  font-size:15px;font-weight:700;color:var(--ana)
}
.yorum-yaz > summary::-webkit-details-marker{display:none}
.yorum-yaz[open] > summary{margin-bottom:6px}
/* Yıldız seçimi: radio'lar ters sırada basıldığı için ~ ile soldakiler boyanır */
.puan-secim{display:flex;align-items:center;gap:4px;flex-direction:row-reverse;justify-content:flex-end;margin-top:10px}
.puan-secim > span{margin-right:auto;order:99;font-size:14.5px;font-weight:600}
.puan-secim input{position:absolute;opacity:0;width:0;height:0}
.puan-secim label{color:#C9D4E2;cursor:pointer;line-height:0;transition:color .12s}
.puan-secim label:hover,.puan-secim label:hover ~ label,
.puan-secim input:checked ~ label{color:#F5A524}
.puan-secim input:focus-visible + label{outline:2px solid var(--ana);outline-offset:2px;border-radius:4px}

/* ---------- Sosyal giriş düğmeleri ---------- */
.sosyal-giris{margin-top:18px;display:flex;flex-direction:column;gap:9px}
.sosyal-ayrac{position:relative;text-align:center;margin:4px 0 10px}
.sosyal-ayrac::before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:var(--cizgi)}
.sosyal-ayrac span{position:relative;background:var(--zemin);padding:0 12px;font-size:13px;color:var(--soluk)}
.sosyal-btn{
  display:flex;align-items:center;justify-content:center;gap:10px;
  padding:11px 14px;border:1px solid var(--cizgi);border-radius:9px;
  font-size:14.5px;font-weight:600;color:var(--metin);background:var(--zemin);transition:.15s
}
.sosyal-btn:hover{text-decoration:none;border-color:var(--ana);background:var(--zemin-alt)}
.sosyal-apple,.sosyal-x{background:#000;color:#fff;border-color:#000}
.sosyal-apple:hover,.sosyal-x:hover{background:#1a1a1a;color:#fff;border-color:#1a1a1a}
html[data-tema="koyu"] .sosyal-apple,html[data-tema="koyu"] .sosyal-x{background:#0A0A0A;border-color:#333}

/* ---------- Ürün özellik tablosu ---------- */
.ozellik-tablo{font-size:14.5px;background:transparent}
.ozellik-tablo th{
  width:230px;text-align:left;background:transparent;text-transform:none;letter-spacing:0;
  font-size:14px;font-weight:600;color:var(--soluk);padding:9px 12px 9px 0;vertical-align:top
}
.ozellik-tablo td{padding:9px 0;color:var(--metin)}
@media(max-width:560px){
  .ozellik-tablo th{width:45%;padding-right:8px}
}

/* ---------- Sayfalama ---------- */
.sayfalama{display:flex;gap:6px;justify-content:center;align-items:center;margin-top:32px;flex-wrap:wrap}
.sayfa-no,.sayfa-ok{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:38px;height:38px;padding:0 10px;
  border:1px solid var(--cizgi);border-radius:9px;background:var(--zemin);
  color:var(--metin);font-size:14.5px;font-weight:600
}
.sayfa-no:hover,.sayfa-ok:hover{border-color:var(--ana);color:var(--ana);text-decoration:none}
.sayfa-no.aktif{background:var(--ana);border-color:var(--ana);color:#fff}
.sayfa-bosluk{color:var(--soluk);padding:0 2px}
@media(max-width:560px){.sayfa-no,.sayfa-ok{min-width:34px;height:34px;font-size:13.5px}}

/* ---------- Filtre paneli ---------- */
.vitrin-duzen{display:grid;grid-template-columns:238px minmax(0,1fr);gap:26px;align-items:start}
.filtre{background:var(--zemin);border:1px solid var(--cizgi);border-radius:var(--radius);padding:16px;position:sticky;top:150px}
.filtre h3{font-size:13px;text-transform:uppercase;letter-spacing:.5px;color:var(--soluk);margin:0 0 10px}
.filtre-grup{border-top:1px solid var(--cizgi);padding-top:14px;margin-top:14px}
.filtre-grup:first-of-type{border-top:0;padding-top:0;margin-top:0}
.filtre-liste{display:flex;flex-direction:column;gap:1px;max-height:250px;overflow-y:auto}
.filtre-liste a{display:flex;justify-content:space-between;gap:8px;padding:6px 8px;border-radius:7px;font-size:14px;color:var(--metin)}
.filtre-liste a:hover{background:var(--zemin-alt);text-decoration:none}
.filtre-liste a.aktif{background:var(--ana);color:#fff;font-weight:600}
.filtre-liste a.aktif .sayi{color:#CFE3FA}
.filtre-liste .sayi{color:var(--soluk);font-size:12.5px}
.filtre-ac{display:none}
.secili-filtreler{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}
.filtre-etiket{display:inline-flex;align-items:center;gap:7px;background:var(--zemin);border:1px solid var(--cizgi);
  border-radius:999px;padding:5px 12px;font-size:13.5px;color:var(--metin)}
.filtre-etiket a{color:var(--soluk);font-weight:700;line-height:1}
.filtre-etiket a:hover{color:var(--kirmizi);text-decoration:none}

/* ---------- Marka rozeti ---------- */
.marka-adi{font-size:11px;color:var(--soluk);text-transform:uppercase;letter-spacing:.4px;font-weight:600}
.marka-kart{background:var(--zemin);border:1px solid var(--cizgi);border-radius:var(--radius);padding:18px;
  display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;transition:.15s}
.marka-kart:hover{border-color:var(--ana);transform:translateY(-2px);text-decoration:none}
.marka-kart img{height:52px;object-fit:contain}
.marka-kart strong{color:var(--metin);font-size:15px}

/* ---------- Genel bloklar ---------- */
main{padding:28px 0 56px;min-height:60vh}
h1{font-size:26px;margin:0 0 6px}
h2{font-size:20px;margin:32px 0 14px}
.soluk{color:var(--soluk)}
.kart{background:var(--zemin);border:1px solid var(--cizgi);border-radius:var(--radius);padding:20px;box-shadow:var(--golge)}

/* ---------- Ürün ızgarası ---------- */
.izgara{display:grid;grid-template-columns:repeat(auto-fill,minmax(178px,1fr));gap:12px;margin-top:18px}
.urun-kart{background:var(--zemin);border:1px solid var(--cizgi);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;transition:.15s;box-shadow:var(--golge)}
.urun-kart:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(11,95,191,.13);border-color:var(--ana)}
.urun-kart .gorsel{aspect-ratio:1;background:var(--gorsel-zemin);position:relative;overflow:hidden;
  display:flex;align-items:center;justify-content:center}
/* Ürün görseli kırpılmaz, kutuya sığdırılır — uzun/dar ürünlerin alt kısmı kesilmesin */
.urun-kart .gorsel img{width:100%;height:100%;object-fit:contain;padding:10px}
.urun-kart .icerik{padding:10px 11px 12px;display:flex;flex-direction:column;flex:1}
.urun-kart .ad{font-size:13.5px;font-weight:600;color:var(--metin);margin-bottom:5px;min-height:37px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.urun-kart .ad:hover{text-decoration:none;color:var(--ana)}
.urun-kart .fiyatlar{margin-top:auto;padding-top:6px}
.eski-fiyat{color:var(--soluk);text-decoration:line-through;font-size:12.5px;margin-right:6px}
.fiyat{font-size:16.5px;font-weight:800;color:var(--ana)}
.etiket{position:absolute;top:8px;left:8px;background:var(--vurgu);color:#fff;font-size:11px;font-weight:700;padding:2px 7px;border-radius:5px}
.etiket.tukendi{background:var(--soluk)}

/* ---------- Butonlar ---------- */
.btn{display:inline-block;padding:11px 20px;background:var(--ana);color:#fff;border:0;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;font-family:inherit;text-align:center}
.btn:hover{background:var(--ana-koyu);text-decoration:none;color:#fff}
.btn:disabled{background:#B9CBE0;cursor:not-allowed}
.btn-blok{display:block;width:100%}
.btn-ikincil{background:var(--zemin);color:var(--ana);border:1px solid var(--cizgi);font-weight:600}
.btn-ikincil:hover{background:var(--ana-acik);color:var(--ana-koyu);border-color:var(--ana)}
.btn-kucuk{padding:7px 13px;font-size:13.5px}
.btn-tehlike{background:var(--kirmizi)}
.btn-tehlike:hover{background:#991b1b}

/* Çok geniş ekranlarda okunabilirliği koruyan bloklar */
.dar-icerik{max-width:1180px;margin-left:auto;margin-right:auto}

/* ---------- Ürün detay ---------- */
.urun-detay{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:40px;align-items:start;max-width:1180px}
.detay-gorsel{background:var(--zemin);border:1px solid var(--cizgi);border-radius:var(--radius);overflow:hidden;max-width:420px}
.detay-gorsel img{width:100%;aspect-ratio:1;object-fit:contain;background:var(--gorsel-zemin);padding:16px}
.kucuk-gorseller{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap;max-width:420px}
.kucuk-gorseller img{width:66px;height:66px;object-fit:contain;background:var(--gorsel-zemin);border:1px solid var(--cizgi);border-radius:8px;cursor:pointer}
.kucuk-gorseller img:hover{border-color:var(--ana)}
.detay-fiyat{font-size:32px;font-weight:800;color:var(--ana);margin:12px 0}
.ozellik{display:flex;gap:10px;font-size:14px;padding:7px 0;border-bottom:1px dashed var(--cizgi)}
.ozellik span:first-child{color:var(--soluk);min-width:120px}
.adet-kutu{display:flex;align-items:center;gap:0;border:1px solid var(--cizgi);border-radius:8px;overflow:hidden;width:fit-content}
.adet-kutu button{width:40px;height:42px;border:0;background:var(--zemin-alt);font-size:19px;cursor:pointer;font-family:inherit}
.adet-kutu input{width:56px;height:42px;border:0;border-left:1px solid var(--cizgi);border-right:1px solid var(--cizgi);text-align:center;font-size:16px;font-family:inherit}

/* ---------- Tablo ---------- */
table.tablo{width:100%;border-collapse:collapse;background:var(--zemin);font-size:14.5px}
table.tablo th{text-align:left;padding:12px;background:var(--zemin-alt);border-bottom:1px solid var(--cizgi);font-size:13px;text-transform:uppercase;letter-spacing:.3px;color:var(--soluk)}
table.tablo td{padding:12px;border-bottom:1px solid var(--cizgi);vertical-align:middle}
table.tablo tr:last-child td{border-bottom:0}
.sag{text-align:right}

/* ---------- Sepet / özet ---------- */
.sepet-duzen{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:24px;align-items:start;max-width:1400px;margin-left:auto;margin-right:auto}
.ozet-satir{display:flex;justify-content:space-between;padding:9px 0;font-size:15px}
.ozet-satir.toplam{border-top:2px solid var(--cizgi);margin-top:8px;padding-top:14px;font-size:19px;font-weight:700}

/* ---------- Form ---------- */
label.alan{display:block;font-weight:600;font-size:14px;margin:14px 0 5px}
input[type=text],input[type=email],input[type=tel],input[type=number],input[type=password],select,textarea{
  width:100%;padding:10px 12px;border:1px solid var(--cizgi);border-radius:8px;font-size:15px;font-family:inherit;background:var(--zemin);color:var(--metin)
}
input:focus,select:focus,textarea:focus{outline:2px solid var(--ana);outline-offset:-1px;border-color:var(--ana)}
textarea{min-height:96px;resize:vertical}
.iki-sutun{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.secim{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--cizgi);border-radius:10px;padding:14px;margin-top:10px;cursor:pointer}
.secim:hover{border-color:var(--ana)}
.secim input{margin-top:4px}
.secim strong{display:block;font-size:15px}
.secim small{color:var(--soluk);font-size:13px}

/* ---------- Uyarılar ---------- */
.uyari{padding:13px 16px;border-radius:9px;margin:14px 0;font-size:14.5px}
.uyari-basari{background:#dcfce7;border:1px solid #86efac;color:#14532d}
.uyari-hata{background:#fee2e2;border:1px solid #fca5a5;color:#7f1d1d}
.uyari-bilgi{background:#e0f2fe;border:1px solid #7dd3fc;color:#075985}
.uyari-dikkat{background:#fef9c3;border:1px solid #fde047;color:#713f12}

/* ---------- Durum rozetleri ---------- */
.durum{display:inline-block;padding:3px 10px;border-radius:999px;font-size:12.5px;font-weight:600}
.durum-beklemede{background:#fef9c3;color:#854d0e}
.durum-onaylandi{background:#dbeafe;color:#1e40af}
.durum-hazirlaniyor{background:#e0e7ff;color:#3730a3}
.durum-kargoda{background:#cffafe;color:#155e75}
.durum-teslim{background:#dcfce7;color:#166534}
.durum-iptal{background:#fee2e2;color:#991b1b}

/* ---------- Alt bilgi ---------- */
footer.site{background:var(--lacivert);color:#B7C7DC;padding:40px 0 24px;font-size:14px}
footer.site .kap{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:28px}
footer.site h4{color:#fff;font-size:15px;margin:0 0 12px}
footer.site a{color:#B7C7DC;display:block;padding:3px 0}
footer.site a:hover{color:#fff}
.telif{
  border-top:1px solid #1B3A63;margin-top:28px;padding-top:16px;font-size:13px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap
}
.efatura{display:flex;align-items:center;gap:9px;font-size:13px;color:#C6D6EA}
.efatura svg{flex-shrink:0;border-radius:4px;width:30px;height:21px}
.efatura strong{color:#fff}
@media(max-width:640px){.telif{justify-content:center;text-align:center;gap:10px}}

/* ---------- Boş durum ---------- */
.bos{text-align:center;padding:56px 20px;color:var(--soluk)}
.bos h2{margin-top:0}

/* ---------- Üye sayfaları ---------- */
.uye-duzen{display:grid;grid-template-columns:250px minmax(0,1fr);gap:24px;align-items:start}
.uye-menu{background:var(--zemin);border:1px solid var(--cizgi);border-radius:var(--radius);padding:12px}
.uye-menu a{display:block;padding:10px 12px;border-radius:8px;color:var(--metin);font-size:14.5px}
.uye-menu a:hover{background:var(--zemin-alt);text-decoration:none}
.uye-menu a.aktif{background:var(--ana);color:#fff;font-weight:600}
.giris-kutu{max-width:430px;margin:0 auto}
.sekme-bar{display:flex;gap:4px;background:var(--zemin-alt);padding:4px;border-radius:10px;margin-bottom:20px}
.sekme-bar a{flex:1;text-align:center;padding:10px;border-radius:8px;font-weight:600;font-size:14.5px;color:var(--soluk)}
.sekme-bar a.aktif{background:var(--zemin);color:var(--ana);box-shadow:var(--golge)}
.sekme-bar a:hover{text-decoration:none}

/* ---------- Mobil ---------- */
@media(max-width:1000px){
  .vitrin-duzen{grid-template-columns:1fr}
  .filtre{position:static;display:none}
  body.filtre-acik .filtre{display:block}
  .filtre-ac{display:inline-flex;align-items:center;gap:7px}
  .uye-duzen{grid-template-columns:1fr}
}
@media(max-width:820px){
  .urun-detay,.sepet-duzen{grid-template-columns:1fr}
  header.site .kap{flex-wrap:wrap;gap:10px}
  .arama{order:3;flex-basis:100%;max-width:none;margin:0}
  /* Arama alt satıra indiği için simgeler sağa yaslanmalı,
     yoksa açılır kutu soldan ekran dışına taşıyor. */
  .ust-simgeler{margin-left:auto}
  .arama-yazi{display:none}
  .simge-yazi{display:none}
  .logo img{max-height:64px;max-width:230px}
  .logo{font-size:18.5px}
  .simge-btn{padding:9px}
  .iki-sutun{grid-template-columns:1fr}
  h1{font-size:22px}
  .izgara{grid-template-columns:repeat(auto-fill,minmax(146px,1fr));gap:10px}
  .marka-kutu{min-width:280px;left:auto;right:0}
  .marka-izgara{grid-template-columns:repeat(2,1fr)}
  nav.ana-menu{overflow-x:auto}
  nav.ana-menu .kap{overflow:visible;flex-wrap:nowrap;justify-content:flex-start}
  nav.ana-menu a{min-height:46px;padding:0 15px;white-space:nowrap;font-size:14px}
  .gizle-dar{display:none !important}
  .odeme-bandi{flex-direction:column;align-items:flex-start;gap:16px}
  footer.site .iletisim-bandi{align-items:flex-start;width:100%}
  .ustbar .kap{font-size:12.5px;gap:6px}
}
@media(max-width:560px){
  /* Açılır kutu simge grubunun sağ kenarına hizalanır, ekran dışına taşmaz.
     (position:fixed kullanılırsa kutu sayfanın en altına kayıyordu.) */
  .ust-simgeler{position:relative}
  .acilir{position:static}
  .acilir-kutu{
    position:absolute;top:calc(100% + 10px);left:auto;right:0;
    min-width:0;width:min(288px, calc(100vw - 28px));
  }
  .marka-kutu{left:auto;right:0}
}

/* ---------- Yazdırma ---------- */
@media print{
  header.site,nav.kategoriler,footer.site,.ustbar,.btn{display:none!important}
  body{background:#fff}
}

/* ---------- Taksit tablosu ---------- */
.taksit-kutu{padding:16px 18px}
/* Açılır kutu: başlığa tıklayınca tablo açılıp kapanır */
.taksit-baslik{
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  cursor:pointer;list-style:none;user-select:none
}
.taksit-baslik::-webkit-details-marker{display:none}
.taksit-baslik-yazi{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.taksit-baslik:hover strong{color:var(--ana)}
.taksit-ok{color:var(--soluk);flex-shrink:0;transition:transform .2s}
.taksit-kutu[open] .taksit-ok{transform:rotate(180deg)}
.taksit-kutu[open] .taksit-baslik{margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid var(--cizgi)}
.taksit-icerik{animation:taksit-ac .18s ease}
@keyframes taksit-ac{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.taksit-icerik{animation:none}.taksit-ok{transition:none}}
.taksit-sekmeler{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.taksit-sekme{
  padding:7px 14px;border:1px solid var(--cizgi);background:var(--zemin);border-radius:999px;
  font-size:13.5px;font-weight:600;color:var(--soluk);cursor:pointer;font-family:inherit;transition:.12s;
}
.taksit-sekme:hover{border-color:var(--ana);color:var(--ana)}
.taksit-sekme.aktif{background:var(--ana);border-color:var(--ana);color:#fff}
.taksit-panel{display:none}
.taksit-panel.aktif{display:block}
.taksit-tablo{font-size:14px}
.taksit-tablo th{padding:8px 10px;font-size:12px}
.taksit-tablo td{padding:8px 10px}
.taksit-tablo tbody tr:nth-child(odd){background:var(--zemin-alt)}
@media(max-width:560px){
  .taksit-kutu{padding:14px}
  .taksit-tablo{font-size:13.5px}
}

/* ================= KARGO ================= */
.kargo-secim .secim{--kargo-renk:#555}
.kargo-secim .secim:has(input:checked){border-color:var(--kargo-renk);box-shadow:inset 0 0 0 1px var(--kargo-renk)}
.kargo-secenek strong{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.kargo-secenek .kargo-fiyat{
  margin-left:auto;font-style:normal;font-size:14.5px;font-weight:700;color:var(--kargo-renk);white-space:nowrap;
}
.kargo-secenek strong::before{
  content:"";width:10px;height:10px;border-radius:3px;background:var(--kargo-renk);flex:0 0 auto;
}

.kargo-kutu{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:14px;
  border:1px solid var(--cizgi);border-left:4px solid var(--kargo-renk);
  border-radius:10px;padding:12px 16px;background:var(--zemin-alt);
}
.kargo-kutu-bilgi{display:flex;flex-direction:column;gap:2px;flex:1;min-width:190px}
.kargo-kutu-firma{font-weight:700;color:var(--kargo-renk);font-size:14.5px}
.kargo-kutu-no{font-size:14px}
.kargo-kutu-no strong{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.3px}
.kargo-rozet{
  display:inline-block;padding:2px 9px;border-radius:999px;font-size:12px;font-weight:700;
  color:#fff;background:var(--kargo-renk);
}

.kargo-ayar-liste{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px;margin-top:16px}
.kargo-ayar-kart{border:1px solid var(--cizgi);border-top:3px solid var(--kargo-renk);border-radius:10px;padding:14px 16px}
.kargo-ayar-ust{display:flex;align-items:center;gap:10px;margin-bottom:6px;cursor:pointer}
.kargo-ayar-ust input{width:auto;margin:0}
.kargo-ayar-ad{font-weight:700;font-size:15px;color:var(--kargo-renk)}

/* ================= AYAR SEKMELERİ ================= */
.ayar-sekmeler{
  display:flex;gap:4px;flex-wrap:wrap;margin:18px 0 20px;
  border-bottom:1px solid var(--cizgi);padding-bottom:0;
}
.ayar-sekme{
  padding:9px 15px;border:1px solid transparent;border-bottom:none;background:none;
  border-radius:9px 9px 0 0;font-size:14.5px;font-weight:600;color:var(--soluk);
  cursor:pointer;font-family:inherit;transition:.12s;margin-bottom:-1px;
}
.ayar-sekme:hover{color:var(--ana);background:var(--zemin-alt)}
.ayar-sekme.aktif{
  color:var(--ana);background:var(--zemin);
  border-color:var(--cizgi);border-bottom:1px solid var(--zemin);
}
.ayar-panel{display:none}
.ayar-panel.acik{display:block;animation:ayar-ac .16s ease}
@keyframes ayar-ac{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.ayar-panel.acik{animation:none}}
.ayar-izgara{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:18px;align-items:start}
.ayar-baslik{margin:0 0 8px;font-size:16px}
.ayar-kaydet{
  position:sticky;bottom:0;z-index:5;display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  margin-top:22px;padding:14px 0;background:var(--zemin);border-top:1px solid var(--cizgi);
}
@media(max-width:640px){
  .ayar-sekmeler{gap:2px}
  .ayar-sekme{padding:8px 11px;font-size:13.5px}
  .kargo-ayar-liste{grid-template-columns:1fr}
}

/* ========== TOPLU FİYAT EKRANI ========== */
.toplu-fiyat-tablo td{padding:8px 10px;vertical-align:middle}
.toplu-fiyat-tablo input[type="text"]{
  width:100%;padding:7px 9px;font-size:14px;text-align:right;font-variant-numeric:tabular-nums;
}
.toplu-fiyat-tablo tbody tr:hover{background:var(--zemin-alt)}
.toplu-fiyat-tablo tr.fiyatsiz-satir input[name^="fiyat"]{
  border-color:#E0A800;background:rgba(255,193,7,.10);
}
html[data-tema="koyu"] .toplu-fiyat-tablo tr.fiyatsiz-satir input[name^="fiyat"]{background:rgba(255,193,7,.14)}
@media(max-width:760px){
  .toplu-fiyat-tablo td,.toplu-fiyat-tablo th{padding:6px}
  .toplu-fiyat-tablo input[type="text"]{padding:6px;font-size:13.5px}
}