/* ── Personel Maliyet Portalı · Area Değerleme kurumsal kimliği ──────
   Palet ve tipografi areadegerleme.com ile aynı: koyu lacivert zemin
   (#0f1c2d/#0a141f), turuncu vurgu (#e67e22), Inter yazı tipi.
   İmza: tüm para sütunları IBM Plex Mono + tabular rakamlarla kuruşuna
   kadar alt alta hizalanır. Kâr = yeşil, zarar = kırmızı (veri anlamı). */

:root {
  --defter:       #0f1c2d;   /* kurumsal lacivert */
  --defter-koyu:  #0a141f;
  --defter-acik:  #1a2942;
  --pirinc:       #e67e22;   /* kurumsal turuncu vurgu */
  --pirinc-acik:  #f39c12;
  --kagit:        #f3f4f6;   /* zemin */
  --yuzey:        #ffffff;
  --murekkep:     #111827;   /* ana metin */
  --soluk:        #6b7280;   /* ikincil metin */
  --cizgi:        #e5e7eb;
  --cizgi-koyu:   #cbd2d9;
  --kar:          #176b3c;
  --kar-zemin:    #e6f1e8;
  --zarar:        #a8352a;
  --zarar-zemin:  #f7e9e6;
  --uyari-zemin:  #fdf3e7;
  --govde-font:   "Inter", "Segoe UI", system-ui, sans-serif;
  --marka-font:   "Inter", "Segoe UI", sans-serif;
  --para-font:    "IBM Plex Mono", Consolas, monospace;
  --golge:        0 1px 2px rgba(15, 28, 45, .06), 0 4px 16px rgba(15, 28, 45, .05);
}

* { box-sizing: border-box; }
html {
  -webkit-text-size-adjust: 100%;
  /* Dikey kaydırma çubuğunun yeri HEP ayrılır: sayfa içeriği kısalıp uzadığında
     (filtre, ay değişimi, önizleme yüklenmesi) ortalanmış içerik sağa-sola oynamaz */
  overflow-y: scroll;
  scrollbar-gutter: stable;
}
body {
  margin: 0;
  font-family: var(--govde-font);
  background: var(--kagit);
  color: var(--murekkep);
  font-size: 14px;
  line-height: 1.45;
}
main { padding: 18px 22px 48px; max-width: 1520px; margin: 0 auto; }

::selection { background: #fbd8b6; }
:focus-visible { outline: 2px solid var(--pirinc); outline-offset: 2px; border-radius: 3px; }

/* ── İkonlar: tek aile (Lucide çizgi seti), tutarlı boyut jetonları ── */
.ikon {
  width: 16px; height: 16px; flex: none;
  fill: none; stroke: currentColor; stroke-width: 2;
  stroke-linecap: round; stroke-linejoin: round;
  vertical-align: -3px;
}
button .ikon, .btn .ikon { width: 15px; height: 15px; margin-right: 6px; }
.ikon-h1 { width: 22px; height: 22px; margin-right: 9px; color: var(--defter); vertical-align: -4px; }

/* ── Üst şerit: defter kapağı ──────────────────────────────────── */
.topnav {
  display: flex; flex-wrap: wrap; align-items: center; gap: 2px;
  background: linear-gradient(180deg, var(--defter) 0%, var(--defter-koyu) 100%);
  border-bottom: 3px solid var(--pirinc);
  padding: 8px 18px; position: sticky; top: 0; z-index: 50;
}
.brand { margin-right: 18px; display: inline-flex; align-items: center; }
.brand img.logo { height: 34px; width: auto; display: block; }
.topnav a {
  color: #c4ccd8; text-decoration: none; padding: 8px 12px;
  border-radius: 7px; white-space: nowrap; font-weight: 500;
  transition: background .15s, color .15s;
  display: inline-flex; align-items: center; gap: 7px;
}
.topnav a .ikon { opacity: .85; }
.topnav a.aktif .ikon { color: var(--pirinc); opacity: 1; }
.topnav a:hover { background: rgba(255, 255, 255, .10); color: #fff; }
.topnav a.aktif {
  background: rgba(230, 126, 34, .16); color: #ffd9b3;
  box-shadow: inset 0 -2px 0 var(--pirinc);
}
.topnav a.cikis { margin-left: auto; color: #e8b3a9; }
.topnav a.cikis:hover { background: rgba(168, 53, 42, .35); color: #fff; }

/* ── Başlıklar ─────────────────────────────────────────────────── */
h1 {
  font-family: var(--marka-font); font-size: 20px; font-weight: 700;
  letter-spacing: -.01em; margin: 10px 0 16px;
}
h2 {
  font-size: 12.5px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .07em; color: var(--soluk); margin: 18px 0 10px;
}
.panel h2, .grafik-kab h2 { margin-top: 0; }

/* ── Araç çubuğu + form denetimleri ───────────────────────────── */
.bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 14px; }
.bar label { font-weight: 600; color: var(--soluk); font-size: 13px; }
/* Ay/yıl değişince düzen KAYMASIN: başlık hep kendi satırında (ay adının
   uzunluğu kontrolleri itmez), ay seçici sabit genişlikte (AĞUSTOS ile OCAK
   aynı yer kaplar) → tablolar ekranda hep aynı konumda kalır */
.bar > h1 { flex: 0 0 100%; }
.bar select[name="ay"] { width: 118px; }
.bar select[name="tur"] { width: 130px; }
.bar select[name="sube"] { width: 130px; }
.bar select[name="durum"] { width: 110px; }
.bar form.bar { margin: 0; }

select, input[type=text], input[type=password], input[type=number], input[type=email] {
  padding: 7px 10px; border: 1px solid var(--cizgi-koyu); border-radius: 7px;
  font-size: 14px; font-family: var(--govde-font);
  background: var(--yuzey); color: var(--murekkep);
}
select:focus, input:focus { border-color: var(--pirinc); outline: none;
  box-shadow: 0 0 0 3px rgba(230, 126, 34, .15); }
/* Dosya seçiciler: tarayıcının varsayılan gri düğmesi yerine kurumsal görünüm.
   ::file-selector-button düğmenin KENDİSİNİ biçimlendirir; böylece Bordro,
   Hakediş, Prim, Aktarma ve Teklif sayfalarındaki tüm alanlar tek yerden döner. */
input[type=file] {
  font-size: 13px; font-family: var(--govde-font); color: var(--soluk);
  padding: 4px 8px 4px 4px; max-width: 100%;
  border: 1px solid var(--cizgi-koyu); border-radius: 7px; background: var(--yuzey);
}
input[type=file]::file-selector-button {
  margin-right: 10px; padding: 7px 14px; border: none; border-radius: 6px;
  background: var(--defter); color: #f5f7fa;
  font-family: var(--govde-font); font-size: 13px; font-weight: 600;
  cursor: pointer; transition: background .15s;
}
input[type=file]::file-selector-button:hover { background: var(--defter-acik); }
input[type=file]:focus { border-color: var(--pirinc); outline: none;
  box-shadow: 0 0 0 3px rgba(230, 126, 34, .15); }
input[type=file]:disabled::file-selector-button { opacity: .45; cursor: not-allowed; }
input[type=checkbox] { width: 16px; height: 16px; accent-color: var(--defter); }

button, .btn {
  padding: 8px 15px; border: none; border-radius: 7px;
  background: var(--defter); color: #f5f7fa;
  font-size: 14px; font-weight: 600; font-family: var(--govde-font);
  cursor: pointer; text-decoration: none; display: inline-block;
  transition: background .15s, transform .05s;
}
button:hover, .btn:hover { background: var(--defter-acik); }
button:active, .btn:active { transform: translateY(1px); }
.btn-gri { background: #6b7280; } .btn-gri:hover { background: #565c66; }
.btn-kirmizi { background: var(--zarar); } .btn-kirmizi:hover { background: #8d2b21; }
.btn-yesil { background: var(--kar); } .btn-yesil:hover { background: #115530; }
.btn-turuncu { background: var(--pirinc); color: #fff; } .btn-turuncu:hover { background: #cf6a14; }
button:disabled { opacity: .45; cursor: not-allowed; }

/* ── Özet kartları ─────────────────────────────────────────────── */
.kartlar { display: grid; grid-template-columns: repeat(auto-fit, minmax(175px, 1fr)); gap: 12px; margin-bottom: 18px; }
.kart {
  background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 10px;
  padding: 13px 16px 12px; box-shadow: var(--golge);
  border-top: 3px solid var(--defter);
}
.kart .etiket {
  font-size: 11px; color: var(--soluk); font-weight: 700;
  text-transform: uppercase; letter-spacing: .08em;
}
.kart .deger {
  font-family: var(--para-font); font-variant-numeric: tabular-nums;
  font-size: 20px; font-weight: 600; margin-top: 5px; letter-spacing: -.01em;
}
/* Mail gönderme kapısı: numaralı adımlar, tamamlanmamış adım soluk durur */
.mail-adim { margin: 0; padding-left: 22px; }
.mail-adim > li { margin-bottom: 14px; padding-left: 4px; }
.mail-adim > li::marker { font-weight: 700; color: var(--pirinc); }
.mail-adim button[disabled] { opacity: .45; cursor: not-allowed; }

/* Düşülen tutarlar (mahsup, kesinti) zarar rengiyle yazılır */
.neg-yazi { color: var(--zarar); }
/* Tutarın altındaki küçük açıklama satırı (ör. "− mahsup") */
.alt-not { font-size: 11px; color: var(--zarar); font-weight: 600;
           font-family: var(--govde-font); margin-top: 2px; }

/* ── Paneller ──────────────────────────────────────────────────── */
.panel {
  background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 10px;
  padding: 15px 18px; margin-bottom: 16px; box-shadow: var(--golge);
}
.iki-kolon { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 900px) { .iki-kolon { grid-template-columns: 1fr; } }
/* Grid/flex öğeleri içeriğe göre şişip taşmasın; içteki .tablo-kab yatay
   kaysın (özellikle mobilde Tür/Şube kırılımı ve Zarar Eden tabloları). */
.iki-kolon > *, .iki-kolon .panel { min-width: 0; }
/* Özet grup satırları: tıklanınca o grubun kişileri açılır */
.grup-satir { cursor: pointer; }
.grup-satir .grup-ok { color: #9aa5b1; font-size: 10px; display: inline-block; transition: transform .12s; }
.grup-satir.acik .grup-ok { transform: rotate(90deg); }
.grup-kisi.gizli { display: none; }
.grup-kisi td { background: #f8fafc; font-size: 12.5px; }
.grup-kisi td:first-child { padding-left: 24px; }

/* ── Tablolar: defter sayfası ─────────────────────────────────── */
.tablo-kab {
  overflow-x: auto; background: var(--yuzey);
  border: 1px solid var(--cizgi); border-radius: 10px; box-shadow: var(--golge);
}
table { border-collapse: collapse; width: 100%; }
th {
  background: #f4f6f2; text-align: left; font-size: 11.5px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .05em; color: var(--soluk);
  padding: 9px 11px; border-bottom: 2px solid var(--cizgi-koyu);
  position: sticky; top: 0; white-space: nowrap; cursor: pointer; user-select: none;
}
th:hover { color: var(--defter); }
td { padding: 7px 11px; border-bottom: 1px solid #e8ede7; white-space: nowrap; }
tr:hover td { background: #f2f6f1; }
/* ZEBRA PORTAL GENELİ (2026-08-15): mutabakat defterindeki çift-satır dokusu
   tüm .tablo-kab tablolarına. :where() = SIFIR özgüllük — hover, tr.toplam,
   td.hesap, kâr/zarar dolguları gibi HER renkli kural zebrayı otomatik ezer. */
:where(.tablo-kab table tbody tr:nth-child(even) td) { background: #fafbf8; }

/* İmza: para sütunları tabular mono — kuruşlar alt alta hizalanır */
td.sag, th.sag { text-align: right; }
td.sag {
  font-family: var(--para-font); font-variant-numeric: tabular-nums;
  font-size: 13px; letter-spacing: -.01em;
}
td.orta, th.orta { text-align: center; }

td a { color: var(--defter); text-decoration: none; font-weight: 600; }
td a:hover { text-decoration: underline; text-decoration-color: var(--pirinc); }

tr.pos td { color: #0b5427; background: #c5e8cf; }
tr.neg td { color: #7c1d13; background: #f2c0b8; }
tr.pos:hover td { background: #b6e1c3; }
tr.neg:hover td { background: #edb1a7; }
tr.neu td { color: var(--soluk); }
/* Mutabakat durum renkleri (belirgin) */
tr.sari td { background: #f6df7e; color: #574508; }
tr.sari:hover td { background: #f1d766; }
td.hucre-yesil { background: #8fd6a4 !important; color: #0b5427; font-weight: 700; }
/* ÖDENEBİLİR: satırın tamamı FATURA/HARÇ GELDİ hücre yeşiliyle aynı tonda */
tr.yesil-satir td { background: #8fd6a4; color: #0b5427; }
tr.yesil-satir:hover td { background: #7fcd96; }
/* Faaliyet tablosu: Excel'deki gibi gelir ve gider YAN YANA — ama yalnızca
   gerçekten sığdığında. Ölçüyü ekran genişliğinden alamayız: Invex rayı
   açıkken main `calc(100vw - 560px)`e iner, yani 1440px'lik ekranda kullanılan
   alan 880px olur. Bu yüzden container query ile KAPSAYICININ kendi genişliği
   ölçülür; 1180px'in altına düşerse tablolar alt alta yığılır.
   (Container query desteklemeyen eski tarayıcıda kural yok sayılır → alt alta.) */
.faaliyet-kap { container-type: inline-size; }
.faaliyet-izgara { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; align-items: start; }
/* Yan yana YALNIZ çok geniş ekranda (≥1500px kapsayıcı) — o zaman her yarı
   ≥690px olur, DEĞ./% dahil tüm sütunlar rahat okunur. Altında ALT ALTA
   (tam genişlik) dururlar (kullanıcı: "sığmıyor, okunmuyor" 2026-08-20). */
@container (min-width: 1500px) {
  .faaliyet-izgara { grid-template-columns: minmax(0, 48fr) minmax(0, 52fr); }
  .faaliyet-izgara .panel { padding: 13px 12px; }
}
.faaliyet-izgara .panel { margin-bottom: 0; overflow: hidden; }
.faaliyet-izgara td, .faaliyet-izgara .tablo-sabit td.sag { font-size: 12.5px; }
.faaliyet-izgara td { padding: 5px 4px; }
/* ÖZGÜLLÜK NOTU: `.tablo-girdi td input` (0,1,2) sade `.faaliyet-izgara input`
   (0,1,1) kuralını eziyordu; girdiler .82rem + 6px yan boşlukla kalıyor ve
   8 haneli tutarlar ("₺10.423.988,00") kırpılıyordu. Seçici bilerek
   `.faaliyet-izgara .tablo-girdi td input` (0,2,2) yapıldı. Para girdisi
   tabular/mono yazı tipi kullandığı için HER karakter tam genişlik kaplar —
   nokta ve virgül de dar değildir, bu yüzden hesap sıkı tutulmalı. */
.faaliyet-izgara .tablo-girdi td input,
.faaliyet-izgara .tablo-girdi td select {
  font-size: 11.5px; padding: 3px 4px;
}
/* Rakamlar tek satırda ve hizalı dursun; sütun daralsa bile kaydırılabilsin */
.faaliyet-izgara td.sag { white-space: nowrap; font-variant-numeric: tabular-nums; }
/* Yan yana eşikte (1120px) en dar sütun setinden küçük tutulur ki panel
   İÇİNDE yatay kaydırma çubuğu ÇIKMASIN — sığmayan sütun görünmesin.
   Yalnızca telefon gibi gerçekten dar ekranlarda kaydırma devreye girer. */
.faaliyet-izgara table { min-width: 520px; }
.faaliyet-izgara .tablo-kab { overflow-x: auto; }
/* Kâr köprüsü ŞERİDİ: kapalıyken tek satır sağlık kontrolü */
.kopru-serit { margin-bottom: 16px; }
.kopru-serit summary {
  cursor: pointer; display: flex; align-items: center; gap: 12px;
  flex-wrap: wrap; list-style: none;
}
.kopru-serit summary::-webkit-details-marker { display: none; }
.kopru-serit .kopru-akis { color: #4b5563; }
.kopru-serit .kopru-akis b { font-family: var(--para-font); }
.kopru-serit .kopru-ok { margin-left: auto; color: #8a94a3; font-size: .82rem; }
.kopru-serit[open] .kopru-ok { display: none; }
.kopru-sorun { border-left: 3px solid var(--zarar); }

/* Özet: sol kolon dikey yığın (kapanış + kırılım + uyarılar); uyarı paneli
   esner → sağdaki uzun listeden artan boşluğu gerektiği kadar kullanır */
.alt-kolon { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.alt-kolon .panel { margin: 0; }
.uyari-paneli { flex: 1; }
/* Sağdaki panel de satırı doldurur → iki kolonun BİTİŞİ hizalı
   (panelin varsayılan alt marjı 16px kısa bırakıyordu) */
.alt-kolon + .panel { margin: 0; }

/* Yakıt kişi sayfası: sol tablo + sağ grafik. GAP kartlarla AYNI (12px) →
   sol kolon 2. KPI kutusunun bitişinde biter, grafik 3.'nün hizasında
   başlar (2026-08-16 kullanıcı kuralı) */
.kisi-izgara {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
  align-items: stretch;   /* grafik kabı tablonun BİTİŞİNE kadar uzar */
}
.kisi-izgara .grafik-kab { display: flex; flex-direction: column; }
.kisi-izgara .grafik-kab canvas { flex: 1 1 0; min-height: 220px; }
@media (max-width: 1000px) {
  .kisi-izgara { grid-template-columns: 1fr; }
  .kisi-izgara .grafik-kab canvas { min-height: 180px; }
}

/* Ayarlar: iki kolonlu ızgara — sağ taraf boş kalmasın (2026-08-16) */
.ayar-izgara {
  display: grid; grid-template-columns: 1fr 1fr; gap: 16px;
  align-items: stretch;   /* kolonlar aynı boyda biter */
}
.ayar-izgara table { min-width: 0; }
/* Son paneller kolon dibine kadar esner → İşlem Günlüğü ile Veri
   Yedekleme'nin BİTİŞLERİ HİZALI; günlük kabı kalan boşluğu doldurur,
   içeriği kendi içinde kayar (2026-08-16 kullanıcı kuralı) */
.ayar-izgara .alt-kolon > .panel:last-child {
  display: flex; flex-direction: column;
  flex: 1 0 auto;   /* kısa kolonun son paneli dibe kadar büyür */
}
.ayar-izgara .alt-kolon > .panel:last-child > .tablo-kab {
  /* flex-basis 0 ŞART: auto kalırsa taban=içerik olur, günlük 200 kayıtla
     kolonu şişirir ve kaydırma hiç devreye girmez */
  flex: 1 1 0; min-height: 220px; overflow-y: auto;
}
.gunluk-kab { max-height: none; }
@media (max-width: 1100px) {
  .ayar-izgara { grid-template-columns: 1fr; }
  .gunluk-kab { max-height: 340px; }   /* tek kolonda sınırsız uzamasın */
}

/* Gelir panelindeki yıllık grafik esner: iki kolon AYNI HİZADA biter */
.faaliyet-izgara { align-items: stretch; }
.faaliyet-izgara .panel:first-child { display: flex; flex-direction: column; }
.fa-graf { flex: 1; display: flex; flex-direction: column; min-height: 250px; }
.fa-graf canvas { flex: 1; min-height: 210px; }
.faaliyet-izgara h2 { font-size: 15px; }
/* Başlıklar KIRPILMASIN: dar sütunlarda üç noktayla kesilmek yerine alt
   satıra insinler (th varsayılanı nowrap + ellipsis; burada iptal ediyoruz) */
.basliklar-sarsin th {
  white-space: normal; overflow: visible; text-overflow: clip;
  line-height: 1.15; vertical-align: bottom; font-size: 10.5px;
  letter-spacing: .03em; padding: 7px 6px;
}

/* Bordro önizlemesinde elle düzeltilebilir tutar hücreleri */
input.brd-duzelt {
  width: 100%; max-width: 130px; text-align: right; font-size: 12.5px;
  padding: 3px 5px; border: 1px solid transparent; background: transparent;
}
input.brd-duzelt:hover { border-color: var(--cizgi); background: #fff; }
input.brd-duzelt:focus { border-color: var(--defter); background: #fff; }
/* Dosyadan okunandan FARKLI: gözden kaçmasın */
input.brd-duzelt.brd-degisti {
  background: #fdf1e3; border-color: var(--pirinc); font-weight: 700;
}

/* Kadrodan ayrılmış kişi: geçmiş ay listesinde görünür, personel listesinde değil */
.ayrildi-im {
  display: inline-block; margin-left: 6px; padding: 1px 6px; border-radius: 9px;
  background: #efe3d4; color: #8a6212; font-size: 10.5px; font-weight: 700;
  letter-spacing: .03em; vertical-align: middle; cursor: help;
}

/* Elle düzeltilmiş prim: hesaplanan değerden ayrışsın */
td.prim-duzeltildi { background: #fdf1e3; }
.duzeltme-im { color: #b98a00; font-size: 11px; }

/* Yalnız yöneticiye açık bölümler: kilit rengiyle ayrışsın */
.gizli-kart { border-color: #b98a00; background: #fffdf6; }
.gizli-panel { border-left: 3px solid #b98a00; }
/* Portal verisiyle uyuşmayan kalem: dikkat çeksin ama okunaklı kalsın */
.portal-fark { background: #fdf1e3; color: #8a5200; font-weight: 700; }

/* Tablo altındaki bakiye özeti: genel toplamdan ödenenler düşülür */
tr.bakiye-ara td { background: #f7f9fb; color: var(--soluk); font-weight: 600; }
tr.bakiye-harc td { color: #6b2fa0; }
tr.bakiye-vurgu td {
  background: #eef2f7; color: var(--murekkep); font-size: 14.5px;
  border-top: 2px solid var(--defter); padding-top: 10px; padding-bottom: 10px;
}
/* HARÇ KALDI: faturası ödenmiş, belediye harcı bekleyen satır (mor) */
tr.mor-satir td { background: #d9c6ee; color: #4b2673; }
tr.mor-satir:hover td { background: #cdb5e8; }
tr.mor-satir .alt-not { color: #6b2fa0; }

/* Bölüm başlığı satırı (mutabakat: çözüm ortakları / kadrolu) */
tr.bolum-baslik td {
  background: var(--defter); color: #f2efe6; font-weight: 700;
  font-size: 12px; text-transform: uppercase; letter-spacing: .06em;
}
tr.bolum-baslik:hover td { background: var(--defter); }

/* Uzun ad/ünvanları kısalt (tablo genişlemesin); tam hali title ile görünür */
.ad-kisalt { display: inline-block; max-width: 300px; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; }
/* Sınıf doğrudan <td> üzerindeyse hücre table-cell kalmalı; aksi halde
   satır düzeni bozulur (metin yukarı kayar, kesik çizgiler oluşur) */
td.ad-kisalt, th.ad-kisalt { display: table-cell; vertical-align: middle; }

/* Sayfalama */
.sayfalama { display: flex; gap: 6px; align-items: center; margin-top: 12px; flex-wrap: wrap; }
.sayfalama a, .sayfalama span.mevcut {
  padding: 6px 12px; border-radius: 7px; text-decoration: none;
  border: 1px solid var(--cizgi-koyu); background: var(--yuzey); color: var(--murekkep); }
.sayfalama span.mevcut { background: var(--defter); color: #fff; border-color: var(--defter); }
.sayfalama a:hover { border-color: var(--pirinc); }

/* SONUÇ RAKAMLARI KALIN (2026-08-15, portal geneli kullanıcı kuralı):
   toplam satırları, tfoot toplamları, ödenecek/son tutar hücreleri */
tr.toplam td {
  font-weight: 700; background: #ecefe9; border-top: 2px solid var(--pirinc);
  border-bottom: none;
}
tfoot td { font-weight: 700; }
/* Prim tutarları kalın (uzman/denetmen/operasyon listeleri) */
#pu-tablo td:last-child, #pd-tablo td:last-child,
.op-bolum table td:last-child { font-weight: 700; }
.odenecek-hucre { font-weight: 700; }
#mut-genel td:last-child { font-weight: 700; }
tr.bakiye-vurgu td { font-weight: 700; }
td.tik { text-align: center; font-size: 16px; cursor: pointer; }

/* Düzenlenebilir hücreler: kalem imleci + kesikli altçizgi ipucu */
td.duzenle { cursor: cell; }
td.duzenle:hover {
  outline: 2px solid var(--defter-acik); outline-offset: -2px;
  border-radius: 4px; background: #eef6ef;
}
td input.hucre-edit {
  width: 112px; padding: 4px 7px; font-size: 13px; text-align: right;
  font-family: var(--para-font);
  border: 2px solid var(--defter-acik); border-radius: 5px;
}
td.kaydedildi { animation: kaydet-parla 1s ease-out; }
@keyframes kaydet-parla { 0% { background: #d3ecd9; } 100% { background: transparent; } }

/* ── Durum / mesaj öğeleri ─────────────────────────────────────── */
.uyari-listesi { margin: 0; padding-left: 20px; color: var(--zarar); }
.uyari-listesi li { margin: 5px 0; }
.tik-ok { color: var(--kar); font-weight: 600; }
.tik-hata { color: var(--zarar); font-weight: 600; }

.rozet {
  display: inline-block; padding: 2px 10px; border-radius: 20px;
  font-size: 11.5px; font-weight: 700; letter-spacing: .03em;
}
.rozet-mevcut { background: #edefeb; color: var(--soluk); }
.rozet-yeni { background: var(--kar-zemin); color: var(--kar); }
.rozet-donus { background: #e3ecf5; color: #2d5a86; }
.rozet-cikis { background: var(--zarar-zemin); color: var(--zarar); }

.kilit-uyari {
  background: var(--zarar-zemin); color: var(--zarar);
  border: 1px solid #e5c4bc; border-left: 4px solid var(--zarar);
  padding: 9px 14px; border-radius: 8px; font-weight: 600; margin-bottom: 14px;
}
.bilgi {
  background: var(--uyari-zemin); border: 1px solid #f3d4ae;
  border-left: 4px solid var(--pirinc); color: #6d4413;
  padding: 10px 14px; border-radius: 8px; margin-bottom: 14px; line-height: 1.55;
}
.hata-mesaj {
  background: var(--zarar-zemin); border: 1px solid #e5c4bc; color: var(--zarar);
  padding: 10px 14px; border-radius: 8px; margin-bottom: 12px;
}

.form-tablo { display: grid; grid-template-columns: auto 1fr; gap: 9px 12px; align-items: center; max-width: 480px; }
.form-tablo label { font-weight: 600; color: var(--soluk); font-size: 13px; }

/* ── Giriş sayfası ─────────────────────────────────────────────── */
.giris-sayfa {
  min-height: 100vh; display: grid; place-items: center;
  background:
    radial-gradient(1100px 500px at 50% -10%, rgba(26, 41, 66, .55), transparent 60%),
    var(--defter-koyu);
}
.giris-logo { display: block; margin: 0 auto 22px; width: min(70vw, 230px); height: auto; }
.giris-kutu {
  width: min(92vw, 370px); background: var(--yuzey);
  padding: 34px 32px 30px; border-radius: 14px;
  border-top: 4px solid var(--pirinc);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .35);
}
.giris-kutu h1 { text-align: center; margin: 6px 0 2px; }
.giris-alt { text-align: center; color: var(--soluk); font-size: 12.5px; margin: 0 0 18px; }
.giris-kutu label { font-weight: 600; color: var(--soluk); font-size: 13px; }
.giris-kutu input { width: 100%; margin: 8px 0 16px; }
.giris-kutu button { width: 100%; padding: 10px; background: var(--pirinc); }
.giris-kutu button:hover { background: #cf6a14; }

/* ── Grafik + günlük ───────────────────────────────────────────── */
.grafik-kab {
  background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 10px;
  padding: 12px; box-shadow: var(--golge);
}
.log-kutu {
  background: var(--defter-koyu); color: #cdd7e2;
  font-family: var(--para-font); font-size: 12.5px;
  padding: 14px; border-radius: 8px; max-height: 420px; overflow-y: auto;
  white-space: pre-wrap; line-height: 1.6;
}

/* ── Diyalog ───────────────────────────────────────────────────── */
dialog {
  border: none; border-radius: 12px; border-top: 4px solid var(--pirinc);
  padding: 22px; min-width: 340px; box-shadow: 0 24px 60px rgba(0, 0, 0, .3);
}
dialog::backdrop { background: rgba(8, 30, 24, .55); }

/* Müşteri/açıklama gibi alanlar yazarken de büyük görünür (sunucu da
   turkish_upper uygular; bu yalnız görsel geri bildirimdir) */
.buyuk-harf { text-transform: uppercase; }
.buyuk-harf::placeholder { text-transform: none; }

/* Tablo içi işlem düğmeleri: hücreye sığar, gerekirse alt satıra iner */
.islem-btn { display: flex; flex-wrap: wrap; gap: 4px; }
.islem-btn button { padding: 4px 8px; font-size: .82rem; }

/* Sütun eşleştirme şeridi: etiket + kutu çifti asla ayrı satıra düşmez
   (bordroda "Sigorta:" etiketi bir satırda, kutusu alt satırda kalıyordu) */
/* Etiket + kutu çifti tek parça davranır: dar ekranda etiket bir satırda,
   kutusu alt satırda kalmaz (bordro sütun eşleştirme, teklif ekleme formu) */
.bar .alan, .sutun-esles .alan { display: inline-flex; align-items: center; gap: 7px; }
.sutun-esles .alan select { max-width: 320px; }
.sutun-esles .alan label { white-space: nowrap; }

/* Para girdileri: rakamlar tablodaki gibi tabular mono hizada */
input.para {
  font-family: var(--para-font); font-variant-numeric: tabular-nums;
  text-align: right;
}

/* Düzenlenebilir tablo satırları: girdiler hücreye tam oturur, uzun
   adlar (il/ilçe/mahalle) kesilmeden okunacak kadar yer bulur */
.tablo-girdi td { padding: 5px 6px; }
.tablo-girdi td input, .tablo-girdi td select {
  padding: 5px 6px; font-size: .82rem; width: 100%;
}
/* Adres sütunları uzun adları (AFYONKARAHİSAR, ERTUĞRULGAZİ Mah.) kesmeden
   göstermeli; sayısal sütunlar dar kalır. Tablo içeriğe göre boyutlanır. */
/* İşlem sütunu sağa sabitlenir: tablo yatay kaydırılsa da Kaydet/Sil
   düğmeleri her zaman görünür kalır (adres sütunları tam genişlikte durur) */
.tablo-girdi th:last-child, .tablo-girdi td:last-child {
  position: sticky; right: 0; z-index: 2;
  background: var(--yuzey); box-shadow: -6px 0 8px -6px rgba(15, 28, 45, .25);
}
.tablo-girdi th:last-child { background: #f4f6f2; }
.tablo-girdi tr:hover td:last-child { background: #f2f6f1; }
/* Son sütun SABİTLENDİĞİ için saydam olamaz (altından satırlar geçerdi) →
   rengi elle verilir. Toplam satırlarında bu renk satırın kendi rengiyle
   AYNI olmalı; farklı olunca en sağda gözle görülür bir yama kalıyordu. */
/* KÂR/ZARAR satırı hem .toplam hem .bakiye-vurgu taşır. İkisinin özgüllüğü
   eşit olduğu için dosyada SONRA gelen `tr.toplam td` kazanır → satır #ecefe9
   olur. Sabit sütunun rengi de bu yüzden #ecefe9 olmalı; #eef2f7 verilince
   yama bu kez ters yöne kayıyordu. */
.tablo-girdi tr.toplam td:last-child { background: #ecefe9; }
.tablo-girdi tr.bakiye-vurgu:not(.toplam) td:last-child { background: #eef2f7; }

/* Tablo altı fiyat özeti: etiketler sağa hizalı, genel toplam vurgulu */
.ozet-alt td {
  padding: 6px 10px; border-bottom: none; background: #f7f9fb;
  color: #46586c; font-size: .9rem;
}
.ozet-alt tr:first-child td { border-top: 2px solid var(--cizgi-koyu); }
.ozet-alt td.sag:last-of-type { font-family: var(--para-font);
  font-variant-numeric: tabular-nums; color: var(--murekkep); }
.ozet-alt tr.genel td {
  font-weight: 700; font-size: .98rem; color: var(--murekkep);
  background: #eef2f7; border-top: 1px solid var(--cizgi-koyu);
}
.tablo-girdi .ozet-alt td:last-child { background: #f7f9fb; }
.tablo-girdi .ozet-alt tr.genel td:last-child { background: #eef2f7; }

.tablo-girdi input[name="il"], .tablo-girdi input[name="ilce"] { min-width: 140px; }
.tablo-girdi input[name="mahalle"] { min-width: 142px; }
.tablo-girdi input[name="ada"], .tablo-girdi input[name="parsel"] { min-width: 56px; }
.tablo-girdi input[name="m2"] { min-width: 72px; }
.tablo-girdi input[name="yuzde"] { min-width: 52px; }
.tablo-girdi input[name="toplu_grup"] { min-width: 68px; }
.tablo-girdi input[name="belediye_harci"] { min-width: 82px; }
.tablo-girdi select[name="tur"] { min-width: 120px; }

/* Sabit sütun düzeni: ay/yıl değişince tablo genişliği ve konumu sabit kalır.
   (Aylık Veri'de sütunlar o ayın en büyük rakamına göre boyutlanıp kayıyordu.) */
.tablo-sabit { table-layout: fixed; width: 100%; }
.tablo-sabit th, .tablo-sabit td { overflow: hidden; text-overflow: ellipsis; }
/* Para sütunları dar; rakam kırpılmasın diye iç boşluk ve punto ölçülü */
.tablo-sabit th, .tablo-sabit td { padding-left: 6px; padding-right: 8px; }
.tablo-sabit td.sag, .tablo-sabit th.sag { font-size: 13px; }

/* ── Uyarı kutusu başlığı: metin solda, işlem düğmesi sağda ────── */
.uyari-kutu .uyari-bas {
  display: flex; align-items: center; justify-content: space-between;
  gap: 14px; margin-bottom: 2px;
}
.uyari-kutu .uyari-bas button { flex: none; padding: 5px 13px; font-size: .85rem; }
.uyari-kutu ul { padding-left: 4px; }
.uyari-kutu li { margin-bottom: 2px; }

/* ── Ekrana sığan detay tablosu ────────────────────────────────
   Uzun metinli sütunlar (müşteri, nitelik) satır kaydırır; sayı ve tarih
   sütunları sabit genişlikte kalır → yatay kaydırma gerekmez. */
.tablo-sigdir { table-layout: fixed; width: 100%; }
.tablo-sigdir th, .tablo-sigdir td { white-space: normal; overflow-wrap: anywhere; }
.tablo-sigdir td.sag, .tablo-sigdir td.nowrap,
.tablo-sigdir th.sag { white-space: nowrap; }
.tablo-sigdir .ad-kisalt {
  max-width: none; overflow: visible; text-overflow: clip; white-space: normal;
}
.tablo-kab:has(.tablo-sigdir) { overflow-x: visible; }

/* ── Prim ayar ızgaraları (eşik/oran çiftleri hizalı, taşmasız) ── */
.dilim-izgara {
  display: grid; gap: 8px 14px; align-items: center; margin: 0 0 16px;
  grid-template-columns: auto minmax(120px, 170px) auto minmax(80px, 110px);
}
.dilim-izgara label { font-size: .85rem; font-weight: 600; color: #46586c; }
.dilim-izgara input { width: 100%; }
.kat-izgara {
  display: grid; grid-template-columns: 1fr 110px; gap: 6px 12px; max-width: 520px;
}
.kat-izgara label { align-self: center; font-size: .9rem; }
@media (max-width: 720px) {
  .dilim-izgara { grid-template-columns: auto 1fr; }
}

/* ── Invex rozeti + bağlantı paneli (nav sol köşe, her sayfada) ── */
.inv-rozet {
  display: inline-flex; align-items: center; gap: 6px;
  margin-left: 10px; padding: 5px 11px; border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 999px; background: rgba(255, 255, 255, .07); color: #c4ccd8;
  font: inherit; font-size: .82rem; font-weight: 600; cursor: pointer;
}
.inv-rozet:hover { background: rgba(255, 255, 255, .15); color: #fff; }
.inv-nokta { width: 8px; height: 8px; border-radius: 50%; background: var(--zarar); }
.inv-rozet.bagli .inv-nokta { background: #34d399; }
.inv-rozet.bagli { color: #a7f3d0; border-color: rgba(52, 211, 153, .45); }
.inv-etiket {
  display: block; margin: 8px 0 3px; font-size: .78rem;
  font-weight: 600; color: #46586c;
}
/* Sol boşlukta duran sabit ray (admin) */
.inv-ray {
  display: none; position: fixed; left: 14px; top: 78px; width: 244px;
  padding: 14px; border-radius: 12px; background: #fff;
  border: 1px solid #e3eaf2; border-top: 3px solid var(--pirinc);
  box-shadow: 0 8px 24px rgba(16, 42, 67, .08); z-index: 40;
}
.inv-ray-bas {
  display: flex; align-items: center; gap: 7px; width: 100%;
  padding: 0; border: none; background: none; cursor: pointer; text-align: left;
  font-family: inherit; font-weight: 700; font-size: .88rem; color: #1d2b3a;
}
.inv-ray-bas:hover { background: none; color: #000; }
.inv-ray-ad { flex: 1; }
.inv-ok { color: #7b8a9c; font-size: .8rem; transition: transform .15s; }
.inv-ray.acik .inv-ok { transform: rotate(180deg); }
/* Kapalıyken sadece başlık şeridi görünür (dropdown) */
.inv-ray-govde { display: none; }
.inv-ray.acik .inv-ray-govde { display: block; }
.inv-ray-durum { margin: 8px 0 0; font-size: .85rem; }
/* Bağlanınca başlıktaki nokta yeşile döner (beyaz zeminde koyu yeşil) */
.inv-ray.bagli .inv-nokta { background: var(--kar); }
.inv-ray input { width: 100%; font-size: .8rem; padding: 6px 8px; }
.inv-ray input#inv-email { text-overflow: ellipsis; }
.inv-ray-btn { width: 100%; margin-top: 12px; justify-content: center; }
.inv-ray-not { margin: 10px 0 0; font-size: .75rem; color: #7b8a9c; line-height: 1.35; }
.inv-ray-kapat {
  display: none; margin-left: auto; padding: 0 6px; border: none; background: none;
  color: #7b8a9c; font-size: 1.2rem; line-height: 1; cursor: pointer;
}
/* Sol boşluğun oluştuğu genişlikte ray görünür, nav rozeti gizlenir */
@media (min-width: 1240px) {
  body.inv-rayli main { max-width: min(1520px, calc(100vw - 560px)); }
  body.inv-rayli .inv-ray { display: block; }
  body.inv-rayli .inv-rozet { display: none; }
}
/* Dar ekran: rozetten açılan kutu (sağ üstte) */
@media (max-width: 1239px) {
  .inv-ray.gorunur { display: block; left: auto; right: 12px; top: 64px; z-index: 60; }
  .inv-ray.gorunur .inv-ray-kapat { display: block; }
}

.pozitif { color: var(--kar); }
.negatif { color: var(--zarar); }

/* ── Duyarlılık + erişilebilirlik ──────────────────────────────── */
@media (max-width: 720px) {
  main { padding: 12px 10px 40px; }
  /* MOBİL MENÜ = SOLDAN ÇEKMECE (2026-08-15, kullanıcı isteği):
     üstte ince bar (☰ + logo), menünün kendisi soldan kayan panel. */
  .mobil-bar {
    display: flex; align-items: center; gap: 10px;
    background: linear-gradient(180deg, var(--defter) 0%, var(--defter-koyu) 100%);
    border-bottom: 3px solid var(--pirinc);
    padding: 7px 12px; position: sticky; top: 0; z-index: 60;
  }
  .mobil-bar .logo { height: 28px; width: auto; display: block; }
  .menu-ac {
    background: none; border: none; padding: 7px; cursor: pointer;
    display: flex; flex-direction: column; gap: 4px;
  }
  .menu-ac span {
    width: 21px; height: 2px; background: #e8ecf2; border-radius: 2px;
  }
  .topnav {
    position: fixed; top: 0; left: 0; bottom: 0; width: min(78vw, 300px);
    flex-direction: column; align-items: stretch; flex-wrap: nowrap; gap: 3px;
    padding: 14px 10px; overflow-y: auto; z-index: 80;
    border-bottom: none; border-right: 3px solid var(--pirinc);
    transform: translateX(-110%); transition: transform .2s ease;
  }
  body.menu-acik .topnav { transform: none; }
  body.menu-acik .mobil-ort {
    display: block; position: fixed; inset: 0; z-index: 70;
    background: rgba(15, 28, 45, .5);
  }
  .topnav a { padding: 10px 12px; font-size: 14px; border-radius: 8px; }
  .topnav a.cikis { margin-left: 0 !important; }
  .brand { margin: 0 6px 12px; }
  .brand img.logo { height: 28px; }
  h1 { font-size: 16px; }
  .ikon-h1 { width: 18px; height: 18px; margin-right: 6px; }
  /* iOS 16px altı inputa dokununca sayfayı yakınlaştırır — engelle */
  select, input[type=text], input[type=password], input[type=number],
  input[type=email], input[type=date] { font-size: 16px; }
  /* Dokunma hedefleri rahat olsun */
  button, .btn { padding: 10px 15px; }
  .kartlar { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .kart { padding: 10px 12px 9px; }
  .kart .deger { font-size: 16px; }
  .form-tablo { grid-template-columns: 1fr; gap: 4px 0; max-width: none; }
  dialog { min-width: 0; width: min(94vw, 420px); padding: 16px; }
  .ad-kisalt { max-width: 170px; }
  td, th { padding: 7px 8px; }
  /* Grafik mobilde kompakt (sol eksen yazıları JS tarafında da gizlenir) */
  .grafik-kab canvas { height: 150px !important; }
}
/* ── MOBİL CİLA KATMANI (2026-08-15): masaüstü DEĞİŞMEZ, yalnız ≤720px.
   Çekmece menü zaten kurulu; burada içerik akışı telefon için rahatlar. #}*/
@media (max-width: 720px) {
  .bar { gap: 8px; }
  .bar h1 { width: 100%; }              /* başlık kendi satırında */
  .bar form, .bar .btn, .bar button { max-width: 100%; }
  .tablo-kab { -webkit-overflow-scrolling: touch; }
  .bilgi { font-size: .86rem; }
  .kopru-serit .kopru-akis { font-size: .84rem; }
  .kopru-serit .kopru-ok { display: none; }
  .detay-yerlesim { grid-template-columns: 1fr; }
  .kart-ray .grafik-kab canvas { height: 170px !important; }
  .veri-defteri { min-width: 560px; }   /* dar ekranda tablo kaydırılır */
  .panel { padding: 12px; }
  h2 { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; }
}

/* ══ INVEX TARZI PANEL DÜZENİ (2026-08-14) ═══════════════════════════
   Palet DEĞİŞMEDİ; yalnız yerleşim: geniş ekranda üst menü sol dikey
   rayına döner (area.invex.com.tr çalışma düzeni), Özet'e grafik ızgarası
   ve kart/tablo derinlik cilası eklenir. Dar ekran davranışı aynı kalır. */

/* Özet grafik ızgarası: solda 12 aylık gidişat, sağda tür halkası */
.grafik-izgara {
  display: grid; grid-template-columns: 1.4fr 1fr; gap: 14px; margin-bottom: 16px;
}
@media (max-width: 1000px) { .grafik-izgara { grid-template-columns: 1fr; } }

/* Kart cilası: üstte ince turuncu şerit + hover derinliği (Invex kart hissi) */
.kart { position: relative; overflow: hidden; transition: box-shadow .15s, transform .15s; }
.kart::before {
  content: ""; position: absolute; inset: 0 auto auto 0; height: 3px; width: 100%;
  background: linear-gradient(90deg, var(--pirinc), var(--pirinc-acik));
  opacity: 0; transition: opacity .15s;
}
.kart:hover { box-shadow: 0 2px 4px rgba(15,28,45,.07), 0 10px 26px rgba(15,28,45,.10); }
.kart:hover::before { opacity: 1; }

@media (min-width: 1240px) {
  :root { --yanmenu-w: 212px; }
  /* Üst şerit → sol dikey menü */
  .topnav {
    position: fixed; top: 0; left: 0; bottom: 0; width: var(--yanmenu-w);
    flex-direction: column; align-items: stretch; flex-wrap: nowrap; gap: 3px;
    padding: 14px 10px 12px; overflow-y: auto; overflow-x: hidden;
    border-bottom: none; border-right: 3px solid var(--pirinc);
    scrollbar-width: thin;
  }
  .brand { margin: 2px 6px 16px; }
  .topnav a { padding: 9px 11px; border-radius: 8px; }
  .topnav a.aktif { box-shadow: inset 3px 0 0 var(--pirinc); }
  /* Hesap bağlantısı menünün EN ALTINA itilir; çıkış onun altında.
     (satır içi margin-left:auto dikey düzende genişliği bozuyordu) */
  .topnav a.cikis { margin-left: 0 !important; }
  .topnav a[title^="Hesap"] { margin-top: auto !important; }
  .inv-rozet { margin: 4px 2px 2px; justify-content: center; }
  /* İçerik sola yaslanır, sol menü genişliği kadar boşluk bırakır */
  main { margin-left: var(--yanmenu-w); max-width: none; padding: 20px 26px 48px; }
  body.inv-rayli main { max-width: none; }
  /* Invex: sol menüdeki rozete basınca YANINDA açılır panel (dropdown) */
  body.inv-rayli .inv-ray { display: none; }
  body.inv-rayli .inv-ray.gorunur {
    display: block; left: calc(var(--yanmenu-w) + 10px); right: auto;
    top: 60px; bottom: auto;
  }
  body.inv-rayli .inv-ray.gorunur .inv-ray-kapat { display: block; }
  body.inv-rayli .inv-rozet { display: inline-flex; }
  /* Sol menü sabitken tablo başlıkları görünür kalsın (uzun listeler) */
  .tablo-kab thead th { top: 0; box-shadow: 0 1px 0 var(--cizgi-koyu); }
}

/* ── Mutabakat yan yana tablolar: kompakt hücreler (tam sığma) ── */
.mut-tablo td, .mut-tablo th { padding: 5px 7px; font-size: 12.5px; }
/* Ad soyad KESİLMESİN (2026-08-15): 130px isimleri buduyordu. Uzun şirket
   ünvanları da gizlenmesin diye üç noktaya değil SATIR KAYDIRMAYA geçildi */
.mut-tablo .ad-kisalt {
  max-width: 200px; white-space: normal; line-height: 1.25;
}
/* Genel toplam + bakiye blokunda TEK punto — bakiye-vurgu'nun 14.5px'i ile
   varsayılan boyut karışık görünüyordu; ID kuralı hepsini eşitler */
#mut-genel td { font-size: 13.5px; }
.mut-tablo .rozet { font-size: 9.5px; padding: 2px 6px; }
.mut-tablo select.mut-durum { font-size: 12px; padding: 3px 4px; max-width: 118px; }
.mut-tablo .onay-btn, .mut-tablo .btn-kirmizi { font-size: 11.5px; }
.mut-tablo .alt-not { font-size: 10.5px; }


/* ── Sol menü AÇILIR GRUP (Muhasebe: Hakediş/Mutabakat/Prim) ───────── */
.nav-grup { position: relative; }
.nav-grup-bas {
  width: 100%; display: inline-flex; align-items: center; gap: 7px;
  background: none; border: none; cursor: pointer; text-align: left;
  color: #c4ccd8; padding: 8px 12px; border-radius: 7px;
  font: inherit; font-weight: 500; transition: background .15s, color .15s;
}
.nav-grup-bas:hover { background: rgba(255, 255, 255, .10); color: #fff; }
.nav-grup-bas.aktif {
  background: rgba(230, 126, 34, .16); color: #ffd9b3;
}
.nav-grup-bas .ikon { opacity: .85; }
.nav-grup-bas.aktif .ikon { color: var(--pirinc); opacity: 1; }
.nav-ok { margin-left: auto; font-size: .75em; opacity: .7; transition: transform .15s; }
.nav-grup.acik .nav-ok { transform: rotate(180deg); }
.nav-grup-govde { display: none; }
.nav-grup.acik .nav-grup-govde { display: block; }
.nav-grup-govde a {
  color: #b7c1cf; text-decoration: none; display: block;
  padding: 7px 12px 7px 35px; border-radius: 7px; font-size: 13.5px;
}
.nav-grup-govde a:hover { background: rgba(255, 255, 255, .10); color: #fff; }
.nav-grup-govde a.aktif { color: #ffd9b3; background: rgba(230, 126, 34, .14); }
@media (min-width: 1240px) {
  .nav-grup-bas.aktif { box-shadow: inset 3px 0 0 var(--pirinc); }
}
/* Orta ekran (üst bar): grup düğmesine basınca altına koyu açılır kutu */
@media (min-width: 721px) and (max-width: 1239px) {
  .nav-grup.acik .nav-grup-govde {
    position: absolute; top: 100%; left: 0; min-width: 170px; z-index: 70;
    background: var(--defter-koyu); border: 1px solid rgba(255,255,255,.12);
    border-radius: 9px; padding: 5px; box-shadow: 0 10px 26px rgba(0,0,0,.35);
  }
  .nav-grup-govde a { padding-left: 12px; }
}
/* Mobil (≤720px): çekmece içinde açılan grup ALT LİSTE (akordeon) olur —
   mutlak kutu ekran dışına taşıyordu */
@media (max-width: 720px) {
  .nav-grup.acik .nav-grup-govde {
    position: static; width: 100%; min-width: 0;
    background: rgba(255, 255, 255, .07); border-radius: 9px;
    padding: 4px; margin-top: 2px;
  }
  .nav-grup-govde a { padding: 9px 12px 9px 30px; }
  .inv-govde { padding: 4px 10px 10px; }
}
/* Mobil bar/karartma/alt sekme yalnız mobilde (alt sekmenin görünümü
   mobil.css'te — o dosya masaüstünde hiç indirilmez) */
.mobil-ort { display: none; }
.mobil-sekme { display: none; }
@media (min-width: 721px) {
  .mobil-bar, .mobil-ort, .mobil-sekme { display: none !important; }
}

/* ══ "DEFTER" TABLO DİLİ (2026-08-15) — mutabakat kişi detayı ve
   personel yıl detayı: içerik genişliğinde, zebra satırlı, girişler
   HÜCRE GİBİ görünür (kutu ancak üzerine gelince/odaklanınca belirir),
   hesaplanan sütunlar mavi tonlu zeminle ayrışır. ═══════════════════ */
/* Genişlik dengesi: tablo KABINI doldurur; az sütunlu defterlerde kabın
   kendisi sınırlanır (.tablo-kab.dar) — ne %100 yayılıp kolon araları
   boşalır, ne sola büzülüp sağda ölü beyaz alan kalır. */
.veri-defteri { width: 100%; min-width: 620px; }
.tablo-kab.dar { max-width: 900px; }
.veri-defteri th {
  padding: 7px 9px; font-size: 10.5px; letter-spacing: .06em;
}
.veri-defteri td {
  padding: 3px 7px; font-size: 12.5px; border-bottom: 1px solid #edf0ea;
}
.veri-defteri tbody tr:nth-child(even) td { background: #fafbf8; }
.veri-defteri tbody tr:hover td { background: #f1f5ee; }
/* Girişler dolu hücre gibi: çerçevesiz, mono, sağa dayalı */
.veri-defteri input {
  border: 1px solid transparent; background: transparent; border-radius: 6px;
  padding: 4px 7px; font-size: 12.5px;
  font-family: var(--para-font); font-variant-numeric: tabular-nums;
  text-align: right; transition: border-color .12s, background .12s;
}
.veri-defteri input.d-rapor { font-family: var(--govde-font); text-align: left; }
.veri-defteri tbody tr:hover input:not(:disabled) {
  border-color: #d9e0e7; background: #fff;
}
.veri-defteri input:focus {
  border-color: var(--pirinc); background: #fff; outline: none;
  box-shadow: 0 0 0 3px rgba(230, 126, 34, .13);
}
.veri-defteri input:disabled { color: var(--murekkep); opacity: 1; }
/* Girişler hücrelerine ORANLA oturur (sabit px yok → boşluk/taşma yok) */
.veri-defteri input { width: 100%; min-width: 56px; }
/* Hesaplanan sütunlar (KDV, Toplam, tutar): yalnız MONO yazı — sütunu
   boydan boya renge boyama KALDIRILDI (2026-08-16 kullanıcı kuralı);
   zebra/hover zemini satırın geri kalanıyla aynı akar */
.veri-defteri td.hesap { font-family: var(--para-font); font-variant-numeric: tabular-nums; }
.veri-defteri td.d-toplam { font-weight: 700; }
/* HİZA: yol/harç/bedel girdileri, KDV/Toplam (düz hücre) ve TOPLAM satırıyla
   AYNI sağ kenarda dursun. Girdi hücresi kendi yatay boşluğunu girdiye bırakır;
   girdinin 1px kenarı + 6px iç boşluğu = düz hücrelerin 7px td boşluğuyla eşitlenir.
   (Rapor No girdisi `.para` taşımaz → sayaçlı ilk sütun etkilenmez.) */
.veri-defteri td:has(> input.para) { padding-left: 0; padding-right: 0; }
.veri-defteri td.sag > input.para { padding: 4px 6px; }
.veri-defteri tfoot td.sag { padding-right: 7px; }
/* Sıra numarası (yalnız .sirali): ilk hücrenin önüne soluk sayaç */
.veri-defteri.sirali tbody { counter-reset: satir; }
.veri-defteri.sirali tbody tr { counter-increment: satir; }
.veri-defteri.sirali tbody tr > td:first-child {
  display: flex; align-items: center; gap: 6px;
}
.veri-defteri.sirali tbody tr > td:first-child::before {
  content: counter(satir); flex: none; width: 18px; text-align: right;
  color: #b3bcc7; font-size: 10.5px; font-family: var(--para-font);
}
.veri-defteri.sirali tbody tr > td:first-child input { flex: 1; min-width: 0; }
/* Satır silme: kırmızı blok yerine sakin × — üzerine gelince kızarır */
.veri-defteri .satir-sil {
  background: none; border: none; color: #c3cad3; font-size: 15px;
  line-height: 1; padding: 2px 7px; cursor: pointer; border-radius: 5px;
}
.veri-defteri .satir-sil:hover { background: var(--zarar-zemin); color: var(--zarar); }
.veri-defteri tfoot td {
  border-top: 2px solid var(--cizgi-koyu); background: #eef2f7;
  font-weight: 700; font-family: var(--para-font);
  font-variant-numeric: tabular-nums; padding: 7px 9px;
}
/* Kişi detay yerleşimi: tablo+mahsup solda (900px), özet kartları sağdaki
   dikey rayda — tablonun sağı boş kalmaz. Dar ekranda tek kolona düşer. */
.detay-yerlesim {
  display: grid; grid-template-columns: minmax(0, 900px) minmax(230px, 1fr);
  gap: 16px; align-items: start;
}
.detay-sol { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.kart-ray { display: flex; flex-direction: column; gap: 12px; }
@media (max-width: 1100px) {
  .detay-yerlesim { grid-template-columns: 1fr; }
  .kart-ray { flex-direction: row; flex-wrap: wrap; }
  .kart-ray .kart { flex: 1 1 175px; }
}

/* ── Invex menü içi form (koyu zemin uyumu) ── */
.inv-grup .inv-nokta {
  width: 9px; height: 9px; border-radius: 50%; background: #d95b45;
  display: inline-block; flex: none;
}
.inv-grup.bagli .inv-nokta { background: #34d399; }
.inv-govde { padding: 0 12px 10px; }
.inv-govde .inv-etiket { display: block; margin: 8px 0 3px; font-size: .74rem;
  font-weight: 600; color: #9fb0c3; }
.inv-govde input { width: 100%; font-size: 12.5px; padding: 6px 8px; }
.inv-govde .inv-ray-btn { width: 100%; margin-top: 10px; justify-content: center; }
.inv-govde .inv-ray-not { margin: 8px 0 0; font-size: .72rem; color: #8fa0b3; line-height: 1.35; }
.inv-govde .tik-ok { color: #7ee2a8; }
.inv-govde .tik-hata { color: #f2a196; }
