/* ============================================================
   COMPONENTS — yeniden kullanılabilir UI parçaları
   ============================================================ */

/* ── Buton ── */
.btn {
  font-family: var(--font-ana); font-size: var(--fs-sm); font-weight: var(--fw-orta);
  padding: 7px 14px; border: 1px solid var(--renk-sinir); border-radius: var(--yaricap-sm);
  background: var(--renk-beyaz); color: var(--renk-yazi); cursor: pointer;
  transition: all .15s; display: inline-flex; align-items: center; gap: 6px;
}
.btn:hover { border-color: var(--renk-soluk); }
.btn:disabled { opacity: .5; cursor: not-allowed; }
.btn-ana   { background: var(--renk-ana);   color: var(--renk-ana-ustu); border-color: var(--renk-ana); }
.btn-ana:hover   { background: var(--renk-ana-2); }
.btn-aksan { background: var(--renk-aksan); color: var(--renk-ana-ustu); border-color: var(--renk-aksan); }
.btn-aksan:hover { background: var(--renk-aksan-2); }
.btn-sm { padding: 4px 10px; font-size: var(--fs-xs); }

/* ── Kart ── */
.kart {
  background: var(--renk-beyaz); border: 1px solid var(--renk-sinir);
  border-radius: var(--yaricap); padding: var(--bo-4); box-shadow: var(--golge-sm);
}

/* ── Rozet (badge) ── */
.rozet {
  display: inline-flex; align-items: center; gap: 4px; font-size: var(--fs-xs);
  font-weight: var(--fw-kalin); padding: 2px 8px; border-radius: var(--yaricap-etiket);
  background: var(--renk-vurgu-zemin); color: var(--renk-orta);
}
.rozet.pos   { background: var(--renk-pos-zemin);  color: var(--renk-pos-yazi); }
.rozet.neg   { background: var(--renk-neg-zemin);  color: var(--renk-neg-yazi); }
.rozet.aksan { background: var(--renk-aksan-zemin); color: var(--renk-aksan-2); }   /* marka-vurgu rozeti (durum değil) */
.rozet.uyari { background: var(--renk-uyari-zemin); color: var(--renk-uyari-yazi); }
.rozet.bilgi { background: var(--renk-bilgi-zemin); color: var(--renk-bilgi-yazi); }
.rozet.notr  { background: var(--renk-notr-zemin);  color: var(--renk-notr-yazi); }
.rozet-sm    { font-size: 9px; padding: 0 6px; }   /* 9px yalnız burada meşru (tema kural 4) */

/* ── Form alanları ── */
.alan, select.alan, input.alan, textarea.alan {
  width: 100%; padding: 7px 10px; font-family: var(--font-ana); font-size: var(--fs-md);
  color: var(--renk-yazi); background: var(--renk-beyaz);
  border: 1px solid var(--renk-sinir); border-radius: var(--yaricap-sm); outline: none;
}
.alan:focus { border-color: var(--renk-aksan); }
/* Parse'dan (faturadan) gelen değer — turuncu çerçeve ile belirt */
.alan-parse { border-color: var(--renk-aksan); box-shadow: inset 0 0 0 1px var(--renk-aksan); }
.parse-et { font-size: 10px; background: var(--renk-aksan); color: var(--renk-ana-ustu);
  padding: 1px 6px; border-radius: 8px; margin-left: 4px; font-weight: var(--fw-kalin); }
.alan-grup { display: flex; flex-direction: column; gap: 4px; margin-bottom: var(--bo-3); }
.alan-grup > label { font-size: var(--fs-xs); font-weight: var(--fw-kalin);
  text-transform: uppercase; letter-spacing: .04em; color: var(--renk-soluk); }

/* ── Kayıt Kabuğu: yeni-iş formları (ADR H8 tip-3, tek-sütun — redesign Adım 01) ──
   Ortalı sütun + numaralı bölüm kartları + eylem satırı. Boş-sayfa/marooned sorununu
   ortalama + dikey ritimle çözer; yoğunluk türe göre (basit/orta/ağır). İKON/EMOJI YOK. */
.kyt-kabuk { width: 100%; margin-inline: auto; display: flex; flex-direction: column; gap: var(--bo-4); }
.kyt-kabuk[data-yogun="basit"] { max-width: 720px; }
.kyt-kabuk[data-yogun="orta"]  { max-width: 820px; }
.kyt-kabuk[data-yogun="agir"]  { max-width: 1120px; }
/* Bağlam ön-metni — açıklayıcı satır, sayfa başlık BARI DEĞİL (K10 uyumlu) */
.kyt-lead { font-size: var(--fs-sm); color: var(--renk-soluk); line-height: 1.5; margin: 0; }
.kyt-lead b { color: var(--renk-yazi); font-weight: var(--fw-kalin); }
/* Numaralı bölüm kartı — istiflenen gruplar; SON bölüm hep "Onay & Bildirim" */
.kyt-bolum { background: var(--renk-yuzey); border: 1px solid var(--renk-sinir);
  border-radius: var(--yaricap); box-shadow: var(--golge-sm); padding: var(--bo-4); }
.kyt-bas { display: flex; align-items: center; gap: 9px; margin-bottom: var(--bo-3); }
.kyt-no { flex: none; width: 22px; height: 22px; border-radius: var(--yaricap-sm);
  background: var(--renk-zemin); color: var(--renk-soluk); font-family: var(--font-mono);
  font-size: 12px; font-weight: var(--fw-kalin); display: grid; place-items: center; }
.kyt-bas h3 { margin: 0; font-size: var(--fs-md); font-weight: 600; color: var(--renk-yazi); }
.kyt-bas .kyt-ip { margin-left: auto; font-size: 11px; color: var(--renk-soluk); font-weight: 400; }
/* Eylem satırı — kabuk altında, tek btn-ana EN SAĞDA (K22) */
.kyt-eylem { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 8px; padding-top: var(--bo-2); }
.kyt-hata { color: var(--renk-neg); font-size: var(--fs-sm); margin-right: auto; }
/* Pasif iskelet: bölüm çerçevesi+başlığı BAŞTAN görünür, gövde personel gelene dek soluk/pasif.
   ("iskeleti göster, gövdeyi sakla" çelişkisini kapatır — numaralı vaat ekranla uyumlanır.) */
.kyt-govde { transition: opacity .18s; }
.kyt-pasif .kyt-govde { opacity: .38; pointer-events: none; user-select: none; }
.kyt-ipucu-pasif { display: none; font-size: var(--fs-sm); color: var(--renk-soluk); margin: 0 0 2px; }
.kyt-pasif .kyt-ipucu-pasif { display: block; }
/* Üretilecek belge bilgi kutusu (süreç türleri: yükleme yuvası DEĞİL, ne üretileceğini bildirir) */
.kyt-uretilen { font-size: var(--fs-sm); color: var(--renk-soluk); line-height: 1.5;
  background: var(--renk-zemin); border: 1px solid var(--renk-cizgi); border-radius: var(--yaricap-sm); padding: 9px 12px; }
.kyt-uretilen b { color: var(--renk-yazi); font-weight: var(--fw-kalin); }
/* Otomatik bölüm numarası — talep formlarında bölüm sayısı türe göre değişir (siparis 5 / odeme 3 /
   ise-alim 4), elle numara riskli → CSS sayaç boş .kyt-no'ları doldurur. surecler formları elle numara
   taşır ve data-sayac YOK, bu kural onlara değmez (:empty koruması + attr kapsamı). */
.kyt-kabuk[data-sayac] { counter-reset: kyt-bolum; }
.kyt-kabuk[data-sayac] .kyt-no:empty::before { counter-increment: kyt-bolum; content: counter(kyt-bolum); }

/* ── Tablo ── */
.tablo { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); }
.tablo th { text-align: left; padding: 8px 10px; background: var(--renk-vurgu-zemin);
  font-weight: var(--fw-kalin); color: var(--renk-orta); border-bottom: 1px solid var(--renk-sinir); }
.tablo td { padding: 7px 10px; border-bottom: 1px solid var(--renk-sinir); }
/* STANDART veri tablosu: zebra (tek/cift satir tonu) — satir takibi icin */
.tablo tbody tr:nth-child(even) > td { background: var(--renk-zebra); }
/* Secim/gezinme tablosu (.tablo-sec): zebra YOK + imlec-el + hover sol turuncu serit ("bir yere gotur") */
.tablo-sec tbody tr:nth-child(even) > td { background: transparent; }
.tablo-sec tbody tr { cursor: pointer; }
/* hover EN SON tanimlanir: zebra ve reset uzerine yazar (esit ozgulluk, kaynak sirasi) */
.tablo tbody tr:hover > td { background: var(--renk-vurgu-zemin); }
.tablo-sec tbody tr:hover > td:first-child { box-shadow: inset 3px 0 0 var(--renk-aksan); }
.tablo th { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tablo th.r { text-align: right; }
.tablo th.c { text-align: center; }
.tablo td.mono { white-space: nowrap; }
.tablo td.kes { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* table-layout:fixed tabloda hucrenin IC BLOKLARI da kirpilmali — iki satirli hucrede
   (ad+kod, depo koku+kirilim) alt satir hucreden tasip komsu sutunun ustune biniyordu. */
.tablo td.kes > * { overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.yv-ana tr[data-fis].acik > td { background: var(--renk-vurgu-zemin); font-weight: var(--fw-kalin); }
.yv-ana tr.ozel > td { background: var(--renk-satir-ozel); }
.yv-ana tr.dengesiz > td { background: var(--renk-neg-zemin); }
.yv-ana tr.dengesiz:hover > td { background: var(--renk-neg-sinir); }
.denge-ok  { color: var(--renk-pos); font-weight: 700; }
.denge-yok { color: var(--renk-neg); font-weight: 700; }
/* Kredi karti donem seridi cipi (hesap-detay Ekstre) */
.donem-cip { font-size: 11.5px; font-weight: var(--fw-orta); padding: 4px 11px; border-radius: 20px;
  border: 1px solid var(--renk-sinir); background: var(--renk-yuzey); color: var(--renk-soluk);
  cursor: pointer; white-space: nowrap; }
.donem-cip:hover { border-color: var(--renk-soluk); }
.donem-cip.aktif { background: var(--renk-ana); color: var(--renk-ana-ustu); border-color: var(--renk-ana); }

/* PORTAL STANDART donem secici (K20) — ui/donem-sec.js. "‹ Ay Yil ▾ ›" + yil->ay popover */
.donem-sec { position: relative; display: inline-flex; align-items: center; border: 1px solid var(--renk-sinir);
  border-radius: var(--yaricap-sm); background: var(--renk-yuzey); overflow: visible; font-weight: var(--fw-orta); }
.ds-ok { border: none; background: transparent; color: var(--renk-aksan); font-size: 15px; line-height: 1;
  padding: 4px 9px; cursor: pointer; }
.ds-ok:disabled { color: var(--renk-soluk); opacity: .35; cursor: default; }
.ds-lbl { border: none; background: transparent; color: var(--renk-yazi); font-size: 12.5px; font-weight: var(--fw-orta);
  padding: 4px 6px; cursor: pointer; white-space: nowrap; border-left: 1px solid var(--renk-cizgi); border-right: 1px solid var(--renk-cizgi); }
.ds-lbl:hover { background: var(--renk-vurgu-zemin); }
.ds-kar { font-size: 9px; color: var(--renk-soluk); }
.ds-pop { position: absolute; top: calc(100% + 5px); right: 0; z-index: 60; width: 250px;
  border: 1px solid var(--renk-sinir); border-radius: var(--yaricap-sm); background: var(--renk-yuzey);
  box-shadow: var(--golge-md, 0 6px 20px rgba(0,0,0,.14)); overflow: hidden; }
.ds-yilbar { display: flex; gap: 5px; flex-wrap: wrap; padding: 9px 10px; border-bottom: 1px solid var(--renk-cizgi);
  background: var(--renk-vurgu-zemin); }
.ds-yil { font-size: 11.5px; font-weight: var(--fw-orta); padding: 3px 10px; border-radius: 5px;
  border: 1px solid var(--renk-sinir); background: var(--renk-yuzey); color: var(--renk-soluk); cursor: pointer; }
.ds-yil.aktif { background: var(--renk-ana); color: var(--renk-ana-ustu); border-color: var(--renk-ana); }
.ds-tumu { display: block; width: calc(100% - 20px); margin: 9px 10px 0; padding: 5px 0; text-align: center;
  font-size: 11.5px; font-weight: var(--fw-orta); border-radius: 5px; border: 1px solid var(--renk-sinir);
  background: var(--renk-yuzey); color: var(--renk-soluk); cursor: pointer; }
.ds-tumu.aktif { background: var(--renk-ana); color: var(--renk-ana-ustu); border-color: var(--renk-ana); }
.ds-aybar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; padding: 10px; }
.ds-ay { font-size: 11.5px; font-weight: var(--fw-orta); padding: 5px 0; text-align: center; border-radius: 5px;
  border: 1px solid var(--renk-sinir); background: var(--renk-yuzey); color: var(--renk-yazi); cursor: pointer; }
.ds-ay:hover:not(.pas) { border-color: var(--renk-soluk); }
.ds-ay.aktif { background: var(--renk-ana); color: var(--renk-ana-ustu); border-color: var(--renk-ana); }
.ds-ay.pas { opacity: .32; cursor: default; }

/* ── Widget kartı (dashboard) ── */
.widget { background: var(--renk-beyaz); border: 1px solid var(--renk-sinir);
  border-radius: var(--yaricap); padding: var(--bo-4); box-shadow: var(--golge-sm); }
.widget .etiket { font-size: var(--fs-xs); font-weight: var(--fw-kalin);
  text-transform: uppercase; letter-spacing: .05em; color: var(--renk-soluk); }
.widget .deger { font-size: var(--fs-xxl); font-weight: var(--fw-bold); margin: 6px 0 4px; }
.widget.aksan .deger { color: var(--renk-aksan-2); }
.widget.pos   .deger { color: var(--renk-pos); }

/* ── Modal ── */
.modal-overlay { position: fixed; inset: 0; background: var(--renk-perde);
  display: flex; align-items: flex-start; justify-content: center; z-index: 700;
  padding: 40px 16px; overflow: auto; }   /* drawer-katman(600) üstünde: çekmeceden açılan modal görünür */
.modal-kart { background: var(--renk-beyaz); border-radius: var(--yaricap-lg);
  padding: var(--bo-5); width: min(920px, 96vw); box-shadow: var(--golge); }
.modal-kapat { background: none; border: none; cursor: pointer; font-size: 16px;
  color: var(--renk-soluk); }

/* ── Boş durum ── */
.bos { flex: 1; min-height: min(60vh, 480px); display: flex; flex-direction: column; align-items: center;
  justify-content: center; color: var(--renk-soluk); gap: 10px; }

/* ── Belge ekleme sayfası (sol form + sağ önizleme) ── */
.be-izgara { display: grid; grid-template-columns: minmax(400px, 1fr) 1.15fr;
  gap: var(--bo-4); align-items: start; }
.be-form { padding: var(--bo-4); }
.be-onizleme { position: sticky; top: calc(var(--serit-pay) + var(--bo-4)); height: calc(100vh - 150px); min-height: 460px;
  border: 1px solid var(--renk-sinir); border-radius: var(--yaricap); overflow: hidden;
  background: var(--renk-zemin); display: flex; }
.be-pdf { width: 100%; height: 100%; border: 0; }
.be-img { max-width: 100%; max-height: 100%; object-fit: contain; margin: auto; }
@media (max-width: 980px) {
  .be-izgara { grid-template-columns: 1fr; }
  .be-onizleme { position: static; height: 460px; }
}

/* ── Dashboard bölüm başlığı ── */
.dash-bolum { font-size: var(--fs-sm); font-weight: var(--fw-kalin);
  text-transform: uppercase; letter-spacing: .05em; color: var(--renk-soluk);
  margin: var(--bo-5) 0 var(--bo-3); }

/* ── Markdown doküman görüntüleyici (docs/*.md → HTML) ── */
.md-govde { padding: 18px 22px; overflow: auto; max-height: calc(100vh - 200px);
  line-height: 1.55; font-size: 13.5px; color: var(--renk-yazi); }
.md-govde > *:first-child { margin-top: 0; }
.md-govde h1 { font-size: 20px; margin: 0 0 12px; padding-bottom: 6px; border-bottom: 2px solid var(--renk-aksan); }
.md-govde h2 { font-size: 16px; margin: 22px 0 8px; padding-bottom: 4px; border-bottom: 1px solid var(--renk-cizgi); }
.md-govde h3 { font-size: 14px; margin: 16px 0 6px; color: var(--renk-yazi); }
.md-govde h4 { font-size: 13px; margin: 12px 0 4px; color: var(--renk-soluk); }
.md-govde p { margin: 0 0 10px; }
.md-govde ul, .md-govde ol { margin: 0 0 10px; padding-left: 22px; }
.md-govde li { margin: 2px 0; }
.md-govde code { background: var(--renk-vurgu-zemin); padding: 1px 5px; border-radius: 4px;
  font-family: var(--font-mono); font-size: 12px; }
.md-govde pre { background: var(--renk-vurgu-zemin); padding: 10px 12px; border-radius: 6px;
  overflow: auto; margin: 0 0 12px; }
.md-govde pre code { background: none; padding: 0; }
.md-govde table { border-collapse: collapse; margin: 0 0 14px; font-size: 12.5px; width: 100%; }
.md-govde th, .md-govde td { border: 1px solid var(--renk-cizgi); padding: 5px 9px; text-align: left; vertical-align: top; }
.md-govde th { background: var(--renk-vurgu-zemin); font-weight: 600; }
.md-govde blockquote { border-left: 3px solid var(--renk-aksan); margin: 0 0 10px; padding: 4px 12px;
  color: var(--renk-soluk); background: var(--renk-vurgu-zemin); border-radius: 0 5px 5px 0; }
.md-govde a { color: var(--renk-aksan-2); }
.md-govde hr { border: none; border-top: 1px solid var(--renk-cizgi); margin: 16px 0; }

/* ── İş durumu kartı (aksiyonel kuyruk, tıklanır) ── */
.is-kart { display: flex; flex-direction: column; gap: 2px; text-align: left;
  background: var(--renk-beyaz); border: 1px solid var(--renk-sinir);
  border-left: 4px solid var(--renk-soluk); border-radius: var(--yaricap);
  padding: var(--bo-4); cursor: pointer; transition: all .15s; font-family: var(--font-ana); }
.is-kart:hover { box-shadow: var(--golge-sm); transform: translateY(-1px); }
.is-kart.aksan { border-left-color: var(--renk-aksan); }
.is-kart.pos   { border-left-color: var(--renk-pos); }
.is-kart.sifir { opacity: .55; }
.is-kart .is-sayi { font-size: var(--fs-xxl); font-weight: var(--fw-bold); line-height: 1; }
.is-kart.aksan .is-sayi { color: var(--renk-aksan-2); }
.is-kart .is-ad { font-weight: var(--fw-kalin); color: var(--renk-yazi); }
.is-kart .is-ipucu { font-size: var(--fs-xs); color: var(--renk-soluk); }

/* ── Aşama İzleyici (öğe yaşam döngüsü stepper) ── */
.asama-izleyici { display: flex; align-items: flex-start; gap: 0; padding: var(--bo-3) var(--bo-2); }
.asama-adim { display: flex; flex-direction: column; align-items: center; gap: 4px;
  min-width: 110px; text-align: center; }
.asama-nokta { width: 26px; height: 26px; border-radius: 50%; display: flex;
  align-items: center; justify-content: center; font-size: var(--fs-sm); font-weight: var(--fw-kalin);
  background: var(--renk-sinir); color: var(--renk-soluk); }
.asama-adim.tamam  .asama-nokta { background: var(--renk-pos); color: var(--renk-yazi-ters); }
.asama-adim.aktif  .asama-nokta { background: var(--renk-aksan); color: var(--renk-yazi-ters);
  box-shadow: 0 0 0 4px var(--renk-vurgu-zemin); }
.asama-adim.bekliyor .asama-nokta { background: var(--renk-zemin);
  border: 1px dashed var(--renk-soluk); }
.asama-ad { font-size: var(--fs-xs); font-weight: var(--fw-orta); color: var(--renk-yazi); }
.asama-adim.bekliyor .asama-ad { color: var(--renk-soluk); }
.asama-alt { font-size: var(--fs-xs); color: var(--renk-soluk); font-family: var(--font-mono); }
.asama-ok { flex: 1; height: 2px; background: var(--renk-sinir); min-width: 24px;
  margin-top: 12px; }   /* çember (26px) dikey merkezine hizalı; izleyici flex-start */
.asama-ok.gecti { background: var(--renk-pos); }
/* Aranabilir belge-türü seçici (ui/belge-turu-sec.js) — grup başlığı + öğe hover */
.btur-grup { font-size: 10.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  color: var(--renk-soluk); padding: 8px 10px 3px; position: sticky; top: 0; background: var(--renk-beyaz); }
.btur-oge:hover { background: var(--renk-zemin) !important; }
.btur-ac:hover { border-color: var(--renk-aksan); }

/* Filtre satırı (K10 — içerik-içi, full-bleed DEĞİL): liste süzgeçleri. Başlık barı değil;
   şeritteki eylem yuvasından ayrı, içeriğin ilk öğesi olarak ince bir kontrol satırı. */
.filtre-bari { display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin-bottom: var(--bo-3); font-size: var(--fs-sm); }

/* ── K21-B: kart-gomulu suzgec bari (2026-07-16 pilot — patron provasi bekliyor) ──
   3+ kontrollu bar icin: filtre satiri kendi "bar"i icinde (kagit tonu zemin + ince
   kenarlik + hafif golge) — kontroller boslukta yuzmez, tabloya ait okunur. YENI HEX YOK. */
.filtre-bari.kutu { background: var(--renk-zemin); border: 1px solid var(--renk-sinir);
  border-radius: var(--yaricap); padding: 8px 10px; box-shadow: var(--golge-sm);
  margin-bottom: var(--bo-3); }

/* ── K21 SUZGEC BARI + SEGMENT (2026-07-16, BAGLAYICI) ──
   Bar icindeki TUM kontroller ayni boy (--suzgec-yuk): select/input (.alan) + segment (.seg).
   Segment = 2-4 secenekli TEK-SEC enum suzgeci/gorunum anahtari; secili = .sec. >4 secenek -> select.
   Inline stilli segment YASAK — bu siniflar tek kaynak. */
.filtre-bari > .alan, .filtre-bari input.alan, .filtre-bari select.alan {
  width: auto; height: var(--suzgec-yuk); padding: 0 10px; font-size: var(--fs-sm); }
.seg { display: inline-grid; grid-auto-flow: column; grid-auto-columns: 1fr;
  align-items: stretch; height: var(--suzgec-yuk);
  border: 1px solid var(--renk-sinir); border-radius: var(--yaricap-sm); overflow: hidden;
  background: var(--renk-beyaz); font-size: var(--fs-sm); }
/* Butonlar EŞİT genişlik (en geniş metne göre) — 'Aktif|Çıkış|Hepsi' hizası (kullanıcı 2026-07-22) */
.seg > a, .seg > button { display: inline-flex; align-items: center; justify-content: center;
  padding: 0 12px; cursor: pointer; text-decoration: none; color: inherit; background: none;
  border: none; border-left: 1px solid var(--renk-sinir); white-space: nowrap; font: inherit;
  font-size: var(--fs-sm); }
.seg > a:first-child, .seg > button:first-child { border-left: 0; }
.seg > a:hover, .seg > button:hover { background: var(--renk-zemin); }
.seg > .sec { background: var(--renk-vurgu-zemin); font-weight: 650; }

/* ── İşler (Gelen Kutusu redesign, 2026-07-24): emoji-siz, dolu-renk bütçesi, karar/yürütme grupları ── */
.il-filtre { margin-bottom: var(--bo-4); }
.il-say { color: var(--renk-soluk); font-weight: 600; font-variant-numeric: tabular-nums; }
.seg > .sec .il-say { color: inherit; }
.il-sayac { margin-left: auto; font-size: var(--fs-xs2); color: var(--renk-soluk); font-variant-numeric: tabular-nums; }
.il-liste-kart { padding: 0; overflow-x: auto; }   /* overflow-x:auto = mobil kırpma fix */
.il-tablo { min-width: 640px; }
.il-tablo th.il-k-is { width: 160px; } .il-tablo th.il-k-durum { width: 150px; } .il-tablo th.il-k-kimde { width: 150px; }
.il-niyet { font-size: var(--fs-sm); font-weight: 600; color: var(--renk-yazi); white-space: nowrap;
  max-width: 160px; overflow: hidden; text-overflow: ellipsis; }
.il-konu { font-size: var(--fs-md); font-weight: 600; color: var(--renk-yazi); }
.il-alt { font-size: var(--fs-xs2); color: var(--renk-soluk); margin-top: 1px; }
.il-kimde { font-size: var(--fs-xs2); color: var(--renk-soluk); }
/* Bende satırı = SADECE sol 3px kenar işareti (tam-satır amber yıkama YOK — üçlü-amber çakışması çözümü) */
.il-tablo tr.il-bende td:first-child { box-shadow: inset 3px 0 0 var(--renk-uyari-yazi); }
/* Grup etiketi (Kararını bekleyenler / Sıradaki adımlar) — mono, soluk, tıklanmaz */
.il-tablo tr.il-grup td { padding: 12px 14px 4px; border-bottom: none; }
.il-tablo tr.il-grup:hover { background: none; }
.il-tablo tr.il-grup span { font-family: var(--font-mono, monospace); font-size: var(--fs-xs); letter-spacing: .08em;
  text-transform: uppercase; color: var(--renk-soluk); font-weight: 600; }
/* İnbox-zero / boş-durum (kahraman, glifsiz) */
.il-bos { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
  gap: 8px; padding: clamp(40px, 9vh, 80px) 20px; min-height: 46vh; }
.il-bos-baslik { font-size: var(--fs-lg); font-weight: 600; color: var(--renk-yazi); }
.il-bos-alt { font-size: var(--fs-md); color: var(--renk-soluk); max-width: 42ch; }
.il-bos-link { font-size: var(--fs-sm); color: var(--renk-soluk); margin-top: 2px; }
.il-bos-link a { color: var(--renk-aksan-2); text-decoration: none; cursor: pointer; }
.il-bos-link a:hover { text-decoration: underline; }
.il-bos-yeni { margin-top: 10px; }
/* Mobil: 4 kolon iki-satır karta iner — YALNIZ İşler'e scope'lu (global .tablo-sec'e dokunma) */
@media (max-width: 640px) {
  .il-tablo { min-width: 0; }
  .il-tablo thead { display: none; }
  .il-tablo tr.tikla { display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; padding: 9px 12px; }
  .il-tablo tr.tikla td { display: block; padding: 0; border: none; }
  .il-tablo tr.tikla td.il-niyet { grid-row: 1; max-width: none; }
  .il-tablo tr.tikla td:nth-child(3) { grid-row: 1; grid-column: 2; text-align: right; }
  .il-tablo tr.tikla td:nth-child(2) { grid-row: 2; grid-column: 1; }
  .il-tablo tr.tikla td:nth-child(4) { grid-row: 2; grid-column: 2; text-align: right; align-self: center; }
  .il-tablo tr.il-grup td { grid-column: 1 / -1; }
}

/* K9 aşama BANDI (kabuğun 3. şeridi, #serit-asama): kompakt tek satır — nokta küçülür,
   adım yatay dizilir, alt-metin yalnız aktif adımda. Süreçli kayıt yüzeyleri basar. */
#serit-asama .asama-izleyici { padding: 0; align-items: center; }
#serit-asama .asama-adim { flex-direction: row; gap: 5px; }
#serit-asama .asama-nokta { width: 16px; height: 16px; font-size: 9px; flex: none; }
#serit-asama .asama-adim.aktif .asama-nokta { box-shadow: none; }
#serit-asama .asama-ad { font-size: 11px; white-space: nowrap; }
#serit-asama .asama-alt { display: none; }
#serit-asama .asama-adim.aktif .asama-alt { display: inline; font-size: 10px; margin-left: 2px; }
#serit-asama .asama-ok { min-width: 14px; margin-top: 0; align-self: center; }
@media (max-width: 640px) { #serit-asama .asama-izleyici { flex-wrap: wrap; gap: 4px 0; } }
/* K2 BELİRGİN mod (2026-07-25 patron: maketteki ince tek satır — büyük nokta, aktif pill + alt-metin
   her zaman, bağlayıcılar yayılır). Yalnız İŞ yüzeyi basar: seritAsama(html, true) — surec-islem;
   fatura/icra projeksiyonları kompakt kalır. Terminal (key='son') nokta kırmızı — F2 talep projeksiyonu. */
#serit-asama.belirgin { padding: 8px var(--bo-5); }
#serit-asama.belirgin .asama-nokta { width: 23px; height: 23px; font-size: 12px; }
#serit-asama.belirgin .asama-adim { gap: 8px; }
#serit-asama.belirgin .asama-adim.aktif { background: var(--renk-aksan-zemin); border-radius: 6px;
  padding: 3px 10px; margin: -3px 0; }
#serit-asama.belirgin .asama-adim.aktif .asama-nokta { box-shadow: 0 0 0 3px var(--renk-aksan-zemin); }
#serit-asama.belirgin .asama-ad { font-size: 12.5px; }
#serit-asama.belirgin .asama-alt { display: inline; font-size: 10.5px; }
#serit-asama.belirgin .asama-ok { max-width: 220px; }
#serit-asama.belirgin .asama-adim[data-asama-key="son"] .asama-nokta { background: var(--renk-neg);
  color: var(--renk-yazi-ters); }

/* ── Yön rozeti (gelen=giriş / giden=çıkış — para DEĞİL, genel yön) ── */
.yon-rozet { font-size: var(--fs-xs); font-weight: var(--fw-kalin); white-space: nowrap; }
.yon-rozet.gelen { color: var(--renk-pos); }
.yon-rozet.giden { color: var(--renk-neg); }

/* ── Seçili satır ── */
.bl-satir { cursor: pointer; }
.bl-satir.secili > td { background: var(--renk-vurgu-zemin) !important; }
.bl-satir.secili > td:first-child { box-shadow: inset 3px 0 0 var(--renk-aksan); }

/* ── Drawer (sağdan triyaj paneli) — K11 rev2: KABUĞU ÖRTMEZ (header + #serit görünür/
   tıklanır kalır; menüden başka yere geçebilirsin — rota değişince Router drawer'ı kapatır).
   Katman kabuğun ALTINDAN başlar; tam-yükseklik overlay değil (o modaldir). ── */
.drawer-katman { position: fixed; inset: calc(var(--header-h) + 41px) 0 0 0; z-index: 500; }
.drawer-katman.gizli { display: none; }
.drawer-perde { position: absolute; inset: 0; background: var(--renk-perde);
  opacity: 0; transition: opacity .2s; }
.drawer-katman.acik .drawer-perde { opacity: 1; }
.drawer { position: absolute; top: 0; right: 0; height: 100%; width: min(560px, 94vw);
  background: var(--renk-beyaz); box-shadow: var(--golge); display: flex; flex-direction: column;
  transform: translateX(100%); transition: transform .2s ease; }
.drawer-katman.acik .drawer { transform: translateX(0); }
.drawer-bas { display: flex; align-items: center; justify-content: space-between;
  padding: var(--bo-4); border-bottom: 1px solid var(--renk-sinir); flex-shrink: 0; }
.drawer-baslik { font-size: var(--fs-lg); font-weight: var(--fw-kalin); }
.drawer-kapat { background: none; border: none; cursor: pointer; font-size: 18px;
  color: var(--renk-soluk); }
.drawer-govde { flex: 1; display: flex; flex-direction: column; overflow: hidden; }
/* aşama izleyici — panelde SABİT üst */
.drawer-asama { flex-shrink: 0; border-bottom: 1px solid var(--renk-sinir);
  background: var(--renk-zemin); }
/* çekmece dar (≤720px) → akış şeridi yatay kaymak yerine SARMALI + kompakt (oklar gizli) */
.drawer-asama .asama-izleyici { flex-wrap: wrap; gap: 8px 4px; padding: var(--bo-3); }
.drawer-asama .asama-adim { min-width: 0; flex: 1 1 86px; }
.drawer-asama .asama-ad { font-size: 11px; line-height: 1.2; }
.drawer-asama .asama-ok { display: none; }
/* K11 rev2: kompakt kimlik şeridi (Karşı Taraf · Tutar · Tarih + özet edit) */
.dw-kimlik { flex-shrink: 0; padding: 9px 12px; border-bottom: 1px solid var(--renk-cizgi); }
/* parça sekmeleri — ana belge ↔ ekler geçişi (geri dönebilme) */
.dw-parca-sekme { flex-shrink: 0; display: flex; gap: 2px; padding: 5px 8px; overflow-x: auto;
  border-bottom: 1px solid var(--renk-cizgi); scrollbar-width: none; }
.dw-parca-sekme::-webkit-scrollbar { display: none; }
.dw-ps { border: 1px solid var(--renk-cizgi); background: var(--renk-zemin); border-radius: 6px;
  padding: 3px 10px; font-size: 11.5px; cursor: pointer; white-space: nowrap; color: var(--renk-yazi); }
.dw-ps.aktif { background: var(--renk-aksan); color: #fff; border-color: var(--renk-aksan); font-weight: 600; }
/* katlanır künye detayı — triyajda önizleme hero, künye ikincil */
.dw-kunye-det { flex-shrink: 0; border-top: 1px solid var(--renk-cizgi); }
.dw-kunye-det > summary { padding: 7px 12px; font-size: 12px; font-weight: 600; color: var(--renk-soluk);
  cursor: pointer; list-style: none; }
.dw-kunye-det > summary::before { content: '▸ '; }
.dw-kunye-det[open] > summary::before { content: '▾ '; }
.drawer-meta { flex-shrink: 0; padding: var(--bo-3) var(--bo-4);
  display: grid; grid-template-columns: 1fr 1fr; gap: 2px var(--bo-4); }
.meta-satir { display: flex; justify-content: space-between; gap: var(--bo-2);
  padding: 4px 0; border-bottom: 1px dashed var(--renk-sinir); font-size: var(--fs-sm); }
.meta-k { color: var(--renk-soluk); }
.meta-v { font-weight: var(--fw-orta); text-align: right; }
/* önizleme — kalan alanı doldurur; YATAY kaydırma yok (evrak büyütülmedikçe), yalnız dikey */
.drawer-onizleme { flex: 1; min-height: 0; padding: var(--bo-3) var(--bo-4);
  overflow-y: auto; overflow-x: hidden; display: flex; flex-direction: column; }
.dw-pdf { width: 100%; flex: 1; min-height: 420px; border: 1px solid var(--renk-sinir);
  border-radius: var(--yaricap-sm); }
.dw-img { max-width: 100%; align-self: center; border: 1px solid var(--renk-sinir);
  border-radius: var(--yaricap-sm); }
/* aksiyonlar — SABİT alt */
.drawer-aksiyon { flex-shrink: 0; display: flex; gap: var(--bo-3); justify-content: flex-end;
  padding: var(--bo-3) var(--bo-4); border-top: 1px solid var(--renk-sinir); }

/* ── Belge İşlem (tam sayfa iş yüzeyi) — solda belge, sağda adım adım iş ── */
.bi-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  gap: var(--bo-4); align-items: start; }
@media (max-width: 900px) { .bi-grid { grid-template-columns: 1fr; } }
.bi-pane-bar { display: flex; justify-content: space-between; align-items: center; gap: 8px;
  padding: 8px 12px; border-bottom: 1px solid var(--renk-sinir); font-size: var(--fs-sm); }
.bi-onizleme { flex: 1; min-height: 0; display: flex; flex-direction: column; padding: var(--bo-3); overflow: auto; }
.bi-pdf { width: 100%; flex: 1; min-height: 0; border: 1px solid var(--renk-sinir);
  border-radius: var(--yaricap-sm); }
.bi-img { max-width: 100%; align-self: center; border: 1px solid var(--renk-sinir);
  border-radius: var(--yaricap-sm); }

/* ── Şık dosya seçici (native input gizli, buton görünümlü etiket) ── */
.dosya-sec { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.dosya-sec .dosya-btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 12px;
  border: 1px solid var(--renk-sinir); border-radius: var(--yaricap-sm); background: var(--renk-beyaz);
  cursor: pointer; font-size: 12px; white-space: nowrap; line-height: 1; transition: background .12s; }
.dosya-sec .dosya-btn:hover { background: var(--renk-zemin); }
.dosya-sec .dosya-btn:active { background: var(--renk-sinir); }
.dosya-sec input[type=file] { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.dosya-ad { font-size: 11px; color: var(--renk-soluk); word-break: break-word; max-width: 100%; }
/* Slot-içi küçük önizleme (2026-07-25): FORM kabuğu ortalı/sıralı kalır — pane YOK (K23).
   Seçilen görsel yüklenmeden önce görünür (telefondan çekilen kimlik yanlış/ters ise fark edilir). */
.dosya-sil { background: none; border: 0; color: var(--renk-neg); font-size: 10.5px; cursor: pointer;
  padding: 2px 4px; font-family: inherit; }
.dosya-sil:hover { text-decoration: underline; }
.dosya-onz { flex-basis: 100%; display: flex; gap: 6px; flex-wrap: wrap; margin-top: 2px; }
.dosya-onz-img { max-height: 96px; max-width: 150px; border-radius: 6px; border: 1px solid var(--renk-cizgi);
  object-fit: contain; background: var(--renk-beyaz); }
.dosya-onz-cip { font-size: 10.5px; color: var(--renk-soluk); border: 1px solid var(--renk-cizgi);
  border-radius: 12px; padding: 2px 9px; align-self: center; }
.dosya-ad.dolu { color: var(--renk-pos); }   /* çelişkili #16a34a fallback kaldırıldı (tema Faz 0) */

/* ── Belge yükleme yerleşimleri (mobil-dostu) ── */
.belge-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px; }
.belge-kalem { display: flex; flex-direction: column; gap: 4px; }
.belge-kalem > label { font-size: 11px; font-weight: var(--fw-orta); }
/* Belge SLOT kartı (2026-07-25) — "çok metin/karışık" geri bildirimi: her belge kendi sınırında,
   durumu rozetle okunur (zorunlu / otomatik / dolu=yeşil kenar). Kayıt kabuğu ortalı-sıralı kalır. */
.bel-slot { border: 1px solid var(--renk-cizgi); border-radius: 8px; padding: 9px 11px;
  display: flex; flex-direction: column; gap: 7px; background: var(--renk-yuzey); }
.bel-slot.dolu { border-color: var(--renk-pos); }
.bel-slot.oto { background: var(--renk-zemin); border-style: dashed; }
.bel-slot-bas { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.bel-slot-ad { font-size: 12px; font-weight: var(--fw-orta); }
.bel-rozet { font-size: 9px; letter-spacing: .5px; text-transform: uppercase; border-radius: 10px;
  padding: 1px 7px; border: 1px solid var(--renk-cizgi); color: var(--renk-soluk); white-space: nowrap; }
.bel-slot.dolu .bel-rozet { border-color: var(--renk-pos); color: var(--renk-pos); }
.bel-rozet.oto { border-style: dashed; }
.bel-oto-not { font-size: 11px; color: var(--renk-soluk); line-height: 1.45; }
.bel-ipucu { margin-top: 10px; font-size: 11px; color: var(--renk-soluk); }
.bel-ipucu > summary { cursor: pointer; user-select: none; }
.bel-ipucu > div { padding: 6px 0 0 14px; line-height: 1.55; }
.yukle-satir { display: flex; gap: 8px; flex-wrap: wrap; align-items: flex-end; }
.yukle-satir .btn { white-space: nowrap; }
.form-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 600px) {
  .belge-grid, .form-grid-2 { grid-template-columns: 1fr; }
  .yukle-satir { flex-direction: column; align-items: stretch; }
  .yukle-satir > .btn, .yukle-satir .dosya-sec { width: 100%; }
  .yukle-satir .dosya-sec .dosya-btn { width: 100%; justify-content: center; }
}

/* ── Kırıntı (breadcrumb) — kalıcı konum göstergesi (UX Faz 1 portal standardı).
   sayfa-bari gibi tam-genişlik üst şerit (negatif marjla içerik dolgusunu iptal eder);
   ardından sayfa-bari geliyorsa iki şerit bitişik istiflenir (layout.css kuralları). ── */
.kirinti { display: flex; align-items: center; flex-wrap: wrap; gap: 5px;
  font-size: 11.5px; color: var(--renk-soluk);
  background: var(--renk-beyaz); border-bottom: 1px solid var(--renk-cizgi);
  margin: calc(-1 * var(--bo-5)) calc(-1 * var(--bo-5)) var(--bo-4);
  padding: 6px var(--bo-5); }
.kirinti a { color: var(--renk-soluk); text-decoration: none; }   /* ara halka MAT; yaprak .k-son keskin (hiyerarşi) */
.kirinti a:hover { text-decoration: underline; }
.kirinti .k-ayrac { opacity: 1; color: var(--renk-soluk); font-size: 14px; }   /* AA görünür ayraç (eski .55 = 2.27:1 FAIL) */
.kirinti .k-son { color: var(--renk-yazi); font-weight: 600; }
/* K5: ↩ köken pili — "nereden geldin" (kırıntı yapısal konumdur, pil dinamik dönüştür) */
.kirinti .k-donus { background: var(--renk-vurgu-zemin); border: 1px solid var(--renk-cizgi);
  border-radius: 99px; padding: 1px 9px; margin-right: 6px; text-decoration: none;
  color: var(--renk-yazi); font-weight: 600; }
.kirinti .k-donus:hover { border-color: var(--renk-aksan); }
/* K3 (koşulsuz — 2026-07-11): bölüm çubuğunda başlık HER ZAMAN gizli, bilgiyi kırıntı taşır
   (pano dahil — tek halka). Koşullu hal pano↔sekme geçişinde sekmeleri yatay kaydırıyordu.
   :has(.sb-sekmeler) yalnız bölüm çubuğunu hedefler — modüllerin kendi sayfa-bari başlığı kalır. */
.sayfa-bari:has(.sb-sekmeler) .sb-baslik { display: none; }
/* K7 mobil: uzun halkalar kısalır */
@media (max-width: 640px) {
  .kirinti a, .kirinti .k-son { max-width: 18ch; overflow: hidden; text-overflow: ellipsis;
    white-space: nowrap; display: inline-block; vertical-align: bottom; }
}

/* ── Hakediş sekmeli dosya (UX Faz 2) ── */
.hd-sekmeler { display: flex; gap: 2px; border-bottom: 2px solid var(--renk-sinir);
  overflow-x: auto; margin-bottom: 14px; scrollbar-width: none; }
.hd-sekmeler::-webkit-scrollbar { display: none; }   /* sekmeler kayar ama çubuk görünmez */
.hd-sekme { padding: 8px 14px; font-size: 12px; font-weight: 600; color: var(--renk-soluk);
  cursor: pointer; background: none; border: none; border-bottom: 2px solid transparent;
  margin-bottom: -2px; white-space: nowrap; font-family: inherit; }
.hd-sekme:hover { color: var(--renk-yazi); }
.hd-sekme.aktif { color: var(--renk-yazi); border-bottom-color: var(--renk-aksan); }
.hd-panel { display: none; }
.hd-panel.aktif { display: block; }
.hd-kapak-ust { display: grid; grid-template-columns: 2fr 1fr; gap: 12px; align-items: stretch; margin-bottom: 12px; }
.hd-arka-iki { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 12px; align-items: start; }
@media (max-width: 640px) { .hd-kapak-ust { grid-template-columns: 1fr; } }

/* ── İç metin linki (token; turuncu METİN türevi — kontrast) ── */
.link { color: var(--renk-aksan-yazi); text-decoration: none; font-weight: 600; cursor: pointer; }
.link:hover { text-decoration: underline; }

/* ── Kasa İşlemleri Tip-3 ızgarası (Faz 1) — dar ekranda tek kolon, form üstte ── */
/* Kasa üst satır: SOL önizleme/makbuz pane + SAĞ form, AYNI grid satırı → eşit yükseklik
   (K17). Filtre + hareket geçmişi bu grid'in DIŞINDA, tam genişlik altta. */
.ki-ust{display:grid;grid-template-columns:minmax(0,1fr) minmax(420px,480px);gap:var(--bo-4);
  align-items:stretch;margin-bottom:var(--bo-3)}
.ki-ust > #ki-form{min-height:var(--pane-yukseklik);overflow:auto}
.ki-ust > #ki-form.tek{grid-column:1 / -1}   /* pane gizliyse (tür seçilmedi) form tam genişlik */
@media (max-width:1000px){
  .ki-ust{grid-template-columns:1fr}
  .ki-ust > #ki-form{order:-1}
}

/* İşleme Masası konveyörü (muhasebelestir): üst bar + SOL belge önizleme | SAĞ fiş paneli.
   İki kutu EŞİT yükseklik (align-items:stretch) + viewport boyunca uzun → doküman tam görünür
   (#view=Fit ile tüm sayfa kutuya sığar). Fiş paneli kısa kalırsa esner (içerik üstte, gerekirse scroll). */
.im-bar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:8px 14px;margin-bottom:var(--bo-3)}
/* 3 kolon: bekleyen-kuyruk seridi | belge onizleme | fis paneli */
.im-grid{display:grid;grid-template-columns:minmax(200px,250px) minmax(0,1fr) minmax(420px,540px);gap:var(--bo-4);align-items:stretch}
.im-pane{padding:0;overflow:hidden;height:clamp(440px, calc(100vh - 172px), 1200px);display:flex;flex-direction:column}
.im-grid > #im-panel{display:flex;flex-direction:column;overflow:auto}
.im-grid > #im-panel > .kart{flex:1 0 auto}
/* Bekleyen kuyruk seridi (sol) — konveyorde sirayi gorunur kilar, tikla-atla */
.im-liste{padding:4px;overflow-y:auto;height:clamp(440px, calc(100vh - 172px), 1200px);display:flex;flex-direction:column;gap:1px}
.im-liste-bas{font-size:11px;font-weight:600;padding:5px 7px;position:sticky;top:0;background:var(--renk-kart);border-bottom:1px solid var(--renk-cizgi);z-index:1}
.im-satir{display:grid;grid-template-columns:1fr auto;gap:0 6px;width:100%;text-align:left;background:none;border:none;border-radius:5px;padding:5px 7px;cursor:pointer;line-height:1.3;color:inherit}
.im-satir:hover{background:var(--renk-zemin)}
.im-satir.aktif{background:var(--renk-vurgu-zemin);box-shadow:inset 3px 0 0 var(--renk-vurgu)}
.im-satir.islendi{opacity:.45}
/* K18 klavye gezinme: odaklanan liste satiri (yon tuslari) */
.kl-odak{outline:2px solid var(--renk-vurgu);outline-offset:-2px;border-radius:5px}
.kl-kbd{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 6px;
  border:1px solid var(--renk-cizgi);border-bottom-width:2px;border-radius:5px;background:var(--renk-zemin);
  font-family:var(--mono,monospace);font-size:11px;color:var(--renk-yazi);vertical-align:middle}
.im-satir-no{font-weight:600;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.im-satir-tutar{align-self:center;font-size:10px;white-space:nowrap}
.im-satir-tur{grid-column:1/-1;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:1100px){
  .im-grid{grid-template-columns:1fr;align-items:start}
  .im-grid > #im-panel{order:-1}
  .im-pane{height:clamp(360px,68vh,760px)}
  .im-liste{height:auto;max-height:180px;order:-2}
}

/* ── Fiş İşlem: editör + sağ sticky belge önizleme (Faz 2, nihai panel) ── */
.fi-izgara{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(360px,1fr);gap:var(--bo-4);align-items:start}
.fi-izgara.tek{grid-template-columns:1fr}
.fi-izgara > #fi-onizleme{position:sticky;top:calc(var(--serit-pay) + var(--bo-4));height:calc(100vh - 150px);min-height:460px}
@media (max-width:1100px){.fi-izgara{grid-template-columns:1fr}.fi-izgara > #fi-onizleme{display:none!important}}

/* ── Fiş Masası (ADR H9 F3, S2 patron kararı): SOL kalıcı belge önizleme + SAĞ iş paneli ──
   Birleşik #fis/<anahtar> yüzeyi (YAZ/DÜZENLE/BOŞ). TEK kaydırma = sayfa (panelde overflow YOK);
   önizleme kolonu sticky (doküman tam görünsün). Mobilde önizleme ÜSTTE + static (belge girdinin
   kendisi — .fi-izgara'nın display:none mobil hatası tekrarlanmaz). Eski im ve fi-izgara CSS'i ölü → F3b. */
.fm-izgara{display:grid;grid-template-columns:minmax(0,1fr) minmax(430px,1.15fr);gap:var(--bo-4);align-items:start}
.fm-izgara.tek{grid-template-columns:1fr}
/* ÖNİZLEME KOLONU — TEK GEOMETRİ (kullanıcı 2026-07-30: "önizlemenin boyutları her yerde standart
   olsun"). Eskiden üç ayrı değer vardı: --onizleme-boy (fiş), 82vh (belge sayfası), hiç (kabul
   ekranı → içerik kadar büzülüyordu). Artık ölçü TEK sınıfta; id'ye bağlı seçici yerine sınıf,
   böylece her sayfa aynı ölçüyü ALARAK katılır. */
.fm-izgara > #fm-onizleme,
.onizleme-kolon{position:sticky;top:calc(var(--serit-pay) + var(--bo-4));height:var(--onizleme-boy);min-height:460px;padding:0;overflow:hidden;display:flex;flex-direction:column}
@media (max-width:1100px){
  .fm-izgara{grid-template-columns:1fr}
  .fm-izgara > #fm-onizleme,
  .onizleme-kolon{order:-1;position:static;height:clamp(360px,62vh,760px)}
}


/* ── Para Makbuzu (Faz 4): canlı taslak + yazdır ── */
.mkz{background:var(--renk-kart);border:1px solid var(--renk-cizgi);border-radius:4px;padding:16px 18px;
  font-size:12px;line-height:1.8;position:relative;overflow:hidden;max-width:430px;margin:auto;box-shadow:var(--golge-sm)}
.mkz-filigran{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;
  font-size:46px;font-weight:800;color:var(--renk-neg);opacity:.12;transform:rotate(-22deg);letter-spacing:.25em}
.mkz-baslik{text-align:center;font-weight:700;font-size:12.5px;line-height:1.5}
.mkz-cizgi{border-top:1px dashed var(--renk-sinir);margin:7px 0}
.mkz-satir{display:flex;justify-content:space-between;gap:10px}
.mkz-yazi{font-size:11px}
.mkz-acik{font-size:11px;color:var(--renk-dim);margin-top:4px}
.mkz-imza{display:flex;justify-content:space-between;gap:16px;margin-top:22px;font-size:10.5px;text-align:center}
.mkz-imza span{border-top:1px solid var(--renk-metin);padding-top:4px;flex:1}
#mkz-yazdir{display:none}
@media print{
  body > *{display:none!important}
  #mkz-yazdir{display:block!important;padding:24px}
  #mkz-yazdir .mkz{box-shadow:none;max-width:100%}
}

/* Kapı kartı (ADR A12) — kartın KENDİSİ adımın kapısıdır; içinde "→ git" düğmesi olmaz
   (kart adı "Kabul" iken düğme adı "Kabul Bilgileri" olunca aynı kelime iki kez söyleniyordu,
   kullanıcı 2026-07-30). Tıklanabilirlik hover + odakla belli olur. */
/* Kapi = baslik satirinin TAMAMI (kullanici 2026-07-30: "karta tiklayinca ilgili sayfaya
   gitmeyecek miydi, calismiyor" - hedef yazi kadar dardi). Serit durum rozetine kadar uzanir. */
a.bi-kapi { flex: 1; min-width: 0; display: flex; align-items: center; gap: 6px;
  text-decoration: none; color: inherit; cursor: pointer;
  margin: -5px -7px; padding: 5px 7px; border-radius: var(--yaricap-sm);
  transition: background-color .12s; }
a.bi-kapi:hover { background: var(--renk-vurgu-zemin); }
a.bi-kapi:hover b { text-decoration: underline; text-underline-offset: 3px; }
a.bi-kapi:focus-visible { outline: 2px solid var(--renk-aksan); outline-offset: 1px; }
.bi-kapi-ok { color: var(--renk-soluk); font-size: 12px; transition: transform .12s; }
a.bi-kapi:hover .bi-kapi-ok { color: var(--renk-aksan); transform: translateX(2px); }

/* Aktif adim karti — kayisin "simdi buradasin" adimi. Ayri bir "Siradaki" bandi YOK (ADR A12:
   ayni sey uc kez soylenmez); vurgu kartin kendisinde. */
.kart.bi-aktif { border-color: var(--renk-aksan); box-shadow: inset 3px 0 0 var(--renk-aksan), var(--golge-sm); }