/* Lo que se ve igual en Datos y en las tarjetas de Conciliar: el distintivo de estado, las señales,
   las cifras y los identificadores de un renglón (fila-datos.js). Una sola hoja, para que un
   renglón no tenga dos aspectos según la pantalla en que se mire. Sin estilos en línea: CSP. */
/* Estado badge inside the table. Colours are semantic, not per-source; app.css already owns
   .estado/.estado-* for exactly this, so the badge reuses them and only adds the layout. */
.dt-badge { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; font-weight: 600; padding: 2px 10px 2px 8px; border-radius: 999px; }
.dt-glifo { font-style: normal; font-size: 1.05em; line-height: 1; }
/* Ámbar real para «parcial» (--warn es un café oscuro en claro: se leía sucio, no «a medias»). */
:root { --parcial: 36 96% 46%; --parcial-ink: 30 92% 30%; }
[data-theme="dark"] { --parcial: 40 96% 56%; --parcial-ink: 40 96% 66%; }
/* Conciliado = verde relleno; parcial = ámbar con relleno: los dos dejan de ser un contorno fino
   del mismo verde y se distinguen de un vistazo, también en la hoja lateral. */
.dt-badge.estado-conciliado, .dt-badge.estado-asignado, .dt-badge.estado-compensado {
  color: var(--ok); border-color: color-mix(in srgb, var(--ok) 55%, transparent); background: color-mix(in srgb, var(--ok) 16%, transparent); }
.dt-badge.estado-parcial, .dt-badge.estado-vinculado, .dt-badge.estado-conciliado.estado-con-dif {
  color: hsl(var(--parcial-ink)); border-color: hsl(var(--parcial) / .6); background: hsl(var(--parcial) / .2); }
.dt-badge.estado-cancelado { background: hsl(var(--bad-h) / .12); }
/* Un traspaso no es ni ingreso ni costo: gris neutro, ni verde ni ámbar. */
.dt-badge.estado-traspaso { color: var(--muted); border-color: color-mix(in srgb, var(--muted) 50%, transparent); background: color-mix(in srgb, var(--muted) 14%, transparent); }

.dt-flag { display: inline-block; margin-left: 6px; font-size: var(--fs-xs); color: var(--warn); white-space: nowrap; }
/* Una señal que dice "esto ya está", no "esto falta": mismo tamaño, otro color. Sin ella
   "TPV 12/12 cobros" se leía como una advertencia más en ámbar. */
.dt-flag.ok { color: var(--ok); }
.dt-flag.neutro { color: var(--muted); }
.dt-tipo { margin-left: 0; font-weight: 600; }
/* En la tabla, la celda de Estado es angosta: badge + chip nowrap en la misma línea se
   desbordaba sobre la columna de Fecha. El chip baja debajo del badge. */
.dt-tbl td > .dt-badge + .dt-flag { display: block; width: fit-content; margin: 3px 0 0 7px; }

.dt-marks .dt-flag { margin-left: 0; margin-right: 8px; }
.dt-marks { max-width: none; }

.dt-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }

.dt-id { font-family: var(--font-mono); font-size: var(--fs-xs); word-break: break-all; }
.dt-muted { color: var(--muted); }
.dt-neg { color: var(--bad); }

/* RFC del titular: identificador, no texto — nunca parte el renglón en dos. */
.dt-titular { white-space: nowrap; color: var(--muted); }
/* Second/third line of the Total cell when an egreso nets part of it. */
.dt-net { font-size: var(--fs-xs); line-height: 15px; color: var(--muted); }

.dt-pos { color: var(--ok); }