/* El estado de cuenta en PDF (H5), dentro del membrete de H1 (js/impresos/estado-cuenta.js). Todo bajo
   .estado-cuenta: este archivo también lo enlazan hoja.html, impreso.html e index.html (§2.2) y no toca nada más. */
.estado-cuenta .membrete__cuerpo { padding-top: 0.35in; }
.estado-cuenta__titulo { margin: 0 0 14px; font: 400 30px/1.05 'Fraunces', Georgia, serif; letter-spacing: -.02em; }
.estado-cuenta__datos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 0 0 18px; }
.estado-cuenta__datos dt { font: 600 9px 'IBM Plex Mono', monospace; letter-spacing: .14em; text-transform: uppercase; color: #9A8B76; }
.estado-cuenta__datos dd { margin: 2px 0 0; font-size: 13px; overflow-wrap: anywhere; }
.estado-cuenta__datos small, .estado-cuenta__tabla small { display: block; color: #4B4A48; font-size: 10.5px; }
.estado-cuenta h2 { margin: 18px 0 6px; font: 600 10px 'IBM Plex Mono', monospace; letter-spacing: .16em; text-transform: uppercase; color: var(--m-acento); }
.estado-cuenta__tabla { width: 100%; border-collapse: collapse; font-size: 11.5px; }
.estado-cuenta__tabla th {
  padding: 4px 6px; border-bottom: 1px solid rgba(27, 36, 51, .25); text-align: left;
  font: 600 9px 'IBM Plex Mono', monospace; letter-spacing: .1em; text-transform: uppercase; color: #9A8B76;
}
.estado-cuenta__tabla td { padding: 5px 6px; border-bottom: 1px solid rgba(27, 36, 51, .08); vertical-align: top; overflow-wrap: anywhere; }
.estado-cuenta__tabla .estado-cuenta__monto { text-align: right; font-family: 'IBM Plex Mono', monospace; font-variant-numeric: tabular-nums; white-space: nowrap; }
.estado-cuenta__tabla tr { break-inside: avoid; }
.estado-cuenta__saldos td:last-child { font-weight: 600; }
.estado-cuenta__vencida { color: #B3432B; }
.estado-cuenta__pagada { color: #2F6B4F; }
.estado-cuenta__nada, .estado-cuenta__nota { color: #6B5E4C; font-size: 11px; }
.estado-cuenta__nota { margin-top: 16px; }

/* H1 recorta el membrete a UNA hoja carta a propósito (membrete.css). Un estado de cuenta con muchos pagos no se
   puede recortar: un pago que no se imprime es un pago que el cliente no ve. Aquí la hoja crece y Chromium la
   parte en varias, con margen arriba y abajo (página con nombre: no toca las demás hojas) y la cabecera de cada
   tabla repetida. El servicio imprime con preferCSSPageSize: estas reglas mandan. */
@page estado-cuenta { size: letter; margin: 0.45in 0; }
@media print {
  .estado-cuenta { page: estado-cuenta; }
  .estado-cuenta .membrete__pagina { height: auto; min-height: 0; overflow: visible; padding-top: 0.1in; padding-bottom: 0.1in; }
  .estado-cuenta thead { display: table-header-group; }
}
