/* ─────────────────────────────────────────────────────────────────────────
   HAYEK ERP1 — ekran dili
   Ölçüler bilerek sabit: düğme / arama / süzgeç kutuları 40px, etiket üstte,
   tablo satırı kompakt, tablo başlığı sabit (sticky).
   ───────────────────────────────────────────────────────────────────────── */
:root {
  --kenar: #dfe3e8;
  --zemin: #f4f6f8;
  --kart: #ffffff;
  --metin: #1f2933;
  --metin-soluk: #6b7684;
  --vurgu: #1d4ed8;
  --vurgu-koyu: #1e40af;
  --vurgu-acik: #eff4ff;
  --olumlu: #0f7b4f;
  --olumlu-zemin: #e7f6ee;
  --olumsuz: #b42318;
  --olumsuz-zemin: #fdecea;
  --uyari: #b45309;
  --uyari-zemin: #fff5e6;
  --kutu-h: 40px;
  --yuvarlak: 8px;
  --golge: 0 1px 2px rgba(16, 24, 40, .06), 0 1px 3px rgba(16, 24, 40, .04);
  --menu-genislik: 232px;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font: 14px/1.5 "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: var(--metin);
  background: var(--zemin);
}

a { color: var(--vurgu); text-decoration: none; }
a:hover { text-decoration: underline; }

/* ── Yerleşim ─────────────────────────────────────────────────────────── */
.kabuk { display: flex; min-height: 100vh; }

.yan-menu {
  width: var(--menu-genislik);
  flex: 0 0 var(--menu-genislik);
  background: #10203a;
  color: #cbd5e1;
  display: flex;
  flex-direction: column;
  /* ⚠ `sticky` iken uzun sayfalarda menünün koyu zemini 100vh'de bitiyor,
     altta boşluk kalıyordu. `fixed` + içeriğe sol boşluk bunu çözer. */
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  overflow-y: auto;
  z-index: 30;
}
.yan-menu .marka {
  padding: 16px 18px;
  font-size: 1.05rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: .3px;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.yan-menu .marka small { display: block; font-weight: 400; font-size: .72rem; color: #93a4bd; }

.menu-grup { padding: 6px 0; }
.menu-baslik {
  padding: 10px 18px 6px;
  font-size: .70rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #8ea0bb;
  cursor: pointer;
  user-select: none;
  display: flex;
  justify-content: space-between;
}
.menu-grup[data-renk="turuncu"] .menu-baslik { color: #f0a868; }
.menu-grup[data-renk="mor"]     .menu-baslik { color: #c3a6f0; }
.menu-grup[data-renk="yesil"]   .menu-baslik { color: #86d3aa; }
.menu-grup[data-renk="gri"]     .menu-baslik { color: #a8b3c2; }

.menu-ogeler a {
  display: block;
  padding: 7px 18px 7px 24px;
  color: #cbd5e1;
  font-size: .875rem;
  border-left: 3px solid transparent;
}
.menu-ogeler a:hover { background: rgba(255, 255, 255, .06); text-decoration: none; }
.menu-ogeler a.etkin {
  background: rgba(255, 255, 255, .10);
  color: #fff;
  border-left-color: #4f8ef7;
  font-weight: 600;
}
.menu-grup.kapali .menu-ogeler { display: none; }
/* Gruplar artık katlı başlıyor: ok işareti durumu göstersin */
/* ⚠ transform satır içi (inline) span'e UYGULANMAZ — inline-block şart */
.menu-baslik span:last-child { display: inline-block; transition: transform .15s; }
.menu-grup.kapali .menu-baslik span:last-child { transform: rotate(-90deg); }

.icerik {
  flex: 1;
  min-width: 0;
  margin-left: var(--menu-genislik);
  display: flex;
  flex-direction: column;
}

.ust-cubuk {
  height: 56px;
  background: var(--kart);
  border-bottom: 1px solid var(--kenar);
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 20px;
  position: sticky;
  top: 0;
  z-index: 20;
}
.ust-cubuk .baslik { font-size: 1.05rem; font-weight: 600; }
.ust-cubuk .bosluk { flex: 1; }
.ust-cubuk .kullanici { color: var(--metin-soluk); font-size: .85rem; }

.sayfa { padding: 20px; flex: 1; }

/* ── Kartlar ──────────────────────────────────────────────────────────── */
.kart {
  background: var(--kart);
  border: 1px solid var(--kenar);
  border-radius: var(--yuvarlak);
  box-shadow: var(--golge);
}
.kart + .kart { margin-top: 16px; }
.kart-basi {
  padding: 12px 16px;
  border-bottom: 1px solid var(--kenar);
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 10px;
}
.kart-govde { padding: 16px; }

/* ── ÖZET STANDARDI (kullanıcı kuralı 10.09.2026: "Girus Satış Faturaları'ndaki
   gibi yap, tüm sistem standart olsun") ──────────────────────────────────
   Liste / rapor ekranının üst alanı HER ZAMAN bu düzendedir:
     1. .ozet-satiri içinde .ozet-kart'lar: .etiket + .deger + .yardim.
        Alt satır (.yardim) HER kartta — neyi saydığını / hangi kurla yazar.
        ⚠ .deger'e satır içi font-size YAZILMAZ: eskiden ekranlar 1 / 1,1 /
          1,3rem ile birbirinden farklı görünüyordu; boyut buradan gelir.
     2. Kırılım tablosu varsa .ozet-tablo, kart satırının ALTINDA (içinde
        değil), çerçeveli ve TOPLAM satırlı (tr.ozet-toplam).
     3. Açıklama satırı (.yardim) en altta.
   Denetim: testler/test_ozet_standardi.py her liste ekranını gezer.
   Kayıt DETAY ekranlarının başlık kartları (unvan, tarih…) bu standardın
   konusu değildir. */
.ozet-satiri { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 16px; }
.ozet-kart {
  flex: 1 1 180px;
  background: var(--kart);
  border: 1px solid var(--kenar);
  border-radius: var(--yuvarlak);
  padding: 14px 16px;
  box-shadow: var(--golge);
}
.ozet-kart .etiket { color: var(--metin-soluk); font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; }
.ozet-kart .deger { font-size: 1.6rem; font-weight: 700; margin-top: 4px; }

/* ── Süzgeç çubuğu ────────────────────────────────────────────────────── */
.suzgec-kart {
  background: var(--kart);
  border: 1px solid var(--kenar);
  border-radius: var(--yuvarlak);
  padding: 12px 16px;
  margin-bottom: 16px;   /* ~1cm üst boşluk kuralının karşılığı */
  box-shadow: var(--golge);
}
.suzgec-satir { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.alan { display: flex; flex-direction: column; gap: 4px; }
.alan > label { font-size: .78rem; color: var(--metin-soluk); font-weight: 600; }
.alan.genis { flex: 1 1 260px; }
.alan.eylemler { margin-left: auto; }

input[type=text], input[type=search], input[type=email], input[type=url],
input[type=number], input[type=date], input[type=password], select, textarea {
  height: var(--kutu-h);
  min-width: 180px;
  padding: 0 10px;
  border: 1px solid var(--kenar);
  border-radius: 6px;
  background: #fff;
  color: var(--metin);
  font: inherit;
}
textarea { height: auto; min-height: 80px; padding: 8px 10px; resize: vertical; }
input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--vurgu);
  box-shadow: 0 0 0 3px rgba(29, 78, 216, .12);
}
input[readonly], input:disabled, select:disabled { background: #f3f4f6; color: var(--metin-soluk); }

/* ── Düğmeler (merdiven: 40 / 36 / 32) ────────────────────────────────── */
.dugme {
  height: var(--kutu-h);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0 16px;
  border: 1px solid var(--kenar);
  border-radius: 6px;
  background: #fff;
  color: var(--metin);
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}
.dugme:hover { background: #f8fafc; text-decoration: none; }
.dugme.birincil { background: var(--vurgu); border-color: var(--vurgu); color: #fff; }
.dugme.birincil:hover { background: var(--vurgu-koyu); }
.dugme.tehlike { background: var(--olumsuz); border-color: var(--olumsuz); color: #fff; }
.dugme.orta { height: 36px; padding: 0 12px; font-size: .875rem; }
.dugme.kucuk { height: 32px; padding: 0 10px; font-size: .82rem; font-weight: 500; }

/* ── Tablo ────────────────────────────────────────────────────────────── */
.tablo-sarmal {
  overflow-x: auto;
  border: 1px solid var(--kenar);
  border-radius: var(--yuvarlak);
  background: var(--kart);
  box-shadow: var(--golge);
}
/* ⚠⚠ KOMPAKT TABLO (kullanıcı kuralı 06.09.2026): "Mümkün olduğunca kompakt
   tablolar, gerekiyorsa daha küçük font. Ekranın tamamına yayılınca
   konsantrasyon bozuluyor."
   Ölçüler: satır 40 → 30 px, yazı .875 → .8rem, yatay boşluk 10 → 8 px.
   Bir ekranda görünen satır sayısı ~%30 artar. */
table.liste { width: 100%; border-collapse: collapse; font-size: .8rem; }
table.liste thead th {
  position: sticky;
  top: 0;
  z-index: 5;
  background: #eef2f7;
  color: #33415c;
  text-align: left;
  font-weight: 600;
  padding: 0 8px;
  height: 30px;
  border-bottom: 1px solid var(--kenar);
  white-space: nowrap;
}
table.liste thead th a { color: inherit; }
table.liste tbody td {
  padding: 0 8px;
  height: 30px;                 /* kompakt satır */
  border-bottom: 1px solid #eef0f3;
  white-space: nowrap;
  /* ⚠ max-width + ellipsis: uzun cari unvanı satırı taşırmasın; tam metin
     `title` özniteliğinde durur ve üzerine gelince görünür. */
  max-width: 300px;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* ⚠ Satır içi düğmeler tabloyu yükseltmesin — 32 px düğme 30 px satırı
   şişiriyordu. */
table.liste .dugme.kucuk { height: 24px; padding: 0 8px; font-size: .76rem; }
table.liste .islem-hucre { padding: 2px 8px; }
table.liste .rozet { padding: 1px 7px; font-size: .7rem; }
table.liste tbody tr:hover { background: var(--vurgu-acik); }
table.liste td.sag, table.liste th.sag { text-align: right; }
table.liste td.orta, table.liste th.orta { text-align: center; }
.sayi { font-variant-numeric: tabular-nums; }
.bos { color: #aab2bd; }
.islem-hucre { white-space: nowrap; text-align: right; }

.rozet {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: .75rem;
  font-weight: 600;
}
.rozet.olumlu { background: var(--olumlu-zemin); color: var(--olumlu); }
.rozet.olumsuz { background: var(--olumsuz-zemin); color: var(--olumsuz); }
.rozet.notr { background: #eef2f7; color: #475467; }

/* ── Form ─────────────────────────────────────────────────────────────── */
.form-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }
.form-izgara .alan.tam { grid-column: 1 / -1; }
.form-izgara .alan input, .form-izgara .alan select, .form-izgara .alan textarea { width: 100%; }
/* ⚠ Onay/seçim kutusu bundan MUAF: %100 genişlik kutuyu satır boyunca
   gerer, işaret metnin çok uzağına düşer ve tıklanamaz görünür. */
.form-izgara .alan input[type=checkbox],
.form-izgara .alan input[type=radio] { width: auto; }
.yardim { font-size: .78rem; color: var(--metin-soluk); }
.hata { color: var(--olumsuz); font-size: .8rem; }
.alan.hatali input, .alan.hatali select, .alan.hatali textarea { border-color: var(--olumsuz); }
.form-eylemler { display: flex; gap: 10px; margin-top: 20px; }

.onay-kutusu { display: flex; align-items: center; gap: 8px; height: var(--kutu-h); }
.onay-kutusu input[type=checkbox] { width: 18px; height: 18px; min-width: 0; }

/* ── Mesajlar ─────────────────────────────────────────────────────────── */
.mesajlar { margin-bottom: 16px; display: flex; flex-direction: column; gap: 8px; }
.mesaj { padding: 10px 14px; border-radius: 6px; border: 1px solid; font-size: .9rem; }
.mesaj.success { background: var(--olumlu-zemin); border-color: #b7e3cb; color: var(--olumlu); }
.mesaj.error   { background: var(--olumsuz-zemin); border-color: #f5c2bd; color: var(--olumsuz); }
.mesaj.warning { background: var(--uyari-zemin); border-color: #f3d9a8; color: var(--uyari); }
.mesaj.info    { background: var(--vurgu-acik); border-color: #c7d7fb; color: var(--vurgu-koyu); }

/* ── Sayfalama ────────────────────────────────────────────────────────── */
.sayfalama { display: flex; gap: 6px; align-items: center; padding: 12px 0; flex-wrap: wrap; }
.sayfalama a, .sayfalama span {
  min-width: 34px; height: 34px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--kenar); border-radius: 6px; background: #fff; padding: 0 8px;
}
.sayfalama .etkin { background: var(--vurgu); border-color: var(--vurgu); color: #fff; font-weight: 600; }
.sayfalama .bilgi { border: none; background: none; color: var(--metin-soluk); }

/* ── Giriş ekranı ─────────────────────────────────────────────────────── */
.giris-sayfa { display: flex; align-items: center; justify-content: center; min-height: 100vh; background: #10203a; }
.giris-kart { width: 380px; background: #fff; border-radius: 12px; padding: 28px; box-shadow: 0 12px 40px rgba(0,0,0,.25); }
.giris-kart h1 { margin: 0 0 4px; font-size: 1.3rem; }
.giris-kart .alt { color: var(--metin-soluk); margin-bottom: 20px; font-size: .875rem; }
.giris-kart .alan { margin-bottom: 14px; }
.giris-kart .alan input { width: 100%; }
.giris-kart .dugme { width: 100%; justify-content: center; }

/* ── Küçük ekran ──────────────────────────────────────────────────────── */
/* Alt satır (adres/kişi/banka) tablolarında kutular dar olsun ki sığsın. */
.tablo-sarmal input, .tablo-sarmal select, .tablo-sarmal textarea { min-width: 110px; }
.tablo-sarmal td { padding: 6px 8px; height: auto; }

@media (max-width: 900px) {
  .yan-menu { left: calc(-1 * var(--menu-genislik)); z-index: 50; transition: left .2s; }
  .yan-menu.acik { left: 0; }
  .icerik { margin-left: 0; }
  .menu-dugmesi { display: inline-flex !important; }
}
.menu-dugmesi { display: none; }


/* ── Açılır pencere (modal) ───────────────────────────────────────────── */
/* ⚠ `display:none` DEĞİL `visibility`: geçiş animasyonu için. Kapalıyken
   tıklamayı da engellemek gerekir, yoksa görünmez katman sayfayı kilitler. */
.pencere-arka { position: fixed; inset: 0; background: rgba(18, 28, 45, .55);
  display: flex; align-items: flex-start; justify-content: center;
  padding: 60px 20px; z-index: 900; opacity: 0; visibility: hidden;
  transition: opacity .12s; }
.pencere-arka.acik { opacity: 1; visibility: visible; }
.pencere { background: #fff; border-radius: 10px; width: min(760px, 100%);
  max-height: 80vh; overflow: auto; box-shadow: 0 18px 50px rgba(0,0,0,.28); }
.pencere-bas { display: flex; justify-content: space-between; gap: 16px;
  align-items: flex-start; padding: 18px 22px 12px;
  border-bottom: 1px solid var(--cizgi); position: sticky; top: 0;
  background: #fff; }
.pencere-baslik { font-size: 1.1rem; font-weight: 600; color: var(--baslik); }
.pencere-govde { padding: 18px 22px; white-space: pre-wrap; line-height: 1.55; }
.pencere-ekler { padding: 0 22px 18px; display: flex; flex-wrap: wrap; gap: 8px; }

/* Okunmamış satır: gözden kaçmasın diye sol kenarda kırmızı şerit. */
tr.okunmamis td { background: var(--olumsuz-zemin, #fdf2f2); }
tr.okunmamis td:first-child { box-shadow: inset 3px 0 0 var(--olumsuz); }
/* ⚠ "Okunmadı" düğmesi YALNIZ okunmuş satırda görünür: okunmamış bir notu
   tekrar okunmadı yapmak anlamsız ve kafa karıştırıcıdır. */
tr.okunmamis .geri-al { display: none; }

/* Ekranın ne işe yaradığını söyleyen alt başlık (eski ERP'de
   her sayfada vardı; başlık tek başına yeterli değil). */
.ust-cubuk .baslik { display: flex; flex-direction: column;
  line-height: 1.25; }
.ust-alt { font-size: .74rem; font-weight: 400;
  color: var(--metin-soluk); }


/* ── Çoklu seçim süzgeci ──────────────────────────────────────────────── */
/* ⚠ `<details>` kullanılıyor: açılır liste için JavaScript gerekmiyor ve
   klavyeyle de çalışıyor. Kutucuklar formun içinde durduğu için "Süz"e
   basıldığında hepsi birlikte gönderilir. */
.coklu-suzgec { position: relative; }
.coklu-suzgec > summary { height: var(--kutu-h); display: flex;
  align-items: center; padding: 0 12px; border: 1px solid var(--cizgi);
  border-radius: 6px; background: #fff; cursor: pointer; list-style: none;
  white-space: nowrap; }
.coklu-suzgec > summary::-webkit-details-marker { display: none; }
.coklu-suzgec > summary::after { content: "▾"; margin-left: auto;
  padding-left: 10px; color: var(--metin-soluk); }
/* ⚠ Liste MUTLAK konumlu: akışta kalsaydı süzgeç çubuğunu aşağı iterdi. */
.coklu-liste { position: absolute; z-index: 40; top: calc(100% + 4px);
  left: 0; min-width: 220px; max-height: 280px; overflow: auto;
  background: #fff; border: 1px solid var(--cizgi); border-radius: 6px;
  box-shadow: 0 8px 24px rgba(0,0,0,.14); padding: 8px 10px; }
.coklu-liste .onay-kutusu { margin: 2px 0; }

/* ── Hızlı süzgeç şeridi ──────────────────────────────────────────────── */
.hizli-seridi { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; }


/* ── Notlar (Araçlar) kart listesi ────────────────────────────────────── */
/* ⚠ Kart düzeni bilerek: not içeriği uzun ve asıl okunacak şey o; tabloya
   sıkıştırmak metni keser ve notu işe yaramaz hâle getirir. */
.not-kart { background: #fff; border: 1px solid var(--cizgi);
  border-radius: 10px; padding: 14px 16px; margin-bottom: 10px; }
/* Sabitlenen not: sol kenarda çizgi + hafif zemin — kalıcı kararlar
   listenin dibine düşmesin, göz onları önce bulsun. */
.not-kart.sabit { border-left: 4px solid var(--birincil, #17A2A2);
  background: #f7fdfd; }
.not-bas { display: flex; align-items: baseline; gap: 9px; flex-wrap: wrap;
  margin-bottom: 6px; }
.not-bas h3 { margin: 0; font-size: .95rem; color: var(--baslik); }
/* ⚠ `pre-wrap`: notlar satır başlarıyla yazılıyor, düz metne çevirmek
   biçimi bozar. `break-word` uzun fatura numaraları taşmasın diye. */
.not-icerik { font-size: .85rem; line-height: 1.65; white-space: pre-wrap;
  word-break: break-word; }
.not-alt { display: flex; gap: 12px; align-items: center; flex-wrap: wrap;
  margin-top: 9px; padding-top: 8px; border-top: 1px solid var(--cizgi);
  font-size: .74rem; color: var(--metin-soluk); }
/* Kategori rozetleri — eski ERP'deki renklerin aynısı. */
.kat { font-size: .7rem; padding: 2px 8px; border-radius: 20px;
  font-weight: 600; white-space: nowrap; }
.kat-Karar        { background: #e3f0ff; color: #1c4e80; }
.kat-VeriUyarisi  { background: #fdeaea; color: #a32b26; }
.kat-NasilYapilir { background: #e9f6ec; color: #1c6b34; }
.kat-AcikIs       { background: #fff4de; color: #8a5a00; }
.kat-Kural        { background: #ede7f6; color: #4a2d80; }
.kat-Genel        { background: #eef1f4; color: #4a5866; }

/* ── Uyarı şeridi ─────────────────────────────────────────────────────── */
/* ⚠ Bir sayıyı DÜZELTMEK yerine AÇIKLAMAK gerektiğinde kullanılır: ürün
   görünümünün toplamı fatura görünümünden ayrıştığında ya da bir satırın
   kuru bulunamadığında. Sessizce farklı iki sayı göstermek güveni bitirir. */
.uyari-serit {
  background: var(--uyari-zemin);
  border: 1px solid #f2dcae;
  border-left: 4px solid var(--uyari);
  border-radius: var(--yuvarlak);
  padding: 11px 15px;
  margin-bottom: 12px;
  font-size: .84rem;
  color: #7a5200;
  line-height: 1.6;
}
.uyari-serit .yardim { color: #8a6420; }
/* Kuru bulunamayan satırın yıldızı — sayının yanında, gözden kaçmasın. */
.kursuz { color: var(--olumsuz); font-weight: 700; cursor: help; }

/* ── Görünüm değiştirici ──────────────────────────────────────────────── */
/* Aynı süzgeçlerle farklı kırılım. Etkin olan basılı görünür — kullanıcı
   hangi kırılıma baktığını görmezse iki görünümün toplamını karşılaştırır. */
.gorunum-secici { margin-bottom: 10px; }

/* ── Ürün görünümü tablosu ────────────────────────────────────────────── */
table.liste.kucuk { font-size: .8rem; }
table.liste.kucuk thead th, table.liste.kucuk tbody td { height: 32px; }
table.liste tr.toplam-satiri td {
  /* Özet tablosunun TOPLAM satırıyla (tr.ozet-toplam) AYNI görünüm — özet
     standardı 10.09.2026; iki ayrı toplam rengi vardı. */
  background: var(--vurgu-acik);
  border-top: 2px solid var(--kenar);
  font-weight: 700;
  white-space: nowrap;
}
.urun-acilim-hucre { padding: 0 !important; background: var(--vurgu-acik);
  border-left: 4px solid var(--vurgu); }
.urun-acilim { padding: 4px 8px 8px; }
.urun-acilim table.liste { background: var(--kart); }
.yukleniyor { padding: 14px; color: var(--metin-soluk); }
/* ⚠ Karışık dövizli ürün satırında tutarlar alt alta yazılır; satır yüksekliği
   sabit kalırsa ikinci satır kesilir. */
table.liste tbody tr td > div { line-height: 1.35; }
table.liste tbody td:has(> div + div) { height: auto; padding: 6px 10px; }

/* ── Sevk tarihi rozetleri ────────────────────────────────────────────── */
/* ⚠ Çıplak tarih yetmiyordu: 40 satırlık listede hangi sevkin geciktiğini
   görmek için tarihleri tek tek bugüne kıyaslamak gerekiyordu. */
.sevk-gec { color: var(--olumsuz); font-weight: 600; }
.sevk-yakin { color: var(--uyari); font-weight: 600; }
.soluk { color: var(--metin-soluk); }

/* ── Toplu işlem şeridi (Harcamalar) ──────────────────────────────────── */
/* ⚠ Bu ekranın işi veri girmek değil, yüzlerce okunmuş belgeyi HIZLA
   düzeltmek. Düğmeler listenin hemen üstünde durur; sayfanın dibine
   koymak, 50 satır kaydırdıktan sonra geri dönmek demekti. */
.toplu-serit { display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  margin: 0 0 12px; }
.toplu-serit .ayirici { width: 1px; height: 24px; background: var(--kenar);
  margin: 0 4px; }
/* Düzenlemeye açılmış hücre: göze çarpsın ki hangi satırların kaydedileceği
   belli olsun. */
table.liste td.duzenlenebilir.acik { background: #fffdf2; }
table.liste td.duzenlenebilir select,
table.liste td.duzenlenebilir input { width: 100%; min-width: 110px;
  height: 28px; font: inherit; padding: 0 6px;
  border: 1px solid var(--kenar); border-radius: 5px; background: #fff; }
table.liste td.duzenlenebilir input.sayi-kutu { text-align: right;
  min-width: 92px; font-variant-numeric: tabular-nums; }
table.liste td.duzenlenebilir select[disabled],
table.liste td.duzenlenebilir input[disabled] { display: none; }

/* ── Yükleme kartı (Harcamalar) ───────────────────────────────────────── */
/* ⚠ Kapalı başlar: ekranın asıl işi listeyi düzeltmek; yükleme kartı sürekli
   açık dursaydı 50 satırlık tabloyu ekranın dışına iterdi. */
.yukleme-karti > summary { cursor: pointer; font-weight: 600; padding: 12px 16px;
  list-style: none; }
.yukleme-karti > summary::-webkit-details-marker { display: none; }
.yukleme-karti > summary::before { content: "▸ "; }
.yukleme-karti[open] > summary::before { content: "▾ "; }
.yukleme-karti[open] > summary { border-bottom: 1px solid var(--kenar); }

/* ── Açılır pencere (ekstre gönderimi vb.) ────────────────────────────── */
/* ⚠ Ayrı bir sayfaya gitmek yerine pencere: kullanıcı hangi satırları
   işaretlediğini kaybetmesin. Sayfaya gidip dönmek seçimi siliyordu. */
dialog.pencere { border: 1px solid var(--kenar); border-radius: var(--yuvarlak);
  padding: 20px 22px; min-width: 460px; max-width: 640px;
  box-shadow: 0 12px 40px rgba(16,24,40,.22); color: var(--metin);
  background: var(--kart); }
dialog.pencere::backdrop { background: rgba(16, 24, 40, .35); }
dialog.pencere .alan { margin-bottom: 12px; }
dialog.pencere input[type=text], dialog.pencere textarea { width: 100%;
  font: inherit; padding: 8px 10px; border: 1px solid var(--kenar);
  border-radius: 6px; }


/* ── Tablo genişliği: İÇERİĞE GÖRE ─────────────────────────────────────── */
/* ⚠⚠ KULLANICI KURALI 06.09.2026: "Bir tablo tüm sayfayı kaplamak zorunda
   değilse yarım sayfa yapabilirsin. Ekranın tamamına yayılınca konsantrasyon
   bozuluyor."

   Kural: sarmalayıcı içeriği kadar geniş olur ve SOLA yaslanır. Sütunu çok
   olan tablolar (fatura, harcama) zaten ekranı doldurur ve kaydırma çubuğu
   devreye girer; sütunu az olanlar (özet, tanım listeleri) yarım sayfada
   kalır ve göz tek bir yere odaklanır.

   ⚠ `width: max-content` sarmalayıcıya verilir, tabloya DEĞİL: tabloya
   verilirse `position: sticky` başlıklar kayar. `max-width: 100%` şart —
   yoksa geniş tablo ekranı taşırır ve sayfa yatay kayar. */
.tablo-sarmal {
  width: max-content;
  max-width: 100%;
}
/* ⚠ İçeriği dar tabloda `width:100%` sarmalayıcıyı yine ekrana yayardı. */
.tablo-sarmal > table.liste { width: auto; min-width: 100%; }

/* Sayfa gövdesi de gereğinden geniş olmasın: çok geniş ekranda satır uçları
   birbirinden kopuyor ve göz satırı takip edemiyordu. */
.sayfa { max-width: 1680px; }

/* Özet kartları ve süzgeç çubuğu da içerik genişliğinde kalır. */
.ozet-satiri, .suzgec-kart, .toplu-serit, .hizli-seridi, .sayfalama {
  max-width: 100%;
}

/* ⚠ ÖZET KARTLARI EKRANI DOLDURMAK İÇİN GERİLMEZ. `flex:1 1 180px` üç kartı
   1800 px'e yayıyor ve her kart yarısı boş dev bir kutuya dönüşüyordu.
   Artık kart içeriği kadar (en az 150 px) durur ve SOLA yaslanır. */
.ozet-kart { flex: 0 1 auto; min-width: 150px; padding: 10px 14px; }
.ozet-kart .etiket { font-size: .72rem; }
.ozet-kart .deger { font-size: 1.25rem; margin-top: 2px; }
.ozet-satiri { gap: 10px; margin-bottom: 12px; }

/* ⚠ AÇIKLAMA SATIRI OLAN HÜCRE KIRPILMAZ. "kur farkı, iade… HARİÇ" gibi bir
   not yarıda kesilince kural okunamaz hâle gelir — kompaktlık uğruna bilgi
   kaybetmek en kötüsü. O hücre sarar ve yüksekliği içeriğine uyar. */
table.liste td:has(.yardim) {
  white-space: normal;
  max-width: 430px;
  height: auto;
  padding: 5px 8px;
}
table.liste td .yardim { white-space: normal; font-size: .72rem;
  line-height: 1.35; margin-top: 1px; }

/* Kart gövdesi de dar kalsın: içindeki tablo daralınca kart tek başına
   ekranı doldurmaya devam ediyordu. */
.kart { width: max-content; min-width: min(100%, 520px); max-width: 100%; }


/* ── Süzgeç çubuğu ve uyarı şeridi de gerilmez ─────────────────────────── */
/* ⚠ Süzgeç kutuları ekranın soluna toplanır; "Süz / Temizle / Excel"
   düğmeleri 1800 px öteye itilince fare yolu uzuyor ve göz süzgeçle düğme
   arasında gidip geliyordu. */
/* ⚠ `min-width` şart: yalnız "Ara + Süz + Temizle + Yeni" olan bir süzgeç
   çubuğunda `max-content` düğmeleri ALT SATIRA atıyordu. 760 px dört öğeyi
   tek satırda tutar; daha çok süzgeç varsa çubuk kendiliğinden genişler. */
.suzgec-kart { width: max-content; min-width: min(100%, 760px); max-width: 100%; }
.suzgec-kart .alan.eylemler { margin-left: auto; }
/* Uyarı metni satır uzunluğu okunabilir kalsın: 120 karakterden uzun satırı
   göz takip edemiyor. */
.uyari-serit { max-width: 96ch; }
.mesaj { max-width: 96ch; }

/* Formlar da tam ekran olmasın — tek sütunluk bir form 1800 px'e yayılınca
   etiket ile kutu arasında kopukluk oluşuyordu. */
.form-izgara { max-width: 1100px; }

/* ── Naklen alınan CRM ekranları da kompakt olsun ──────────────────────── */
/* ⚠⚠ CRM eski sisteminden OLDUĞU GİBİ taşındı ve kendi Bootstrap çerçevesini
   kullanıyor. Kompaktlık kuralı (06.09.2026) TÜM tablolar için geçerli;
   CRM şablonlarının 30'unu tek tek düzenlemek yerine kural burada, tek
   yerde yazılır. `erp1.css` CRM'in çerçevesinden SONRA yüklendiği için
   üstte kalır — bkz. base.html'deki `on_bas` bloğu.
   ⚠ CRM'in kendi renkleri ve rozetleri KORUNUR; yalnız yoğunluk değişir. */
.icerik .table { font-size: .8rem; }
.icerik .table > :not(caption) > * > * { padding: 4px 8px; }
.icerik .table .btn { padding: 2px 8px; font-size: .76rem; line-height: 1.5; }
.icerik .table .badge { font-size: .68rem; padding: .25em .5em; }
/* Tablo içeriği kadar geniş olur, ekranı doldurmak için gerilmez. */
.icerik .table-responsive { width: max-content; max-width: 100%; }
.icerik .table-responsive > .table { width: auto; min-width: 100%; }
/* Kart ve süzgeç bloğu da içerik genişliğinde kalır. */
.icerik > .card, .icerik .card.mb-4 { width: max-content; max-width: 100%;
  min-width: min(100%, 560px); }

/* ── Özet tabloları (durum / tür kırılımı) ────────────────────────────────
   ⚠ İÇERİK GENİŞLİĞİNDE durur, ekrana yayılmaz (görsel yoğunluk kuralı
     06.09.2026). Dört sütunluk bir özeti 1600 px'e yaymak, okuyanın gözünü
     satır boyunca gezdirmesi demek. */
.ozet-tablo { width: max-content; max-width: 100%; overflow-x: auto;
              margin: 0 0 12px;
              /* Ana liste tablosuyla AYNI çerçeve (kullanıcı isteği 10.09.2026: "özeti
                 diğer tablolardaki gibi daha belirgin yap"). Zemin üstünde çerçevesiz
                 duran özet soluk görünüyor, liste tablosunun yanında kayboluyordu. */
              background: var(--kart); border: 1px solid var(--kenar);
              border-radius: var(--yuvarlak); box-shadow: var(--golge); }
/* Özet kartlarının yanında kartla aynı hizada dursun (alt boşluk satırdan gelir). */
.ozet-satiri > .ozet-tablo { margin: 0; }
.ozet-tablo > table.liste { width: auto; min-width: 380px; }
.ozet-tablo td, .ozet-tablo th { white-space: nowrap; }
/* Tablo altı / özet TOPLAM satırı — sayı olduğu için kalın ve ayrı zeminde. */
tr.ozet-toplam > td {
  background: var(--vurgu-acik);
  border-top: 2px solid var(--kenar);
  font-weight: 700;
  /* ⚠ Açık tutar satırı para birimi başına ALT ALTA yazılır; bu hücre
       kırpılmaz, yoksa ikinci para birimi görünmez. */
  white-space: normal; height: auto;
}
/* Satış/alış özeti solda, düzeltme (kur farkı + iade) özeti sağda. */
.ozet-ikili { display: flex; flex-wrap: wrap; gap: 16px; align-items: flex-start; }

/* ══ Girus süzgeç çubuğu — eski ERP'nin `ms-*` kutularının AYNISI ════════
   ⚠⚠ SEÇİLİ DEĞER KUTUNUN İÇİNDE yazar ("📅 Yıl: 2026 ▾"). Etiketi üstte,
      değeri içeride tutan genel kutu düzeni bu ekranlarda çubuğu iki satıra
      çıkarıyor ve "hangi yıl seçili" sorusunu bir tık uzağa atıyordu.
   ⚠ Renkler ERP1 değişkenlerinden gelir; eski ERP'nin koyu paleti
     KOPYALANMAZ (ferah görünüm kuralı 19.08.2026). */
.girus-serit {
  display: flex; gap: 8px; flex-wrap: wrap; align-items: center;
  margin-bottom: 12px;
}
.girus-serit .ara-kutu { min-width: 260px; height: var(--kutu-h); }
.girus-serit select, .girus-serit .ms-toggle, .girus-serit .dugme {
  height: var(--kutu-h);
}
.ms-wrap { position: relative; }
details.ms-wrap > summary { list-style: none; }
details.ms-wrap > summary::-webkit-details-marker { display: none; }
.ms-toggle {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 0 14px; border-radius: 8px; cursor: pointer;
  background: var(--kart); color: var(--metin);
  border: 1px solid var(--kenar);
  font-size: .85rem; user-select: none; white-space: nowrap; max-width: 260px;
  overflow: hidden; text-overflow: ellipsis;
}
.ms-toggle:hover { border-color: var(--metin-soluk); }
.ms-panel {
  position: absolute; top: calc(100% + 4px); left: 0; z-index: 50;
  background: var(--kart); border: 1px solid var(--kenar);
  border-radius: 10px; box-shadow: 0 8px 24px rgba(16,35,56,.18); padding: 8px;
  min-width: 240px; max-height: 340px; overflow-y: auto;
}
.ms-panel label {
  display: flex; align-items: center; gap: 8px; padding: 6px 8px;
  border-radius: 6px; cursor: pointer; font-size: .85rem;
  color: var(--metin); height: auto;
}
.ms-panel label:hover { background: var(--vurgu-acik); }
/* ⚠ "Tümünü Seç" panelin DİBİNE YAPIŞIK durur: 200 carilik listede aşağı
     kaydırmadan ulaşılamıyordu. */
.ms-panel .ms-all {
  border-top: 1px solid var(--kenar); margin-top: 6px; padding-top: 10px;
  font-weight: 700; color: var(--vurgu);
  position: sticky; bottom: -8px; background: var(--kart);
}
.ms-filter {
  width: 100%; box-sizing: border-box; margin-bottom: 6px; padding: 7px 10px;
  border-radius: 6px; border: 1px solid var(--kenar);
  position: sticky; top: -8px; background: var(--kart);
}
/* Sevk süzgecindeki iki özel seçenek listenin ÜSTÜNDE ayrı durur. */
.ms-panel .ms-yakin {
  border-bottom: 1px solid var(--kenar); margin-bottom: 6px;
  padding-bottom: 9px; color: var(--vurgu); font-weight: 600;
}
.ms-etiket { font-size: .72rem; margin-left: auto; }
.ms-etiket.gec { color: var(--olumsuz); }
.ms-etiket.yakin { color: var(--olumlu); }
/* "Sevk Tarihi Girilmemişler" düğmesi — etkinken belli olsun. */
.sevk-yok-dugme.etkin {
  background: #7a4a1e; border-color: #b06a2a; color: #ffd9b0;
}
.girus-serit .sayac { margin-left: auto; font-size: .78rem;
                      color: var(--metin-soluk); }
/* Görünüm anahtarı (📦 Ürünleri Göster / 📋 Siparişleri Göster). */
.gorunum-secici { display: inline-flex; gap: 0; }
.gorunum-secici button {
  height: var(--kutu-h); padding: 0 14px; cursor: pointer;
  background: var(--kart); color: var(--metin);
  border: 1px solid var(--kenar); font-size: .85rem;
  font-family: inherit; white-space: nowrap;
}
.gorunum-secici button:first-child { border-radius: 8px 0 0 8px; }
.gorunum-secici button:last-child { border-radius: 0 8px 8px 0; border-left: 0; }
.gorunum-secici button.secili {
  background: var(--vurgu); color: #fff;
  border-color: var(--vurgu);
}
/* Özet tablosunda SEÇİLİ kategori satırı — hangi süzgecin açık olduğu
   tablodan da görünsün (eski ERP satırı zeminle vurguluyordu). */
tr.secili-satir > td { background: var(--vurgu-acik); font-weight: 600; }
.olumsuz-yazi { color: var(--olumsuz); }

/* Bakiye hatırlatma listesi — borçlu / borçsuz ayrımı.
   ⚠ Borçsuz satır SİLİNMEZ, soluklaştırılır: adres kutusu oradan doldurulur;
     listeden çıkarmak "bu müşteriye adres yazamıyorum" demekti. */
.ayrac-satiri { padding: 6px 10px; background: var(--yuzey-2, #f6f9fc);
  color: var(--metin-soluk, #667585); font-size: .76rem; font-weight: 600; }
tr.soluk-satir { opacity: .66; }

/* Liste içindeki ara bölüm başlığı ("Müşteri Bazında Borç"). */
.bolum-basligi { margin: 18px 0 8px; font-size: 1rem; font-weight: 700;
  color: var(--metin, #16232f); }
.bolum-basligi .yardim { font-weight: 400; font-size: .76rem; }

/* Üst çubuktaki Girus güncelleme düğmesi + tazelik damgası. */
.girus-damgasi { display: flex; flex-direction: column; align-items: center;
  gap: 3px; margin: 0; }
.girus-damgasi .damga { font-size: .68rem; line-height: 1; white-space: nowrap;
  color: var(--metin-soluk, #667585); }
/* ⚠ "Güncellenemedi" uyarısı KIRMIZI ve KALIN, düğme de kırmızıya döner:
   sessizce duran güncelleme 12 gün fark edilmemişti, soluk gri bir yazı yine
   fark edilmezdi. */
.girus-damgasi .damga.hata { color: var(--olumsuz); font-weight: 700; }

/* ── Sütun başlığı süzgeci (static/erp1/sutun_suzgec.js) ─────────────────────
   Eski ERP'den taşındı (10.09.2026). Renkler ERP1 değişkenlerinden gelir;
   eski ERP'nin koyu paleti KOPYALANMAZ (ferah görünüm kuralı).
   ⚠ Süzgeç satırı kompakttır (30 px): ERP1'in genel 40 px kutu ölçüsü ve
     CRM'in `.crm-icerik input` kuralı burada daha özgül seçiciyle ezilir.
   ⚠ Açılır panel `document.body` altında durur (tablo kabı `overflow`lu,
     içeride kırpılırdı) — `.ms-panel`'in `absolute` konumu `fixed` yapılır. */
.suz-satir th.suz-hucre {
  padding: 4px 6px; background: var(--zemin);
  border-top: 1px solid var(--kenar); font-weight: 400; vertical-align: middle;
}
.suz-satir .suz-girdi {
  width: 100%; min-width: 62px; height: 30px; box-sizing: border-box;
  padding: 3px 8px; font-size: .78rem; font-weight: 400; line-height: 1.1;
  color: var(--metin); background: var(--kart);
  border: 1px solid var(--kenar); border-radius: 6px;
}
.suz-satir .suz-girdi::placeholder { color: var(--metin-soluk); }
.suz-satir .suz-girdi:focus { outline: 2px solid var(--vurgu); outline-offset: -1px; }
.suz-satir .suz-sayi { display: flex; gap: 4px; }
.suz-satir .suz-sayi .suz-girdi { min-width: 52px; }

.suz-satir .suz-ms-dugme {
  display: block; text-align: left; cursor: pointer;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  font-family: inherit;
}
.suz-satir .suz-ms-dugme.secili { border-color: var(--vurgu); color: var(--vurgu); font-weight: 600; }
.suz-satir .suz-ms-dugme.acik { outline: 2px solid var(--vurgu); outline-offset: -1px; }

.ms-panel.suz-ms-panel {
  position: fixed; z-index: 1200;
  min-width: 260px; max-height: 340px; overflow-y: auto; padding: 6px;
}
.suz-ms-panel label { font-size: .82rem; padding: 5px 7px; }
/* Uzun ürün tanımları panelde sarılır — kırpılırsa hangi ürün olduğu anlaşılmaz */
.suz-ms-panel .suz-ms-yazi { overflow-wrap: anywhere; }
.ms-panel .ms-sayi { margin-left: auto; padding-left: 8px; font-size: .72rem; color: var(--metin-soluk); }
.suz-ms-panel .suz-ms-yok { padding: 8px; font-size: .8rem; color: var(--metin-soluk); }

.suz-serit {
  margin: 8px 12px 12px; padding: 7px 12px;
  font-size: .82rem; color: var(--metin);
  background: var(--kart); border: 1px solid var(--kenar);
  border-left: 3px solid var(--vurgu); border-radius: 8px;
}
.suz-serit .suz-temizle {
  margin-left: 10px; padding: 2px 10px; height: auto;
  font-size: .76rem; color: #ffffff; cursor: pointer;
  background: var(--vurgu); border: 0; border-radius: 6px;
}
.suz-serit .suz-not { margin-top: 3px; font-size: .74rem; color: var(--metin-soluk); }

/* ══ İthalat Fiyat Teklifi (eski ERP it_form / it_mail / it_firma_form) ═══════
   Teklif karşılaştırma tablosu DEVRİKTİR: satır = alan, sütun = teklif veren.
   Sütun genişlikleri SABİT — tablo yalnız sütun sayısı kadar yer kaplar,
   sayfaya yayılmaz; teklif eklendikçe sağa büyür, taşarsa kutu içinde kayar.
   ⛔ `max-width: 50%` DENENDİ, kullanıcı İSTEMEDİ (07.08.2026). */
.teklif-sar { overflow-x: auto; }
table.teklif-tablo { border-collapse: collapse; width: auto; min-width: 0; font-size: .8rem; }
.teklif-tablo th, .teklif-tablo td { border: 1px solid var(--kenar); padding: 5px 7px; }
.teklif-tablo th.alan-bas { background: #f5f8fa; text-align: left; font-size: .79rem;
  color: var(--metin-soluk); white-space: nowrap; width: 136px; min-width: 136px;
  max-width: 136px; position: sticky; left: 0; z-index: 1; }
.teklif-tablo td, .teklif-tablo thead th:not(.alan-bas) { width: 220px; min-width: 220px; max-width: 220px; }
.teklif-tablo input, .teklif-tablo select { width: 100%; min-width: 0; border: 0; background: transparent;
  font-size: .82rem; padding: 3px 2px; height: auto; }
.teklif-tablo input:focus, .teklif-tablo select:focus { outline: 2px solid var(--vurgu);
  outline-offset: -2px; background: #fff; border-radius: 3px; }
.teklif-tablo thead th { background: #eef3f7; }
.teklif-tablo .kabul { background: #eef7f0; }
.teklif-tablo th.kabul { background: #d9edda; }
.teklif-tablo .satir-tutar input { font-weight: 700; }
/* Kap ölçü tablosu */
table.kap-tablo input { width: 100%; min-width: 0; text-align: right; height: 28px; }
table.kap-tablo tbody td { height: 34px; }
/* Ağırlıklar alt alta, sade satırlar */
.agirlik-kutular { margin-top: 12px; max-width: 420px; border: 1px solid var(--kenar);
  border-radius: 8px; overflow: hidden; }
.ag-satir { display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
  padding: 6px 12px; background: #fff; border-bottom: 1px solid var(--kenar); }
.ag-satir:last-child { border-bottom: 0; }
.ag-satir.vurgu { background: #eef7f0; }
.ag-say { font-size: .79rem; font-weight: 700; white-space: nowrap; }
.ag-satir.vurgu .ag-say { color: #1c6b34; }
.ag-et { font-size: .79rem; color: var(--metin-soluk); }
/* Teklif İste: firma kartları */
.firma-kart { border: 1px solid var(--kenar); border-radius: 9px; padding: 10px 13px;
  margin-bottom: 9px; background: #fff; }
.firma-kart.secili { border-color: var(--vurgu); background: #f4f8fd; }
.firma-bas { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.firma-bas b { font-size: .92rem; }
.kisi-satir { display: flex; align-items: center; gap: 8px; font-size: .83rem;
  padding: 3px 0 3px 24px; cursor: pointer; }
.kisi-satir .ad { min-width: 170px; }
.kisi-satir .adres { color: var(--metin-soluk); font-size: .78rem; }
.kisi-yok { padding: 4px 0 2px 24px; font-size: .79rem; color: #c47a2c; }
.ek-adres { padding: 4px 0 0 24px; }
.ek-adres input { font-size: .79rem; padding: 3px 7px; max-width: 320px; height: 30px; }
.sayac-serit { background: #eef4fa; border: 1px solid #c9dcee; border-radius: 8px;
  padding: 9px 13px; font-size: .84rem; color: #274b6d; margin-bottom: 11px; }
/* Standart yazı: yer tutucu düğmeleri */
.yer-tutucu { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; }
.yer-tutucu button { font-family: monospace; font-size: .72rem; padding: 2px 7px;
  border: 1px solid var(--kenar); border-radius: 5px; background: #fff; cursor: pointer; }
.yer-tutucu button:hover { background: #eef6f5; border-color: var(--vurgu); }
/* Lojistik firması: ilgili kişi satırları */
table.kisi-tablo input, table.kisi-tablo select { width: 100%; min-width: 0; height: 28px; }
table.kisi-tablo tbody td { height: 34px; }

/* ── HTML düzenleyici (e-posta gövdesi; 11.09.2026) ──────────────────────── */
.html-duzenleyici { border: 1px solid var(--kenar); border-radius: 8px; background: #fff; overflow: hidden; }
.hd-arac { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; padding: 6px 8px;
  background: #f5f8fa; border-bottom: 1px solid var(--kenar); }
.hd-arac button, .hd-arac select { height: 28px; padding: 0 8px; font-size: .78rem; border: 1px solid var(--kenar);
  border-radius: 5px; background: #fff; cursor: pointer; min-width: 0; width: auto; }
.hd-arac button:hover { border-color: var(--vurgu); }
.hd-arac button.etkin { background: var(--vurgu); color: #fff; border-color: var(--vurgu); }
.hd-renk { display: inline-flex; align-items: center; gap: 3px; height: 28px; padding: 0 6px; font-size: .8rem;
  font-weight: 700; border: 1px solid var(--kenar); border-radius: 5px; background: #fff; cursor: pointer; }
.hd-renk input[type=color] { width: 22px; height: 20px; padding: 0; border: 0; background: none; cursor: pointer; }
/* ⚠ E-posta yazısı HER ZAMAN Calibri 11 pt (kullanıcı kuralı 28.09.2026) — ekranda gördüğün = giden. */
.hd-govde { min-height: 300px; padding: 14px 16px; font-family: Calibri, Carlito, Arial, sans-serif; font-size: 11pt;
  color: #16232f; line-height: 1.5; outline: none; overflow: auto; }
.hd-govde:focus { box-shadow: inset 0 0 0 2px var(--vurgu); }
.hd-kaynak { width: 100%; border: 0; padding: 12px 14px; }
/* Kilitli gönderi tablosu bloğu: bütün olarak taşınır/silinir, içi düzenlenmez */
.hd-govde .it-tablo { display: inline-block; max-width: 100%; margin: 4px 0; padding: 6px 8px 2px;
  border: 1px dashed #7aa3d6; border-radius: 6px; background: #f7fbff; }
.hd-govde .it-tablo::before { content: "gönderi bilgileri — otomatik, firmaya göre üretilir";
  display: block; font-size: .68rem; color: #5b7ba3; margin-bottom: 2px; }


/* ── İthalat gönderisi: OKUNUR mod (kullanıcı kuralı 14.09.2026) ────────────────
   Form varsayılan okunur açılır; alanlar `disabled` fieldset içinde ama gri kutu
   gibi değil DÜZ METİN gibi görünsün — okunur ekran bir form değil, bir özet. */
.rozet.uyari { background: #fff4d6; color: #8a5a00; }
.it-okunur input, .it-okunur select, .it-okunur textarea {
  background: transparent !important; border-color: transparent !important;
  color: var(--metin, #16232f) !important; -webkit-text-fill-color: var(--metin, #16232f);
  opacity: 1; box-shadow: none !important; cursor: default;
  -webkit-appearance: none; -moz-appearance: none; appearance: none; resize: none; }
.it-okunur input::placeholder, .it-okunur textarea::placeholder { color: transparent; }
/* Okunur modda kutu kaydırılamaz ve metin seçilemez: uzun adres 560 px'te KESİLİYORDU
   (ekran görüntüsünde "…Guanajuato. 3" / "…Istar"). Okunurda tam genişlik. Giriş talimatları
   ("Sayıyı yazın…", "seçince doldurulur…") okunurda anlamsız → gizli. */
.it-okunur .alan.tam { max-width: none !important; }
.it-okunur .alan .yardim { display: none; }


/* ── CRM ürün kalemleri tabloları ─────────────────────────────────────────────────────────
   `table.kalem-tablo`        : RFQ yeni/düzenle, e-postadan RFQ, tedarikçi RFQ
   `table.teklif-kalem-tablo` : CRM teklif formu (yeni/düzenle)
   Kullanıcı kuralı 14.09.2026:
   · Tablonun TAMAMI (başlıklar dahil) manuel yazılan kutularla AYNI yazı tipi ve büyüklükte.
     ⚠ Kök neden: `input[type=text]` (erp1.css) Bootstrap'in `.form-control`'ünü özgüllükle
       yeniyor ve `font: inherit` veriyordu; `select`in özgüllüğü DÜŞÜK olduğu için Bootstrap
       kazanıyor → açılır kutular 16 px + 6/12 px dolgu, yazılan kutular 12,8 px. Teklif
       formunda ayrıca başlıklar 11 px, kutular 12 px idi (şablondaki #items-table stili).
   · Kodlu/metin sütunlar 180 px · Ürün Grubu 190 px · adet/miktar 72 px (4 hane) ·
     Birim 86 px · tutar 106 px (100000.00 — DAHA GENİŞ DEĞİL).
   ⚠ Sütunlar SIRAYLA seçilir (nth-child): "Ürün Ekle" ile JS'in eklediği satırlar da aynı
     ölçüyü alsın diye hücrelere tek tek sınıf yazılmadı. Sütun sırası değişirse burası da
     değişmeli — `testler/test_crm_kalem_tablosu.py` başlık sırasını denetler. */
.crm-icerik table:is(.kalem-tablo, .teklif-kalem-tablo),
.crm-icerik table:is(.kalem-tablo, .teklif-kalem-tablo) :is(th, td, small, input, select, textarea),
.crm-icerik table.kalem-tablo-toplam td {
  font-family: inherit; font-size: .8rem; line-height: 1.3; }
.crm-icerik table:is(.kalem-tablo, .teklif-kalem-tablo) th small { color: var(--metin-soluk, #667085); font-weight: 600; }
.crm-icerik table:is(.kalem-tablo, .teklif-kalem-tablo) :is(input, select).form-control {
  height: 30px; min-width: 0; padding: 0 8px; border-radius: 6px; }
.crm-icerik table:is(.kalem-tablo, .teklif-kalem-tablo) textarea.form-control { min-width: 0; padding: 4px 8px; }
.crm-icerik table:is(.kalem-tablo, .teklif-kalem-tablo) select.form-control { padding-right: 4px; }
.crm-icerik table:is(.kalem-tablo, .teklif-kalem-tablo) td { vertical-align: middle; }

/* RFQ / tedarikçi RFQ: # · Listeden · Manuel · Tanım · Grup · Müşteri Kodu · Proto · Yıllık · Birim · Yıllık Tutar · sil */
.crm-icerik table.kalem-tablo td:is(:nth-child(2), :nth-child(3), :nth-child(4), :nth-child(6)) :is(input, select) { width: 180px; }
.crm-icerik table.kalem-tablo td:nth-child(5) :is(input, select) { width: 190px; }
.crm-icerik table.kalem-tablo td:is(:nth-child(7), :nth-child(8)) :is(input, select) { width: 72px; text-align: right; }
.crm-icerik table.kalem-tablo td:nth-child(9) :is(input, select) { width: 86px; }
.crm-icerik table.kalem-tablo td:nth-child(10) :is(input, select) { width: 106px; text-align: right; }

/* Teklif: Ops · ✓ · # · Ürün Kodu · Tanım · Referans · Müşteri Kodu · Yıllık Miktar · Min. Sipariş ·
   Birim · Birim Fiyat · Toplam · Olasılık · Termin · Nakliye Şekli · Açıklama · sil */
.crm-icerik table.teklif-kalem-tablo td:is(:nth-child(4), :nth-child(5), :nth-child(6), :nth-child(7)) :is(input, select) { width: 180px; }
.crm-icerik table.teklif-kalem-tablo td:is(:nth-child(8), :nth-child(9), :nth-child(13), :nth-child(14)) input { width: 72px; }
.crm-icerik table.teklif-kalem-tablo td:is(:nth-child(8), :nth-child(9), :nth-child(13)) input { text-align: right; }
.crm-icerik table.teklif-kalem-tablo td:nth-child(10) select { width: 86px; }
.crm-icerik table.teklif-kalem-tablo td:is(:nth-child(11), :nth-child(12)) input { width: 106px; text-align: right; }
.crm-icerik table.teklif-kalem-tablo td:nth-child(15) select { width: 96px; }
.crm-icerik table.teklif-kalem-tablo td:nth-child(16) textarea { width: 180px; }

/* ══ İthalat gönderisi — KOMPAKT DÜZEN (kullanıcı isteği 14.09.2026: "dağınık, odaklanması zor") ══
   Renk dili: mavi yalnız EYLEM (birincil düğme, bağlantı) · yeşil = kabul / en düşük / tamam ·
   kehribar = bekleyen iş · kırmızı yalnız silme ve uyarı · gerisi nötr gri.
   ⚠ Alan kimlikleri/adları şablonda değişmedi; burası yalnız görünüm. */
.it-sayfa { max-width: 1520px; }
.it-sayfa .bosluk { flex: 1; }
.it-baslik { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 10px; background: var(--kart);
  border: 1px solid var(--kenar); border-radius: 10px; box-shadow: var(--golge); padding: 10px 14px; margin-bottom: 12px; }
.it-kimlik { display: flex; align-items: baseline; gap: 10px; min-width: 0; }
.it-kimlik .ref { font-size: 1.02rem; font-weight: 700; color: #101828; letter-spacing: .01em; }
/* ⚠ `.icerik` KULLANMA: base.html ana içerik alanının sınıfı, flex:1 alıyordu */
.it-kimlik .it-alt-baslik { font-size: .82rem; color: var(--metin-soluk); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 420px; }
.it-ozet { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: 4px 22px; margin-top: 6px; padding-top: 8px;
  border-top: 1px solid #eef1f4; font-size: .76rem; color: var(--metin-soluk); }
.it-ozet b { margin-left: 6px; color: var(--metin); font-weight: 600; }
.it-ozet b.olumlu-yazi, .olumlu-yazi { color: var(--olumlu); }
.rozet.it-bekliyor { background: #fff4de; color: #92580a; }
.rozet.uyari { background: #fff4de; color: #92580a; }
.rozet.it-en-ucuz { background: var(--olumlu-zemin); color: var(--olumlu); }

.it-izgara { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 12px; align-items: start; margin-bottom: 12px; }
@media (max-width: 1180px) { .it-izgara { grid-template-columns: 1fr; } }
.it-izgara > .kart { margin: 0; }
.it-sayfa .kart { border-radius: 10px; }
.it-sayfa .kart + .kart, .it-sayfa .kart + details.kart { margin-top: 12px; }
.it-sayfa .kart-basi { display: flex; align-items: center; gap: 8px; padding: 8px 14px; min-height: 42px;
  font-size: .82rem; font-weight: 700; color: #101828; background: #fafbfc; border-bottom: 1px solid #eef1f4; }
.it-sayfa .kart-govde { padding: 12px 14px; }
.it-sayfa .yardim { font-size: .72rem; line-height: 1.35; }
.it-sayfa .uyari-yazi { color: #b54708; }

/* Alanlar: 3 sütunlu sıkı ızgara, etiket küçük ve üstte */
.it-alanlar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px 14px; }
.it-alanlar .alan { gap: 3px; min-width: 0; }
.it-alanlar .alan.genis { grid-column: span 2; }
.it-alanlar .alan.tam { grid-column: 1 / -1; }
.it-sayfa .alan > label, .it-kap-sayi label { font-size: .68rem; font-weight: 600; letter-spacing: .04em;
  text-transform: uppercase; color: #8a94a3; }
.it-sayfa .it-alanlar :is(input, select), .it-kap-sayi input { height: 32px; min-width: 0; width: 100%;
  padding: 0 9px; font-size: .82rem; border-radius: 6px; }
.it-sayfa .it-alanlar textarea { min-width: 0; width: 100%; min-height: 32px; height: 32px; padding: 6px 9px;
  font-size: .82rem; border-radius: 6px; }
.it-yan-yana { display: flex; gap: 6px; align-items: center; }
.it-yan-yana select { flex: 1; }
.it-yan-yana .it-sayi { flex: 1; text-align: right; }
.it-yan-yana .it-doviz { flex: 0 0 76px; width: 76px; }

/* Kap tablosu */
.it-kap-sayi { display: inline-flex; align-items: center; gap: 8px; font-weight: 400; }
.it-kap-sayi input { width: 64px; text-align: right; }
.it-sayfa table.kap-tablo { font-size: .8rem; }
.it-sayfa table.kap-tablo thead th { padding: 6px 8px; font-size: .7rem; }
.it-sayfa table.kap-tablo tbody td { height: 32px; padding: 2px 6px; }
.it-sayfa table.kap-tablo input { height: 26px; min-width: 0; width: 100%; padding: 0 6px; font-size: .8rem; text-align: right; }
.it-sayfa .agirlik-kutular { max-width: none; margin-top: 10px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.it-sayfa .ag-satir { flex-direction: column; align-items: flex-start; gap: 2px; padding: 7px 10px;
  border-bottom: 0; border-right: 1px solid var(--kenar); }
.it-sayfa .ag-satir:last-child { border-right: 0; }
.it-sayfa .ag-say { font-size: .92rem; }
.it-sayfa .ag-et { font-size: .7rem; }
.it-formul { margin-top: 6px; }

/* Gelen teklifler — karşılaştırma tablosu */
.it-sayfa table.teklif-tablo { font-size: .8rem; }
.it-sayfa .teklif-tablo th, .it-sayfa .teklif-tablo td { border-color: #e6e9ee; padding: 2px 8px; height: 30px; }
.it-sayfa .teklif-tablo th.alan-bas { width: 128px; min-width: 128px; max-width: 128px; background: #f8fafc;
  color: #6b7684; font-size: .72rem; font-weight: 600; }
.it-sayfa .teklif-tablo td, .it-sayfa .teklif-tablo thead th:not(.alan-bas) { width: 184px; min-width: 184px; max-width: 184px; }
.it-sayfa .teklif-tablo thead th { background: #f1f4f8; border-bottom: 2px solid #d5dbe3; height: 34px; }
.it-sayfa .teklif-tablo thead select { font-weight: 700; color: #101828; }
.it-sayfa .teklif-tablo :is(input, select) { height: 26px; font-size: .8rem; padding: 0 2px; }
.it-sayfa .teklif-tablo tr.satir-tutar :is(th, td) { background: #f8fbff; border-top: 1px solid #d5dbe3; border-bottom: 1px solid #d5dbe3; }
.it-sayfa .teklif-tablo tr.satir-tutar input { font-size: .92rem; font-weight: 700; color: #101828; }
.it-sayfa .teklif-tablo .en-ucuz, .it-sayfa .teklif-tablo tr.satir-tutar td.en-ucuz { background: #f3faf6; }
.it-sayfa .teklif-tablo tr.satir-tutar td.en-ucuz input { color: var(--olumlu); }
.it-sayfa .teklif-tablo .kabul, .it-sayfa .teklif-tablo tr.satir-tutar td.kabul { background: #eaf7ef; }
.it-sayfa .teklif-tablo thead th.kabul { background: #d6f0df; box-shadow: inset 0 3px 0 var(--olumlu); }
.it-sayfa .teklif-tablo tfoot td { height: 36px; background: #fff; }
.it-sayfa .teklif-tablo tfoot .dugme.kucuk { height: 24px; padding: 0 8px; font-size: .74rem; }
.it-sayfa .teklif-tablo tfoot .rozet { font-size: .7rem; }

/* Okunur modda boş iç not satırı yer kaplamasın */
.it-okunur .it-bos { display: none; }
.it-okunur .it-alanlar :is(input, select, textarea) { padding-left: 0; height: 24px; }
.it-okunur .it-kap-sayi input { padding-right: 0; width: 40px; }
.it-okunur .teklif-tablo tfoot td:empty { height: 8px; }

/* Düzenle modunda yapışkan eylem çubuğu */
.it-eylem-cubugu { position: sticky; bottom: 0; z-index: 5; justify-content: flex-end; margin-top: 12px;
  padding: 10px 14px; background: rgba(255, 255, 255, .96); border: 1px solid var(--kenar); border-radius: 10px;
  box-shadow: 0 -4px 12px rgba(16, 24, 40, .06); }

/* Geçmiş (katlı) ve silme */
details.it-gecmis > summary { cursor: pointer; list-style: none; }
details.it-gecmis > summary::-webkit-details-marker { display: none; }
details.it-gecmis > summary::before { content: "▸"; color: #8a94a3; font-size: .8rem; }
details.it-gecmis[open] > summary::before { content: "▾"; }
details.it-gecmis > summary .yardim { font-weight: 400; margin-left: 4px; }
details.it-gecmis table.liste td { white-space: nowrap; }
.it-sil { margin: 14px 0 20px; display: flex; justify-content: flex-end; }
.dugme.it-sil-dugme { color: var(--olumsuz); border-color: #f1c5c0; background: #fff; }
.dugme.it-sil-dugme:hover { background: var(--olumsuz-zemin); }

/* Liste */
table.it-liste td { white-space: nowrap; }
table.it-liste .it-hts { margin-left: 6px; font-size: .7rem; }

/* ══ Muhasebe ekranlarının AYRIK yoğunluk bloğu 16.09.2026'da ERİTİLDİ ═══════════
   14.09.2026'da yalnız muhasebeye verilen 26 px satır / 30 px kutu artık SİSTEMİN
   GENEL kuralı (Faz 3 jetonları). Ekranın kendine ait 50 satırlık kopyası kalsaydı
   muhasebe sistemin geri kalanından FARKLI görünmeye devam ederdi.
   ⚠ Aşağıdaki Notlar kuralları YOĞUNLUK DEĞİL YAPI (katlanır "Yeni Not", ızgara);
     silinemez, yalnız ölçüleri jetona bağlandı. */
/* Notlar: katlı Yeni Not + tek satırlık form */
.mh-kompakt details.mh-yeni { margin-bottom: 8px; border-radius: 8px; }
.mh-kompakt details.mh-yeni:not([open]) { display: inline-block; }
.mh-kompakt details.mh-yeni > summary { cursor: pointer; list-style: none; padding: 6px 12px; font-size: .8rem;
  min-height: 0; border-bottom: 0; color: var(--vurgu); font-weight: 600; }
.mh-kompakt details.mh-yeni > summary::-webkit-details-marker { display: none; }
.mh-kompakt details.mh-yeni[open] > summary { border-bottom: 1px solid var(--kenar); }
.mh-kompakt .mh-yeni .kart-govde { padding: 8px 12px; }
.mh-kompakt .mh-not-izgara { grid-template-columns: 200px 200px minmax(240px, 1fr); gap: 6px 10px; }
.mh-kompakt .mh-not-izgara .alan.tam { grid-column: 1 / -1; }
.mh-kompakt .mh-not-izgara :is(input:not([type=checkbox]):not([type=file]), select) {
  height: var(--kutu-h-orta); min-width: 0; padding: 0 8px; font-size: .78rem; }
.mh-kompakt .mh-not-izgara textarea { min-height: 54px; padding: 5px 8px; font-size: .8rem; }
.mh-kompakt .mh-not-izgara input[type=file] { font-size: .74rem; }
.mh-kompakt .mh-kaydet { justify-self: end; }
.mh-kompakt .mh-sayac { display: flex; gap: 8px; align-items: center; height: var(--kutu-h-orta); }
.mh-kompakt table.liste tr.okunmamis td:first-child { box-shadow: inset 3px 0 0 var(--olumsuz); }

/* ── Muhasebe → HAM FATURALAR (eski ERP `ham_fatura`, 14.09.2026) ─────────────────────────
   Gelen tüm faturalar önce buraya yüklenir, Alan sütunundan ilgili ekrana taşınır.
   Firma 300 px (tam ad görünsün, doğru alana taşınsın) · Alan menüsü 172 px ·
   hedefte aynı fatura olduğu için taşınamayan satır KIRMIZI. */
#belgeTablosu th.mh-firma, #belgeTablosu td.mh-firma { width: 300px; min-width: 300px; max-width: 300px;
  overflow: hidden; text-overflow: ellipsis; }
#belgeTablosu th.mh-alan, #belgeTablosu td.mh-alan { width: 150px; min-width: 150px; }
#belgeTablosu td.mh-alan select { width: 100%; min-width: 0; height: 22px; font-size: .74rem; padding: 0 5px; }
#belgeTablosu th.mh-kaynak, #belgeTablosu td.mh-kaynak { width: 112px; min-width: 112px; }
#belgeTablosu td.mh-kaynak select { width: 100%; min-width: 0; }
#belgeTablosu td.mh-fis { max-width: 136px; overflow: hidden; text-overflow: ellipsis; }
/* ⚠ `.tablo-sarmal input { min-width:110px }` onay kutusunu da 110 px yapıyordu → ✓ sütunu 133 px */
#belgeTablosu input[type=checkbox] { min-width: 0; }
#belgeTablosu td.tek-satir { white-space: nowrap; }
#belgeTablosu .mh-onayli { display: block; font-size: .64rem; color: var(--olumlu); line-height: 1; }
#belgeTablosu tbody tr.tasinamadi td { background: #fdecea; color: #842029; }
#belgeTablosu tbody tr.tasinamadi:hover td { background: #fbdbd7; }
#belgeTablosu tbody tr.tasinamadi td:first-child { box-shadow: inset 3px 0 0 #c0392b; }
.mh-tasima-uyari { background: #fdecea; border: 1px solid #f0b7b4; border-radius: 8px; padding: 6px 12px;
  margin-bottom: 8px; font-size: .8rem; color: #842029; }

/* ── Lojistik → Gümrük Bildirimleri: satır sonu "Depoya Giriş" (15.09.2026) ─────────────
   Eski Lojistik Takip ekranındaki yeşil düğme. Yeşil = depoya giriş (olumlu iş),
   mavi Düzenle ile karışmasın. */
.dugme.loj-giris { background: #e7f6ee; border-color: #b7e2c8; color: #0f7b4f; }
.dugme.loj-giris:hover:not([disabled]) { background: #d2efdf; }
.dugme.loj-giris[disabled] { opacity: .45; cursor: not-allowed; }
form.loj-giris-form { display: inline; margin: 0; }
.loj-ekler td, .loj-kalemler td { vertical-align: middle; }
.loj-kalemler input[type=text] { width: 100%; min-width: 0; }
.loj-kalemler td.sira { color: var(--metin-soluk); width: 32px; text-align: center; }
.loj-kalemler td.sil { width: 44px; text-align: center; }
.loj-kalemler tr.silinecek td { text-decoration: line-through; opacity: .5; }
.loj-yukleme { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; }
.loj-yukleme .alan input[type=file] { width: 100%; }
.loj-kaynak { background: #e7f6ee; border: 1px solid #b7e2c8; color: #0b5e3c; border-radius: 8px;
  padding: 8px 12px; margin-bottom: 10px; font-size: .85rem; }

/* ── Sol menü: KADEMELİ düzen (kullanıcı sınıflandırması 15.09.2026) ─────────────────────
   Kademe 1 üst başlık (.menu-baslik) · Kademe 2 ekran ya da alt başlık (.menu-altbaslik)
   · Kademe 3 ekran (.menu-altogeler a). Alt başlık tıklandıkça açılır/kapanır. */
.menu-altbaslik {
  display: flex; justify-content: space-between; align-items: center;
  padding: 7px 18px 7px 24px; color: #cbd5e1; font-size: .875rem;
  cursor: pointer; user-select: none; border-left: 3px solid transparent;
}
.menu-altbaslik:hover { background: rgba(255, 255, 255, .06); }
.menu-altbaslik span:last-child { display: inline-block; font-size: .7rem; color: #8ea0bb; transition: transform .15s; }
.menu-altgrup.kapali > .menu-altbaslik span:last-child { transform: rotate(-90deg); }
.menu-altgrup.kapali > .menu-altogeler { display: none; }
.menu-altgrup:not(.kapali) > .menu-altbaslik { color: #fff; }
.menu-ogeler .menu-altogeler a { padding-left: 40px; font-size: .84rem; color: #b6c2d3; }
.menu-ogeler .menu-altogeler a.etkin { color: #fff; }
.dugme.loj-giris.loj-hata { border-color: #f0b7b4; box-shadow: inset 3px 0 0 #c0392b; }
.dugme.loj-okunuyor { cursor: progress; background: #fff7e6; border-color: #f3d9a4; color: #8a5a00; }

/* ── Liste taşmaları (15.09.2026): satır sonu düğmeleri 1440 px ekranda kaydırmadan görünsün ──
   Kırpılan metnin tamamı hücrenin üzerine gelince (title) görünür. */
table.loj-bildirim-tablo tbody td:nth-child(1) { max-width: 180px; }
table.loj-bildirim-tablo tbody td:nth-child(4) { max-width: 170px; }
table.loj-bildirim-tablo tbody td:nth-child(6) { max-width: 130px; }
#belgeTablosu td.mh-firma-k { max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#belgeTablosu td.mh-belgeno { max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#belgeTablosu td.duzenlenebilir:not(.sag) .salt-okunur { display: inline-block; max-width: 80px; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; }
#belgeTablosu td.duzenlenebilir .salt-okunur[hidden] { display: none; }

/* Panel → Modüller kartı: sol menüyle aynı kademeler (15.09.2026) */
.panel-menu .panel-altbaslik { margin-top: 4px; color: var(--metin-soluk); font-size: .82rem; font-weight: 600; }
.panel-menu .panel-kademe3 { padding-left: 14px; }

/* ══════════════════════════════════════════════════════════════════════════
   ERP1 EKRAN DİLİ · KATMAN 2026.09 · FAZ 1 — YALNIZ RENK (16.09.2026)
   SAP Fiori Horizon + Fluent 2 karşılaştırmasından çıkan renk katmanı.
   ⚠ ESKİ JETON ADLARININ HEPSİ KORUNDU — yalnız DEĞERLERİ değişti; 1190
     satırlık dosya ve 115 şablon bu adlara bağlı.
   ⚠ Blok dosyanın SONUNDA: aynı özgüllükte sonra gelen kural kazanır,
     geri alma = bu bloğu silmek. Baştaki :root Faz 12'ye kadar DURUR.
   Ölçü jetonlarına BU FAZDA DOKUNULMAZ (Faz 3).
   ══════════════════════════════════════════════════════════════════════════ */
:root {
  /* ── Yüzey ── */
  --zemin: #f4f6f8;
  --kart: #ffffff;
  --notr-zemin: #eef1f4;

  /* ── Metin — beyaz VE --zemin üstünde kontrast ≥ 4,5 (ölçüldü) ──
     ⚠ ESKİ --metin-soluk #6b7684 beyazda 4,26 idi: WCAG AA İHLALİ.
       Soluk metin ERP'de tablo başlığı ve etiketlerde kullanılıyor,
       yani en çok okunan yazı erişilebilir değildi. */
  --metin: #131e29;            /* beyazda 16,4 */
  --metin-soluk: #556b82;      /* beyazda 5,51 · zeminde 5,09 */

  /* ── Çizgi ── */
  --kenar: #d9dde2;
  --kenar-satir: #e6e9ed;
  --kenar-baslik: #a8b2bd;
  --kenar-dugme: #bcc3ca;

  /* ── Etkileşim ──
     ⚠ HOVER MAVİ DEĞİL NÖTR: mavi vurgu yalnız SEÇİLİ satırın dili olsun
       diye (bugün ikisi de mavi; kullanıcı hangi satırın seçili olduğunu
       fareyle gezerken kaybediyor). */
  --uzerinde: #eef0f2;
  --basili: #e3e6e9;
  --vurgu: #0f62d6;            /* beyazda 5,42 — dolu düğme zemini VE metin */
  --vurgu-koyu: #0b4ba8;       /* üzerinde / basılı / bağlantı */
  --vurgu-acik: #eff4ff;       /* SEÇİLİ satır / seçili menü */
  --vurgu-acik-2: #dbe7fb;     /* seçili + üzerinde */
  --odak: #0b3a86;
  --zorunlu: #b0006a;

  /* ── Durum ── */
  --olumlu: #0f7b4f;   --olumlu-zemin: #e7f6ee;   --olumlu-kenar: #b7e2c8;
  --olumsuz: #b42318;  --olumsuz-zemin: #fdecea;  --olumsuz-kenar: #f1c5c0;
  --uyari: #9a4a06;    --uyari-zemin: #fff5e6;    --uyari-kenar: #f2dcae;
  --bilgi: #0b4ba8;    --bilgi-zemin: #eff4ff;    --bilgi-kenar: #c7d7fb;

  /* ══ TANIMSIZ 4 JETONUN ONARIMI — BEDAVA HATA DÜZELTMESİ ══════════════
     Bu dört ad dosyada KULLANILIYOR ama hiç TANIMLANMAMIŞ. Geçersiz
     bildirim düşürüldüğü için bugün:
       · .not-kart, .not-alt, .coklu-liste, .coklu-suzgec > summary ve
         .pencere-bas ÇERÇEVESİZ basılıyor (border: 1px solid var(--cizgi)),
       · .pencere-baslik / .not-bas h3 rengi gövdeden miras alıyor,
       · .not-kart.sabit'in sol şeridi yedek renk olan teal (#17A2A2) —
         sistemin hiçbir yerinde olmayan bir renk. */
  /* ── Gölge ── */
  --golge: 0 0 0 1px rgba(34, 53, 72, .04), 0 1px 2px rgba(34, 53, 72, .08);
  --golge-acilir: 0 0 0 1px rgba(34, 53, 72, .10), 0 8px 24px rgba(34, 53, 72, .16);
  --golge-kabuk: 0 1px 2px rgba(34, 53, 72, .10), inset 0 -1px 0 rgba(34, 53, 72, .14);

  --cizgi: var(--kenar);
  --baslik: var(--metin);
  --birincil: var(--vurgu);
  --yuzey-2: var(--notr-zemin);
}

/* ⚠ Bağlantı --vurgu-koyu: --vurgu metinde 5,42 ile geçer ama altı çizili
   bağlantı gövde metninin içinde daha koyu olmalı. */
a { color: var(--vurgu-koyu); }

/* ── Kontrast onarımları (tekil hex → jeton) ───────────────────────────── */
/* "—" işareti beyazda 2,29 idi (okunmuyordu). */
.bos { color: var(--metin-soluk); opacity: .75; }
/* İthalat teklif alan etiketleri #8a94a3 = beyazda 3,03. */
.it-sayfa .alan > label, .it-kap-sayi label { color: var(--metin-soluk); }

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 2 — YAPIŞKAN BAŞLIK ONARIMI (16.09.2026)
   ⚠⚠ 1 NUMARALI KUSUR: erp1.css:245'te th{position:sticky;top:0} var ama
      .tablo-sarmal'da dikey kaydırma kabı YOKTU (yalnız overflow-x) →
      başlık hiçbir ekranda yapışmıyordu. 200 satırlık Harcamalar'da
      kullanıcı 40. satırda hangi sütuna baktığını bilmiyordu.
   Yükseklik tablo_yuksekligi.js ile ÖLÇÜLÜR; jeton gelmezse yedek calc().
   ══════════════════════════════════════════════════════════════════════════ */
.tablo-sarmal { overflow: auto; }   /* x VE y — eski overflow-x'i ezer */
/* ⚠ Kap YALNIZ betiğin işaretlediği sarmalayıcıya kurulur (.sarmal-kapli):
   Cari Kartı gibi sayfalarda alt alta üç `.tablo-sarmal` var; hepsine kap
   verilseydi sayfa üç ayrı kaydırma kutusuna bölünürdü. Betik çalışmazsa
   hiçbir tablo kısıtlanmaz — eski davranışa güvenli düşüş. */
.tablo-sarmal.sarmal-kapli {
  max-height: var(--tablo-yuksekligi);
  overscroll-behavior: contain;   /* tablo dibine gelince sayfa zıplamasın */
}
/* İç içe (ürün açılımı) tablo kendi kabında kaydırılmaz; satır zaten az. */
.urun-acilim .tablo-sarmal { max-height: none; overflow: visible; }

/* ⚠ border-collapse:collapse + position:sticky = th'nin KENARLIĞI ÇİZİLMEZ
   (tarayıcı kenarlığı hücreyle birlikte kaydırır). Gölge kaydırmada kalır. */
table.liste thead th {
  border-bottom: 0;
  box-shadow: inset 0 -1px 0 var(--kenar-baslik);
}

/* ⚠ İÇ İÇE TABLODA İKİNCİ YAPIŞKAN BAŞLIK OLMASIN: ürün açılımının başlığı
   dış tablonun başlığının altına yapışıp iki katlı başlık yapıyordu. */
.urun-acilim table.liste thead th {
  position: static;
  box-shadow: none;
  border-bottom: 1px solid var(--kenar-baslik);
}

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 3 — YALNIZ ÖLÇÜ (16.09.2026)
   Kullanıcı kuralı: "bir bakışta sayfanın tamamına hâkim olabilecek kadar
   kompakt". Muhasebe ekranlarındaki 26 px satır SİSTEMİN GENEL kuralı olur.
   ⚠ ESKİ JETON ADLARI KORUNUR (--kutu-h, --yuvarlak); yalnız değer değişir.
   ══════════════════════════════════════════════════════════════════════════ */
:root {
  /* ── Yoğunluk merdiveni ── */
  --kutu-h: 28px;             /* süzgeç / araç çubuğu kutusu · düğme (40 → 28) */
  --kutu-h-orta: 32px;        /* FORM kutusu — veri girişi 28'e sıkıştırılmaz */
  --kutu-h-kucuk: 24px;       /* satır içi düğme */
  --kutu-h-mini: 20px;        /* 26 px tablo satırının İÇİNDEKİ düğme */
  /* ⚠⚠ 26 → 34 (29.09.2026, Genel.docx). Kullanıcı satış siparişlerinde
     34 px'i canlı ekranda görüp "bölümler arası boşluğu ve arka planı tüm
     sisteme uygula" dedi; satır yüksekliği o görünümün parçasıdır ve
     tek ekranda 34, geri kalanında 26 kalması tutarsız olurdu.
     ⚠ Eski değer 26 idi ("kompakt" disiplini); şikayet artık "sıkış sıkış
       olmasın" yönünde. Geri dönüş tek sayı değiştirmektir. */
  --h-satir: 34px;
  --h-satir-girdi: 32px;      /* satırında KUTU olan tablo — 26'ya zorlanmaz */
  /* ⚠⚠ BAŞLIK = SATIRIN 1,5 KATI (29.09.2026, Genel.docx birinci madde:
     "tablo başlıklarının satır yüksekliği, tablo içindeki satırların
     yüksekliğinden %50 daha fazla olsun").
     ⚠ SABIT SAYI DEĞİL `calc`: `--h-satir` telefon/dokunmatik kırılımlarında
       yeniden tanımlanıyor (32 ve 44 px). Sabit yazılsaydı oran yalnız
       masaüstünde tutar, telefonda başlık satırdan KISA kalırdı. Aynı
       öğede (`:root`) çözüldüğü için her kırılımda kendiliğinden takip eder.
     ⚠ Yapışkan ikinci başlık satırları (`top: var(--h-tablo-baslik)`) bu
       jetona bağlıdır; değer değişince hizalama kendiliğinden düzelir. */
  --h-tablo-baslik: calc(var(--h-satir) * 1.5);
  --h-kabuk: 44px;            /* üst çubuk (56 → 44) — kural Faz 5'te bağlanır */
  --h-arac: 26px;
  --h-menu-k1: 30px; --h-menu-k2: 28px; --h-menu-k3: 26px;

  /* ── Tip ölçeği (28 boy → 6) ── */
  --fs-xs: .75rem;    /* 12 — etiket, tablo başlığı, rozet, .yardim */
  --fs-sm: .8125rem;  /* 13 — tablo gövdesi, menü öğesi, süzgeç kutusu */
  --fs-md: .875rem;   /* 14 — gövde, form kutusu, düğme */
  --fs-lg: 1rem;      /* 16 — kart başlığı */
  --fs-xl: 1.25rem;   /* 20 — sayfa başlığı, özet kartı değeri */
  --fs-2xl: 1.5rem;   /* 24 — kayıt detay başlığı */
  --fw-normal: 400; --fw-orta: 600; --fw-kalin: 700;

  /* ── Boşluk (4 px taban) ve köşe (12 değer → 2) ── */
  --b1: 2px; --b2: 4px; --b3: 8px; --b4: 12px; --b5: 16px; --b6: 24px;
  --sayfa-bosluk: 12px;
  --r-alan: 4px;
  --r-kart: 8px;
}

/* İSTEĞE BAĞLI KAÇIŞ KAPISI: <html data-yogunluk="rahat"> ile tüm göç geri
   alınmadan ferah moda dönülür (26 px dar gelirse tek öznitelik). */
html[data-yogunluk="rahat"] {
  --kutu-h: 34px; --kutu-h-orta: 36px; --kutu-h-kucuk: 28px; --kutu-h-mini: 24px;
  --h-satir: 32px; --h-satir-girdi: 36px; --h-tablo-baslik: 32px;
  --h-menu-k1: 34px; --h-menu-k2: 32px; --h-menu-k3: 30px;
  --fs-sm: .875rem;
}

/* Dar ekran / dokunmatik: boşluk küçülür ama dokunma hedefi BÜYÜR. */
@media (max-width: 900px) {
  :root { --kutu-h: 36px; --kutu-h-orta: 36px; --kutu-h-kucuk: 32px;
          --kutu-h-mini: 28px; --h-satir: 32px; --h-satir-girdi: 36px; }
}

/* ── Form kutuları 32 px ────────────────────────────────────────────────
   ⚠ textarea DIŞARIDA: 200. satırdaki `height:auto` ezilirse çok satırlı
     alanlar tek satıra iner. */
input[type=text], input[type=search], input[type=email], input[type=url],
input[type=number], input[type=date], input[type=password], select {
  height: var(--kutu-h-orta);
  font-size: var(--fs-md);
  border-radius: var(--r-alan);
}

/* ── Süzgeç / araç çubuğu bağlamı 28 px ─────────────────────────────── */
.suzgec-kart :is(input, select),
.girus-serit :is(input, select, .ms-toggle, .dugme),
.hizli-seridi .dugme, .toplu-serit .dugme,
.coklu-suzgec > summary, .ara-kutu,
.gorunum-secici button {
  height: var(--kutu-h);
  font-size: var(--fs-sm);
}
.toplu-serit .ayirici { height: 16px; }
.onay-kutusu { height: var(--kutu-h-orta); }
.onay-kutusu input[type=checkbox] { width: 16px; height: 16px; }

/* ── Düğme merdiveni (40/36/32 → 28/32/24) ──────────────────────────── */
.dugme { height: var(--kutu-h); padding: 0 12px; font-size: var(--fs-md);
         border-radius: var(--r-alan); }
.dugme.orta { height: var(--kutu-h-orta); padding: 0 12px; font-size: var(--fs-md); }
.dugme.kucuk { height: var(--kutu-h-kucuk); padding: 0 8px; font-size: var(--fs-sm); }

/* ── Tablo ──────────────────────────────────────────────────────────── */
table.liste { font-size: var(--fs-sm); }
table.liste thead th { height: var(--h-tablo-baslik); font-size: var(--fs-xs); }
table.liste tbody td { height: var(--h-satir); }
/* "küçük" tablo bugün 32 px — yani normalden (30) BÜYÜKTÜ. */
table.liste.kucuk thead th, table.liste.kucuk tbody td { height: var(--kutu-h-kucuk); }
/* ⚠ SATIRINDA KUTU OLAN TABLOLAR 26'ya ZORLANMAZ (teklif kalemleri, kap
   ölçüleri, lojistik kalemleri, muhasebe düzenlenebilir hücreleri). */
table.liste.girdi tbody td,
table.liste tbody td.duzenlenebilir { height: var(--h-satir-girdi); }
table.liste td.duzenlenebilir :is(input, select) { height: 22px; min-width: 0;
  font-size: var(--fs-xs); border-radius: var(--r-alan); }
table.liste .dugme.kucuk { height: var(--kutu-h-mini); padding: 0 6px;
                           font-size: var(--fs-xs); }
table.liste .rozet { font-size: var(--fs-xs); line-height: 16px; }
/* ⚠ KULLANICI KURALI KORUNUR: açıklama hücresi KIRPILMAZ. */
table.liste td:has(.yardim) { height: auto; }

/* ── Sayfa üstü katmanları (97 + 105 px → 68 + 63) ──────────────────── */
.ozet-satiri { gap: var(--b3); margin-bottom: var(--b3); }
.ozet-kart { padding: var(--b3) var(--b4); }
/* BÜYÜK HARF KALKAR: dört referans ERP'nin (SAP Horizon, Fluent 2, Odoo 17,
   Redwood) hiçbiri etiketi büyük harf yazmaz; küçük büyük harf en yavaş
   okunan biçimdir. Özet standardının YAPISI değişmez. */
.ozet-kart .etiket { font-size: var(--fs-xs); text-transform: none;
                     letter-spacing: 0; font-weight: var(--fw-orta); }
.ozet-kart .deger { font-size: var(--fs-xl); margin-top: var(--b1); }
.suzgec-kart { padding: var(--b3) var(--b4); margin-bottom: var(--b3); }
.hizli-seridi, .toplu-serit { margin-bottom: var(--b2); gap: var(--b2); }
.sayfa { padding: var(--sayfa-bosluk) var(--b5); }
.mesajlar { margin-bottom: var(--b3); gap: var(--b2); }

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 4 — SÜZGEÇ / KUTU KÖK NEDEN TEMİZLİĞİ (16.09.2026)
   Muhasebe'nin ayrık yoğunluk bloğu eritildiği için süzgeç çubuğunun tek
   satırda kalmasını artık GENEL kurallar sağlamalı.
   ══════════════════════════════════════════════════════════════════════════ */

/* ⚠⚠ GLOBAL `input{min-width:180px}` (erp1.css:192) ETKİSİZLEŞTİRİLDİ.
   Bu tek kural üç ayrı yerde geri alınmak zorunda kalmıştı:
     · crm/temel.html'de `.crm-icerik input{min-width:0}` bloğu,
     · `#belgeTablosu input[type=checkbox]{min-width:0}` yaması (onay kutusu
       110 px olunca ✓ sütunu 133 px geliyordu),
     · muhasebe kompakt bloğunun `min-width:0` tekrarları.
   Genişlik artık BÖLGEYE göre verilir. */
input[type=text], input[type=search], input[type=email], input[type=url],
input[type=number], input[type=date], input[type=password], select, textarea {
  min-width: 0;
  padding-left: var(--b3); padding-right: var(--b3);
  border-color: var(--kenar-dugme);
}
/* Tek başına duran form kutusu yine rahat okunsun. */
.form-izgara :is(input, select, textarea),
.alan:not(.genis) > :is(input, select) { width: 100%; }

/* Süzgeç çubuğu: 28 px, dar kutular, tek satır. */
.suzgec-kart :is(input, select, .coklu-suzgec > summary) {
  min-width: 118px; font-size: var(--fs-sm);
}
.suzgec-kart select { width: auto; max-width: 168px; }
.suzgec-kart .alan.genis { flex: 1 1 220px; }
.suzgec-kart .alan.genis input { width: 100%; }
.suzgec-kart { box-shadow: none; }
.suzgec-satir { gap: var(--b2) var(--b3); align-items: flex-end; }
.alan { gap: var(--b1); }
.alan > label { font-size: var(--fs-xs); font-weight: var(--fw-orta);
                color: var(--metin-soluk); line-height: 16px; }

/* ⚠ `.tablo-sarmal input{min-width:110px}` (338) her onay kutusunu da
   büyütüyordu; yalnız GERÇEKTEN düzenlenen hücrelere kapsanır. */
.tablo-sarmal :is(input, select, textarea) { min-width: 0; }
.tablo-sarmal td.duzenlenebilir :is(input, select) { min-width: 96px; }
.tablo-sarmal input[type=checkbox] { width: 14px; height: 14px; min-width: 0; }

/* Odak: 3 px mavi hale → SAP'nin 2 px düz çizgisi (kutu ölçüsünü şişirmez). */
input:focus, select:focus, textarea:focus {
  outline: 2px solid var(--odak); outline-offset: -1px;
  border-color: var(--kenar-dugme); box-shadow: none;
}
input[readonly], input:disabled, select:disabled {
  background: var(--uzerinde); color: var(--metin);
}

/* Yükleme kartı ve sayfalama — muhasebeye özel ölçüler genelleşti. */
details.yukleme-karti { margin: 0 0 var(--b2); border-radius: var(--r-kart); }
details.yukleme-karti:not([open]) { display: inline-block; box-shadow: none; }
.yukleme-karti > summary { padding: var(--b2) var(--b4); font-size: var(--fs-sm); }
.sayfalama { padding: var(--b2) 0; font-size: var(--fs-xs); }

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 6 — SOL MENÜ: AÇIK TEMA (16.09.2026)
   Karşılaştırılan dört sistemin (SAP Fiori Horizon, Fluent 2 / D365,
   Odoo 17, Oracle Redwood) DÖRDÜ de açık menü kullanıyor: koyu şerit
   ekranın soluna ikinci bir "uygulama" gibi oturuyor, kullanıcının gözü
   her sayfa değişiminde iki kez uyum sağlıyor.
   ⚠ HTML'E HİÇ DOKUNULMAZ — `test_sol_menu_duzeni` sınıf adlarını, öznitelik
     sırasını ve yaprak `<a>`'nın içeriğini dizi olarak arıyor.
   ⚠ Kademeli yapı, katlı açılış, sessionStorage ve kaydırma konumu aynen kalır.
   ══════════════════════════════════════════════════════════════════════════ */
:root {
  --menu-zemin: #ffffff;
  --menu-metin: #131e29;
  --menu-soluk: #556b82;
  --menu-genislik: 248px;
}

.yan-menu {
  width: var(--menu-genislik);
  flex-basis: var(--menu-genislik);
  background: var(--menu-zemin);
  color: var(--menu-metin);
  border-right: 1px solid var(--kenar);
  box-shadow: none;
}
/* Marka bloğu üst çubukla aynı hizada bitsin (tek yatay çizgi). */
.yan-menu .marka {
  position: sticky; top: 0; z-index: 2;
  height: var(--h-kabuk);
  display: flex; flex-direction: column; justify-content: center;
  padding: 0 var(--b4);
  background: var(--menu-zemin);
  font-size: var(--fs-md); font-weight: var(--fw-kalin);
  color: var(--metin); letter-spacing: 0;
  border-bottom: 1px solid var(--kenar);
}
.yan-menu .marka small { font-size: var(--fs-xs); font-weight: var(--fw-normal);
                         color: var(--menu-soluk); }

/* ── Kademe 1 ── */
.menu-grup { padding: 0; }
.menu-baslik {
  height: var(--h-menu-k1); align-items: center;
  margin: 1px 6px; padding: 0 var(--b3);
  border-radius: 6px;
  font-size: var(--fs-sm); font-weight: var(--fw-kalin);
  text-transform: none; letter-spacing: 0;
  color: var(--metin);
}
.menu-baslik:hover { background: var(--uzerinde); }
.menu-baslik span:last-child { font-size: 10px; color: var(--menu-soluk); }

/* ⚠⚠ MODÜL RENGİ KAYBOLMAZ, YER DEĞİŞTİRİR. Renkli BÜYÜK HARF başlık dört
   referans sistemin hiçbirinde yok; ama modül rengi kullanıcının üç yıllık
   işareti. Renk metinden çıkıp başlığın solundaki 3×14 px bayrağa taşınır —
   `data-renk` HTML'de zaten var, ŞABLON DEĞİŞMEZ.
   ⚠ Bugün kirmizi / mavi / lacivert'in HİÇ CSS'i yoktu: Girus, CRM, Lojistik,
     İthalat ve Panel tek gri tona düşüyordu. Bu blok onu da kapatır. */
.menu-baslik::before {
  content: ""; flex: 0 0 3px; width: 3px; height: 14px;
  margin-right: var(--b3); border-radius: 2px;
  background: var(--menu-renk, #b3bdc7);
}
.menu-grup[data-renk="kirmizi"]  { --menu-renk: #b42318; }
.menu-grup[data-renk="mavi"]     { --menu-renk: #0f62d6; }
.menu-grup[data-renk="yesil"]    { --menu-renk: #0f7b4f; }
.menu-grup[data-renk="turuncu"]  { --menu-renk: #c2620b; }
.menu-grup[data-renk="mor"]      { --menu-renk: #6b46c1; }
.menu-grup[data-renk="gri"]      { --menu-renk: #64748b; }
.menu-grup[data-renk="lacivert"] { --menu-renk: #0b3a86; }
/* Eski koyu temanın renkli başlık metinleri geri alınır. */
.menu-grup[data-renk] .menu-baslik { color: var(--metin); }

/* ── Kademe 2 ── */
.menu-ogeler a, .menu-altbaslik {
  height: var(--h-menu-k2);
  display: flex; align-items: center;
  margin: 1px 6px; padding: 0 var(--b3) 0 22px;
  border-radius: 6px; border-left: 0;
  font-size: var(--fs-sm); font-weight: var(--fw-normal);
  color: var(--metin);
}
.menu-ogeler a:hover, .menu-altbaslik:hover { background: var(--uzerinde); }
.menu-altgrup:not(.kapali) > .menu-altbaslik { font-weight: var(--fw-orta);
                                               color: var(--metin); }
.menu-altbaslik span:last-child { font-size: 10px; color: var(--menu-soluk); }

/* ── Kademe 3 ── */
.menu-ogeler .menu-altogeler a {
  height: var(--h-menu-k3); padding-left: 34px;
  font-size: var(--fs-xs); color: var(--metin);
}

/* ── SEÇİLİ (SAP Horizon): açık mavi zemin + 3 px sol şerit ── */
.menu-ogeler a.etkin,
.menu-ogeler .menu-altogeler a.etkin {
  background: var(--vurgu-acik);
  color: var(--vurgu-koyu);
  font-weight: var(--fw-orta);
  box-shadow: inset 3px 0 0 var(--vurgu);
  border-left-color: transparent;
}

/* Panel kartındaki menü kopyası da aynı dili konuşsun. */
.panel-menu .panel-altbaslik { color: var(--metin-soluk); font-size: var(--fs-xs); }

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 7 — DÜĞMELER, TEK "SEÇİLİ" DİLİ, ŞERİTLER (16.09.2026)
   ⚠ HİÇBİR ŞABLON DEĞİŞMEZ: bugün beş ayrı yolla kodlanan "seçili" durumu
     tek seçici listesine bağlanır.
   ══════════════════════════════════════════════════════════════════════════ */
.dugme {
  gap: var(--b2);
  border-color: var(--kenar-dugme);
  background: var(--kart);
  color: var(--vurgu-koyu);
  font-weight: var(--fw-orta);
}
.dugme:hover { background: var(--uzerinde); border-color: var(--kenar-dugme); }
.dugme:active { background: var(--basili); }
/* BUGÜN YOK: klavyeyle gezen kullanıcı hangi düğmede olduğunu göremiyordu. */
.dugme:focus-visible { outline: 2px solid var(--odak); outline-offset: 1px; }
.dugme[disabled], .dugme.pasif { opacity: .45; cursor: not-allowed; }
.dugme.saydam { background: transparent; border-color: transparent; }
.dugme.saydam:hover { background: var(--uzerinde); border-color: var(--kenar-dugme); }

/* SAYFADA TEK DOLU MAVİ: listede "+ Yeni", formda "Kaydet". */
.dugme.birincil { background: var(--vurgu); border-color: var(--vurgu); color: #fff;
                  font-weight: var(--fw-kalin); }
.dugme.birincil:hover { background: var(--vurgu-koyu); border-color: var(--vurgu-koyu); }

/* ⚠ SİL ARTIK DOLU KIRMIZI DEĞİL: 32 listede her satırın sonunda duran dolu
   kırmızı düğme ekranı mayın tarlasına çeviriyor, gözü asıl işten çalıyordu.
   SAP'nin "Reject" biçimi: açık zemin + kırmızı yazı. */
.dugme.tehlike { background: var(--olumsuz-zemin); border-color: var(--olumsuz-kenar);
                 color: var(--olumsuz); }
.dugme.tehlike:hover { background: #fbdbd7; border-color: var(--olumsuz); }
/* Dolu kırmızı yalnız SİLME ONAYI sayfasında (geri dönüşü olmayan tek tıklama). */
.dugme.tehlike.dolu { background: var(--olumsuz); border-color: var(--olumsuz); color: #fff; }
/* ⚠⚠ MUAFİYET — GİRUS GÜNCELLEME DAMGASI. Kullanıcının kalıcı kuralı:
   "güncellenemiyorsa KIRMIZI". Sorunluyken .dugme.kucuk.tehlike basılıyor;
   şablon değişmeden dolu kırmızı kalmalı. */
.girus-damgasi .dugme.tehlike {
  background: var(--olumsuz); border-color: var(--olumsuz); color: #fff;
  font-weight: var(--fw-kalin);
}

/* Anlamsal iş düğmeleri tek yerde toplanır. */
.dugme.loj-giris { background: var(--olumlu-zemin); border-color: var(--olumlu-kenar);
                   color: var(--olumlu); }
.dugme.loj-giris:hover:not([disabled]) { background: #d2efdf; }
.dugme.it-sil-dugme { background: var(--kart); border-color: var(--olumsuz-kenar);
                      color: var(--olumsuz); }

/* ══ "SEÇİLİ" TEK DİLİ — bugün beş ayrı kodlama var ══════════════════════ */
.hizli-seridi .dugme.birincil,
.gorunum-secici .dugme.birincil,
.gorunum-secici button.secili,
.suz-satir .suz-ms-dugme.secili,
.hd-arac button.etkin,
.sevk-yok-dugme.etkin,
.dugme.secili {
  background: var(--vurgu-acik); border-color: var(--vurgu);
  color: var(--vurgu-koyu); font-weight: var(--fw-orta);
}

/* Segment anahtarı: yapışık düğmeler, tek dış köşe. */
.gorunum-secici { display: inline-flex; gap: 0; margin-bottom: var(--b3); }
.gorunum-secici :is(a.dugme, button) { height: var(--kutu-h); border-radius: 0;
  font-size: var(--fs-sm); padding: 0 12px; }
.gorunum-secici :is(a.dugme, button):first-child { border-radius: var(--r-alan) 0 0 var(--r-alan); }
.gorunum-secici :is(a.dugme, button):last-child { border-radius: 0 var(--r-alan) var(--r-alan) 0;
                                                   margin-left: -1px; }

/* ══ ŞERİTLER — altı ayrı biçim, dört anlamsal türev (şablon değişmeden) ══ */
.mesaj, .uyari-serit, .mh-tasima-uyari, .loj-kaynak, .sayac-serit, .suz-serit {
  padding: var(--b2) var(--b4); border: 1px solid; border-left-width: 3px;
  border-radius: var(--r-alan); font-size: var(--fs-sm); line-height: 1.5;
  max-width: 96ch;
}
.mesaj.success, .loj-kaynak { background: var(--olumlu-zemin); border-color: var(--olumlu-kenar);
  border-left-color: var(--olumlu); color: var(--olumlu); }
.mesaj.error, .mh-tasima-uyari { background: var(--olumsuz-zemin); border-color: var(--olumsuz-kenar);
  border-left-color: var(--olumsuz); color: var(--olumsuz); }
.mesaj.warning, .uyari-serit { background: var(--uyari-zemin); border-color: var(--uyari-kenar);
  border-left-color: var(--uyari); color: var(--uyari); }
.mesaj.info, .suz-serit, .sayac-serit { background: var(--bilgi-zemin); border-color: var(--bilgi-kenar);
  border-left-color: var(--vurgu); color: var(--metin); }
.suz-serit .suz-temizle { background: var(--kart); border: 1px solid var(--kenar-dugme);
  color: var(--vurgu-koyu); border-radius: var(--r-alan); }

/* ══ Sayfalama: dolu mavi → seçili biçimi ═══════════════════════════════ */
.sayfalama :is(a, span) { min-width: var(--kutu-h-kucuk); height: var(--kutu-h-kucuk);
  border-radius: var(--r-alan); }
.sayfalama .etkin { background: var(--vurgu-acik); border-color: var(--vurgu);
                    color: var(--vurgu-koyu); }
.sayfalama .bilgi { color: var(--metin-soluk); }

/* ══ Rozet: hap (999 px) → 4 px köşe. Hap biçimi tablo satırını yükseltiyordu. */
.rozet, .kat { border-radius: var(--r-alan); padding: 0 6px; line-height: 18px;
               font-size: var(--fs-xs); font-weight: var(--fw-orta); }

/* ══ Tablo: NÖTR HOVER / MAVİ SEÇİLİ ════════════════════════════════════
   ⚠⚠ Bugün ikisi de --vurgu-acik: 200 satırlık Harcamalar'da fareyle
      gezerken işaretlenmiş satır kayboluyordu. */
table.liste tbody tr:hover > td { background: var(--uzerinde); }
table.liste tbody tr:is(.secili-satir, .secili) > td { background: var(--vurgu-acik); }
table.liste tbody tr:is(.secili-satir, .secili):hover > td { background: var(--vurgu-acik-2); }
table.liste tbody tr:is(.secili-satir, .secili) > td:first-child {
  box-shadow: inset 3px 0 0 var(--vurgu); }
table.liste thead th { background: var(--kart); color: var(--metin); }
table.liste tbody td { border-bottom: 1px solid var(--kenar-satir); }
tr.ozet-toplam > td, table.liste tr.toplam-satiri td {
  background: var(--notr-zemin); border-top: 1px solid var(--kenar-baslik);
  font-weight: var(--fw-kalin); }

/* ══ Kart / pencere ═════════════════════════════════════════════════════ */
.kart { border-radius: var(--r-kart); border-color: var(--kenar); box-shadow: var(--golge); }
.kart-basi { min-height: 32px; padding: 0 var(--b4); font-size: var(--fs-lg);
             font-weight: var(--fw-kalin); }
.kart-govde { padding: var(--b4); }

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 5 — KABUK + SAYFA BAŞLIĞI (16.09.2026)
   Başlık üst çubuktan sayfanın içine indi: kabuk 56 → 44 px, sayfanın
   kendi başlığı kırıntı ve eylemlerle birlikte tek yapışkan bantta.
   ══════════════════════════════════════════════════════════════════════════ */
.ust-cubuk {
  height: var(--h-kabuk);
  padding: 0 var(--b4);
  gap: var(--b3);
  border-bottom: 0;
  box-shadow: var(--golge-kabuk, 0 1px 2px rgba(34, 53, 72, .10),
                                 inset 0 -1px 0 rgba(34, 53, 72, .14));
}
.ust-cubuk .dugme { height: var(--kutu-h-kucuk); }
/* base.html'de `dugme orta` yazan şirket seçici 36 px ile tek başına
   yüksekti — kabuğun geri kalanıyla aynı ölçüye iner. */
.ust-cubuk select.dugme.orta { height: var(--kutu-h); font-weight: var(--fw-normal);
                               font-size: var(--fs-sm); }
.ust-cubuk .marka-ust { font-size: var(--fs-md); font-weight: var(--fw-kalin);
                        color: var(--metin); }
.ust-cubuk .kullanici { font-size: var(--fs-xs); color: var(--metin-soluk); }
.girus-damgasi .damga { font-size: var(--fs-xs); color: var(--metin-soluk); }

/* ── Sayfa başı: kırıntı · başlık · alt başlık · eylemler ───────────────
   Yapışkan; üst çubuğun hemen altına oturur, tablo başlığının üstünde kalır
   (tablo başlığı z-index 5, sayfa başı 15, kabuk 20). */
.sayfa-basi {
  position: sticky; top: var(--h-kabuk); z-index: 15;
  display: flex; flex-wrap: wrap; align-items: center;
  gap: var(--b2) var(--b4);
  padding: var(--b1) 0 var(--b3);
  margin-bottom: var(--b3);
  background: var(--zemin);
  box-shadow: inset 0 -1px 0 var(--kenar);
}
.sayfa-basi .kirinti { flex: 1 0 100%; font-size: var(--fs-xs); line-height: 16px;
                       color: var(--metin-soluk); }
.sayfa-basi .kirinti:empty { display: none; }
.sayfa-basi .kirinti .ayrac { margin: 0 6px; opacity: .6; }
.sayfa-basi h1 { margin: 0; font-size: var(--fs-xl); font-weight: var(--fw-kalin);
                 line-height: 24px; }
.sayfa-basi h1:empty { display: none; }
.sayfa-basi .ust-alt { flex: 1 0 100%; font-size: var(--fs-xs); line-height: 15px;
                       color: var(--metin-soluk); font-weight: var(--fw-normal); }
.sayfa-basi .sayfa-eylemler { margin-left: auto; display: flex; gap: var(--b2); }
.sayfa-basi .sayfa-eylemler:empty { display: none; }
/* CRM: kendi <h2>'si var, burada yalnız kırıntı basılır. */
.sayfa-basi.yalniz-kirinti { padding-bottom: var(--b2); }

.sayfa { max-width: 1680px; }
@media (min-width: 1440px) { .sayfa { padding: var(--b4) var(--b6); } }

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 10 — CRM KÖPRÜSÜ (16.09.2026)
   38 CRM sayfası %100 Bootstrap 5.1.3 sınıfı kullanıyor, sıfır ERP1 kit
   sınıfı. Şablonlar yeniden yazılmaz; Bootstrap'in ölçüleri tek köprü
   katmanıyla ERP1 diline çekilir (erp1.css Bootstrap'ten SONRA yüklenir).
   ⚠⚠ Seçici `.crm-icerik`, `.icerik` DEĞİL: 611-620 arası blok `.icerik`
      ile yazılmıştı, yani o kurallar base.html'in ANA sarmalayıcısına — yani
      tüm sisteme — açıktı.
   ⛔ DOKUNULMAZ: `.kalem-tablo` / `.teklif-kalem-tablo` nth-child sütun
      genişlikleri (test_crm_kalem_tablosu ile kilitli) ve quote_print.html.
   ══════════════════════════════════════════════════════════════════════════ */
.crm-icerik { font-size: var(--fs-sm); color: var(--metin);
              max-width: 100%; overflow-x: auto; }
.crm-icerik :is(h1, h2) { font-size: var(--fs-xl); font-weight: var(--fw-kalin);
                          margin: 0 0 var(--b3); line-height: 24px; }
.crm-icerik :is(h3, h4, h5, h6) { font-size: var(--fs-lg); font-weight: var(--fw-kalin); }

.crm-icerik .card { border: 1px solid var(--kenar); border-radius: var(--r-kart);
                    box-shadow: var(--golge); }
.crm-icerik .card-header { background: var(--kart); border-bottom: 1px solid var(--kenar);
  padding: 0 var(--b4); min-height: 32px; display: flex; align-items: center;
  font-size: var(--fs-lg); font-weight: var(--fw-kalin); }
.crm-icerik .card-body { padding: var(--b4); }
.crm-icerik > .card, .crm-icerik .card.mb-4 { width: max-content; max-width: 100%;
                                               min-width: min(100%, 560px); }

.crm-icerik .form-label { font-size: var(--fs-xs); font-weight: var(--fw-orta);
                          color: var(--metin-soluk); margin-bottom: var(--b1); }
.crm-icerik :is(.form-control, .form-select) {
  height: var(--kutu-h-orta); min-height: 0; min-width: 0; padding: 0 var(--b3);
  font-size: var(--fs-sm); border-color: var(--kenar-dugme);
  border-radius: var(--r-alan); box-shadow: none; }
.crm-icerik textarea.form-control { height: auto; padding: var(--b2) var(--b3); }
.crm-icerik :is(.form-control, .form-select):focus {
  border-color: var(--kenar-dugme); outline: 2px solid var(--odak);
  outline-offset: -1px; box-shadow: none; }

.crm-icerik .btn { height: var(--kutu-h); min-height: 0; padding: 0 10px;
  display: inline-flex; align-items: center; gap: var(--b2);
  font-size: var(--fs-sm); font-weight: var(--fw-orta); border-radius: var(--r-alan); }
.crm-icerik .btn-sm { height: var(--kutu-h-kucuk); padding: 0 var(--b3); font-size: var(--fs-xs); }
.crm-icerik .btn-lg { height: var(--kutu-h-orta); font-size: var(--fs-md); }
.crm-icerik :is(.btn-primary, .btn-success) { background: var(--vurgu);
                                              border-color: var(--vurgu); color: #fff; }
.crm-icerik :is(.btn-primary, .btn-success):hover { background: var(--vurgu-koyu);
                                                    border-color: var(--vurgu-koyu); }
.crm-icerik :is(.btn-secondary, .btn-light, .btn-outline-secondary) {
  background: var(--kart); border-color: var(--kenar-dugme); color: var(--metin); }
.crm-icerik :is(.btn-outline-primary, .btn-link) { color: var(--vurgu-koyu);
  border-color: var(--kenar-dugme); background: var(--kart); }
.crm-icerik .btn-danger { background: var(--olumsuz-zemin);
  border-color: var(--olumsuz-kenar); color: var(--olumsuz); }

.crm-icerik .badge { border-radius: var(--r-alan); font-size: var(--fs-xs);
                     font-weight: var(--fw-orta); padding: 0 6px; line-height: 18px; }
.crm-icerik .badge.bg-success { background: var(--olumlu-zemin) !important; color: var(--olumlu); }
.crm-icerik .badge.bg-danger  { background: var(--olumsuz-zemin) !important; color: var(--olumsuz); }
.crm-icerik .badge.bg-warning { background: var(--uyari-zemin) !important;  color: var(--uyari); }
.crm-icerik .badge:is(.bg-primary, .bg-info) { background: var(--bilgi-zemin) !important;
                                               color: var(--bilgi); }
.crm-icerik .badge:is(.bg-secondary, .bg-light, .bg-dark) {
  background: var(--notr-zemin) !important; color: var(--metin-soluk); }

.crm-icerik .table { font-size: var(--fs-sm); --bs-table-hover-bg: var(--uzerinde); }
.crm-icerik .table > thead th { height: var(--h-tablo-baslik); background: var(--kart);
  color: var(--metin); font-size: var(--fs-xs); font-weight: var(--fw-orta);
  box-shadow: inset 0 -1px 0 var(--kenar-baslik); border-bottom: 0; }
.crm-icerik .table > :not(caption) > * > * { padding: 0 var(--b3); height: var(--h-satir);
  vertical-align: middle; border-bottom-color: var(--kenar-satir); box-shadow: none; }
.crm-icerik .table-responsive { width: max-content; max-width: 100%; }
.crm-icerik .table-responsive > .table { width: auto; min-width: 100%; }
.crm-icerik .nav-tabs .nav-link.active { color: var(--vurgu-koyu);
                                         border-bottom: 2px solid var(--vurgu); }
.crm-icerik .alert { border-radius: var(--r-alan); font-size: var(--fs-sm);
                     padding: var(--b2) var(--b4); border-left-width: 3px; }
.crm-icerik .fas, .crm-icerik .far, .crm-icerik .fab { font-size: 12px; }

/* crm/temel.html'deki <style> adasından taşınanlar: uzun hücreler sarsın,
   kalem tabloları kendi genişliklerini korusun. */
.crm-icerik table.table :is(td, th) { white-space: normal; }
.crm-icerik :is(.kalem-tablo, .teklif-kalem-tablo) :is(td, th) { white-space: nowrap; }

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 9 — FORM (16.09.2026)
   ⚠ İthalat teklif ekranının OKUNUR ↔ DÜZENLE kuralı bozulmaz: okunur modda
     "Kaydet" YOKTUR (devre dışı alan POST'a gitmez). `.it-eylem-cubugu`
     zaten yapışkan; yalnız ölçü ve köşe devralır.
   ══════════════════════════════════════════════════════════════════════════ */
.form-izgara { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
               gap: var(--b3) var(--b4); max-width: 1240px; }
.form-izgara .alan.tam { grid-column: 1 / -1; }
.yardim { font-size: var(--fs-xs); color: var(--metin-soluk); }
.hata { font-size: var(--fs-xs); color: var(--olumsuz); }
label .zorunlu, .alan > label abbr { color: var(--zorunlu); }
.alan.hatali :is(input, select, textarea) { border-color: var(--olumsuz); }

/* YAPIŞKAN FORM EYLEM ÇUBUĞU — kartın DİBİNE oturur. Uzun formlarda
   "Kaydet"i bulmak için sayfanın sonuna kaydırmak gerekmiyordu. */
.kart-govde > form > .form-eylemler {
  position: sticky; bottom: 0; z-index: 5;
  height: 40px; align-items: center; justify-content: flex-end;
  margin: var(--b5) calc(-1 * var(--b4)) calc(-1 * var(--b4));
  padding: 0 var(--b4);
  background: var(--kart);
  border-top: 1px solid var(--kenar);
  border-radius: 0 0 var(--r-kart) var(--r-kart);
}
.form-eylemler { gap: var(--b3); margin-top: var(--b5); }

/* Pencere (dialog) — açılır gölgesi ve köşesi kart diliyle aynı. */
.pencere, dialog.pencere { border-radius: var(--r-kart); border: 1px solid var(--kenar);
                           box-shadow: var(--golge-acilir); }
.pencere-bas { min-height: 36px; padding: 0 var(--b4); }
.pencere-baslik { font-size: var(--fs-lg); font-weight: var(--fw-kalin); }

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 11 — YAZI TİPİ (16.09.2026)
   Fluent 2'nin yazı tipi stratejisi: Windows'ta "Segoe UI Variable Text"
   (10-17 px için optimize edilmiş kesme) varsa o kullanılır, yoksa klasik
   Segoe UI'a düşer. Kullanıcıların tamamı Windows 11'de — sunucuya font
   dosyası konulmadan SAP/Fluent'in okunurluğu elde edilir.
   ⚠ Rakamlar TABLO SÜTUNUNDA HİZALI olmalı: tutar sütunu değişken genişlikli
     rakamla basılınca basamaklar kayıyor, göz toplamı yakalayamıyordu.
   ══════════════════════════════════════════════════════════════════════════ */
:root {
  --yazi: "Segoe UI Variable Text", "Segoe UI", "IBM Plex Sans", system-ui,
          -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
}
body { font: var(--fs-md)/1.5 var(--yazi); }
.sayi, table.liste td.sag, .ozet-kart .deger {
  font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1;
}

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 2b — İKİ KATLI YAPIŞKAN BAŞLIK (16.09.2026)
   ⚠⚠ `sutun_suzgec.js:278` süzgeç satırını THEAD'in İÇİNE ekliyor. Faz 2'de
      tabloya gerçek bir kaydırma kabı verilince `thead th{top:0}` kuralı bu
      ikinci satırı da 0'a yapıştırdı ve İKİ BAŞLIK ÜST ÜSTE BİNDİ (sütun
      adları süzgeç kutularının altında kayboluyordu).
   Çözüm: ikinci sıra ilk sıranın yüksekliği kadar aşağıda durur.
   ══════════════════════════════════════════════════════════════════════════ */
table.liste thead tr.suz-satir th {
  position: sticky;
  top: var(--h-tablo-baslik);
  z-index: 4;                      /* başlık sırası (5) ÜSTTE kalsın */
  background: var(--zemin);
  box-shadow: inset 0 -1px 0 var(--kenar-baslik);
  border-top: 1px solid var(--kenar);
}
.suz-satir .suz-girdi { height: 22px; font-size: var(--fs-xs); border-radius: var(--r-alan); }
.suz-satir th.suz-hucre { padding: var(--b1) var(--b2); }
.suz-satir .suz-ms-dugme { height: 22px; font-size: var(--fs-xs); }
/* Süzgeç satırı varken kabın tepesinde iki sıra yer kaplar; ölçüm betiği
   sarmalayıcının kendi `top`unu kullandığı için ek bir düzeltme gerekmez. */

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 6b — MENÜ BAŞLIĞI HİZASI (16.09.2026)
   ⚠ Eski kural `justify-content: space-between` idi ve iki çocuk vardı
     (başlık · ok). Faz 6'da renk bayrağı ::before olarak eklenince ÜÇ çocuk
     oldu ve başlık ORTAYA kaydı. Hizalama başa alınır, ok sona itilir.
   ══════════════════════════════════════════════════════════════════════════ */
.menu-baslik, .menu-altbaslik { justify-content: flex-start; }
.menu-baslik > span:last-child,
.menu-altbaslik > span:last-child { margin-left: auto; padding-left: var(--b2); }

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · EK — MUHASEBE DÜZENLİ YÜKLEME (16.09.2026)
   `templates/muhasebe/belge_liste.html` ve `ekstre_liste.html` bu üç sınıfı
   satır içi `style` ile taşıyordu; kural şablondan CSS'e alındı (şablona
   satır içi stil yazmak hem tekrar eder hem şablon kodu denetimini zorlar).
   ══════════════════════════════════════════════════════════════════════════ */
.mh-duzenli-bas { font-weight: var(--fw-orta); margin: var(--b2) 0 var(--b2); }
table.liste tbody tr.duzenli-geldi > td { background: var(--olumlu-zemin); }
.rozet.mh-damga { border: 0; cursor: pointer; font: inherit;
                  font-size: var(--fs-xs); font-weight: var(--fw-orta); }

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · EK — "SÜZÜLEN" ŞERİDİ (16.09.2026)
   SAP'nin "Filtered By" satırı: süzgeç kartı kapalıyken hangi süzgeçlerin
   açık olduğu tek satırda görünür. Kullanıcı daralttığı listeyi unutup
   "kayıt kayboldu" diye arıyordu.
   ⚠ `.suz-serit` ile birlikte basılır (bilgi şeridi rengini oradan alır);
     burada yalnız yerleşim ve ölçü var.
   ══════════════════════════════════════════════════════════════════════════ */
.suzulen {
  display: flex; align-items: center; flex-wrap: wrap;
  gap: var(--b2); min-height: var(--h-arac);
  margin: 0 0 var(--b3); padding: var(--b1) var(--b4);
  font-size: var(--fs-xs); color: var(--metin-soluk);
}
.suzulen b { color: var(--metin); font-weight: var(--fw-orta); }
.suzulen .dugme { height: var(--kutu-h-kucuk); margin-left: var(--b2); }

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 3b — SAYFA BAŞI SIKIŞTIRMASI (16.09.2026)
   ⚠⚠ ÖLÇÜMLE BULUNDU: Harcamalar ekranında tablo 440 px aşağıdan başlıyordu
      ve görünen satır 20 → 15'e DÜŞTÜ. İki sebep:
      (a) `td.duzenlenebilir` 32 px'e çıkmıştı (satır içi kutu zaten 22 px;
          eski muhasebe bloğu 26 px satırda gayet çalışıyordu),
      (b) başlık üst çubuktan sayfaya inince kabuk 56→44 düşse de
          `.sayfa-basi` 58 px ekledi — net +46 px.
   Ölçüm aracı: scratchpad/kafa_olc.py (katman katman yükseklik).
   ══════════════════════════════════════════════════════════════════════════ */

/* (a) Satır içi düzenlenen hücre 26 px'e döner. 32 px YALNIZ gerçekten
   form gibi çalışan tablolarda (`table.liste.girdi`) kalır. */
table.liste tbody td.duzenlenebilir { height: var(--h-satir); }

/* (b) Sayfa başı tek satıra iner: kırıntı 14 px, başlık ve alt başlık AYNI
   satırda. Alt başlığın kendi satırı 15 px'e mal oluyordu. */
.sayfa-basi { padding: 0 0 var(--b2); margin-bottom: var(--b2); }
.sayfa-basi .kirinti { line-height: 14px; }
.sayfa-basi h1 { line-height: 22px; }
.sayfa-basi .ust-alt { flex: 0 1 auto; margin-left: var(--b3);
                       line-height: 22px; align-self: baseline; }

/* Özet kartı: 86 → ~56 px. Yapı (etiket · değer · .yardim) DEĞİŞMEDİ —
   özet standardı gereği; yalnız satır yükseklikleri sıkıştı. */
.ozet-kart { padding: var(--b1) var(--b3); min-width: 128px; }
.ozet-kart .etiket { line-height: 14px; }
.ozet-kart .deger { line-height: 22px; }
.ozet-kart .yardim { line-height: 14px; }

/* Süzgeç çubuğu ve şeritler. */
.suzgec-kart { padding: var(--b2) var(--b3); }
.suzgec-satir { gap: var(--b1) var(--b2); }
.alan > label { line-height: 14px; }
.toplu-serit { min-height: var(--h-arac); }
.toplu-serit .dugme, .toplu-serit .dugme.orta { height: var(--kutu-h-kucuk); }
.toplu-serit .onay-kutusu { height: var(--h-arac); }
.yukleme-karti > summary { padding: var(--b1) var(--b4); }

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 4b — SÜZGEÇ ÇUBUĞU TEK SATIRA (16.09.2026)
   Ölçüm: Harcamalar'da süzgeç kartı 100 px, yani İKİ SATIR. Eski muhasebe
   bloğu açılır kutuları 124 px'e sabitleyerek tek satırda tutuyordu; aynı
   ölçü genel kurala taşınır. Seçili değer kutuya sığıyor (kod/yıl/tip gibi
   kısa değerler), uzun seçenek listesi açılınca tam genişlikte görünür.
   ══════════════════════════════════════════════════════════════════════════ */
.suzgec-kart select, .suzgec-kart .coklu-suzgec > summary {
  width: 124px; min-width: 0; max-width: 124px;
}
.suzgec-kart input[type=date] { width: 128px; min-width: 0; }
.suzgec-kart input[type=search], .suzgec-kart input[type=text] { min-width: 0; }
.suzgec-kart .alan.genis { flex: 1 1 180px; }
.suzgec-kart .alan.genis input { width: 100%; }
/* Süz / Temizle kutularının boş etiketleri satırı yükseltmesin. */
.suzgec-kart .alan > label:empty { display: none; }

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 4c — YATAY TAŞMA ONARIMI (16.09.2026)
   ⚠⚠ ÖLÇÜMLE BULUNDU (scratchpad/tablo_genislik.py): Harcamalar tablosu
      1440 px ekranda kabından 121 px taşıyordu, "İşlem" sütunu kırpılıyordu.
      Üç sebep birikmişti:
        · sol menü 232 → 248 px genişledi (-16),
        · geniş ekranda sayfa yan boşluğu 20 → 24 px oldu (-8),
        · hücre yatay dolgusu 8 px, 14 sütunda -56.
      Kullanıcı kuralı: satır sonu düğmeleri 1440 px'de KAYDIRMADAN görünmeli.
   ══════════════════════════════════════════════════════════════════════════ */
:root { --menu-genislik: 232px; }
@media (min-width: 1440px) { .sayfa { padding: var(--b4) var(--b5); } }

/* Hücre dolgusu 8 → 6 px; kenar sütunlarda 10 px kalır (tablo kenarına
   yapışmasın). İçerik metnine dokunulmaz, yalnız boşluk. */
table.liste :is(th, td) { padding-left: 6px; padding-right: 6px; }
table.liste :is(th, td):first-child { padding-left: 10px; }
table.liste :is(th, td):last-child { padding-right: 10px; }
/* Satır sonu düğmeleri: 6 → 4 px dolgu, aralarındaki boşluk 2 px. */
table.liste .dugme.kucuk { padding: 0 4px; }
table.liste td.islem-hucre { white-space: nowrap; }
table.liste td.islem-hucre > * + * { margin-left: 2px; }

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 4d — MUHASEBE BELGE TABLOSU 14 SÜTUN (16.09.2026)
   Ölçüm: 1174 px kaba 1257 px tablo — 83 px taşma. Bu ekranın 14 sütunu
   sistemdeki en kalabalık tablo. Kullanıcı kuralı: "gerekiyorsa daha küçük
   font" — yalnız BU ekran ailesinde yazı 12 px'e iner ve üç geniş sütun
   kırpılır; başlık ve sayılar okunur kalır.
   ⚠ Kırpılan metnin tamamı hücrenin üzerine gelince (title) görünür.
   ══════════════════════════════════════════════════════════════════════════ */
/* ⚠⚠ PUNTO BURADAN KALKTI (26.09.2026 · K2): bu seciciden İKİ kopya vardi
   (biri asagida FAZ 6'da) ve ikisi de TORUN secicisiydi — `.sayfa` altindaki
   HER `table.liste`yi 12 px yapiyordu. K1.4 ile ekranin ustune eklenen kirilim
   tablosu da boylece 12 px'e dustu; ayni tablo oteki modullerde 13 px kaldi.
   Olcu artik TEK yerde ve tek tabloda: `table.liste#belgeTablosu`
   (KATMAN 2026.09 · FAZ 6 · bolum 1). Asil belge tablosunun 12 px'i AYNI. */
#belgeTablosu td.mh-firma-k { max-width: 132px; }
#belgeTablosu td.mh-belgeno { max-width: 104px; }
#belgeTablosu :is(th, td) { padding-left: 5px; padding-right: 5px; }
#belgeTablosu td.islem-hucre .dugme.kucuk { padding: 0 3px; }
/* Dönem ve PB sabit dar: içerikleri en fazla 7 ve 3 karakter. */
#belgeTablosu :is(th, td):nth-child(3) { max-width: 62px; }

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 6c — KABUK ÇAPASI GERİ GELİYOR (16.09.2026)
   ⚠⚠ KULLANICI GERİ BİLDİRİMİ: "Menü alanını da beyaz yapınca iyice renkler
      ve her şey birbirine karışmış, odak kaçmış."
      HAKLI: sol menü beyaz + üst çubuk beyaz + kartlar beyaz olunca ekranda
      hiçbir SINIR kalmadı; göz "burası gezinme, burası içerik" ayrımını
      yapamıyordu. Açık menü dört referans sistemde çalışıyor ÇÜNKÜ orada
      içerik alanı belirgin biçimde gri; bizim içeriğimiz kart kart beyaz.
      Çözüm: menü KOYU bir düzleme döner (ekranın sol çapası), ama Faz 6'nın
      kazanımları korunur — kademe ölçüleri, cümle düzeni başlıklar, renk
      bayrakları, seçili biçimi.
   ══════════════════════════════════════════════════════════════════════════ */
:root {
  --menu-zemin: #16202e;      /* derin arduvaz — eski #10203a'dan daha nötr */
  --menu-metin: #c9d4e2;
  --menu-soluk: #8fa0b5;
  --menu-ayrac: rgba(255, 255, 255, .08);
  --menu-uzerinde: rgba(255, 255, 255, .07);
  --menu-secili: rgba(79, 142, 247, .18);
}
.yan-menu {
  background: var(--menu-zemin); color: var(--menu-metin);
  border-right: 0;
  box-shadow: inset -1px 0 0 rgba(0, 0, 0, .25);
}
.yan-menu .marka {
  background: var(--menu-zemin); color: #fff;
  border-bottom: 1px solid var(--menu-ayrac);
}
.yan-menu .marka small { color: var(--menu-soluk); }

.menu-baslik { color: #e6edf6; }
.menu-baslik:hover { background: var(--menu-uzerinde); }
.menu-baslik span:last-child { color: var(--menu-soluk); }
.menu-grup[data-renk] .menu-baslik { color: #e6edf6; }
/* Renk bayrağı koyu zeminde daha parlak tonlarla okunur. */
.menu-grup[data-renk="kirmizi"]  { --menu-renk: #f2736a; }
.menu-grup[data-renk="mavi"]     { --menu-renk: #6ba4ff; }
.menu-grup[data-renk="yesil"]    { --menu-renk: #5fc99a; }
.menu-grup[data-renk="turuncu"]  { --menu-renk: #f0a868; }
.menu-grup[data-renk="mor"]      { --menu-renk: #b79bf0; }
.menu-grup[data-renk="gri"]      { --menu-renk: #93a3b8; }
.menu-grup[data-renk="lacivert"] { --menu-renk: #7aa7ff; }

.menu-ogeler a, .menu-altbaslik { color: var(--menu-metin); }
.menu-ogeler a:hover, .menu-altbaslik:hover { background: var(--menu-uzerinde); }
.menu-altgrup:not(.kapali) > .menu-altbaslik { color: #e6edf6; }
.menu-altbaslik span:last-child { color: var(--menu-soluk); }
.menu-ogeler .menu-altogeler a { color: #b3c1d3; }
.menu-ogeler a.etkin, .menu-ogeler .menu-altogeler a.etkin {
  background: var(--menu-secili); color: #fff; font-weight: var(--fw-orta);
  box-shadow: inset 3px 0 0 #6ba4ff;
}
/* Üst çubuk beyaz kalır ama artık altında GERÇEK bir çizgi var: koyu menüyle
   birlikte "kabuk" tek parça okunur. */
.ust-cubuk { box-shadow: inset 0 -1px 0 var(--kenar), 0 1px 2px rgba(34, 53, 72, .06); }
/* Panel kartındaki menü kopyası AÇIK zeminde kalır (o bir içerik kartı). */
.panel-menu .panel-altbaslik { color: var(--metin-soluk); }

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 7b — BANT RİTMİ ve DÜĞME HİYERARŞİSİ (16.09.2026)
   ⚠⚠ KULLANICI GERİ BİLDİRİMİ: "Ekran karmaşık ve dağınık, odaklanma sorunu
      yaşatıyor… tablo ve bilgiler arası aralıkların daha fazla olduğu,
      butonların daha göze hitap ettiği bir düzen olmalı."
      TEŞHİS: Girus Satış Siparişleri'nde ÜST ÜSTE BEŞ BANT var — özet
      kartları · özet tablosu · açıklama paragrafı · süzgeç hapları · düğme
      satırı. Hepsi 8 px arayla ve AYNI görsel ağırlıkta. Sıkışıklık sorun
      değil; GRUPLANMAMA sorun. Satırlar sıkı kalır, BANTLAR ayrılır.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── 1. Bant ritmi: içeride sıkı, bantlar arası nefes ─────────────────── */
.ozet-satiri { margin-bottom: var(--b3); }
.ozet-tablo { margin: 0 0 var(--b2); }
/* Özet altındaki açıklama: okunur ama SESSİZ, ve bandı kapatır. */
.ozet-tablo + .yardim, .ozet-satiri + .yardim {
  max-width: 96ch; line-height: 1.45; color: var(--metin-soluk);
  margin: 0 0 var(--b6) !important;   /* şablonlarda satır içi margin var */
}
/* Araç çubuğu bandı ile tablo arası net boşluk. */
.girus-serit { margin-bottom: var(--b5); }
.hizli-seridi, .toplu-serit { margin-bottom: var(--b4); }
.suzgec-kart { margin-bottom: var(--b4); }

/* ── 2. Süzgeç çubuğu tek bir yüzey olur ──────────────────────────────
   Dağınıklığın yarısı, aynı satırda beş farklı kutu biçimi olmasıydı. */
.girus-serit {
  padding: var(--b3); border-radius: var(--r-kart);
  background: var(--kart); border: 1px solid var(--kenar);
  gap: var(--b2) var(--b3);
}
.girus-serit :is(.ms-toggle, select, .ara-kutu) {
  border-radius: var(--r-alan); border-color: var(--kenar-dugme);
  font-size: var(--fs-sm); padding: 0 var(--b3);
}
.ms-toggle { border-radius: var(--r-alan); padding: 0 var(--b3);
             font-size: var(--fs-sm); }
/* İkonlar bilgi taşımıyor, yalnız yer işareti — gözü çalmasınlar. */
.girus-serit .ms-toggle::first-letter { opacity: .65; }
.girus-serit .sayac { font-size: var(--fs-xs); color: var(--metin-soluk); }

/* ── 3. Düğme hiyerarşisi: sayfada TEK dolu mavi ──────────────────────── */
.girus-serit .dugme { height: var(--kutu-h); font-size: var(--fs-sm);
                      padding: 0 var(--b4); }
.girus-serit .dugme.birincil { font-weight: var(--fw-kalin); padding: 0 var(--b5); }
/* "Sıfırla" yıkıcı değil, sessiz olsun. */
.girus-serit a.dugme[title="Mevcut yıla dön"] {
  background: transparent; border-color: transparent; color: var(--metin-soluk);
}
.girus-serit a.dugme[title="Mevcut yıla dön"]:hover {
  background: var(--uzerinde); color: var(--metin); }
/* Görünüm anahtarı gerçekten TEK PARÇA görünsün. */
.gorunum-secici { border: 1px solid var(--kenar-dugme); border-radius: var(--r-alan);
                  overflow: hidden; background: var(--kart); }
.gorunum-secici :is(a.dugme, button) { border: 0; border-radius: 0;
                                       margin-left: 0; background: transparent; }
.gorunum-secici :is(a.dugme, button) + :is(a.dugme, button) {
  box-shadow: inset 1px 0 0 var(--kenar-dugme); }
.gorunum-secici :is(a.dugme, button).secili {
  background: var(--vurgu-acik); color: var(--vurgu-koyu);
  font-weight: var(--fw-orta); }

/* ── 4. Tablo bandı: başlığı gövdeden net ayır ────────────────────────── */
.tablo-sarmal { border-color: var(--kenar); }
table.liste thead th { box-shadow: inset 0 -2px 0 var(--kenar-baslik); }
/* Rozet/etiket gürültüsü: tablo içindeki rozetler soluk zemin, koyu yazı. */
table.liste .rozet { font-weight: var(--fw-orta); }

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 4e — GENİŞ TABLO: KIRPILAN METİN + SABİT İŞLEM (16.09.2026)
   ⚠⚠ Ölçüm: Girus "Ürünleri Göster" tablosu 13 sütun, 1787 px içerik, 1174 px
      kap → 613 px taşma; "Sipariş / PB / İşlem" ekrandan düşüyordu.
      13 sütunu 1174 px'e SIĞDIRMAK okunabilirliği öldürürdü (ürün adı 300 →
      110 px). Onun yerine:
        · üç geniş metin sütunu kırpılır (tamamı `title` ile görünür),
        · "İşlem" sütunu SAĞA SABİTLENİR — yatay kaydırsanız bile düğme yerinde.
      Kullanıcı kuralı korunur: satır sonu düğmesine ulaşmak için kaydırmak
      GEREKMEZ.
   ══════════════════════════════════════════════════════════════════════════ */
table.liste.genis :is(th, td):nth-child(1) { max-width: 150px; }
table.liste.genis :is(th, td):nth-child(2) { max-width: 230px; }
table.liste.genis :is(th, td):nth-child(3) { max-width: 190px; }
table.liste.genis td:nth-child(-n+3) {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* ── Sağa sabit "İşlem" sütunu ────────────────────────────────────────
   ⚠ Zemin OPAK olmalı: saydam olursa altından kayan hücreler görünür.
     Satır vurgusu ve seçili satır renkleri ayrıca eşlenir. */
table.liste.genis :is(th, td):last-child {
  position: sticky; right: 0; z-index: 3;
  background: var(--kart);
  box-shadow: inset 1px 0 0 var(--kenar);
}
table.liste.genis thead th:last-child { z-index: 6; }
table.liste.genis tbody tr:hover > td:last-child { background: var(--uzerinde); }
table.liste.genis tbody tr:is(.secili-satir, .secili) > td:last-child {
  background: var(--vurgu-acik); }

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 12 — MUHASEBE EKRANLARI (16.09.2026)
   Şablona `<style>` yazılmaz; muhasebe ekranlarında satır içi ölçülerle
   duran kurallar buraya taşındı. Beş kural:
     1. Beyanname KDV karar satırı (liste içinde, satır ALTINDA)
     2. "👁 N" çok dosya düğmesi — eski ERP'nin sarı uyarı rengi
     3. KDV özetinde satırın TIKLANABİLİR olduğu görünsün
     4. Fiş formu: sol form + sağda yapışkan önizleme
     5. Malzeme Dışı: açıklama DIŞINDAKİ sütunlar içeriğe göre daralsın
   ══════════════════════════════════════════════════════════════════════════ */

/* 1 ── Beyanname KDV kararı ────────────────────────────────────────────────
   ⚠⚠ KARAR LİSTEDE SORULUR: belge detayına girmeden görünmeseydi, karar
      bekleyen kayıtta EN YÜKSEK tutar sessizce toplama girmeye devam eder,
      kullanıcı farkı ancak KDV özeti tutmayınca anlardı.
   ⚠ Renk ŞABLONA YAZILMAZ: satır içi `border-left` bildirimi buradaki
     `border-left-color`u ezerdi (satır içi stil daha önceliklidir) ve karar
     verilmiş satır hep sarı kalırdı. */
tr.kdv-karar-satiri > td { background: var(--uyari-zemin, #fff8e1);
                           border-left: 4px solid #f0c36d;
                           padding: var(--b3, 8px) var(--b4, 12px); }
tr.kdv-karar-satiri.verildi > td { background: #f2f9f9;
                                   border-left-color: #048A81; }

/* 2 ── "👁 N" çok dosya düğmesi (eski ERP masraf.html:1180-1184) ──────────
   ⚠ İthalat kaydında ikinci beyanname ekranda hiç görünmüyordu; düğme
     "burada BİRDEN ÇOK dosya var" diye kendini belli etmeli. */
.dugme.cok-dosya { border-color: #f0c36d; color: #8a5a00; }

/* 3 ── KDV özetinde satır tıklanabilir ───────────────────────────────────── */
#kdvTablosu tr.kdv-satir:hover { background: var(--satir-vurgu, var(--uzerinde)); }

/* 4 ── Fiş formu düzeni: sol form, sağda YAPIŞKAN önizleme ────────────────
   ⚠ `minmax(0,1fr)`: `1fr` tek başına taşan tabloyu daraltmaz, ızgara
     hücresinin en küçük genişliği içeriğidir — uzun açıklamalı fiş sayfayı
     yatay kaydırtıyordu. */
.fis-duzen { display: grid;
             grid-template-columns: minmax(0, 1fr) minmax(0, 400px);
             gap: var(--b4); align-items: start; }
.fis-onizleme { position: sticky; top: 12px; }

/* 5 ── Malzeme Dışı: açıklama dışındaki sütunlar içeriğe göre daralsın ───── */
table.liste td .dar-sutun { white-space: nowrap; }

/* ══ KATMAN 2026.09 · ALACAK POPUP (17.09.2026) ══ */
/* Alacak Yönetimi → "Müşteri Bazında Borç": "Toplam Borç" / "Vadesi Geçmiş"
   tutarına tıklayınca açılan fatura penceresi (`alacak_detay.js`,
   `girus/_alacak_detay.html`).
   ⚠ `.pencere-govde` KULLANILMAZ: o sınıf `white-space: pre-wrap` taşır ve
     sunucudan gelen HTML parçasının satır sonlarını boşluk olarak basardı.
   ⚠ `dialog.pencere` 640 px'e sınırlı; yedi sütunlu fatura tablosu sığmıyor.
     Genişlik ekran kadar, telefonda 16 px kenar payıyla daralır.
   ⚠ `.tablo-sarmal` kullanılmaz: `tablo_yuksekligi.js` sayfa yüklenirken
     ölçer, sonradan gelen parçaya yanlış yükseklik kalırdı. */
dialog.pencere.alacak-detay-pencere {
  width: min(980px, calc(100vw - 32px));
  min-width: 0;
  max-width: none;
}
.alacak-detay-govde { padding-top: var(--b3, 8px); }
.alacak-detay-govde .alacak-detay-kaydirma { overflow-x: auto; }
.alacak-detay-govde .alacak-detay-ozet { margin-top: var(--b4, 12px); }
.alacak-detay-govde table.liste td { white-space: nowrap; }
/* Vadesi geçmiş fatura satırı KIRMIZI (listedeki "Vade aşımı" rozetiyle aynı renk). */
.alacak-detay-govde tr.alacak-gecikmis > td { color: var(--olumsuz); }
/* Tıklanabilir tutar: düğme değil (sayfada tek dolu mavi kuralı), kesik alt çizgi. */
a.alacak-detay-bag { color: inherit; text-decoration: none; cursor: pointer;
                     border-bottom: 1px dashed currentColor; }
a.alacak-detay-bag:hover, a.alacak-detay-bag:focus-visible { color: var(--vurgu, inherit); }

/* ══ KATMAN 2026.09 · CARI KISILERI (17.09.2026) ══ */
/* Cari kartı → İlgili kişiler ("+ Kişi ekle") satırı ve hatırlatma alıcı kutusu
   (`templates/cariler/_kisi_seti.html`, `_kisi_satiri.html`,
   `templates/girus/hatirlatma_onizleme.html`).
   ⚠⚠ MAIL LİSTESİ AÇILIR KUTUSU AKIŞTA AÇILIR. Genel `.coklu-liste` MUTLAK
      konumludur; `.tablo-sarmal { overflow: auto }` onu kabın içinde KIRPAR
      ve iç kaydırma çubuğu açardı. Satır açılınca yükselir, kapanınca döner.
   ⚠ Kutu yazısı seçili listelerin adıdır; uzunsa üç noktayla kısalır, tamamı
     kutu açılınca görünür. */
.kisi-seti td { vertical-align: top; }
.kisi-seti .liste-secici { min-width: 170px; max-width: 240px; }
.kisi-seti .liste-secici > summary { overflow: hidden; }
.kisi-seti .liste-secici .liste-ozeti { overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; min-width: 0; }
.kisi-seti .liste-secici .coklu-liste { position: static; box-shadow: none;
  min-width: 0; max-height: none; margin-top: 4px; padding: 4px 8px; }
.kisi-seti .liste-secici .onay-kutusu { height: auto; margin: 2px 0;
  white-space: nowrap; }
/* ⚠ Pasif kişi soluk ama DÜZENLENEBİLİR: Aktif kutusu işaretlenince canlanır. */
.kisi-seti tr.soluk-satir:focus-within { opacity: 1; }
.kisi-seti .bos-hucre { text-align: center; color: var(--metin-soluk); height: 56px; }
.kisi-seti-yardim { margin: 8px 0 0; }
/* Hatırlatma önizlemesi: alıcı kutusu geniş, gönder düğmesi yanında. */
.hatirlatma-alici .hatirlatma-gonder { display: flex; flex-wrap: wrap;
  align-items: flex-end; gap: var(--b3, 8px); margin-top: var(--b3, 8px); }
.hatirlatma-alici .hatirlatma-gonder .alan { flex: 1 1 420px; min-width: 0; }
.hatirlatma-alici .hatirlatma-gonder input[type=text] { width: 100%; }
.hatirlatma-alici .hatirlatma-gonder .form-eylemler { margin: 0; }

/* ══ KATMAN 2026.09 · CARI KISILERI (17.09.2026) ══ */
/* İnceleme düzeltmeleri — mail listesi seçicisi iki başlık altında
   (`templates/cariler/_kisi_satiri.html`, `kisi_form.html`).
   ⚠⚠ "Mail listeleri" (Borç Yazısı / Teklif / Mutabakat) ile "Diğer konular —
      otomatik gönderimde kullanılmaz" ayrı başlıklarda: canlıda "Ödeme
      Hatırlatma" Borç Yazısı'nın yanında duruyor ve karıştırılıyordu.
   ⚠ Başlık seçilemez metin; kutu satırlarından küçük ve soluk. Bağlı gönderim
     ekranı olmayan listenin notu (`.liste-notu`) satırı yükseltmez. */
.liste-grup-basligi { margin: 6px 0 2px; font-size: 11px; font-weight: 600;
  color: var(--metin-soluk); text-transform: none; white-space: nowrap; }
.liste-grup-basligi:first-child { margin-top: 0; }
.liste-notu { font-size: 11px; white-space: nowrap; }
.liste-gruplari { display: flex; flex-direction: column; align-items: flex-start;
  gap: 2px; }
.liste-gruplari .onay-kutusu { height: auto; }

/* ══ KATMAN 2026.09 · ALACAK MAIL LISTESI ══ */
/* Alacak Yönetimi → sayfa başındaki "Gönderilecek Mail listesi" çoklu seçimi
   ve "Müşteri Bazında Borç" e-posta hücresindeki alıcı satırları
   (`templates/girus/alacak_liste.html`, `hatirlatma_onizleme.html`;
   kullanıcı isteği 16.09.2026).
   ⚠ Seçici tek satırlık bir araç bandıdır; özet kartlarının ÜSTÜNDE durur ve
     onlardan bant aralığıyla (Faz 7b ritmi: 16 px, `--b5`) ayrılır. Özet
     kartı yapısına dokunulmaz. Yardım metni kısa; uzun açıklama `title`da.
   ⚠ "Uygula" ikincil düğmedir — dolu mavi EKLEMEZ. (Sayfadaki mevcut dolu
     maviler — Güncelle, Filtrele, E-postaları Kaydet — bu bloktan önce de
     vardı; "sayfada tek dolu mavi" bu ekranda henüz sağlanmıyor.)
   ⚠ Alıcı satırı KIRPILMAZ, sarar: adresler kısaltılırsa postanın kime
     gideceği görünmez (görsel yoğunluk kuralı: açıklama hücresi kırpılmaz).
   ⚠⚠ KOMPAKT: hücre yalnız "→"/uyarı satırı VARKEN yükselir (`:has`);
      yalnız kart adresine giden satır eski 26/32 px satır yüksekliğinde
      kalır (inceleme ölçümü: her satıra ikinci satır 13 → 6 görünür satır). */
.mail-listesi-secici {
  display: flex; align-items: center; flex-wrap: wrap;
  gap: var(--b1) var(--b4);
  min-height: var(--h-arac);
  margin: 0 0 var(--b5); padding: var(--b1) var(--b3);
  background: var(--kart); border: 1px solid var(--kenar);
  border-radius: var(--r-kart);
}
.mail-listesi-secici .secici-baslik { font-size: var(--fs-sm);
  font-weight: var(--fw-orta); color: var(--metin); white-space: nowrap; }
.mail-listesi-secici .onay-kutusu { height: auto; gap: 6px; white-space: nowrap;
  font-size: var(--fs-sm); }
.mail-listesi-secici .dugme { height: var(--kutu-h-mini); }
.mail-listesi-secici .yardim { flex: 1 1 320px; min-width: 0; margin: 0;
  font-size: var(--fs-xs); line-height: 1.4; color: var(--metin-soluk); }
table.liste tbody td.alacak-alici-hucre { min-width: 260px; max-width: 420px; }
table.liste tbody td.alacak-alici-hucre:has(> .yardim) { vertical-align: top;
  height: auto; padding-top: 2px; padding-bottom: 2px; }
.alacak-alici-hucre > .yardim { margin-top: 2px; white-space: normal;
  line-height: 1.4; overflow-wrap: anywhere; }
.alacak-alici-hucre > .rozet { margin-left: var(--b2); vertical-align: middle; }
.hatirlatma-alici .hatirlatma-listeler { margin-bottom: var(--b2); }
/* Uygulanmamış seçim işareti (`mail_listesi_secici.js`); `.rozet`in
   inline-block'u `hidden` özniteliğini ezmesin. */
.mail-listesi-secici .uygulanmadi[hidden] { display: none; }
.mail-listesi-secici .uygulanmadi { white-space: nowrap; }
/* Önizleme: gönderim anında pasif kişi adresi → açık onay satırı. */
.hatirlatma-alici .hatirlatma-gonder .pasif-onay { flex: 1 1 100%; height: auto;
  font-size: var(--fs-sm); }


/* ══ KATMAN 2026.09 · PO ÇIKTI EKRANI — OKUNUR FORM (17.09.2026) ══
   Kullanıcı kuralı: "PO'yu açınca direkt editable modda açma. Değiştir
   butonu ekle… kaydet diyince yine salt okunura dönsün."
   ⚠ Alanlar okunurken de EKRANDA DURUR (değerler görünür), yalnız kutu
     çerçevesi kaybolur: `disabled` gri metin okunaksızdı. Kutuyu tamamen
     gizleseydik kaydedilmiş bilgi görünmez olurdu.
   ⚠ Açılır listenin oku okunurda gizlenir; tıklanabilir izlenimi vermesin. */
.okunur-form :is(input, select, textarea) {
  background: transparent !important; border-color: transparent !important;
  color: var(--metin) !important; -webkit-text-fill-color: var(--metin);
  opacity: 1; box-shadow: none !important; cursor: default; padding-left: 0;
  -webkit-appearance: none; -moz-appearance: none; appearance: none;
  resize: none; }
.okunur-form textarea { overflow: auto; }
.okunur-form :is(input, select, textarea)::placeholder { color: transparent; }


/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 13 — DÜĞME GÖRÜNÜRLÜĞÜ, SÜZGEÇ LİSTESİ, İŞLEM SÜTUNU
   (18.09.2026 kullanıcı istekleri)
     2) "Kaymış butonları veya tabloları düzelt"
     3) "Sistemdeki butonları bir tık büyült ve biraz daha görünür yap"
     4) "Tüm filtrelerdeki dropdown menülerdeki satır arası boşlukları daralt"
   ⚠ KOMPAKT TABLO KURALI BOZULMAZ: satır içi düğme 24 → 26 px (2 px), yazı
     12 → 13 px. Satır yüksekliği bundan etkilenmez (26 px satır, 26 px düğme).
   ══════════════════════════════════════════════════════════════════════════ */

/* ── 3) Düğmeler bir tık büyük ve daha görünür ──────────────────────────── */
/* ⚠⚠ YALNIZ GENİŞ EKRAN: dar ekranda (≤900 px) dokunma hedefi zaten DAHA
   BÜYÜKTÜR (--kutu-h-kucuk 32, --kutu-h-mini 28). Koşulsuz yazsaydık bu
   katman sonra geldiği için telefonda düğmeleri KÜÇÜLTÜRDÜ. */
@media (min-width: 901px) {
  /* ⚠ `--kutu-h` süzgeç kutularını DA büyütür: yalnız düğmeyi büyütseydik
     süzgeç çubuğunda 36 px düğme ile 34 px kutu yan yana düşer, satır
     tırtıklı görünürdü. */
  :root { --kutu-h: 36px; --kutu-h-kucuk: 30px; --kutu-h-mini: 26px; }
}

/* ⚠ Düğme ÇERÇEVESİ zeminden ayrılsın: eski `--kenar` çok soluktu, düğme
   satır arasında kayboluyordu. Gölge 1 px — SAP/Fluent düzeyinde, gürültüsüz. */
.dugme {
  border-color: #c3cedb;
  box-shadow: 0 1px 1px rgba(34, 53, 72, .07);
}
.dugme:hover { border-color: var(--vurgu); background: #f4f8fd; }
.dugme.birincil, .dugme.tehlike { box-shadow: 0 1px 2px rgba(34, 53, 72, .18); }

/* Tablo içindeki düğmeler: 26 px, 13 px yazı, koyu etiket.
   ⚠ DOLGU 6 px'te KALIR: 8 px yapınca kalabalık tablolar 20-60 px daha taştı
     (ölçüm 18.09.2026: gümrük 111 → 175 px). Yükseklik ve yazı boyu düğmeyi
     zaten belirgin yapıyor; genişlik satır sığmasını bozuyor. */
table.liste .dugme.kucuk {
  height: var(--kutu-h-mini); padding: 0 6px;
  font-size: var(--fs-sm); font-weight: 600;
}
/* ⚠⚠ 14 SÜTUNLU MUHASEBE TABLOSU DAR KALMALI: düğme 8 px dolguyla
   basılınca tablo taştı ve "Muhasebe" başlığı kesildi (ölçüldü 18.09.2026).
   Bu ekran ailesinde dolgu 5 px, simge düğmesi 24 px. */
#belgeTablosu td.islem-hucre .dugme.kucuk { padding: 0 5px; }
#belgeTablosu td.islem-hucre .dugme.kucuk.simge-dugme,
#belgeTablosu td.islem-hucre .dugme-yeri { width: 22px; min-width: 22px; padding: 0; }
#belgeTablosu td.islem-hucre > * + * { margin-left: 2px; }

/* ── 2) İşlem sütunu: düğmeler satırdan satıra AYNI yerde ───────────────── */
/* ⚠⚠ Kök neden: 📄 ve ↩ düğmeleri koşulluydu; olmayan satırda hiç
   basılmayınca kalan düğmeler kayıyordu. Şablon artık boş yer bırakıyor
   (`.dugme-yeri`); burada o yerin genişliği düğmeyle EŞİTLENİR. */
.dugme-yeri, table.liste .dugme.kucuk.simge-dugme {
  display: inline-block; width: 28px; min-width: 28px;
}
table.liste .dugme.kucuk.simge-dugme {
  display: inline-flex; justify-content: center; padding: 0;
}
.dugme-yeri { height: var(--kutu-h-mini); vertical-align: middle; }
/* İşlem hücresi sağa yaslı kalır; düğmeler arası boşluk sabit. */
table.liste td.islem-hucre { white-space: nowrap; text-align: right; }
table.liste td.islem-hucre > * + * { margin-left: 3px; }

/* ── 4) Süzgeç açılır listeleri: satır arası dar ────────────────────────── */
/* ⚠ `.onay-kutusu` genel yüksekliği 36 px'dir (form içi dokunma hedefi);
   süzgeç listesinde 30 satır yan yana gelince liste gereksiz uzuyordu.
   Burada YALNIZ açılır liste sıkılaşır, formlardaki onay kutuları değil. */
.coklu-liste .onay-kutusu {
  height: auto; min-height: 22px; margin: 0; padding: 1px 0;
  gap: 6px; line-height: 1.25;
}
.coklu-liste { padding: 6px 8px; }
.coklu-liste .onay-kutusu input[type=checkbox] { width: 14px; height: 14px; }
/* Liste içi arama kutusu da sıkışır ama tıklanabilir kalır. */
.coklu-liste input[type=search], .coklu-liste input[type=text] {
  height: 26px; font-size: var(--fs-sm); margin-bottom: 4px;
}

/* ⚠⚠ ASIL SÜZGEÇ KUTUSU `.ms-panel`'DİR (Girus ekranlarındaki "Ürün Grubu",
   "Cari", "Yıl"…). Satır dolgusu 6+6 px + 13,6 px yazıyla her seçenek ~32 px
   yer kaplıyordu; 20 seçenekli listede panel ekranı dolduruyordu.
   Kullanıcı isteği 18.09.2026: "satır arası boşlukları daralt".
   ⚠ Tıklama hedefi 22 px'in altına İNMEZ — liste okunur ve tıklanabilir kalır. */
.ms-panel label {
  padding: 2px 8px; font-size: var(--fs-sm); line-height: 1.3; min-height: 22px;
  gap: 6px;
}
.ms-panel label input[type=checkbox] { width: 14px; height: 14px; }
.ms-panel { padding: 6px; }
.ms-panel .ms-all { margin-top: 4px; padding-top: 6px; }
.ms-filter { padding: 4px 8px; margin-bottom: 4px; font-size: var(--fs-sm); }
.ms-panel .ms-yakin { margin-bottom: 4px; padding-bottom: 6px; }


/* ── Seçili satır şeridi (satir_secim.js) ───────────────────────────────────
   ⚠ Ekranın KENDİ sayacı varsa betik bu şeridi HİÇ eklemez (çift sayaç
     olmasın); şerit yalnız sayacı olmayan listelerde görünür. */
.secim-serit {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin: 0 0 8px; padding: 6px 12px;
  font-size: var(--fs-sm); color: var(--metin);
  background: var(--vurgu-acik); border: 1px solid var(--kenar);
  border-radius: 8px;
}
.secim-serit b { font-size: .95rem; color: var(--vurgu); }
.secim-ipucu { font-size: var(--fs-xs); color: var(--metin-soluk); margin-left: auto; }


/* ══ KATMAN 2026.09 · HATA SAYFALARI (400 / 403 / 404 / 500 · 18.09.2026) ══
   ⚠ Hata şablonları base.html'i GENİŞLETMEZ (hata anında menü/oturum bağlamı
     olmayabilir); bu yüzden kendi yalın yerleşimleri var. Stil dosyası hiç
     yüklenemese de sayfa düz metin olarak okunur kalır. */
.hata-govde { margin: 0; min-height: 100vh; display: flex; align-items: center;
  justify-content: center; background: var(--zemin, #f4f6f9);
  color: var(--metin, #16232f); padding: 24px 16px; }
/* ⚠ `font-family: inherit` YAZILMAZ: gövdenin kendi yazı tipini (Segoe UI…)
   ezip tarayıcının varsayılan serif'ine düşürüyordu (ilk denemede görüldü). */
.hata-sayfasi { width: min(560px, 100%); background: var(--kart, #fff);
  border: 1px solid var(--kenar, #dde3ea); border-radius: 12px;
  box-shadow: var(--golge, 0 1px 2px rgba(34,53,72,.08)); padding: 28px 32px; }
.hata-sayfasi h1 { font-size: 1.35rem; margin: 4px 0 10px; }
.hata-sayfasi p, .hata-sayfasi li { line-height: 1.55; }
.hata-sayfasi ul { padding-left: 20px; margin: 6px 0 12px; }
.hata-kodu { font-size: 2.6rem; font-weight: 700; letter-spacing: .02em;
  color: var(--vurgu, #1f5fd1); line-height: 1; }
.hata-eylemler { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 18px; }


/* ══ KATMAN 2026.09 · AÇILIŞ ÖZETİ — "Günün özeti" penceresi (18.09.2026) ══
   Girişte bir kez açılır: sevk edilecek müşteri siparişleri (kovalar) +
   alacak listesi. Kabuk base.html'de, içerik `girus/_acilis_ozeti.html`.
   ⚠ Genel `.pencere` 760 px'tir; bu pencere iki geniş tablo taşıdığı için
     1180 px'e kadar açılır, yükseklik ekranın %88'i, gövde kendi kayar. */
.pencere.acilis-pencere { width: min(1180px, 100%); max-height: 88vh; }
.acilis-govde { padding: 12px 20px 18px; }
.acilis-ust { margin-bottom: 8px; }
.acilis .bosluk { flex: 1; }
.acilis-bolum { margin-bottom: 18px; }
.acilis-bolum h3 { font-size: 1rem; margin: 6px 0 10px; color: var(--baslik, #16232f); }
.acilis-kova { border: 1px solid var(--kenar); border-left: 4px solid var(--vurgu);
  border-radius: 8px; padding: 8px 10px; margin-bottom: 10px; background: var(--kart, #fff); }
.acilis-kova.gecikmis { border-left-color: var(--olumsuz); background: #fffafa; }
.acilis-kova-bas { display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin-bottom: 6px; }
.acilis-toplam { font-weight: 700; font-variant-numeric: tabular-nums;
  background: var(--vurgu-acik); border-radius: 6px; padding: 1px 8px; }
.acilis-toplam.gecikmis, .acilis-gecikme { color: var(--olumsuz); }
.acilis-gecikme { font-size: var(--fs-xs); font-weight: 600; margin-left: 6px; }
.acilis-tablo { width: 100%; }
.acilis-tablo td { white-space: nowrap; }
.acilis-tablo td:first-child { white-space: normal; min-width: 180px; }
tr.acilis-detay > td { background: var(--zemin, #f6f8fa); padding: 6px 10px 10px; }
.acilis-kalem { width: 100%; background: var(--kart, #fff); }
tr.acilis-vadesi-gecmis td { background: #fff6f5; }
.acilis-bos, .acilis-not { padding: 4px 2px; }
.acilis-alt { display: flex; gap: 8px; align-items: center; flex-wrap: wrap;
  border-top: 1px solid var(--kenar); padding-top: 10px; }
/* Boş kova tek satır: "Bugün · sevk edilecek sipariş yok" — dört boş kutu
   pencerenin yarısını kaplıyordu (canlı veri 18.09.2026: dördü de boş). */
.acilis-kova.bos { padding: 5px 10px; margin-bottom: 6px; }
.acilis-kova.bos .acilis-kova-bas { margin-bottom: 0; }


/* ══ KATMAN 2026.09 · SÜTUN BAŞLIĞI SÜZGECİ — Excel mantığı (18.09.2026) ══
   Kullanıcı isteği: "harcamalar ve diğer fiş fatura ve ham faturalarda sütun
   başlıklarını filtrele". Başlığa tıkla → panel: sırala + değer listesi /
   aralık / metin. Süzme SUNUCUDA (arayuz/sutun_suzgeci.py), panel
   `baslik_suzgec.js`, şerit `arayuz/_sutun_suzgeci.html`.
   ⚠ Panel `body` altında `fixed`: tablo kabı `overflow`lu, içeride kırpılırdı.
   ⚠ Seçenek satırları SIKI (22 px) — kullanıcı kuralı 18.09.2026: "filtre
     açılır listelerinde satır araları çok geniş".
   ⚠ İşaret küçük (12 px): Harcamalar'da sütunlar dar, başlığı genişletmesin. */
table.liste thead th.ss-baslik { cursor: pointer; user-select: none; }
table.liste thead th.ss-baslik:hover,
table.liste thead th.ss-acik { background: var(--uzerinde); }
table.liste thead th.ss-baslik:focus-visible { outline: 2px solid var(--odak); outline-offset: -2px; }
th.ss-baslik .ss-isaret {
  display: inline-block; width: 12px; height: 12px; margin-left: 3px;
  line-height: 12px; text-align: center; vertical-align: middle;
  font-size: 9px; color: var(--metin-soluk); border-radius: 3px;
}
th.ss-baslik:hover .ss-isaret, th.ss-acik .ss-isaret { color: var(--vurgu-koyu); background: var(--vurgu-acik-2); }
/* Süzülen sütun: mavi yazı + dolu mavi işaret — tabloya bakınca görünsün. */
table.liste thead th.ss-etkin { color: var(--vurgu-koyu); background: var(--vurgu-acik); }
th.ss-etkin .ss-isaret, th.ss-etkin:hover .ss-isaret { background: var(--vurgu); color: #fff; }
th.ss-baslik .ss-sira { margin-left: 3px; font-size: 11px; color: var(--vurgu-koyu); }

.ss-panel {
  position: fixed; z-index: 1200; width: 290px; max-width: calc(100vw - 16px);
  display: flex; flex-direction: column; gap: 6px; padding: 8px;
  background: var(--kart); color: var(--metin); font-size: var(--fs-sm);
  border: 1px solid var(--kenar); border-radius: 8px; box-shadow: var(--golge-acilir);
}
.ss-bas { display: flex; align-items: center; gap: 6px; }
.ss-bas b { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ss-panel .ss-kapat {
  height: 22px; min-width: 22px; padding: 0 4px; border: 0; border-radius: var(--r-alan);
  background: none; color: var(--metin-soluk); cursor: pointer; font: inherit; line-height: 1;
}
.ss-panel .ss-kapat:hover { background: var(--uzerinde); color: var(--metin); }
.ss-sirala { display: flex; gap: 4px; padding-bottom: 6px; border-bottom: 1px solid var(--kenar-satir); }
.ss-sirala .dugme { flex: 1; justify-content: center; padding: 0 6px; }
.ss-panel input.ss-ara, .ss-panel input.ss-girdi {
  width: 100%; min-width: 0; height: var(--kutu-h); box-sizing: border-box;
  padding: 0 8px; font-size: var(--fs-sm);
}
.ss-liste {
  max-height: 264px; overflow-y: auto; padding: 2px 0;
  border: 1px solid var(--kenar-satir); border-radius: var(--r-alan);
}
.ss-panel label.ss-secenek {
  display: flex; align-items: center; gap: 6px; height: auto; min-height: 22px;
  margin: 0; padding: 1px 8px; cursor: pointer; line-height: 1.25;
  font-size: var(--fs-sm); font-weight: 400; color: var(--metin);
}
.ss-panel label.ss-secenek:hover { background: var(--uzerinde); }
.ss-panel label.ss-secenek input { flex: none; width: 14px; height: 14px; min-width: 0; margin: 0; }
.ss-panel label.ss-hepsi { font-weight: var(--fw-orta); color: var(--vurgu-koyu); padding-left: 9px; }
.ss-yazi { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.ss-sayi { flex: none; font-size: var(--fs-xs); color: var(--metin-soluk); font-variant-numeric: tabular-nums; }
.ss-bilgi { padding: 6px 8px; font-size: var(--fs-xs); color: var(--metin-soluk); }
.ss-bilgi.hata { color: var(--olumsuz); }
.ss-etiket { display: block; font-size: var(--fs-xs); color: var(--metin-soluk); }
.ss-aralik { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.ss-uc { display: flex; flex-direction: column; gap: 2px; margin: 0; height: auto; }
.ss-alt { display: flex; justify-content: flex-end; gap: 6px; padding-top: 6px;
  border-top: 1px solid var(--kenar-satir); }

/* Etkin sütun süzgeçleri şeridi — her süzgeç kendi ✕'iyle kalkar. */
.suz-serit.ss-serit { display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
  margin: 0 0 var(--b3); max-width: none; }
.ss-cip { display: inline-flex; align-items: center; gap: 4px; height: 24px;
  padding: 0 2px 0 8px; font-size: var(--fs-xs); background: var(--kart);
  border: 1px solid var(--bilgi-kenar); border-radius: var(--r-alan); }
.ss-cip a { display: inline-flex; align-items: center; justify-content: center;
  width: 20px; height: 20px; border-radius: var(--r-alan);
  color: var(--metin-soluk); text-decoration: none; }
.ss-cip a:hover { background: var(--olumsuz-zemin); color: var(--olumsuz); }
.suz-serit.ss-serit .suz-temizle { margin-left: 4px; }


/* ══ KATMAN 2026.09 · FİRMA KURALLARI — "içinde geçiyorsa uygula" (18.09.2026) ══
   Muhasebe → Tanımlar → Firma Kuralları. Üstte açıklama + "▶ Kuralları şimdi
   uygula", altta veriden çıkarılan öneriler (eklenmeden uygulanmaz). */
.kural-bilgi .kart-govde p { margin: 0 0 6px; max-width: 110ch; }
.kural-bilgi ul { margin: 0 0 10px; padding-left: 18px; max-width: 110ch; }
.kural-bilgi li { margin: 2px 0; }
.kural-uygula { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.kural-oneri { margin-top: var(--b4); }
.kural-deger { display: inline-block; margin: 1px 6px 1px 0; padding: 0 6px;
  background: var(--vurgu-acik); border-radius: var(--r-alan); font-size: var(--fs-xs); }
.kural-oneri td.kural-ornek { max-width: 320px; }
/* Öneri satırı: ➕ Ekle · ✎ Düzelt · Sil yan yana (formlar satır içi). */
.kural-oneri td.islem-hucre { white-space: nowrap; }
.kural-oneri .kural-oneri-form { display: inline; margin: 0; }
.kural-gizlenen { margin-top: var(--b3); }


/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · GIRUS EŞİTLEME (19.09.2026, eksik_girus.json)
   Eski ERP'nin satır rozetleri ve Ham Faturalar satır içi sınıflandırması.
   Şablonlar: girus/_fatura_satirlari.html, _ham_fatura_satirlari.html,
   ham_fatura_liste.html, _siparis_kalemleri.html.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Girus fatura satırı: Hareket Türü / Fatura Durumu rozet tonları ────────
   Eski ERP `girus_fatura_tur.html:292-313`: Kur Farkı mor (#7a5cc4),
   Gönderildi mavi, satınalma kategorileri İthalat Faturası #0d817d /
   İthalat Masrafı #a5621c / Diğer #667585. ERP1 rozet dili (açık zemin +
   koyu yazı) korunur; renk ailesi eskiyle aynıdır. */
.rozet.mor { background: #efe9fb; color: #5b3fa8; }
.rozet.mavi { background: #e6effc; color: #1f5fa6; }
.rozet.kat-ithalat-fatura { background: #e1f3f2; color: #0d817d; }
.rozet.kat-ithalat-masraf { background: #f8ece0; color: #a5621c; }
.rozet.kat-diger { background: #eef1f4; color: #667585; }

/* ── Geçersiz (iptal/red) fatura satırı ────────────────────────────────────
   ⚠ Listede DURUR ama hiçbir toplama girmez: eski ERP opacity .55 +
     tutarlar üstü çizili (çizgi şablonda satır içi). `soluk-satir` (.66)
     ile birlikte basılır; bu kural eski tonu verir. */
table.liste tr.soluk-satir.gecersiz-satir { opacity: .55; }

/* ── Eski Ham Faturalar ─────────────────────────────────────────────────── */
/* Okuma HATASI olan satır — eski ERP `#fdf3f2` zemini. */
table.liste tr.ham-hata > td { background: #fdf3f2; }
table.liste tr.ham-hata:hover > td { background: #fbe9e7; }

/* Satır içi Fatura Tipi / Durum açılır kutuları: 26 px satırı büyütmesin.
   ⚠ Genel `select` yüksekliği (--kutu-h 28) burada ezilir; kutu satırın
     içinde, tabloyu yükseltmemeli. */
table.liste select.sinif {
  height: 22px; padding: 0 4px; font-size: .72rem; max-width: 118px;
  border: 1px solid var(--kenar); border-radius: 4px; background: #fff;
}
/* ELLE sınıflandırılmış — sarı çizgi (eski ERP #c9a227): otomatik
   sınıflandırma bu kayda bir daha dokunmaz. */
table.liste select.sinif.elle { border-color: #c9a227; background: #fffdf2;
  box-shadow: inset 0 -2px 0 #c9a227; }
/* Satış toplamı DIŞI (tip≠Satış ya da durum∉Malzeme/Hizmet) — kırmızı yazı. */
table.liste select.sinif.disi { color: #8c2f28; }
table.liste select.sinif:disabled { opacity: 1; background: transparent;
  border-color: transparent; }
/* Açıklamadaki "sarı çerçeveli" örneği. */
.elle-ornek { border-bottom: 2px solid #c9a227; }
/* Kaydedilen satır kısa bir yeşil yanıp söner (eski ERP `.kaydedildi`). */
@keyframes girus-kaydedildi { from { background: #cdebd6; } to { background: transparent; } }
table.liste tr.kaydedildi > td { animation: girus-kaydedildi 1.1s ease-out; }
/* Okuma sürüyor şeridi — metin + Durdur tek satırda. */
.okuma-serit { display: flex; gap: 10px; align-items: center; flex-wrap: wrap;
  max-width: 120ch; }

/* ── Sipariş listesi: satır altına açılan kalem tablosu ─────────────────── */
/* Aranan kalem (eski ERP #fff8e1) — zemin şablonda da satır içi; hover'da
   nötr griye dönmesin diye hücreye de verilir. */
table.liste tr.aranan-kalem > td,
table.liste tr.aranan-kalem:hover > td { background: #fff8e1; }
.detay-acilim-bas b { color: var(--metin); }
.detay-acilim .ref-kod { color: #1f5fa6; }
.diger-kalem-serit { margin: 8px 0 0; display: flex; gap: 8px; align-items: center; }


/* ══ KATMAN 2026.09 · LOJİSTİK EŞİTLEME (19.09.2026) ══ */
/* 🏷️ Uygulama Seçenekleri çipi — eski ERP `chip-adet` (mavi). ⚠ `rozet notr`dan SONRA
   gelmeli (aynı özgüllük); × düğmesi şablonda satır içi stilli. */
.rozet.loj-secenek { background: #e9f1fb; color: #1f5fa6; }
.loj-secenekler .rozet.loj-secenek { font-size: var(--fs-sm); padding: 2px 9px; }


/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 14 — GÖRSEL BÜTÜNLÜK: OKUNUR SÜTUN, SAKİN TABLO (19.09.2026)
   ⚠⚠ KULLANICI İSTEĞİ: "Tüm sistemde filtreleri, tabloları kontrol et; tablo
      yazıları arası mesafe göz yormasın; tablo ve buton renkleri modern ama
      kurumsal, çalışmayı teşvik eden ama göz yormayan olsun; her sayfaya
      girince tek bakışta hâkim olayım. Bazı sütunlar gereksiz geniş, bazıları
      çok dar ve içindekiler okunmuyor."
   ÖLÇÜM (_erp1_denetim/gorsel_denetim.py, 91 sayfa, 1600 px):
      · 74 sütun gerçekten KIRPILIYOR — çoğu metin sütunu 300 px tavanında
        (Cari, Ünvan, Açıklama) ya da muhasebe belge tablosunda 132 px Firma.
      · "3. sütun 62 px" kuralı Tüm Belgeler'de TARİHİ, İthalat Faturaları'nda
        FATURA NO'yu kesiyordu (o ekranlarda 3. sütun Dönem değil).
      · CRM Kontaklar: şablonun `truncate-cell` (tek satır) kuralını FAZ 10'daki
        `white-space: normal` eziyordu → firma ve e-posta 3-4 satıra kırılıyor,
        e-posta harfin ortasından bölünüyordu.
      · Üst çubukta Güncelle düğmesi ile damgası ALT ALTA; 44 px çubuğa sığmıyor.
   İlkeler: satır içi sıkı, bantlar arası nefes (FAZ 7b) · sayılar ASLA
   kırpılmaz · metin tek satır, tamamı `title`da · geniş tabloda İşlem sağa
   sabit · zebra ÇOK hafif (satırı gözle izlemek için), vurgu yalnız seçili.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── 1. Üst çubuk: "✓ Son güncelleme … [🔄 Güncelle]" TEK SATIR ─────────── */
.girus-damgasi { flex-direction: row-reverse; align-items: center; gap: 8px; }
.girus-damgasi .damga { line-height: 1.2; }
/* ☰ geniş ekranda da görünür: menüyü gizler, içerik tüm genişliği alır
   (base.html; tercih `localStorage.erp1_menu_gizli`). */
@media (min-width: 901px) {
  .menu-dugmesi { display: inline-flex !important; }
  html.menu-gizli .yan-menu { display: none; }
  html.menu-gizli .icerik { margin-left: 0; }
}

/* ── 2. Tablo ritmi: sakin başlık, hafif zebra, net ayraç ─────────────── */
:root {
  --tablo-baslik-zemin: #f2f5f9;
  --tablo-baslik-metin: #34445a;
  --tablo-zebra: #f8fafc;
  --tablo-cizgi: #e7ebf0;
}
table.liste thead th { background: var(--tablo-baslik-zemin); color: var(--tablo-baslik-metin);
  letter-spacing: .01em; }
table.liste tbody td { border-bottom-color: var(--tablo-cizgi); }
/* ⚠ Zebra `:where()` ile SIFIR özgüllükte: hata / geçersiz / seçili satırın
   kendi zemini (sınıf seçicisi) her zaman kazanır. */
table.liste tbody tr:where(:nth-child(even)) { background: var(--tablo-zebra); }
table.liste tbody tr:hover { background: var(--uzerinde); }
.crm-icerik .table > tbody > tr:where(:nth-child(even)) > * { --bs-table-bg: var(--tablo-zebra); }
.crm-icerik .table > thead th { background: var(--tablo-baslik-zemin); color: var(--tablo-baslik-metin); }

/* ── 3. Sütun genişliği: metin tavanı 300 → 360 px ───────────────────── */
/* Ölçüm: Cari / Ünvan / Müşteri içeriği 380-640 px; 360 px, satış ve
   satınalma faturalarındaki unvanların %90'ını tam gösterir, tablo yine
   kabına sığar. Daha uzunu `title` ile görünür. */
table.liste tbody td { max-width: 360px; }

/* ── 4. Muhasebe belge tablosu (Harcamalar ve 13 kardeşi) ─────────────── */
/* ⚠ nth-child(3) YALNIZ Dönem sütunu olan ekranda dar olmalıydı; sütun
   sırası ekrana göre değişiyor. Kaldırıldı — Dönem zaten 7 karakter. */
#belgeTablosu :is(th, td):nth-child(3) { max-width: none; }
/* Firma 132 → 170 px (ölçüm: firma adlarının çoğu 150-260 px). Fiş adı da
   aynı sınıfı taşır ama dosya adıdır — 2. sütunda 120 px'e iner, yer açar. */
#belgeTablosu td.mh-firma-k { max-width: 170px; }
#belgeTablosu td.mh-firma-k:nth-child(2) { max-width: 120px; }
#belgeTablosu td.mh-belgeno { max-width: 120px; }
/* Salt okunur kategori / tip metni 80 px'de "Araç Giderl…" diye kesiliyordu. */
#belgeTablosu td.duzenlenebilir:not(.sag) .salt-okunur { max-width: 116px; }
/* İşlem sütunu SAĞA SABİT: 17 sütunlu tablo 1440-1600 px'de kabına sığmaz;
   düğmeler kaydırmadan görünür (kullanıcı kuralı), veri sütunları ezilmez. */
#belgeTablosu td.islem-hucre,
#belgeTablosu thead th:is(:has(+ th[data-ss="teslim"]:last-child), .sag:last-child) {
  position: sticky; right: 0; z-index: 3; background: var(--kart);
  box-shadow: inset 1px 0 0 var(--kenar);
}
#belgeTablosu thead th:is(:has(+ th[data-ss="teslim"]:last-child), .sag:last-child) {
  z-index: 6; background: var(--tablo-baslik-zemin); }
#belgeTablosu tbody tr:where(:nth-child(even)) > td.islem-hucre { background: var(--tablo-zebra); }
#belgeTablosu tbody tr:hover > td.islem-hucre { background: var(--uzerinde); }

/* ── 5. CRM listeleri: tek satır, okunur genişlik ─────────────────────── */
/* ⚠ FAZ 10'un `white-space: normal` kuralı şablonun tek satır kuralını
   eziyordu (özgüllük). Kırpılacak hücre tek satır kalır, genişliği ölçüme
   göre açılır: firma 160 → 280, kısa sütun 110 → 180. */
.crm-icerik table.table td:is(.truncate-cell, .truncate-cell-sm, .text-nowrap) {
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crm-icerik table.table td.truncate-cell { max-width: 280px; }
.crm-icerik table.table td.truncate-cell-sm { max-width: 180px; }
/* E-posta, telefon, tarih, tutar hiçbir CRM listesinde bölünmez. */
.crm-icerik table.table td :is(a[href^="mailto:"], a[href^="tel:"]) { white-space: nowrap; }
/* Satır sonu simge düğmeleri: renkli çerçeve yerine NÖTR; renk yalnız simgede. */
.crm-icerik table.table td .btn:is(.btn-outline-primary, .btn-outline-warning, .btn-outline-info,
  .btn-outline-secondary, .btn-outline-success) {
  background: var(--kart); border-color: var(--kenar-dugme); color: var(--metin-soluk); }
.crm-icerik table.table td .btn.btn-outline-danger {
  background: var(--kart); border-color: var(--kenar-dugme); color: var(--olumsuz); }
.crm-icerik table.table td .btn:hover { background: var(--uzerinde); color: var(--metin); }

/* ── 6. İkincil düğme: mavi yazı değil KOYU yazı ──────────────────────── */
/* Sayfada tek dolu mavi (FAZ 7b); ikincil düğmelerin hepsi mavi yazılı
   olunca göz neyin birincil olduğunu seçemiyordu. Mavi yalnız birincilde ve
   bağlantıda kalır. */
.dugme:not(.birincil):not(.tehlike):not(.olumlu):not(.secili):not(:disabled) {
  color: var(--metin); }
.dugme:not(.birincil):not(.tehlike):not(.olumlu):not(:disabled):hover {
  color: var(--vurgu-koyu); }

/* ── 7. Her listede İşlem sütunu sağa sabit ────────────────────────────── */
/* Genel liste (arayuz/liste.html) ve kendi tablosunu çizen ekranlar: son
   sütun `td.islem-hucre` ise taşma olduğunda düğmeler kaydırmadan görünür.
   Tablo kabına sığıyorsa `sticky` hiçbir şeyi değiştirmez. */
table.liste:has(tbody td.islem-hucre:last-child) :is(thead th, tbody td):last-child {
  position: sticky; right: 0; z-index: 3; background: var(--kart);
  box-shadow: inset 1px 0 0 var(--kenar); }
table.liste:has(tbody td.islem-hucre:last-child) thead th:last-child {
  z-index: 6; background: var(--tablo-baslik-zemin); }
table.liste:has(tbody td.islem-hucre:last-child) tbody tr:where(:nth-child(even)) > td:last-child {
  background: var(--tablo-zebra); }
table.liste:has(tbody td.islem-hucre:last-child) tbody tr:hover > td:last-child {
  background: var(--uzerinde); }

/* ── 8. CRM liste tabloları tek satır ──────────────────────────────────── */
/* Teklifler'de tarih, RFQ no, temsilci adı ve başlıklar İKİ satıra bölünüyor,
   her satır 40 px oluyordu (FAZ 10 `white-space: normal`). Liste tabloları
   tek satırdır. Tablo kabından taşarsa `table-responsive` yatay kaydırır. */
.crm-icerik table.table > thead th { white-space: nowrap; }
/* ⚠ Tedarikçiler (Sektörler, Ürün Grupları listeleri) ve İşlem Geçmişi
   (uzun açıklama) sarmaya devam eder — tek satırda tablo 800+ px taşıyordu. */
.crm-icerik :is(#contact-table, #rfq-table) > tbody > tr > td,
.crm-icerik table.table-hover:has(> tbody a[href*="/quotes/"]):not(:has(> tbody a[href*="/suppliers/"])) > tbody > tr > td {
  white-space: nowrap; }

/* ── 9. CRM `stat-card` (Satış paneli, müşteri kartı) ─────────────────── */
/* Sınıfın HİÇ CSS'i yoktu: sayı kutuları düz metin gibi alt alta
   görünüyordu. Özet kartıyla aynı yüzey; şablondaki `border-left-color`
   renk bayrağı olarak kalır. */
.crm-icerik .stat-card {
  background: var(--kart); border: 1px solid var(--kenar); border-left: 3px solid var(--vurgu);
  border-radius: var(--r-kart); padding: var(--b2) var(--b4); margin-bottom: var(--b3); }
.crm-icerik .stat-card .stat-value { font-size: var(--fs-xl); font-weight: var(--fw-kalin);
  line-height: 1.2; font-variant-numeric: tabular-nums; }
.crm-icerik .stat-card .stat-label { font-size: var(--fs-xs); color: var(--metin-soluk); }


/* ══ KATMAN 2026.09 · HATIRLATMA METNİ — önizleme kabı (22.09.2026) ══ */
/* ⚠ İkinci savunma hattı: hatırlatma gövdesi kullanıcının düzenlediği HTML'i
   ERP1 sayfasının İÇİNE basar. Temizleyici (`girus/hatirlatma_metni.temizle`)
   `position`/`transform`/eksi `margin`i zaten düşürür; kaçan bir yol olursa
   yazı Alıcılar / 📤 Gönder kutusunun ÜSTÜNE taşınmasın, kabın içinde kırpılsın.
   `auto`: dar ekranda geniş fatura tablosu kırpılmaz, yatay kayar. */
.hm-onizleme { overflow: auto; }


/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 15 — ALACAK YÖNETİMİ + RAPORLAR TEK SAYFA (22.09.2026)
   Kullanıcı isteği (Excel örneğiyle): "Raporlar Alacak yönetimi ekranındaki
   bilgiler ve yerleşim, format ekteki gibi olsun … Raporlar ve Alacak
   Yönetimini birleştir … tek bir sayfaya düşür." Şablon
   `templates/girus/alacak_liste.html`, davranış `alacak_yonetimi.js`.
   · Özet bandı: solda 2×2 kart (Toplam / Vadesi Geçmiş × TL / USD), sağda
     "Para Birimi | Alacak Toplamı" + küçük "Açıklama için tıklayınız".
     ⚠ Kart yapısı ÖZET STANDARDI'nın aynısı; yalnız yerleşim ızgara. Tablo
       kart satırının İÇİNE girmez (`test_ozet_standardi`).
   · Vadesi geçmiş etiketleri kırmızı (örnekte kırmızı yazı).
   · Müşteri tablosu İKİ KATLI başlık: döviz adı (colspan) + Toplam Borç /
     Vadesi Geçmiş Borç. İkinci sıra ilk sıranın yüksekliği kadar aşağıya
     yapışır (FAZ 2b ile aynı çözüm).
     ⚠⚠ FAZ 14 §7 "son sütun sağa sabit" kuralı İKİNCİ başlık sırasının son
        hücresini de (son dövizin "Vadesi Geçmiş Borç"u) sağa yapıştırıyor ve
        İşlem sütununun üstüne bindiriyordu → o hücrede `right: auto`.
   · "Bildirim" düğmesi `.dugme.kucuk`tan KÜÇÜK (`.dugme.mini`; kullanıcı:
     "Hatırlatma Gönder yerine Bildirim yaz butona ve daha küçük harfli
     olsun"). "⚠ Kişi giriniz" satır içi uyarı rozeti, bağlantıdır.
   · Sayfada tek dolu mavi: "✉ Seçililere Bildirim Gönder" (Filtrele ikincil).
   ══════════════════════════════════════════════════════════════════════════ */
.alacak-gonderen { margin: 0 0 var(--b3); font-size: var(--fs-xs); }
.alacak-gonderen code { font-size: inherit; }

/* ── Özet bandı ─────────────────────────────────────────────────────────── */
.alacak-ozet-bant { display: flex; flex-wrap: wrap; align-items: flex-start;
  gap: var(--b4) var(--b6); margin: 0 0 var(--b5); }
.alacak-ozet-bant > .ozet-satiri.alacak-kpi { display: grid; margin: 0;
  grid-template-columns: repeat(2, minmax(170px, 240px)); flex: 0 1 auto; }
.alacak-kpi .ozet-kart { min-width: 0; }
.alacak-kpi .ozet-kart .etiket.gecmis-etiket { color: var(--olumsuz); }
.alacak-ozet-bant > .ozet-tablo.alacak-pb-tablo { margin: 0; display: flex;
  flex-direction: column; align-items: flex-start; gap: var(--b2); }
.alacak-pb-tablo > table.liste { min-width: 240px; }
.alacak-kursuz { margin: calc(-1 * var(--b3)) 0 var(--b4); }

/* ── Küçük düğme: Bildirim · Açıklama için tıklayınız ───────────────────── */
/* ⚠ Yükseklik `--kutu-h-mini`den TÜRER, sabit px DEĞİL: dar ekranda (≤900 px)
   o değişken dokunma hedefi için büyür; sabit 20 px telefonda parmakla
   basılamayacak bir düğme bırakırdı. Küçülen yazıdır (11 px). */
.dugme.mini, table.liste .dugme.mini {
  height: calc(var(--kutu-h-mini) - 4px); padding: 0 6px; font-size: 11px;
  font-weight: 500; line-height: 1; gap: 4px; }

/* ── Açıklama penceresi (küçük) ─────────────────────────────────────────── */
dialog.pencere.alacak-aciklama-pencere { width: min(520px, calc(100vw - 32px));
  min-width: 0; max-width: none; }
.alacak-aciklama-govde { padding-top: var(--b3); font-size: var(--fs-sm);
  line-height: 1.55; }
.alacak-aciklama-govde p { margin: 0 0 var(--b3); }
.alacak-aciklama-govde p:last-child { margin-bottom: 0; }

/* ── Toplu çubuk ───────────────────────────────────────────────────────── */
.alacak-toplu input[type=email] { min-width: 200px; height: var(--kutu-h-kucuk); }
.alacak-toplu .dugme:disabled { opacity: .55; cursor: not-allowed; }

/* ── Müşteri tablosu ───────────────────────────────────────────────────── */
table.alacak-musteri-tablosu thead tr + tr th { top: var(--h-tablo-baslik); }
table.alacak-musteri-tablosu thead th.pb-baslik { text-align: center;
  box-shadow: inset 1px 0 0 var(--kenar), inset 0 -1px 0 var(--kenar-baslik); }
table.alacak-musteri-tablosu :is(th, td).pb-ilk {
  box-shadow: inset 1px 0 0 var(--tablo-cizgi); }
table.alacak-musteri-tablosu thead tr + tr th.pb-ilk {
  box-shadow: inset 1px 0 0 var(--kenar), inset 0 -1px 0 var(--kenar-baslik); }
table.alacak-musteri-tablosu thead th.iki-satir { white-space: normal;
  min-width: 76px; max-width: 96px; line-height: 1.2; }
table.alacak-musteri-tablosu th.sec-sutunu { width: 30px; }
/* ⚠ `z-index: 5` da ŞART (yerel ölçüm): FAZ 14 son başlık hücresine 6 verir;
   ikinci sıranın son hücresi DOM'da sonra geldiği için yatay kaydırmada sağa
   sabit "Bildirim" başlığının ÜSTÜNE çiziliyordu. */
table.liste.alacak-musteri-tablosu:has(tbody td.islem-hucre:last-child) thead tr + tr th:last-child {
  right: auto; z-index: 5; }
/* ⚠ SIĞDIRMA (yerel ölçüm 22.09.2026, 1440 px, 4 döviz): tablo kabından
   1637 px'e taşıyordu — "Vadesi Geçmiş Borç" başlığı döviz sütununu 124 px'e
   açıyor, cari adı kodla iki satıra kırılıyor (satır 50 px), sağa SABİT
   İşlem hücresinde yan yana üç rozet o sütunu 360 px yapıp tutarların
   üstüne biniyordu. İkinci başlık sırası iki satıra kırılır (ilk sıranın
   yüksekliği değişmez, yapışma payı aynı kalır); cari adı TEK satır (tam
   ad `title`da, kırpılan hücre ipucu `tablo_ipucu.js`); rozetler yalnız
   sorunlu satırda alt alta kırılır. */
table.alacak-musteri-tablosu thead tr + tr th { white-space: normal;
  line-height: 1.15; min-width: 64px; max-width: 84px; }
table.alacak-musteri-tablosu td.alacak-cari-hucre { white-space: nowrap;
  max-width: 300px; overflow: hidden; text-overflow: ellipsis; }
table.liste.alacak-musteri-tablosu td.islem-hucre { white-space: normal;
  max-width: 200px; }
table.alacak-musteri-tablosu td.islem-hucre .rozet { display: inline-block;
  margin: 1px var(--b2) 1px 0; white-space: nowrap; }
table.alacak-musteri-tablosu td.bos-hucre { text-align: center; height: 56px;
  color: var(--metin-soluk); }
table.liste .rozet.kisi-giriniz { text-decoration: none; cursor: pointer; }
table.liste .rozet.kisi-giriniz:hover { text-decoration: underline; }
/* Cari adı pencere açar: kesik alt çizgi ALACAK POPUP bloğunda
   (`a.alacak-detay-bag`); adın rengi gövde metni kalır. */
a.alacak-cari-bag { font-weight: var(--fw-orta); }

@media (max-width: 700px) {
  .alacak-ozet-bant > .ozet-satiri.alacak-kpi { width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .alacak-pb-tablo > table.liste { min-width: 0; }
}


/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 16 — HATIRLATMA METNİ: MÜŞTERİYE ÖZEL METİNLER (22.09.2026)
   Kullanıcı isteği: "Hatırlatma metni mevcut standart olsun … Yeni butonu
   olsun … hangi müşteriye gideceğini seçeceğimiz müşteri listesi olsun ve
   birden fazla müşteri seçebilelim." Şablon
   `templates/girus/hatirlatma_metni.html` (davranış satır içi betikte);
   Alacak Yönetimi'nde Bildirim yanındaki "özel" rozeti.
   · "📝 Metinler" tablosu İÇERİK GENİŞLİĞİNDE (kompakt); açık olan metnin
     satırı seçili-satır zemininde. Müşteriler hücresi kırpılır, tam liste
     `title`da.
   · Müşteri süzgeci ve formdaki "Müşteriler" seçimi Girus süzgeç kutusudur
     (`.ms-wrap`); formda kutu alanın genişliğine uyar, panel geniş açılır.
   · "özel" rozeti "Bildirim"den küçük: işlem sütununu genişletmez (FAZ 15
     sığdırma ölçüsü korunur).
   ══════════════════════════════════════════════════════════════════════════ */
.hm-metinler .kart-govde > .girus-serit { margin-bottom: var(--b3); }
.tablo-sarmal > table.liste.hm-metin-tablosu { width: auto; min-width: 0; }
table.liste.hm-metin-tablosu td { white-space: nowrap; }
table.liste.hm-metin-tablosu td.hm-musteriler { max-width: 360px;
  overflow: hidden; text-overflow: ellipsis; }
table.liste.hm-metin-tablosu tr.hm-simdiki > td { background: var(--vurgu-acik); }
.hm-musteri-satirlari { list-style: none; margin: 0 0 var(--b3); padding: 0;
  font-size: var(--fs-sm); }
.hm-musteri-satirlari li { margin: var(--b1) 0; }
.hm-durum { margin: -4px 0 10px; }
.hm-etiket-yardim { font-weight: 400; }
.hm-cari-secim > .ms-toggle { max-width: 100%; height: var(--kutu-h); }
.hm-cari-secim > .ms-panel { min-width: 320px;
  max-width: min(560px, calc(100vw - 32px)); }
.hm-cari-secili { margin-top: var(--b2); }
.hatirlatma-metin-adi { margin: var(--b1) 0 var(--b2); }
/* ⚠ Düğme + rozet TEK SATIR (`.bildirim-ozel`): işlem hücresi FAZ 15'te
   `white-space: normal`; rozet alta kırılınca satır 31 → 47 px oluyordu
   (yerel ölçüm). Sütun yalnız rozet kadar (~30 px) genişler. */
table.alacak-musteri-tablosu td.islem-hucre .bildirim-ozel { white-space: nowrap; }
table.alacak-musteri-tablosu td.islem-hucre .rozet.ozel-metin { font-size: 10px;
  line-height: 16px; padding: 0 4px; margin: 0 0 0 var(--b1);
  vertical-align: middle; }


/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 17 — İLGİLİ KİŞİ: HİTAP + ✉ MUHATAP (22.09.2026)
   Kullanıcı isteği: "Adı soyadı sütunundan sonra Hitap sütunu aç … Bey ve
   Hn. … İlgili kişilerde başa bir kutucuk … hangisi işaretliyse o müşteride
   hatırlatma giderken ona hitaben gidecek." Şablonlar
   `templates/cariler/_kisi_seti.html` / `_kisi_satiri.html` / `cari_detay.html`,
   İlgili Kişiler listesi (`muhatap_isareti`), Alacak Yönetimi'nde Bildirim
   yanındaki "muhatap yok" rozeti, önizlemedeki muhatap satırı.
   · ✉ sütunu yalnız kutu kadar (kompakt); Hitap kutusu üç seçenek kadar dar.
   · "muhatap yok" rozeti "özel" rozetiyle AYNI küçük ölçü: işlem sütunu
     FAZ 15 sığdırma ölçüsünü korur, `.bildirim-ozel` satırı tek satır kalır.
   ══════════════════════════════════════════════════════════════════════════ */
/* ✉ sütunu: kart düzenleme (`.kisi-seti`) ve kart detayı aynı dar ölçü. */
table.liste th.muhatap-sutunu, table.liste td.muhatap-hucre { width: 28px;
  padding-left: var(--b1); padding-right: var(--b1); }
/* Satırın onay kutuları (✉ · Aktif · Sil) form kutusunun ORTASINDA: hücre
   `vertical-align: top` (açılan mail listesi için); ölçüm 22.09.2026 — kutu
   32 px, onay kutusu 14 px; ✉ 6 px, Aktif/Sil 3 px'te duruyordu. */
.kisi-seti tr.kisi-satiri > td.orta > input[type="checkbox"] {
  margin: calc((var(--kutu-h-orta, 32px) - 14px) / 2) 3px 0; }
.kisi-seti select.hitap-secim { width: auto; min-width: 64px; max-width: 80px; }
.muhatap-isaret { color: var(--vurgu, inherit); font-weight: 600; cursor: help; }
table.alacak-musteri-tablosu td.islem-hucre .rozet.muhatap-yok { font-size: 10px;
  line-height: 16px; padding: 0 4px; margin: 0 0 0 var(--b1);
  vertical-align: middle; }
.hatirlatma-alici .hatirlatma-muhatap { margin: var(--b1) 0 var(--b2); }


/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 18 — ÇALIŞAN ÜCRETLERİ + SİGORTA GİDERLERİ (22.09.2026)
   Kullanıcı isteği: "Fiş ve Faturalar menüsünün altında Çalışan Ücretleri
   alanı … yine aynı şekilde Fiş ve Faturaların altına Sigorta Giderleri
   alanı … her sigorta bilgisinin sonuna Gider Tipi seçeneği ekle."
   Ekranlar: `templates/muhasebe/calisan_ucreti_liste.html` /
   `sigorta_gideri_liste.html` / `calisan_ucreti_detay.html`.
   · Bordro tablosu 17 SÜTUNDUR: sayı hücreleri dar ve sağa dayalı, ad
     sütunu kırpılmaz (FAZ 4e kuralı zaten `.tablo-sarmal`ı kaydırıyor).
   · Gider Tipi açılır listesi hücreye sığar (kutu 28 px, FAZ 3 ölçüsü);
     "elle" rozeti satırı İKİNCİ SATIRA KIRMAZ — işlem sütunu ölçüsü bozulur.
   · Yükleme geçmişi <details>: kart başlığı tıklanabilir görünsün.
   ══════════════════════════════════════════════════════════════════════════ */
/* Bordro: para sütunları dar, ad ve dönem okunur kalsın. */
table.calisan-ucret-tablosu td.sag, table.calisan-ucret-tablosu th.sag {
  white-space: nowrap; }
table.calisan-ucret-tablosu th:nth-child(2), /* Dönem (seçim kutusundan sonra) */
table.calisan-ucret-tablosu td:nth-child(2) { white-space: nowrap; width: 84px; }
table.calisan-ucret-tablosu th:nth-child(3),
table.calisan-ucret-tablosu td:nth-child(3) { min-width: 180px; }

/* Sigorta Giderleri: fiş adı geniş, gün/günlük/tutar dar. */
table.sigorta-gider-tablosu th:nth-child(2),
table.sigorta-gider-tablosu td:nth-child(2) { min-width: 220px; }
table.sigorta-gider-tablosu td.sag, table.sigorta-gider-tablosu th.sag {
  white-space: nowrap; }
/* ⚠ Satır içi seçim: kutu hücreye sığar, rozet YANINDA kalır (alta kırılırsa
   satır 31 → 47 px olur; FAZ 15 ölçümü). */
table.sigorta-gider-tablosu td.duzenlenebilir { white-space: nowrap; }
table.sigorta-gider-tablosu select.gider-tipi-secim {
  height: var(--kutu-h-orta, 32px); max-width: 190px; width: auto;
  vertical-align: middle; }
table.sigorta-gider-tablosu td.duzenlenebilir > .rozet {
  font-size: 10px; line-height: 16px; padding: 0 4px;
  margin: 0 0 0 var(--b1); vertical-align: middle; }

/* Yükleme geçmişi — kapalı açılır kart. */
details.kart > summary.kart-basi { cursor: pointer; list-style: none; }
details.kart > summary.kart-basi::-webkit-details-marker { display: none; }
details.kart > summary.kart-basi::before { content: "▸ "; }
details.kart[open] > summary.kart-basi::before { content: "▾ "; }

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 19 — SİGORTA GİDERİ: SATIR İÇİ KUTU KAYBOLMASIN
   ⚠⚠ Genel kural `table.liste td.duzenlenebilir select[disabled]`e
      `display:none` verir (belge ekranında kutunun YANINDA `.salt-okunur`
      metni durduğu için). Bu ekranda yedek metin YOK: kaydederken kutu
      ekrandan siliniyor, satır zıplıyor ve yanıt asılı kalırsa bir daha
      gelmiyordu (inceleme 23.09.2026). Özgüllük (0,4,3) > (0,3,3).
   ══════════════════════════════════════════════════════════════════════════ */
table.sigorta-gider-tablosu td.duzenlenebilir select.gider-tipi-secim[disabled] {
  display: inline-block; opacity: .55; cursor: progress; }

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 20 — İKİ KADEMELİ YETKİ TABLOSU (22.09.2026)
   Kullanıcı isteği: "EN ALT DETAY MENÜYE KADAR yetkilendirme … DİNAMİK, hep
   güncel, TÜM ALT MENÜLER dâhil". Bölüm satırının altında o bölümün TÜM
   ekranları durur; blok katlanır, özel yetkisi olan bölüm göz çarpar.
   ⚠ Ekran satırı bölüm satırından AÇIKÇA ayrılmalı: yönetici hangi kutunun
     bölüme, hangisinin tek ekrana ait olduğunu bir bakışta görmeli — yanlış
     kutu canlı sistemde erişim kaybıdır.
   ══════════════════════════════════════════════════════════════════════════ */
table.yetki-tablosu tbody.yetki-bolum + tbody.yetki-bolum {
  border-top: 2px solid var(--kenar-baslik); }
table.yetki-tablosu tr.yetki-bolum-satiri > td { background: var(--notr-zemin); }
table.yetki-tablosu tr.yetki-ekran-satiri > td {
  background: var(--kart); border-top: 1px solid var(--kenar-satir); }
table.yetki-tablosu td.yetki-ekran-ad { padding-left: var(--b6); }

/* Katlama düğmesi — satır yüksekliğini büyütmez. */
button.yetki-katla {
  border: 1px solid var(--kenar-dugme); background: var(--kart);
  color: var(--metin-soluk); border-radius: var(--b2);
  width: 20px; height: 20px; line-height: 1; padding: 0;
  margin-right: var(--b2); cursor: pointer; }
button.yetki-katla:hover { background: var(--uzerinde); color: var(--metin); }

/* "12 ekranın 3 ünde özel yetki" — özel varsa vurgulu. */
.yetki-ozet { color: var(--metin-soluk); font-size: var(--fs-xs); }
.yetki-ozet.ozel-var { color: var(--vurgu-koyu); font-weight: 600; }

button.yetki-sifirla {
  border: 0; background: none; padding: 0; margin-top: var(--b1);
  color: var(--vurgu-koyu); font-size: var(--fs-xs);
  text-decoration: underline; cursor: pointer; display: block; }

/* Öncelik açıklaması — tablonun hemen üstünde, kaçırılmasın. */
.yetki-oncelik {
  border-left: 3px solid var(--bilgi); background: var(--bilgi-zemin);
  padding: var(--b2) var(--b3); margin: var(--b2) 0 var(--b3); }

/* ═══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 21 — YETKİ TABLOSU: KİLİTLİ YAPRAK SATIRI (23.09.2026)
   Yetki alanı ACIK / GIRISLI / YONETICI olan yapraklar KUTUSUZ basılır:
   `cekirdek.yetki.ekran_izni` o alanlarda ekran satırını HİÇ OKUMAZ, kutu
   işaretlense de yetki verilmiş olmazdı (sessiz yalan). Satır görünür kalır
   ki yönetici eksik sanıp aramasın; neden verilemediği yanında yazılıdır.
   ═══════════════════════════════════════════════════════════════════════════ */
table.yetki-tablosu tr.yetki-ekran-kilitli > td {
  background: var(--notr-zemin); color: var(--metin-soluk); }
table.yetki-tablosu tr.yetki-ekran-kilitli td.yetki-ekran-ad {
  font-style: italic; }

/* ══════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 22 — FİNANS FİŞİ ve BANKA EŞLEŞTİRMELERİ (22.09.2026)

   Kullanıcı isteği: "Muhasebe altına Finans Fişi alt menüsü aç … her satır
   sonunda Görüntüle, Değiştir, Sil … fişlerden sonra Banka Eşleştirmeleri."

   ⚠ Yeni CSS HEP DOSYANIN SONUNA, kendi katman bloğu olarak eklenir
     (feedback_erp1_ekran_dili): üstteki katmanlar okunur kalsın.
   ⚠ Şablona <style> YAZILMAZ — ekran testi işlenmemiş şablon kodu arar ve
     satır içi CSS'teki "...100%}" dizisi onu düşürür.
   ══════════════════════════════════════════════════════════════════════ */

/* Uyarı şeridi: kur yok / taslak fiş var / carisi eşleşmemiş banka fişi.
   ⚠ `.suz-serit` zemini kullanılır (bilgi rengi); kırmızı değil — bunlar
     engel değil, kullanıcının bilmesi gereken eksiklerdir. */
.finans-uyari { display: grid; gap: 2px; }

/* Form ekranındaki grup bandı (Ödeme · Fatura ve kur · Açıklama).
   ⚠ 15 alanın tek yığın hâlinde basılması, kullanıcının saydığı sırayı
     görünmez kılıyordu. */
.form-bant {
  margin: var(--b3, 14px) 0 var(--b2, 10px);
  padding-bottom: 4px;
  border-bottom: 1px solid var(--kenar);
  font-weight: 600;
  font-size: .82rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--metin-soluk);
}
.form-bant:first-child { margin-top: 0; }

/* Fiş tablosu: 16 sütun — para sütunları dar, açıklama kırpılmaz.
   ⚠ Görsel yoğunluk kuralı (feedback_gorsel_yogunluk): kompakt tablo, ama
     hücre içeriği gizlenmez (kırpılan metin `tablo_ipucu.js` ile ipucunda). */
table.finans-fis-tablosu td.tek-satir { white-space: nowrap; }
table.finans-fis-tablosu td .yardim { font-size: .72rem; }
table.finans-fis-tablosu td.islem-hucre { white-space: nowrap; }
table.finans-fis-tablosu td.islem-hucre form { display: inline; }

/* Satır içi "Eşle" formu (eşleşmeyen banka adları). */
table.liste td.islem-hucre select { max-width: 260px; }
/* Satır içi "Eşle" kutusu cari KODUNU alır (liste sayfa başına tek datalist). */
table.liste td.islem-hucre input[list] { max-width: 180px; }

/* "Çek / Senet No" alanı yalnız çek/senet ödemesinde görünür.
   ⚠⚠ `.alan { display:flex }` YAZAR STİLİ, tarayıcının `[hidden]{display:none}`
      varsayılanını YENER: betiğin `cekAlani.hidden = true` ataması hiçbir şeyi
      gizlemiyor ve alan her ödeme tipinde duruyordu. (Aynı tuzak depoda bir kez
      `#belgeTablosu td.duzenlenebilir .salt-okunur[hidden]` ile çözülmüştü.) */
.form-izgara .alan[hidden] { display: none; }

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 23 — HATIRLATMA GÖNDEREN SEÇİMİ + 📄 KOPYALA (23.09.2026)

   Kullanıcı isteği: "Standart genele hazırlanmış hatırlatma … her zaman
   satis@hayek.com.tr adresinden gitsin, CC'de hakan.yildizoz@… olsun. Müşteriye
   özel hazırlanmış bildirimde … alıcılar tablosunun altına Gönderen seçeneği
   ekle … dropdown menülü yapma da bunları yan yana yaz, yanlarında
   işaretlenebilir kutucuk olsun … Hatırlatma metni tablosunda … Düzenle
   butonunun yanına Kopyala butonu ekle."

   ⚠ Yeni CSS HEP DOSYANIN SONUNA, kendi katman bloğu olarak eklenir
     (feedback_erp1_ekran_dili): üstteki katmanlar okunur kalsın.
   ⚠ Şablona <style> YAZILMAZ; davranış `hatirlatma_gonderen.js`te.
   ══════════════════════════════════════════════════════════════════════ */

/* Alacak Yönetimi'nin üstündeki iki satır: 1) sabit hatırlatma kuralı,
   2) öteki sistem postalarının kutusu (artık hatırlatmayı belirlemez). */
.alacak-gonderen-ayari { margin: calc(-1 * var(--b2)) 0 var(--b3);
  font-size: var(--fs-xs); color: var(--metin-soluk); }
.alacak-gonderen-ayari code { font-size: inherit; }

/* Önizleme — standart gönderimde yalnız BİLGİ satırı (seçim yok). */
.hatirlatma-gonderen-bilgi { margin: var(--b3) 0 0; }

/* Önizleme — özel metinde gönderen seçimi.
   ⚠⚠ YAN YANA: kullanıcı açılır liste istemedi. Dar ekranda alt alta sarar;
      kutucuk + adres tek parça kalsın diye her seçenek `nowrap`. */
.hatirlatma-gonderen-secim .gonderen-secenekler {
  display: flex; flex-wrap: wrap; align-items: center;
  gap: var(--b2) var(--b5); margin-top: var(--b2);
}
.hatirlatma-gonderen-secim .onay-kutusu { white-space: nowrap; }
.hatirlatma-gonderen-secim .yardim { margin-top: var(--b2); }

/* Hatırlatma Metni → 📝 Metinler tablosu: 📄 Kopyala, ✏ Düzenle'nin yanında.
   ⚠ Form satır içi olmalı: blok kalsaydı düğme alt satıra düşer, hücre
     iki kat yükselirdi (`table.liste td.islem-hucre` nowrap + sağa dayalı). */
.hm-kopya-formu { display: inline-block; margin: 0; }

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 24 — FİŞTE FATURA SEÇİMİ (23.09.2026)

   Kullanıcı isteği: "Finans fişlerinde ilgili fatura alanı dropdown menü
   olsun … cari seçildikten sonra o cariye ait açık faturalar orada
   listelensin … birden fazla fatura seçebilelim."

   ⚠ Yeni CSS HEP DOSYANIN SONUNA, kendi katman bloğu olarak eklenir
     (feedback_erp1_ekran_dili): üstteki katmanlar okunur kalsın.
   ⚠ Şablona <style> YAZILMAZ; davranış `static/erp1/finans_fis.js`tedir.
   ══════════════════════════════════════════════════════════════════════ */

/* "İlgili fatura" çoklu seçim listesi — alan tam satır kaplar (`.tam`).
   ⚠ Yükseklik SABİTTİR: satır sayısıyla büyüseydi 40 açık faturalı bir
     caride form ekranı sayfalarca uzardı; liste kendi içinde kaydırılır. */
.form-izgara .alan.tam select[multiple] {
  width: 100%;
  min-height: 150px;
  max-height: 220px;
  padding: 4px;
  font-size: var(--fs-xs);
  line-height: 1.7;
}
/* ⚠ Seçili satır sayfadaki tek dolu maviyi taklit etmez (o "Kaydet"indir);
     yumuşak bir zemin yeter. */
.form-izgara .alan.tam select[multiple] option { padding: 2px 6px; }

/* Seçimin CANLI ÖZETİ: "seçilen 3 fatura · 12.400,00 TRY · ödeme
   15.000,00 TRY → 2.600,00 TRY en eski açık faturadan düşecek".
   ⚠ TEK SATIRLIK bir cümledir; dar ekranda sarar, kırpılmaz (görsel
     yoğunluk kuralı: hücre içeriği gizlenmez). */
.fatura-secim-ozeti {
  margin-top: var(--b3);
  padding: 6px 10px;
  border-left: 3px solid var(--vurgu);
  background: var(--vurgu-acik);
  border-radius: var(--b2);
  font-size: var(--fs-xs);
  color: var(--metin);
}
.fatura-secim-ozeti:empty { display: none; }


/* ══════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 25 — MERKEZÎ MEVZUAT EKRANLARI (23.09.2026)

   Kullanıcı kararı: ERP başka şirketlere satılacak; devletin belirlediği
   parametreler MERKEZÎ olacak. Bu ekranlar PUBLIC şemada, yönetim alan
   adında durur ve kiracı kabuğunu (sol menü, üst çubuk, şirket seçici)
   KULLANMAZ — kendi sade kabuğu vardır.

   ⚠ Yeni CSS HEP DOSYANIN SONUNA, kendi katman bloğu olarak eklenir
     (feedback_erp1_ekran_dili): üstteki katmanlar okunur kalsın.
   ⚠ Şablona <style> YAZILMAZ.
   ⚠ Sayfada TEK DOLU MAVİ vardır (`.dugme.birincil`); bantlar mavinin
     açık tonunu kullanır.
   ══════════════════════════════════════════════════════════════════════ */

.merkez-sayfa { background: var(--zemin); }
.merkez-kabuk {
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 16px 48px;
}

/* Üst çubuk — kiracı kabuğundaki koyu menünün yerine sade bir şerit. */
.merkez-ust {
  display: flex;
  align-items: center;
  gap: 12px;
  height: 56px;
  border-bottom: 1px solid var(--kenar);
  margin-bottom: 12px;
}
.merkez-marka { font-weight: 700; font-size: 1.02rem; color: var(--metin); }
.merkez-marka:hover { text-decoration: none; color: var(--vurgu); }
.merkez-bosluk { flex: 1 1 auto; }
.merkez-panel-baglantisi { font-size: var(--fs-xs, .78rem); }
/* "Bu veri herkese ait" uyarısı her ekranın üstünde görünür dursun. */
.merkez-rozet {
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--uyari-zemin);
  color: var(--uyari);
  font-size: .72rem;
  white-space: nowrap;
}

/* Sekmeler — sekiz parametre ekranı arasında geçiş. */
.merkez-sekmeler {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-bottom: 14px;
}
.merkez-sekmeler a {
  padding: 6px 12px;
  border: 1px solid var(--kenar);
  border-radius: var(--yuvarlak);
  background: var(--kart);
  color: var(--metin);
  font-size: .82rem;
}
.merkez-sekmeler a:hover { text-decoration: none; border-color: var(--vurgu); }
.merkez-sekmeler a.etkin {
  border-color: var(--vurgu);
  background: var(--vurgu-acik);
  color: var(--vurgu-koyu);
  font-weight: 600;
}

.merkez-mesajlar { margin-bottom: 10px; }
.merkez-govde { min-height: 40vh; }

/* Araç şeridi: + Yeni kayıt · süzgeç · ⬇ İndir */
.merkez-arac-serit,
.merkez-indir-serit {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.merkez-suzgec { display: flex; align-items: center; gap: 6px; margin: 0; }
.merkez-suzgec label { font-size: .78rem; color: var(--metin-soluk); }
.merkez-indir-serit .yardim { margin: 0; }

.merkez-sayac {
  font-weight: 400;
  font-size: .78rem;
  color: var(--metin-soluk);
  margin-left: 8px;
}

/* Tablo — kompakt, içerik genişliğinde; açıklama hücresi KIRPILMAZ. */
.merkez-tablo { width: 100%; }
.merkez-tablo td, .merkez-tablo th { vertical-align: middle; }
.merkez-tablo th.sag, .merkez-tablo td.sag { text-align: right; }
.merkez-tablo th.orta, .merkez-tablo td.orta { text-align: center; }
.merkez-secim { width: 34px; text-align: center; }
.merkez-islem { white-space: nowrap; text-align: right; }
.merkez-islem a { margin-left: 10px; font-size: .8rem; }
.merkez-islem form { display: inline; }
.merkez-sil { color: var(--olumsuz); }

.merkez-bos {
  padding: 18px;
  border: 1px dashed var(--kenar);
  border-radius: var(--yuvarlak);
  background: var(--kart);
  color: var(--metin-soluk);
}

/* Ekran altı açıklama ve kalıcı notlar — "bu rakam neden böyle" sorusunun
   cevabı ekranın kendisinde dursun. */
.merkez-aciklama {
  margin-top: 14px;
  padding: 10px 12px;
  border-left: 3px solid var(--vurgu);
  background: var(--vurgu-acik);
  border-radius: var(--b2, 6px);
  font-size: .82rem;
  line-height: 1.6;
}
.merkez-notlar {
  margin: 8px 0 0;
  padding-left: 20px;
  font-size: .8rem;
  color: var(--metin-soluk);
  line-height: 1.7;
}
.merkez-not {
  margin-top: 14px;
  padding: 10px 12px;
  border-left: 3px solid var(--uyari);
  background: var(--uyari-zemin);
  border-radius: var(--b2, 6px);
  font-size: .82rem;
  line-height: 1.6;
}
.merkez-uyari {
  padding: 10px 12px;
  border-left: 3px solid var(--olumsuz);
  background: var(--olumsuz-zemin);
  border-radius: var(--b2, 6px);
  font-size: .85rem;
}
.merkez-eksik-bant ul { margin: 6px 0 0; padding-left: 20px; }

/* Durum rozetleri: 0 ile "girilmemiş" AYRI şeylerdir — panelde karışmasın. */
.merkez-durum { padding: 2px 8px; border-radius: 999px; font-size: .74rem; }
.merkez-durum.tamam { background: var(--olumlu-zemin); color: var(--olumlu); }
.merkez-durum.eksik { background: var(--olumsuz-zemin); color: var(--olumsuz); }

/* ⚙ Yılı Tohumla ve dilim ekleme satırı */
.merkez-tohum {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 14px;
  padding: 10px 12px;
  border: 1px solid var(--kenar);
  border-radius: var(--yuvarlak);
  background: var(--kart);
}
.merkez-tohum label { font-weight: 600; font-size: .82rem; }
.merkez-tohum input { width: 110px; }
.merkez-tohum .yardim { margin: 0; }
.merkez-dilim-formu { margin-top: 14px; }

.merkez-alt {
  margin-top: 28px;
  padding-top: 12px;
  border-top: 1px solid var(--kenar);
  font-size: .78rem;
  color: var(--metin-soluk);
  line-height: 1.7;
}

@media (max-width: 720px) {
  .merkez-sekmeler a { font-size: .76rem; padding: 5px 9px; }
  .merkez-islem { white-space: normal; }
}

/* ════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 26 — İZİN YÖNETİMİ (23.09.2026)

   ⚠ Bu blok dosyanın SONUNDADIR ve yalnız İzin Yönetimi ekranlarına
     dokunur. Önceki katmanlar değiştirilmez.
   ⚠⚠ `.form-bant[hidden]`: `.form-bant` yazar stili taşıdığı için
      tarayıcının `[hidden] { display:none }` kuralını EZER; kural olmadan
      gizlenen bant ekranda kalırdı (FAZ 22'de aynısı `.alan` için yazıldı).
   ════════════════════════════════════════════════════════════════════════ */
.form-bant[hidden] { display: none; }

/* İzin listesi — satır sonundaki beş POST düğmesi kaydırma yapmadan sığsın. */
.ik-izin-tablosu th, .ik-izin-tablosu td { white-space: nowrap; }
.ik-izin-tablosu td:nth-child(2) { min-width: 180px; white-space: normal; }
.ik-izin-tablosu td.islem-hucre { white-space: nowrap; }
.ik-izin-defteri td:nth-child(4) { white-space: normal; min-width: 260px; }

/* Bakiye kartı — talep formunun üstündeki "Kullanabileceğiniz izin süresi". */
.izin-bakiye-karti .izin-bakiye-deger { font-size: 1.05rem; }
.izin-bakiye-karti .yardim { margin-top: 4px; }
.izin-uyari-satiri { color: var(--uyari); }

/* Bakiye aşımı ve mazeret uyarısı bantları. */
.mesaj.izin-asim { font-weight: 600; }
.mesaj.izin-uyari { font-weight: 500; }

/* "manuel olarak güncellenmiştir" rozeti — kartta ve talep formunda aynı. */
.izin-rozet-manuel {
  display: inline-block; margin-left: 8px; padding: 1px 8px; border-radius: 999px;
  background: #fff4de; color: #92580a; font-size: .74rem; font-weight: 600;
}

/* Detay ekranındaki etiket/değer tablosu — liste değil, künye. */
.izin-detay-tablosu td:first-child { color: var(--metin-soluk); width: 220px; }
.izin-detay-tablosu td { white-space: normal; }

.izin-sayim-aciklamasi { margin-top: 12px; max-width: 900px; line-height: 1.6; }

@media (max-width: 720px) {
  .izin-detay-tablosu td:first-child { width: auto; }
  .ik-izin-tablosu th, .ik-izin-tablosu td { white-space: normal; }
}


/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 27 — İNSAN KAYNAKLARI PARAMETRELERİ (23.09.2026)

   Sekiz parametre ekranı + Prim / Bordro yer tutucuları. Yedisi MERKEZÎ
   mevzuattır (public şema) ve kiracıda SALT OKUR gösterilir; yalnız İzin
   Kuralları, Kıdem Kuralları ve şirketin kendi tatil günleri buradan
   değiştirilir.

   ⚠ Yeni CSS HEP DOSYANIN SONUNA, kendi katman bloğu olarak eklenir
     (feedback_erp1_ekran_dili): üstteki katmanlar okunur kalsın.
     FAZ 25 merkezî mevzuat ekranlarının, FAZ 26 İzin Yönetimi'nin.
   ⚠ Şablona <style> YAZILMAZ; ölçüler `tablo_sinifi` ile verilir
     (`ik-parametre-tablosu`), satır içi `style` ile değil.
   ⚠ Sayfada TEK DOLU MAVİ vardır; bantlar mavinin/kırmızının açık tonunu
     kullanır.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── ⛔ Eksik parametre bandı ──────────────────────────────────────────────
   "Parametre yoksa sayı üretme" kuralının görünen yüzü. `—` yerine
   "parametre eksik" yazılır: `—` sıfır sanılıyor. */
.parametre-eksik {
  border: 1px solid var(--olumsuz);
  background: var(--olumsuz-zemin);
  border-radius: var(--yuvarlak);
  padding: 12px 14px;
  margin-bottom: var(--b3, 14px);
  font-size: .86rem;
  line-height: 1.6;
}
.parametre-eksik-satiri + .parametre-eksik-satiri {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--olumsuz);
}
.parametre-eksik b { color: var(--olumsuz); }
.parametre-eksik ul { margin: 6px 0 0; padding-left: 20px; }
.parametre-eksik .yardim { margin: 4px 0 0; }
.parametre-yol { margin-top: 6px; font-size: .82rem; }

/* ── 🔒 "HAYEK tarafından güncellenir" damgası ─────────────────────────────
   Merkezî ekranda Ekle/Düzenle/Sil düğmesi YOKTUR; kullanıcı "neden
   değiştiremiyorum" diye aramasın diye damga listenin üstünde durur. */
.merkez-damgasi {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 8px 12px;
  margin-bottom: var(--b3, 14px);
  border: 1px solid var(--kenar);
  border-left: 3px solid var(--vurgu);
  border-radius: var(--yuvarlak);
  background: var(--vurgu-acik);
}
.merkez-damgasi-rozet {
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--kart);
  border: 1px solid var(--kenar);
  font-size: .72rem;
  white-space: nowrap;
}
.merkez-damgasi-metin { font-weight: 600; font-size: .84rem; }
.merkez-damgasi .yardim { margin: 0; flex: 1 1 260px; }

/* ── Rozet ve soluk kaynak metni ──────────────────────────────────────── */
.parametre-gecerlilik {
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--vurgu-acik);
  color: var(--vurgu-koyu);
  font-size: .72rem;
  font-weight: 600;
  white-space: nowrap;
}
.parametre-kaynak { color: var(--metin-soluk); font-size: .78rem; }
/* Yarım gün / sınırsız dilim gibi "bu satır ötekiler gibi değil" işareti. */
.tatil-yarim {
  padding: 1px 6px;
  border-radius: 999px;
  background: var(--uyari-zemin);
  color: var(--uyari);
  font-size: .70rem;
  white-space: nowrap;
}

/* ── Kural kartı (okunur etiket–değer tablosu) ─────────────────────────── */
.kural-karti .form-bant { margin-top: var(--b4, 18px); }
.kural-karti .form-bant:first-child { margin-top: 0; }
.kural-karti .tablo-sarmal { margin-bottom: var(--b2, 10px); }
table.ik-parametre-tablosu td.kural-etiket { width: 34%; font-weight: 600; }
table.ik-parametre-tablosu td.kural-deger { width: 22%; }
/* Açıklama hücresi KIRPILMAZ (görsel yoğunluk kuralı): kompakt tablo bilgi
   gizlemez. */
table.ik-parametre-tablosu td.parametre-kaynak { white-space: normal; }
table.ik-parametre-tablosu td.islem-hucre { white-space: nowrap; }

/* Cumartesi açıklaması ve hukuki not — kalıcı metinler, uyarı değil. */
.cumartesi-metni { max-width: 96ch; }
.parametre-hukuki {
  margin: 10px 0 0;
  padding: 10px 12px;
  border-left: 3px solid var(--uyari);
  background: var(--uyari-zemin);
  border-radius: var(--b2, 6px);
  font-size: .82rem;
  line-height: 1.7;
}
/* Geçmişi koruma uyarısı KALICIDIR: kullanıcı kapatınca kaybolmaz. */
.parametre-gecmis-uyarisi { line-height: 1.7; }

/* ── Gelir vergisi dilim tablosu ──────────────────────────────────────── */
table.dilim-tablosu { width: auto; min-width: 420px; }
table.dilim-tablosu td, table.dilim-tablosu th { white-space: nowrap; }

/* ── Ekran altı kalıcı açıklama ───────────────────────────────────────── */
.parametre-alt {
  margin-top: var(--b5, 24px);
  padding-top: 12px;
  border-top: 1px solid var(--kenar);
  font-size: .80rem;
  color: var(--metin-soluk);
  line-height: 1.75;
  max-width: 110ch;
}
.parametre-alt p { margin: 0 0 8px; }
.parametre-alt ul, .parametre-notlari { margin: 0; padding-left: 20px; }
.parametre-notlari {
  font-size: .80rem;
  color: var(--metin-soluk);
  line-height: 1.75;
}

/* ── Yer tutucu ekranlar (Prim · Bordro) ──────────────────────────────────
   Sahte sayı ve çalışmayan düğme yok; kart sakin ve dar dursun. */
.kart.yer-tutucu { max-width: 860px; }
.kart.yer-tutucu .kart-govde p { margin: 0 0 10px; line-height: 1.75; }
.bordro-baglantilari { margin: 0; padding-left: 20px; line-height: 1.9; }

@media (max-width: 900px) {
  .merkez-damgasi { align-items: flex-start; }
  table.ik-parametre-tablosu td.kural-etiket,
  table.ik-parametre-tablosu td.kural-deger { width: auto; }
}

/* ══════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 28 — İNSAN KAYNAKLARI: ÇALIŞAN KARTI ve LİSTELER
   (23.09.2026)

   ⚠ Şablonlara <style> YAZILMAZ (satır içi CSS'teki süslü parantez
     dizisi `test_ekranlar`ın şablon kalıntısı denetçisini düşürür);
     bu ekranların TÜM ölçüsü burada durur.
   ⚠⚠ `.rozet[hidden]`: `.rozet{display:inline-block}` tarayıcının `[hidden]`
      varsayılanını YENER. "manuel olarak güncellenmiştir" rozeti sunucuda
      `hidden` basılıp `ik_form.js` ile açılıyor; bu kural olmadan rozet HER
      SATIRDA görünür ve "elle değiştirildi" damgası anlamını yitirirdi
      (aynı tuzak `.form-izgara .alan[hidden]`de de vardı).
   ══════════════════════════════════════════════════════════════════════ */

.rozet[hidden] { display: none; }

/* ── Çalışanlar / Ücret listeleri ──────────────────────────────────── */
/* Kıdem ve kalan izin HESAPLANAN sütunlardır: dar ve sağa hizalı dursun,
   uzun ad soyad satırı kaydırmasın. */
table.ik-calisan-tablosu td, table.ik-ucret-tablosu td { vertical-align: middle; }
table.ik-calisan-tablosu th:nth-child(7),
table.ik-calisan-tablosu td:nth-child(7) { white-space: nowrap; }
table.ik-ucret-tablosu td:nth-last-child(2),
table.ik-ucret-tablosu td:last-child { white-space: nowrap; }

/* ── Çalışan Kartı ─────────────────────────────────────────────────── */
/* `<fieldset>` tarayıcının kendi kenarlığını ve iç boşluğunu getirir;
   kart zaten çerçeveli. */
fieldset.ik-kart-govde { border: 0; margin: 0; padding: 0; min-width: 0; }
/* ⚠ Okunur kipte alanlar soluklaşır ama OKUNAKLI kalır: tarayıcının
   varsayılan `:disabled` grisi kontrast eşiğinin (4.5) altına düşüyordu. */
fieldset.ik-kart-govde[disabled] input,
fieldset.ik-kart-govde[disabled] select,
fieldset.ik-kart-govde[disabled] textarea {
  background: var(--zemin, #f7f8fa);
  color: var(--metin);
  opacity: 1;
  -webkit-text-fill-color: var(--metin);
}
.ik-ucret-kapali { margin-top: 14px; padding-top: 10px; border-top: 1px solid var(--kenar); }
.ik-kart-alti { margin: 16px 2px 0; max-width: 96ch; line-height: 1.7; }

/* ── İzin Süresi tablosu (kart içi) ───────────────────────────────────────────── */
.ik-izin-bant { margin: 0 0 10px; }
table.ik-izin-suresi-tablosu td { vertical-align: top; }
table.ik-izin-suresi-tablosu td.sayi { white-space: nowrap; font-weight: 600; }
table.ik-izin-suresi-tablosu td .yardim { margin-top: 3px; }
/* Elle giriş hücresi: gün kutusu dar, açıklama geniş — alt alta. */
td.ik-izin-giris { display: table-cell; }
td.ik-izin-giris input[type=number] { width: 90px; }
td.ik-izin-giris input[type=date] { width: 150px; margin-left: 6px; }
td.ik-izin-giris input[type=text] { width: 100%; margin-top: 4px; }
table.ik-izin-suresi-tablosu .dugme.kucuk { margin-top: 6px; }
.yardim.uyari { color: var(--uyari, #8a5a00); }

/* ── Kıdem tazminatı / kullanılmamış izin ücreti blokları ──────────── */
/* ⚠ İkisi bilerek YAN YANA durur: kıdem GİYDİRİLMİŞ, izin ücreti ÇIPLAK
   brütten hesaplanır; aynı ekranda görünmeleri bu farkı hatırlatır. */
.ozet-satiri.ik-tazminat { align-items: stretch; }
.ozet-kart.ik-tazminat-kart { flex: 1 1 380px; max-width: 560px; }
.ozet-kart.ik-tazminat-kart .mesaj { margin: 6px 0; }
.ik-tazminat-satir { margin-top: 6px; font-size: .86rem; }
.ik-tazminat-satir .yardim { display: inline; }

@media (max-width: 720px) {
  .ozet-kart.ik-tazminat-kart { flex: 1 1 100%; max-width: 100%; }
  td.ik-izin-giris input[type=date] { margin-left: 0; margin-top: 4px; }
}

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 29 — BANKA EŞLEŞTİRMELERİ: SÜTUN SÜZGECİ, TOPLU EŞLE
   ve CARİ ÖNERİSİ (23.09.2026)

   Kullanıcı isteği: "Sütunları filtrelenebilir ve sıralanabilir yap · son
   sütunun üstündeki 'Eşle' başlığını butona çevir · cari kod ve cari isim
   tanımını kendisi önersin, önerisi olmayanları biz seçelim."

   ⚠ Panel `.ss-…` sınıflarını YENİDEN KULLANIR (başlık süzgeci katmanı):
     hesaplanmış tablo ile queryset tablosu aynı görünsün.
   ══════════════════════════════════════════════════════════════════════ */

/* Başlıktaki TOPLU "Eşle" düğmesi: başlık yüksekliğini şişirmesin. */
table.eslesmeyen-tablo thead th .dugme.kucuk {
  vertical-align: middle;
  margin: -1px 0;
}

/* Cari kutusunun altındaki öneri satırı: güven rozeti + önerilen unvan.
   ⚠ İşlem hücresi `nowrap`tır; uzun unvan üç nokta ile kırpılır ki satır
     yüksekliği sabit kalsın (görsel yoğunluk kuralı). */
.eslesmeyen-tablo .oneri-satiri {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
  margin-top: 2px;
  font-size: var(--fs-xs);
  color: var(--metin-soluk);
}
.eslesmeyen-tablo .cari-unvan {
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.eslesmeyen-tablo .oneri-satiri .rozet { flex: none; }

/* Kırpma uyarısı: "ilk 100 satır gösteriliyor" — engel değil, bilgi.
   ⚠⚠ Bu satır SESSİZ KIRPMAYI bitirir; rengi uyarı rozetiyle aynı ailedir. */
.yardim.uyari-notu {
  margin: var(--b2, 10px) 0;
  padding: 6px 10px;
  border-radius: var(--r-alan, 6px);
  background: #fff4d6;
  color: #8a5a00;
}

/* ⚠⚠ ÖNERİ ROZETİ KENDİ KATMANINDA SÖNER: `.rozet { display:inline-block }`
   (satır 282) tarayıcının `[hidden] { display:none }` varsayılanını YENER.
   Bu kural olmadan rozet, kullanıcı kutuya başka bir cari yazsa da olduğu
   gibi kalır ve ekran kullanıcının KENDİ seçimini "sistemin önerisi" gibi
   etiketler — toplu "Eşle" öncesi tahmin/karar ayrımının tek görsel işareti
   budur. (Daha önce yalnız FAZ 28'in İK kuralı sayesinde çalışıyordu; başka
   bir özelliğin katmanına yaslanmak kırılgandır.) */
.eslesmeyen-tablo .oneri-satiri .rozet[hidden] { display: none; }

/* Zayıf önerinin "Kabul et" düğmesi: kutuya SİSTEM yazmaz, kullanıcı yazar. */
.eslesmeyen-tablo .oneri-satiri .oneri-kabul { flex: none; }

/* ⚠⚠ NÖBETÇİ GÖNDER DÜĞMESİ (`name="belirsiz"`): formun İLK gönder düğmesi
   olmalı ki tarayıcının ÖRTÜK GÖNDERİMİ (kutuda Enter) "Eşle (tümü)"yü
   çalıştırmasın. `display:none` KULLANILAMAZ — gizlenen düğme tarayıcıda
   varsayılan düğme sayılmaz ve tuzak geri döner. Ekrandan çıkarılır, odak
   ve ekran okuyucu dışında bırakılır. */
.ekran-disi {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* ═══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 30 — İLK KURULUM DAVETİ (25.09.2026)

   `/ilk-kurulum/` artık jetonlu davetle açılır. İki yeni parça: davetin ne
   olduğunu anlatan not kutusu ve davet geçersizse basılan mesaj kartı.
   ⚠ Giriş kartının (`.giris-kart`) İÇİNDE yaşarlar; genişlik, gölge ve
     yuvarlama oradan gelir — burada yalnız FARK yazılır.
   ═══════════════════════════════════════════════════════════════════════════ */

/* Davet notu: "tek kullanımlık, şu tarihe kadar geçerli, paylaşmayın". */
.giris-kart .kurulum-not {
  background: #f1f7fb;
  border: 1px solid #cfe0ec;
  border-left: 3px solid #2E4057;
  border-radius: 8px;
  padding: 10px 12px;
  margin: 0 0 16px;
  font-size: .78rem;
  line-height: 1.6;
  color: #3d4f60;
  text-align: left;
}

/* ⚠ Hata bandı eskiden şablonda satır içi `style` ile itiliyordu. */
.giris-kart .kurulum-hata { margin-bottom: 14px; }

/* Davet geçersiz / kurulum bitmiş / çok fazla deneme sayfası. */
.giris-kart.kurulum-mesaj { text-align: center; }
.giris-kart.kurulum-mesaj .kurulum-ikon { font-size: 2rem; line-height: 1; }
.giris-kart.kurulum-mesaj h1 { margin: 10px 0 6px; }
/* ⚠ `.giris-kart .alt` altında 20px boşluk var; düğme ondan sonra gelir. */
.giris-kart.kurulum-mesaj .alt { margin-bottom: 18px; }
.giris-kart.kurulum-mesaj .dugme { text-decoration: none; }

/* ═══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 31 — BORDRO EKRANI (25.09.2026)

   İki ekran: dönem listesi (`ik/bordro_liste.html`) ve tek çalışanın
   yazdırılabilir dökümü (`ik/bordro_detay.html`).

   ⚠ Şablonlara <style> YAZILMAZ; ekrana özel her ölçü burada durur.
   ⚠ Sayfada tek dolu mavi düğme kuralı bozulmaz: "⚙ Dönemi Hesapla"
     birincildir, "Dönemi Kapat" ve "Kilidi Aç" sade düğmedir.
   ⚠⚠ YAZDIRMA DÜZENİ BU BLOKTADIR (`@media print`): döküm kâğıda menüsüz,
      süzgeçsiz ve düğmesiz iner. Betik yalnız `window.print()` çağırır.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Dönem gezintisi (süzgeç çubuğundaki ◀ ▶) ─────────────────────────── */
.suzgec-satir .alan.donem-gezinti { min-width: 210px; }
.donem-oklari {
  display: flex;
  align-items: center;
  gap: 6px;
  height: var(--kutu-h);
}
.donem-oklari .donem-etiketi {
  font-weight: 600;
  white-space: nowrap;
  font-size: .82rem;
}

/* ── Dönem kartı ve teşvik kutuları ───────────────────────────────────── */
.bordro-donem-karti .kart-basi { display: flex; align-items: center; gap: 8px; }
.bordro-donem-formu fieldset { border: 0; margin: 0; padding: 0; }
/* ⚠ Kapalı alan POST'a gitmez; kilitli dönemde kutular soluk görünür. */
.bordro-donem-formu fieldset[disabled] { opacity: .6; }
.tesvik-satiri {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 22px;
  margin-bottom: 6px;
}
.tesvik-satiri .onay-kutusu { height: auto; }

/* ── Parametre eksik / kilit bantları ─────────────────────────────────── */
.mesaj.bordro-durdu { font-weight: 500; }
.mesaj.bordro-kilit {
  background: var(--zemin);
  border-color: var(--kenar);
  color: var(--metin-soluk);
  margin-bottom: 12px;
}
.mesaj.bordro-onizleme {
  background: var(--vurgu-acik);
  border-color: #c7d7fb;
  color: var(--vurgu-koyu);
  margin: 10px 0;
}

/* ── Liste: 15 sütun dar ekrana sığmaz, sarmal kaydırır ───────────────── */
.liste.ik-bordro-tablosu { min-width: 1180px; }
.liste.ik-bordro-tablosu th, .liste.ik-bordro-tablosu td { white-space: nowrap; }
/* ⚠ Ad sütunu kırpılmaz: kişi adı bordronun kimliğidir. */
.liste.ik-bordro-tablosu td:nth-child(2) { min-width: 180px; }

/* ── Döküm sayfası ────────────────────────────────────────────────────── */
.bordro-dokum .form-bant { margin-top: 16px; }
.liste.bordro-kimlik td:nth-child(odd),
.liste.bordro-satirlari td:first-child { color: var(--metin-soluk); }
.liste.bordro-satirlari td:nth-child(2) { width: 180px; }
.liste.bordro-satirlari tr.ara-toplam td { border-top: 1px solid var(--kenar); }
.liste.bordro-kalem-tablosu td.yardim { color: var(--metin-soluk); }

/* Karşılaştırma: fark ≠ 0 olan satır kırmızı — sessiz fark olmaz. */
.liste.karsilastirma-tablosu tr.farkli td,
.liste.bordro-satirlari tr.farkli td {
  background: var(--olumsuz-zemin);
  color: var(--olumsuz);
}
.karsilastirma-karti .kart-basi { display: flex; align-items: center; gap: 8px; }
.karsilastirma-alani .kart { margin-bottom: 12px; }
.liste.karsilastirma-tablosu { max-width: 720px; }

/* ── 🖨 YAZDIRMA: kâğıda yalnız dökümün kendisi iner ──────────────────── */
@media print {
  .yan-menu, .ust-serit, .sayfa-eylemler, .kirinti, .mesaj,
  .bordro-giris, .bordro-kalemler, .bordro-aktarim { display: none !important; }
  .kabuk, .icerik, .govde { display: block; margin: 0; padding: 0; }
  .kart { box-shadow: none; border: 1px solid #999; page-break-inside: avoid; }
  .tablo-sarmal { overflow: visible; }
  .liste th { position: static; }
  body { background: #fff; }
}


/* ═══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 32 — ABONELİK KAPISI (25.09.2026)

   İki parça: aboneliği duran kiracının gördüğü kapalı sayfası ve her ekranın
   üstünde çıkan "süreniz doluyor" bandı.
   ⚠ Kapalı sayfası giriş kartının (`.giris-kart`) İÇİNDE yaşar — genişlik,
     gölge, yuvarlama oradan gelir; burada yalnız FARK yazılır. Düzen FAZ 30'un
     (`.kurulum-mesaj`) aynısıdır: kullanıcı iki ayrı "sistem dışı" sayfayı
     aynı biçimde tanısın.
   ⚠ Sayfada DOLU MAVİ YOK: kapalı abonenin yapabileceği tek iş çıkmaktır,
     onu birincil eylem gibi göstermek yanlış olurdu.
   ═══════════════════════════════════════════════════════════════════════════ */

/* Aboneliğiniz askıda / kapatıldı / süreniz doldu sayfası. */
.giris-kart.abonelik-kapali { text-align: center; }
.giris-kart.abonelik-kapali .kurulum-ikon { font-size: 2rem; line-height: 1; }
.giris-kart.abonelik-kapali h1 { margin: 10px 0 6px; }
.giris-kart.abonelik-kapali .alt { margin-bottom: 14px; }
.giris-kart.abonelik-kapali .dugme { text-decoration: none; }

.abonelik-kapali .abonelik-tarih {
  font-size: .8rem;
  color: var(--metin-soluk);
  margin-bottom: 14px;
}

/* İletişim satırı: kullanıcının atacağı TEK adım burada yazar. */
.abonelik-kapali .abonelik-iletisim {
  background: var(--uyari-zemin);
  border: 1px solid var(--uyari-kenar, #f2dcae);
  border-radius: 8px;
  padding: 10px 12px;
  margin: 0 0 18px;
  font-size: .82rem;
  line-height: 1.6;
  color: var(--uyari);
  text-align: left;
}

/* ── Uyarı bandı (bitişe az kaldı) ────────────────────────────────────── */
/* ⚠ `.mesaj.warning` zemin/kenarını taşır; burada yalnız bandın kendi
      ritmi vardır. Mesaj kutusu değildir: kapatılamaz, her sayfada durur. */
.mesaj.abonelik-bandi {
  margin-bottom: var(--b5);
  display: flex;
  flex-wrap: wrap;
  gap: 0 6px;
  align-items: baseline;
}
/* ═══════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 33 — BORDRO DENETİM BANTLARI (25.09.2026)

   Faz 2 denetiminde açılan üç yeni ekran durumu:
     · BAYAT satır — kümülatif matrahı doğrulanamayan / yeniden üretilemeyen
       satır. Listede kırmızı, dökümde bant.
     · ATLANAN çalışan — hesaplanamayan kişinin KALICI izi (geçici mesaj
       sayfa yenilenince kayboluyordu).
     · KİLİTLİ dönemde parametre DEĞİŞTİ — kırmızı değil NÖTR bilgi notu:
       kapatılmış dönem yeniden hesaplanmaz, satırlar geçerlidir.

   ⚠ Ölçüler FAZ 31'in bordro bantlarıyla aynı ritimde (satır 26, kutu 28).
   ⚠ Şablona <style> yazılmaz; bu blok dosyanın SONUNDADIR.
   ═══════════════════════════════════════════════════════════════════════ */

/* Nötr bilgi bandı — kilitli dönemde parametre değişimi. */
.mesaj.bordro-bilgi {
  background: var(--yuzey-2, #f6f7f9);
  border: 1px solid var(--kenar, #dfe3e8);
  color: var(--metin, #1f2933);
  border-radius: 8px;
  padding: 8px 12px;
  margin: 0 0 10px;
  font-size: .82rem;
  line-height: 1.6;
}

/* Hesaplanamayan çalışanların kalıcı izi. */
.mesaj.bordro-atlanan {
  margin: 0 0 10px;
  line-height: 1.6;
}

.bordro-atlanan-liste {
  display: block;
  margin-top: 4px;
  font-size: .8rem;
  white-space: normal;
}

/* Bayat satır bandı (liste üstü ve döküm). */
.mesaj.bordro-bayat-bant,
.mesaj.bordro-bayat {
  margin: 0 0 10px;
  line-height: 1.6;
}

/* Karşılaştırma görünümünde ⬇ İndir'in kapsamı. */
.karsilastirma-indir-notu {
  margin: 0 2px 10px;
  line-height: 1.6;
}

/* KVKK uyarısı — liste altı, kapatılamaz. */
.mesaj.bordro-kvkk {
  background: var(--uyari-zemin, #fdf6e3);
  border: 1px solid var(--uyari-kenar, #f2dcae);
  color: var(--uyari, #8a6d3b);
  border-radius: 8px;
  padding: 8px 12px;
  margin: 10px 2px 0;
  font-size: .8rem;
  line-height: 1.6;
}

/* ⚠ Yazdırmada denetim bantları BASILMAZ: çalışana verilen bordro dökümü
      iç denetim notlarını taşımamalı. */
@media print {
  .mesaj.bordro-bayat,
  .mesaj.bordro-bilgi,
  .mesaj.bordro-atlanan,
  .mesaj.bordro-kvkk {
    display: none;
  }
}
/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 34 — MOBİL TEMEL (26.09.2026)

   Kullanıcı ERP1'i telefonuna kurdu (PWA kabuğu 19.09.2026). Kabuk çalışıyor
   ama EKRANLAR masaüstü ölçüsündeydi: 30 px satırlı, .8rem yazılı, kendi
   içinde yatay kayan 17 sütunlu tablolar. Bu katman TEMELİ kurar —
   ekran içeriği yazmaz.

   ⚠⚠ MASAÜSTÜ GÖRÜNÜMÜ DEĞİŞMEZ. Katmandaki her kural ya "screen and
      (max-width: …)" sorgusunun içindedir ya da yalnız bu katmanda tanımlanan
      yeni sınıflara dokunur (.kart-liste · .mobil-serit · .menu-perde).
   ⚠⚠ "screen and" ŞART: sorgular yalnız max-width ile yazılsaydı dar kâğıda
      yazdırırken de uygulanır, döküm kart görünümüne dönerdi.
   ⚠ İKİ EŞİK VAR ve bilerek farklıdır:
       ≤900 px → sol menü ekran dışına itilir (ESKİ davranış, dokunulmadı;
                 base.html betiği de bu sayıyı kullanır).
       ≤768 px → MOBİL KATMAN: kart görünümü, alt gezinme şeridi, 44 px
                 dokunma hedefi, 16 px yan boşluk, tam ekran pencere.
     768-900 px arası tablette menü ☰ ile açılır ama masaüstü tablo düzeni
     korunur — tablette 17 sütunlu tablo hâlâ okunabiliyor.
   ⚠ Dokunma hedefi kuralı max-width sorgusunda: koşulsuz yazılsaydı bu katman
     en sonda olduğu için masaüstü düğmelerini de büyütürdü (FAZ 13'ün
     "min-width:901px" tuzağının aynası).
   ══════════════════════════════════════════════════════════════════════════ */

/* Mobil parçalar masaüstünde ve yazdırmada HİÇ görünmez. */
.kart-liste, .mobil-serit, .menu-perde { display: none; }

/* ── 1) Sol menü perdesi (≤900 px, menünün itildiği eşikle AYNI) ────────── */
@media screen and (max-width: 900px) {
  /* ⚠ Menü z-index:30, açıkken 50; perde ikisinin ARASINDA (45) durur:
     menüyü karartmadan sayfayı karartır. Alt gezinme şeridi (40) perdenin
     altında kalır, yani menü açıkken şeride dokunulamaz — doğru olan budur. */
  .menu-perde { display: block; position: fixed; inset: 0; z-index: 45;
                background: rgba(18, 28, 45, .45); }
  .menu-perde[hidden] { display: none; }
  /* Menü açıkken arkadaki sayfa kaymasın. */
  body.menu-acik { overflow: hidden; }
}

/* ── 2) Mobil kabuk (≤768 px) ───────────────────────────────────────────── */
@media screen and (max-width: 768px) {
  /* 2a) Dokunma hedefi: parmak 44 px ister (WCAG 2.5.8 / Apple HIG).
     ⚠ Değişkenler üzerinden yazılır: ".dugme { height: var(--kutu-h) }" zaten
       kurulu, tek tek düğme kuralı yazmaya gerek yok. */
  :root {
    --kutu-h: 44px; --kutu-h-orta: 44px; --kutu-h-kucuk: 40px;
    --kutu-h-mini: 36px; --h-satir: 44px; --h-satir-girdi: 44px;
    --mobil-serit-h: 56px;
    /* ⚠⚠ MENÜ GENİŞLİĞİ DEĞİŞKENDEN VERİLİR, `.yan-menu`ün width özelliğiyle
       DEĞİL: menüyü ekran dışına iten kural
       `left: calc(-1 * var(--menu-genislik))`dir (satır 342). Genişlik elle
       300 px yazılsaydı kapalı menünün 68 px'i ekranda GÖRÜNÜR kalırdı.
       ⚠ Süslü parantez YORUMA DA YAZILMAZ: CSS'i regex ile tarayan denetçiler
         (testler/test_mobil.py) blok sınırını orada kaybeder. */
    --menu-genislik: min(300px, 86vw);
  }
  .sayfalama :is(a, span) { min-width: 44px; height: 44px; }
  .onay-kutusu input[type=checkbox] { width: 20px; height: 20px; }

  /* 2b) Yan boşluk 16 px, altta gezinme şeridi için yer. */
  .sayfa {
    padding: 16px 16px
             calc(var(--mobil-serit-h) + env(safe-area-inset-bottom, 0px) + 16px);
    max-width: 100%;
  }
  /* Menünün son yaprağı da şeridin altında kalmasın. */
  .yan-menu { padding-bottom: calc(var(--mobil-serit-h) + env(safe-area-inset-bottom, 0px)); }

  /* 2c) Üst çubuk 375 px'e sığsın.
     ⚠ Çubuk sabit 56 px ve sarmıyor (flex-wrap yok): sığmayan öğe TAŞIRIR.
       En az bilgi taşıyanlar düşer, işlem yapanlar (☰ · 🔄 Güncelle · Çıkış)
       kalır.
     ⚠ Şirket seçicinin min-width değeri ŞABLONDA satır içi yazılı
       (base.html, 220px); satır içi stil ancak !important ile ezilir. */
  .ust-cubuk { padding: 0 16px; gap: 8px; }
  .ust-cubuk .marka-ust { display: none; }
  .ust-cubuk .kullanici { display: none; }
  .girus-damgasi .damga { display: none; }
  .ust-cubuk select { min-width: 0 !important; max-width: 128px; }

  /* 2d) Süzgeç çubuğu tek sütuna iner (kutular 180 px min-width taşıyor). */
  .suzgec-kart { padding: 12px; }
  .suzgec-satir { gap: 8px; }
  .suzgec-satir > .alan, .suzgec-kart .alan.genis { flex: 1 1 100%; }
  .suzgec-kart :is(input, select, .coklu-suzgec, .coklu-suzgec > summary) {
    min-width: 0; width: 100%;
  }
  .coklu-liste { min-width: 0; }

  /* 2e) Özet kartları iki sütun; 1,6rem tutar 375 px'te taşıyordu. */
  .ozet-kart { flex: 1 1 calc(50% - 6px); padding: 10px 12px; }
  .ozet-kart .deger { font-size: 1.15rem; }

  /* 2f) Sayfa başlığı ve eylemleri sarsın, düğmeler kırpılmasın. */
  .sayfa-basi { gap: 8px; }
  .sayfa-eylemler { flex-wrap: wrap; gap: 8px; }
  .hizli-seridi, .toplu-serit, .gorunum-secici { flex-wrap: wrap; }

  /* 2g) Açılır pencere TAM EKRAN.
     ⚠ ".pencere-arka { padding:60px 20px }" telefonda 120 px dikey alan
       yiyordu; pencere başlığındaki 460 px'lik min-width ise 375 px'lik
       ekranı yatay taşırıyordu. */
  .pencere-arka { padding: 0; align-items: stretch; }
  .pencere, .pencere.acilis-pencere {
    width: 100%; max-width: 100%; height: 100%; max-height: 100%;
    border-radius: 0;
  }
  .pencere :is(.pencere-bas, .pencere-govde, .pencere-alt, .acilis-govde) { min-width: 0; }
  .pencere-bas { position: sticky; top: 0; z-index: 2; background: #fff;
                 padding-top: calc(10px + env(safe-area-inset-top, 0px)); }

  /* 2h) Açık menü sayfadan ayrılsın (perde 45, menü 50). */
  .yan-menu.acik { box-shadow: 0 0 40px rgba(0, 0, 0, .35); }
}

/* ── 3) Kart görünümü: dar ekranda liste tablosunun yerine ──────────────── */
/* ⚠⚠ Kart ve tablo AYNI sayfada basılır (templates/arayuz/_kart_liste.html);
   hangisinin görüneceğine YALNIZ burası karar verir. Sunucuda hiçbir şey
   değişmez — bu yüzden 60+ liste ekranı elden geçirilmeden kart kazandı. */
@media screen and (max-width: 768px) {
  .kart-liste { display: flex; flex-direction: column; gap: 10px; }

  /* ⚠ Kapsam ".liste-govdesi-sarmal" ile SINIRLI: liste_ustu bloğundaki özet
     kırılım tabloları (.ozet-tablo) ve liste_alti DOKUNULMAZ.
     ⚠ Gövdesinde ikinci bir yardımcı tablo taşıyan ekran o tabloya
       "tablo-mobil-kalsin" verir; tablo telefonda da görünür. */
  .liste-govdesi-sarmal > .kart-liste ~ .tablo-sarmal,
  .liste-govdesi-sarmal > .kart-liste ~ * .tablo-sarmal { display: none; }
  .liste-govdesi-sarmal .tablo-sarmal.tablo-mobil-kalsin { display: block; }

  .veri-kart {
    background: var(--kart);
    border: 1px solid var(--kenar);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
    padding: 12px 14px;
  }
  .veri-kart-baslik {
    font-weight: 600; font-size: .95rem; line-height: 1.35;
    overflow-wrap: anywhere;
  }
  .veri-kart-baslik a { color: var(--vurgu); text-decoration: none; }
  /* ⚠ Etiket/değer İKİ SÜTUN: dt ve dd doğrudan dl'in çocuğu olduğu için
     ızgara satır satır dizilir, sarmalayıcı div gerekmez. */
  .veri-kart-govde {
    margin: 8px 0 0;
    display: grid;
    grid-template-columns: minmax(0, auto) minmax(0, 1fr);
    gap: 4px 12px;
    align-items: baseline;
  }
  .veri-kart-govde dt { color: var(--metin-soluk); font-size: .78rem; }
  /* ⚠ Tablonun kırpma kuralı (max-width + ellipsis) kartta YOK: kartın derdi
     zaten uzun metni sığdırmak değil OKUTMAKTIR. */
  .veri-kart-govde dd {
    margin: 0; font-size: .82rem; text-align: right;
    overflow-wrap: anywhere;
  }
  .veri-kart-govde dd .sayi { font-variant-numeric: tabular-nums; }
  .veri-kart-eylem { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
  .veri-kart-eylem .dugme.kucuk { height: var(--kutu-h-kucuk); }
  .veri-kart-bos { text-align: center; color: var(--metin-soluk); padding: 24px 14px; }
}

/* ── 4) Alt gezinme şeridi ──────────────────────────────────────────────── */
/* Sekmeler cekirdek/mobil.py içinde YETKİ + PAKET süzgecinden geçer; burada
   yalnız GÖRÜNÜRLÜK kararı verilir. */
@media screen and (max-width: 768px) {
  .mobil-serit {
    display: flex;
    position: fixed; left: 0; right: 0; bottom: 0;
    /* ⚠ 40: menü (50) ve perdenin (45) ALTINDA, üst çubuğun (20) üstünde. */
    z-index: 40;
    background: var(--kart);
    border-top: 1px solid var(--kenar);
    box-shadow: 0 -2px 10px rgba(18, 28, 45, .08);
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  .mobil-serit-oge {
    flex: 1 1 0; min-width: 0;
    min-height: var(--mobil-serit-h);
    display: flex; flex-direction: column;
    align-items: center; justify-content: center; gap: 2px;
    padding: 6px 2px;
    background: none; border: 0; font: inherit; cursor: pointer;
    color: var(--metin-soluk); text-decoration: none;
  }
  .mobil-serit-ikon { font-size: 1.15rem; line-height: 1; }
  .mobil-serit-etiket {
    font-size: .68rem; font-weight: 600; letter-spacing: .01em;
    max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .mobil-serit-oge.etkin { color: var(--vurgu); }
  .mobil-serit-oge.etkin .mobil-serit-ikon { transform: translateY(-1px); }
}

/* ── 5) Giriş sayfası ───────────────────────────────────────────────────── */
/* ⚠ Uygulama kipinde oturum tarayıcı kapanışında düşüyor
   (`SESSION_EXPIRE_AT_BROWSER_CLOSE`), yani telefonda EN SIK GÖRÜLEN ekran
   giriş ekranıdır. Kart sabit 380 px'ti: 375 px'lik telefonda sayfa yatay
   kayıyordu. */
@media screen and (max-width: 768px) {
  .giris-sayfa { padding: 16px; align-items: flex-start; padding-top: 10vh; }
  .giris-kart { width: min(380px, 100%); padding: 22px 18px; }
}

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 35 — MOBİL DÜZELTMELER (26.09.2026)

   FAZ 34 temeli kurdu (kart görünümü · alt gezinme şeridi · 44 px hedef);
   bu katman aynı gün yapılan denetimde çıkan somut kusurları kapatır:
   yapışkan Kaydet çubuğunun şeridin ALTINDA kalması, 375 px'te kendi içinde
   yatay kayan özet kırılım tabloları, biçimsiz kart açılırı, 29 px'lik ☰,
   kırpılan şirket seçici, betiksiz erişilemeyen menü ve kartta görünmeyen
   "toplama girmeyen satır" işareti.

   ⚠⚠ MASAÜSTÜ VE YAZDIRMA GÖRÜNÜMÜ DEĞİŞMEZ: katmandaki her kural
      "screen and (max-width: …)" sorgusunun İÇİNDEDİR. Koşulsuz bir kural
      yazılsaydı katman en sonda olduğu için masaüstünü de ezerdi (FAZ 13'ün
      "min-width:901px" tuzağının aynası).
   ⚠ Süslü parantez YORUMA DA YAZILMAZ: katmanı regex ile tarayan denetçi
     (testler/test_mobil.py) blok sınırını orada kaybeder.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── 1) Betiksiz menü (≤900 px, menünün itildiği eşikle AYNI) ───────────── */
@media screen and (max-width: 900px) {
  /* ⚠⚠ MENÜ YALNIZ JS İLE AÇILABİLİYORDU. ≤900 px'te menü CSS ile ekran
     dışına itiliyor ve geri getiren tek şey `.acik` sınıfıydı; onu da yalnız
     satır içi `onclick="erp1MenuDegistir()"` ekliyordu. JS çalışmayan
     telefonda alt şeritteki en çok 4 sekme dışında HİÇBİR ekrana
     ulaşılamıyordu ve bunu söyleyen bir işaret de yoktu. Şeridin ☰ düğmesi
     artık bir bağlantıdır (`href="#yanMenu"`); JS varken `return false` ile
     bugünkü akış aynen sürer, adres çubuğuna hash bile yazılmaz.
     ⚠ Kural satır 342'deki `.yan-menu.acik`ten SONRA gelir, yani eşit
       özgüllükte kazanır. Menüdeki bir bağlantıya basılınca yeni sayfa
       hash'siz açılır ve menü kendiliğinden kapanır. */
  .yan-menu:target { left: 0; box-shadow: 0 0 40px rgba(0, 0, 0, .35); }
}

/* ── 2) Mobil kabuk düzeltmeleri (≤768 px) ─────────────────────────────── */
@media screen and (max-width: 768px) {
  /* 2a) YAPIŞKAN KAYDET ÇUBUĞU ALT ŞERİDİN ÜSTÜNE OTURUR.
     ⚠⚠ Çubuk `position: sticky; bottom: 0` ile GÖRÜNTÜ ALANININ dibine
        çivileniyor, şerit ise `position: fixed; bottom: 0; z-index: 40`.
        Çubuğun z-index'i 5 olduğu için 40 px'lik Kaydet çubuğu şeridin
        TAMAMEN ALTINDA kalıyordu (ölçüm: çubuk 440-480, şerit 423-480);
        66 px'lik İthalat teklif çubuğunda ise tepesinden 9 px sızıyor,
        kullanıcı Kaydet'e bastığını sanıyor ve dokunuş şeridin
        BAĞLANTISINA gidiyordu — POST hiç gitmiyor, doldurulmuş form
        kayboluyordu.
     ⚠ `.sayfa`nın 72 px'lik alt boşluğu bunu ÇÖZMEZ: yapışkan öğe kabına
       değil görüntü alanına yapışır, boşluk yalnız kaydırmanın SONUNDAKİ
       hâli kurtarır.
     ⚠ +1 px şeridin `border-top` kenarı içindir. */
  .kart-govde > form > .form-eylemler,
  .it-eylem-cubugu {
    bottom: calc(var(--mobil-serit-h) + 1px + env(safe-area-inset-bottom, 0px));
  }

  /* 2b) ÖZET KIRILIM TABLOSU KENDİ İÇİNDE KAYMAZ.
     ⚠⚠ `.ozet-tablo > table.liste` 380 px taban genişlik taşıyor (satır 635)
        ve FAZ 34 kapsamını bilerek `.liste-govdesi-sarmal` ile sınırladığı
        için bu tablolara dokunmuyordu. 375 px'lik telefonda içerik 343 px:
        Günün Özeti'nin iki kırılım tablosu ile Bakiyeler'in banka/cari
        kırılımı sayfanın EN ÜSTÜNDE, kendi kabında yatay kayıyor ve sağdaki
        PARA sütunu ekran dışında kalıyordu. Kaydırılacak şey SAYFA olur,
        sayfanın üstündeki küçük bir kutu OLMAZ.
     ⚠ `white-space: normal` savunma payıdır: uzun bir kova adı ya da milyar
       mertebesinde bir tutar `nowrap` tabanı 343 px'in üstüne çıkarır.
       `tr.ozet-toplam > td` zaten sarıyor (satır 645), yani bu tablolarda
       sarma davranışı hâlihazırda kabul edilmiş. */
  .ozet-tablo > table.liste { min-width: 0; }
  .ozet-tablo td, .ozet-tablo th { white-space: normal; }

  /* 2c) ÜST ÇUBUK: ☰ 44 px, şirket seçici KIRPILMAZ.
     ⚠ ☰ 29,3 px genişliğindeydi (`.dugme.kucuk` yüksekliği 40, `min-width`
       yok): WCAG 2.5.5'in istediği 44 px'in altında. Yükseklik 40'ta kalır —
       44'e çıkarmak `--h-kabuk`ı da büyütmeyi gerektirirdi.
     ⚠⚠ Şirket seçici sabit 128 px'e kırpılıyordu. Üst çubukta ÜNVAN değil
        KISA AD yazar (`Sirket.__str__`), ama "HAYEK ENERJİ" / "HAYEK MAKİNA"
        gibi ortak önekli kısa adlar 320 px'te ayırt edilemiyordu ve yanlış
        şirkette kayıt yapmak geri alınması zor bir hatadır. Tavan artık
        içeriğe göre büyür; taşma `.bosluk` esnediği için oluşmaz.
     ⚠ Tek şirketli kullanıcıda ad `.kullanici` içinde basılıp gizleniyordu;
       şirketin kısa adı artık sol menü başlığında da yazar (base.html). */
  .ust-cubuk .menu-dugmesi,
  .veri-kart-eylem .dugme.kucuk { min-width: 44px; }
  .ust-cubuk select { max-width: min(46vw, 180px); }

  /* 2c-2) UYGULAMA KİPİ — `html.uygulama-kipi` (_pwa_bas.html) ARTIK BİR ŞEY
     YAPAR. FAZ 34 `viewport-fit=cover` ekledi ve YALNIZ alt güvenli alanı
     hesapladı; ana ekrandan açılan uygulamada tarayıcı çubuğu olmadığı için
     üst çubuk çıkıntılı telefonun DURUM ÇUBUĞUNUN ALTINA kayıyordu.
     ⚠⚠ Kural SINIFA bağlı olmak zorunda: tarayıcı sekmesinde durum çubuğunu
        tarayıcının kendi kabuğu kapatır, oraya da boşluk koymak üst çubuğu
        boşuna büyütürdü. Sınıfın var olma sebebi tam olarak bu ayrımdır. */
  html.uygulama-kipi .ust-cubuk {
    height: calc(var(--h-kabuk) + env(safe-area-inset-top, 0px));
    padding-top: env(safe-area-inset-top, 0px);
  }

  /* 2d) KART AÇILIRI (details) — 44 px dokunma hedefi ve gerçek bir gösterge.
     ⚠⚠ `summary.yardim` 18 px yüksekliğindeydi (12 px yazı × 1.5): Günün
        Özeti kartında sevk edilecek kalemleri görmenin TEK yolu o şerittir ve
        parmakla 18 px'e isabet ettirmek ilk denemede tutmuyordu; ıskalayan
        dokunuş yandaki kart başlığı bağlantısına gidip sipariş detayına
        ışınlıyordu. WCAG 2.5.8'in 24 px tabanı bile karşılanmıyordu.
     ⚠ `list-style: none` konunca tarayıcının üçgeni kaybolur; `::before`
       göstergesi ŞART, yoksa açılır olduğu belli olmaz (aynı çözüm
       `details.it-gecmis` için satır 1039'da var).
     ⚠ `min-height` kullanılır, `height` DEĞİL: "Sevk edilecek kalemler (12)"
       375 px'te iki satıra sarabilir, sabit yükseklik metni kırpardı. */
  .veri-kart details > summary {
    min-height: 44px; display: flex; align-items: center; gap: 8px;
    cursor: pointer; list-style: none;
  }
  .veri-kart details > summary::-webkit-details-marker { display: none; }
  .veri-kart details > summary::before { content: "▸"; color: var(--metin-soluk); }
  .veri-kart details[open] > summary::before { content: "▾"; }

  /* 2e) Kart içi satır formu (satır içi düzenlemenin telefon karşılığı). */
  .veri-kart-form { margin-top: 10px; }
  .veri-kart-form :is(select, input) { width: 100%; min-width: 0; }

  /* 2f) Gövdede kalan yardımcı tablo dar ekranda okunabilsin.
     ⚠ `tablo-mobil-kalsin` tabloyu GÖRÜNÜR yapar ama 5 sütun 343 px'e
       sığmaz; kabın kendi kaydırması olmadan sayfa yatay taşar ve 16 px yan
       boşluk kuralı kırılır. Dosya/tarih kutuları da 110 px taban taşıyor. */
  .liste-govdesi-sarmal .tablo-sarmal.tablo-mobil-kalsin {
    overflow-x: auto; -webkit-overflow-scrolling: touch;
  }
  .tablo-mobil-kalsin :is(input[type=file], input[type=date]) {
    min-width: 0; max-width: 150px;
  }

  /* 2g) ⛔ TOPLAMA GİRMEYEN SATIR KARTTA DA BELLİ OLUR.
     Tabloda soluk + üstü çizili basılıyor (`tr.soluk-satir`); kart generic
     hücre bastığı için müşterinin REDDETTİĞİ / İPTAL edilen fatura telefonda
     geçerli faturadan ayırt edilemiyordu. */
  .veri-kart.kart-gecersiz { opacity: .62; border-left: 3px solid var(--olumsuz); }
  .veri-kart.kart-gecersiz .veri-kart-baslik { text-decoration: line-through; }
}
/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 36 — KİŞİ ARAMA: ARA / MAİL DÜĞMELERİ (26.09.2026)

   MOBİL 2. DALGA. Kişi Arama ekranının (`crm/mobil_gorunumler.py`) ASIL
   DEĞERİ kartın içindeki `tel:` ve `mailto:` düğmeleridir: kullanıcı yolda
   "şu firmadaki satınalmacıyı ara" diyor ve tek dokunuşla arıyor. Düğmeler
   genel kart parçasının satır kancasına (`.veri-kart-form`) basılıyor ve
   ORASI 44 px'lik dokunma hedefi kuralının dışında kalmıştı: FAZ 34 yalnız
   `.veri-kart-eylem .dugme.kucuk`u büyütüyor.

   ⚠⚠ MASAÜSTÜ VE YAZDIRMA GÖRÜNÜMÜ DEĞİŞMEZ: katmandaki kural
      "screen and (max-width: 768px)" sorgusunun İÇİNDEDİR. Koşulsuz
      yazılsaydı katman en sonda olduğu için masaüstündeki tablonun İşlem
      hücresini de ezerdi (aynı düğmeler orada da basılıyor) — FAZ 13'ün
      "min-width:901px" tuzağının aynası.
   ⚠⚠ SEÇİCİ `.dugme.kisi-eylem`, YALNIZ `.kisi-eylem` DEĞİL: `.dugme.kucuk`
      yüksekliği (32 px) satır 229'da İKİ SINIFLA yazılı, yani tek sınıflı bir
      kural özgüllükte YENİLİR ve düğme 32 px kalırdı — WCAG 2.5.5'in istediği
      44 px'in çok altında, hem de parmakla vurulacak tek şeyde.
   ⚠ Süslü parantez YORUMA DA YAZILMAZ: katmanları regex ile tarayan denetçi
     (testler/test_mobil.py, testler/test_mobil_crm.py) blok sınırını orada
     kaybeder.
   ══════════════════════════════════════════════════════════════════════════ */

@media screen and (max-width: 768px) {
  /* 📞 Ara · ✉ Mail · 👤 Kart — parmak 44 px ister (WCAG 2.5.5 / Apple HIG).
     ⚠ Alt boşluk ŞART: üç düğme 375 px'te ikinci satıra sarabilir, sarınca
       birbirine değmemeli. Kabın (`.veri-kart-form`) 10 px üst boşluğu var,
       o yüzden buraya üst boşluk konmaz. */
  .dugme.kisi-eylem { height: 44px; min-width: 44px; margin: 0 6px 6px 0; }
}

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 37 — MOBİL FİŞ FOTOĞRAFI (26.09.2026)

   MOBİL 2. DALGA. FAZ 34 temeli (kart görünümü · alt şerit · 44 px hedef),
   FAZ 35 denetim düzeltmelerini, FAZ 36 Kişi Arama düğmelerini kurdu; bu katman telefonun kamerasıyla fiş
   yükleyen ekranın kendi parçalarını giydirir (`muhasebe:mobil_fis`).

   ⚠⚠ MASAÜSTÜ VE ÖTEKİ EKRANLAR DEĞİŞMEZ. Katmandaki her kural ya
      "screen and (max-width: …)" sorgusunun içindedir ya da YALNIZ bu
      katmanda tanımlanan yeni `.fis-*` sınıflarına dokunur — o sınıflar
      tek bir şablonda geçer (`templates/muhasebe/fis_fotografi.html`).
      FAZ 34 aynı gerekçeyi `.kart-liste / .mobil-serit / .menu-perde` için
      yazmıştı; koşulsuz ve GENEL bir seçici yazılsaydı katman en sonda
      olduğu için masaüstünü de ezerdi (FAZ 13'ün "min-width:901px" tuzağı).
   ⚠ Eşik yine 768 px: üçüncü bir sayı girmek şablondaki
     `data-mobil-esik` işaretini yanıltıcı yapar (`testler/test_mobil`).
   ⚠ Süslü parantez YORUMA DA YAZILMAZ: katmanı regex ile tarayan denetçi
     blok sınırını orada kaybeder.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── 1) Dosya seçme düğmeleri ────────────────────────────────────────────── */
/* ⚠⚠ DOSYA KUTUSU `hidden` DEĞİL: `hidden` / `display:none` verilen bir kutu
   KLAVYEYLE ODAKLANILAMAZ ve sekme tuşuyla gezen kullanıcı "📷 Fotoğraf çek"
   düğmesini hiç bulamaz. Kutu görsel olarak gizlenir (1 px + saydam), odak
   halkasını taşıyan etiketin kendisi olur. */
.fis-kutu {
  position: absolute;
  width: 1px; height: 1px;
  opacity: 0;
  pointer-events: none;
}
.fis-secim { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 0; }
/* ⚠⚠ `.dugme[hidden]` ŞART: `.dugme { display: inline-flex }` YAZAR stilidir ve
   tarayıcının `[hidden] { display: none }` kuralını EZER — "✕ Kuyruğu boşalt"
   düğmesi kuyruk boşken de görünüyordu (gerçek tarayıcıda ölçüldü). Depoda
   aynı tuzak üç kez daha yaşandı: `.form-izgara .alan[hidden]`,
   `.form-bant[hidden]`, `.rozet[hidden]`. */
.fis-secim .dugme[hidden] { display: none; }
/* ⚠ Etiket `.dugme` görünümünü taşır; `position: relative` içindeki saydam
   kutuyu düğmenin içinde tutar (sayfanın başına kaçmasın). */
.fis-dugme { position: relative; }
.fis-dugme:focus-within {
  outline: 2px solid var(--vurgu);
  outline-offset: 2px;
}

/* ── 2) Durum satırı ve kuyruk ───────────────────────────────────────────── */
.fis-durum {
  margin: 10px 0 0;
  font-size: .85rem;
  color: var(--metin-soluk);
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
}
.fis-durum:empty { display: none; }
.fis-kuyruk { list-style: none; margin: 10px 0 0; padding: 0; }
.fis-kuyruk:empty { display: none; }
/* ⚠ Izgara: ad esner, durum sabit sütun, ilerleme çubuğu ve not ALT SATIRA
   tam genişlikte geçer (uzun dosya adı durumu ekran dışına itmesin). */
.fis-satir {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2px 10px;
  padding: 8px 0;
  border-top: 1px solid var(--kenar);
  font-size: .85rem;
}
.fis-satir:first-child { border-top: 0; }
.fis-ad { overflow-wrap: anywhere; font-weight: 600; }
.fis-satir-durum { white-space: nowrap; color: var(--metin-soluk); }
.fis-cubuk {
  grid-column: 1 / -1;
  height: 4px;
  border-radius: 2px;
  background: var(--kenar);
  overflow: hidden;
}
.fis-dolgu { display: block; height: 100%; width: 0; background: var(--vurgu); }
.fis-not { grid-column: 1 / -1; font-size: .78rem; color: var(--metin-soluk); }
/* ⚠ Bitmiş ve hatalı satır TEK BAKIŞTA ayrılır: gönderim sırasında kullanıcı
   listeye bakıp hangisinin kaldığını görmek ister. */
.fis-tamam .fis-satir-durum { color: var(--olumlu); }
.fis-tamam .fis-dolgu { background: var(--olumlu); }
.fis-hata .fis-satir-durum, .fis-hata .fis-not { color: var(--olumsuz); }
.fis-hata .fis-dolgu { background: var(--olumsuz); }

/* ── 3) Liste tablosu ────────────────────────────────────────────────────── */
/* ⚠ Genel `.tek-satir` kuralı YALNIZ `#belgeTablosu` içinde tanımlı; bu
   ekranın tablosu kendi kuralını taşır (tarih ve durum hücresi sarmasın). */
.fis-liste td.tek-satir { white-space: nowrap; }

/* ── 4) Telefon (≤768 px) ────────────────────────────────────────────────── */
@media screen and (max-width: 768px) {
  /* ⚠⚠ DÜĞMELER TAM GENİŞLİK: 375 px'te "📷 Fotoğraf çek" · "🖼 Galeriden
     seç" · "⬆ Gönder (3)" yan yana sığmaz, sığdırılmaya çalışılınca
     44 px'lik dokunma hedefi daralır ve kullanıcı yanlış düğmeye basar.
     Kamerayla yanlışlıkla "Gönder"e basmak partiyi yarım gönderirdi. */
  .fis-secim { flex-direction: column; align-items: stretch; }
  .fis-secim :is(.dugme, .fis-dugme) { width: 100%; justify-content: center; }
  /* ⚠ Kuyruk satırı telefonda daha ferah: parmakla okunacak. */
  .fis-satir { padding: 10px 0; font-size: .88rem; }
  .fis-cubuk { height: 6px; }
}

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 38 — MOBİL 2. DALGA: SİPARİŞ (26.09.2026)

   1. dalga temeli kurdu (kart görünümü · alt gezinme şeridi · 44 px hedef ·
   yapışkan Kaydet çubuğu) ama YALNIZ LİSTE ekranlarını kapsadı. Kullanıcının
   telefonda en çok emek istediği iş SİPARİŞTİ ("sipariş görüntüleme ve
   girişi") ve o iş iki ekranda geçiyor: sipariş DETAYI (10 sütunlu kalem
   tablosu) ve sipariş FORMU (11 sütunlu, 1180 px taban genişlikli kalem
   ızgarası). İkisi de 375 px'te kendi kabında yatay kayıyordu; formda
   "Satır toplamı" ve "Sil" ekran dışında kalıyor, detayda sipariş toplamı
   hiç görünmüyordu.

   ⚠⚠ MASAÜSTÜ VE YAZDIRMA GÖRÜNÜMÜ DEĞİŞMEZ. Aşağıdaki her kural ya
      "screen and (max-width: …)" sorgusunun İÇİNDEDİR ya da YALNIZ bu
      katmanda tanımlanan yeni sınıflara dokunur (.mobil-cari-liste ·
      .mobil-cari-secili · .taslak-serit). Koşulsuz genel bir kural yazılsaydı
      katman en sonda olduğu için masaüstünü de ezerdi (FAZ 13'ün
      "min-width:901px" tuzağının aynası).
   ⚠⚠ "screen and" ŞART: sorgular yalnız max-width ile yazılsaydı dar kâğıda
      yazdırırken de uygulanır ve sipariş dökümü kart görünümüne dönerdi.
   ⚠ Süslü parantez YORUMA DA YAZILMAZ: katmanı regex ile tarayan denetçi
     (testler/test_mobil.py, testler/test_mobil_siparis.py) blok sınırını
     orada kaybeder.
   ⚠⚠ SUNUCUDA HİÇBİR ŞEY DEĞİŞMEZ. Kalem kartı da tablo da AYNI sayfada,
      AYNI formsetten / AYNI kalem demetinden basılır; hangisinin görüneceğine
      yalnız burası karar verir. "Telefon sürümü" diye ayrı bir veri yolu ya
      da ayrı bir form YAZILMAMIŞTIR — sipariş girişi para ve stok etkileyen
      bir iştir, iki ayrı hesap iki ayrı gerçek demektir.
   ══════════════════════════════════════════════════════════════════════════ */

/* Telefona özel iki parça masaüstünde ve yazdırmada HİÇ görünmez.
   ⚠ FAZ 34'ün ".kart-liste, .mobil-serit, .menu-perde" satırıyla aynı gerekçe:
     parçalar sayfada HER ZAMAN basılır (betik onları kurar), görünürlük
     kararı tek yerde durur. Masaüstünde müşteri kutusu bugünkü gibi çalışır —
     yazarak süzülen açılır liste. */
.mobil-cari-liste, .mobil-cari-secili { display: none; }

/* 📝 TASLAK ŞERİDİ — telefonda da bilgisayarda da görünür (BİLEREK).
   ⚠ Tarayıcı çökmesi, sekme kapanması ve "yanlışlıkla geri" masaüstünde de
     oluyor; şerit yalnız taslak VARSA basılıyor, yoksa `hidden` duruyor.
   ⚠ `[hidden]` kuralı ŞART: `display: flex` tarayıcının kendi
     "hidden = display none" kuralını EZER ve şerit boş boş görünürdü. */
.taslak-serit { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.taslak-serit[hidden] { display: none; }

/* ── 1) SİPARİŞ DETAYI: kalemler telefonda KART ─────────────────────────── */
@media screen and (max-width: 768px) {
  /* ⚠⚠ Kapsam ".kalem-kart-sarmal" ile SINIRLI (FAZ 34'ün
     ".liste-govdesi-sarmal" kuralıyla aynı gerekçe): sayfadaki başka hiçbir
     tabloya dokunulmaz — üstteki özet kartları ve "Sipariş bilgileri" kartı
     olduğu gibi kalır.
     ⚠ Kart listesi yoksa (şablon onu basmadıysa) tablo telefonda da görünür:
       hiçbir ekran veri kaybetmez. */
  .kalem-kart-sarmal > .kart-liste ~ .tablo-sarmal { display: none; }

  /* ⚠⚠ TOPLAM KARTI AYIRT EDİLİR. Tablonun `tfoot`u (MAL TUTARI · İskonto ·
     Net · KDV · GENEL TOPLAM) gizlenen kabın içinde kalıyor; son kart onun
     yerini tutuyor. Kalem kartlarıyla aynı görünseydi kullanıcı onu 11.
     kalem sanardı. */
  .veri-kart.kalem-toplam-kart { border-left: 3px solid var(--vurgu); }
  .veri-kart.kalem-toplam-kart .veri-kart-govde dd { font-weight: 600; }
}

/* ── 2) SİPARİŞ FORMU: kalem satırı telefonda KART ──────────────────────── */
@media screen and (max-width: 768px) {
  /* Kap: çerçeve ve İÇ KAYDIRMA kalkar — kartlar sayfanın kendi genişliğinde
     alt alta dizilir, kaydırılacak şey SAYFA olur.
     ⚠ ".tablo-sarmal" tabanı "width: max-content" taşıyor (satır 545): kalkmazsa
       ızgara 1180 px'lik tablo genişliğinde kalırdı. */
  .kalem-sarmal {
    width: auto; overflow-x: visible;
    border: 0; background: none; box-shadow: none; border-radius: 0;
  }
  /* ⚠⚠ `display: block` zinciri: tablo → tbody → satır. Biri atlanırsa
     tarayıcı tablo düzenini sürdürür ve ızgara hiç kurulmaz.
     ⚠ `thead` GİZLENİR: başlıklar artık her hücrenin üstünde, `data-etiket`
       özniteliğinden basılıyor (`_siparis_kalem_satiri.html`). */
  .kalem-sarmal > table.liste,
  .kalem-sarmal > table.liste > tbody { display: block; width: auto; min-width: 0; }
  .kalem-sarmal > table.liste > thead { display: none; }

  /* Her kalem BİR KART: iki sütunluk ızgara. */
  .kalem-sarmal tr.kalem-satiri {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 12px;
    padding: 12px 14px;
    margin-bottom: 10px;
    background: var(--kart);
    border: 1px solid var(--kenar);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
  }
  /* ⚠ Tablonun `tr:hover` zemini kartta anlamsız (dokunmalı ekranda "hover"
     dokunuştan sonra YAPIŞIR ve kart seçili görünür). */
  .kalem-sarmal tr.kalem-satiri:hover { background: var(--kart); }

  /* Hücre → etiketli alan. Tablonun kompakt ölçüleri ve KIRPMA kuralı
     (`max-width: 300px` + ellipsis, satır 259) burada tümüyle kalkar: kartın
     derdi uzun metni sığdırmak değil OKUTMAKTIR. */
  .kalem-sarmal tr.kalem-satiri > td {
    display: block; height: auto; padding: 0;
    border: 0; max-width: none; overflow: visible;
    white-space: normal; text-align: left;
  }
  /* ⚠⚠ ETİKET `data-etiket`TEN GELİR. `thead` gizli olduğu için başka
     kaynağı yok; öznitelik satır şablonunda duruyor ve hücrenin yeri
     `nth-child` ile değil SINIFLA belirleniyor — tabloya sütun eklendiğinde
     kart düzeni sessizce kaymasın. */
  .kalem-sarmal tr.kalem-satiri > td::before {
    content: attr(data-etiket);
    display: block;
    margin-bottom: 3px;
    font-size: .72rem; font-weight: 600; color: var(--metin-soluk);
  }
  /* ⚠ ".tablo-sarmal input … min-width: 110px" (satır 338) kartta 110 px'lik
     bir taban dayatıyor ve iki sütunluk ızgarayı taşırıyordu. */
  .kalem-sarmal tr.kalem-satiri :is(input, select, textarea) {
    width: 100%; min-width: 0;
  }

  /* TAM SATIR kaplayanlar: kart başlığı, uzun metinler, fiyat ve açıklama.
     ⚠ Sıra: başlık · ürün kodu · ürün adı · [miktar | birim] · birim fiyat ·
       [isk | kdv] · açıklama · [satır toplamı | sil]. Kullanıcının istediği
       akış budur: "ürün arama → miktar → birim fiyat". */
  .kalem-sarmal tr.kalem-satiri
    > td:is(.h-sira, .h-kod, .h-ad, .h-fiyat, .h-aciklama) {
    grid-column: 1 / -1;
  }
  /* Kart başlığı "Kalem 3": etiket ile sayı YAN YANA, altında ayırıcı çizgi.
     ⚠ Seçici `> td.h-sira` (üç sınıf): yukarıdaki "border: 0" kuralı daha
       özgül olduğu için yalnız `.h-sira` yazmak çizgiyi bastırmıyordu. */
  .kalem-sarmal tr.kalem-satiri > td.h-sira {
    padding-bottom: 6px;
    border-bottom: 1px solid var(--kenar);
    font-weight: 600;
  }
  .kalem-sarmal tr.kalem-satiri > td.h-sira::before {
    display: inline; margin: 0 4px 0 0;
  }
  .kalem-sarmal tr.kalem-satiri > td.h-toplam { font-weight: 600; }
  /* ⚠ Sil kutusu 20 px: 12 px'lik varsayılan onay kutusuna parmakla isabet
     etmiyordu (FAZ 34 aynı ölçüyü `.onay-kutusu` için koymuştu). */
  .kalem-sarmal tr.kalem-satiri > td.h-sil input[type=checkbox] {
    width: 20px; height: 20px;
  }
  /* Hata iletisi hücrenin altında, kırpılmadan. */
  .kalem-sarmal tr.kalem-satiri > td .hata { white-space: normal; margin-top: 2px; }

  /* TOPLAM ÖNİZLEMESİ (Mal tutarı … GENEL TOPLAM) kendi içinde kaymaz.
     ⚠⚠ Tabloda satır içi `max-width: 420px` var ve `.tablo-sarmal` tabanı
        "width: max-content": 375 px'lik telefonda kutu 420 px kalıp sağdaki
        SAYI sütununu ekran dışına atıyordu, yani "GENEL TOPLAM" hiç
        görünmüyordu. */
  .toplam-sarmal { width: 100%; }
  .toplam-sarmal > table.liste { width: 100%; min-width: 0; }
  .toplam-sarmal > table.liste td { white-space: normal; }

  /* YAPIŞKAN KAYDET ÇUBUĞU — bu formda HİÇ YOKTU.
     ⚠⚠ FAZ 35 (2a) çubuğu ".kart-govde > form > .form-eylemler" seçicisiyle
        alt şeridin üstüne çıkardı; sipariş formu O KALIBA UYMUYOR: form kartın
        İÇİNDE değil, kartları SARIYOR (`<form id="siparisFormu">` → `.kart` …
        → `.form-eylemler`). Yani 20 kalemlik bir siparişte "Kaydet"i bulmak
        için sayfanın en dibine kaydırmak gerekiyordu.
     ⚠ Çubuk alt gezinme şeridinin ÜSTÜNE oturur; +1 px şeridin `border-top`
       kenarı içindir. Karar `bottom` hesabıyla verilir, `z-index` ile DEĞİL:
       şerit `position: fixed` ve z-index 40, altına inmeye çalışmak yerine
       üstünde durulur (FAZ 35'in aynı çözümü).
     ⚠ İki düğme eşit genişlikte uzar: 375 px'te "Kaydet" ve "Vazgeç" içerik
       genişliğinde kalınca sol köşede sıkışıyordu. */
  /* ⚠⚠ YEREL SATINALMA FORMU DA KAPSAM İÇİNDE (01.10.2026):
   yapışkan Kaydet çubuğu KİMLİĞE göre kuruluyor ve yeni formun
   kimliği `yerelSatinalmaFormu`. Eklenmeyince telefonda Kaydet
   düğmesi sayfanın en altında kalıyor, 30 kalemlik siparişte
   kullanıcı onu bulamıyordu. Seçici listesine eklemek, sona
   yeni bir katman yazmaktan daha az yüzeydir: aynı kuralın
   ikinci kopyası ileride biri değişince ayrışırdı. */
#siparisFormu > .form-eylemler,
#yerelSatinalmaFormu > .form-eylemler {
    position: sticky;
    bottom: calc(var(--mobil-serit-h) + 1px + env(safe-area-inset-bottom, 0px));
    z-index: 6;
    margin: 12px 0 0;
    padding: 8px 12px;
    background: var(--kart);
    border: 1px solid var(--kenar);
    border-radius: var(--yuvarlak);
    box-shadow: 0 -2px 10px rgba(18, 28, 45, .08);
  }
  #siparisFormu > .form-eylemler .dugme,
#yerelSatinalmaFormu > .form-eylemler .dugme { flex: 1 1 0; justify-content: center; }
}

/* ── 3) DOKUNMALI MÜŞTERİ LİSTESİ ───────────────────────────────────────── */
@media screen and (max-width: 768px) {
  /* ⚠⚠ NEDEN VAR: masaüstündeki süzme uymayan seçenekleri `option.hidden` ile
     saklıyor, ama telefon tarayıcıları listeyi İŞLETİM SİSTEMİNİN seçicisinde
     açar ve orada `hidden` güvenilir değildir (iOS Safari yıllarca hiç
     uygulamadı): kullanıcı "ACM" yazıp seçiciyi açınca karşısında yine 500
     müşterinin tamamını buluyordu. Yanlış müşteriye sipariş açmak geri
     alınması zor bir hatadır.
     ⚠ Liste ARAMA KUTUSUNUN HEMEN ALTINDA durur (betik oraya yerleştirir):
       parmak orada, gözün gitmesi gereken yer de orası.
     ⚠ Hangi müşterinin uyduğuna yine şablonun `firmaSuz()` işlevi karar
       verir; betik yalnız sonucu okur (`static/erp1/mobil_siparis.js`). */
  .mobil-cari-liste {
    display: flex; flex-direction: column;
    max-height: 46vh; overflow-y: auto; -webkit-overflow-scrolling: touch;
    margin: 6px 0 0;
    background: var(--kart);
    border: 1px solid var(--kenar);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
  }
  /* ⚠ `[hidden]` kuralı ŞART: `display: flex` tarayıcının kendi
     "hidden = display none" kuralını ezer ve boş kutu ekranda kalırdı. */
  .mobil-cari-liste[hidden] { display: none; }
  /* ⚠ 44 px dokunma hedefi (WCAG 2.5.8): iki müşteri adı arasında parmak
     kayması yanlış cariyi seçtirir. `min-height` kullanılır, `height` DEĞİL —
     uzun bir ünvan iki satıra sarabilir. */
  .mobil-cari-oge {
    min-height: 44px;
    display: flex; align-items: center;
    padding: 8px 12px;
    background: none; border: 0; border-bottom: 1px solid var(--kenar);
    font: inherit; font-size: .88rem; text-align: left; color: var(--metin);
    cursor: pointer; overflow-wrap: anywhere;
  }
  .mobil-cari-oge:last-child { border-bottom: 0; }
  .mobil-cari-oge:active { background: var(--vurgu-acik); }
  .mobil-cari-bos { padding: 12px; color: var(--metin-soluk); font-size: .82rem; }
  /* Seçili müşteri, açılır listeyi açmadan görünür (düzenleme formunda da). */
  .mobil-cari-secili { display: block; margin-top: 4px; }
}

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 39 — MOBİL 2. DALGA DENETİM DÜZELTMELERİ (26.09.2026)

   2. dalganın (FAZ 36/37/38) ardından yapılan ölçümlerde bulunan TAŞMALAR ve
   DOKUNMA HEDEFLERİ. Katman dosyanın SONUNDADIR ve her kuralı
   `@media screen and (max-width: 768px)` içindedir: koşulsuz yazılan bir kural
   en son katmanda masaüstünü de ezer (FAZ 13'ün `min-width:901px` tuzağı).
   ⚠ Yorumlarda SÜSLÜ PARANTEZ YOK: katmanı regex ile tarayan denetçiler
     (`testler/test_mobil*.py`) blok sınırını orada kaybeder.
   ══════════════════════════════════════════════════════════════════════════ */
@media screen and (max-width: 768px) {
  /* ── 1) KART BAŞLIĞI SARAR ────────────────────────────────────────────────
     ⚠⚠ ÖLÇÜLDÜ: sipariş detayının başlık çubuğu DÖRT düğme taşıyor (Yazdır ·
        PDF indir · Düzenle · Listeye dön). `.kart-basi` flex ama `flex-wrap`
        YOK, `.dugme` ise `white-space: nowrap` — düğmeler ne daralıyor ne
        sarıyordu. 375 px'lik telefonda kullanılabilir 317 px'e karşı ~421 px
        isteniyor, yani SAYFA yatay kayıyor ve FAZ 34'ün 16 px yan boşluk
        sözleşmesi kırılıyordu.
     ⚠ Boşluk öğesi (`span[style*="flex"]`) telefonda düşer: `flex: 1`
       bastırılmazsa sarma açıldıktan sonra da düğmeler başlıkla aynı satıra
       paketlenmez. */
  .kart-basi { flex-wrap: wrap; row-gap: 8px; }
  .kart-basi > span[style*="flex"] { display: none; }

  /* ── 2) SİPARİŞ ÖZETİNİN KIRILIM TABLOSU ──────────────────────────────────
     ⚠⚠ ÖLÇÜLDÜ: beş sütunun üçü PARA sütunu ve rakamların içinde kırılma
        noktası yok. 375 px'te tablo 378 px istiyor (10 binli tutarlardan
        itibaren taşıyor) ve `.ozet-tablo`nun kendi `overflow-x: auto`su
        devreye giriyor — en sağdaki "Genel toplam" sütunu GÖRÜNMÜYOR. FAZ
        35'in (2b) `white-space: normal` kuralı bunu kurtaramıyordu: rakam
        sarmıyor, üstelik o kural `table.liste tbody td` (nowrap) tarafından
        ÖZGÜLLÜKLE eziliyor.
     ⚠⚠ SEÇİCİ `table.liste`Yİ İÇERMEK ZORUNDA: `.ozet-tablo-siparis .h-net`
        (0,2,0) `table.liste tbody td` (0,1,3) karşısında zayıf kalır — FAZ
        35'in ölü kuralını doğuran tuzağın aynısı.
     ⚠ Telefonda düşen sütunlar zaten kartlarda ve açıklama satırında var;
       Genel toplam = mal tutarı + KDV. */
  .ozet-tablo-siparis table.liste th.h-net,
  .ozet-tablo-siparis table.liste td.h-net,
  .ozet-tablo-siparis table.liste th.h-kdv,
  .ozet-tablo-siparis table.liste td.h-kdv { display: none; }

  /* ── 3) İŞLETİM SİSTEMİNİN MÜŞTERİ KUTUSU TELEFONDA GİZLENİR ──────────────
     ⚠⚠ Dokunmalı liste eklendi ama tuzağın KAYNAĞI olan açılır kutu görünür
        kalmıştı: kullanıcı "ACM" yazıp alışkanlıkla kutuya dokunuyor, iOS
        `option.hidden`ı uygulamadığı için karşısında YİNE 500 müşterinin
        tamamı geliyordu — `mobil_siparis.js`in var olma sebebi olan hata bir
        dokunuş uzaklıktaydı.
     ⚠ Sınıf BETİKTEN konur (`form.classList.add("mobil-cari-var")`): betik
       çalışmazsa kutu görünür kalır ve müşteri elle seçilebilir (aşamalı
       gelişim). `display: none` güvenlidir — arama kutusu gerçek bir `input`,
       liste öğeleri gerçek `button`, yani klavye/ekran okuyucu yolu kapanmaz;
       form `novalidate` olduğu için Chrome'un "invalid control is not
       focusable" sessiz gönderim kilidi de tetiklenmez.
     ⚠ Gizli kutunun sayacı ("N müşteri görünüyor") da düşer: görünmeyen bir
       denetimin sayısı yanıltıcıdır. */
  #siparisFormu.mobil-cari-var #firmaSecim { display: none; }
  #siparisFormu.mobil-cari-var #firmaSayaciSatiri { display: none; }
  /* ⚠ Liste klavye açıkken de okunur: `dvh` gerçek görünür yüksekliği verir,
     desteklemeyen tarayıcı `46vh` yedeğine düşer. */
  .mobil-cari-liste { max-height: 46vh; max-height: min(46vh, 46dvh); }

  /* ── 4) "SİL" ONAY KUTUSUNUN DOKUNMA HEDEFİ ───────────────────────────────
     ⚠⚠ Kalem kartındaki tek YIKICI denetim 20x20 px'lik bir onay kutusuydu:
        WCAG 2.5.8'in 24 px tabanının altında ve etiket bir `::before` sözde
        öğesi olduğu için ona dokunmak hiçbir şey yapmıyordu. Kutu artık
        örtülü bağlı bir `<label>` içindedir ve hedef 44 px'e çıkar.
     ⚠ Negatif dış boşluk 44 px'lik hedefin kart ızgarasının satır ritmini
       bozmasını engeller. */
  .kalem-sarmal tr.kalem-satiri > td.h-sil .sil-kutusu {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 44px; min-height: 44px;
    margin: -6px 0;
    cursor: pointer;
  }
  .kalem-sarmal tr.kalem-satiri > td.h-sil input[type=checkbox] {
    width: 24px; height: 24px;
  }

  /* ── 5) GÖNDERİM SÜRERKEN SAYFADAN ÇIKIŞ ──────────────────────────────────
     ⚠⚠ Fiş fotoğrafı kuyruğu YALNIZ bellekte durur ve `beforeunload` kurulu
        PWA'da (iOS ana ekran kısayolu, standalone kip) onay penceresi
        AÇMIYOR: alt şeritteki bir sekmeye dokunmak süren yüklemeyi iptal
        ediyor ve kuyrukta bekleyen fotoğraflar kayboluyordu. Gönderim
        sürerken sayfa içi çıkışlar SOLUKLAŞIR ve dokunulamaz olur; kilidin
        klavye ayağı betikte (`aria-disabled` + yakalayıcı fazda iptal).
     ⚠ Sınıf gövdeye betik koyar/kaldırır (`fis-gonderiliyor`). */
  body.fis-gonderiliyor .mobil-serit { pointer-events: none; opacity: .5; }
  body.fis-gonderiliyor .yan-menu a,
  body.fis-gonderiliyor .sayfa-eylemleri a { pointer-events: none; opacity: .55; }
}

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 6 — ARAYÜZ TURU 3: DİKEY BÜTÇE ve HİYERARŞİ (26.09.2026)
   (plandaki ad "FAZ 6"dır — `_erp1_denetim/arayuz_plani.md` §3. 16.09.2026'nın
    "FAZ 6 — SOL MENÜ: AÇIK TEMA" katmanıyla karıştırılmasın; o katman sol
    menünün AÇIK denemesiydi ve FAZ 6c ile koyuya döndürüldü.)

   ⚠⚠ KULLANICI ŞİKÂYETİ: "Bizim ERP hâlâ çok karışık. Tabloya bakınca ne
      istediğimi ARAMAK değil, ilk bakışta HÂKİM olmak istiyorum."
      İlk iki tur yoğunluğu düzeltti (satır 26 px, kompakt tablo) ama şikâyeti
      çözmedi: sorun yoğunluk değil DİKEY BÜTÇE ve HİYERARŞİ.
      Ölçüm (arayuz_plani.md §8, 1600x950): 14 ekranın 8'inde ilk veri satırı
      320 px'in ALTINDA; Bordro'da 882 px ve ilk ekranda GÖRÜNEN SATIR 1.

   BU KATMAN İSKELETTİR: 47 liste ekranı `templates/arayuz/liste.html`ı
   genişletiyor, hepsi `base.html`in sayfa başını kullanıyor. Burada doğru
   yapılan şey 47 ekranda birden düzelir. Ekrana özel kart ve açıklama
   taşımaları 2. faz ajanlarının işidir.

   İÇİNDEKİLER
     1. K2 — punto ölçeği (yalnız :root değişkeni; ekran başına punto YOK)
     2. K1 — başlık şeridi tek satır + ⓘ açılır kutusu
     3. K1.4 — kırılım tablosu kabuğu (2. faz ajanlarının saracağı yer)
     4. K1.5 — süzgeç çubuğu tek satır
     5. K3 — tablo disiplini (tabular-nums, zebra yok, para ayracı, durum noktası)
     6. K3 — satır içi düğme duvarı: satır tıklanır + tek ›
     7. K4 — genişlik içeriğe göre (1360 px, sola yaslı)
     8. K6 — sol menü 212 px

   ⚠⚠ MOBİLE DOKUNULMAZ (kullanıcı 26.09.2026'da mobil işini durdurdu). Bu
      katman erp1.css'in SONUNDA olduğu için koşulsuz yazılan her ölçü, FAZ 34
      ve FAZ 35'in `max-width: 768px` kurallarını EZER. Bu yüzden mobil
      katmanın da verdiği her özellik `min-width: 769px` içine alınmıştır
      (bölüm 7 ve 8, ayrıca bölüm 1 ve 4'ün ölçü satırları). 769 sayısı yeni
      bir eşik değil, 768'in bir üstüdür; `testler/test_mobil.py` eşikleri
      `max-width` sorgularından okuduğu için etkilenmez.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── 1. K2 · PUNTO HİYERARŞİSİ — bir kez, her ekranda aynı ──────────────────
   Plandaki tablo: sayfa başlığı 18/600 · panel-bölüm başlığı 13/600 · tablo
   sütun başlığı 12/600 · tablo verisi 13/400 · ikincil-yardım-birim 11,5/400
   soluk · kart sayısı 20/600.
   ⚠ Sütun başlığı (--fs-xs) ve tablo verisi (--fs-sm) FAZ 3'te doğru ölçüde;
     eksik olan üç rol burada değişken kazanır. EKRAN BAŞINA PUNTO SEÇMEK
     YASAK — yeni bir ekran punto isterse buradaki role bağlanır, kendi sayısını
     yazmaz. */
:root {
  --fs-sayfa-baslik: 1.125rem;   /* 18 — sayfa başlığı  */
  --fs-bolum-baslik: .8125rem;   /* 13 — panel / kart bölüm başlığı */
  --fs-ikincil: .71875rem;       /* 11,5 — yardım, birim, kırıntı, ikincil */
  --fs-yogun: .75rem;            /* 12 — 14+ sütunlu muhasebe belge ailesi */
}
.sayfa-basi h1 { font-size: var(--fs-sayfa-baslik); }
.kart-basi { font-size: var(--fs-bolum-baslik); font-weight: var(--fw-orta); }
/* ⚠ `.bolum-basligi` AYNI ROLDUR (erp1.css:739 yorumu: "Liste icindeki ara
   bolum basligi") ama 16 px/700 + 18 px ust bosluk ile ayri bir olcude
   kalmisti: ayni ekranda "➕ Yeni Hesap Ekle" 13/600, 30 px altindaki
   "Tanimli Hesaplar" 16/700 gorunuyordu. Rol tek yerden gelir; ust bosluk da
   bant ritmine (--b3) girer, boylece tablonun ustundeki bant ~50 px'ten
   ~35 px'e iner. */
.bolum-basligi {
  margin: var(--b3) 0 var(--b2);
  font-size: var(--fs-bolum-baslik); font-weight: var(--fw-orta);
}
.sayfa-basi .kirinti,
.ozet-kart .etiket,
.ozet-kart .yardim,
.yardim,
.sayfalama .bilgi { font-size: var(--fs-ikincil); }
/* FAZ 4d'nin "bu ekranda yazı 12 px" kuralı ROLE bağlanır: sayı artık tek
   yerde, şablonda ya da ekran bloğunda tekrar edilmez. Ölçü AYNI kalır.
   ⚠⚠ SECICI `table.liste#belgeTablosu` — `.sayfa:has(...) table.liste` DEGIL
      (26.09.2026 denetimi): torun secicisi ekranin USTUNDEKI kirilim
      tablosunu da 12 px yapiyordu, oysa ayni tablo oteki ~18 ekranda 13 px.
      "Her ekranda ayni punto" (K2) tam bu tabloda bozuluyordu. */
table.liste#belgeTablosu { font-size: var(--fs-yogun); }

/* ── 2. K1 · BAŞLIK ŞERİDİ TEK SATIR + ⓘ AÇILIR KUTUSU ─────────────────────
   Alt açıklama cümlesi (`alt_baslik`, `arayuz/gorunumler.py:365`) ve ekrana
   özel kalıcı paragraflar artık başlığın yanındaki ⓘ kutusundadır
   (`base.html` → `details.sayfa-bilgi`, blok adı `sayfa_bilgi`).
   ⚠⚠ METİN SİLİNMEZ: kutu kapalıyken de DOM'da durur.
   ⚠ Kutu MUTLAK konumludur — açılınca tabloyu aşağı İTMEZ. Akışta olsaydı
     "ilk veri satırı 320 px'in üstünde" kuralı ⓘ her açılışta bozulurdu. */
.sayfa-basi .sayfa-bilgi { position: relative; flex: 0 0 auto; }
.sayfa-bilgi > summary {
  list-style: none; cursor: help;
  width: 20px; height: 20px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%;
  color: var(--metin-soluk); font-size: var(--fs-md); line-height: 1;
}
.sayfa-bilgi > summary::-webkit-details-marker { display: none; }
.sayfa-bilgi > summary:hover,
.sayfa-bilgi[open] > summary { background: var(--uzerinde); color: var(--vurgu-koyu); }
/* Klavyeyle gezen kullanıcı ⓘ'nın üzerinde olduğunu görsün (düğme kuralı FAZ 7). */
.sayfa-bilgi > summary:focus-visible { outline: 2px solid var(--odak); outline-offset: 1px; }
.sayfa-bilgi-govde {
  position: absolute; z-index: 60; top: calc(100% + 6px); left: 0;
  width: min(620px, 92vw); max-height: 60vh; overflow: auto;
  padding: var(--b3) var(--b4);
  background: var(--kart); border: 1px solid var(--kenar);
  border-radius: var(--r-kart);
  box-shadow: var(--golge-acilir, 0 8px 24px rgba(34, 53, 72, .16));
  font-size: var(--fs-sm); line-height: 1.5; color: var(--metin);
  white-space: normal; text-align: left; font-weight: var(--fw-normal);
}
.sayfa-bilgi-govde > * + * { margin-top: var(--b3); }
/* FAZ 3b `.sayfa-basi .ust-alt`ı esnek satır öğesi yapıp 11 px'e indiriyordu;
   kutunun içinde okunacak bir cümledir, gövde puntosunda durur. */
.sayfa-bilgi-govde .ust-alt {
  margin: 0; font-size: var(--fs-sm); line-height: 1.5; color: var(--metin);
}
/* ⚠ Kutunun içinde taşınan uyarı bloğu tabloyu taklit etmesin. */
.sayfa-bilgi-govde :is(p, ul, ol) { margin: 0; }
.sayfa-bilgi-govde ul, .sayfa-bilgi-govde ol { padding-left: var(--b5); }
/* ⚠⚠ BOŞSA ⓘ HİÇ GÖRÜNMEZ. `base.html` gövdeyi TEK SATIRDA basar; iki kaynak
   da boşsa `:empty` tutar. Yön bilerek böyle: emin olunamayan durumda düğme
   GÖRÜNÜR kalır, yani hiçbir metin gizlenmiş olmaz. */
.sayfa-basi .sayfa-bilgi:has(> .sayfa-bilgi-govde:empty) { display: none; }

/* ── 3. K1.4 · KIRILIM TABLOSU KABUĞU — 2. faz ajanlarının saracağı yer ────
   Ekran ajanı, `liste_ustu` bloğundaki var olan `.ozet-tablo`yu şu kabuğa
   sarar (tablonun kendi markup'ı DEĞİŞMEZ):
     details sınıfı `ozet-kirilim`, içinde summary = tek satır özet şeridi,
     ardından var olan `.ozet-tablo`.
   ⚠⚠ `details` `.ozet-satiri`nın DIŞINDA durur: `test_ozet_standardi`
      "kırılım tablosu kart satırının İÇİNDE" diye kırılır.
   ⚠ Varsayılan KAPALI: kapalıyken 26 px'lik tek şerit, açıkken eski tablo. */
details.ozet-kirilim { margin: 0 0 var(--b2); }
details.ozet-kirilim > summary {
  list-style: none; cursor: pointer;
  min-height: var(--h-arac); display: flex; align-items: center; gap: var(--b3);
  padding: 0 var(--b3);
  border: 1px solid var(--kenar); border-radius: var(--r-alan);
  background: var(--kart);
  font-size: var(--fs-sm); color: var(--metin);
  font-variant-numeric: tabular-nums;
}
details.ozet-kirilim > summary::-webkit-details-marker { display: none; }
details.ozet-kirilim > summary::after {
  content: "▾"; margin-left: auto; color: var(--metin-soluk); font-size: 10px;
}
details.ozet-kirilim[open] > summary::after { content: "▴"; }
details.ozet-kirilim > summary:hover { background: var(--uzerinde); }
details.ozet-kirilim[open] > summary { border-radius: var(--r-alan) var(--r-alan) 0 0; }
details.ozet-kirilim > .ozet-tablo { margin-top: 0; }

/* ── 4. K1.5 · SÜZGEÇ ÇUBUĞU TEK SATIR ────────────────────────────────────
   "Süz" ve "Temizle" artık tek kutuda (`liste.html` → `.alan.suzgec-eylemler`)
   ve alanların sağında yan yana; ölü ikinci satır kalktı. */
.suzgec-satir .alan.suzgec-eylemler {
  flex: 0 0 auto; flex-direction: row; align-items: flex-end; gap: var(--b2);
}
/* Eski şablonlarda kalan `&nbsp;` etiketleri de satırı yükseltmesin:
   `label:empty` onları YAKALAMIYORDU (boşluk karakteri boş sayılmaz). */
.suzgec-kart .alan.suzgec-eylemler > label { display: none; }
/* "Süzülen" şeridi artık aynı satırın içinde bir METİNDİR, ayrı bant değil. */
.suzgec-satir .suz-serit {
  flex: 1 1 200px; min-width: 0;
  margin: 0; padding: 0; border: 0; background: none; border-radius: 0;
  height: var(--kutu-h); display: flex; align-items: center; gap: var(--b2);
  font-size: var(--fs-ikincil); color: var(--metin-soluk);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  /* ⚠ `flex-wrap` MİRAS ALINMIYOR ama FAZ 3b `.suzulen`e wrap vermişti:
     adlar ikinci esnek satıra düşüp alttan da kırpılıyordu. */
  flex-wrap: nowrap;
}
/* ⚠⚠ `text-overflow: ellipsis` ESNEK KAPTA ÇALIŞMAZ (26.09.2026 denetimi):
      yukarıdaki bildirim ölüydü, adlar "…" bile konmadan kelimenin ortasından
      kesiliyordu ve kullanıcı devamı olduğunu anlayamıyordu. Kırpma artık
      METİN öğesinin kendisinde; şeridin `title`ı da tam listeyi verir
      (`arayuz/liste.html`). */
.suzgec-satir .suz-serit b {
  color: var(--metin); font-weight: var(--fw-orta);
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
/* ⚠ Şeridin kendi Temizle'si markup'ta KALIR (savlar ve stil onu arıyor) ama
   iki adım ötedeki Temizle ile aynı işi yapıyor: aynı satırda iki özdeş düğme
   vurgu enflasyonudur. */
.suzgec-satir .suz-serit .suz-temizle { display: none; }

/* ── 5. K3 · TABLO DİSİPLİNİ ───────────────────────────────────────────────
   ⚠⚠ EN BÜYÜK "HÂKİM OLMA" KAZANCI TABULAR-NUMS: orantılı rakamda göz para
      sütununda dikey çizgi takip edemiyordu. Tek sütun ya da tek sınıf değil
      TABLONUN TAMAMI: `bicim="para"` olmayan adet / yüzde / fatura no
      sütunları da hizalanır ve yeni bir ekran bunu unutamaz. */
table.liste { font-variant-numeric: tabular-nums; }
.ozet-kart .deger { font-variant-numeric: tabular-nums; }

/* ZEBRA YOK (plan §2/K3): dolu şerit satırdaki en parlak şey olup parayı
   bastırıyordu. Ayrım 1 px saç çizgisi + satır üstü vurgusuyla yapılır.
   ⚠⚠ DEĞİŞKEN ÜZERİNDEN kapatılır, kural kural ezilerek DEĞİL: `--tablo-zebra`
      FAZ 14'te altı ayrı yerde kullanılıyor (sıradan satır, sağa sabit İşlem
      hücresi, CRM köprüsü, #belgeTablosu). Tek satırda hepsi susar ve sağa
      sabit hücrenin zemini satırla AYNI kalır — çizgisi görünmez. */
:root { --tablo-zebra: var(--kart); }
table.liste tbody td { border-bottom: 1px solid var(--tablo-cizgi); }

/* Tarih ve zaman sütunu SABİT GENİŞLİK: göz tarih sütununu her ekranda aynı
   yerde bulur, tablo satır satır oynamaz. Ölçü: 92 px = "26.09.2026" + dolgu. */
:root { --l-tarih: 92px; --l-zaman: 118px; }
table.liste :is(th, td)[data-bicim="para"] { text-align: right; }
/* PARA BLOĞUNUN ÖNÜNDE İNCE DİKEY AYRAÇ — göz para sütunlarını tek seferde
   bulsun. Yalnız İLK para hücresine: "kendinden önceki kardeşi de para olmayan
   para hücresi". `box-shadow` kullanıldı, `border-left` DEĞİL: kenarlık hücre
   genişliğini büyütür ve sabit genişlikli tabloyu kaydırır. */
table.liste :is(th, td)[data-bicim="para"]:not([data-bicim="para"] + *) {
  box-shadow: inset 1px 0 0 var(--tablo-cizgi);
}

/* DURUM = RENKLİ NOKTA + METİN, dolu rozet değil.
   ⚠⚠ YALNIZ `span.rozet`: `a.rozet` (Alacak ekranı "Kişi giriniz") ve
      `button.rozet` (`.mh-damga`) TIKLANABİLİR birer denetimdir; onlardan dolu
      zemini almak tıklanabilirliği gizlerdi.
   ⚠ Metin nötr koyu kalır, renk YALNIZ noktada: satırın en parlak şeyi yine
     para olsun. */
table.liste tbody td span.rozet:is(.olumlu, .olumsuz, .notr, .uyari, .bilgi, .mavi, .mor) {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 0; border: 0; border-radius: 0;
  background: transparent; color: var(--metin);
  font-weight: var(--fw-normal); font-size: inherit;
}
table.liste tbody td span.rozet:is(.olumlu, .olumsuz, .notr, .uyari, .bilgi, .mavi, .mor)::before {
  content: ""; flex: 0 0 7px; width: 7px; height: 7px; border-radius: 50%;
  background: var(--nokta, var(--metin-soluk));
}
table.liste tbody td span.rozet.olumlu  { --nokta: var(--olumlu); }
table.liste tbody td span.rozet.olumsuz { --nokta: var(--olumsuz); }
table.liste tbody td span.rozet.uyari   { --nokta: var(--uyari); }
table.liste tbody td span.rozet.bilgi   { --nokta: var(--bilgi); }
table.liste tbody td span.rozet.mavi    { --nokta: var(--vurgu); }
table.liste tbody td span.rozet.mor     { --nokta: #6b46c1; }
/* ⚠ `notr` noktası #94a3b8 idi: zebra kapandıktan sonra satır zemini saf
   beyaz olduğu için kontrast 2,56:1 — 3:1 metin-dışı eşiğinin ALTINDA, nokta
   görünmüyordu ve o durumda renk kodlaması tümüyle kayboluyordu. `--metin-soluk`
   (#556b82, beyazda 5,51) hem eşiği geçer hem ::before'ın kendi yedeğiyle
   aynı tondur. */
table.liste tbody td span.rozet.notr    { --nokta: var(--metin-soluk); }

/* ── 6. K3 · SATIR İÇİ DÜĞME DUVARI ────────────────────────────────────────
   Satırın tamamı tıklanabilir (`liste.html` sonundaki betik, `.satir-tiklanir`
   sınıfını O koyar) ve satır sonunda tek `›` vardır.
   ⚠ İmleç YALNIZ betik kurulduğunda el olur: JS kapalıysa olmayan bir
     davranış vaat edilmez.
   ⚠⚠ SINIF SATIRIN KENDİSİNDE, SARMALDA DEĞİL (26.09.2026 denetimi). Sarmala
      konduğunda gidilecek yeri OLMAYAN satırlar da el imleci gösteriyordu:
      Cari İlgili Kişiler, Çapraz Stok, Departmanlar, Lojistik Kişileri,
      İthalat Masrafları, Banka Eşleşmeleri, Firma Kuralları — ve HER ekranın
      "kayıt yok" satırı. Vaat artık yalnız tutulabildiği satırda veriliyor;
      sınıfı hangi satıra koyacağına `liste.html` sonundaki betik karar verir. */
table.liste tbody tr.satir-tiklanir { cursor: pointer; }

/* DÜĞME DUVARI SUSAR, KAYBOLMAZ. Düzenle / Sil / ekrana özel satır düğmeleri
   yerinde ve okunur kalır (yazıları da); yalnız çerçeve ve zemin satır üstüne
   gelene kadar çekilir. 14 satırda 14 çerçeveli düğme, tablonun en parlak
   şeyi oluyordu.
   ⚠⚠ DÜĞME SİLİNMEDİ: `duzenle_etiketi` her ekranda "Düzenle" değil (Girus
      satınalma siparişinde "🖨 Yazdır"); silmek işlevi yok ederdi. */
table.liste td.islem-hucre .dugme {
  background: transparent; border-color: transparent; box-shadow: none;
}
/* ⚠⚠ DOLU MAVİ DÜĞME BEYAZ ÜSTÜNE BEYAZ KALIYORDU (26.09.2026 denetimi).
      Yukarıdaki kuralın özgüllüğü (0,3,2); `.dugme.birincil`in (erp1.css:1554,
      özgüllük 0,2,0) ZEMİNİNİ alıyor ama `color: #fff`ini EZMİYORDU. Satır
      zemini `--tablo-zebra: var(--kart)` ile saf beyaz (ve sağa sabit son
      hücre de `--kart`), yani kontrast 1,00 — kullanıcı boş bir çerçeve
      görüyordu. Üzerine gelme dalı da zemini `--kart` yaptığı için hover bile
      kurtarmıyordu. Kurban: Muhasebe → Ek Önemli Notlar'daki "Aç" düğmesi,
      notu açmanın TEK yolu.
   ⚠ YALNIZ `.birincil` hedeflenir: `.tehlike` (Sil) kırmızı, `.olumlu` yeşil
     METİN rengini 1560-1563'ten alıyor; blanket bir `color` onları da
     söndürür ve "bu düğme yıkıcı" bilgisini yok ederdi. */
table.liste td.islem-hucre .dugme.birincil { color: var(--metin); }
table.liste tbody tr:hover td.islem-hucre .dugme,
table.liste td.islem-hucre .dugme:focus-visible {
  background: var(--kart); border-color: var(--kenar-dugme);
}
table.liste td.islem-hucre .dugme:hover { background: var(--uzerinde); }

/* Tek `›` — kaydın açılacağını gösteren işaret. */
table.liste td.islem-hucre .satir-oku {
  display: inline-flex; align-items: center; justify-content: center;
  width: var(--kutu-h-mini); height: var(--kutu-h-mini);
  margin-left: var(--b2); border-radius: var(--r-alan);
  color: var(--metin-soluk); font-size: 16px; line-height: 1;
  text-decoration: none;
}
table.liste tbody tr:hover td.islem-hucre .satir-oku {
  color: var(--vurgu); background: var(--vurgu-acik);
}
table.liste td.islem-hucre .satir-oku:focus-visible {
  outline: 2px solid var(--odak); outline-offset: 1px;
}

/* ── 7 + 8. Mobil katmanın da verdiği ÖLÇÜLER: yalnız geniş ekran ──────────
   ⚠⚠ BU BLOK OLMADAN telefonda menü 212 px'e, sayfa 1360 px'e kilitlenir ve
      FAZ 34/35 boşa çıkar (bu katman dosyanın SONUNDA). */
@media screen and (min-width: 769px) {

  /* ── 7. K4 · GENİŞLİK İÇERİĞE GÖRE ──────────────────────────────────────
     6 sütunluk bir tablo 1600 px'e yayılınca göz satırı takip edemiyor.
     Sarmalayıcı en çok 1360 px ve ORTALANMAZ — sol menüye yaslı kalır, göz
     sola döner. `.icerik` dikey esnek kap olduğu için max-width kendiliğinden
     sola yaslar; ayrıca kenar boşluğu yazılmaz. */
  .sayfa { max-width: 1360px; }
  /* ⚠⚠ MUAFİYET — 14/17 SÜTUNLU MUHASEBE BELGE AİLESİ (#belgeTablosu, 14
     ekran). Kullanıcının kalıcı kuralı: satır sonu düğmeleri 1440 px'de
     KAYDIRMADAN görünmeli (FAZ 4c). 1360 px'e kısmak o tabloyu yatay
     kaydırmaya zorlardı; tavanı eski değerinde kalır. O ekran ailesi ayrı bir
     ajanın işidir (`muhasebe/belge_liste.html`, 2063 satır). */
  .sayfa:has(#belgeTablosu) { max-width: 1680px; }
  /* Tablo İÇERİĞİ kadar: `width: 100%` YAZILMAZ (zaten FAZ 3'te auto). */
  .tablo-sarmal > table.liste { width: auto; min-width: 100%; }

  /* Başlık şeridi: kırıntı 14 px + başlık satırı + 4 px dolgu = 48 px'in
     altında tek bant. Eylemler ve ⓘ başlıkla AYNI satırda.
     ⚠⚠ SATIRIN YÜKSEKLİĞİNİ `<h1>` DEĞİL, YANINDAKİ DÜĞME BELİRLİYOR
        (26.09.2026 denetimi): `.sayfa-basi` `align-items: center` olduğu için
        ikinci esnek satır max(h1 22, ⓘ 20, düğme) kadardır. `.sayfa-eylemler`
        içindeki `⬇ İndir` / `+ Yeni` düğmelerine boy sınıfı verilmediği için
        onlar 36 px'ti ve şerit 14+36+4 = 54 px oluyordu; bu yorumun "48 px'in
        altında" iddiası TUTMUYORDU. `.ust-cubuk .dugme`ye FAZ 7'de yapılan
        küçültme sayfa eylemlerine uygulanmamıştı. Artık aynı ölçü:
        14 + 30 + 4 = 48 px. Kutu yüksekliği (--kutu-h) DEĞİŞMİYOR — K2 onu
        süzgeç/form kutuları için sabitliyor, bu yalnız başlık şeridi. */
  .sayfa-basi { gap: 0 var(--b3); padding: 0 0 var(--b2); margin-bottom: var(--b2); }
  .sayfa-basi h1 { line-height: 22px; }
  .sayfa-basi .sayfa-eylemler .dugme { height: var(--kutu-h-kucuk); }

  /* Bantlar arası nefes korunur, ama bant SAYISI ve yüksekliği azalır:
     kazanılan her piksel doğrudan görünen satıra gider. */
  .ozet-satiri { gap: var(--b2); margin-bottom: var(--b2); }
  .ozet-kart .deger { font-size: var(--fs-xl); font-weight: var(--fw-orta); }
  /* ⚠⚠ `.girus-serit` AYNI İŞİ YAPAN ÇUBUKTUR ve listeye ALINMAMIŞTI:
     6 Girus liste ekranı (`satis-faturalar`, `satin-faturalar`,
     `excel-faturalar`, `ham-faturalar`, iki sipariş listesi) `suzgec_alani`
     bloğunu kendi `<form class="girus-serit">`uyla eziyor, bu yüzden
     `.suzgec-kart` kuralı onlara HİÇ değmiyordu: 8 px dolgu + 16 px alt
     boşluk eski değerinde kalmıştı (fark ~24 px, iki satıra saran çubukta
     daha fazla). Sınıfın kendisi ve Girus'a özel hiçbir şey değişmiyor,
     yalnız bant ölçüsü ortak role bağlanıyor (plan §9). */
  .suzgec-kart,
  .girus-serit { padding: var(--b2) var(--b3); margin-bottom: var(--b2); }
  .suzgec-satir { gap: var(--b2) var(--b3); }
  /* ⚠ `.toplu-serit` de listeye girdi: komşu bantlar 4 px'e inerken o FAZ 7b'nin
     12 px'inde kalıyordu (erp1.css:2069) ve aynı sayfada 4 px'lik bantların
     arasında tek bir 12 px durup ritmi kırıyordu. */
  .hizli-seridi,
  .toplu-serit { margin-bottom: var(--b2); }
  .gorunum-secici { margin-bottom: var(--b2); }

  /* Tarih / zaman sütunu sabit genişlik (bölüm 5'in ölçü yarısı). Telefonda
     tablo yerine kart basıldığı için sabit genişlik oraya taşınmaz. */
  table.liste :is(th, td)[data-bicim="tarih"] {
    width: var(--l-tarih); min-width: var(--l-tarih); white-space: nowrap;
  }
  table.liste :is(th, td)[data-bicim="zaman"] {
    width: var(--l-zaman); min-width: var(--l-zaman); white-space: nowrap;
  }

  /* ── 8. K6 · SOL MENÜ 232 → 212 px ─────────────────────────────────────
     Kazanılan 20 px içeriğe gider. Menünün KOYU rengine DOKUNULMAZ (açık tema
     16.09.2026'da denendi, kullanıcı reddetti — FAZ 6c).
     ⚠ Açılışta yalnız etkin dalın açık olması `base.html`in menü betiğindedir;
       kaydırma konumu korunmasına dokunulmadı. */
  :root { --menu-genislik: 212px; }
}

/* ══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 6 (devam) — TURUN KENDİ DENETİMİNDEN ÇIKAN DÜZELTMELER
   (26.09.2026 · aynı katmanın parçası, ayrı bir faz DEĞİL: yukarıdaki sekiz
    bölümün kapatılmayan kenarları. Her kural neden gerektiğini yanında yazar.)

   İÇİNDEKİLER
     9.  K3 — para hücresindeki rozet: aynı hücrede iki ayırt edilemez tutar
     10. K3 — hiç eylemi olmayan "İşlem" sütunu yer tutmasın
     11. K3 — klavyeyle gezende satır takibi (`:focus-within`)
     12. K2 — Gelir Tablosu ara toplamı: satır içi stil yerine sınıf
     13. §3 — şablon `<style>` adalarından taşınanlar (CRM RFQ · Girus Bağlantı)
     14. K3 — eski ERP'nin kategori tonları noktaya taşınır
     15. K3 — dokunmatikte satır sonu düğmeleri görünür kalır
   ══════════════════════════════════════════════════════════════════════════ */

/* ── 9. K3 · PARA HÜCRESİNDEKİ ROZET İKİNCİL KALIR ────────────────────────
   Durum noktası kuralı (bölüm 5) rozete `font-size: inherit` +
   `color: var(--metin)` + `font-weight: 400` veriyor. Para hücresinde bu,
   Finans Fişleri'nin "Kapatılan / Açık" sütununda İKİ tutarı birbirinin
   AYNISI yapıyordu: sağa hizalı hücrenin sağ kenarına kapatılan tutar değil
   AÇIK tutar dayanıyor ve ikisi aynı punto, aynı ağırlık, aynı renkte.
   (Giden / taslak / çalışan fişinde `kapatilan` 0 kaldığı için sağdaki sayı
   fişin TÜM tutarıdır — karışıklık istisna değil.)
   ⚠ Durum sözlüğü bozulmuyor: nokta yalnız PARA hücresinde susar, durum
     sütunlarında aynen durur. */
table.liste tbody td[data-bicim="para"] span.rozet:is(.olumlu, .olumsuz, .notr, .uyari, .bilgi, .mavi, .mor) {
  font-size: var(--fs-xs); color: var(--metin-soluk); font-weight: var(--fw-normal);
}
table.liste tbody td[data-bicim="para"] span.rozet:is(.olumlu, .olumsuz, .notr, .uyari, .bilgi, .mavi, .mor)::before {
  display: none;
}

/* ── 10. K3 · BOŞ "İŞLEM" SÜTUNU YER TUTMASIN ─────────────────────────────
   İskelet `<th class="sag">İşlem</th>`ı KOŞULSUZ basıyor; hücrenin içeriği ise
   dört kapıya bağlı (`satir_eylemleri` bloğu · `duzenle_url_adi` ·
   `sil_url_adi` · `detay_url_adi`). Hiçbiri tanımlı olmayan ekranlarda
   (İthalat Masrafları ve İK mevzuat parametresi ekranları) sütun hem başlıklı
   hem tamamen boştu; K4'ün `width: auto` kuralıyla tablonun sağ kenarında yer
   tutuyor, üstelik sağa sabit son hücre kuralı (FAZ 14) ona kendi dikey saç
   çizgisini çizdirdiği için KASITLI bir sütun gibi görünüyordu.
   ⚠⚠ `display: none` DEĞİL, SIFIR GENİŞLİK: sütun sayısı `<th>` ve `<td>`
      tarafında AYNI kalır. Gövdesini kendi çizen ekranlarda başlık sayısı ile
      hücre sayısını karşılaştıran savlar (Girus eşitleme) bozulmaz.
   ⚠ Kapı `td.islem-hucre:last-child`: FAZ 14'ün sağa sabitleme kuralı da aynı
     yapıyı varsayıyor, yani yeni bir varsayım getirilmiyor.
   ⚠ TEK satırda bile eylem varsa sütun TÜMÜYLE görünür kalır — yön bilerek
     böyle: emin olunamayan durumda sütun DURUR. */
table.liste:has(tbody td.islem-hucre:last-child):not(:has(tbody td.islem-hucre > *))
  :is(thead th:last-child, tbody td.islem-hucre) {
  width: 0; min-width: 0; padding: 0; font-size: 0; box-shadow: none;
}

/* ── 11. K3 · KLAVYEYLE GEZENDE SATIR TAKİBİ ──────────────────────────────
   Zebra bölüm 5'te kapandı; geriye kalan tek satır vurgusu `:hover`dı. Oysa
   K3'ün "ilk hücre GERÇEK bağlantı kalır (klavye/erişilebilirlik)" gerekçesinin
   hedef kitlesi tam olarak fare kullanmayan kullanıcıdır: Tab ile satır sonu
   düğmelerine gelen kişi yalnız odaklanan denetimin çerçevesini görüyor,
   hangi SATIRDA olduğunu gösteren hiçbir şey yoktu.
   ⚠ Sağa sabit son hücre (FAZ 14 · `background: var(--kart)`) hem hover hem
     odak dalında satırla AYNI zemine getirilir; yoksa vurgulu satır sağ uçta
     beyaz kalıp ikiye bölünür. */
table.liste tbody tr:focus-within > td { background: var(--uzerinde); }
table.liste:has(tbody td.islem-hucre:last-child)
  tbody tr:is(:hover, :focus-within) > td:last-child {
  background: var(--uzerinde);
}

/* ── 12. K2 · GELİR TABLOSU ARA TOPLAMI SINIFLA YAZILIR ───────────────────
   `ozet_gelir_tablosu.html` düzey 0 toplamlarını `.toplam-satiri` sınıfıyla,
   alt düzey toplamlarını SATIR İÇİ `style="background:…;font-weight:600"` ile
   basıyordu: aynı tabloda iki biçimlendirme dili. Satır içi bildirim en yüksek
   önceliğe sahip olduğu için palet ya da ağırlık burada değiştiğinde yalnız
   düzey 0 satırları döner, alt düzey satırları eski hâlinde kalırdı.
   ⚠ GÖRÜNÜM AYNEN KORUNUR: mavi zemin (--vurgu-acik) + 600 ağırlık + üst
     çizgisiz. Yalnız kaynağı satır içi stilden sınıfa taşındı. */
table.liste tr.toplam-satiri.ara-toplam > td {
  background: var(--vurgu-acik); border-top: 0; font-weight: var(--fw-orta);
}

/* ── 13. §3 · ŞABLON `<style>` ADALARINDAN TAŞINANLAR ─────────────────────
   Plan §3: "`<style>` şablona yazılmaz". Aşağıdaki kurallar şablonların
   içindeki `<style>` bloklarından AYNEN taşındı; yalnız EKRAN BAŞINA PUNTO ve
   EKRAN BAŞINA SATIR DOLGUSU bildirimleri düşürüldü (K2: punto tek yerde).

   (a) CRM → Müşteri Talepleri (RFQ) ve Tedarikçi RFQ listeleri.
       Düşürülenler: `#rfq-table { font-size: .82rem }` (13,12 px) ve
       `#srfq-table { font-size: .85rem }` (13,6 px) — öteki CRM listeleri
       `.crm-icerik .table` ile 13 px; aynı oturumda dört ekran gezen kullanıcı
       üç ayrı tablo puntosu görüyordu. Ayrıca `th, td { padding: .3rem .5rem }`
       ve `.btn-sm { padding: .15rem .4rem }`: satır ritmi ve düğme ölçüsü de
       yalnız bu iki ekranda sapıyordu, ortak kural (`.crm-icerik .table`,
       `.crm-icerik .btn-sm`) artık geçerli. */
#rfq-table :is(th, td),
#srfq-table :is(th, td) { vertical-align: middle; white-space: nowrap; }
#rfq-table thead th,
#srfq-table thead th { line-height: 1.15; }   /* başlıklar gerekirse iki satır */
#rfq-table td.col-ellip { max-width: 160px; overflow: hidden; text-overflow: ellipsis; }
#srfq-table td.col-ellip { max-width: 240px; overflow: hidden; text-overflow: ellipsis; }
#rfq-table .badge { font-weight: 500; }
.sortable { cursor: pointer; user-select: none; }
.sortable:hover { background-color: #e9ecef; }
.sort-icon { font-size: var(--fs-ikincil); color: #aaa; margin-left: 2px; }
th.sort-asc .sort-icon::before  { content: "\25B2"; color: #333; font-size: 10px; }
th.sort-desc .sort-icon::before { content: "\25BC"; color: #333; font-size: 10px; }

/* (b) Girus → Bağlantı ekranının kısmi güncelleme kutuları.
       Düşürülenler: `.kapsam-ad { font-size: .84rem }` (13,4 px) →
       `--fs-sm` (13) ve `.kapsam-son { font-size: .68rem }` (10,9 px) →
       `--fs-ikincil` (11,5). Geri kalan her bildirim AYNEN taşındı. */
.kapsam-satiri { display: flex; gap: 12px; align-items: flex-start; flex-wrap: wrap; margin-bottom: 10px; }
.kapsam-secenekleri { display: flex; gap: 8px; flex-wrap: wrap; }
.kapsam-secenegi { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px 6px 10px;
  border: 1px solid var(--kenar, #d0d7e2); border-radius: 8px; background: var(--kart, #fff);
  cursor: pointer; user-select: none; min-height: 40px; }
.kapsam-secenegi:has(input:checked) { border-color: var(--vurgu, #1d4ed8); background: #eef3ff; }
.kapsam-secenegi input { width: 16px; height: 16px; min-width: 0; margin: 0; accent-color: var(--vurgu, #1d4ed8); }
.kapsam-ad { display: block; font-size: var(--fs-sm); font-weight: var(--fw-orta); line-height: 1.2; }
.kapsam-son { display: block; font-size: var(--fs-ikincil); color: var(--metin-soluk, #667585); line-height: 1.2; }
.kapsam-secenegi.bos .kapsam-son { color: #b45309; }

/* ── 14. K3 · ESKİ ERP'NİN KATEGORİ TONLARI NOKTAYA TAŞINIR ───────────────
   `girus/fatura_ozeti.py:84-88` kategori rozetlerini "olumlu kat-ithalat-fatura"
   / "uyari kat-ithalat-masraf" / "notr kat-diger" biçiminde basıyor ve eski
   ERP'nin `kb` eşlemesindeki turkuaz / turuncu / gri ayrımını
   `erp1.css:2596-2598`ten alıyordu. Bölüm 5'in nokta kuralı (özgüllük 0,3,4)
   hem `background` hem `color` bildirdiği için o üç kural (0,2,0) ölmüştü:
   İthalat Faturası genel YEŞİL, İthalat Masrafı genel AMBER noktaya düşüyor ve
   Girus Satınalma Faturaları'nın "Hareket Türü" sütununda üç kategori
   birbirinden ayırt edilemiyordu (kaynak dosyadaki `# #0d817d` / `# #a5621c`
   yorumları da karşılıksız kalmıştı).
   ⚠ Renk paleti DEĞİŞMİYOR, eski tonlar geri geliyor: yalnız taşıyıcı değişti
     (dolu hap zemini → 7 px nokta). Kural bölüm 5'ten SONRA yazıldığı için
     aynı özgüllükte kazanır. */
table.liste tbody td span.rozet.kat-ithalat-fatura { --nokta: #0d817d; }
table.liste tbody td span.rozet.kat-ithalat-masraf { --nokta: #a5621c; }
table.liste tbody td span.rozet.kat-diger          { --nokta: #667585; }

/* ── 15. K3 · DOKUNMATİKTE DÜĞME DUVARI GÖRÜNÜR KALIR ────────────────────
   Bölüm 6 satır sonu düğmelerinin çerçevesini ve zeminini `tr:hover` ile
   `:focus-visible`e bağlıyor. Fare ve klavye kullanıcısında bu doğru; ama
   ≥769 px DOKUNMATİK cihazda (tablet yatay, dokunmatik dizüstü) hover diye bir
   şey yok: `/lojistik/gelen/`de "Görüntüle" kayda girmenin TEK yolu ve
   çerçevesiz, zeminsiz, gövde metniyle aynı renkte duruyordu. `hover: none`
   dalında çerçeve ve zemin KALICI olur.
   ⚠ Fare deneyimi DEĞİŞMEZ: bu blok yalnız hover'ı olmayan cihazlarda açılır,
     yani K3'ün "14 satırda 14 çerçeveli düğme" gerekçesi masaüstünde aynen
     geçerli kalır. */
@media (hover: none) {
  table.liste td.islem-hucre .dugme {
    background: var(--kart); border-color: var(--kenar-dugme);
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 6c — MENU BASLIGI UC SATIR OLABILIR (26.09.2026)
   ═══════════════════════════════════════════════════════════════════════════
   UYARI UYARI GERILEME DUZELTMESI. `.yan-menu .marka` yuksekligi ust cubuga
      SABITLENMISTI (`height: var(--h-kabuk)` = 44px) ve iki satir (urun adi +
      kiraci adi) icin yetiyordu. 26.09.2026'da ucuncu satir eklendi (AKTIF
      SIRKET kisa adi; gerekcesi base.html'de: dar ekranda ust cubuktaki
      `.kullanici` gizlendigi icin tek sirketli kullanici hangi sirkette
      oldugunu hicbir yerden goremiyordu). Uc satir 44 px'e sigmadi:
      "ERP1" USTTEN KIRPILDI, sirket satiri yarim kaldi ve "Panel" onun
      altina girmis gibi gorundu. ERP'nin EN COK BAKILAN kosesi.
   UYARI `height` -> `min-height`: iki satirli kurulumda hiza AYNEN korunur
     (44 px), ucuncu satir varken kutu buyur. Sabit yukseklik + degisken
     icerik bir arada olmaz.
   UYARI `justify-content: center` kaliyor; dikey nefes icin kucuk bir dolgu.
*/
.yan-menu .marka {
  height: auto;
  min-height: var(--h-kabuk);
  padding-top: 6px;
  padding-bottom: 6px;
  line-height: 1.25;
}

/* ═══════════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · FAZ 7 — SATIR ICI EYLEM FORMU (27.09.2026)
   ═══════════════════════════════════════════════════════════════════════════
   Ithalat gonderi listesinde "Kopyala" ve "Iptal" birer FORM (POST) olarak
   Islem hucresine giriyor; bagalanti olsalardi sayfayi tarayan her sey kayit
   acar ya da gonderi iptal ederdi.
   UYARI UYARI FORM BLOK OGEDIR: sarmalanmadan birakilirsa Islem hucresi ikiye
      boluner ve satir yuksekligi buyur. Depoda ayni tuzak `_kisi_eylem.html`
      aciklamasinda yazili ("araya blok bir kap girse hucre IKI SATIRA duser").
      `display: inline` yeterli DEGIL: icindeki dugmenin dikey hizasi kayiyor;
      `inline-flex` hem satir ici kalir hem dugmeyi ortalar.
   UYARI Hucre zaten `white-space: nowrap`; form da `margin: 0` olmali, yoksa
     tarayicinin varsayilan form bosluklari araligi bozar.
*/
table.liste td.islem-hucre form.it-satir-eylem {
  display: inline-flex;
  align-items: center;
  margin: 0;
}

/* ===========================================================================
   KATMAN 2026.09 · BANT ARALIGI — TUM SISTEM (28-29.09.2026)
   ===========================================================================
   Kullanici: "Okla gosterdigim her bolum sonrasi kullanilan ara/mesafe/bosluk
   cok az, gorunumu karmasiklastiriyor ve yoruyor. Bunu SIMDILIK sadece satis
   siparisleri alaninda mevcudun 3 KATI kadar buyuk yap, gorelim. Eger iyiyse
   sonra butun sisteme uygulamani isteyecegim."

   UYARI UYARI TABAN 4 px, CSS'TEN OKUNAN DEGIL OLCULEN DEGER.
      Bu blok ilk yazildiginda degerler kaynaktaki kurallardan okunmustu
      (.ozet-satiri 8, .girus-serit 16, .suzgec-kart 12) ve 24/36/48 yazilmisti.
      Canli sayfada olculen deger (getComputedStyle) HEPSI ICIN 4 px cikti:
      dosyanin SON katmani (FAZ 7 / K3, satir ~5091-5111) bant alt bosluklarini
      `var(--b2)` = 4 px'e indiriyor ve daha once yazilan 8/12/16'yi eziyor.
      Yani 24/36/48 "3 kat" degil 6-12 katti. Dogru 3 kat 4 -> 12 px
      idi ve 28.09'da o deger canliya alindi.
   UYARI UYARI BUGUNKU DEGER 18 px = TABANIN 4,5 KATI, "3 kat" DEGIL.
      Kullanici 12 px'i CANLI EKRANDA gordukten sonra "son yaptigin
      x1,5 yap" dedi -> 12 x 1,5 = 18 px. Yani olcu ekranda gorulerek
      IKINCI KEZ ayarlandi; yukaridaki alintidaki "3 KATI" ifadesi
      ARTIK GECERLI DEGIL. Kapsam butun sisteme yayilirken 18 px
      tasinir, 12 degil.
      DERS: bir olcu degistirilecekse kaynaktan okunmaz, EKRANDA OLCULUR
      (`_erp1_denetim/` icindeki olcum betikleri bunun icin var).

   UYARI UYARI "SATIS SIPARISLERI" ADINDA IKI EKRAN VAR:
      - `girus:satis_siparisler` -> /girus/satis-siparisler/ (Girus aynasi)
      - `satis:siparis_liste`    -> /satis/siparisler/ (ERP1in kendi siparisleri)
      Kullanici menude ayni adi iki kez gorur ve hangisine baktigini soylemedi.
      Yalnizca birine yazilsa, kullanici otekine bakip "hic degismemis" derdi.
      Ikisi de ayni bant siniflarini kullanir; tek fark Girus aynasinin
      `.girus-serit` arac cubugu, ERP1 ekraninin ise `.suzgec-kart` suzgeci.

   UYARI UYARI BANDIN HEPSI YAZILIR, BIR KISMI DEGIL. Ilk denemede dort secici
      yazilmis, tablonun HEMEN USTUNDEKI arac cubugu (`.girus-serit`) ve ozet
      kirilimi atlanmisti - yani goze en cok carpan bosluklar. Bir bant
      atlanirsa deneme yanlis olcum verir ve haksiz yere begenilmez.

   UYARI OZET GRUBUNU KAPATAN aciklama bosluğu (`.ozet-* + .yardim`, 24 px)
     BILEREK DOKUNULMADI. O zaten en genis bosluk ve grubun BITTIGINI
     soyleyen hiyerarsi isaretidir; 3 kati (72 px) sayfada delik acardi.
     Kullanicinin okla gosterdigi yerler 4 px'lik SIKI bantlardi.

   UYARI TEK KAPI: kapsam asagidaki `body:is(...)` secicisidir. Begenilirse
     yapilacak sey bu kapiyi KALDIRMAKTIR - olculer yeniden yazilmaz,
     yalnizca kapsam genisler. Kapi tek yerde durdugu icin tek islem.

   UYARI Tablonun KENDI satir yuksekligine DOKUNULMADI: kullanici bantlar
     ARASINI isaret etti, satirlari degil. Satir yuksekligi 26 px'te kaliyor.
*/
body .sayfa-basi { margin-bottom: 18px; }
body .mesajlar { margin-bottom: 18px; }
body .ozet-satiri { margin-bottom: 18px; }
body .ozet-tablo { margin: 0 0 18px; }
body details.ozet-kirilim { margin: 0 0 18px; }
/* Tablonun hemen ustundeki arac cubugu / suzgec bandi. */
body .girus-serit { margin-bottom: 18px; }
body .suzgec-kart { margin-bottom: 18px; }
/* UYARI Yalnizca ALT bosluk: `.suz-serit` kisayolu `margin: 8px 12px 12px`
   yan bosluklari da tasiyor, onlar bandin hizalamasi - bozulmamali. */
body .suz-serit { margin-bottom: 18px; }
body :is(.hizli-seridi, .toplu-serit) { margin-bottom: 18px; }
/* ===========================================================================
   KATMAN 2026.09 · ZEMIN TONU — TUM SISTEM (28-29.09.2026)
   ===========================================================================
   Kullanici sayfa zemininden bir parca kesip gonderdi: "arkadaki bu tonu bir
   iki tik acik yapar misin satis siparislerinde goreyim bakayim".

   Olculen taban (canli sayfa, getComputedStyle): --zemin = #f4f6f8.
   Iki tik acik: #f4f6f8 -> #f9fbfc  (244,246,248 -> 249,251,252).

   UYARI UYARI BU BLOK NUMARASIZDIR, BILEREK. "FAZ N" numaralari dosyada IKI
      KEZ geciyor: 16.09 serisi (FAZ 1-39) ve 26.09'da yeniden baslayan
      arayuz turu serisi (FAZ 6, 6c, 7, 8). Yani "FAZ 9" hem 16.09'daki FORM
      blogu hem de yeni bir blok olabilir. 28.09'da tam bu yuzden bir betik
      yanlis blogu bulup dosyanin 3600 satirini SILDI. Yeni bloklar adla
      yazilir; bir betik blogu arayacaksa TAM BASLIK dizgisiyle arar.

   UYARI UYARI JETON EZILIR, KURAL TEK TEK YAZILMAZ. `--zemin` govdede
      yeniden tanimlanir; `body` zemini, yapiskan `.sayfa-basi` ve
      `var(--zemin)` kullanan her sey KENDILIGINDEN gelir. Tek tek
      `background` yazilsaydi biri atlanir ve ekranda iki farkli gri olurdu
      (yapiskan baslik kaydirinca altindaki icerikten ayri renkte kalirdi).
   UYARI Ozel ozellik KULLANILDIGI yerde cozulur: `body { background:
      var(--zemin) }` govdedeki yeni degeri gorur. `:root`taki taban
      DEGISMEZ, oteki 80+ ekran etkilenmez.

   UYARI UYARI BEDELI: KART AYRIMI AZALIR. Kartlar (`.ozet-kart`,
      `.girus-serit`, `.suzgec-kart`) BEYAZ (#ffffff). Zemin beyaza
      yaklastikca kartin "yuzen kutu" etkisi zayiflar: R kanalinda fark
      11 birimden 6 birime iner. Kartlar kaybolmaz cunku kenarliklari var
      (--kenar #d9dde2), ama ayrim gozle zayiflar. Daha da acilirsa
      (#fbfcfd ve otesi) kart zeminden AYIRT EDILEMEZ olur ve "bir bakista
      tabloya hakim olmak" hedefi zarar gorur.
   UYARI Tablo basligi (#f2f5f9) AYRI tanimlidir, bu blokla degismez: zemin
      acilinca baslik zeminden KOYU kalir. Istenen buysa sorun yok.

   UYARI TEK KAPI ve BANT ARALIGINDAN BAGIMSIZ. Ikisi ayri kararlardir; biri
     begenilip oteki begenilmeyebilir, o yuzden ayri bloklar. Begenilirse
     yapilacak sey bu kapiyi kaldirip degeri `:root`taki `--zemin`e tasimak.
*/
body {
  --zemin: #f9fbfc;
}
/* ===========================================================================
   KATMAN 2026.09 · TABLO NETLIGI — TUM SISTEM (28-29.09.2026)
   ===========================================================================
   Kullanici Girus'un liste ekranini ekleyip: "Bakinca daha sade, tablolar
   daha net ve anlasilir ama bizimkinde tum bilgiler ic ice gecmis gibi
   gorunuyor. Renk yapi format vb ne varsa kontrol edip Girus tarzi birsey
   yapabilir misin? Modern olsun net olsun anlasilir olsun, sikis sikis
   olmasin, bakinca okunakli tek seferde anlasilabilir olsun."

   OLCUM (canli sayfa, getComputedStyle) — tahmin degil:
     hucre dikey cizgisi : 0px           -> Girus'ta her hucrede var
     satir seridi        : GORUNMUYOR    -> asagida acikliyor
     baslik alt cizgisi  : 0px           -> Girus'ta belirgin
     satir yuksekligi    : 31px
   "Bilgiler ic ice gecmis" hissinin sebebi tam olarak ilk uc madde.

   ⚠⚠ SERIT NEDEN GORUNMUYORDU (asil bulgu). Dosyada zebra kurali VAR
      (`table.liste tbody tr:nth-child(even)`, --tablo-zebra #f8fafc) ama
      siparis ekrani her veri satirinin ARDINA `hidden` bir "acilim" satiri
      basiyor. Yani basilan satirlar 1,3,5,7... hepsi TEK; `nth-child(even)`
      HER ZAMAN gizli satira denk geliyor ve zebra ekranda HIC gorunmuyor.
      Ayni sey detay acilan her listede olur.
      COZUM CSS'te DEGIL SABLONDA: `{% cycle 'satir-a' 'satir-b' %}` yalniz
      BASILAN satirlari sayar (`templates/arayuz/liste.html` ve
      `templates/girus/_siparis_urun_tablosu.html`). Parite artik gizli
      satirdan etkilenmez.

   NE YAPILDI — Girus'un okunakliligi UC seyden geliyor, ucu de burada:
     1. HUCRE IZGARASI: her hucrenin sag cizgisi. Goz sutunu izleyebilsin.
     2. GERCEK SERIT: satir-b satirlari hafif tonlu.
     3. BASLIK AYRIMI: govdeden kalin bir cizgiyle ayrilir.
   Dorduncu bir sey de eklendi:
     4. TEK SATIRLIK RITIM: `.yardim` iceren hucreler (ornegin "15.10.2026
        17 gun kaldi") iki satira tasiyor ve satir yuksekligini bozuyordu;
        bunlar tek satirda tutulur. Girus'ta her satir ayni yuksekliktedir
        ve tabloyu "bir bakista" okunur yapan sey budur.

   UYARI YAPISMIS SON SUTUN: Islem hucresi `position: sticky` ve KENDI zemini
      var (`--kart`). Serit yazilirken o hucre AYRICA boyanmazsa satir
      kayarken son sutun beyaz kalir ve serit kirilir. Asagida ayri kural var.

   UYARI RENK EKLENMEDI, AZALTILMADI. Sevk tarihi sutunundaki kirmizi/yesil
      uyarilar BILGI tasiyor (gecikmis / yaklasan) ve dokunulmadi. Girus'ta
      renk yok ama orada o bilgi de yok.

   UYARI BASLIK ALTI SUZGEC SATIRI EKLENMEDI. Girus'ta her sutunun altinda
      bir arama kutusu var ve okunakliligin bir parcasi. Bu bir GORUNUM
      degil ISLEV isidir (sunucuda suzme gerekir; projede `sutun_suzgecleri`
      altyapisi 14 muhasebe ekraninda zaten var). Ayri is olarak durur.

   UYARI TEK KAPI, oteki iki denemeden (bant araligi, zemin tonu) BAGIMSIZ.
     Begenilirse yapilacak sey bu kapiyi kaldirmak.
*/

body .tablo-sarmal table.liste {
  --izgara: #dde3ea;          /* hucre cizgisi — Girus'un gri cizgisi */
  --serit: #f6f8fb;           /* satir seridi — beyazdan bir tik koyu */
}

/* ── 1. Hucre izgarasi ────────────────────────────────────────────────── */
body .tablo-sarmal table.liste :is(thead th, tbody td) {
  border-right: 1px solid var(--izgara);
}
/* Son sutunun sag cizgisi YOK: tablonun kendi kenarligi zaten orada. */
body .tablo-sarmal table.liste :is(thead th, tbody td):last-child {
  border-right: 0;
}
/* Yatay cizgi de biraz belirginlesir — izgara ancak iki yonde ise izgaradir. */
body .tablo-sarmal table.liste tbody td {
  border-bottom: 1px solid var(--izgara);
}

/* ── 2. Baslik govdeden ayrilir ───────────────────────────────────────── */
body .tablo-sarmal table.liste thead th {
  border-bottom: 2px solid #c6d0dc;
  background: #eef2f7;
}

/* ── 3. Gercek serit ──────────────────────────────────────────────────── */
body .tablo-sarmal table.liste tbody tr.satir-b > td {
  background: var(--serit);
}
/* UYARI Yapismis son sutun kendi zeminini yaziyor; serit onu da kapsamali. */
body .tablo-sarmal table.liste tbody tr.satir-b > td:last-child {
  background: var(--serit);
}
/* ⚠⚠ "KÜÇÜK" TABLO VARYANTINDA DA ORAN TUTAR (29.09.2026).
   `table.liste.kucuk` başlığı ve satırı AYNI yüksekliğe (`--kutu-h-kucuk`)
   sabitliyordu; kullanıcının "tüm tablolarda başlık satırdan %50 yüksek
   olsun" kuralı o varyantta sessizce geçersiz kalıyor ve başlık gövdeden
   hiç ayrışmıyordu (ölçüm: 30/30, oran 1.00).
   ⚠ Kompaktlık KORUNUR: satır yine `--kutu-h-kucuk`. Değişen yalnız
     BAŞLIK — o da yine oranla, sabit sayıyla değil, ki küçük varyantın
     ölçüsü değişirse başlık kendiliğinden takip etsin. */
body table.liste.kucuk thead th {
  height: calc(var(--kutu-h-kucuk) * 1.5);
}

/* ⚠⚠ YEDEK ŞERİT — sınıf kancası OLMAYAN tablolar için (29.09.2026).
   Depoda 87 şablon kendi `<table class="liste">` gövdesini kuruyor ve
   `{% cycle 'satir-a' 'satir-b' %}` kancası yalnız üçünde var. Hepsine elle
   kanca yazmak hem uzun hem riskli (bazıları form ya da tek satırlık özet
   tablosu). Bu kural kancası olmayan tabloda sıra numarasına düşer.
   ⚠ `nth-child` BİLEREK yalnız YEDEK: gizli ara satır basan bir tabloda
     parite kayar (sipariş ekranlarında tam bu yaşandı) — o yüzden kancası
     OLAN tabloda bu kural hiç çalışmaz (`:not(:has(...))`).
   ⚠ Kanca eklenen her yeni tablo kendiliğinden bu yedekten çıkar. */
body .tablo-sarmal table.liste:not(:has(tbody tr.satir-a))
     tbody tr:nth-child(even) > td { background: var(--serit); }

/* Uzerine gelme ve secim seritten ONDE olmali. */
body .tablo-sarmal table.liste tbody tr:hover > td,
body .tablo-sarmal table.liste tbody tr:hover > td:last-child {
  background: var(--uzerinde);
}

/* ── 4. Tek satirlik ritim ────────────────────────────────────────────── */
/* `.yardim` iceren hucre iki satira tasiyordu (tabandaki kural
   `white-space: normal; height: auto`). Satir yuksekligi bozulunca goz
   satiri kaybediyor. */
body .tablo-sarmal table.liste tbody td:has(.yardim) {
  white-space: nowrap;
  height: var(--h-satir);
  padding: 0 8px 0 10px;
  max-width: 360px;
}
body .tablo-sarmal table.liste tbody td .yardim {
  display: inline;
  margin-left: 4px;
  white-space: nowrap;
}
/* Cok para birimli hucrede alt alta `<div>`ler var; onlar TASIMAYA devam
   etsin ama satir yine de dengeli dursun. */
body .tablo-sarmal table.liste tbody td:has(> div + div) {
  white-space: nowrap;
  height: var(--h-satir);
  padding: 0 8px 0 10px;
}
body .tablo-sarmal table.liste tbody td:has(> div + div) > div {
  display: inline;
}
body .tablo-sarmal table.liste tbody td:has(> div + div) > div + div::before {
  content: " \00b7 ";
  color: var(--metin-soluk);
}

/* ── 5. Nefes ─────────────────────────────────────────────────────────── */
/* ⚠⚠ SABİT YÜKSEKLİK KALDIRILDI (29.09.2026). Burada `td 34px / th 32px`
   yazılıydı; blok tek ekrana bağlıyken zararsızdı ama TÜM SİSTEME açılınca
   `--h-satir` ve `--h-tablo-baslik` jetonlarını EZİYOR ve "başlık satırdan
   %50 yüksek olsun" kuralını sessizce geçersiz kılıyordu (başlık satırdan
   KISA kalırdı). Yükseklik artık TEK YERDEN, jetonlardan gelir:
   `--h-satir: 34px` ve `--h-tablo-baslik: calc(var(--h-satir) * 1.5)`.
   Telefon kırılımlarında ikisi de kendiliğinden takip eder. */

/* ══════════════════════════════════════════════════════════════════════
   KATMAN 2026.09 · DÖNEM ÖZETİ BÖLÜM BAŞLIĞI (30.09.2026)

   ⚠⚠ NEDEN: Özet—Tutar ekranının 14 bölüm başlığı ŞABLONDA satır içi
      `style="font-size:1.02rem"` ile basılıyordu. 1,02rem tasarım
      ölçeğinde YOKTUR (ölçek: xs .75 · sm .8125 · md .875 · lg 1 ·
      xl 1.25) — yani ekranda 15. bir punto vardı. Kullanıcının açık
      şikâyeti "hâlâ beğenmiyorum, çok karışık" ve kuralı "punto
      hiyerarşisi TEK"; bir ekranın kendi puntosunu uydurması bu kuralı
      tam olarak deliyor. Başlık artık `--fs-lg` (16 px, "kart başlığı"
      basamağı) kullanıyor.
   ⚠ Satır içi yerleşim (flex/gap/margin) da buraya taşındı: ölçü
      şablonda dururken `erp1.css`ten okunamıyor ve bir sonraki katman
      onu EZEMİYOR (bkz. "ölçü ekranda ölçülür" notu).
   ⚠ `scroll-margin-top` KALIYOR: üst çubuk sabit, çıpaya atlarken
      başlık çubuğun altında kalmasın. Değeri kabuk yüksekliğinden (44)
      + nefes payı.
   ══════════════════════════════════════════════════════════════════════ */
.donem-tablo { margin-bottom: 22px; scroll-margin-top: 70px; }
.donem-tablo > .bolum-baslik {
  display: flex; align-items: baseline; gap: 10px; margin-bottom: 6px;
}
/* ⚠ `b` etiketi KALIR (anlamsal vurgu); yalnız puntosu ölçeğe bağlanır. */
.donem-tablo > .bolum-baslik b { font-size: var(--fs-lg); }

/* ======================================================================
   KATMAN 2026.09 . FAZ 40 - ACIKLAMA HUCRESI ve IKINCIL PUNTO (30.09.2026)

   UYARI UYARI 1. ACIKLAMA HUCRESI KIRPILIYORDU - kullanicinin kendi
      kurali: "aciklama hucresi kirpilmaz". Cakisma OLCULDU:
        . erp1.css:571-578 bu hucreyi BILEREK sariyordu ve yorumu bugunu
          birebir tarif ediyor: "not yarida kesilince kural okunamaz hale
          gelir - kompaktlik ugruna bilgi kaybetmek en kotusu".
        . erp1.css:5583-5589 ("Tek satirlik ritim") AYNI hucreye
          white-space: nowrap, height: var(--h-satir) ve max-width: 360px
          yazdi. Ozgulluk (0,3,4) > (0,1,2), yani 571 OLU kaldi.
        . Tabandaki erp1.css:261-268 overflow: hidden ve text-overflow:
          ellipsis ile birlesince sonuc GERCEK KIRPMA oldu.
      Olculen kurban: Ozet-Tutar, tutarTablosu, td.tutar-ad icindeki uc
      not 78, 89 ve 92 karakter; 360 px hucreye ~65 karakter siginca
      hepsi ucu noktali kesiliyordu. Kesilen metin ornegi: "Yalniz
      malzeme/hizmet satisi - kur farki, iade, fiyat farki, iptal ve
      reddedilenler HARIC" - yani SATIRIN TANIMI okunamiyordu.
   UYARI UYARI IPUCU DA KURTARMIYORDU: static/erp1/tablo_ipucu.js:30
      hucrenin KENDI title'i varsa uzerine yazmiyor ve td.tutar-ad'in
      title'i var - "Bu satiri olusturan kayitlarin tamamini goster".
      Not hicbir yolla okunamiyordu.
   UYARI KAPSAM "dogrudan cocuk div.yardim" ILE DARALTILDI (olculdu):
      10 ekranda bu kalip YALNIZ Ozet-Tutar'da ve 3 hucre. Tek satir
      ritmini tasiyan span.yardim hucreleri NOWRAP KALIR - Girus
      faturalari 43, siparisleri 31, alacaklar 12. 5583 ve 5589 SILINMEZ.
   UYARI max-width: 360px DEVRALINIR (ezilmez): not 360 px icinde SARAR,
      tablo genislemez, yatay tasma olusmaz. Ozet-Tutar'da satirin
      uzamasi zaten kabul edilmis bir istisnadir - baslik STANDART
      satirin 1,5 kati, o ekranin kendi satirinin degil.

   UYARI 2. IKINCIL PUNTO TEK JETONA. erp1.css:577 ".72rem" = 11,52 px
      uretiyor; ayni rolun jetonu erp1.css:4841 --fs-ikincil = 11,5 px.
      Ayni rol iki puntoda: olculen punto cesidi 6. Gorunur fark 0,02 px,
      EKRAN DEGISMEZ; kazanc rolun tek yerden gelmesi ve cesidin 5'e
      inmesi. erp1.css:577 SILINMEZ - white-space, line-height ve
      margin-top oradan gelir; burada YALNIZ punto role baglanir ve
      hicbir jeton yeniden tanimlanmaz.
   UYARI YORUMA SUSLU PARANTEZ YAZILMAZ (erp1.css:4050 kurali):
      test_mobil blok sinirini orada kaybediyor. Yukaridaki JS alintisi
      bu yuzden parantezsiz anlatildi.
   ====================================================================== */

/* 1 - yalnizca GERCEK aciklama hucresi sarar; yuksekligi icerigine uyar. */
body .tablo-sarmal table.liste tbody td:has(> div.yardim) {
  white-space: normal;
  height: auto;
}
body .tablo-sarmal table.liste tbody td > div.yardim {
  display: block;
  margin-left: 0;
  white-space: normal;
}

/* 2 - ikincil metin puntosu role baglanir. */
body table.liste td .yardim { font-size: var(--fs-ikincil); }

/* ======================================================================
   KATMAN 2026.10 - FAZ O - SOL MENU 4. KADEME
   ----------------------------------------------------------------------
   Kullanicinin iki istegi ucuncu kademede bir BASLIK istiyor:
   "Talepler RFQ ve Tedarikci RFQ menulerini RFQ menusu altinda goster"
   ve "Banka Hesaplari ve Kredi Kartlarini tanimlar menusu altina tasi,
   tanimlari banka menusu icinde en altta goster".
   Once sablon capliydi (base.html TAM UC kademe basiyordu) - acildi.
   BURASI YALNIZ GIRINTI: sinif adlari ucuncu kademeyle AYNI oldugu icin
   ac/kapa betigi degismedi; `menu-altgrup2` yalnizca CSS icin bir isaret.
   Girinti basamagi 12 px - kademe 2: 22, kademe 3: 34, kademe 4: 46.
   ====================================================================== */
.menu-altgrup2 > .menu-altbaslik {
  height: var(--h-menu-k3);
  padding-left: 34px;
  font-size: var(--fs-xs);
}
.menu-altgrup2 > .menu-altbaslik span:last-child { font-size: 9px; }
.menu-ogeler .menu-altgrup2 .menu-altogeler a { padding-left: 46px; }

/* Panel karti (Moduller kutusu) ayni girintiyi izler. */
.panel-menu .panel-altbaslik2 { color: var(--metin-soluk); font-weight: 600; }
.panel-menu .panel-kademe4 { padding-left: 28px; }

/* ======================================================================
   KATMAN 2026.10 - FAZ O - ODEME/TESLIM/SEVKIYAT SECIM KUTUSU
   ----------------------------------------------------------------------
   Kullanici: "Odeme sekli dropdown menusunde secenekler arasi cok bosluk
   var. Daha kompakt diger menulerdeki gibi yap."
   Sorun `datalist`ti: tarayici onerileri kendi genis satir yuksekligiyle
   cizer ve CSS ile sikilastirilamaz. Kutu artik gercek bir `select`;
   "Elle yaz..." secildiginde altindaki metin kutusu gorunur.
   BURASI YALNIZ ARALIK: select in kendi olculeri genel `.alan select`
   kuralindan gelir, yeniden tanimlanmaz.
   ====================================================================== */
.alan > select.odeme-secim { margin-bottom: 4px; }
.alan > select.odeme-secim + input[type="text"] { margin-top: 0; }

/* ======================================================================
   KATMAN 2026.10 - FAZ O - YUKLEME KARTININ ALTINDAKI NEFES
   ----------------------------------------------------------------------
   Kullanici (Ham Veri / "Dosyadan Yukle" ekrani, 01.10.2026):
   "Yukle ile bir belge yuklenemedi arasindaki boslugu 3 katina cikart."
   Kart kapaliyken tek satirlik bir seritti ve hemen altindaki metne
   yapisiyordu. Son katmandaki deger `--b2` (4 px); uc kati 12 px, yani
   `--b4`. Piksel SAYISI yazilmaz, jeton kullanilir (ayni jeton ailesi).
   ⚠⚠ OLCU EKRANDA OLCULUR (kalici kural): erp1.css 5700 satir ve son katman
      oncekini ezer. Buradaki `--b2` tespiti kaynaktan okundu (satir 1436);
      canlida farkli cikarsa jeton bir basamak asagi/yukari cekilir - kural
      "uc kati"dir, sabit piksel degil.
   ⚠ YALNIZ ALT BOSLUK: kartin kendi olculeri (dolgu, kose) degismedi.
   ⚠ Kapali kart `display:inline-block` oldugu icin dikey margin GECERLIDIR;
      `inline` olsaydi yok sayilirdi.
   ====================================================================== */
body details.yukleme-karti { margin-bottom: var(--b4); }

/* ======================================================================
   KATMAN 2026.10 - FAZ O - TABLO HUCRESI ICINDEKI ALAN CIFTI
   ----------------------------------------------------------------------
   Kullanici (Capraz Stok Tanimlari ekran goruntusu, 01.10.2026):
   "ekran goruntusunde duzgun gorunmuyor, kayma var."
   ⚠⚠ SEBEP OLCULDU (kaynaktan): hucrenin icindeki arama kutusu ile secim
      kutusu bir `.alan` sarmalinda alt alta duruyor, AMA genislik kurali
      `.form-izgara .alan input/select { width:100% }` seklinde YAZILMIS ve
      bu tablo `.form-izgara` ICINDE DEGIL. Sonucta `input` varsayilan ~20
      karakter genisliginde kaliyor, `select` ise EN UZUN SECENEGINE gore
      buyuyor ("1022634 - FHH 127x277 Egzoz Flex Hose"): iki kutu farkli
      genislikte, sutun da secenege gore geniyor - "kayma" bu.
   ⚠ Cozum hucreye genislik VERMEZ, iki kutuyu HUCREYE esitler; sutun
      genisligini yine `<th style="width:...">` belirler.
   ⚠ `box-sizing` acikca yazilir: kutu cercevesi %100'u tasirsa tablo yine
      yatay kayardi.
   ====================================================================== */
body table.liste td > .alan { gap: var(--b2); }
body table.liste td > .alan > input,
body table.liste td > .alan > select,
body table.liste td > .alan > textarea {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

/* ======================================================================
   KATMAN 2026.10 - FAZ O - FIS FOTOGRAFI YALNIZ TELEFONDA
   ----------------------------------------------------------------------
   Kullanici (01.10.2026): "Bilgisayardan buraya veri yuklenmesin, sadece
   mobil telefondan yuklenebilsin. Bilgisayardan yuklenecekse ham veriden
   yuklenecek zaten."
   ⚠⚠ KAPI EKRANDADIR, SUNUCUDA DEGIL: sunucuda engellemenin tek yolu
      tarayici kimligine (user-agent) bakmakti; o deger istemcinin
      BEYANIDIR ve dokunmatik dizustu / tablet mesru oldugu halde
      reddedilirdi. Gerekce sablonda da yazili.
   ⚠ Esik 900 px - menuyu ve alt gezinme seridini mobile ceviren esikle AYNI.
   ⚠ Genis ekranda kutular gizlenir, YERINE yonlendirme notu basilir: bos
     bir kart kullaniciya "bozuk mu" dedirtirdi.
   ====================================================================== */
@media (min-width: 901px) {
  #fisYukleme .fis-secim { display: none; }
  #fisYukleme .fis-masaustu-notu { display: block !important; }
}
@media (max-width: 900px) {
  #fisYukleme .fis-masaustu-notu { display: none !important; }
}

/* ======================================================================
   KATMAN 2026.10 - FAZ P - SIPARIS EKRANI KOMPAKT (02.10.2026)
   ----------------------------------------------------------------------
   Kullanici, birebir ve IKI KEZ: "Satis siparisleri ekran cok genis
   alanlar cok genis, biraz daralt kompakt ve modern gorunumklu yap
   sayfann hepsini".

   OLCUM (kaynaktan): .form-izgara = repeat(auto-fill, minmax(240px, 1fr))
   ve max-width 1100px. 1920 px'lik ekranda bu DORT sutun x 265 px demek;
   her kutu width:100% oldugu icin "Durum" ve "Kur" gibi 6 karakterlik
   alanlar 265 px genisliginde basiliyordu. Sayfa genis, alanlar bos.

   ⚠⚠ KARAR: sutun TAVANI kondu (210 px) ve izgara SOLA yigildi
      (justify-content: start). minmax(...,1fr) ile tavan konamaz --
      1fr artan yeri her zaman paylastirir; bu yuzden ucuncu deger
      minmax(170px, 210px) olarak yazildi.
   ⚠⚠ KAPI `.siparis-formu`: kural `.form-izgara` uzerine KOSULSUZ
      yazilsaydi sistemdeki 60+ formun hepsi daralirdi. Sinif iki
      siparis formunun <form> etiketinde duruyor.
   ⚠ `.alan.tam` (teslim adresi, notlar, ic not) TAM SATIR kalir:
      metin alanlari 210 px'e sikistirilamaz.
   ====================================================================== */
.siparis-formu .form-izgara {
  grid-template-columns: repeat(auto-fill, minmax(170px, 210px));
  justify-content: start;
  gap: 10px 12px;
  max-width: 100%;
}
.siparis-formu .form-izgara .alan.tam {
  grid-column: 1 / -1;
  max-width: 720px;
}
/* ⚠ Musteri/tedarikci kutusu uzun ad tasir (arama kutusu + secim):
   210 px'de "HAYEK ENDUSTRIYEL..." okunmuyordu. Iki goz genisligi. */
.siparis-formu .form-izgara .alan:has(#firmaSecim) { grid-column: span 2; }
.siparis-formu .kart { margin-bottom: 10px; }
.siparis-formu .kart-govde { padding-top: 10px; padding-bottom: 10px; }

/* ----------------------------------------------------------------------
   KALEM TABLOSU - DAR SAYI SUTUNLARI
   Kullanici: "Miktar sutununu daralt en fazla 8 dijit... Birim ve birim
   fiyati da daralt" / "Birim, iskonto, kdv %, sevk edilen sutunlarini da
   daralt".
   ⚠⚠ GENISLIK HUCREDE DEGIL KUTUDA: `<th style="width:...">` sutuna
      tavan koyar ama icindeki input `width:100%` kurali (KATMAN 2026.10 -
      TABLO HUCRESI ICINDEKI ALAN CIFTI) yuzunden hucreyi doldurur ve
      tarayici sutunu icerige gore yine genisletebilir. Kutuya da
      max-width yazilir ki sutun gercekten daralsin.
   ⚠ `text-align: right` sayi kutularinda: rakamlar hizalanmazsa dar
     sutunda okunmasi zorlasir (muhasebe tablolarinin kurali).
   -------------------------------------------------------------------- */
#kalemTablosu .k-miktar,
#kalemTablosu .k-fiyat,
#kalemTablosu .k-sevkm { text-align: right; }
#kalemTablosu .k-isk,
#kalemTablosu .k-kdv { max-width: 46px; text-align: right; }
#kalemTablosu .k-birim { max-width: 50px; }
#kalemTablosu .k-miktar { max-width: 74px; }
#kalemTablosu .k-sevkm { max-width: 70px; }
#kalemTablosu .k-fiyat { max-width: 84px; }
/* ⚠ "Hizmet" 6 karakter: ~48 px metin + ~20 px acilir liste oku +
   dolgu = 80 px. 72 px verilince Chrome etiketi kirpiyordu (olculdu);
   kullanici "daralt" dedi ama OKUNAMAZ demek degil. */
#kalemTablosu .k-tip { max-width: 82px; }
#kalemTablosu .k-ref,
#kalemTablosu .k-ref-secim { max-width: 108px; }
/* ⚠ Tarih kutusu tarayicinin takvim simgesini de tasiyor; 110 px'in
   altinda Chrome gun/ay alanlarini kirpiyor (olculdu). */
#kalemTablosu .k-sevk,
#kalemTablosu .k-onay { max-width: 116px; }
/* ⚠ Hucre dolgusu 6px -> 4px: 15 sutunlu tabloda her sutundan 4 px,
   toplam 60 px kazanir. Dikey dolgu DOKUNULMADI (dokunma hedefi). */
#kalemTablosu :is(th, td) { padding-left: 4px; padding-right: 4px; }

/* ----------------------------------------------------------------------
   URUN KODU ve PARCA NO: TEK KUTU GORUNUR
   Kullanici: "manuel yazma kismini ayri gostermek yerine listeden
   dropdown menude en ustte manuel giris yapacak sekle getir".
   ⚠⚠ GIZLEME `html.js-kalem` SINIFINA BAGLI ve o sinifi
      `arayuz/_kalem_kutulari.html` ekliyor. JavaScript calismazsa sinif
      YOK demektir, kutular GORUNUR kalir ve ekran tam calisir --
      sablonda `hidden` yazilsaydi betiksiz tarayicida urun kodu HIC
      girilemezdi.
   ⚠ `.elle` sinifi "kullanici elle giris sectı" demek; o anda kutu
     geri gelir ve `select` yerinde kalir (baska bir urune gecebilsin).
   -------------------------------------------------------------------- */
.js-kalem #kalemTablosu .kod-alani > .k-kod { display: none; }
.js-kalem #kalemTablosu .kod-alani.elle > .k-kod { display: block; }
.js-kalem #kalemTablosu .ref-alani.coklu > .k-ref { display: none; }
.js-kalem #kalemTablosu .ref-alani.coklu.elle > .k-ref { display: block; }
#kalemTablosu .kod-alani > .k-kod-secim { width: 100%; }

/* ----------------------------------------------------------------------
   IKI TOPLAM TABLOSU - BELGE PARA BIRIMI + TL
   Kullanici: "Altta toplamlarin oldugu iki tablo olsun biri doviz
   cinsidnen, digeri TL cinsidnden demistik ama sadece doviz cinsindeni
   gosteriyor."
   ⚠⚠ `flex-wrap` SART: iki 300 px'lik tablo + bosluk 620 px eder ve
      tablet genisliginde (768 px) kalem tablosunun kabina sigmiyor;
      sarmazsa ikincisi ekran disina tasardi.
   ⚠ Saga yigili (`justify-content: flex-end`): eski tek tablo
     `margin-left:auto` ile sagda duruyordu, duzen degismesin.
   -------------------------------------------------------------------- */
.toplam-ikili {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: flex-end;
  align-items: flex-start;
}
.toplam-ikili .toplam-sarmal { flex: 0 1 300px; max-width: 300px; }
.toplam-ikili .toplam-tablo { width: 100%; }
.toplam-ikili .toplam-tablo th { font-size: 0.92em; }
/* ⚠ TL tablosu IKINCIL: ayni sayilarin cevirisi oldugu icin daha
   soluk basilir -- kullanici hangisinin belgeye kaydedildigini
   gormeli (belge para birimi olan SOLDAKI). */
#tTlTablosu .toplam-tablo { opacity: 0.88; }
@media (max-width: 768px) {
  /* Telefonda alt alta ve tam genislik (FAZ 38 ile ayni esik). */
  .toplam-ikili .toplam-sarmal { flex: 1 1 100%; max-width: 100%; }
}

/* ----------------------------------------------------------------------
   TOPLU GIRUS ESITLEME PENCERESI (popup)
   Kullanici: "farkli olanlar var ise bir popup ekrani yaparak bunlari
   goster ve burada Girustakine esitleyeyim mi diye sor".
   ⚠⚠ `<dialog>` VARSAYILANI COK DAR ve ortalanmis: fark tablosu (dort
      sutun + alan alan dokum) 300 px'e sigmiyor. Genislik viewport'a
      gore verilir; sabit px verilseydi dizustunde tasardi.
   ⚠ `max-height` + `overflow:auto` GOVDEDE: pencerenin KENDISI kayarsa
     baslik seridi de yukari kayar ve "Kapat" dugmesi gorunmez olur.
   ⚠ `::backdrop` koyu: arka plandaki liste okunur kalirsa kullanici
     hangi ekranda oldugunu karistiriyor (SAP diyalog disiplini).
   -------------------------------------------------------------------- */
.esitle-kutusu {
  width: min(1100px, 94vw);
  max-width: 94vw;
  padding: 0;
  border: 1px solid var(--cerceve);
  border-radius: 10px;
  background: var(--kart);
  color: var(--metin);
  box-shadow: 0 18px 48px rgba(16, 24, 40, 0.22);
}
.esitle-kutusu::backdrop { background: rgba(16, 24, 40, 0.45); }
.esitle-kutusu-bas {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--cerceve);
  position: sticky;
  top: 0;
  background: var(--kart);
  z-index: 1;
}
.esitle-kutusu-govde {
  padding: 12px 14px 16px;
  max-height: 74vh;
  overflow: auto;
}
/* ⚠ Pencerenin icindeki kartlar ikinci bir cerceve katmani kurmasin:
   dialog zaten bir kart. */
.esitle-kutusu-govde .kart { box-shadow: none; }

/* Fark dokumu: "bizde -> Girus'ta" satirlari.
   ⚠⚠ ESKI DEGER USTU CIZILI DEGIL, SOLUK: ustu cizili metin "silindi"
      demektir; burada deger SILINMIYOR, DEGISIYOR. */
.fark-listesi { margin: 0; padding-left: 16px; }
.fark-listesi li { margin: 1px 0; }
.fark-eski { color: var(--metin-soluk); }
.fark-yeni { color: var(--olumlu); font-weight: 600; }

/* ⚠ Dugme suzgec cubugunun icinde duruyor ve cubugun kendi
   `.suzgec-eylemler` kurali onu Suz/Temizle ile ayni taban cizgisine
   oturtuyor; burada yalnizca nefes ve kirilmazlik. */
.girus-esitle-dugmesi { white-space: nowrap; }