/**
 * financials-topbar.css — Financials topbar tab styles
 * Fusion Property Management — FB-09d
 * 2026-06-18
 */

/* ── Page wrapper ─────────────────────────────────────────────── */
.fin-topbar-page {
  /* inherits op-page layout */
}

/* ── Subtitle count badges ────────────────────────────────────── */
.fin-tb-count-profit {
  color: #16a34a;
  font-weight: 600;
}

.fin-tb-count-loss {
  color: #dc2626;
  font-weight: 600;
}

/* ── Table ────────────────────────────────────────────────────── */
.fin-topbar-table-wrap {
  margin-top: 16px;
}

.fin-topbar-table {
  /* inherits op-table */
}

/* ── Amount column alignment ──────────────────────────────────── */
.fin-tb-amount-th,
.fin-tb-amount-cell {
  text-align: right !important;
}

/* ── Property name cell ───────────────────────────────────────── */
.fin-tb-prop-name {
  min-width: 180px;
}

.fin-tb-prop-label {
  display: block;
  font-weight: 500;
  color: var(--color-text-primary, #f6f8ff);
}

.fin-tb-prop-addr {
  display: block;
  font-size: 11px;
  color: var(--muted, #8ea0b8);
  margin-top: 2px;
}

/* ── Row interactivity ────────────────────────────────────────── */
.fin-tb-prop-row {
  cursor: pointer;
  transition: background 0.15s ease;
}

.fin-tb-prop-row:hover {
  background: rgba(67, 112, 151, 0.12) !important;
}

.fin-tb-prop-row:focus-visible {
  outline: 2px solid var(--color-accent, #ffc022);
  outline-offset: -2px;
}

/* ── Status badges ────────────────────────────────────────────── */
.fin-tb-badge {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 9999px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.fin-tb-badge--profit {
  background: rgba(16, 72, 44, 0.55);
  color: #2bc47a;
  border: 1px solid rgba(29, 158, 117, 0.4);
}

.fin-tb-badge--loss {
  background: rgba(72, 16, 16, 0.55);
  color: #f87171;
  border: 1px solid rgba(216, 90, 48, 0.4);
}

/* ── Summary / totals row ─────────────────────────────────────── */
.fin-tb-summary-row {
  border-top: 2px solid rgba(67, 112, 151, 0.35) !important;
  background: rgba(13, 30, 53, 0.55) !important;
}

.fin-tb-summary-row td {
  padding-top: 14px !important;
  padding-bottom: 14px !important;
}

.fin-tb-summary-label {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.fin-tb-summary-sub {
  font-size: 11px;
  color: var(--muted, #8ea0b8);
  font-weight: 400;
}
