/* ============================================================
   Pages: raporlar (Rapor Merkezi) + tek tek rapor sayfaları
   ============================================================ */

/* ============================================================
   RAPOR MERKEZİ (rc-*) — option-driven report center
   ============================================================ */
.rc { display: flex; flex-direction: column; gap: var(--space-4); }
.rc-top { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-3); flex-wrap: wrap; }
.rc-head { min-width: 0; }
.rc-h { font-size: var(--fs-lg); font-weight: 800; display: flex; align-items: center; gap: 8px; }
.rc-h-ico { width: 24px; height: 24px; flex-shrink: 0; display: grid; place-items: center; color: var(--brand); }
.rc-h-ico svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.rc-sub { font-size: var(--fs-sm); color: var(--text-muted); margin-top: 2px; }
.rc-actions { display: flex; gap: var(--space-2); margin-top: var(--space-3); flex-wrap: wrap; }
.rc-exp { display: inline-flex; align-items: center; gap: 6px; padding: 7px 13px; font-size: var(--fs-sm); }
.rc-exp svg { width: 16px; height: 16px; }

/* Breadcrumb (kategori sayfası) */
.rc-crumb { font-size: var(--fs-xs); color: var(--text-muted); font-weight: 600; margin-bottom: 4px; }
.rc-crumb a { color: var(--brand); text-decoration: none; }
.rc-crumb a:hover { text-decoration: underline; }
.rc-crumb-sep { margin: 0 6px; color: var(--text-faint); }

/* Dönem çubuğu — tarih aralığı "Özel…" çipi arkasında */
.rc-period { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.rc-period-chips { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.rc-chip {
  border: 1px solid var(--border); background: var(--surface); color: var(--text-muted);
  border-radius: var(--radius-full); padding: 6px 13px; font-size: var(--fs-sm); font-weight: 600;
  cursor: pointer; transition: border-color var(--transition), color var(--transition), background var(--transition);
}
.rc-chip:hover { border-color: var(--brand); color: var(--brand); }
.rc-chip.is-active { background: var(--brand); border-color: var(--brand); color: #fff; }
.rc-custom { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.rc-date { width: auto; padding: 6px 8px; font-size: var(--fs-sm); }
.rc-dash { color: var(--text-faint); }
.rc-apply { padding-top: 6px; padding-bottom: 6px; }

/* KATEGORİ SAYFASI gövdesi (liste ↔ tam rapor) */
.rc-cat-body { display: flex; flex-direction: column; gap: var(--space-3); }

/* Rapor listesi (kategoriye girince) */
.rc-list { display: flex; flex-direction: column; gap: var(--space-4); }
.rc-listgroup { display: flex; flex-direction: column; }
.rc-listgroup-h {
  font-size: var(--fs-xs); font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  color: var(--text-muted); padding: 0 var(--space-1) var(--space-2);
}
/* Rapor kartları ızgarası — ekrana göre 1→2→3→4 kolon (en fazla 4) */
.rc-grid { display: grid; gap: var(--space-3); grid-template-columns: 1fr; }
@media (min-width: 600px)  { .rc-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 980px)  { .rc-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1320px) { .rc-grid { grid-template-columns: repeat(4, 1fr); } }

.rc-card {
  display: flex; align-items: flex-start; gap: var(--space-3); text-align: left;
  padding: var(--space-4); background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); cursor: pointer;
  transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition);
}
.rc-card:hover { border-color: var(--brand); box-shadow: var(--shadow); transform: translateY(-2px); }
.rc-card:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.rc-card-ico {
  width: 46px; height: 46px; flex-shrink: 0; display: grid; place-items: center;
  border-radius: var(--radius); background: var(--brand-tint); color: var(--brand); border: 1px solid var(--brand-glow);
}
.rc-card-ico svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.rc-card-main { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.rc-card-title { font-size: var(--fs-md); font-weight: 700; color: var(--text); }
.rc-card-desc { font-size: var(--fs-sm); color: var(--text-muted); line-height: 1.4; }

/* "← raporlara dön" butonu (tam rapor görünümü) */
.rc-back {
  display: inline-flex; align-items: center; gap: 6px; margin-bottom: 6px;
  border: 0; background: transparent; color: var(--brand); cursor: pointer;
  font-size: var(--fs-sm); font-weight: 600; padding: 4px 0;
}
.rc-back:hover { text-decoration: underline; }
.rc-back svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* Seçili raporun gövdesi */
.rc-report { display: flex; flex-direction: column; gap: var(--space-3); }

.rc-body { display: flex; flex-direction: column; gap: var(--space-3); }
.rc-loading, .rc-empty { padding: var(--space-5) var(--space-4); text-align: center; color: var(--text-muted); font-size: var(--fs-sm); }
.rc-empty { background: var(--surface-alt); border: 1px dashed var(--border); border-radius: var(--radius); }

/* KPI bandı (adaptif) */
.rc-kpis { display: grid; gap: var(--space-3); grid-template-columns: repeat(auto-fit, minmax(168px, 1fr)); }
.rc-kpi { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: var(--space-3) var(--space-4); }
.rc-kpi-label { font-size: var(--fs-xs); font-weight: 600; color: var(--text-muted); padding-bottom: 5px; border-bottom: 1px solid var(--border); }
.rc-kpi-val { font-size: var(--fs-lg); font-weight: 800; color: var(--text-muted); padding-top: 5px; font-variant-numeric: tabular-nums; }
.rc-kpi-val.pos { color: var(--green); }
.rc-kpi-val.neg { color: var(--red); }
.rc-kpi-sub { font-size: var(--fs-xs); color: var(--text-muted); padding-top: 2px; }

/* İçerik blokları (grafik/tablo kartları) */
.rc-block { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); overflow: hidden; }
.rc-block-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-2); padding: 12px 16px 0; }
.rc-block-title { font-size: var(--fs-md); font-weight: 700; }
.rc-block-sub { font-size: var(--fs-xs); color: var(--text-muted); }
.rc-block-body { padding: 12px 16px 16px; }
.rc-block-body .table-wrap { margin-top: 2px; }
.rc-2col { display: grid; gap: var(--space-3); grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.rc-2col:empty, .rc-2col > :empty { display: none; }

.rc-tag { display: inline-block; font-size: 11px; font-weight: 700; color: var(--navy); background: var(--surface-alt); border: 1px solid var(--border); border-radius: var(--radius-full); padding: 1px 8px; }

/* Köprüler */
.rc-link { display: inline-block; font-size: var(--fs-sm); font-weight: 600; color: var(--brand); padding: 4px 0; }
.rc-link:hover { text-decoration: underline; }
.rc-linkgrid { display: grid; gap: var(--space-3); grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.rc-linkcard { display: block; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: var(--space-3) var(--space-4); text-decoration: none; color: inherit; transition: border-color var(--transition), transform var(--transition); }
.rc-linkcard:hover { border-color: var(--brand); transform: translateY(-1px); }
.rc-linkcard-t { font-size: var(--fs-md); font-weight: 700; color: var(--text); }
.rc-linkcard-d { font-size: var(--fs-xs); color: var(--text-muted); margin-top: 3px; line-height: 1.4; }

/* ============================================================
   GRAFİKLER (chrt-*) — A.charts SVG çıktısı
   ============================================================ */
.chrt { width: 100%; }
.chrt-svg { display: block; width: 100%; height: auto; }
/* Hover değer balonu (tüm grafikler — donut/bar/line/hbar) */
.chrt-hit { cursor: pointer; transition: opacity .12s; }
.chrt-hit:hover { opacity: .82; }
.chrt-tip { position: fixed; z-index: 9999; pointer-events: none; background: var(--navy, #2E2B5F); color: #fff; font-size: 12px; font-weight: 600; padding: 6px 10px; border-radius: 8px; box-shadow: 0 4px 14px rgba(0,0,0,.22); white-space: nowrap; max-width: 70vw; overflow: hidden; text-overflow: ellipsis; }
.chrt-grid { stroke: var(--border); stroke-width: 1; }
.chrt-axis { fill: var(--text-muted); font-size: 11px; font-family: inherit; }
.chrt-axis--x { fill: var(--text); }

/* Donut */
.chrt-donut { display: flex; align-items: center; gap: var(--space-4); flex-wrap: wrap; }
.chrt-donut-svg { width: 168px; height: 168px; flex-shrink: 0; }
.chrt-donut-c { fill: var(--text); font-size: 26px; font-weight: 800; }
.chrt-donut-cs { fill: var(--text-muted); font-size: 12px; font-weight: 600; }
.chrt-legend { list-style: none; margin: 0; padding: 0; flex: 1; min-width: 160px; display: flex; flex-direction: column; gap: 6px; }
.chrt-legend--row { flex-direction: row; flex-wrap: wrap; gap: 6px 16px; }
.chrt-leg-item { display: flex; align-items: center; gap: 8px; font-size: var(--fs-sm); }
.chrt-dot { width: 11px; height: 11px; border-radius: 3px; flex-shrink: 0; }
.chrt-leg-lbl { flex: 1; min-width: 0; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chrt-leg-val { font-weight: 700; color: var(--navy); font-variant-numeric: tabular-nums; white-space: nowrap; }
.chrt-leg-pct { color: var(--text-muted); font-weight: 600; margin-left: 6px; }

/* Yatay barlar */
.chrt-hbars { display: flex; flex-direction: column; gap: 9px; }
.chrt-hbar { display: grid; grid-template-columns: minmax(110px, 1.4fr) 2.5fr minmax(86px, auto); gap: var(--space-3); align-items: center; }
.chrt-hbar-lbl { font-size: var(--fs-sm); font-weight: 600; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chrt-hbar-sub { color: var(--text-faint); font-weight: 600; font-size: var(--fs-xs); }
.chrt-hbar-track { height: 10px; border-radius: var(--radius-full); background: var(--surface-alt); overflow: hidden; }
.chrt-hbar-fill { display: block; height: 100%; border-radius: var(--radius-full); min-width: 2px; transition: width .3s ease; }
.chrt-hbar-val { text-align: right; font-size: var(--fs-sm); font-weight: 800; color: var(--navy); white-space: nowrap; font-variant-numeric: tabular-nums; }
.chrt-hbar-pct { display: block; font-size: 10px; font-weight: 700; color: var(--text-muted); }
.chrt-empty { padding: var(--space-4); text-align: center; color: var(--text-muted); font-size: var(--fs-sm); }

/* Mobil */
@media (max-width: 560px) {
  .rc-top { flex-direction: column; }
  .rc-period { width: 100%; justify-content: flex-start; }
  .rc-custom { flex-wrap: wrap; }
  .chrt-donut { justify-content: center; }
  .chrt-hbar { grid-template-columns: 1fr auto; grid-template-areas: "lbl val" "track track"; gap: 4px 8px; }
  .chrt-hbar-lbl { grid-area: lbl; } .chrt-hbar-val { grid-area: val; } .chrt-hbar-track { grid-area: track; }
}

/* — Hub sayfası — */
.rep-page { display: flex; flex-direction: column; gap: var(--space-4); }
.rep-intro-title { font-size: var(--fs-lg); font-weight: 700; margin-bottom: 4px; }
.rep-intro-desc { font-size: var(--fs-sm); color: var(--text-muted); }

.rep-grid {
  display: grid; gap: var(--space-3);
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}
.rep-card {
  display: flex; gap: var(--space-3); align-items: stretch;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow-sm); padding: var(--space-3) var(--space-4);
  text-decoration: none; color: inherit;
  transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition);
}
.rep-card:hover { border-color: var(--brand); box-shadow: 0 4px 14px rgba(26, 24, 54, .1); transform: translateY(-1px); }
.rep-ico {
  width: 40px; height: 40px; flex-shrink: 0; align-self: center;
  display: grid; place-items: center; border-radius: var(--radius-sm);
}
.rep-ico svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.rep-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.rep-title { font-size: var(--fs-md); font-weight: 700; color: var(--text); }
.rep-desc { font-size: var(--fs-xs); color: var(--text-muted); line-height: 1.4; }

/* — Tek tek rapor sayfaları için ortak — */
.rep-toolbar {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--space-3); flex-wrap: wrap; margin-bottom: var(--space-3);
}
.rep-back { font-size: var(--fs-sm); color: var(--text-muted); }
.rep-back:hover { color: var(--brand); }
.rep-filters { display: flex; align-items: center; gap: var(--space-2); flex-wrap: wrap; }
.rep-filter { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-sm); color: var(--text-muted); }
.rep-filter .input, .rep-filter .select { width: auto; min-width: 0; padding-top: 7px; padding-bottom: 7px; }

/* KPI üst-bandı (rapor başında 1-4 sayı kutucuğu) */
.rep-kpis {
  display: grid; gap: var(--space-3); margin-bottom: var(--space-4);
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}
.rep-kpi {
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow-sm); padding: var(--space-3) var(--space-4);
}
.rep-kpi-label { font-size: var(--fs-xs); font-weight: 600; color: var(--text-muted); padding-bottom: 5px; border-bottom: 1px solid var(--border); }
.rep-kpi-val { font-size: var(--fs-lg); font-weight: 700; color: var(--text-muted); padding-top: 5px; }
.rep-kpi-val.pos { color: var(--green); }
.rep-kpi-val.neg { color: var(--red); }
.rep-kpi-sub { font-size: var(--fs-xs); color: var(--text-muted); padding-top: 2px; }

/* Bölümler */
.rep-section { margin-bottom: var(--space-4); }
.rep-section-title {
  font-size: var(--fs-md); font-weight: 700; margin-bottom: var(--space-2);
  padding-bottom: 6px; border-bottom: 2px solid var(--border-strong);
}
.rep-empty { padding: var(--space-4); text-align: center; color: var(--text-muted); font-size: var(--fs-sm); }

/* — Görsel bar'lı dağılım (gider analizi: grup / alt kategori / ödeme / trend) — */
.rep-dist {
  display: flex; flex-direction: column; gap: var(--space-2);
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius); box-shadow: var(--shadow-sm);
  padding: var(--space-3) var(--space-4);
}
.rep-dist-row { display: grid; grid-template-columns: minmax(110px, 1.3fr) 3fr minmax(110px, auto); gap: var(--space-3); align-items: center; }
.rep-dist-label { font-size: var(--fs-sm); font-weight: 700; color: var(--text); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rep-dist-label .sub { color: var(--text-faint); font-weight: 600; font-size: var(--fs-xs); }
.rep-dist-track { height: 10px; border-radius: var(--radius-full); background: var(--surface-alt); overflow: hidden; }
.rep-dist-fill { height: 100%; border-radius: var(--radius-full); background: var(--brand); min-width: 2px; transition: width .3s ease; }
.rep-dist-fill.pk-cash { background: var(--green); }
.rep-dist-fill.pk-bank { background: var(--blue); }
.rep-dist-fill.pk-card { background: var(--purple); }
.rep-dist-fill.pk-auto { background: var(--yellow); }
.rep-dist-fill.pk-none { background: #95A5A6; }
.rep-dist-val { text-align: right; font-size: var(--fs-sm); font-weight: 800; color: var(--navy); white-space: nowrap; }
.rep-dist-pct { font-size: 11px; font-weight: 700; color: var(--text-muted); }
@media (max-width: 560px) {
  .rep-dist-row { grid-template-columns: 1fr auto; }
  .rep-dist-label { order: 1; }
  .rep-dist-val { order: 2; }
  .rep-dist-track { order: 3; grid-column: 1 / -1; }
}

.rk-section-ico {
  display: inline-grid; place-items: center; vertical-align: -6px;
  width: 26px; height: 26px; border-radius: var(--radius-sm); margin-right: 6px;
}
.rk-section-ico svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.money.pos { color: var(--green); }
.money.neg { color: var(--red); }

/* — Nakit Akışı / Gün Özeti (rapor_nakit_akisi) — */
.naf-chips { display: flex; gap: var(--space-2); flex-wrap: wrap; margin-bottom: var(--space-2); }
.naf-chip {
  border: 1px solid var(--border); background: var(--surface); color: var(--text-muted);
  border-radius: var(--radius-full); padding: 6px 14px; font-size: var(--fs-sm); font-weight: 600;
  cursor: pointer; transition: border-color var(--transition), color var(--transition), background var(--transition);
}
.naf-chip:hover { border-color: var(--brand); color: var(--brand); }
.naf-chip.is-active { background: var(--brand); border-color: var(--brand); color: #fff; }
.naf-custom { display: flex; gap: var(--space-3); flex-wrap: wrap; margin-bottom: var(--space-2); }
.naf-custom .input { width: auto; }
.naf-periodlbl { margin-bottom: var(--space-3); }

/* İki sütun: Girişler / Çıkışlar */
.naf-cols { display: grid; gap: var(--space-3); grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.naf-break {
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow-sm); padding: var(--space-3) var(--space-4); margin-bottom: 0;
}

/* Kaynak kırılımı satırı (etiket | mini-bar | tutar) */
.naf-row { display: grid; grid-template-columns: minmax(90px, auto) 1fr minmax(90px, auto); align-items: center; gap: var(--space-2); padding: 6px 0; }
.naf-row + .naf-row { border-top: 1px solid var(--border); }
.naf-row-lbl { font-size: var(--fs-sm); font-weight: 600; }
.naf-cnt { display: inline-block; min-width: 18px; text-align: center; font-size: var(--fs-xs); font-weight: 600; color: var(--text-muted); background: var(--surface-alt); border-radius: var(--radius-full); padding: 0 6px; margin-left: 4px; }
.naf-bar-track { height: 8px; background: var(--surface-alt); border-radius: var(--radius-full); overflow: hidden; }
.naf-bar-fill { height: 100%; border-radius: var(--radius-full); }
.naf-bar--in  { background: var(--green); }
.naf-bar--out { background: var(--red); }
.naf-row-amt { text-align: right; font-size: var(--fs-sm); font-weight: 700; font-variant-numeric: tabular-nums; }

.naf-tag { display: inline-block; font-size: var(--fs-xs); font-weight: 600; color: var(--yellow); background: rgba(0,0,0,.04); border-radius: var(--radius-sm); padding: 1px 6px; }
.naf-more, .naf-note { margin-top: var(--space-2); }
.naf-fxbreak { margin-top: 4px; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; }
.naf-fx-cur { font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.naf-fxbreak .pos { color: var(--green); }
.naf-fxbreak .neg { color: var(--red); }

/* ── Vade Takvimi (F8) ───────────────────────────────────────── */
.vt-controls { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); flex-wrap: wrap; margin-bottom: var(--space-3); }
.vt-controls .naf-chips { margin-bottom: 0; }

/* Zaman çizelgesi kümeleri */
.vt-bucket { border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); margin-bottom: var(--space-3); overflow: hidden; }
.vt-bucket-head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); padding: 10px 14px; border-bottom: 1px solid var(--border); flex-wrap: wrap; }
.vt-bucket-title { font-size: var(--fs-md); font-weight: 700; display: inline-flex; align-items: center; }
.vt-bucket-sub { font-size: var(--fs-sm); font-weight: 700; font-variant-numeric: tabular-nums; }
.vt-bucket-sub .pos { color: var(--green); } .vt-bucket-sub .neg { color: var(--red); }
.vt-bucket--od   { border-color: var(--red); }
.vt-bucket--od   .vt-bucket-head { background: rgba(229, 62, 62, .06); }
.vt-bucket--now  .vt-bucket-head { background: rgba(46, 43, 95, .05); }
.vt-bucket--warn .vt-bucket-head { background: rgba(214, 158, 46, .07); }

.vt-list { display: flex; flex-direction: column; }
.vt-item { display: grid; grid-template-columns: minmax(96px, auto) 1fr minmax(96px, auto); align-items: center; gap: var(--space-3); padding: 10px 14px; color: inherit; }
.vt-item + .vt-item { border-top: 1px solid var(--border); }
.vt-item:hover { background: var(--surface-alt); }
.vt-item--od { box-shadow: inset 3px 0 0 var(--red); }
.vt-item-date { font-size: var(--fs-sm); font-weight: 600; color: var(--text-muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.vt-od-tag { display: inline-block; margin-left: 6px; font-size: 10px; font-weight: 700; color: #fff; background: var(--red); border-radius: var(--radius-full); padding: 0 6px; vertical-align: middle; }
.vt-item-body { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.vt-item-party { font-weight: 600; }
.vt-item-meta { font-size: var(--fs-xs); color: var(--text-muted); }
.vt-item-amt { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.vt-item-amt.pos { color: var(--green); } .vt-item-amt.neg { color: var(--red); }
.vt-badge { display: inline-block; font-size: 10px; font-weight: 700; border-radius: var(--radius-full); padding: 1px 7px; }
.vt-badge--in  { color: var(--green); background: rgba(56, 161, 105, .12); }
.vt-badge--out { color: var(--red);   background: rgba(229, 62, 62, .12); }

/* Aylık takvim */
.vt-cal { border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); padding: var(--space-3); margin-bottom: var(--space-3); }
.vt-cal-bar { display: flex; align-items: center; justify-content: center; gap: var(--space-3); margin-bottom: var(--space-2); }
.vt-cal-month { font-size: var(--fs-md); font-weight: 700; min-width: 160px; text-align: center; text-transform: capitalize; }
.vt-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.vt-cal-grid--wd { margin-bottom: 4px; }
.vt-cal-wd { text-align: center; font-size: var(--fs-xs); font-weight: 600; color: var(--text-muted); padding: 2px 0; }
.vt-cal-cell { position: relative; min-height: 56px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); padding: 4px; display: flex; flex-direction: column; align-items: flex-start; gap: 3px; cursor: default; }
.vt-cal-cell--empty { border: 0; background: transparent; }
.vt-cal-cell--has { cursor: pointer; }
.vt-cal-cell--has:hover { border-color: var(--brand); }
.vt-cal-cell--today { outline: 2px solid var(--navy); outline-offset: -2px; }
.vt-cal-cell--sel { border-color: var(--brand); background: rgba(200, 90, 30, .07); }
.vt-cal-cell--od.vt-cal-cell--has { background: rgba(229, 62, 62, .06); }
.vt-cal-num { font-size: var(--fs-sm); font-weight: 600; }
.vt-cal-dots { display: inline-flex; align-items: center; gap: 3px; margin-top: auto; }
.vt-cal-cnt { font-size: 10px; font-weight: 700; color: var(--text-muted); }
.vt-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; }
.vt-dot--in { background: var(--green); } .vt-dot--out { background: var(--red); }
.vt-cal-legend { display: flex; align-items: center; gap: 6px; font-size: var(--fs-xs); color: var(--text-muted); margin-top: var(--space-3); flex-wrap: wrap; }
.vt-cal-legend .vt-dot { margin-left: 8px; }

@media (max-width: 640px) {
  .vt-cal-cell { min-height: 46px; }
  .vt-cal-num { font-size: var(--fs-xs); }
  .vt-item { grid-template-columns: 1fr auto; grid-template-areas: "date amt" "body body"; gap: 4px 8px; }
  .vt-item-date { grid-area: date; } .vt-item-amt { grid-area: amt; } .vt-item-body { grid-area: body; }
}

/* Bütçe & Hedef raporu */
.bgt-edit { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--space-3); background: var(--surface-alt); border-radius: var(--radius); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); }
.bgt-edit-h { flex: 0 0 100%; font-size: var(--fs-xs); font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--text-muted); }
.bgt-edit label { display: flex; flex-direction: column; gap: 4px; font-size: var(--fs-sm); font-weight: 600; }
.bgt-edit label .input { width: 180px; }
.bgt-big { font-size: var(--fs-2xl, 1.6rem); font-weight: 800; margin-bottom: var(--space-2); }
.bgt-bar { height: 10px; background: var(--surface-alt); border-radius: var(--radius-full); overflow: hidden; }
.bgt-fill { height: 100%; background: var(--brand); border-radius: var(--radius-full); transition: width .3s; }
.bgt-fill.done { background: var(--green); }
.bgt-bar-sub { font-size: var(--fs-xs); color: var(--text-muted); margin-top: 4px; }
.bgt-note { font-size: var(--fs-xs); color: var(--text-muted); margin-top: var(--space-1); }
