/* finans.css — finans ekranı. reports.css'in üstüne biner (token'lar, topbar,
   .tablecard, .notice oradan gelir).

   TASARIM HEDEFİ: Excel'i bilen kişi ekrana bakınca AYNI ŞEYİ görsün. Bu
   yüzden ızgara süslü değil: ince çizgi, sıkı satır yüksekliği, sağa yaslı
   monospace rakam. Hücre odağı Excel'in mavi çerçevesi gibi belirgin. */

/* --- üst çubuk ekleri --- */
.datefield { display:flex; align-items:center; gap:6px; font-size:12px; font-weight:600; color:var(--ink-3); }
.datefield input, .rangefield input { font:inherit; font-size:13px; padding:5px 8px; border-radius:8px;
  border:1px solid var(--line-2); background:var(--surface); color:var(--ink); }
.daybtn { font:inherit; font-size:15px; line-height:1; padding:5px 10px; border-radius:8px;
  border:1px solid var(--line-2); background:var(--surface); color:var(--ink-2); cursor:pointer; }
.daybtn:hover { border-color:var(--accent); color:var(--accent); }
.rangefield { display:inline-flex; align-items:center; gap:6px; }
.savestate { font-size:12px; font-weight:600; color:var(--ink-3); min-width:110px; text-align:right; }
.savestate.ok  { color:var(--green); }
.savestate.err { color:var(--red); }

/* --- sekmeler --- */
.tabbar { display:flex; gap:2px; padding:0 20px; border-bottom:1px solid var(--line);
  background:var(--surface); overflow-x:auto; }
.tab { font:inherit; font-size:13px; font-weight:600; padding:10px 14px; border:none; background:none;
  color:var(--ink-3); cursor:pointer; border-bottom:2px solid transparent; white-space:nowrap; }
.tab:hover { color:var(--ink); }
.tab.is-active { color:var(--accent); border-bottom-color:var(--accent); }
.panel { display:none; }
.panel.is-active { display:block; }

.notice--warn { background:var(--amber-bg); }
.notice--lock { background:var(--red-bg); }

/* --- kontrol şeridi --- */
.control { background:var(--surface); border:1px solid var(--line); border-radius:12px;
  box-shadow:var(--shadow); padding:12px 14px; }
.control__head { display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.control__t { font-size:12px; font-weight:700; color:var(--ink-3); text-transform:uppercase; letter-spacing:.03em; }
.control__badge { font-size:12px; font-weight:700; padding:2px 10px; border-radius:999px;
  background:var(--green-bg); color:var(--green); }
.control__badge.bad { background:var(--red-bg); color:var(--red); }
.control__row { display:flex; gap:8px; flex-wrap:wrap; }
.ctrl { border:1px solid var(--line); border-radius:9px; padding:6px 10px; min-width:104px; background:var(--surface-3); }
.ctrl__l { font-size:10.5px; font-weight:700; color:var(--ink-3); letter-spacing:.03em; }
.ctrl__v { font-family:"IBM Plex Mono", ui-monospace, monospace; font-size:13px; font-weight:600;
  font-variant-numeric:tabular-nums; }
.ctrl.bad { border-color:var(--red); background:var(--red-bg); }
.ctrl.bad .ctrl__v { color:var(--red); }

/* --- ızgara --- */
.gridwrap { overflow:auto; max-height:calc(100vh - 260px); border:1px solid var(--line);
  border-radius:12px; background:var(--surface); box-shadow:var(--shadow); }
.grid { border-collapse:separate; border-spacing:0; font-size:13px; width:max-content; min-width:100%; }
.grid th, .grid td { border-right:1px solid var(--line); border-bottom:1px solid var(--line);
  padding:0; white-space:nowrap; }
.grid thead th {
  position:sticky; top:0; z-index:3; background:var(--surface-3);
  font-size:10.5px; font-weight:700; color:var(--ink-3); text-transform:uppercase; letter-spacing:.03em;
  padding:7px 8px; text-align:right;
}
.grid thead th.l { text-align:left; }
/* İlk sütun (işletme/kurye adı) yatay kaydırmada sabit kalır — Excel'in
   dondurulmuş bölmesi. 40 sütunda ad görünmezse satır kimin olduğu kaybolur. */
.grid .namecol { position:sticky; left:0; z-index:2; background:var(--surface);
  text-align:left; font-weight:600; padding:6px 10px; min-width:190px;
  border-right:1px solid var(--line-2); }
.grid thead .namecol { z-index:4; background:var(--surface-3); }
.grid tbody tr:hover .namecol { background:var(--surface-3); }

.grid input {
  font:inherit; font-family:"IBM Plex Mono", ui-monospace, monospace;
  font-variant-numeric:tabular-nums;
  width:100%; min-width:92px; border:none; background:transparent; color:var(--ink);
  padding:6px 8px; text-align:right; outline:none;
}
.grid input:focus { background:var(--accent-weak); box-shadow:inset 0 0 0 2px var(--accent); }
.grid input.text { text-align:left; font-family:inherit; min-width:150px; }

/* Türetilmiş hücre: Excel'in formül sütunu. Gri ve dokunulamaz. */
.grid td.calc { background:var(--surface-3); color:var(--ink-2); text-align:right;
  font-family:"IBM Plex Mono", ui-monospace, monospace; font-variant-numeric:tabular-nums;
  padding:6px 8px; font-size:12.5px; }
.grid td.calc.bad { background:var(--red-bg); color:var(--red); font-weight:700; }
.grid tr.dirty .namecol { box-shadow:inset 3px 0 0 var(--amber); }
.grid tr.saved .namecol { box-shadow:inset 3px 0 0 var(--green); }

.hint { font-size:12px; color:var(--ink-3); margin:10px 2px 0; }
.hint--warn { background:var(--amber-bg); border:1px solid var(--line); border-radius:10px;
  padding:10px 12px; color:var(--ink-2); }

/* --- defter --- */
.ledgertabs { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:12px; }
.ledgertab { font:inherit; font-size:12.5px; font-weight:600; padding:6px 12px; border-radius:999px;
  border:1px solid var(--line-2); background:var(--surface); color:var(--ink-2); cursor:pointer; }
.ledgertab.is-active { background:var(--accent-weak); border-color:var(--accent); color:var(--accent-ink); }
.ledgerform { display:flex; gap:10px; align-items:flex-end; flex-wrap:wrap;
  background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:12px 14px;
  box-shadow:var(--shadow); }
.ledgerform .field { display:flex; flex-direction:column; gap:4px; }
.ledgerform .field > span { font-size:10.5px; font-weight:700; color:var(--ink-3);
  text-transform:uppercase; letter-spacing:.03em; }
.ledgerform input, .ledgerform select { font:inherit; font-size:13px; padding:6px 9px; border-radius:8px;
  border:1px solid var(--line-2); background:var(--surface-3); color:var(--ink); }
.ledgerform .field--grow { flex:1; min-width:180px; }
.ledgerform .field--grow input { width:100%; }
.msg { font-size:12.5px; margin:8px 2px; color:var(--ink-3); }
.msg.err { color:var(--red); font-weight:600; }
.msg.ok { color:var(--green); font-weight:600; }

/* --- raporlar --- */
#cariTable, #bordroTable, #ledgerTable { width:100%; border-collapse:collapse; font-size:13px; }
#cariTable th, #bordroTable th, #ledgerTable th {
  font-size:10.5px; font-weight:700; color:var(--ink-3); text-transform:uppercase; letter-spacing:.03em;
  padding:9px 10px; text-align:right; border-bottom:1px solid var(--line); background:var(--surface-3);
  position:sticky; top:0;
}
#cariTable th.l, #bordroTable th.l, #ledgerTable th.l { text-align:left; }
#cariTable td, #bordroTable td, #ledgerTable td {
  padding:7px 10px; border-bottom:1px solid var(--line); text-align:right;
  font-family:"IBM Plex Mono", ui-monospace, monospace; font-variant-numeric:tabular-nums;
}
#cariTable td.l, #bordroTable td.l, #ledgerTable td.l { text-align:left; font-family:inherit; }
tr.total td { font-weight:700; background:var(--surface-3); }
.tag { display:inline-block; padding:1px 8px; border-radius:999px; font-size:11px; font-weight:700; }
.tag--borclu   { background:var(--amber-bg); color:var(--amber); }
.tag--alacakli { background:var(--green-bg); color:var(--green); }
.delbtn { font:inherit; font-size:12px; border:none; background:none; color:var(--ink-3); cursor:pointer; }
.delbtn:hover { color:var(--red); }

/* --- kasa --- */
.kasagrid { display:grid; grid-template-columns:repeat(auto-fit, minmax(210px, 1fr)); gap:12px; }
.kasabox { background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:14px 16px;
  box-shadow:var(--shadow); }
.kasabox__l { font-size:11px; font-weight:700; color:var(--ink-3); text-transform:uppercase; letter-spacing:.03em; }
.kasabox__v { font-family:"IBM Plex Mono", ui-monospace, monospace; font-variant-numeric:tabular-nums;
  font-size:22px; font-weight:700; margin-top:4px; letter-spacing:-.01em; }
.kasabox--sum { background:var(--accent-weak); border-color:var(--accent); }
.kasabox--sum .kasabox__v { color:var(--accent-ink); }
.kasafark { font-size:13px; color:var(--ink-2); padding:14px 16px; margin:0; }
.kasafark b { font-family:"IBM Plex Mono", ui-monospace, monospace; }

@media (max-width:720px) {
  .gridwrap { max-height:none; }
  .ledgerform { flex-direction:column; align-items:stretch; }
}