/* ═══════════════ MATRİS · stiller (13.10.2026) ═══════════════
   Bütün kurallar `.mx*` önekli; `index.html`deki tek `<link>` satırı silinince
   ekran stili kalkar. Tablonun KENDİ stili `js/mxgrid.js`in işi — burada yalnız
   ekranın verdiği hücre/kolon sınıfları (`hucreSinif`, kolon `sinif`) var.

   DÜZEN Kapasite'den (`kapasite.css`): lacivert başlık bandı (`.mxUst`) +
   altında açılıp kapanan filtre paneli (`.mxSuzgec`). Kapasite'nin sınıfları
   KULLANILMADI — renkler burada token olarak kopyalandı.

   ⚠️ KOYU TEMA: renk YALNIZ token olarak tanımlanır, karanlık karşılığı
   `:root[data-theme="dark"]` bloğunda (CLAUDE.md → "KOYU TEMA"). Kural
   gövdesine hex yazma. Yazı (-Y) ve zemin (-Z) AYRI token.
   ⚠️ Pencere (`.mxPerde`) ve başlık hunisi (`.mxHuniPanel`) GÖVDEYE eklenir,
   `.mxEkran`ın dışında kalır — tokenlar onlara da tanımlı.
   ⚠️ vw/vh daima `/ var(--ekranZ,1)` ile (olcek.js — sayfa zoom'u).
   ═════════════════════════════════════════════════════════════════ */

.mxPerde,.mxHuniPanel,.mxAcilir,.mxEkran{
  --mxUstZemin:#16294d; --mxUstYazi:#ffffff;
  --mxSeritZ:#eef1f7;   --mxSeritKenar:#cfd5de;
  --mxKirmiziY:#a3261b; --mxKirmiziZ:#fbe9e7; --mxKirmiziK:#e2a39b;
  --mxYesilY:#15653d;   --mxYesilZ:#e5f4ec;  --mxYesilK:#9fd3b5;
  --mxSariY:#7a4d0a;    --mxSariZ:#fbf0dc;   --mxSariK:#e8c98a;
  --mxMaviY:#1f5fae;    --mxMaviZ:#e8f0fb;   --mxMaviK:#a9c4ea;
  --mxGriY:#4c5868;     --mxGriZ:#eef0f3;    --mxGriK:#cdd3db;
  --mxEnvY:#5b6b80;     --mxEnvZ:#f4f6f9;
  --mxLotY:#16294d;     --mxLotZ:#eaf1fd;
  --mxHesapY:#3b4656;   --mxHesapZ:#f7f8fa;
  --mxModelK:#c3cbd8;
  /* Fark % renk ölçeği (kırmızı = askıdan fazla opsiyon · yeşil = boş askı); yazı ayrı token */
  --mxOlcKY:#8c1d14; --mxOlcK1Z:#fdf0ee; --mxOlcK2Z:#f9d9d4; --mxOlcK3Z:#f2b8b0;
  --mxOlcYY:#11532f; --mxOlcY1Z:#eef8f2; --mxOlcY2Z:#d3eedd; --mxOlcY3Z:#b1e0c3;
  --mxPerdeZ:rgba(8,14,22,.55); --mxGolge:rgba(9,17,32,.24);
}
:root[data-theme="dark"] .mxPerde,:root[data-theme="dark"] .mxHuniPanel,:root[data-theme="dark"] .mxAcilir,:root[data-theme="dark"] .mxEkran{
  --mxUstZemin:#22304a; --mxUstYazi:#eef3fa;
  --mxSeritZ:#1b2534;   --mxSeritKenar:#3a4759;
  --mxKirmiziY:#f6a89e; --mxKirmiziZ:#3a1d1a; --mxKirmiziK:#7a3a32;
  --mxYesilY:#86dfb0;   --mxYesilZ:#132c22;  --mxYesilK:#2d6b4b;
  --mxSariY:#f1ca7f;    --mxSariZ:#2e2410;   --mxSariK:#6b5320;
  --mxMaviY:#8fb8f0;    --mxMaviZ:#16263d;   --mxMaviK:#34507a;
  --mxGriY:#b7c2d0;     --mxGriZ:#1d2531;    --mxGriK:#3a4759;
  --mxEnvY:#a9b6c8;     --mxEnvZ:#1a212b;
  --mxLotY:#dbe6f5;     --mxLotZ:#1c2a40;
  --mxHesapY:#c4cedb;   --mxHesapZ:#161d27;
  --mxModelK:#3a4759;
  --mxOlcKY:#ffc2b9; --mxOlcK1Z:#2c1716; --mxOlcK2Z:#45201c; --mxOlcK3Z:#62261f;
  --mxOlcYY:#b8f0d0; --mxOlcY1Z:#132a1f; --mxOlcY2Z:#17402b; --mxOlcY3Z:#1c5a3a;
  --mxPerdeZ:rgba(0,0,0,.6); --mxGolge:rgba(0,0,0,.5);
}

.mxEkran{position:relative;min-width:0;max-width:100%}

/* ---- başlık bandı ----
   ⚠️ Başlığın rengi AÇIKÇA verilir: app.css h2'ye kendi rengini koyuyor. */
.mxUst{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap;
  background:var(--mxUstZemin);color:var(--mxUstYazi);padding:10px 14px;border-radius:10px 10px 0 0}
.mxEkran.mxSuzKapali .mxUst{border-radius:10px;margin-bottom:10px}
.mxBaslik{font-size:19px;font-weight:650;margin:0;letter-spacing:-.01em;color:var(--mxUstYazi)}
.mxUstSuz,.mxUstBtn{display:inline-flex;align-items:center;gap:6px;min-width:0;font:inherit;font-size:13px;
  line-height:1.2;cursor:pointer;color:var(--mxUstYazi);padding:6px 12px;border-radius:999px;min-height:32px;
  background:color-mix(in srgb,var(--mxUstYazi) 12%,transparent);
  border:1px solid color-mix(in srgb,var(--mxUstYazi) 30%,transparent);white-space:nowrap}
.mxUstSuz:hover,.mxUstBtn:hover{background:color-mix(in srgb,var(--mxUstYazi) 22%,transparent)}
.mxUstSuz:focus-visible,.mxUstBtn:focus-visible,.mxUstLink:focus-visible{outline:2px solid var(--mxUstYazi);outline-offset:2px}
.mxUstBtn{font-weight:600}
.mxUstBtn:disabled{opacity:.5;cursor:default}
.mxUstBtn[aria-pressed="true"]{background:var(--mxUstYazi);color:var(--mxUstZemin);border-color:var(--mxUstYazi)}
.mxUstSuzOk{font-size:11px;opacity:.85}
.mxUstSuzEt{font-weight:600}
.mxUstSuzOzet{opacity:.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  max-width:min(calc(40vw / var(--ekranZ,1)),560px);font-variant-numeric:tabular-nums}
.mxUstLink{font:inherit;font-size:12.5px;font-weight:600;color:var(--mxUstYazi);background:none;border:0;
  padding:6px 4px;cursor:pointer;text-decoration:underline;text-underline-offset:3px;opacity:.9}
.mxUstSag{margin-left:auto;display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-end;gap:8px}
.mxGunc{font-size:12px;color:color-mix(in srgb,var(--mxUstYazi) 75%,transparent);white-space:nowrap;
  font-variant-numeric:tabular-nums}
.mxGuncHata{text-decoration:underline dotted}
/* Kayıt durumu — "Kaydedildi 10:42" / "Kaydediliyor…" / "Kaydedilemedi" */
.mxKayit{font-size:12px;font-weight:600;white-space:nowrap;padding:3px 9px;border-radius:999px;
  color:color-mix(in srgb,var(--mxUstYazi) 80%,transparent);font-variant-numeric:tabular-nums}
.mxKayit:empty{display:none}
.mxKayit[data-durum="bekliyor"]{color:var(--mxUstYazi)}
.mxKayit[data-durum="hata"]{background:var(--mxKirmiziZ);color:var(--mxKirmiziY);cursor:pointer}
.mxTamIkon{font-size:13px;line-height:1}

/* ---- filtre paneli · Ürün | Mağaza ---- */
.mxSuzgec{background:var(--mxSeritZ);border:1px solid var(--mxSeritKenar);border-top:0;
  border-radius:0 0 10px 10px;padding:12px 14px;margin-bottom:10px}
.mxSuzgec:empty,.mxEkran.mxSuzKapali .mxSuzgec{display:none}
.mxSuzIzgara{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px 30px;align-items:start}
.mxGrup{display:flex;flex-direction:column;gap:6px;min-width:0}
.mxGrupAd{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted-aa)}
.mxGrupIc{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.mxAraG{font:inherit;font-size:12.5px;color:var(--ink);background:var(--surface);border:1px solid var(--mxSeritKenar);
  border-radius:9px;padding:6px 10px;min-height:38px;width:200px;max-width:100%;margin:0}
.mxKutu{display:inline-flex;align-items:center;gap:9px;font-size:13px;font-weight:550;color:var(--ink);
  background:var(--surface);border:1px solid var(--mxSeritKenar);border-radius:9px;padding:7px 12px;
  min-height:38px;cursor:pointer;user-select:none}
.mxKutu:hover{border-color:var(--navy4)}
.mxKutu input{width:16px;height:16px;margin:0;accent-color:var(--accent);cursor:pointer;flex:none}
.mxKutuTam{display:flex;width:100%;box-sizing:border-box}
.mxDD{position:relative}
.mxDDBtn{display:flex;align-items:center;gap:7px;font:inherit;font-size:12.5px;
  min-height:38px;padding:5px 12px;cursor:pointer;border:1px solid var(--mxSeritKenar);
  border-radius:9px;background:var(--surface);color:var(--ink2);white-space:nowrap}
.mxDDBtn:hover{border-color:var(--navy4)}
.mxDDBtn::after{content:"";width:0;height:0;border:4px solid transparent;
  border-top-color:currentColor;margin-top:3px;opacity:.55}
.mxDD.acik .mxDDBtn{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}
.mxDDAd{font-weight:650;color:var(--ink2)}
.mxDDDeg{font-weight:550;color:var(--ink);max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mxDDDeg:empty{display:none}
.mxDDBtn.dolu{background:var(--accent-soft);border-color:var(--accent-line)}
.mxDDBtn.dolu .mxDDAd,.mxDDBtn.dolu .mxDDDeg{color:var(--accent-ink)}
.mxDDBtn.dolu .mxDDAd::after{content:":"}
.mxDDPanel{position:absolute;z-index:30;top:calc(100% + 6px);left:0;
  width:max(240px,100%);max-width:min(330px,calc(calc(100vw / var(--ekranZ,1)) - 32px));
  background:var(--surface);border:1px solid var(--line);border-radius:11px;
  box-shadow:0 10px 28px var(--mxGolge);padding:10px}
.mxGrupMag .mxDDPanel{left:auto;right:0}
.mxDDAra{width:100%;font:inherit;font-size:12.5px;color:var(--ink);background:var(--surface2);
  border:1px solid var(--line);border-radius:8px;padding:7px 10px;min-height:36px;margin-bottom:8px;box-sizing:border-box}
.mxDDArac{display:flex;align-items:center;gap:10px;margin-bottom:6px;padding-bottom:6px;border-bottom:1px solid var(--line2)}
.mxDDSay{margin-left:auto;font-size:11px;font-weight:600;color:var(--muted-aa);font-variant-numeric:tabular-nums}
.mxDDListe{max-height:300px;overflow-y:auto;display:flex;flex-direction:column;gap:1px}
.mxDDSatir{display:flex;align-items:center;gap:9px;padding:6px;border-radius:7px;
  font-size:12.5px;font-weight:550;color:var(--ink2);cursor:pointer;min-height:34px}
.mxDDSatir:hover{background:var(--surface2)}
.mxDDSatir input{width:15px;height:15px;accent-color:var(--accent);cursor:pointer;flex:none}
.mxDDSatir span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mxDDBos{font-size:12px;color:var(--muted-aa);padding:10px 6px}

/* ---- şerit + mesaj ----
   app.css `.banner.warn` zemini sabit açık renk (koyu temada parlıyordu) —
   bu ekranda ve pencerelerinde token'a bağlanır. */
.mxEkran .banner.warn,.mxPerde .banner.warn{background:var(--mxSariZ);color:var(--mxSariY)}
.mxSerit{margin-bottom:8px}
.mxMesaj{display:flex;align-items:flex-start;gap:10px;margin-bottom:8px}
.mxMesaj[hidden]{display:none}
.mxMesaj>span{flex:1;min-width:0;white-space:pre-wrap}
.mxMesajKapat{background:none;border:0;font:inherit;font-size:16px;line-height:1;cursor:pointer;color:inherit;
  opacity:.7;padding:0 2px}
.mxMesajKapat:hover{opacity:1}

/* ---- araç satırı: alt sekmeler + düğmeler ---- */
.mxArac{display:flex;align-items:center;flex-wrap:wrap;gap:8px 14px;margin-bottom:8px}
.mxSekmeler{display:inline-flex;flex-wrap:wrap;background:var(--surface);border:1px solid var(--line);
  border-radius:10px;padding:3px;gap:2px}
.mxSekmeler button{border:0;background:transparent;color:var(--muted-aa);font:inherit;font-size:13px;font-weight:550;
  padding:6px 12px;border-radius:7px;cursor:pointer;white-space:nowrap;min-height:32px}
.mxSekmeler button:hover{color:var(--ink)}
.mxSekmeler button.secili{background:var(--accent);color:var(--on-accent);font-weight:650}
.mxSekmeler button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.mxAracSag{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-left:auto;min-width:0}
.mxDugme{border:1px solid var(--line2);background:var(--surface);color:var(--ink);
  border-radius:8px;padding:6px 12px;font:inherit;font-size:13px;cursor:pointer;min-height:32px;white-space:nowrap}
.mxDugme:hover{background:var(--surface2)}
.mxDugme:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.mxDugme[disabled]{opacity:.55;cursor:default}
.mxDugme[aria-pressed="true"]{background:var(--accent-soft);border-color:var(--accent-line);color:var(--accent-ink);font-weight:600}
.mxBirincil{background:var(--accent);border-color:var(--accent);color:var(--on-accent);font-weight:600}
.mxBirincil:hover{filter:brightness(1.06);background:var(--accent)}
.mxTehlike{background:var(--mxKirmiziY);border-color:var(--mxKirmiziY);color:var(--surface)}
.mxTehlike:hover{background:var(--mxKirmiziY);filter:brightness(1.08)}
.mxCip{display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:12.5px;font-weight:550;
  border:1px solid var(--line);background:var(--surface);color:var(--ink2);border-radius:999px;
  padding:4px 11px;min-height:30px;cursor:pointer;white-space:nowrap}
.mxCip b{font-variant-numeric:tabular-nums}
.mxCip-kodyok,.mxCip-asortiyok{border-color:var(--mxKirmiziK);color:var(--mxKirmiziY)}
.mxCip-coklu{border-color:var(--mxSariK);color:var(--mxSariY)}
.mxCip.secili.mxCip-kodyok,.mxCip.secili.mxCip-asortiyok{background:var(--mxKirmiziZ)}
.mxCip.secili.mxCip-coklu{background:var(--mxSariZ)}
.mxSay,.mxSecim{font-size:12px;color:var(--muted-aa);font-variant-numeric:tabular-nums;white-space:nowrap}
.mxSecim:empty,.mxSay:empty{display:none}
.mxSecim{color:var(--ink2);font-weight:600}

/* ---- tablo kabı ----
   Yükseklik JS'te ölçülür (ekranın altına kadar); telefonda CSS karar verir. */
.mxIc{min-width:0;max-width:100%;overflow-x:clip}
.mxGridKap{position:relative;width:100%;max-width:100%;min-height:320px;
  height:calc(calc(100vh / var(--ekranZ,1)) - 260px);
  border:1px solid var(--line);border-radius:10px;background:var(--surface)}
/* Kolon sınıfları (MXGrid kolon `sinif`) */
.mxEkran .mxGridKap .mxAdK{font-weight:600}
.mxEkran .mxGridKap .mxHesapK{color:var(--mxHesapY);background:var(--mxHesapZ)}
.mxEkran .mxGridKap .mxEnvK{color:var(--mxEnvY);background:var(--mxEnvZ);font-size:.92em}
.mxEkran .mxGridKap .mxKodK{font-variant-numeric:tabular-nums}
/* Hücre sınıfları (MXGrid `hucreSinif` · panel `sinif`) */
.mxEkran .mxGridKap .mxLotDolu{color:var(--mxLotY);background:var(--mxLotZ);font-weight:650}
.mxEkran .mxGridKap .mxKirmizi{color:var(--mxKirmiziY);background:var(--mxKirmiziZ);font-weight:650}
.mxEkran .mxGridKap .mxYesil{color:var(--mxYesilY);background:var(--mxYesilZ);font-weight:650}
.mxEkran .mxGridKap .mxNegatif{color:var(--mxKirmiziY);font-weight:600}
.mxEkran .mxGridKap .mxUyari{color:var(--mxSariY);background:var(--mxSariZ);font-weight:600}
.mxEkran .mxGridKap .mxKodYok{color:var(--mxKirmiziY);background:var(--mxKirmiziZ)}
.mxEkran .mxGridKap .mxKodCoklu{color:var(--mxSariY);background:var(--mxSariZ)}
.mxEkran .mxGridKap .mxKodElle{color:var(--mxMaviY);background:var(--mxMaviZ)}
.mxEkran .mxGridKap .mxPasif{color:var(--muted-aa)}
.mxEkran .mxGridKap .mxModelBas{box-shadow:inset 0 1px 0 var(--mxModelK)}
/* Fark % renk ölçeği (panel satırı 4 · Mağazalar sekmesi) */
.mxEkran .mxGridKap .mxOlcK1{color:var(--mxOlcKY);background:var(--mxOlcK1Z);font-weight:600}
.mxEkran .mxGridKap .mxOlcK2{color:var(--mxOlcKY);background:var(--mxOlcK2Z);font-weight:650}
.mxEkran .mxGridKap .mxOlcK3{color:var(--mxOlcKY);background:var(--mxOlcK3Z);font-weight:700}
.mxEkran .mxGridKap .mxOlcY1{color:var(--mxOlcYY);background:var(--mxOlcY1Z);font-weight:600}
.mxEkran .mxGridKap .mxOlcY2{color:var(--mxOlcYY);background:var(--mxOlcY2Z);font-weight:650}
.mxEkran .mxGridKap .mxOlcY3{color:var(--mxOlcYY);background:var(--mxOlcY3Z);font-weight:700}

/* ---- araç satırı: açılır panel düğmeleri ---- */
.mxRozet{font-weight:650;font-size:11px;padding:1px 7px;border-radius:999px;margin-left:4px;
  background:var(--mxSariZ);color:var(--mxSariY);border:1px solid var(--mxSariK)}
.mxAcilirDugme::after{content:"";display:inline-block;width:0;height:0;margin-left:7px;vertical-align:2px;
  border:4px solid transparent;border-top-color:currentColor;opacity:.55}
.mxTehlikeCerceve{color:var(--mxKirmiziY);border-color:var(--mxKirmiziK)}
.mxTehlikeCerceve:hover{background:var(--mxKirmiziZ)}

/* ---- açılır panel (Sütunlar · Sırala) + başlık sağ tık menüsü — gövdeye eklenir ---- */
.mxAcilir{position:fixed;z-index:61;box-sizing:border-box;overflow:auto;display:flex;flex-direction:column;gap:8px;
  background:var(--surface);color:var(--ink);border:1px solid var(--line2);border-radius:10px;
  box-shadow:0 12px 34px var(--mxGolge);padding:10px;max-height:calc(calc(100vh / var(--ekranZ,1)) - 16px)}
.mxAcilir>*{flex:none}
.mxAcBas{font-size:.72rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted-aa)}
.mxSutunPanel{width:320px}
.mxSutunPanel .mxDDAra{margin-bottom:0}
.mxSutunPanel .mxDDArac{margin-bottom:0}
.mxAcilir .mxDDArac .link{white-space:nowrap}
.mxSutunListe{flex:1 1 auto;min-height:80px;max-height:min(calc(56vh / var(--ekranZ,1)),440px);overflow:auto;display:flex;flex-direction:column;gap:1px}
.mxSutunGrup{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted-aa);padding:8px 6px 3px}
.mxSiraPanel{width:290px}
.mxSiraListe{display:flex;flex-direction:column;gap:1px}
.mxSiraListe input{accent-color:var(--accent);width:15px;height:15px;flex:none;margin:0}
.mxPasifSatir{opacity:.55;cursor:default}
.mxSiraYon{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.mxSiraPanel .mxKutu{min-height:34px}
.mxMenu{min-width:220px;max-width:320px;padding:5px;gap:0}
.mxMenuBas{font-size:11px;font-weight:700;color:var(--muted-aa);padding:5px 9px 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  border-bottom:1px solid var(--line2);margin-bottom:3px}
.mxMenuOge{display:block;width:100%;text-align:left;border:0;background:none;color:var(--ink);font:inherit;font-size:13px;
  padding:7px 10px;border-radius:6px;cursor:pointer;white-space:nowrap}
.mxMenuOge:hover:not([disabled]),.mxMenuOge:focus-visible{background:var(--accent-soft);color:var(--accent-ink);outline:0}
.mxMenuOge[disabled]{color:var(--muted-aa);cursor:default}
.mxMenuAyrac{height:1px;background:var(--line2);margin:4px 2px}

/* ---- KLIBRE paneli ---- */
.mxKlbPencere{max-width:min(1040px,calc(calc(100vw / var(--ekranZ,1)) - 36px))}
.mxKlb{display:flex;flex-direction:column;gap:14px;min-width:0}
.mxKlbBolum{display:flex;flex-direction:column;gap:9px;min-width:0}
.mxKlbBolum[hidden],.mxKlbCanli:empty{display:none}
.mxKlbSatir{display:flex;align-items:center;flex-wrap:wrap;gap:8px 16px}
.mxKlbDugmeler{display:flex;flex-wrap:wrap;gap:8px}
.mxKlbOnay{justify-content:flex-end;padding-top:4px}
.mxKlbNot{font-size:.84rem;color:var(--ink2)}
.mxKlbNotUyari{color:var(--mxSariY);font-weight:600}
.mxKlbAlici{margin-top:10px}
.mxKlbAlici .mxAlan{margin:8px 0}
.mxKlbAlici textarea.mxGirdi{width:100%;box-sizing:border-box;resize:vertical;font:inherit;font-size:.84rem}
.mxKlbCanli{border:1px solid var(--line2);border-radius:10px;padding:12px;background:var(--surface2)}
/* anahtar (otomatik gönderim) */
.mxAnahtar{position:relative;display:inline-flex;align-items:center;gap:10px;font-size:.9rem;font-weight:600;color:var(--ink);cursor:pointer;user-select:none}
.mxAnahtar input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.mxAnahtarYol{position:relative;flex:none;width:38px;height:22px;border-radius:999px;background:var(--line2);
  border:1px solid var(--line);box-sizing:border-box;transition:background .15s}
.mxAnahtarYol::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;
  background:var(--surface);box-shadow:0 1px 3px var(--mxGolge);transition:transform .15s}
.mxAnahtar input:checked+.mxAnahtarYol{background:var(--accent);border-color:var(--accent)}
.mxAnahtar input:checked+.mxAnahtarYol::after{transform:translateX(16px)}
.mxAnahtar input:focus-visible+.mxAnahtarYol{outline:2px solid var(--accent);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.mxAnahtarYol,.mxAnahtarYol::after{transition:none}}
/* canlı ilerleme */
.mxKlbIl{display:flex;flex-direction:column;gap:7px}
.mxKlbIlUst{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;font-size:.9rem;color:var(--ink)}
.mxKlbAdim{color:var(--ink2);flex:1 1 auto;min-width:0}
.mxKlbYuzde{font-weight:700;font-variant-numeric:tabular-nums;color:var(--ink)}
.mxKlbCubuk{height:10px;border-radius:999px;background:var(--surface);border:1px solid var(--line);overflow:hidden}
.mxKlbCubuk>i{display:block;height:100%;background:var(--accent);transition:width .4s}
@media (prefers-reduced-motion:reduce){.mxKlbCubuk>i{transition:none}}
/* sonuç kutusu */
.mxKlbSonuc{display:flex;flex-direction:column;gap:3px;border-radius:9px;padding:10px 13px;border:1px solid;font-size:.88rem}
.mxKlbSonuc b{font-size:1rem}
.mxKlbSonuc-tamam{background:var(--mxYesilZ);color:var(--mxYesilY);border-color:var(--mxYesilK)}
.mxKlbSonuc-uyari{background:var(--mxSariZ);color:var(--mxSariY);border-color:var(--mxSariK)}
.mxKlbSonuc-hata{background:var(--mxKirmiziZ);color:var(--mxKirmiziY);border-color:var(--mxKirmiziK)}
.mxKlbSonuc-gri{background:var(--mxGriZ);color:var(--mxGriY);border-color:var(--mxGriK)}
/* durum etiketi (geçmiş tablosu) */
.mxDurumEt{display:inline-block;font-size:11.5px;font-weight:650;padding:2px 8px;border-radius:999px;border:1px solid;white-space:nowrap;
  background:var(--mxGriZ);color:var(--mxGriY);border-color:var(--mxGriK)}
.mxDurum-tamam,.mxDurum-bitti{background:var(--mxYesilZ);color:var(--mxYesilY);border-color:var(--mxYesilK)}
.mxDurum-uyarili{background:var(--mxSariZ);color:var(--mxSariY);border-color:var(--mxSariK)}
.mxDurum-hata{background:var(--mxKirmiziZ);color:var(--mxKirmiziY);border-color:var(--mxKirmiziK)}
.mxDurum-calisiyor{background:var(--mxMaviZ);color:var(--mxMaviY);border-color:var(--mxMaviK)}
/* otomatik koşunun freni ("Otomatik gönderim durduruldu:") — arıza değil, onay bekleyen durma: uyarı rengi */
.mxDurum-fren{background:var(--mxSariZ);color:var(--mxSariY);border-color:var(--mxSariK)}
.mxKlbHataYazi{font-size:11.5px;color:var(--mxKirmiziY);margin-top:3px;max-width:260px;white-space:normal}
.mxKlbFrenYazi{font-size:11.5px;color:var(--mxSariY);margin-top:3px;max-width:260px;white-space:normal}
/* başarılı gönderimin notu (ör. bağlantı koptu, yazım doğrulandı) — hata değil, soluk */
.mxKlbNotYazi{font-size:11.5px;color:var(--muted-aa);margin-top:3px;max-width:260px;white-space:normal}
.mxKlbSonucNot{font-size:.82rem;font-weight:400}
.mxKlbAliciNot{font-size:.78rem;color:var(--muted-aa);margin:-4px 0 8px}
.mxKlbTablo td{white-space:nowrap}
.mxKlbTablo td:nth-child(3),.mxKlbTablo td:nth-child(4){white-space:normal}
/* üst şerit düğmesi: iş sürerken / son gönderim hatalıysa nokta */
.mxKlbNokta{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:7px;background:var(--mxUstYazi);vertical-align:1px}
.mxKlbDugme.mxKlbCalisiyor .mxKlbNokta{animation:mxNabiz 1s ease-in-out infinite}
.mxKlbDugme.mxKlbHatali .mxKlbNokta{background:var(--mxKirmiziK)}
@keyframes mxNabiz{50%{opacity:.25}}
@media (prefers-reduced-motion:reduce){.mxKlbDugme.mxKlbCalisiyor .mxKlbNokta{animation:none}}

/* ---- Yeni ürünler penceresi ---- */
.mxYUPencere{max-width:min(1080px,calc(calc(100vw / var(--ekranZ,1)) - 36px))}
.mxYUFiltre{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px 12px}
.mxYUArac{display:flex;align-items:center;flex-wrap:wrap;gap:8px 14px}
.mxYUAra{width:240px;max-width:100%}
.mxYUListe{max-height:min(calc(52vh / var(--ekranZ,1)),460px);overflow:auto;border:1px solid var(--line2);border-radius:8px}
.mxYUListe .mxBos,.mxYUListe .mxPBanner{margin:10px}
.mxYUTablo thead th{position:sticky;top:0;z-index:1}
.mxYUTablo td{white-space:nowrap}
.mxYUSec{width:30px;text-align:center}
.mxYUSec input{width:15px;height:15px;margin:0;accent-color:var(--accent);cursor:pointer}
.mxEtiket{display:inline-block;font-size:11px;font-weight:650;padding:1px 7px;border-radius:999px;border:1px solid;white-space:nowrap}
.mxEtiketSari{background:var(--mxSariZ);color:var(--mxSariY);border-color:var(--mxSariK)}

/* ---- sürükle-bırak perdesi (yalnız dosya sürüklenirken) ---- */
.mxBirak{position:absolute;inset:0;z-index:20;display:none;align-items:center;justify-content:center;
  background:var(--accent-soft);border:2px dashed var(--accent);border-radius:12px;pointer-events:none}
.mxBirak.acik{display:flex}
.mxBirakIc{text-align:center;padding:22px}
.mxBirakBaslik{font-size:1.05rem;font-weight:600;color:var(--accent-ink)}

/* ---- başlık hunisi (gövdeye eklenir, position:fixed) ---- */
.mxHuniPanel{position:fixed;z-index:60;width:260px;max-width:calc(calc(100vw / var(--ekranZ,1)) - 16px);
  background:var(--surface);border:1px solid var(--line2);border-radius:10px;box-sizing:border-box;overflow:hidden;
  box-shadow:0 12px 34px var(--mxGolge);padding:10px;display:flex;flex-direction:column;gap:8px}
/* Kısa ekranda panel boyu kısılırsa YALNIZ liste daralır; başlık, arama ve
   düğmeler hep görünür. */
.mxHuniPanel>*{flex:none}
.mxHuniPanel>.mxHuniListe{flex:1 1 auto;min-height:48px}
.mxHuniBas{font-size:.72rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted-aa)}
.mxHuniAra{margin-bottom:0}
.mxHuniListe{max-height:min(calc(46vh / var(--ekranZ,1)),300px);overflow:auto;border:1px solid var(--line);
  border-radius:7px;padding:4px}
.mxHuniSatir{display:flex;align-items:center;gap:7px;padding:3px 5px;border-radius:5px;font-size:.84rem;
  color:var(--ink2);cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mxHuniSatir:hover{background:var(--accent-soft)}
.mxHuniSatir input{width:auto;margin:0;flex:0 0 auto;cursor:pointer}
.mxHuniTumEti{border-bottom:1px solid var(--line);border-radius:0;padding-bottom:6px}
.mxHuniDip{display:flex;gap:8px;justify-content:space-between}
.mxHuniDip .mxDugme{padding:4px 10px;font-size:.8rem;min-height:28px}
.mxHuniDip .mxDugme:disabled{opacity:.45;cursor:not-allowed}
/* Huni: A→Z / Z→A satır sıralaması (yalnız görünüm, kayıtlı sıra değişmez) */
.mxHuniSira{display:flex;flex-wrap:wrap;gap:6px}
.mxHuniSira .mxDugme{padding:4px 10px;font-size:.8rem;min-height:28px;flex:1 1 auto}

/* ---- pencere ---- */
.mxPerde{position:fixed;inset:0;z-index:60;background:var(--mxPerdeZ);
  display:flex;align-items:center;justify-content:center;padding:18px}
.mxPencere{background:var(--surface);border:1px solid var(--line2);border-radius:12px;color:var(--ink);
  padding:20px 22px;width:100%;max-width:460px;max-height:calc(90vh / var(--ekranZ,1));overflow-y:auto;overflow-x:hidden;
  box-shadow:0 18px 44px var(--mxGolge);display:flex;flex-direction:column;gap:11px;box-sizing:border-box}
.mxPencere>*{min-width:0}
.mxGenis{max-width:760px}
.mxPBaslik{margin:0;font-size:1.05rem;color:var(--ink)}
.mxPGovde{display:flex;flex-direction:column;gap:10px;min-width:0}
.mxPHata{background:var(--no-soft);border:1px solid var(--no-line);color:var(--no);
  border-radius:8px;padding:9px 11px;font-size:.84rem;white-space:pre-wrap;line-height:1.5}
.mxPHata[hidden]{display:none}
.mxPDugmeler{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:8px;margin-top:3px}
.mxFormIzgara{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 14px}
.mxAlan{display:flex;flex-direction:column;gap:4px;font-size:.84rem;color:var(--ink2);min-width:0}
.mxGirdi{border:1px solid var(--line2);background:var(--surface);color:var(--ink);
  border-radius:8px;padding:7px 10px;font:inherit;font-size:.9rem;width:100%;box-sizing:border-box;margin:0}
.mxGirdi:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.mxMetinAlan{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;resize:vertical;min-height:140px}
.mxPNot{font-size:.82rem;color:var(--muted-aa)}
.mxPNot:empty{display:none}
.mxPBanner{margin:0}
.mxDosyaAd{color:var(--ink2);font-size:.88rem;line-height:1.5}
.mxListeKutu{display:flex;flex-wrap:wrap;gap:6px;max-height:min(calc(50vh / var(--ekranZ,1)),360px);overflow:auto}
.mxOzetIzgara{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:6px 12px}
.mxOzetSatir{display:flex;align-items:baseline;justify-content:space-between;gap:10px;font-size:.86rem;
  color:var(--ink2);padding:6px 10px;border:1px solid var(--line2);border-radius:8px;background:var(--surface2)}
.mxOzetSatir b{color:var(--ink);font-variant-numeric:tabular-nums}
.mxOzetDikkat b{color:var(--mxKirmiziY)}
.mxHataKutu{border:1px solid var(--mxSariK);background:var(--mxSariZ);color:var(--mxSariY);
  border-radius:8px;padding:8px 11px;font-size:.84rem;max-height:min(calc(32vh / var(--ekranZ,1)),240px);overflow:auto}
.mxHataKutu ul{margin:6px 0 0;padding-left:18px}
.mxDetay{border:1px solid var(--line2);border-radius:8px;padding:6px 10px;font-size:.84rem;color:var(--ink2)}
.mxDetay summary{cursor:pointer;font-weight:600;color:var(--ink)}
.mxDetay ul{margin:6px 0 2px;padding-left:18px;max-height:220px;overflow:auto}
.mxOrnek{margin-top:6px}
.mxAltBaslik{margin:4px 0 0;font-size:.9rem;color:var(--ink)}
.mxSonuk{color:var(--muted-aa)}

/* ---- geçmiş & yedek ---- */
.mxGY{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
.mxKart{padding:12px 14px;min-width:0}
.mxKartBas{display:flex;align-items:center;flex-wrap:wrap;gap:8px 14px;margin-bottom:10px}
.mxKartBas h3{margin:0;font-size:1rem;color:var(--ink)}
.mxGFiltre{display:flex;flex-wrap:wrap;gap:8px;margin-left:auto}
.mxGFiltre .mxGirdi{width:auto;min-width:130px;max-width:220px;padding:5px 9px;font-size:.84rem}
.mxTabloKap{overflow-x:auto}
.mxTablo{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.mxTablo th{font-size:11.5px;font-weight:600;color:var(--muted-aa);text-align:left;
  padding:8px 9px;border-bottom:1px solid var(--line);white-space:nowrap;background:var(--surface)}
.mxTablo td{padding:6px 9px;border-bottom:1px solid var(--line2);font-size:12.5px;color:var(--ink);vertical-align:top}
.mxTablo tbody tr:hover td{background:var(--surface2)}
.mxTablo .mxSag{text-align:right}
.mxTablo .mxNo{white-space:nowrap;color:var(--ink2)}
.mxEylem{white-space:nowrap;text-align:right}
.mxEylem .link+.link{margin-left:10px}
.mxTehlikeLink{color:var(--mxKirmiziY)}
.mxDaha{display:flex;justify-content:center;padding-top:10px}
.mxBos{font-size:13px;color:var(--muted-aa);padding:10px 2px}

/* ---- tam ekran = EKRANIN TAMAMI (gövde sınıfı · `matris.js > mxTamEkran`) ----
   Kullanıcı 13.10.2026: "tam ekran full dolu şekilde görebilmeliyim".
   Üst çubuk, menü ve telefondaki kardeş şerit gizlenir; sayfa kabının
   1.600 px sınırı ve `shell()`in gövde kabının satır içi eni kalkar, kenar
   boşluğu 0. Tablonun yüksekliği JS'te: pencere − ekran şeridi
   (`mxYukseklikAyarla`). Bürünme / bakım şeridi görünür kalır. */
body.mxTamMod .top,
body.mxTamMod .mnuKap,
body.mxTamMod .mnuKardes{display:none !important}
body.mxTamMod{max-width:none !important;margin:0 !important}
body.mxTamMod .wrap,
body.mxTamMod #root{max-width:none !important;padding:0 !important;margin:0 !important}
body.mxTamMod #root>div:has(>.mxEkran){max-width:none !important;margin:0 !important}
body.mxTamMod .mxUst,
body.mxTamMod .mxEkran.mxSuzKapali .mxUst{border-radius:0;margin-bottom:0}
body.mxTamMod .mxSuzgec{border-radius:0;border-left:0;border-right:0;margin-bottom:0}
body.mxTamMod .mxSerit,
body.mxTamMod .mxMesaj{margin:6px 10px 0}
body.mxTamMod .mxArac{margin:0;padding:6px 10px}
body.mxTamMod .mxIc{overflow:visible}
body.mxTamMod .mxGridKap{border-radius:0;border-left:0;border-right:0;border-bottom:0;min-height:160px}
body.mxTamMod .mxGY{padding:0 10px 10px}

/* ---- ana ekran kartı (vitrin) — anahtarı `matris` ---- */
.avR-matris{--avZ:#e6f2ee;--avV:#2b7a66;--avY:#173f35}
:root[data-theme="dark"] .avR-matris{--avZ:#132820;--avV:#6fcfb2;--avY:#d7f2e9}

/* ---- dar masaüstü ---- */
@media (min-width:701px) and (max-width:1200px){
  .mxSuzIzgara{grid-template-columns:minmax(0,1fr)}
  .mxGrupMag .mxDDPanel{left:0;right:auto}
  .mxYUFiltre{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* ---- telefon ----
   Matris bir masaüstü aracı; telefonda sayfa yana TAŞMAZ, tablo kendi
   içinde kayar. Panel KAPALI açılır (JS). */
@media (max-width:700px){
  .mxUst{padding:9px 12px}
  .mxBaslik{flex:1 1 auto}
  .mxUstSuz{order:2;flex:1 1 60%}
  .mxUstLink{order:3}
  .mxUstSag{order:4;width:100%;justify-content:flex-start;margin-left:0}
  .mxUstSuzOzet{max-width:none;min-width:0}
  .mxGunc,.mxTamDugme{display:none}
  .mxSuzgec{padding:10px 12px}
  .mxSuzIzgara{grid-template-columns:minmax(0,1fr)}
  .mxGrup{position:relative}
  .mxDD{position:static}
  .mxDDPanel,.mxGrupMag .mxDDPanel{left:0;right:0;width:auto;max-width:none}
  .mxDDDeg{max-width:120px}
  .mxAraG{width:100%}
  .mxArac{flex-direction:column;align-items:stretch}
  .mxSekmeler{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .mxAracSag{margin-left:0}
  .mxGridKap{height:calc(70vh / var(--ekranZ,1));height:calc(70dvh / var(--ekranZ,1));min-height:260px}
  .mxFormIzgara{grid-template-columns:minmax(0,1fr)}
  .mxGFiltre{margin-left:0;width:100%}
  .mxGFiltre .mxGirdi{flex:1 1 140px;max-width:none}
  .mxPencere{padding:16px}
  .mxYUFiltre{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mxYUAra{width:100%}
  .mxSutunPanel,.mxSiraPanel{width:min(290px,calc(calc(100vw / var(--ekranZ,1)) - 16px))}
}
