/* =====================================================================
   MANAMELI · Estilo de los documentos
   ---------------------------------------------------------------------
   Este archivo lo cargan DOS sitios:
     · el panel de administración   (index.html)
     · el portal de propietarios    (portal/index.html)

   La razón de que exista: la cuenta de cobro y el estado de cuenta se
   expiden desde los dos lados con el mismo consecutivo. Si el propietario
   descarga la cuenta N° 661 del portal y la administración le manda la
   N° 661 por WhatsApp, tienen que ser el mismo papel. Mientras el estilo
   estuvo duplicado se desfasaron dos veces.

   NO edites este archivo en un solo sitio: es el mismo archivo para los
   dos. Cualquier cambio aquí se ve en ambos.
   ===================================================================== */

:root{
  --pizarra: #0E1A20;
  --cian: #23CBD4;
  --cian2: #0E8E96;
  --cian3: #E1F7F8;
  --papel: #EDF2F1;
  --linea: #D5E0DD;
  --linea2: #E7EDEB;
  --tinta2: #48606A;
  --tinta3: #7B9099;
  --v30: #E2A32C;
  --mono: 'IBM Plex Mono', ui-monospace, monospace;
  --disp: 'Space Grotesk', system-ui, sans-serif;
  --body: 'IBM Plex Sans', system-ui, -apple-system, sans-serif;
}

/* ---------------------------------------------------------------------
   La MISMA paleta, repetida sobre .cuenta.

   Sin esto, el documento se pinta con los colores del sitio que lo carga.
   Los dos sitios definen --papel, --linea, --tinta2 y --tinta3 en su
   propio :root con valores ligeramente distintos, y el que se declare de
   último gana. En el portal, que carga este archivo antes de su <style>,
   ganaban los del portal: la letra gris de las tablas salía en #5A7077
   en vez de #7B9099, y los filetes y fondos cambiaban de tono.

   Declarándolos también en .cuenta, cualquier elemento del documento los
   toma de aquí, porque .cuenta está más cerca que :root en la cadena.
   Los de :root se quedan para lo que vive fuera de la hoja.
   --------------------------------------------------------------------- */
.cuenta{
  --pizarra: #0E1A20;
  --cian: #23CBD4;
  --cian2: #0E8E96;
  --cian3: #E1F7F8;
  --papel: #EDF2F1;
  --linea: #D5E0DD;
  --linea2: #E7EDEB;
  --tinta2: #48606A;
  --tinta3: #7B9099;
  --v30: #E2A32C;
  --mono: 'IBM Plex Mono', ui-monospace, monospace;
  --disp: 'Space Grotesk', system-ui, sans-serif;
  --body: 'IBM Plex Sans', system-ui, -apple-system, sans-serif;
}

/* .num la usan las tablas de los documentos */
.num{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.02em}

.cuenta{width:210mm;min-height:297mm;margin:0 auto 22px;background:#fff;box-shadow:0 14px 40px -18px rgba(0,0,0,.6);
  padding:0 0 9mm;position:relative;display:flex;flex-direction:column;color:#0A1418;box-sizing:border-box}
.cta-cab{background:var(--pizarra);color:#fff;padding:10mm 12mm 8mm;position:relative;
  overflow:hidden;flex:0 0 auto;padding-bottom:12mm}
.cta-cab .curvas{position:absolute;inset:0;opacity:.4}
.cta-cab .in{position:relative;display:flex;align-items:flex-start;gap:10mm}
.cta-org{font-family:var(--disp);font-size:14pt;font-weight:600;letter-spacing:-.02em;line-height:1.15}
.cta-org small{display:block;font-family:var(--mono);font-size:8pt;color:#8FB0BC;letter-spacing:.04em;margin-top:4px;font-weight:400;line-height:1.6}
/* Faltaba: sin alto, el logo sale a su tamaño natural y rompe la cabecera. */
/* Estas dos viven también en el CSS general del panel, pero el portal no
   lo carga, así que tienen que estar aquí. Las agregó el chat del portal
   al detectar que el logo y la alineación derecha no se aplicaban. */
.cta-logo{height:12mm;width:auto;display:block;margin-bottom:2.5mm}
.cta-doc{margin-left:auto;text-align:right;flex:none}
.cta-doc .et{font-family:var(--mono);font-size:8pt;letter-spacing:.22em;color:var(--cian)}
.cta-doc .nn{font-family:var(--disp);font-size:21pt;font-weight:700;letter-spacing:-.04em;line-height:1}
.cta-doc .nn.borr{font-size:12pt;color:#8FB0BC;font-weight:500;letter-spacing:0}
.cta-doc .fe{font-family:var(--mono);font-size:8.5pt;color:#8FB0BC;margin-top:3px}
/* El cuerpo crece con su contenido y empuja el cupón hacia abajo en vez de
   quedar debajo de él. Antes el alto era fijo y el texto se desbordaba
   encima del cupón. */
.cta-cpo{padding:0 12mm;flex:0 0 auto}
.cta-tira{display:flex;gap:0;margin:-9mm 0 6mm;position:relative;z-index:2}
.cta-tira>div{background:#fff;border:.7pt solid var(--linea);flex:1;padding:3.5mm 4.5mm}
.cta-tira>div:first-child{border-radius:2.5mm 0 0 2.5mm}
.cta-tira>div:last-child{border-radius:0 2.5mm 2.5mm 0}
.cta-tira>div+div{border-left:0}
.cta-tira .e{font-family:var(--mono);font-size:7.5pt;letter-spacing:.13em;text-transform:uppercase;color:var(--tinta3)}
.cta-tira .d{font-family:var(--disp);font-size:13pt;font-weight:600;letter-spacing:-.03em;margin-top:.8mm;line-height:1.1}
.cta-tira .d small{font-size:9pt;font-weight:500;color:var(--tinta2)}
.cta-quien{display:flex;gap:9mm;margin-bottom:4mm}
.cta-quien>div{flex:1}
.cta-et{font-family:var(--mono);font-size:7pt;letter-spacing:.18em;text-transform:uppercase;
  color:var(--cian2);font-weight:600;margin-bottom:2.5mm;display:flex;align-items:center;gap:3mm}
.cta-et:after{content:'';flex:1;height:.4pt;background:var(--linea)}
.cta-quien .nom{font-size:11pt;font-weight:600;line-height:1.25}
.cta-quien .li{font-size:9pt;color:var(--tinta2);line-height:1.6;margin-top:1mm}
.cta-form{background:#F3F8F7;border:1px solid var(--linea);border-radius:6px;padding:3mm 4mm;margin-bottom:5mm;
  font-family:var(--mono);font-size:9pt;display:flex;align-items:center;gap:2.5mm;flex-wrap:wrap}
.cta-form b{color:var(--cian2)}
table.cta{width:100%;border-collapse:collapse;margin-bottom:3.5mm}
table.cta th{background:var(--pizarra);color:#fff;font-family:var(--mono);font-size:7.5pt;letter-spacing:.11em;
  text-transform:uppercase;font-weight:500;padding:2mm 3mm;text-align:left}
table.cta td{padding:1.6mm 3mm;border-bottom:1px solid var(--linea2);font-size:9pt}
/* Faltaba: sin esto las columnas de valores quedan alineadas a la izquierda. */
table.cta .der-t{text-align:right}

table.cta tfoot td{border-top:.4pt solid var(--linea);border-bottom:0;font-weight:500;padding-top:1.6mm;font-size:9.5pt;color:var(--tinta2)}
table.cta tfoot tr.gran td{border-top:1.5px solid var(--pizarra);font-weight:700;font-size:11pt;color:inherit;padding-top:2.5mm}
.cta-total{display:flex;align-items:center;gap:6mm;background:var(--pizarra);color:#fff;
  border-radius:3mm;padding:5mm 6mm;margin-bottom:4.5mm}
.cta-total .lb{font-family:var(--mono);font-size:8pt;letter-spacing:.18em;text-transform:uppercase;color:var(--cian)}
.cta-total .vl{font-family:var(--disp);font-size:22pt;font-weight:700;letter-spacing:-.045em;line-height:1}
.cta-total .pl{margin-left:auto;text-align:right}
.cta-total .pl .e{font-family:var(--mono);font-size:8pt;color:#8FB0BC;letter-spacing:.12em;text-transform:uppercase}
.cta-total .pl .d{font-family:var(--disp);font-size:13pt;font-weight:600;margin-top:1mm}
.cta-aviso{border-left:3px solid var(--v30);background:#FDF9F0;padding:3mm 4mm;font-size:8pt;line-height:1.55;margin-bottom:4mm;color:#4A3B1C}
.cta-nota{font-size:7pt;color:var(--tinta3);line-height:1.5;margin-bottom:3mm}
/* El cupón de pago es un panel propio, no una línea punteada al final.
   Va pegado abajo con margin-top:auto y con fondo blanco y z-index para
   que el cuerpo nunca se le encime, que era lo que pasaba. */
/* El bloque de pago reúne el total, la fecha límite, el QR y los datos
   bancarios. Antes eran dos bloques que repetían el valor y la fecha. */
/* Los dos avisos del pie van uno al lado del otro: son información
   secundaria y en columna se comían 40 mm de alto. */
.cta-pies{display:flex;gap:5mm;align-items:stretch;margin-top:3mm}
.pie-mora{flex:1.15;background:#FDF8EE;border-left:2.5pt solid #C99A2E;border-radius:0 2mm 2mm 0;
  padding:3mm 4mm;font-size:7.5pt;line-height:1.5;color:#5A4620}
.pie-mora b{color:#3D2F12}
.pie-legal{flex:1;padding:3mm 0 3mm 0;font-size:6.8pt;line-height:1.5;color:var(--tinta3)}
.cta-pies>.pie-legal:only-child{flex:1}
/* =====================================================================
   AJUSTE DE ALTO · el bloque de pago se salía de la hoja
   El rótulo del QR terminaba en y=844,8 pt sobre una hoja de 841,9 y el
   borde inferior de la tarjeta quedaba 16 pt afuera. Con height:297mm y
   overflow:hidden al imprimir, eso se recortaba en silencio.
   Se recuperaron 6,5 mm repartidos entre cinco reglas, para no sacrificar
   nada de un solo sitio. El QR quedó en 32 mm, que sigue siendo bastante
   más grande que los 26 con los que arrancó.
   ===================================================================== */

/* =====================================================================
   CUENTA CONSOLIDADA · un documento que ocupa varias hojas
   La maqueta normal es de una sola página: altura fija, flex en columna
   y pie anclado abajo. Con 110 parcelas eso deja el documento partido a
   la mitad. Esta variante deja fluir el contenido y le enseña al
   navegador dónde puede cortar.
   ===================================================================== */
.cuenta.consol{
  min-height:auto;                 /* que crezca lo que necesite */
  display:block;                   /* sin flex: el contenido fluye */
  padding-bottom:14mm;
}
.cuenta.consol .cta-cpo{padding:0 12mm}

/* La cabecera de la tabla se repite en cada hoja: sin esto, de la página
   dos en adelante uno no sabe qué columna es cuál. */
.cuenta.consol table.cta th{position:static}
/* El corte entre páginas lo gobierna la hoja que se inyecta al imprimir,
   no estas reglas: ahí está toda la lógica junta. */

/* Los totales no se parten nunca: un corte ahí deja el documento
   diciendo la mitad de una cifra. */
.cuenta.consol .cta-tot{break-inside:avoid;page-break-inside:avoid;margin-top:6mm}
.cuenta.consol .cta-pie{break-inside:avoid;page-break-inside:avoid;margin-top:8mm}
.cuenta.consol .cta-quien{break-inside:avoid}

/* Un rótulo de continuación en las hojas siguientes. */
.cuenta.consol .cta-et{break-after:avoid;page-break-after:avoid}

/* Con cien filas, el aire que hace legible una tabla de cuatro estorba.
   Se compacta y se alterna el fondo para no perder el renglón. */
/* El resumen de arriba: cuatro cifras que evitan sumar cien filas. */
.cuenta.consol .cta-res{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:var(--linea);border:1px solid var(--linea);border-radius:2mm;
  overflow:hidden;margin:5mm 0 6mm;break-inside:avoid}
.cuenta.consol .cta-res>div{background:var(--papel);padding:3.5mm 4mm}
.cuenta.consol .cta-res .e{display:block;font-family:var(--mono);font-size:6.5pt;
  letter-spacing:.14em;text-transform:uppercase;color:var(--tinta3)}
.cuenta.consol .cta-res .v{display:block;font-family:var(--disp);font-size:13pt;
  font-weight:600;margin-top:1mm;line-height:1.1}

.cuenta.consol table.cta td{padding:1.9mm 3mm;font-size:8.5pt}
.cuenta.consol table.cta th{padding:2.2mm 3mm;font-size:7pt}
.cuenta.consol table.cta tbody tr:nth-child(even){background:#FAFCFB}
.cuenta.consol table.cta tbody tr td:first-child{font-weight:600}

/* Las reglas de impresión de este documento NO van aquí: se inyectan al
   abrirlo, porque redefinen @page — que es global y no se puede
   condicionar por clase. Ver hojaImpresionLarga() en el sistema. */

/* =====================================================================
   RECIBO DE CAJA
   Identidad propia, distinta de la cuenta de cobro. La cuenta dice
   "usted debe"; el recibo dice "recibimos". Por eso el verde, el sello
   y el valor como protagonista en vez del número de documento.
   ===================================================================== */
.rc-verde{--rc:#0E7A37;--rc2:#0A5E2A;--rc3:#E8F5EC;--rc4:#C9E7D3;padding-bottom:0}

/* Marca de agua del borrador: que sea imposible confundirlo con un recibo
   definitivo si alguien lo imprime o le toma pantallazo. */
.rc-draft{position:absolute;top:44%;left:50%;transform:translate(-50%,-50%) rotate(-24deg);
  font-family:var(--disp);font-size:44pt;font-weight:700;letter-spacing:-.02em;
  color:rgba(165,17,31,.12);border:3pt solid rgba(165,17,31,.14);border-radius:4mm;
  padding:4mm 10mm;white-space:nowrap;pointer-events:none;z-index:9;text-transform:uppercase}
.rc-sello.bor{border-color:#D98A8A;background:rgba(165,17,31,.16)}
.rc-sello.bor .t{color:#F5A3A3}
.rc-sello.bor .f{color:#E6BEBE}

.rc-cab{background:var(--pizarra);color:#fff;padding:9mm 12mm 0;position:relative;
  overflow:hidden;flex:0 0 auto}
.rc-cab .curvas{position:absolute;inset:0;opacity:.35}
.rc-cab .in{position:relative}
.rc-marca{display:flex;align-items:flex-start;justify-content:space-between;gap:8mm;
  padding-bottom:7mm;border-bottom:.5pt solid rgba(255,255,255,.14)}
.rc-marca .org{font-family:var(--disp);font-size:13pt;font-weight:600;line-height:1.25}
.rc-marca .org small{display:block;font-family:var(--mono);font-size:7.5pt;font-weight:400;
  color:#8FB0BC;margin-top:1.5mm;line-height:1.6;letter-spacing:.01em}
.rc-sello{flex:none;text-align:center;border:1.2pt solid var(--rc);border-radius:2mm;
  padding:2.5mm 4mm;transform:rotate(-3deg);background:rgba(14,122,55,.14)}
.rc-sello .t{font-family:var(--mono);font-size:9pt;font-weight:700;letter-spacing:.2em;
  color:#5BD98A;line-height:1}
.rc-sello .f{font-family:var(--mono);font-size:6.5pt;color:#9FD9B4;margin-top:1.2mm;letter-spacing:.06em}

.rc-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:8mm;padding:7mm 0 8mm}
.rc-hero .izq .et{font-family:var(--mono);font-size:8pt;letter-spacing:.26em;text-transform:uppercase;
  color:#8FB0BC;margin-bottom:1.5mm}
.rc-hero .izq .tt{font-family:var(--disp);font-size:26pt;font-weight:700;letter-spacing:-.025em;
  line-height:.95}
.rc-hero .izq .nn{font-family:var(--mono);font-size:10pt;color:#5BD98A;margin-top:2mm;letter-spacing:.06em}
.rc-hero .der{text-align:right;flex:none}
.rc-hero .der .et{font-family:var(--mono);font-size:7.5pt;letter-spacing:.2em;text-transform:uppercase;
  color:#8FB0BC;margin-bottom:1.5mm}
.rc-hero .der .vl{font-family:var(--disp);font-size:30pt;font-weight:700;letter-spacing:-.035em;
  line-height:.95;color:#5BD98A}

/* La franja de confirmación: lo que vuelve esto un recibo y no una factura. */
.rc-franja{background:var(--rc3);border-top:1.5pt solid var(--rc);border-bottom:.5pt solid var(--rc4);
  padding:4mm 12mm;display:flex;align-items:center;gap:4mm;flex:0 0 auto}
.rc-franja svg{flex:none;width:6mm;height:6mm}
.rc-franja .tx{font-size:9pt;line-height:1.45;color:#16321F}
.rc-franja .tx b{font-family:var(--mono);font-size:9.5pt}

.rc-cpo{padding:7mm 12mm 0;flex:1 0 auto}
.rc-quien{display:flex;gap:10mm;margin-bottom:6mm}
.rc-quien>div{flex:1}
.rc-quien .et{font-family:var(--mono);font-size:7pt;letter-spacing:.18em;text-transform:uppercase;
  color:var(--rc);font-weight:600;margin-bottom:2mm;display:flex;align-items:center;gap:3mm}
.rc-quien .et:after{content:'';flex:1;height:.4pt;background:var(--rc4)}
.rc-quien .nom{font-family:var(--disp);font-size:13pt;font-weight:600;line-height:1.25}
.rc-quien .li{font-size:8.5pt;color:var(--tinta2);line-height:1.6;margin-top:1.5mm}
.rc-quien .parc{font-family:var(--disp);font-size:20pt;font-weight:700;letter-spacing:-.02em;
  line-height:1;color:var(--pizarra)}

table.rc{width:100%;border-collapse:collapse;margin-bottom:5mm;font-size:9pt}
table.rc th{background:var(--pizarra);color:#fff;font-family:var(--mono);font-size:7pt;
  letter-spacing:.14em;text-transform:uppercase;font-weight:500;padding:2.6mm 3mm;text-align:left}
table.rc th:first-child{border-radius:1.5mm 0 0 0}
table.rc th:last-child{border-radius:0 1.5mm 0 0}
table.rc td{padding:2.4mm 3mm;border-bottom:.4pt solid var(--linea)}
table.rc .der-t{text-align:right}
table.rc tbody tr:nth-child(even){background:#FAFCFB}
table.rc tfoot td{padding:3.5mm 3mm;border-top:1.2pt solid var(--pizarra);border-bottom:0;
  font-family:var(--disp);font-weight:700;font-size:12pt}
.rc-chip{display:inline-block;font-family:var(--mono);font-size:7pt;letter-spacing:.1em;
  text-transform:uppercase;padding:.7mm 2mm;border-radius:1mm;font-weight:600}
.rc-chip.ok{background:var(--rc3);color:var(--rc2);border:.4pt solid var(--rc4)}
.rc-chip.deb{background:#FDECEE;color:#8A0E1A;border:.4pt solid #F3C7CC}

.rc-pie{margin-top:auto;padding:0 12mm 8mm;flex:0 0 auto}
.rc-nota{font-size:7pt;color:var(--tinta3);line-height:1.55;padding:3mm 0;
  border-top:.4pt solid var(--linea)}
.rc-firma{margin-top:8mm;display:flex;align-items:flex-end;justify-content:space-between;gap:10mm}
.rc-firma .fi{max-width:82mm;padding-top:3mm;border-top:.5pt solid var(--pizarra)}
.rc-firma .fi .n{font-size:9.5pt;font-weight:600;font-family:var(--disp)}
.rc-firma .fi .c{font-size:7.5pt;color:var(--tinta2);line-height:1.55;margin-top:.8mm}
.rc-firma .fi .e{font-size:7pt;color:var(--tinta3);margin-top:2.5mm}
.rc-qr{flex:none;text-align:center}
.rc-qr img{width:22mm;height:22mm;object-fit:contain;border:.5pt solid var(--linea);
  border-radius:1.5mm;padding:1mm;background:#fff;display:block}
.rc-qr span{display:block;font-family:var(--mono);font-size:6pt;letter-spacing:.08em;
  text-transform:uppercase;color:var(--tinta3);margin-top:1.2mm}
.rc-anulado{background:#FDE7E9;border:1pt solid #E8A0A8;border-left:3pt solid #A5111F;
  border-radius:0 2mm 2mm 0;padding:3.5mm 4.5mm;margin-bottom:5mm;font-size:9pt;line-height:1.5}

.cta-pago{margin:3.5mm 12mm 0;flex:none;position:relative;z-index:3;
  border:.7pt solid var(--linea);border-radius:3mm;overflow:hidden;background:#fff}
.pg-cab{display:flex;align-items:center;justify-content:space-between;gap:6mm;
  background:var(--pizarra);color:#fff;padding:4mm 6mm}
.pg-lb{font-family:var(--mono);font-size:7.5pt;letter-spacing:.18em;text-transform:uppercase;color:var(--cian)}
.pg-vl{font-family:var(--disp);font-size:21pt;font-weight:700;letter-spacing:-.03em;line-height:1.05}
.pg-fe{text-align:right}
.pg-fe .e{font-family:var(--mono);font-size:7.5pt;letter-spacing:.16em;text-transform:uppercase;color:#8FB0BC}
.pg-fe .d{font-family:var(--disp);font-size:13pt;font-weight:600;margin-top:.5mm}
.pg-cpo{display:flex;gap:6mm;align-items:center;padding:3.5mm 6mm;background:var(--papel)}
.pg-qr{flex:none;width:32mm;display:flex;flex-direction:column;align-items:center;gap:1.2mm}
.pg-qr img{width:32mm;height:32mm;object-fit:contain;border:.7pt solid var(--linea);
  border-radius:2mm;padding:1.2mm;background:#fff;display:block}
.pg-qr span{font-family:var(--mono);font-size:6.5pt;letter-spacing:.1em;text-transform:uppercase;
  color:var(--tinta3);text-align:center}
.pg-dat{flex:1;min-width:0;font-size:8.5pt;line-height:1.5}
.pg-banco{font-family:var(--mono);font-size:10pt;font-weight:600;color:var(--pizarra);line-height:1.3}
.pg-lla{margin-top:1.8mm}
.pg-lla b{font-family:var(--mono);font-size:10pt}
.pg-ref{margin-top:1.8mm}
.pg-ref b{font-family:var(--mono)}
.pg-ins{margin-top:1.5mm;color:var(--tinta2);font-size:8pt;line-height:1.45}
.cta-cupon{margin:4mm 12mm 0;flex:none;position:relative;z-index:3;background:#fff}
.cta-cupon .tt{font-family:var(--mono);font-size:7pt;letter-spacing:.2em;text-transform:uppercase;
  color:var(--cian2);margin-bottom:2mm;display:flex;align-items:center;gap:3mm}
.cta-cupon .tt:after{content:'';flex:1;height:.4pt;background:var(--linea)}
.cta-cupon .caja{display:flex;gap:5mm;align-items:center;border:.7pt solid var(--linea);
  border-radius:3mm;padding:3.5mm 4.5mm;background:var(--papel)}
.cta-cupon .caja>div{flex:1;min-width:0}
.cta-cupon .p{font-size:8.5pt;line-height:1.5}
.cta-cupon .p b{font-family:var(--mono)}
.cta-qr-caja{flex:none !important;width:33mm;display:flex;flex-direction:column;align-items:center;gap:1mm}
.cta-cupon img.cta-qr{width:33mm;height:33mm;object-fit:contain;border:.7pt solid var(--linea);
  border-radius:2mm;padding:1.2mm;background:#fff;display:block}
.cta-qr-pie{font-family:var(--mono);font-size:6.5pt;letter-spacing:.1em;text-transform:uppercase;
  color:var(--tinta3);text-align:center;line-height:1.3}
.cta-lla{font-family:var(--mono);font-size:7pt;letter-spacing:.14em;text-transform:uppercase;
  color:#C8102E;border:.4pt solid #C8102E;border-radius:1mm;padding:.3mm 1.2mm}
.cta-cupon .val{text-align:right;flex:none;min-width:52mm}
.cta-cupon .val .e{font-family:var(--mono);font-size:7.5pt;letter-spacing:.13em;text-transform:uppercase;color:var(--tinta3)}
.cta-cupon .val .d{font-family:var(--disp);font-size:15pt;font-weight:700;letter-spacing:-.03em}

@media print{
  @page{size:A4;margin:0}
  /* Cada documento arranca en su propia hoja y no se parte por dentro. */
  .cuenta{box-shadow:none;margin:0;page-break-after:always;break-after:page}
  .cuenta:last-child{page-break-after:auto;break-after:auto}
  .cta-pago,.cta-cupon,.cta-total,.cta-tira,.cta-pies{page-break-inside:avoid;break-inside:avoid}
  table.cta{page-break-inside:avoid;break-inside:avoid}
  /* Mientras hay un documento abierto, la aplicación no existe.
     El panel lateral es position:fixed, así que si no se oculta el navegador
     lo imprime encima del documento. */
  body.imprimiendo #app,
  body.imprimiendo #panel,
  body.imprimiendo #modales,
  body.imprimiendo #aviso-impresion,
  body.imprimiendo .aviso{display:none !important}
  body.imprimiendo{overflow:visible;background:#fff}
  body.imprimiendo #impresion{display:block;position:static;background:#fff;padding:0;overflow:visible}
  body.imprimiendo .hojas{padding:0}
  body.imprimiendo .imp-barra{display:none !important}
  /* Sin recorte duro: si un caso extremo no cabe, el bloque de pago pasa
     entero a la segunda hoja en vez de cortarse en silencio. Perder
     contenido sin avisar es peor que una hoja de más, en un documento que
     sustenta un cobro prejurídico. */
  .cuenta{width:auto;min-height:297mm;margin:0;box-shadow:none;
    page-break-after:always;break-after:page;page-break-inside:avoid;break-inside:avoid}
  .cuenta:last-child{page-break-after:auto;break-after:auto}
  .cta-cab,.cta-tira,.cta-quien,.cta-form,.cta-total,.cta-aviso,.cta-cupon,table.cta{
    page-break-inside:avoid;break-inside:avoid}
}
/* Sin esto Chrome imprime los fondos oscuros en blanco. */
#impresion,#impresion *{-webkit-print-color-adjust:exact;print-color-adjust:exact;color-adjust:exact}
/* Sin un documento abierto no se imprime la aplicación: sale un aviso. */
#aviso-impresion{display:none}
@media print{
  body:not(.imprimiendo) #app,
  body:not(.imprimiendo) #panel,
  body:not(.imprimiendo) #modales{display:none !important}
  body:not(.imprimiendo) #aviso-impresion{display:block;padding:40mm 20mm;text-align:center;
    font-family:var(--body);color:#0A1418}
  body:not(.imprimiendo) #aviso-impresion h2{font-family:var(--disp);font-size:17pt;font-weight:600;margin-bottom:6mm}
  body:not(.imprimiendo) #aviso-impresion p{font-size:11pt;line-height:1.8;color:#48606A;max-width:130mm;margin:0 auto}
  .rail,.topbar,.no-print{display:none !important}
  #app{display:block;height:auto}
  body{background:#fff}
  .tarjeta{box-shadow:none;border:1px solid #ccc;break-inside:avoid}
  .ficha{background:#fff;color:#000;border:1px solid #ccc}
  .ficha-num,.ficha-datos div .d{color:#000}
  .ficha .curvas{display:none}
}

