/* ledgers pages: the account chooser and one account's statement. */

.lg-caption { display: flex; justify-content: space-between; gap: 10px; padding: 12px 14px 10px; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--text2); border-bottom: 1px solid var(--line); }
.lg-caption + .table-wrap .table thead { display: none; }
.lg-range { display: grid; grid-template-columns: repeat(2, minmax(0, 200px)); gap: 12px; }
.lg-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.lg-opening { margin-top: 10px; }
.lg-table td { vertical-align: middle; }
.lg-part { display: inline-flex; align-items: center; gap: 10px; min-width: 220px; }
.lg-part .cell-sub { max-width: 420px; }
.lg-month td { background: #F8FAFC; padding: 7px 14px; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--text2); }
.lg-month td span + span { float: right; text-transform: none; letter-spacing: 0; font-weight: 700; }
.lg-opening-row td { background: #FBFCFE; }
.lg-print-head { display: none; }
@media (max-width: 700px) {
  .lg-summary { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .lg-summary .m-stat:last-child { grid-column: 1 / -1; }
  .lg-range { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}

/* A printed statement: the business and period on top, the full table, nothing to press. */
@media print {
  .ledger-page .no-print, .ledger-page .page-head .back-btn { display: none !important; }
  .ledger-page .page-head { display: none; }
  .lg-print-head { display: block; margin-bottom: 12px; }
  .lg-print-head h2 { font-size: 18px; margin: 4px 0; }
  .lg-card { break-inside: auto !important; }
  .lg-table { font-size: 12px; }
  .lg-table tr { break-inside: avoid; }
  .lg-table .line-icon { display: none; }
  .lg-table td, .lg-table th { padding: 6px 8px; }
  .table-wrap { overflow: visible; }
  .lg-part { min-width: 0; }
}
@media (max-width: 700px) {
  .lg-table td, .lg-table th { padding: 9px 8px; }
  .lg-table th { font-size: 11px; }
  .lg-part { min-width: 0; gap: 8px; }
  .lg-part .line-icon { display: none; }
  .lg-table .money { font-size: 13px; }
}