/* Pagos y bancos (pantallas 46-50). Solo tokens; prefijo propio .pag-*. Reusa .asi-* (equipos.css) para pasos,
   avisos y resultados, y .inicio-item / .inicio-mini-row (ui.css) para las listas cortas. */
.pag-vista { min-width: 0; }
.pag-angosta { max-width: 760px; }
.pag-nota { margin-bottom: 12px; }
.pag-nota-chica { font-size: 12.5px; }
.pag-filtro { display: inline-flex; align-items: center; gap: .4rem; min-width: 0; }
.pag-filtro .campo-input, select.pag-filtro { height: 34px; max-width: 220px; }
.pag-filtro-txt { font-size: 12.5px; color: var(--ink-3); }
.pag-periodo { flex-wrap: wrap; align-items: center; }
.pag-cliente { display: flex; align-items: center; gap: 10px; min-width: 0; }
.pag-cliente-txt { min-width: 0; }
.pag-cliente-txt .principal-txt, .pag-cliente-txt .secundario-txt { overflow-wrap: anywhere; }
.pag-avatar { width: 32px; height: 32px; font-size: 11px; flex: none; }
.pag-pills { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin-bottom: 6px; }
.pag-uuid { overflow-wrap: anywhere; font-size: 12.5px; }
.pag-mini { margin-top: 6px; }
.pag-panel { margin-top: 12px; padding: 14px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--card); }
.pag-panel .seccion-titulo:first-child { margin-top: 0; }
.pag-negativo { color: var(--danger); }
.pag-actual { background: var(--accent-soft); border-radius: 8px; }
.pag-marcar { margin-top: 8px; }
.pag-saldo-cliente { margin: 0 0 14px; display: flex; flex-direction: column; gap: .35rem; }
.pag-saldo-cliente .campo-input { flex: 1 1 auto; min-width: 0; }
.pag-resultado-cuerpo { min-width: 0; }
.pag-resultado-cuerpo a { margin-left: .3rem; white-space: nowrap; }

/* Registro: monto recibido + facturas con importe */
.pag-recibido { display: flex; align-items: flex-end; gap: .6rem; flex-wrap: wrap; margin-bottom: 10px; }
.pag-recibido .campo { flex: 1 1 160px; min-width: 0; max-width: 240px; }
.pag-facturas { border: 1px solid var(--border); border-radius: var(--radius); background: var(--card); }
.pag-factura { display: grid; grid-template-columns: auto 1fr minmax(96px, 130px); align-items: center; gap: 10px; padding: 10px 12px; border-bottom: 1px solid var(--border); cursor: pointer; }
.pag-factura:last-child { border-bottom: 0; }
.pag-factura.elegida { background: var(--accent-soft); }
.pag-factura .who { min-width: 0; }
.pag-factura .who-name { font: 700 13.5px var(--font-brand); display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; }
.pag-factura .who-id { font-size: 12px; color: var(--ink-3); overflow-wrap: anywhere; }
.pag-importe { text-align: right; height: 34px; min-width: 0; }
.pag-error-fila { grid-column: 2 / -1; }
.pag-totales { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .4rem 1.2rem; margin: 10px 0; font-size: 13px; color: var(--ink-2); }
.pag-totales b { color: var(--ink-1); }
.pag-remanente, .pag-remanente b { color: var(--warning); }
.pag-acciones-form { display: flex; justify-content: flex-end; margin-top: 14px; }
.pag-adeudo { font-size: 13px; color: var(--ink-2); margin: 0 0 12px; }

/* Carga masiva Banorte */
.pag-soltar { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 26px 16px; border: 2px dashed var(--border-strong); border-radius: var(--radius); background: var(--sunken); color: var(--ink-2); text-align: center; cursor: pointer; margin-bottom: 14px; }
.pag-soltar i { font-size: 26px; color: var(--success); }
.pag-soltar:hover, .pag-soltar.activo, .pag-soltar:focus-within { border-color: var(--accent); background: var(--accent-soft); color: var(--ink-1); }
.pag-deposito { padding: 12px 14px; border-bottom: 1px solid var(--border); display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.pag-deposito:last-child { border-bottom: 0; }
.pag-deposito-cabeza { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.pag-deposito-monto { flex: 1 1 160px; min-width: 0; }
.pag-deposito-monto .metric-value { font: 700 16px var(--font-brand); font-variant-numeric: tabular-nums; }
.pag-deposito-acciones { display: flex; gap: .4rem; flex-wrap: wrap; }
.pag-campos { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 4px 14px; font-size: 12.5px; }
.pag-campos div { display: flex; flex-direction: column; min-width: 0; }
.pag-campos span { color: var(--ink-3); font-size: 11px; text-transform: uppercase; letter-spacing: .04em; }
.pag-campos b { font-weight: 600; color: var(--ink-1); overflow-wrap: anywhere; }
.pag-concepto { font-size: 12.5px; overflow-wrap: anywhere; }
.pag-problemas { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; font-size: 12.5px; color: var(--warning); }
.pag-problemas i { margin-right: .35rem; }
.pag-alternativas { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin-top: 10px; }
.pag-agregar { margin-top: 10px; display: flex; flex-direction: column; gap: .35rem; }

@media (max-width: 760px) {
  .pag-filtro .campo-input, select.pag-filtro { max-width: 100%; width: 100%; }
  .pag-filtro { flex: 1 1 140px; }
  .pag-filtro .campo-input { min-width: 0; flex: 1 1 auto; }
  .pag-periodo { width: 100%; }
  .pag-periodo .pag-filtro { flex: 1 1 100%; }
  .pag-periodo .pag-filtro-txt { width: 44px; flex: none; }
  .pag-factura { grid-template-columns: auto 1fr; }
  .pag-importe { grid-column: 2 / -1; }
  .pag-totales { justify-content: flex-start; }
}
