/* ============================================================
   CIGABIT MAĞAZA — arayüz stilleri
   Tema: Cigabit Blue Design System v1.0 ile UYUMLU (açık mavi)
   Palet kaynağı: /assets/css/cigabit-blue.css
   · beyaz header · gradyan mavi butonlar · lacivert footer · mobil uyumlu
   ============================================================ */
:root{
  /* zemin / yüzey */
  --bg:#f4f8ff; --bg2:#ffffff; --bg3:#eef5ff; --bg4:#e6f1ff;
  --line:#d8e6f6; --line2:#bcd6f2;
  /* metin */
  --tx:#08244b; --tx2:#40628c; --tx3:#4f729a; --tx4:#567a9e;
  /* vurgu (site mavisi) */
  --ac:#087cf5; --ac2:#00b9e8; --ac3:#0a4ebc;
  --ac-soft:rgba(8,124,245,.10); --ac-soft2:rgba(8,124,245,.06);
  --gradient:linear-gradient(115deg,#04c9ee 0%,#0788f8 52%,#083da8 100%);
  /* durum */
  --ok:#0a9b6a; --ok-soft:rgba(10,155,106,.10);
  --warn:#c77700; --warn-soft:rgba(199,119,0,.10);
  --bad:#d92d3f; --bad-soft:rgba(217,45,63,.09);
  --info:#0a4ebc; --info-soft:rgba(10,78,188,.09);
  --gold:#e7ab39; --purple:#6d5cf6;
  /* biçim */
  --r:18px; --r2:11px;
  --sh:0 15px 40px rgba(14,70,135,.12);
  --sh2:0 7px 22px rgba(0,123,245,.22);
  --maks:1400px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:linear-gradient(145deg,#f7fbff,#edf5ff 68%,#fff);
  color:var(--tx); min-height:100vh;
  font:15px/1.5 "Inter",-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%}
a{color:var(--ac);text-decoration:none}
a:hover{color:#005ab6}
h1,h2,h3,h4{margin:0 0 8px;font-weight:700;letter-spacing:-.02em;color:#082249}
h1{font-size:26px}h2{font-size:20px}h3{font-size:17px}
.muted{color:var(--tx2)}
.dim{color:var(--tx3);font-size:13px}
.mono{font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace}
.hidden,[hidden]{display:none!important}
.center{text-align:center}.right{text-align:right}
.nowrap{white-space:nowrap}
.bosluk{height:14px}

/* ---------- üst bar (beyaz, site header gibi) ---------- */
.mg-top{position:sticky;top:0;z-index:70;background:rgba(255,255,255,.96);backdrop-filter:blur(18px);
  border-bottom:1px solid #d9e9fc;box-shadow:0 9px 35px rgba(5,68,145,.09)}
.mg-top-in{max-width:var(--maks);margin:0 auto;display:flex;align-items:center;gap:14px;padding:11px 16px;flex-wrap:wrap}
.mg-burger{display:none;background:none;border:0;color:#0e3d72;font-size:21px;cursor:pointer;padding:4px 6px}
.mg-logo{display:flex;align-items:center;gap:10px;color:#061f43;flex:0 0 auto}
.mg-logo:hover{color:#061f43}
.mg-logo-ic{width:38px;height:38px;border-radius:12px;background:var(--gradient);color:#fff;
  display:grid;place-items:center;font-size:18px;flex:0 0 auto;box-shadow:var(--sh2)}
.mg-logo-tx b{display:block;font-size:15.5px;line-height:1.15;white-space:nowrap;font-weight:850;letter-spacing:-.04em;color:#08224a}
.mg-logo-tx small{color:#627f9f;font-size:11px}
.mg-ara{flex:1 1 220px;display:flex;min-width:170px;background:#f2f8ff;border:1px solid #d8e6f6;border-radius:999px;overflow:hidden}
.mg-ara:focus-within{border-color:#0c9cf8;box-shadow:0 0 0 3px rgba(11,131,242,.14)}
.mg-ara input{flex:1;background:none;border:0;color:var(--tx);padding:9px 14px;font-size:14px;outline:none;min-width:0}
.mg-ara input::placeholder{color:#8298b4}
.mg-ara button{background:none;border:0;color:var(--tx2);padding:0 14px;cursor:pointer;font-size:15px}
.mg-ara button:hover{color:var(--ac)}
.mg-nav{display:flex;gap:2px;flex-wrap:wrap}
.mg-nav a{color:#143253;font-size:14px;padding:8px 11px;border-radius:11px;font-weight:650}
.mg-nav a:hover{color:#047beb;background:#e9f5ff}
.mg-nav a.on{color:#047beb;background:#e9f5ff;box-shadow:inset 0 -3px 0 #128ff4}
.mg-sag{display:flex;align-items:center;gap:9px;margin-left:auto}
.mg-dil{position:relative}
.mg-dil-btn{background:#f2f8ff;border:1px solid #d8e6f6;color:#2c5b89;border-radius:999px;
  padding:7px 12px;cursor:pointer;font-size:13px}
.mg-dil-btn:hover{color:#047beb;border-color:#bcd6f2}
.mg-dil-menu{position:absolute;right:0;top:calc(100% + 6px);background:#fff;border:1px solid #dfebfc;
  border-radius:var(--r2);box-shadow:0 20px 45px rgba(8,47,94,.14);min-width:168px;padding:6px;display:none;z-index:90}
.mg-dil-menu.acik{display:block}
.mg-dil-menu a{display:block;padding:8px 10px;border-radius:8px;color:#2c5b89;font-size:14px}
.mg-dil-menu a:hover{background:#e9f5ff;color:#047beb}
.mg-dil-menu a.on{background:#e9f5ff;color:#047beb;font-weight:600}
.mg-sepet-btn{position:relative;display:inline-flex;align-items:center;gap:7px;background:#f2f8ff;
  border:1px solid #d8e6f6;color:#143253;border-radius:999px;padding:8px 14px;font-size:14px;font-weight:650}
.mg-sepet-btn:hover{border-color:#90c8ff;color:#047beb}
.mg-sepet-btn.on{background:#e9f5ff;border-color:#90c8ff;color:#047beb}
.mg-rozet{background:var(--ac);color:#fff;font-size:11px;font-weight:800;border-radius:20px;padding:1px 7px;min-width:19px;text-align:center}
.mg-hesap{display:inline-flex;align-items:center;gap:8px;color:#143253;font-size:14px;padding:6px 10px;border-radius:999px;font-weight:650}
.mg-hesap:hover{background:#e9f5ff;color:#047beb}
.mg-avatar{width:30px;height:30px;border-radius:50%;background:var(--gradient);color:#fff;
  display:grid;place-items:center;font-size:13px;font-weight:700;flex:0 0 auto}
.mg-giris{background:var(--gradient);color:#fff!important;font-weight:700;border-radius:999px;
  padding:9px 18px;font-size:14px;box-shadow:var(--sh2)}
.mg-giris:hover{opacity:.94;color:#fff!important}

/* ---------- kategori şeridi ---------- */
.mg-katbar{background:#fff;border-top:1px solid #eaf3ff;border-bottom:1px solid #e3eefb}
.mg-katbar-in{max-width:var(--maks);margin:0 auto;display:flex;gap:8px;padding:9px 16px;overflow-x:auto;scrollbar-width:thin}
.mg-katbar-in::-webkit-scrollbar{height:5px}
.mg-katbar-in::-webkit-scrollbar-thumb{background:#c7dcf5;border-radius:3px}
.mg-katbar a{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;background:#f4f9ff;
  border:1px solid #dcebfb;color:#325a86;border-radius:999px;padding:6px 12px;font-size:13px}
.mg-katbar a:hover{border-color:#90c8ff;color:#047beb;background:#eaf5ff}
.mg-katbar a.alt{background:none;font-size:12.5px}
.mg-katbar a .ad{color:var(--tx4);font-size:11.5px}
.mg-katbar .mg-site-link{margin-left:auto;background:none;border-color:transparent;color:var(--tx3)}

/* ---------- çekmece (mobil) ---------- */
.mg-drawer{position:fixed;top:0;left:0;bottom:0;width:290px;max-width:86vw;background:#fff;
  border-right:1px solid #dfebfc;box-shadow:0 20px 35px rgba(7,63,128,.14);padding:14px;overflow-y:auto;
  transform:translateX(-105%);transition:transform .2s ease;z-index:120}
.mg-drawer.acik{transform:none}
.mg-drawer-bas{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid #eaf3ff}
.mg-drawer-bas button{background:none;border:0;color:var(--tx2);font-size:19px;cursor:pointer}
.mg-drawer a{display:flex;align-items:center;gap:9px;padding:10px 10px;border-radius:var(--r2);color:#15395b;font-size:14px}
.mg-drawer a:hover{background:#e9f5ff;color:#047beb}
.mg-drawer a.alt{padding-left:22px;font-size:13px;color:var(--tx3)}
.mg-drawer-sec{color:var(--tx3);font-size:11px;text-transform:uppercase;letter-spacing:.08em;margin:14px 10px 6px}
.mg-ortu{position:fixed;inset:0;background:rgba(6,32,71,.45);z-index:110}
.mg-ortu.acik{display:block}

/* ---------- kapsayıcı ---------- */
.mg-kap{max-width:var(--maks);margin:0 auto;padding:20px 16px 40px;width:100%}
.mg-baslik-satir{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.mg-baslik-satir h1{margin:0}
.mg-kirinti{display:flex;gap:7px;flex-wrap:wrap;color:var(--tx3);font-size:13px;margin-bottom:14px}
.mg-kirinti a{color:var(--tx3)}
.mg-kirinti a:hover{color:var(--ac)}
.mg-kirinti span{color:var(--tx2)}

/* ---------- hero ---------- */
.mg-hero{position:relative;overflow:hidden;border:1px solid #d9e9fc;border-radius:var(--r);
  background:linear-gradient(125deg,#f2f9ff 0%,#e8f3ff 52%,#f6fbff 100%);
  box-shadow:var(--sh);padding:36px 28px;margin-bottom:22px}
.mg-hero::after{content:"";position:absolute;right:-70px;top:-70px;width:280px;height:280px;border-radius:50%;
  background:radial-gradient(circle,rgba(4,201,238,.22),rgba(7,136,248,.10) 55%,transparent 72%)}
.mg-hero h1{font-size:30px;margin-bottom:8px;position:relative;color:#082349}
.mg-hero p{color:var(--tx2);max-width:640px;margin:0 0 16px;position:relative}
.mg-hero .mg-hero-coinlar{display:flex;gap:8px;flex-wrap:wrap;position:relative}
.mg-hero .mg-hero-coinlar span{background:#fff;border:1px solid #d8e6f6;border-radius:999px;
  padding:6px 12px;font-size:13px;color:#325a86;box-shadow:0 4px 14px rgba(14,70,135,.06)}

/* ---------- güven kutuları ---------- */
.mg-guven{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:24px}
.mg-guven div{background:#fff;border:1px solid #dae9fb;box-shadow:0 12px 34px rgba(12,67,126,.075);
  border-radius:var(--r);padding:16px}
.mg-guven b{display:block;margin-bottom:5px;color:#082249}
.mg-guven p{margin:0;color:var(--tx3);font-size:13px}

/* ---------- kategori kartları ---------- */
.mg-kat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;margin-bottom:24px}
.mg-kat-kart{background:#fff;border:1px solid #dae9fb;box-shadow:0 12px 34px rgba(12,67,126,.075);
  border-radius:var(--r);padding:18px;text-align:center;color:var(--tx);transition:.15s}
.mg-kat-kart:hover{border-color:#90c8ff;transform:translateY(-2px);box-shadow:0 16px 38px rgba(8,124,245,.14)}
.mg-kat-kart .ic{font-size:30px;display:block;margin-bottom:8px}
.mg-kat-kart b{display:block;font-size:15px;margin-bottom:4px;color:#082249}
.mg-kat-kart small{color:var(--tx3);font-size:12.5px}

/* ---------- ürün ızgarası ---------- */
.mg-bolum-bas{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:26px 0 14px}
.mg-bolum-bas h2{margin:0}
.mg-bolum-bas a{font-size:13.5px;font-weight:650}
.mg-izgara{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
.mg-urun{background:#fff;border:1px solid #dae9fb;border-radius:var(--r);overflow:hidden;
  box-shadow:0 12px 34px rgba(12,67,126,.075);display:flex;flex-direction:column;transition:.15s}
.mg-urun:hover{border-color:#90c8ff;transform:translateY(-2px);box-shadow:0 18px 40px rgba(8,124,245,.16)}
.mg-urun-img{position:relative;height:156px;background:#fff;border-bottom:1px solid #eef5fd;
  display:flex;align-items:center;justify-content:center;overflow:hidden;padding:14px}
/* Kutu sabit yükseklikte; görsel kutuyu tamamen doldurup object-fit:contain ile oranını korur.
   (grid+place-items ile max-height:100% çözümlenmiyor ve görsel kırpılıyordu.) */
.mg-urun-img img{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;display:block}
.mg-urun-img .ph{font-size:40px;opacity:.72}
.mg-urun-one{position:absolute;top:9px;left:9px;background:var(--gold);color:#2b1d00;font-size:11px;font-weight:800;
  border-radius:999px;padding:3px 9px}
.mg-urun-stok-rozet{position:absolute;top:9px;right:9px;font-size:11px;font-weight:700;border-radius:999px;padding:3px 9px;
  background:var(--ok-soft);color:var(--ok);border:1px solid rgba(10,155,106,.30)}
.mg-urun-stok-rozet.yok{background:var(--bad-soft);color:var(--bad);border-color:rgba(217,45,63,.28)}
.mg-urun-govde{padding:13px;display:flex;flex-direction:column;flex:1;gap:8px}
.mg-urun-kat{color:var(--tx4);font-size:11.5px}
.mg-urun-ad{font-size:14.5px;font-weight:650;line-height:1.35;color:#082249;display:-webkit-box;
  -webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:39px}
.mg-urun-ad:hover{color:#047beb}
.mg-urun-fiyat{display:flex;align-items:baseline;gap:8px;margin-top:auto}
.mg-urun-fiyat b{font-size:19px;color:var(--ac)}
.mg-urun-fiyat s{color:var(--tx4);font-size:13px}
.mg-urun-alt{display:flex;gap:8px}

/* ---------- butonlar ---------- */
.mg-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid var(--line2);
  background:#f4f9ff;color:#143253;border-radius:999px;padding:10px 16px;font-size:14px;cursor:pointer;
  font-family:inherit;transition:.14s;font-weight:650}
.mg-btn:hover{border-color:#90c8ff;color:#047beb;background:#eaf5ff}
.mg-btn-birincil{background:var(--gradient);border-color:transparent;color:#fff;font-weight:700;box-shadow:var(--sh2)}
.mg-btn-birincil:hover{color:#fff;opacity:.94;border-color:transparent;box-shadow:0 10px 29px rgba(0,123,245,.38)}
.mg-btn-tam{width:100%}
.mg-btn-kucuk{padding:7px 12px;font-size:13px}
.mg-btn-tehlike{border-color:rgba(217,45,63,.35);color:var(--bad)}
.mg-btn-tehlike:hover{border-color:var(--bad);background:var(--bad-soft);color:var(--bad)}
.mg-btn[disabled],.mg-btn.kapali{opacity:.5;cursor:not-allowed;pointer-events:none;box-shadow:none}

/* ---------- ürün detay ---------- */
.mg-detay{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:26px;align-items:start}
.mg-detay-gorsel{background:#fff;border:1px solid #dae9fb;box-shadow:var(--sh);border-radius:var(--r);padding:22px;
  display:grid;place-items:center;aspect-ratio:1/1;overflow:hidden;max-width:440px;margin:0 auto}
.mg-detay-gorsel img{width:auto;height:auto;max-width:320px;max-height:320px;object-fit:contain}
.mg-detay-gorsel .ph{font-size:96px;opacity:.7}
.mg-fiyat-buyuk{font-size:32px;font-weight:750;color:var(--ac);margin:6px 0}
.mg-fiyat-buyuk s{font-size:17px;color:var(--tx4);font-weight:400;margin-left:9px}
.mg-etiketler{display:flex;gap:7px;flex-wrap:wrap;margin:10px 0 14px}
.mg-etiket{background:#f4f9ff;border:1px solid #dcebfb;border-radius:999px;padding:5px 12px;font-size:12.5px;color:#325a86}
.mg-etiket.iyi{border-color:rgba(10,155,106,.30);color:var(--ok);background:var(--ok-soft)}
.mg-etiket.kotu{border-color:rgba(217,45,63,.28);color:var(--bad);background:var(--bad-soft)}
.mg-alan{display:flex;align-items:center;gap:10px;margin:14px 0}
.mg-alan label{color:var(--tx2);font-size:14px}
.mg-adet{display:inline-flex;align-items:center;border:1px solid #d8e6f6;border-radius:var(--r2);overflow:hidden;background:#fff}
.mg-adet button{background:#f4f9ff;border:0;color:#143253;width:36px;height:38px;font-size:17px;cursor:pointer}
.mg-adet button:hover{background:#eaf5ff;color:#047beb}
.mg-adet input{width:56px;height:38px;text-align:center;background:#fff;border:0;border-left:1px solid #d8e6f6;
  border-right:1px solid #d8e6f6;color:var(--tx);font-family:inherit;font-size:15px}
.mg-aciklama{color:var(--tx2);font-size:14px;line-height:1.65;white-space:pre-line;margin-top:10px}
.mg-kutu{background:#fff;border:1px solid #dae9fb;box-shadow:0 12px 34px rgba(12,67,126,.075);border-radius:var(--r);padding:16px}
.mg-kutu+.mg-kutu{margin-top:14px}
.mg-kutu h3{margin-bottom:10px}

/* ---------- sepet ---------- */
.mg-sepet{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:20px;align-items:start}
.mg-tablo{width:100%;border-collapse:collapse}
.mg-tablo th{text-align:left;color:var(--tx3);font-size:12.5px;text-transform:uppercase;letter-spacing:.05em;
  padding:10px 12px;border-bottom:1px solid var(--line)}
.mg-tablo td{padding:12px;border-bottom:1px solid var(--line);vertical-align:middle;font-size:14px}
.mg-tablo tr:last-child td{border-bottom:0}
.mg-sepet-urun{display:flex;align-items:center;gap:12px;min-width:0}
.mg-sepet-urun .g{width:58px;height:58px;border-radius:var(--r2);background:linear-gradient(135deg,#eef6ff,#e2efff);
  display:grid;place-items:center;overflow:hidden;flex:0 0 auto;font-size:24px}
.mg-sepet-urun .g img{width:100%;height:100%;object-fit:cover}
.mg-sepet-urun .a{min-width:0}
.mg-sepet-urun .a b{display:block;font-size:14px;font-weight:650;line-height:1.3;color:#082249}
.mg-sepet-urun .a small{color:var(--tx3);font-size:12px}
.mg-ozet-kutu{background:#fff;border:1px solid #dae9fb;box-shadow:var(--sh);border-radius:var(--r);padding:18px;position:sticky;top:96px}
.mg-ozet-satir{display:flex;justify-content:space-between;gap:10px;padding:8px 0;font-size:14px;color:var(--tx2)}
.mg-ozet-satir.toplam{border-top:1px solid var(--line);margin-top:8px;padding-top:14px;color:var(--tx);font-size:17px;font-weight:700}
.mg-ozet-satir.toplam b{color:var(--ac)}
.mg-bos{text-align:center;padding:52px 20px;background:#fff;border:1px solid #dae9fb;box-shadow:var(--sh);border-radius:var(--r)}
.mg-bos .ic{font-size:52px;display:block;margin-bottom:12px;opacity:.8}
.mg-bos h3{margin-bottom:6px}
.mg-bos p{color:var(--tx3);margin:0 0 18px}

/* ---------- ödeme ---------- */
.mg-odeme{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:20px;align-items:start}
.mg-coinler{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}
.mg-coin{background:#fff;border:1px solid #dae9fb;border-radius:var(--r);padding:15px;cursor:pointer;
  display:flex;gap:12px;align-items:center;transition:.14s;color:var(--tx);box-shadow:0 12px 34px rgba(12,67,126,.075)}
.mg-coin:hover{border-color:#90c8ff}
.mg-coin.sec{border-color:var(--ac);background:#f2f9ff;box-shadow:0 0 0 3px rgba(8,124,245,.14)}
.mg-coin .ic{font-size:26px;flex:0 0 auto}
.mg-coin b{display:block;font-size:14.5px;color:#082249}
.mg-coin small{color:var(--tx3);font-size:12px}
.mg-adres-kutu{background:#f7fbff;border:1px dashed #bcd6f2;border-radius:var(--r2);padding:14px;margin:10px 0}
.mg-adres{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:space-between}
.mg-adres code{font-family:"SFMono-Regular",Consolas,monospace;font-size:13.5px;color:#082249;
  word-break:break-all;background:#fff;border:1px solid #e3eefb;padding:8px 11px;border-radius:8px;flex:1 1 240px}
.mg-kopyala{background:#fff;border:1px solid var(--line2);color:#325a86;border-radius:8px;padding:8px 12px;
  cursor:pointer;font-size:13px;font-weight:650}
.mg-kopyala:hover{border-color:var(--ac);color:var(--ac);background:#f2f9ff}
.mg-tutar-buyuk{font-size:26px;font-weight:750;color:var(--ac);font-family:"SFMono-Regular",Consolas,monospace}
.mg-qr{display:grid;place-items:center;background:#fff;border:1px solid #e3eefb;border-radius:var(--r2);padding:12px;width:max-content;margin:0 auto}
.mg-qr canvas,.mg-qr img{display:block}
.mg-sayac{display:flex;align-items:center;gap:9px;background:var(--warn-soft);border:1px solid rgba(199,119,0,.28);
  color:var(--warn);border-radius:var(--r2);padding:11px 14px;font-size:14px;margin-bottom:14px;font-weight:600}
.mg-sayac.kritik{background:var(--bad-soft);border-color:rgba(217,45,63,.32);color:var(--bad)}
.mg-sayac b{font-family:"SFMono-Regular",Consolas,monospace;font-size:16px}
.mg-adimlar{margin:0;padding-left:20px;color:var(--tx2);font-size:13.5px;line-height:1.8}
.mg-girdi{width:100%;background:#fff;border:1px solid #d8e6f6;border-radius:var(--r2);color:var(--tx);
  padding:12px 14px;font-size:14px;font-family:inherit;outline:none}
.mg-girdi:focus{border-color:#0c9cf8;box-shadow:0 0 0 3px rgba(11,131,242,.14)}
.mg-girdi.mono{font-family:"SFMono-Regular",Consolas,monospace;font-size:13px}
label.mg-etiket-ust{display:block;color:var(--tx2);font-size:13.5px;margin:12px 0 6px;font-weight:600}

/* ---------- siparişler ---------- */
.mg-sip-kart{background:#fff;border:1px solid #dae9fb;box-shadow:0 12px 34px rgba(12,67,126,.075);border-radius:var(--r);
  padding:15px;margin-bottom:12px;display:grid;grid-template-columns:1.1fr 1fr 1fr .9fr auto;gap:12px;align-items:center}
.mg-sip-kart:hover{border-color:#90c8ff}
.mg-sip-kart .bl{display:block}
.mg-sip-kart .bl span{display:block;color:var(--tx3);font-size:11.5px;text-transform:uppercase;letter-spacing:.04em}
.mg-sip-kart .bl b{font-size:14.5px;color:#082249}
.mg-durum{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:5px 12px;font-size:12.5px;font-weight:700}
.mg-durum.bekliyor{background:var(--warn-soft);color:var(--warn);border:1px solid rgba(199,119,0,.26)}
.mg-durum.inceliyor{background:var(--info-soft);color:var(--info);border:1px solid rgba(10,78,188,.24)}
.mg-durum.tamam{background:var(--ok-soft);color:var(--ok);border:1px solid rgba(10,155,106,.26)}
.mg-durum.red,.mg-durum.iptal,.mg-durum.suresi{background:var(--bad-soft);color:var(--bad);border:1px solid rgba(217,45,63,.26)}
.mg-durum.bilinmiyor{background:#f4f9ff;color:var(--tx3);border:1px solid var(--line)}
.mg-teslim{background:var(--ok-soft);border:1px solid rgba(10,155,106,.28);border-radius:var(--r);padding:15px;margin-top:12px}
.mg-teslim h3{color:var(--ok);display:flex;align-items:center;gap:8px}
.mg-hesap-satir{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #d7e9dc;
  border-radius:var(--r2);padding:11px 13px;margin-top:9px;flex-wrap:wrap;justify-content:space-between}
.mg-hesap-satir code{font-family:"SFMono-Regular",Consolas,monospace;font-size:13.5px;color:#082249;word-break:break-all}
.mg-hesap-satir small{color:var(--tx3);font-size:12px;display:block}
.mg-surec{display:flex;gap:0;margin:6px 0 18px;flex-wrap:wrap}
.mg-surec div{display:flex;align-items:center;gap:8px;color:var(--tx3);font-size:13px;padding:0 16px 0 0}
.mg-surec div::after{content:"›";margin-left:16px;color:var(--line2)}
.mg-surec div:last-child::after{content:""}
.mg-surec div.on{color:var(--ac);font-weight:700}

/* ---------- uyarılar ---------- */
.mg-uyari{border-radius:var(--r2);padding:12px 14px;font-size:14px;margin-bottom:14px;display:flex;gap:9px;align-items:flex-start}
.mg-uyari.iyi{background:var(--ok-soft);border:1px solid rgba(10,155,106,.28);color:#076b4a}
.mg-uyari.hata{background:var(--bad-soft);border:1px solid rgba(217,45,63,.28);color:#a51f2e}
.mg-uyari.bilgi{background:var(--info-soft);border:1px solid rgba(10,78,188,.22);color:#0a3f96}
.mg-uyari.uyar{background:var(--warn-soft);border:1px solid rgba(199,119,0,.26);color:#9a5c00}
.mg-flash{position:fixed;top:74px;left:50%;transform:translateX(-50%);z-index:200;border-radius:var(--r2);
  padding:12px 20px;font-size:14px;box-shadow:0 20px 45px rgba(8,47,94,.18);background:#fff;border:1px solid var(--line2);color:var(--tx)}
.mg-flash-ok{border-color:rgba(10,155,106,.45);color:#076b4a}
.mg-flash-hata{border-color:rgba(217,45,63,.45);color:#a51f2e}
.mg-toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);z-index:250;background:#fff;
  border:1px solid var(--line2);color:var(--tx);border-radius:var(--r2);padding:12px 20px;font-size:14px;box-shadow:0 20px 45px rgba(8,47,94,.18)}
.mg-toast.iyi{border-color:rgba(10,155,106,.45);color:#076b4a}
.mg-toast.hata{border-color:rgba(217,45,63,.45);color:#a51f2e}

/* ---------- sayfalama ---------- */
.mg-sayfa{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin:26px 0 6px}
.mg-sayfa-b{min-width:38px;height:38px;display:grid;place-items:center;border:1px solid #dcebfb;
  background:#fff;border-radius:var(--r2);color:#325a86;font-size:14px;padding:0 10px}
.mg-sayfa-b:hover{border-color:#90c8ff;color:#047beb}
.mg-sayfa-b.aktif{background:var(--gradient);border-color:transparent;color:#fff;font-weight:700}
.mg-sayfa-nokta{color:var(--tx3);align-self:center;padding:0 4px}

/* ---------- alt bilgi (site footer'ı gibi lacivert) ---------- */
.mg-alt{background:linear-gradient(115deg,#061c3d 0%,#062b61 50%,#041b40 100%);margin-top:34px;padding:34px 16px 16px;color:#e8f3ff}
.mg-alt-in{max-width:var(--maks);margin:0 auto;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:22px}
.mg-alt-kol b{display:block;margin-bottom:10px;font-size:14.5px;color:#fff}
.mg-alt-kol a{display:block;color:#c5d8ee;font-size:13.5px;padding:3px 0}
.mg-alt-kol a:hover{color:#30d5ff}
.mg-alt-marka{display:flex;align-items:center;gap:9px;margin-bottom:9px;color:#fff}
.mg-alt .dim,.mg-alt p{color:#c3d4eb}
.mg-coin-rozetler{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:10px}
.mg-coin-rozet{background:rgba(255,255,255,.08);border:1px solid rgba(160,205,255,.25);border-radius:999px;
  padding:5px 11px;font-size:12.5px;color:#d5e6fa}
.mg-alt-son{max-width:var(--maks);margin:22px auto 0;padding-top:14px;border-top:1px solid rgba(192,220,255,.16);
  color:#b7cde8;font-size:12.5px;text-align:center}

/* ---------- mobil ---------- */
@media (max-width:1080px){
  .mg-guven{grid-template-columns:1fr}
  .mg-detay{grid-template-columns:1fr;gap:18px}
  .mg-sepet,.mg-odeme{grid-template-columns:1fr}
  .mg-ozet-kutu{position:static}
  .mg-alt-in{grid-template-columns:1fr 1fr}
}
@media (max-width:900px){
  .mg-burger{display:block}
  .mg-nav{display:none}
  .mg-ara{order:5;flex-basis:100%}
  .mg-logo-tx small{display:none}
  .mg-hide-sm{display:none}
  .mg-katbar-in{padding:9px 12px}
  .mg-kap{padding:16px 12px 34px}
  .mg-sip-kart{grid-template-columns:1fr 1fr;gap:10px}
  .mg-sip-kart .sg{grid-column:1/-1}
  .mg-izgara{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
  .mg-urun-ad{font-size:13.5px;min-height:36px}
  .mg-urun-fiyat b{font-size:17px}
  .mg-hero{padding:24px 18px}
  .mg-hero h1{font-size:23px}
  .mg-kat-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:11px}
  /* tablo → kart düzeni */
  .mg-tablo thead{display:none}
  .mg-tablo,.mg-tablo tbody,.mg-tablo tr,.mg-tablo td{display:block;width:100%}
  .mg-tablo tr{border:1px solid #dae9fb;border-radius:var(--r2);margin-bottom:10px;padding:10px;background:#fff}
  .mg-tablo td{border:0;padding:5px 0;display:flex;justify-content:space-between;gap:12px;align-items:center}
  .mg-tablo td::before{content:attr(data-l);color:var(--tx3);font-size:12px;text-transform:uppercase;letter-spacing:.04em}
  .mg-tablo td.mg-td-tam{display:block}
  .mg-tablo td.mg-td-tam::before{display:block;margin-bottom:7px}
  .mg-alt-in{grid-template-columns:1fr;gap:18px}
}
@media (max-width:480px){
  .mg-izgara{grid-template-columns:repeat(2,1fr);gap:10px}
  .mg-urun-govde{padding:10px}
  .mg-coinler{grid-template-columns:1fr}
  .mg-adres code{flex-basis:100%}
  .mg-tutar-buyuk{font-size:22px}
}

/* ==================== GÖRSEL ÖLÇEK AYARI (15.10.2026) ====================
   Kaynak ürün görselleri 256x256 kare logolardır. Kart kutusu kare/aspect
   tabanlı olduğu için görsel kutuya sığmıyor, taşıp kırpılıyordu (kutudan
   büyük görünüyordu). Kutu sabit yükseklik + contain kuralına alındı. */
.mg-urun-img{aspect-ratio:auto}
.mg-urun-img img,.mg-detay-gorsel img{image-rendering:auto}
@media (max-width:900px){
  .mg-urun-img{height:142px;padding:12px}
  .mg-detay-gorsel{padding:18px}
  .mg-detay-gorsel img{max-width:280px;max-height:280px}
}
@media (max-width:640px){
  .mg-urun-img{height:126px;padding:10px}
  .mg-urun-img .ph{font-size:34px}
  .mg-detay-gorsel{padding:16px;max-width:100%}
  .mg-detay-gorsel img{max-width:230px;max-height:230px}
}


/* ============================================================
   20261015e — KUPON · FAVORİ · ARAMA/FİLTRE (eklenti bloğu)
   ============================================================ */

/* --- favori kalbi (ürün kartı) --- */
.mg-urun{position:relative}
.mg-fav{position:absolute;top:9px;right:9px;z-index:4;width:36px;height:36px;padding:0;border-radius:50%;
  border:1px solid var(--line2);background:rgba(255,255,255,.93);color:#7d94b3;font-size:18px;line-height:1;
  display:flex;align-items:center;justify-content:center;cursor:pointer;text-decoration:none;
  box-shadow:0 4px 12px rgba(14,70,135,.10);transition:transform .15s,color .15s,border-color .15s}
.mg-fav:hover{transform:scale(1.09);color:#e0356b;border-color:#f3b3c8}
.mg-fav.on{color:#e0356b;border-color:#f3b3c8;background:#fff5f8}
.mg-fav.kapali{opacity:.45;pointer-events:none}
.mg-fav-misafir{color:#9fb3cc}

/* --- kupon (sepet özeti) --- */
.mg-kupon-kutu{margin-top:14px;padding-top:12px;border-top:1px dashed var(--line)}
.mg-kupon-form{display:flex;gap:8px;align-items:center}
.mg-kupon-form input[type=text]{flex:1;min-width:0;padding:10px 12px;border:1px solid var(--line2);border-radius:var(--r2);
  font:600 14px/1 inherit;letter-spacing:.5px;color:var(--tx);background:#fff;text-transform:uppercase}
.mg-kupon-form input[type=text]:focus{outline:none;border-color:var(--ac);box-shadow:0 0 0 3px var(--ac-soft)}
.mg-kupon-aktif{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px;border-radius:var(--r2);
  background:var(--ok-soft);border:1px dashed rgba(10,155,106,.35);color:var(--ok);font-size:13.5px}
.mg-kupon-aktif form{display:inline}
.mg-indirim-satir{color:var(--ok)}
.mg-indirim-satir span:last-child{font-weight:800}
.mg-indirim-satir code{background:var(--ok-soft);color:var(--ok);padding:2px 7px;border-radius:6px;font-size:12.5px}

/* --- arama/filtre sayfası --- */
.mg-ara-sayfa{display:grid;grid-template-columns:290px 1fr;gap:20px;align-items:start}
.mg-filtre-kutu{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);padding:16px;
  box-shadow:var(--sh);position:sticky;top:14px}
.mg-filtre-kutu h3{margin:16px 0 8px;font-size:13.5px;color:var(--tx2);text-transform:uppercase;letter-spacing:.4px}
.mg-filtre-kutu h3:first-child{margin-top:0}
.mg-filtre-kutu .mg-girdi{width:100%}
.mg-fiyat-araligi{display:flex;align-items:center;gap:8px}
.mg-fiyat-araligi .mg-girdi{flex:1;min-width:0}
.mg-fiyat-araligi span{color:var(--tx3)}

/* --- teslim edilen hesap kutusu (sipariş takibi) --- */
.mg-teslim{margin-top:12px;padding:12px;border:1px solid var(--line);border-radius:var(--r2);background:var(--bg3)}
.mg-teslim b{display:block;margin-bottom:8px;color:var(--tx)}

@media (max-width:900px){
  .mg-ara-sayfa{grid-template-columns:1fr}
  .mg-filtre-kutu{position:static}
}
@media (max-width:520px){
  .mg-kupon-form{flex-wrap:wrap}
  .mg-kupon-form input[type=text]{width:100%}
}

/* --- ürün detayı: favori butonu --- */
.mg-fav-satir{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:14px 0 4px}
.mg-fav-buyuk{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;
  border:1px solid var(--line2);background:#fff;color:#5b7699;font:600 14px/1 inherit;cursor:pointer;
  text-decoration:none;transition:.15s}
.mg-fav-buyuk:hover{border-color:#f3b3c8;color:#e0356b}
.mg-fav-buyuk.on{border-color:#f3b3c8;background:#fff5f8;color:#e0356b}
.mg-fav-buyuk.on .tx{color:#e0356b}
.mg-fav-buyuk .sm{font-size:18px;line-height:1}
.mg-fav-buyuk .tx{font-size:13.5px}