/* =========================================================================
   kisi-borcu.css — /kisi-borcu-hesaplama/ çalışma alanı
   =========================================================================
   BAĞIMLILIK: style.css → sayfa.css → bordro.css → BU DOSYA. Bırakma kutusu,
   adımlar, düğmeler ve dosya satırı bordro.css'ten (KBS Bordro Kontrol ile
   aynı aile — site sahibinin isteği). Burada yalnız alanlar ve kalem tablosu.

   DÖRT DURUM (site sahibi, 23.10.2026: "dolu boş kısımlar renkle anlaşılsın"):
     bordro  yeşil     PDF'ten okundu, dokunulmadı
     elle    turkuaz   kullanıcı girdi ya da değiştirdi
     eksik   kehribar  doldurulmalı: boş zorunlu alan, tanınmayan kalem, toplam farkı
     istege  kesik     boş kalabilir
   Renk TEK BAŞINA anlam taşımaz: her alanın rozeti aynı şeyi yazıyla söyler
   (renk körlüğü, siyah-beyaz baskı) — style.css'teki .mk-durum kuralının aynısı.
   ========================================================================= */

/* --- Rozet (lejant, alan başlığı, kalem satırı) --- */
.kborc__lejant { display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 0 0 var(--bosluk-md); }
.kborc__rozet {
  display: inline-block; padding: 0.05rem 0.55rem; border-radius: 999px;
  font: 600 0.72rem/1.6 var(--font-sans); white-space: nowrap; border: 1px solid transparent;
}
.kborc__rozet[data-durum="bordro"] { color: #fff; background: var(--durum-tamam); }
.kborc__rozet[data-durum="elle"]   { color: #fff; background: var(--durum-siz); }
.kborc__rozet[data-durum="eksik"]  { color: var(--durum-oto); background: var(--durum-oto-zemin); border-color: var(--durum-oto-cizgi); }
.kborc__rozet[data-durum="istege"] { color: var(--renk-metin-yumusak); border: 1px dashed var(--durum-cizgi); }
.kborc__rozet[data-durum="ayna"]   { color: var(--renk-metin-yumusak); background: #efede6; }

/* --- Bloklar --- */
.kborc__blok { margin: var(--bosluk-lg) 0 0; }
.kborc__blok h3 { margin: 0 0 var(--bosluk-sm); font-size: 1.15rem; }
.kborc__baglanti {
  font: inherit; color: var(--durum-siz-koyu); background: none; border: 0; padding: 0;
  text-decoration: underline; cursor: pointer;
}
.kborc__baglanti:focus-visible { outline: 2px solid var(--renk-odak); outline-offset: 2px; }
.kborc__kisi { margin: var(--bosluk-md) 0 var(--bosluk-sm); font-weight: 600; }
.kborc__kisi span { font-weight: 400; color: var(--renk-metin-yumusak); }

/* --- Kalem tabloları: gelir | kesinti yan yana, dar ekranda alt alta --- */
.kborc__kalemler { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--bosluk-md); }
/* minmax(0, …) ŞART: `1fr` en küçük içerik genişliğine uyar ve bir <select> en uzun
   seçeneği kadar geniş ister ("Hakim ve Savcı Yüksek Kurul Üye Tazminatı") — sütun
   telefonda ekranı aşıyordu. */
@media (max-width: 760px) { .kborc__kalemler { grid-template-columns: minmax(0, 1fr); } }
.kborc__sutun { min-width: 0; }
.kborc__sutun h4 { margin: 0 0 0.4rem; font-size: 1rem; }
/* .sayfa__tablo-kap'sız tablo: sayfa.css'teki `.sayfa table { min-width: 22rem }` (352px)
   veri tabloları için — kendi kabında kayarlar. Bu tablo kaymaz, ekrana sığar. */
.sayfa .kborc__tablo { min-width: 0; }
.kborc__tablo { width: 100%; border-collapse: separate; border-spacing: 0 0.25rem; }
.kborc__tablo td { padding: 0.3rem 0.5rem; vertical-align: middle; background: rgba(255,255,255,0.75); }
.kborc__tablo td:first-child { border-radius: 0.5rem 0 0 0.5rem; border-left: 4px solid var(--durum-cizgi); }
.kborc__tablo td:last-child { border-radius: 0 0.5rem 0.5rem 0; text-align: center; width: 1%; white-space: nowrap; }
.kborc__tablo tr[data-durum="bordro"] td { background: var(--durum-tamam-zemin); }
.kborc__tablo tr[data-durum="bordro"] td:first-child { border-left-color: var(--durum-tamam); }
.kborc__tablo tr[data-durum="elle"] td { background: var(--durum-siz-zemin); }
.kborc__tablo tr[data-durum="elle"] td:first-child { border-left-color: var(--durum-siz); }
.kborc__tablo tr[data-durum="eksik"] td { background: var(--durum-oto-zemin); }
.kborc__tablo tr[data-durum="eksik"] td:first-child { border-left-color: var(--kehribar); }
.kborc__tablo tr[data-durum="ayna"] td { background: #f4f2ec; color: var(--renk-metin-yumusak); }
.kborc__tablo .kborc__ad { font-size: 0.92rem; overflow-wrap: anywhere; }
.kborc__tablo .kborc__ad small { display: block; color: var(--renk-metin-yumusak); font-size: 0.78rem; }
.kborc__tablo select { margin-top: 0.25rem; width: 100%; min-width: 0; font: inherit; font-size: 0.85rem; }
.kborc__tutar {
  width: 8.5rem; font: 600 0.95rem var(--font-mono); text-align: center;
  padding: 0.3rem 0.4rem; border: 1.5px solid var(--durum-cizgi); border-radius: 0.4rem; background: #fff;
}
.kborc__tutar[readonly] { border-style: dashed; background: transparent; color: var(--renk-metin-yumusak); }
.kborc__sil {
  font: 700 0.9rem/1 var(--font-sans); width: 1.6rem; height: 1.6rem; margin-left: 0.25rem;
  border: 1px solid var(--durum-cizgi); border-radius: 0.4rem; background: #fff; cursor: pointer;
}
.kborc__ekle { width: 100%; min-width: 0; font: inherit; font-size: 0.9rem; padding: 0.35rem; border-radius: 0.4rem; border: 1px dashed var(--durum-cizgi); background: #fff; max-width: 100%; }

/* Toplam kontrolü: tutuyorsa yeşil satır, tutmuyorsa kehribar kutu + fark */
.kborc__kontrol { margin: 0.3rem 0 0; padding: 0.4rem 0.7rem; border-radius: 0.5rem; font-size: 0.9rem; }
.kborc__kontrol:empty { display: none; }
.kborc__kontrol[data-durum="tamam"] { background: var(--durum-tamam-zemin); color: var(--durum-tamam); font-weight: 600; }
.kborc__kontrol[data-durum="eksik"] { background: var(--durum-oto-zemin); color: var(--durum-oto); border: 1px solid var(--durum-oto-cizgi); font-weight: 600; }
.kborc__kontrol input { width: 8rem; font: 600 0.9rem var(--font-mono); text-align: center; }

/* --- Olay alanları --- */
.kborc__alanlar { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: var(--bosluk-md); }
.kborc__alan { display: grid; gap: 0.3rem; align-content: start; margin: 0; padding: 0.6rem 0.75rem;
               border: 1.5px solid var(--durum-cizgi); border-radius: 0.7rem; background: rgba(255,255,255,0.8); min-width: 0; }
.kborc__alan--genis { grid-column: 1 / -1; }
/* display:grid, [hidden]'ın tarayıcı kuralını ezer (5510'da kıdem alanı görünür kalıyordu). */
.kborc__alan[hidden] { display: none; }
.kborc__alan > label, .kborc__alan > legend { font-weight: 600; font-size: 0.92rem; padding: 0; }
.kborc__alan > legend { float: left; width: 100%; margin-bottom: 0.3rem; }
.kborc__alan small { color: var(--renk-metin-yumusak); font-size: 0.8rem; }
.kborc__alan input, .kborc__alan select { font: inherit; padding: 0.4rem 0.5rem; border: 1.5px solid var(--durum-cizgi); border-radius: 0.45rem; background: #fff; min-width: 0; max-width: 100%; }
.kborc__alan[data-durum="bordro"] { border-color: var(--durum-tamam); background: var(--durum-tamam-zemin); }
.kborc__alan[data-durum="elle"]   { border-color: var(--durum-siz); background: var(--durum-siz-zemin); box-shadow: inset 4px 0 0 var(--durum-siz); }
.kborc__alan[data-durum="eksik"]  { border-color: var(--kehribar); background: var(--durum-oto-zemin); box-shadow: inset 4px 0 0 var(--kehribar); }
.kborc__alan[data-durum="istege"] { border-style: dashed; }
.kborc__alan .kborc__rozet { justify-self: start; }
.kborc__satir { display: flex; flex-wrap: wrap; gap: 0.4rem; align-items: center; }
.kborc__satir input { flex: 1 1 10rem; font-family: var(--font-mono); }
.kborc__secenekler { display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); gap: 0.4rem; clear: both; }
.kborc__secenek { display: grid; grid-template-columns: auto 1fr; gap: 0.1rem 0.5rem; padding: 0.45rem 0.6rem;
                  border: 1px solid var(--durum-cizgi); border-radius: 0.5rem; background: #fff; cursor: pointer; }
.kborc__secenek input { grid-row: span 2; margin-top: 0.2rem; }
.kborc__secenek b { font-size: 0.9rem; }
.kborc__secenek small { grid-column: 2; }
.kborc__secenek:has(input:checked) { border-color: var(--durum-siz); box-shadow: 0 0 0 2px var(--durum-siz-zemin); }
.kborc__secenek--kapali { opacity: 1; background: #f4f2ec; cursor: not-allowed; }
.kborc__secenek--kapali b { color: var(--renk-metin-yumusak); text-decoration: line-through; }

/* --- Sonuç --- */
.kborc__eksik:empty { display: none; }
.kborc__eksik { padding: var(--bosluk-sm) var(--bosluk-md); border-radius: 0.6rem; background: var(--durum-oto-zemin);
                border: 1px solid var(--durum-oto-cizgi); color: var(--durum-oto); font-weight: 600; }
.kborc__eksik[data-durum="hata"] { background: var(--durum-hata-zemin); border-color: var(--durum-hata); color: var(--durum-hata); }
.kborc__borc {
  display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0.3rem var(--bosluk-md);
  margin: 0 0 var(--bosluk-md); padding: var(--bosluk-md); border-radius: 0.8rem;
  background: #fff; border: 2px solid var(--petrol);
}
.kborc__borc span { font-family: var(--font-mono); font-size: var(--fs-mono); color: var(--renk-metin-yumusak); }
.kborc__borc strong { font: 700 1.8rem/1.1 var(--font-mono); color: var(--durum-siz-koyu); }
.kborc__bolum { margin: 0 0 var(--bosluk-md); }
.kborc__bolum h4 { margin: 0 0 0.3rem; font-size: 1rem; }
.kborc__bolum .sayfa__tablo-kap { margin: 0; }
.kborc__bolum label { font-size: 0.8rem; white-space: nowrap; cursor: pointer; }
.kborc__neden { margin: 0.3rem 0 0; font-size: 0.85rem; color: var(--renk-metin-yumusak); }
.kborc__belge { margin: var(--bosluk-md) 0 0; padding: var(--bosluk-sm) var(--bosluk-md); border: 1px solid var(--durum-cizgi); border-radius: 0.7rem; background: rgba(255,255,255,0.6); }
.kborc__belge summary { cursor: pointer; font-weight: 600; }
.kborc__belge summary span { font-weight: 400; color: var(--renk-metin-yumusak); font-size: 0.9rem; }
.kborc__belge .kborc__alanlar { margin-top: var(--bosluk-sm); }
.kborc__hatirla { display: block; margin-top: var(--bosluk-sm); font-size: 0.9rem; }

/* --- Yazdır: yalnız sonuç tabloları --- */
@media print {
  .tepe-bar, .site-footer, .sayfa__iz, .sayfa__ozet, .sayfa__not, .sayfa__diger,
  .arka-plan, .izgara, .kareler, main > section:not(#borc-arac), #arac-baslik,
  .bkontrol__adimlar, .kborc__lejant, .kborc__blok:not(#kb-sonuc-blok), .kborc__belge,
  .bkontrol__dugmeler, .kborc__bolum label { display: none !important; }
  .kborc__borc { border-color: #000; }
  .sayfa__tablo-kap { overflow: visible; }
}

/* --- Teşekkür (site sahibi: "daha samimi bir teşekkür olsun") --- */
.kborc__tesekkur {
  margin: var(--bosluk-lg) 0; padding: var(--bosluk-md) var(--bosluk-lg);
  border-radius: var(--yuvarlak); background: rgba(255,255,255,0.7);
  border: 1px solid var(--renk-cizgi); border-left: 4px solid var(--kehribar);
}
.kborc__tesekkur h2 { margin-top: 0; }
.kborc__tesekkur > :last-child { margin-bottom: 0; }
.kborc__tesekkur a { overflow-wrap: anywhere; }

/* --- Diğer kesintiler: "Kişiden kes" / "Kesme" (Excel: Tam Kes / Kesme) --- */
.kborc__ipucu { margin: 0 0 0.4rem; font-size: 0.82rem; color: var(--renk-metin-yumusak); }
.kborc__kesme { display: flex; flex-wrap: wrap; gap: 0.2rem 0.8rem; margin-top: 0.3rem; font-size: 0.8rem; }
.kborc__kesme label { display: inline-flex; align-items: center; gap: 0.25rem; cursor: pointer; white-space: nowrap; }
.kborc__kesme label:has(input:checked) { font-weight: 700; color: var(--durum-siz-koyu); }

/* --- Telefon (≤ 560px): kalem satırı İKİ KAT — üstte ad, altta tutar + rozet.
   Tek katta ad + 8,5rem kutu + rozet 370px'e çıkıyor, 360px'lik ekranda SAYFA yana
   kayıyordu (mobil-test.html, 23.10.2026). Durum rengi hücreden satıra taşınır. --- */
@media (max-width: 560px) {
  .kborc__tablo, .kborc__tablo tbody { display: block; }
  .kborc__tablo tr {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 0.3rem 0.5rem;
    margin: 0 0 0.3rem; padding: 0.45rem 0.55rem; border-radius: 0.5rem;
    border-left: 4px solid var(--durum-cizgi); background: rgba(255,255,255,0.75);
  }
  .kborc__tablo td,
  .kborc__tablo tr[data-durum] td { display: block; padding: 0; width: auto; background: none; border: 0; border-radius: 0; }
  .kborc__tablo td:first-child { grid-column: 1 / -1; border: 0; }
  .kborc__tablo td:last-child { width: auto; }
  .kborc__tablo tr[data-durum="bordro"] { background: var(--durum-tamam-zemin); border-left-color: var(--durum-tamam); }
  .kborc__tablo tr[data-durum="elle"]   { background: var(--durum-siz-zemin); border-left-color: var(--durum-siz); }
  .kborc__tablo tr[data-durum="eksik"]  { background: var(--durum-oto-zemin); border-left-color: var(--kehribar); }
  .kborc__tablo tr[data-durum="ayna"]   { background: #f4f2ec; }
  .kborc__tutar { width: 100%; }
}

/* --- Telefon: sonuç tabloları sıkı — dört sütun 360px'e sığsın. Varsayılanda
   "Hak Edilmeyen" (asıl sonuç) ekran dışında kalıyor, kaydırmadan görünmüyordu.
   Sığmayan (5. bölümün "Seçim" sütunu) yine kendi kabında kayar (sayfa.css). --- */
@media (max-width: 560px) {
  .kborc__bolum table { min-width: 0; font-size: 0.8rem; }
  .kborc__bolum th, .kborc__bolum td { padding: 0.4rem 0.25rem; }
  /* th.tutar ŞART: sayfa.css'teki `.sayfa th.tutar { white-space: nowrap }` (0,2,1) yalnız
     `thead th` ile ezilemiyor — başlık tek satırda kalıp sütunu 124px'e şişiriyordu. */
  .kborc__bolum thead th, .kborc__bolum thead th.tutar { white-space: normal; font-size: 0.7rem; line-height: 1.25; vertical-align: bottom; }
  .kborc__bolum td:first-child { overflow-wrap: anywhere; }
  .kborc__borc strong { font-size: 1.5rem; }
}