:root {
  --ana: #1f4e78; --ana-acik: #e8f0f8; --kenar: #d0d7de; --metin: #1f2328;
  --soluk: #656d76; --uyari: #fff2cc; --hata: #c62828; --yesil: #2e7d32; --zemin: #f6f8fa;
}
* { box-sizing: border-box; }
body { margin: 0; font: 14px/1.4 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
       color: var(--metin); background: var(--zemin); }
header { display: flex; align-items: center; gap: 24px; padding: 0 20px; height: 52px;
         background: var(--ana); color: #fff; }
header h1 { font-size: 17px; margin: 0; }
header nav { display: flex; gap: 4px; flex: 1; }
header .kullanici { font-size: 13px; opacity: .9; }
header a { color: #fff; }
.sekme { background: transparent; color: #fff; border: 0; padding: 8px 14px; border-radius: 6px; }
.sekme.aktif, .sekme:hover { background: rgba(255,255,255,.18); }

main { padding: 16px 20px; }
.panel { display: none; }
.panel.aktif { display: block; }

button, .dugme { font: inherit; padding: 7px 14px; border: 1px solid var(--kenar); background: #fff;
  border-radius: 6px; cursor: pointer; display: inline-block; }
button:hover, .dugme:hover { background: var(--ana-acik); }
button:disabled { opacity: .5; cursor: default; }
.birincil { background: var(--ana); color: #fff; border-color: var(--ana); }
.birincil:hover { background: #163a5a; }
input, select { font: inherit; padding: 6px 8px; border: 1px solid var(--kenar); border-radius: 6px;
  width: 100%; background: #fff; }

.arac-cubugu { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
.arac-cubugu input[type=search] { max-width: 360px; }
.ayrac { width: 1px; height: 24px; background: var(--kenar); margin: 0 4px; }
.durum { color: var(--soluk); }
.durum.hata { color: var(--hata); }

.birak { border: 2px dashed var(--kenar); border-radius: 8px; padding: 18px; text-align: center;
  color: var(--soluk); margin-bottom: 12px; background: #fff; }
.birak.uzerinde { border-color: var(--ana); background: var(--ana-acik); }

#uyarilar .uyari { background: var(--uyari); border: 1px solid #e6cf7a; padding: 8px 12px;
  border-radius: 6px; margin-bottom: 8px; }

.duzen { display: flex; gap: 16px; align-items: flex-start; }
.sol { flex: 1; min-width: 0; }
.sag { width: 42%; position: sticky; top: 12px; background: #fff; border: 1px solid var(--kenar);
  border-radius: 8px; overflow: hidden; }
.sag iframe { width: 100%; height: calc(100vh - 150px); border: 0; }
.onizleme-baslik { display: flex; justify-content: space-between; align-items: center;
  padding: 6px 10px; border-bottom: 1px solid var(--kenar); font-size: 13px; }
.onizleme-baslik button { padding: 0 8px; }

.ust-bilgi { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 10px; background: #fff;
  border: 1px solid var(--kenar); border-radius: 8px; padding: 12px; margin-bottom: 12px; }
.ust-bilgi label { font-size: 12px; color: var(--soluk); display: flex; flex-direction: column; gap: 3px; }
.ust-bilgi .genis { grid-column: 1 / -1; }

.tablo-kap { background: #fff; border: 1px solid var(--kenar); border-radius: 8px; overflow-x: auto; }
#kalemTablo { width: 100%; border-collapse: collapse; }
#kalemTablo th { background: var(--ana-acik); text-align: left; padding: 8px 6px; font-weight: 600;
  font-size: 12px; white-space: nowrap; border-bottom: 1px solid var(--kenar); }
#kalemTablo td { border-bottom: 1px solid #eef0f2; padding: 0; }
#kalemTablo td input { border: 0; border-radius: 0; padding: 7px 6px; background: transparent; }
#kalemTablo td input:focus { outline: 2px solid var(--ana); background: #fff; }
#kalemTablo td.sayi input, #kalemTablo td.tutar { text-align: right; }
#kalemTablo td.tutar { padding: 7px 6px; white-space: nowrap; font-variant-numeric: tabular-nums; }
#kalemTablo .aciklama { width: 40%; }
#kalemTablo td:first-child input { width: 42px; }
#kalemTablo td.kucuk input { width: 70px; }
#kalemTablo tr.uyarili { background: var(--uyari); }
#kalemTablo td.sil button { border: 0; background: none; color: var(--hata); padding: 4px 8px; }
.tablo-alt { display: flex; align-items: center; gap: 12px; margin: 8px 0 12px; }
.ipucu { color: var(--soluk); font-size: 12px; }

.toplamlar { margin-left: auto; border-collapse: collapse; min-width: 320px; background: #fff;
  border: 1px solid var(--kenar); border-radius: 8px; }
.toplamlar td { padding: 6px 12px; }
.toplamlar td:last-child { text-align: right; font-variant-numeric: tabular-nums; }
.toplamlar .genel td { font-weight: 700; border-top: 1px solid var(--kenar); }
#pdfToplamSatir td { color: var(--soluk); font-size: 12px; }
#pdfToplamSatir.farkli td { color: var(--hata); font-weight: 600; }

.gecmis { margin-top: 16px; background: #fff; border: 1px solid var(--kenar); border-radius: 8px; padding: 10px 14px; }
.gecmis h3 { margin: 0 0 8px; font-size: 14px; }
.gecmis table { border-collapse: collapse; width: 100%; }
.gecmis td, .gecmis th { text-align: left; padding: 4px 8px; border-bottom: 1px solid #eef0f2; }

.liste { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--kenar); }
.liste th, .liste td { padding: 8px; text-align: left; border-bottom: 1px solid #eef0f2; }
.liste th { background: var(--ana-acik); font-size: 12px; }
.liste td.para { text-align: right; font-variant-numeric: tabular-nums; }
.liste tr:hover td { background: #fafbfc; }
.liste a { color: var(--ana); cursor: pointer; }

.kart { background: #fff; border: 1px solid var(--kenar); border-radius: 8px; padding: 20px; max-width: 640px; }
.kart h2 { margin-top: 0; }
.kart + .kart { margin-top: 16px; }

.giris-sayfa { display: grid; place-items: center; min-height: 100vh; }
.giris-kutu { background: #fff; padding: 28px; border-radius: 10px; border: 1px solid var(--kenar);
  width: 340px; display: flex; flex-direction: column; gap: 14px; }
.giris-kutu h1 { margin: 0; font-size: 20px; color: var(--ana); }
.giris-kutu label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
.giris-kutu button { background: var(--ana); color: #fff; border: 0; padding: 10px; }
.hata { color: var(--hata); margin: 0; }
.bilgi { background: var(--ana-acik); padding: 8px; border-radius: 6px; margin: 0; }

@media (max-width: 1000px) {
  .duzen { flex-direction: column; }
  .sag { width: 100%; position: static; }
  .ust-bilgi { grid-template-columns: 1fr 1fr; }
}