/* Carril COBR: estilos propios de este carril. Se carga después de estilo.css; solo lo toca su dueño.
   Cobros y pagos (cobros.js): remesas SEPA, mandatos, recordatorios y la guía del correo de salida. Solo tokens de estilo.css:
   ni colores ni tamaños sueltos, y nada de opacity en un texto (baja el contraste: para atenuar, --tenue). */

/* ── tablas ──────────────────────────────────────────────────────────── */
.cb-nombre { font-weight: 500; }
.tabla td.cb-sin-filas { padding: var(--e4); }
.cb-n { font-weight: 400; }                                   /* el «· 12» al lado del título de una tarjeta */

/* Un texto largo en una sola línea con «…» (el concepto de un gasto, el correo del cliente): la celda tiene tope, el texto, title */
.tabla td.cb-celda-trunc { max-width: 34ch; }
.cb-celda-trunc .trunc { display: block; }
/* En una caja estrecha (la mitad de la pantalla: a 1024 px quedan 644 px) el proveedor cede para que la última columna («El proveedor no tiene IBAN», el IBAN, el mandato)
   no se quede en 60 px con el texto partido letra a letra y la tabla desplazándose de lado */
@container (max-width: 760px) {
  .tabla td.cb-celda-trunc { max-width: 18ch; }
  .tabla td.cb-celda-trunc + td + td + td { min-width: 16ch; }
}
.tabla td.cb-correo-celda { max-width: 22ch; }
.cb-error-celda { max-width: 36ch; white-space: normal; }

/* «Cómo funciona», al lado de un formulario largo (Recordatorios): se queda a la vista mientras se baja por el formulario, en vez de dejar medio panel vacío debajo */
.card.cb-lateral { position: sticky; top: var(--e3); }

/* Lo que no se puede incluir en la remesa: atenuado con --tenue (nada de opacity: baja el contraste del texto) */
.cb-bloq td { color: var(--tenue); }
.cb-bloq td:last-child { color: inherit; }
.cb-descartada { color: var(--tenue); }

/* ── cuadro de confirmar la remesa ───────────────────────────────────── */
.cb-mov { min-width: 0; }
.cb-mov-concepto { display: inline-block; max-width: 28ch; vertical-align: bottom; }
.cf-mov { align-items: baseline; }

/* ── la guía del correo (Ajustes → Correo) ───────────────────────────── */
.cb-correo-guia { margin-bottom: var(--e3); }
.cb-correo-guia .fila { align-items: center; }