/* ===========================================================================
   EL INFORME EN PAPEL

   Va aparte del estilo de pantalla porque no comparte casi nada: aquí no hay
   colores de fondo, ni sombras, ni botones. Manda la legibilidad sobre papel
   y que quepa lo mismo que cabía en el informe de Nubelab, para que el
   paciente y su médico reconozcan la hoja.

   Los márgenes NO son una elección: los impone la hoja membretada, que trae
   el encabezado arriba y el texto legal abajo. El contenido tiene que caer
   entre los dos o se pisan.

   Los estilos del contenido están FUERA de `@media print` a propósito: así la
   previsualización en pantalla enseña exactamente lo que va a salir impreso,
   y no una aproximación. Lo único que cambia entre las dos es de dónde sale
   el fondo y qué se esconde.
   =========================================================================== */

#paraImprimir { display: none; }

/* --- El contenido de la hoja ---------------------------------------------- */
.informe {
  position: relative; z-index: 1;
  /* Arial, como el informe de Nubelab. Se comprobó abriendo un PDF suyo: las
     cuatro fuentes que lleva dentro son ArialRegular, ArialBold, ArialItalic
     y ArialBoldItalic, ninguna serif. En cuerpo 8,5 pt y sobre papel, una
     seca se lee bastante mejor que Times, y era lo que Iralis notaba:
     «las letras de ellos se ven mejor que las de nosotros» (10/09/2026). */
  font-family: Arial, Helvetica, sans-serif;
  /* 10 pt, no 8,5. Medido dentro del PDF de Nubelab: su cuerpo de tabla es
     Arial a 18 unidades de un espacio escalado 0,75 x 0,8002 = 10,8 pt, con
     un paso entre filas de 17,4 pt. Nosotros íbamos a 8,5 con filas de 14,3, y
     por eso «sus letras se ven mejor» (Iralis, 10/09/2026): no era la fuente,
     era el tamaño.

     10 y no 10,8 porque ellos imprimen en A4 (595 x 842 pt) y nosotros en
     carta (612 x 792): la hoja nos da 50 pt menos de alto, así que el mismo
     cuerpo no cabría. */
  font-size: 10.8pt; line-height: 1.15; color: #000;
}

/* --- Los datos del paciente ------------------------------------------------ */
.informe .datos-paciente { position: relative; margin-bottom: 4mm; }
.informe .datos-paciente table { width: 100%; border-collapse: collapse; }
.informe .datos-paciente td {
  /* Medido en el PDF de Nubelab: 10,8 pt en REGULAR (los rótulos no van en
     negrita), tres líneas con 13,8 pt de paso, y cada dato en su línea sin
     partirse. Las columnas arrancan en x=34, x=194 y x=334 de 595 pt: el 5,7,
     el 32,6 y el 56,1 % del ancho de la hoja. */
  padding: .3mm 0; font-size: 10.8pt; vertical-align: top; line-height: 1.15;
  white-space: nowrap;
}
/* Un hueco entre columna y columna. Sin esto, un nombre largo llegaba pegado
   al rótulo de al lado y se leía «GENESIS YERLING REYES PERDOMOEdad: 37 años»
   (orden 10233, 18/09/2026, después de traer de Nubelab el nombre completo). */
.informe .datos-paciente td:not(:last-child) { padding-right: 4mm; }
/* Y el nombre, que es el único que puede ser muy largo, se parte en dos
   líneas antes que invadir la columna de al lado. Los demás datos siguen sin
   partirse, que es como los saca Nubelab. */
.informe .datos-paciente td:nth-child(1) { width: 29%; white-space: normal; }
.informe .datos-paciente td:nth-child(2) { width: 26%; }
.informe .datos-paciente td:nth-child(3) { width: 45%; }

/* Envíos por partes: el PDF de un anexo lo dice en cada hoja, bajo los datos
   del paciente (Jean, 27/09/2026). Azul de la casa y con borde, para que se
   vea también impreso en blanco y negro. */
.informe .linea-anexo {
  margin: -1.5mm 0 4mm; padding: 1.6mm 3mm; border: .35mm solid #1C5296; border-radius: 1.5mm;
  background: #EEF4FB; color: #1C5296; font-size: 10pt; line-height: 1.3;
}
.informe .linea-anexo b { letter-spacing: .08em; }
.informe .datos-paciente b { font-weight: normal; }

/* El QR va en la ESQUINA de arriba a la derecha, no metido entre los datos del
   paciente. Medido en el PDF de Nubelab: su imagen ocupa 78 x 78 pt (27,5 mm)
   con la esquina en x=502,3 y=15 de una hoja de 595 x 842 — es decir, a 5,3 mm
   del filo de arriba y a 5,2 mm del de la derecha (Iralis, 10/09/2026: «el qr
   en nubelab va arriba en la esquina»). */
.informe .qr {
  /* Medido desde el FILO DE LA HOJA, que es como está en el PDF de Nubelab:
     5,3 mm del borde de arriba y 5,2 mm del de la derecha. `.informe` lleva el
     margen de papel como relleno, así que su caja llega hasta el filo y estas
     dos medidas se cuentan desde ahí. */
  position: absolute; top: 5.3mm; right: 5.2mm;
  /* La caja es más ancha que el QR a propósito: «Resultados Online» a 10,8 pt
     mide unos 30 mm y en 28 se partía en dos líneas. En el PDF de Nubelab va
     en una sola, arrancando en el borde izquierdo del QR. */
  width: 34mm; margin-right: -3mm; text-align: center; white-space: nowrap;
}
.informe .qr svg { width: 27.5mm; height: 27.5mm; display: block; margin: 0 auto; }
.informe .qr span { font-size: 10.8pt; display: block; margin-top: .6mm; }  /* medido: 10,8 pt */

/* --- Cada examen ------------------------------------------------------------ */
/* Un examen no se parte entre dos hojas si se puede evitar: media hematología
   en cada página es incómoda de leer y parece un error. */
/* 1,5 mm entre un examen y el siguiente. En el PDF de Nubelab, de la última
   raya de una tabla a la primera de la siguiente hay 22,8 pt —y ahí dentro
   cabe el título del examen—; con 2,5 mm nos salían 30,1. */
.informe .examen-informe { margin-bottom: 1.5mm; break-inside: avoid; }
.informe .examen-informe.pagina-propia { break-before: page; }

.informe .titulo-examen {
  margin: 0 0 1.2mm; text-align: center;
  font-size: 9.5pt; font-weight: bold; letter-spacing: .3px;
}

/* --- Las gráficas del contador ---------------------------------------------
   Como en el informe de Nubelab, medido sobre un PDF real: las tres APILADAS
   en una columna al costado derecho de la tabla del hemograma, de unos
   32 × 17 mm y separadas 8 mm. Arriba RBC, en medio PLT, abajo WBC.

   Van FUERA DEL FLUJO (`position: absolute`) a propósito, y no flotadas: el
   paginador reparte la tabla fila por fila, y una gráfica flotando se llevaría
   por delante ese reparto. Así la columna se cuelga del costado de su examen y
   la tabla solo tiene que dejarle el hueco con `padding-right`.

   `.examen-informe` ya lleva `break-inside: avoid`, así que la tabla y sus
   gráficas van juntas a la misma hoja mientras quepan. */
.informe .examen-informe.con-graficas { position: relative; }
/* Centradas a lo alto de la tabla y a lo ancho de su columna, como en el
   informe de Nubelab. Van FUERA DEL FLUJO a propósito: el paginador reparte la
   tabla fila por fila, y algo metido dentro de una celda se llevaría por
   delante ese reparto. Las celdas de la columna `Histograma` van vacías y
   estas imágenes se pintan encima. */
.informe .graficas-equipo {
  position: absolute; top: 50%; right: 0; transform: translateY(-50%);
  /* EL MISMO ANCHO que su columna, en porcentaje y no en milímetros: así no
     puede desbordarse por la izquierda pase lo que pase con la hoja, que es lo
     que las hacía pisar los rangos. */
  width: 24.6%; display: flex; flex-direction: column; align-items: center;
  /* En el PDF de Nubelab las tres están en x=448,3 con 90 x 47,4 pt cada una,
     y sus topes en y=287,5 / 342,7 / 397,9: 55,2 pt de paso, o sea 7,8 pt de
     aire entre una y otra. */
  gap: 2.75mm;
}
.informe .graficas-equipo img {
  width: 31.8mm; height: auto; display: block;
}
.informe .titulo-area {
  margin: 0 0 1.2mm; text-align: center;
  font-size: 9.5pt; font-weight: bold; letter-spacing: .3px;
  text-decoration: underline;
}

.informe table.resultados {
  width: 100%;
  /* `separate` y no `collapse`, A PROPÓSITO y por dos motivos:
     · Nubelab dibuja cada raya POR CELDA, y entre columna y columna deja
       1,2 pt de hueco (medido: los segmentos van 34,2→177,6, 178,8→222,0…).
       Con `border-spacing: 1.2pt 0` sale idéntico.
     · Con `collapse`, pdf.js resolvía la raya del grupo a lo ancho de la fila
       entera y la pintaba cruzando la columna del histograma: era la «línea
       negra detrás del histograma» (y=315,7 en nuestro PDF, atravesando la
       primera gráfica). Por celda, esa columna simplemente no lleva raya. */
  border-collapse: separate; border-spacing: 1.2pt 0;
}
.informe table.resultados thead th {
  font-size: 11.4pt; font-weight: bold; text-align: center;
  padding: .8mm 2mm;
  border-top: .4pt solid #000; border-bottom: .4pt solid #000;
}
.informe table.resultados thead th.parametro { text-align: center; }
.informe table.resultados tbody td {
  /* El paso de fila de Nubelab, medido raya a raya en una hoja llena suya
     (HERMINIA FALCÓN, página 3): **16,8 pt** clavados en las filas normales y
     19,8 en las que llevan flecha, que es más alta.

     La cuenta para clavarlo: 10,8 pt de letra por 1,15 de línea son 12,4 pt de
     texto, más 0,4 de la raya, dejan 4,0 para el relleno — 2,0 arriba y 2,0
     abajo, o sea 0,7 mm. Con 0,8 mm salían 17,7 y sobre veintitantas filas eso
     es una fila entera de más por hoja. */
  padding: .7mm 1.5mm; font-size: 10.8pt; vertical-align: middle;
  text-align: center;
}
/* CON líneas entre filas. Aquí decía lo contrario —«el informe de Nubelab
   tampoco las tiene»— y era falso: en su PDF cada fila va separada por una
   raya fina, y la columna de histogramas por una vertical. Corregido el
   10/09/2026 mirando el informe de verdad. */
.informe table.resultados tbody td { border-bottom: .3pt solid #B9C2CC; }
.informe table.resultados tbody tr:last-child td { border-bottom: .4pt solid #000; }

/* LOS ANCHOS TIENEN QUE SUMAR 100. Antes eran 34+13+12+22 % más una columna
   de 42 mm: 104 y pico. El navegador reparte lo que se pasa encogiendo la
   última, así que la columna del histograma quedaba más estrecha de lo pedido
   y las imágenes —que van fuera del flujo con su propio ancho— se salían por
   la izquierda y pisaban los rangos (Iralis, 10/09/2026: «todavía se ven
   pisados»). Ahora son porcentajes y suman justo 100 en los dos casos.

   Las proporciones salen de medir la tabla en el informe de Nubelab: el
   nombre del analito ocupa poco más de una cuarta parte, no un tercio, y por
   eso allá el valor cae más cerca del nombre («estás dejando mucho espacio
   entre las letras de la primera columna y el valor»). */
/* LAS COLUMNAS SE REPARTEN SOLAS, sin anchos fijos. Es lo que hace Nubelab, y
   se ve midiendo las rayas de sus tablas: CADA UNA tiene sus propias medidas,
   según lo que le toque escribir.

       tabla                        Parám.  Valor  Unidad  Referencia
       hemograma de JEREMY           143,4   43,2    81,6      121,2
       uroanálisis de JEREMY         129,6   99,0    75,0      104,4
       ESTHER COLINA (una prueba)    216,7   72,6    90,0      142,2
       HERMINIA FALCÓN (quince)      198,7   73,2    93,0      156,6

   En el hemograma la columna del valor es la MÁS ESTRECHA de todas —son
   números de cuatro cifras— y en el uroanálisis mide más del doble, porque
   ahí dice «NO SE OBSERVAN». Con porcentajes fijos eso no se puede tener a la
   vez: o le sobra sitio al hemograma, o se parte en dos líneas el uroanálisis.
   Nos pasaba lo segundo: dos filas de 29,6 pt donde Nubelab tiene 16,8, y eran
   las que empujaban el uroanálisis a una tercera hoja.

   `width: 100%` en el parámetro no es un ancho: en una tabla de reparto
   automático es la manera de decirle «a esta columna dale todo lo que sobre».
   Las demás se quedan con lo justo de su contenido, como allá. */
.informe table.resultados { table-layout: auto; }
/* El valor, la unidad y el rango NUNCA se parten en dos renglones: son un
   número, una abreviatura y un «4.0 - 10.0». Partirlos dobla la altura de la
   fila, y con eso se pierde media hoja.
   Esto es además lo que hace que el reparto automático funcione: al no poder
   estrecharse, esas tres columnas se quedan con lo justo que necesitan y el
   sobrante va al nombre del analito, que es la única que sí puede envolver.
   (Sin esto, el navegador estrujaba el rango a 49 pt y se partían TODAS las
   filas: 31,1 pt por fila en vez de 16,8.) */
.informe th.valor, .informe td.valor,
.informe th.unidad, .informe td.unidad,
.informe th.rango, .informe td.rango { white-space: nowrap; }
/* Menos el texto de referencia largo que escribió el laboratorio, que va en
   varias líneas a propósito («ADULTOS: … / NIÑOS: …»). */
.informe td.rango .rango-texto { white-space: normal; }
/* La única con ancho fijo es la del histograma: sus celdas van VACÍAS —la
   imagen se pinta encima, fuera del flujo— así que el reparto automático la
   dejaría en nada. 24,6 % es lo que mide en el PDF de Nubelab. */
.informe th.histograma, .informe td.histograma { width: 24.6%; min-width: 38mm; }
/* Y el nombre del examen casi pegado al borde de su columna: en el PDF de
   ESTHER COLINA la «H» de «HCG CUALITATIVA…» está en x=36, a 1,8 pt del inicio
   de la tabla (34,2). */
.informe table.sueltos td.parametro { padding-left: 1mm; padding-right: .5mm; }

/* NINGUNA RAYA VERTICAL. Esto lo tenía mal: le había puesto un `border-left` a
   la columna del histograma, y en el PDF de Nubelab **no hay ni una sola raya
   vertical** — se buscaron todas las que dibuja y son 67, todas horizontales.
   La línea que se ve entre el rango y el histograma no está dibujada: es el
   sitio donde TERMINAN las rayas de fila, que no entran en esa columna. Eso es
   justo lo que decía Iralis («las líneas llegan hasta allí, en el histograma
   no tienen»), y sale solo con no pintar el borde de abajo ahí. */
.informe table.resultados tbody td.histograma { border-bottom: none; }
.informe table.resultados tbody tr:last-child td.histograma { border-bottom: .4pt solid #000; }

/* El nombre del analito es lo único que NO se centra: es texto de largos
   distintos, y centrarlo deja al ojo sin un borde por donde bajar la lista. En
   el informe de Nubelab también va pegado a la izquierda.

   El selector va con `table.resultados tbody` entero y no `.informe
   td.parametro` a secas porque la regla de arriba, que centra todas las
   celdas, tiene MÁS peso —dos clases y tres etiquetas contra dos y una— y le
   ganaba aunque esté escrita antes. */
.informe table.resultados tbody td.parametro { text-align: left; }
/* El TÍTULO de la columna sí va centrado, como los demás: en el PDF de
   Nubelab «Parámetro» cae en el centro de su columna. Solo los nombres de los
   analitos, debajo, van a la izquierda. */
.informe table.resultados thead th.parametro { text-align: center; }
.informe td.parametro { padding-left: 4mm; }
.informe td.valor  { font-variant-numeric: tabular-nums; }
.informe td.unidad { font-size: 10.8pt; }
.informe td.rango  { font-size: 10.8pt; }
/* La celda lleva las dos cosas del papel de Nubelab: primero el rango que
   aplica a este paciente, en negrita, y debajo el texto de referencia que
   escribió el laboratorio, algo más pequeño para que no le robe el ojo. */
.informe td.rango .rango-texto { font-size: 9pt; line-height: 1.25; }
.informe td.valor.vacio { color: #666; }

/* Las agrupaciones dentro de un examen (LINEA BLANCA / ROJA…) */
/* Los rótulos de grupo (LINEA BLANCA / ROJA / PLAQUETARIA) van a la
   izquierda, como en el informe de Nubelab. Mismo motivo de peso que en
   `.parametro`: hay que nombrar la tabla entera para ganarle al centrado. */
.informe table.resultados tbody tr.fila-grupo td {
  padding-top: 1.2mm; padding-left: 2mm;
  font-style: italic; font-weight: bold; font-size: 10.8pt;
  text-decoration: underline;
  text-align: left;
  /* La raya del grupo va DEBAJO del rótulo, no encima. En el PDF de Nubelab
     las rayas de ancho completo caen en y=223,9 (bajo LINEA BLANCA), 314,5
     (bajo LINEA ROJA) y 461,5 (bajo LINEA PLAQUETARIA): cada grupo cierra con
     su raya y los datos empiezan debajo. Antes la teníamos ENCIMA y salía
     pegada a la raya de la fila anterior, doblada. */
  border-top: none;
  border-bottom: .4pt solid #000;
}
/* …y no entra en la columna de las gráficas. En Nubelab esa raya sí mide la
   tabla entera, pero las imágenes se pintan después y la tapan; aquí no se
   dibuja, que es lo que pidió Iralis («quítale esas líneas negras que están
   detrás del histograma», 10/09/2026). */
.informe table.resultados tbody tr.fila-grupo td.histograma { border-bottom: none; }

/* Lo que se sale del rango: en negrita, con su flecha, y el rango también en
   negrita para que se vea contra qué se está comparando. Lo que está dentro
   no lleva NADA — así el ojo cae solo en lo que hay que mirar. */
/* Lo que se salió del rango: el valor Y su rango, en negrita y un punto más
   grandes. Medido en el PDF de Nubelab: las filas normales llevan ArialRegular
   a 10,8 pt y las que se salen ArialBold a 11,4. Es la única diferencia de
   tamaño que hay en toda la tabla, y es la que hace que el ojo caiga ahí. */
.informe td.valor.fuera, .informe td.rango.fuera { font-weight: bold; font-size: 11.4pt; }
/* La flecha «(↑)» «(↓)» es texto, en línea y del color del valor. Se fuerza
   todo porque estilo.css tiene un `.flecha` para la pantalla de resultados
   (cuadradito de 16 px con texto BLANCO) que alcanzaba a este `<span>` en la
   vista previa y en el PDF impreso desde la app: las flechas salían
   invisibles sobre el papel (REVISION-E #1). Más específico que el suyo. */
.informe td .flecha {
  display: inline; width: auto; height: auto; min-width: 0; min-height: 0;
  padding: 0; margin: 0; border: 0; border-radius: 0;
  background: none; color: inherit; font: inherit; font-size: 8pt;
  place-items: unset; vertical-align: baseline;
}
.informe td.valor.fuera .flecha { font-size: 8pt; }

.informe .leyenda {
  margin: 3mm 0 0; font-size: 9.6pt; font-style: italic; text-align: center;  /* medido: ArialItalic a 9,6 pt */
}

/* El pie que pide la configuración («Este resultado debe ser interpretado
   por un médico idoneo»). Va aparte del texto legal de la hoja membretada. */
.informe .pie-config {
  margin: 4mm 0 0; font-size: 8pt; font-style: italic; text-align: center;
}

/* Cada área en su propia página, cuando la configuración lo pide */
@media print {
  .informe .salto-pagina { break-before: page; }
}
/* En la vista previa (una tira continua) el corte se enseña con una línea
   discontinua y su rótulo: así se sabe dónde va a cortar la impresora. */
body.previsualizando .informe .salto-pagina {
  border-top: 1px dashed #9AA8B6;
  margin-top: 8mm; padding-top: 8mm;
  position: relative;
}
body.previsualizando .informe .salto-pagina::before {
  content: 'salto de página';
  position: absolute; top: -7px; left: 50%; transform: translateX(-50%);
  background: #fff; padding: 0 8px;
  font-family: system-ui, sans-serif; font-size: 8px; font-style: normal;
  letter-spacing: 1px; text-transform: uppercase; color: #7A8896;
}
.informe .metodo, .informe .obs { margin: 1.5mm 0 0; font-size: 8pt; line-height: 1.3; }
.informe .obs { font-style: italic; }
/* La observación de un examen, debajo de su tabla; en la tabla que junta los
   de un analito («QUÍMICA SANGUÍNEA») lleva delante el nombre del examen
   (PRUEBAS-1 M7). */
.informe .obs-examen-informe { padding-left: 4mm; }
.informe .obs-examen-informe b { font-style: normal; font-weight: bold; }

/* --- La firma --------------------------------------------------------------- */
/* En el teléfono va centrada y a continuación del contenido; en el PAPEL va
   en cada hoja, bajo el contenido y a la derecha, como en el PDF de Nubelab
   (ver «LAS HOJAS», más abajo). */
.informe .firma {
  margin-top: 10mm; text-align: center; break-inside: avoid;
  display: flex; flex-direction: column; align-items: center; gap: .6mm;
}
/* El margen negativo pegaba la imagen al nombre para que no quedara el hueco
   blanco que trae el recorte del escaneo. Pero la rúbrica de la licenciada
   baja por la derecha y se comía la primera letra de «Lic. Katherin Urbáez C.»
   (Iralis, 17/09/2026, con el informe delante). Se sube la firma: queda medio
   milímetro de solape en vez de dos, que es el hueco justo del recorte. */
/* 313 · `--firma-escala` (Configuración → Firmantes, 50–200 %): 1 = como siempre */
.informe .firma img { height: calc(16mm * var(--firma-escala, 1)); margin-bottom: -0.5mm; }
.informe .firma b { font-size: 9.5pt; }
.informe .firma span { font-size: 8pt; }
.informe .firma .folio { font-size: 7.5pt; }

/* ===========================================================================
   AL IMPRIMIR
   =========================================================================== */
/* El papel es CARTA, no A4. No es una preferencia: la hoja membretada mide
   1700×2228 px, o sea una proporción de 0,763, y la de Carta es 0,774
   mientras que la de A4 es 0,707. Forzarla a A4 la deformaría, y se notaría
   en el logo. Carta es además el papel que se usa en la zona. */
:root {
  --papel-ancho: 216mm;
  --papel-alto:  279mm;
  /* El hueco que deja el membrete: arriba llega hasta los 34 mm (logo,
     nombre, dirección, teléfono y correo) y abajo el texto legal empieza
     sobre los 258 mm. El contenido vive entre los dos. */
  --papel-arriba: 40mm;
  /* 22 mm, MEDIDOS sobre la propia imagen del membrete y no a ojo. Se dibujó
     `marca/hoja-membretada.png` en un lienzo y se miró fila por fila dónde
     tiene tinta. En puntos de hoja carta (792 de alto):

         15 → 103   el encabezado (logo y nombre de la clínica)
        104 → 736   LIMPIO
        737 → 743   «Este informe no debe reproducirse…»
        750 → 755   «Consulte a su médico»
        763 → 791   la franja de color con el cuadrito del número de hoja

     O sea que se puede escribir hasta 736 pt. Con 32 mm parábamos en 701 y
     dejábamos 35 pt de hoja buena sin usar en CADA página; 22 mm dejan el
     límite en 730, con 7 pt de aire antes del texto legal.

     (El 10/09/2026 puse 32 mm justificándolo con que el texto legal empezaba
     en 697. Me lo inventé: no lo había medido. Está en 737.)

     OJO: este valor NO es el que manda. `aspectoDe` de `app/informe.js` lo
     vuelve a escribir encima con `aplicarAspecto` justo antes de paginar, así
     que si se cambia aquí y no allá, no pasa nada — y cuesta media hora
     entender por qué. Los dos tienen que decir lo mismo. */
  --papel-abajo:  22mm;
  /* 12 mm, no 17. Medido en el PDF de Nubelab: su tabla va de x=34,2 pt a
     x=560,5 sobre una hoja de 595, o sea 12,1 mm de margen a cada lado. Con
     17 la tabla perdía 10 mm de ancho y las columnas se apretaban. */
  --papel-lados:  12mm;
}

@media print {
  /* Mientras se imprime, la aplicación desaparece y solo queda la hoja */
  body.imprimiendo > *:not(#paraImprimir) { display: none !important; }
  body.imprimiendo #paraImprimir { display: block; }
  body.imprimiendo { background: #fff; margin: 0; }

  @page {
    size: letter portrait;
    margin: 0;    /* el margen lo pone la hoja membretada, no la impresora */
  }

  /* EL MISMO MARGEN DE SEGURIDAD QUE EL PDF (`SEGURO` en app/pdf.js).
     Imprimiendo desde aquí, `margin: 0` le pide a la impresora que pinte de
     filo a filo, y eso no lo sabe hacer casi ninguna: se comen los últimos
     milímetros, que es justo donde está el pie del membrete con su número de
     página (Iralis, 20/09/2026: «me pica abajo un poquito y a la derecha
     abajo»). Encogiendo un 3 % y centrando, el membrete llega entero.

     Se hace con `transform` y no cambiando el tamaño de `.pagina`: las
     posiciones del diseño están medidas en milímetros contra la hoja
     membretada —el cuadrito del número está en 206,1 mm— y achicando la caja
     dejarían de coincidir. El `transform` encoge el dibujo entero sin mover
     nada de sitio.

     Solo aquí dentro, en `@media print`: `pdfDeHojas` mide en pantalla, donde
     esta regla no existe, así que el PDF no se encoge dos veces. */
  #paraImprimir .pagina {
    transform: scale(.97);
    transform-origin: 50% 50%;
  }

  /* (Las reglas de la versión sin paginar —fondo `fixed`, firma absoluta
     abajo a la izquierda— se quitaron el 05/09/2026: `paginar()` corre
     siempre y las hojas se pintan con `.pagina`, más abajo.) */
}

/* ===========================================================================
   LA ETIQUETA DE LA MUESTRA
   57 × 27 mm, la medida del rollo que ya compran. Una etiqueta por hoja de
   impresión, que es como funcionan las impresoras de etiquetas.
   =========================================================================== */

#paraEtiquetas { display: none; }

.etiqueta {
  /* La medida sale de `--et-ancho` / `--et-alto`, que las pone `etiqueta.js`
     con lo que haya configurado ESTE computador (Configuración → Impresoras).
     Sin nada configurado valen las de siempre, 57 × 27 mm. */
  width: var(--et-ancho, 57mm); height: var(--et-alto, 27mm);
  padding: 1.5mm 2mm;
  box-sizing: border-box;
  display: flex; flex-direction: column; justify-content: space-between;
  font-family: Arial, Helvetica, sans-serif; color: #000;
  overflow: hidden;
  /* Con nombre propio: si no, heredaría el tamaño carta del informe y cada
     etiqueta saldría sola en medio de una hoja. */
  page: etiqueta;
  break-after: page;
}
.etiqueta:last-child { break-after: auto; }

/* Como la de Nubelab, igualita: todo en NEGRITA y CENTRADO, tres líneas que
   se parten donde haga falta, y el texto con la etiqueta entera para él. */
.et-texto {
  flex: 1; min-height: 0; overflow: hidden;
  display: flex; flex-direction: column; justify-content: center;
  text-align: center; font-weight: bold; line-height: 1.2;
}
.et-linea1 { font-size: 8.5pt; }
.et-pedidos { font-size: 8pt; }
.et-orden { font-size: 8.5pt; }
.et-urgente {
  font-size: 6.5pt; padding: 0 1mm;
  border: .5pt solid #000; border-radius: 1mm;
}
/* «PRUEBA» delante del nombre en las órdenes de la sede de pruebas.
   Era letra blanca sobre fondo negro, y el navegador NO imprime fondos salvo
   que se le pida: en el papel salía blanco sobre blanco, o sea nada. Y es la
   única señal que distingue el tubo de una orden de prueba del de un paciente
   de verdad. Ahora la marca es el recuadro, igual que `.et-urgente` de aquí
   arriba, que sí se imprime siempre; el relleno se pide aparte y si el driver
   lo respeta, mejor, pero ya no depende de él.
   (Revisión de interfaz, 12/09/2026.) */
.et-prueba {
  padding: 0 1mm; border: 1pt solid #000; border-radius: 1mm;
  font-weight: bold; letter-spacing: .3pt;
}

@media print {
  body.imprimiendo-etiquetas > *:not(#paraEtiquetas) { display: none !important; }
  body.imprimiendo-etiquetas #paraEtiquetas { display: block; }
  body.imprimiendo-etiquetas { background: #fff; margin: 0; }
}
@page etiqueta { size: 57mm 27mm; margin: 0; }

/* Verlas a tamaño real antes de gastar rollo. Se pintan sobre gris con un
   borde punteado, para que se vea dónde acaba la etiqueta y qué queda fuera. */
body.previsualizando-etiquetas #paraEtiquetas {
  display: flex; flex-wrap: wrap; gap: 14px; justify-content: center;
  align-content: flex-start;
  position: fixed; inset: 0; z-index: 300;
  overflow: auto; background: #6B7B8C; padding: 74px 20px 30px;
}
body.previsualizando-etiquetas .etiqueta {
  background: #fff; border: 1px dashed #9AA8B6; flex: none;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .3);
}
body:not(.previsualizando-etiquetas) .previa-barra.etiquetas { display: none; }
@media print { .previa-barra.etiquetas { display: none !important; } }

/* CUÁNTAS COPIAS DE CADA ETIQUETA (Iralis, 21/09/2026: «casi siempre se
   imprime más de 1 etiqueta… la edito y pongo 3 e imprime 3 copias»). Va en la
   barra, entre el rótulo y los botones, porque es una decisión de ESTA tanda y
   no de la sede: se mira, se cambia y se imprime sin salir de aquí.

   Es un `<label>` y no un `<span>` a propósito: en el teléfono la barra
   esconde sus `> span` para que quepan los botones, y esta casilla tiene que
   quedarse — es justo donde más cuesta volver a abrir la previa. */
.previa-barra.etiquetas .etiqueta-copias {
  display: inline-flex; align-items: center; gap: 7px;
  font-weight: 700; white-space: nowrap;
}
.previa-barra.etiquetas .etiqueta-copias input {
  width: 62px; height: 32px; padding: 0 6px;
  border: 1.5px solid rgba(255, 255, 255, .5); border-radius: var(--radius-sm, 11px);
  background: #fff; color: var(--primary, #113458);
  font-family: inherit; font-size: .9rem; font-weight: 700; text-align: center;
  font-variant-numeric: tabular-nums;
}
.previa-barra.etiquetas .etiqueta-copias input:focus-visible {
  outline: 2px solid #fff; outline-offset: 1px;
}

/* ===========================================================================
   EL COMPROBANTE DE PAGO
   Media carta, centrado: el recibo que se le da al paciente al cobrar, con
   el logo de facturación y el RIF (J-50146022-1) que usaba Nubelab.
   =========================================================================== */

/* ===========================================================================
   HOJA DE TRABAJO (informe operativo): vista previa e impresión en carta
   =========================================================================== */
#paraHoja { display: none; }
body.previsualizando-hoja > *:not(#paraHoja) { display: none !important; }
body.previsualizando-hoja #paraHoja { display: block; }
body.previsualizando-hoja { background: #e9edf1; margin: 0; }
.previa-barra.hoja-papel {
  position: sticky; top: 0; z-index: 5; display: flex; align-items: center; gap: 10px;
  padding: 10px 16px; background: #0f2540; color: #fff; font-weight: 700;
}
.previa-barra.hoja .crece { flex: 1; }
.hoja-papel {
  width: 216mm; min-height: 279mm; margin: 16px auto; padding: 14mm 14mm 16mm;
  background: #fff; color: #111; font: 10.5pt/1.35 system-ui, sans-serif;
  box-shadow: 0 6px 30px rgba(0,0,0,.18);
}
.hoja-cab { border-bottom: 2px solid #0f2540; margin-bottom: 8mm; padding-bottom: 3mm; }
.hoja-cab h1 { font-size: 16pt; margin: 0 0 2px; color: #0f2540; }
.hoja-cab p { margin: 0; color: #555; font-size: 9.5pt; }
.hoja-area { margin-bottom: 7mm; break-inside: avoid-page; }
.hoja-area h2 {
  font-size: 11.5pt; margin: 0 0 3px; color: #0f2540; letter-spacing: .5px; text-transform: uppercase;
  border-bottom: 1px solid #b7c2ce; padding-bottom: 2px;
}
.hoja-area h2 small { color: #777; font-weight: 500; margin-left: 6px; }
.hoja-papel table { width: 100%; border-collapse: collapse; font-size: 9.5pt; }
.hoja-papel th { text-align: left; font-size: 8pt; text-transform: uppercase; letter-spacing: .4px; color: #666; padding: 3px 4px; border-bottom: 1px solid #ccc; }
.hoja-papel td { padding: 4px 4px; border-bottom: 1px solid #e3e7eb; vertical-align: top; }
.hoja-papel tr.urgente td { background: #fff4ec; }
.hoja-papel td small { color: #666; font-size: 8pt; }
.hoja-papel td small.urg { color: #c2410c; font-weight: 800; }
.hoja-papel td small.obs { color: #444; font-style: italic; }
.hoja-ex {
  display: inline-block; border: 1px solid #b7c2ce; border-radius: 4px; padding: 0 4px;
  font-size: 8.5pt; font-weight: 700; margin: 1px 0; color: #0f2540;
}
.hoja-ex small { font-weight: 500; color: #777; }
/* En blanco y negro estos dos eran el MISMO gris: el verde daba 91 y el azul
   83 sobre 255, y los bordes 194 contra 193. En una impresora monocroma
   «validada» y «referida» no se distinguían. El color se queda para quien
   imprima a color, pero lo que las separa ahora es la forma del recuadro:
   validada lleva el borde grueso y entero, referida lo lleva a rayas, y lo que
   está por hacer sigue con el borde fino gris de arriba. Es la misma idea que
   ya funciona en el informe —marcar sin depender del color—.
   (Revisión de interfaz, 12/09/2026.) */
.hoja-ex.validada { color: #1a7f4b; border-color: #1a7f4b; border-width: 1.5px; }
.hoja-ex.referida { color: #1d5fa6; border-color: #1d5fa6; border-style: dashed; }
.hoja-papel th.hecho, .hoja-papel td.hecho { text-align: right; white-space: nowrap; width: 1%; }
.hoja-papel .casilla { display: inline-block; width: 11px; height: 11px; border: 1.5px solid #444; margin: 2px 1px; vertical-align: middle; }
.hoja-vacia { text-align: center; color: #666; padding: 20mm 0; }
@media print {
  body.imprimiendo-hoja > *:not(#paraHoja) { display: none !important; }
  body.imprimiendo-hoja #paraHoja { display: block; }
  body.imprimiendo-hoja { background: #fff; margin: 0; }
  body.imprimiendo-hoja .previa-barra { display: none !important; }
  body.imprimiendo-hoja .hoja-papel { box-shadow: none; margin: 0; width: auto; min-height: 0; padding: 0; }
}

#paraComprobante { display: none; }
.comprobante.remision .cmp-lineas th { text-align: left; font-size: 8pt; text-transform: uppercase; color: #666; border-bottom: 1px solid #999; }
.rem-firmas { display: flex; justify-content: space-between; margin: 12mm 0 4mm; font-size: 9pt; }

.comprobante {
  width: 110mm; margin: 0 auto; padding: 8mm 6mm;
  font-family: Arial, Helvetica, sans-serif; font-size: 9pt; color: #000;
  text-align: center;
}
.cmp-logo { max-width: 52mm; max-height: 18mm; object-fit: contain; }
.cmp-fiscal { display: flex; flex-direction: column; gap: .4mm; margin-top: 2mm; font-size: 8pt; }
.cmp-fiscal b { font-size: 9.5pt; }
.comprobante h2 {
  margin: 4mm 0 2mm; font-size: 10pt; letter-spacing: 1px;
  border-top: .5pt solid #000; border-bottom: .5pt solid #000; padding: 1.5mm 0;
}
.cmp-datos {
  display: grid; grid-template-columns: 1fr 1fr; gap: .6mm 4mm;
  text-align: left; font-size: 8.5pt; margin-bottom: 3mm;
}
.cmp-lineas, .cmp-pagos { width: 100%; border-collapse: collapse; font-size: 8.5pt; }
.cmp-lineas td, .cmp-pagos td { padding: 1mm 0; text-align: left; }
.cmp-lineas td:last-child, .cmp-pagos td:last-child { text-align: right; font-variant-numeric: tabular-nums; }
.cmp-lineas { border-bottom: .5pt solid #000; margin-bottom: 1.5mm; }
.cmp-cifras { margin: 1.5mm 0 3mm; }
.cmp-cifras > div { display: flex; justify-content: space-between; font-size: 8.5pt; }
.cmp-cifras .fuerte { font-weight: bold; font-size: 10pt; }
.cmp-pagos { border-top: .5pt dashed #000; }
/* 155 · Lo que el paciente dejo a la clinica. No es otra forma de pago: es
   una parte de las de arriba, asi que va fuera de la tabla y en letra mas
   chica. Sin este renglon el papel dice que entraron $3,50 por unos
   examenes de $3,00 y no explica el medio dolar. */
.cmp-dejado {
  display: flex; justify-content: space-between; gap: 4mm;
  font-size: 7.5pt; margin-top: 1mm; font-variant-numeric: tabular-nums;
}
.cmp-saldo {
  margin-top: 3mm; padding: 1.5mm; font-weight: bold; font-size: 9.5pt;
  border: .8pt solid #000;
}
.cmp-nota { font-size: 7.5pt; margin: 3mm 0 0; }

/* El comprobante de un cobro de varios pacientes: un bloque por orden, con
   su nombre y su total, y despues las cifras y los pagos de todos juntos.
   Todo lo demas —cabecera, cifras, pagos, saldo— es el comprobante de
   siempre y no se repite aqui. */
.cmpj-orden { margin-bottom: 2.5mm; }
.cmpj-quien {
  display: flex; justify-content: space-between; gap: 3mm;
  text-align: left; font-size: 8.5pt; padding-bottom: .8mm;
  border-bottom: .5pt dashed #000;
}
.cmpj-suyo { font-weight: bold; font-variant-numeric: tabular-nums; white-space: nowrap; }
/* Una orden anulada se sigue enseñando —estuvo en el cobro y su dinero se
   devolvio— pero en gris, para que no se lea como una que se cobro. */
.cmpj-orden.anulada { color: #666; }
.cmpj-orden.anulada .cmp-lineas { text-decoration: line-through; }
.comprobante-junto .cmp-lineas { border-bottom: 0; margin-bottom: 0; }
.cmp-gracias { font-size: 8pt; font-style: italic; margin: 3mm 0 0; }

@media print {
  body.imprimiendo-comprobante > *:not(#paraComprobante) { display: none !important; }
  body.imprimiendo-comprobante #paraComprobante { display: block; }
  body.imprimiendo-comprobante { background: #fff; margin: 0; }
}

/* ===========================================================================
   PREVISUALIZAR
   La misma hoja en pantalla, del tamaño real de una A4, para poder mirar cómo
   va a quedar sin gastar papel.
   =========================================================================== */
body.previsualizando #paraImprimir {
  display: block;
  position: fixed; inset: 0; z-index: 300;
  overflow: auto; background: #6B7B8C; padding: 26px 0;
}
body.previsualizando #paraImprimir > .hoja-fondo { display: none; }

/* La barra para cerrar la vista previa o mandar a imprimir de verdad */
.previa-barra {
  position: fixed; top: 0; left: 0; right: 0; z-index: 310;
  display: flex; align-items: center; justify-content: center; gap: 10px;
  padding: 10px; background: var(--primary); color: #fff;
  font-family: var(--font); font-size: .88rem;
}
/* Cada barra se esconde según SU propia vista previa. Sin el `:not(.etiquetas)`
   esta regla apagaba también la de las etiquetas, que tiene su propio modo. */
body:not(.previsualizando) .previa-barra:not(.etiquetas):not(.cotizacion) { display: none; }
body.previsualizando #paraImprimir { padding-top: 74px; }
/* «· sin firma por decisión de la orden» junto al título, y el botón «Sin
   firma» apagado cuando no tiene nada que alternar (PRUEBAS-1 m14) */
.previa-barra em { font-style: italic; opacity: .85; }
.previa-barra .btn:disabled { opacity: .5; cursor: not-allowed; }
@media print { .previa-barra { display: none !important; } }


/* El fondo lo decide el formato (app/informe.js → aplicarAspecto): la hoja
   membretada de la sede en el formato 3, nada en los demás.

   Van como <img>, NO como `background-image` (Iralis, 15/09/2026). El
   navegador no imprime los fondos salvo que alguien marque «Gráficos de
   fondo» en el cuadro de impresión, y el día que se le olvidara, el informe
   salía pelado: sin logo, sin los datos de la clínica y sin el pie legal, que
   en el formato 3 van todos dentro de esa imagen. Una <img> se imprime
   siempre. Las variables de CSS se quedan por si algo de pantalla las usa. */
#paraImprimir .pagina .hoja-fondo {
  position: absolute; inset: 0; z-index: 0;
  width: 100%; height: 100%; object-fit: fill;
}
/* La marca de agua de los formatos 1 y 2: centrada, a media hoja de ancho */
#paraImprimir .pagina .marca-agua {
  position: absolute; inset: 0; z-index: 0; margin: auto;
  width: 60%; height: auto; max-height: 100%; object-fit: contain;
}
#paraImprimir .pagina .informe {
  position: relative; z-index: 1;
  padding: var(--papel-arriba) var(--papel-lados) 0;
}
/* El encabezado generado (formatos 1 y 2, o 3 con «incluir encabezado») y
   la imagen de encabezado (formato 2): antes de los datos del paciente. */
.informe .encabezado-imagen { margin: -8mm calc(var(--papel-lados) * -1) 4mm; }
.informe .encabezado-imagen img { display: block; width: 100%; height: auto; max-height: 38mm; object-fit: contain; }
.informe .encabezado-informe {
  display: flex; align-items: center; justify-content: center; gap: 6mm;
  margin: 0 0 4mm; text-align: center;
}
.informe .encabezado-informe .logo { height: 19mm; width: auto; max-width: 40mm; object-fit: contain; }
.informe .encabezado-generado { display: flex; flex-direction: column; gap: .3mm; }
.informe .encabezado-generado b { font-size: 11pt; letter-spacing: .4px; }
.informe .encabezado-generado span { font-size: 8pt; letter-spacing: 1px; text-transform: uppercase; }
.informe .encabezado-generado small { font-size: 7.5pt; font-style: italic; }
/* El pie configurable de los formatos 1 y 2, al pie de cada hoja */
#paraImprimir .pagina .pie-hoja {
  position: absolute; z-index: 1; left: var(--papel-lados); right: var(--papel-lados);
  bottom: calc(var(--papel-abajo) - 9mm);
}
#paraImprimir .pagina .pie-hoja .pie-config { margin: 0; }
/* La interpretación («NORMAL», «REACTIVO») junto al valor */
.informe td.valor .interp { font-size: 7.5pt; font-style: italic; margin-left: 1mm; white-space: nowrap; }
/* El resultado anterior (`mostrar_anterior`): quinta columna, con su fecha */
.informe table.con-anterior th.parametro, .informe table.con-anterior td.parametro { width: 30%; }
.informe table.con-anterior th.valor,     .informe table.con-anterior td.valor     { width: 15%; }
.informe table.con-anterior th.unidad,    .informe table.con-anterior td.unidad    { width: 12%; }
.informe table.con-anterior th.rango,     .informe table.con-anterior td.rango     { width: 28%; }
.informe th.anterior, .informe td.anterior {
  width: 15%; display: table-cell; font-family: inherit; color: #000; font-size: 8pt;
}   /* `display`/fuente/color a propósito: estilo.css tiene un `.anterior` para la pantalla de resultados */
.informe td.anterior { font-variant-numeric: tabular-nums; color: #333; }
.informe td.anterior.fuera { font-weight: bold; }
.informe td.anterior small { display: block; font-size: 6.5pt; font-weight: normal; color: #666; }
.informe td.anterior .flecha { font-size: 7.5pt; }
/* La observación de un área entera, al final de sus exámenes. Se llama
   `obs-de-area` porque `.obs-area` es de la pantalla de resultados
   (estilo.css) y la vista previa heredaba su flex y su margen (REVISION-E #13). */
.informe .obs-de-area { display: block; margin: -1.5mm 0 3.5mm; }
.informe .obs-de-area .obs { margin: 0; padding-left: 2mm; }
/* La orden de la sede de pruebas: una franja que no se puede no ver, en
   cada hoja (va dentro de la cabecera, que se repite). Sin color de fondo
   sólido para que no se coma la tinta: borde y letra grandes bastan. */
.informe .marca-prueba {
  margin: 0 0 3mm; padding: 1.5mm 3mm; text-align: center;
  border: 1.2pt dashed #000; font-family: Arial, Helvetica, sans-serif;
  font-size: 11pt; font-weight: bold; letter-spacing: 2px;
}
.informe.de-pruebas .datos-paciente { position: relative; }
.informe.de-pruebas .datos-paciente::after {
  content: 'PRUEBA'; position: absolute; left: 0; right: 0; top: 30mm;
  text-align: center; pointer-events: none; z-index: 0;
  font-family: Arial, Helvetica, sans-serif; font-size: 72pt; font-weight: bold;
  letter-spacing: 8px; color: rgba(0, 0, 0, .07); transform: rotate(-18deg);
}
/* La firma va en cada hoja, justo debajo de lo que lleva esa hoja y a la
   derecha, como en el PDF de Nubelab. */
#paraImprimir .pagina .firma {
  position: static; margin: 3mm 0 0 auto; width: max-content; max-width: 80mm;
  display: flex; flex-direction: column; align-items: center; gap: .6mm;
  text-align: center; color: #000;
}
/* Lo mismo que arriba: la rúbrica tapaba el nombre. */
#paraImprimir .pagina .firma img { height: calc(15.9mm * var(--firma-escala, 1)); width: auto; margin-bottom: -0.4mm; }  /* medido: 45 pt (313: × la escala) */
#paraImprimir .pagina .firma b { font-size: 9.5pt; }
#paraImprimir .pagina .firma span { font-size: 8pt; }
#paraImprimir .pagina .firma .folio { font-size: 7.5pt; }
/* El número de hoja, «1/5» como en el PDF de Nubelab. Con la hoja membretada
   de siempre va DENTRO del cuadrito aguamarina del pie (medido en la imagen:
   206,1–215,7 mm de ancho, 268,7–278,2 mm de alto), en blanco. Con cualquier
   otro formato, abajo a la derecha en negro. */
#paraImprimir .pagina .pagina-num {
  position: absolute; z-index: 1;
  right: var(--papel-lados); top: 268.7mm; height: 9.5mm;
  display: grid; place-items: center;
  font-family: Arial, Helvetica, sans-serif; font-size: 8pt; font-weight: bold; color: #000;
  letter-spacing: .2px;
}
/* EN NEGRO, NO EN BLANCO (Iralis, 20/09/2026: «los números de las páginas
   ponlos en negro negro, que en blanco no se ven al imprimir porque
   imprimimos en blanco y negro»). Iba en blanco porque encima lleva el
   cuadrito aguamarina del membrete, y en la pantalla se lee perfecto; pero en
   la impresora de la clínica ese aguamarina sale gris claro, y el blanco
   sobre gris claro no se ve. En negro se lee de las dos maneras. */
#paraImprimir.numero-en-cuadrito .pagina .pagina-num {
  right: auto; left: 206.1mm; width: 9.6mm; color: #000;
}
#paraImprimir .pagina .titulo-examen small, #paraImprimir .pagina .titulo-area small {
  font-weight: normal; font-size: 8pt; color: #555;
}
/* El contenedor donde se mide: nunca se ve */
#paraImprimir .medidor .informe { padding: 0; width: auto; min-height: 0; background: none; box-shadow: none; }

body.previsualizando #paraImprimir .pagina {
  margin: 0 auto 26px; box-shadow: 0 10px 40px rgba(0, 0, 0, .45);
}

/* --- LA VISTA PREVIA EN EL TELÉFONO ----------------------------------------
   La hoja mide 816 px (una carta a 96 ppp) y el teléfono tiene 375: se salía
   por el lado derecho y la barra, con su frase larga y tres botones, ocupaba
   210 px de alto con «Imprimir» fuera de la pantalla (medido el 17/09/2026 a
   375 px). Se encoge la hoja con `scale` —no se reescribe: así el papel sigue
   siendo el mismo y lo que se ve es de verdad lo que va a salir— y la barra se
   queda en una línea con los botones. La frase sobra en un teléfono: quien
   abre la vista previa ya sabe que está en la vista previa. */
@media (max-width: 720px) {
  .previa-barra { padding: 8px 10px; gap: 8px; flex-wrap: nowrap; }
  .previa-barra > span { display: none; }
  .previa-barra .btn { padding: 7px 10px; font-size: .82rem; white-space: nowrap; }
  body.previsualizando #paraImprimir { padding: 56px 0 26px; }
  /* `--escala-previa` la pone `informe.js` al abrir: en CSS no se puede
     dividir una longitud entre otra para sacar el número que `scale` pide. */
  /* La hoja sin encoger mide 816 px dentro de una caja de 375: si el origen
     fuera el centro, se escalaría alrededor del punto 408 y la hoja acabaría
     medio fuera de la pantalla (medido: x 229-588). Desde la esquina, empieza
     donde empieza la caja. */
  body.previsualizando #paraImprimir { overflow-x: hidden; }
  body.previsualizando #paraImprimir .pagina {
    transform: scale(var(--escala-previa, 1));
    transform-origin: top left;
    margin-left: 8px; margin-right: 0;
    /* `scale` no encoge el hueco que la hoja ocupa en el flujo, así que sin
       esto quedaban cientos de píxeles en blanco entre una hoja y la
       siguiente. `--sobra-previa` es lo que hay que recuperar. */
    margin-bottom: var(--sobra-previa, 12px);
  }
}


/* ===========================================================================
   LAS HOJAS (informe paginado por app/informe.js → paginar)
   Cada .pagina es una hoja de carta con su membrete de fondo y su hueco
   arriba y abajo; el contenido ya viene repartido para que quepa. Se ve igual
   en la vista previa que impreso.
   =========================================================================== */
#paraImprimir .pagina {
  position: relative; box-sizing: border-box; overflow: hidden;
  width: var(--papel-ancho); height: var(--papel-alto);
  background: #fff;
}
@media print {
  #paraImprimir .pagina { break-after: page; page-break-after: always; margin: 0; box-shadow: none; }
  #paraImprimir .pagina:last-child { break-after: auto; page-break-after: auto; }
}

/* ===========================================================================
   LA COTIZACIÓN
   ---------------------------------------------------------------------------
   Es un papel COMERCIAL, no un resultado, y desde el 20/09/2026 se viste como
   lo que es: su propia cabecera con el logo de facturación de la clínica, la
   cenefa de colores de la marca, y al pie la cuenta donde se paga.

   POR QUÉ NO USA LA HOJA MEMBRETADA. Dos razones, las dos comprobadas:

     · El membrete del formato 3 dejó de ser un fondo de CSS y pasó a ser una
       `<img>` el 15/09 (commit 4ed1a12) para que se imprimiera sin marcar
       «Gráficos de fondo». Esa hoja la arma `paginar()` en `informe.js`; la
       cotización arma la suya y se quedó escribiendo un `<div class=
       "hoja-fondo">` vacío. Cinco días saliendo sin logo y sin colores.

     · Y aunque se arreglara: el pie de ese membrete dice «Este informe no
       debe reproducirse…» y «Consulte a su médico». En un presupuesto las dos
       frases sobran.

   LA PALETA ES LA DE LA MARCA DE VERDAD, no una elegida aquí: el marino
   #113458 y el turquesa #38B6B8 son los del logo de Laboratorio Demo y los
   mismos tokens de Cobros (ver `marca/README.md`).

   EL TURQUESA NO LLEVA TEXTO ENCIMA. Blanco sobre #38B6B8 da 2,2 de
   contraste, muy por debajo del 4,5 que pide la regla. Se usa para filetes y
   acentos; lo que lleva texto blanco va sobre el marino, que da 12,6.
   =========================================================================== */
.cotizacion-hoja {
  --cot-marino:   #113458;
  --cot-turquesa: #38B6B8;
  --cot-tinta:    #1F3F63;
  --cot-suave:    #6B7B8C;
  --cot-linea:    #D8E0E8;
  --cot-fondo:    #F4F8FB;
  /* Márgenes propios. Los 40 mm de arriba del informe son el hueco que deja
     el membrete impreso; aquí la cabecera la dibujamos nosotros y ese hueco
     sería media hoja en blanco. */
  padding: 14mm var(--papel-lados) 12mm !important;
  color: #16202B;
  /* La hoja se estira hasta el pie y la cenefa de cierre se va abajo del
     todo (`margin-top: auto`). Sin esto, una cotización de dos exámenes
     cerraba a media página y dejaba un palmo de blanco debajo de la raya,
     que es exactamente lo que hace que un papel parezca inacabado. */
  box-sizing: border-box; min-height: var(--papel-alto);
  display: flex; flex-direction: column;
  /* LOS FONDOS TIENEN QUE IMPRIMIRSE. Es la misma trampa que se llevó por
     delante el membrete el 15/09: el navegador NO imprime colores de fondo
     salvo que alguien marque «Gráficos de fondo» en el cuadro de impresión.
     Aquí el total va en marino macizo con letra blanca y la cabecera de la
     tabla también: sin esto saldrían en blanco sobre blanco, o sea vacíos,
     y nadie se enteraría hasta tener el papel en la mano.

     `print-color-adjust: exact` obliga al navegador a respetarlos. Se pone
     con el prefijo -webkit- además del estándar porque Chrome —que es lo que
     hay en la clínica— solo entiende el prefijado en versiones viejas. */
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

/* --- La cabecera: logo a la izquierda, quién emite a la derecha ------------ */
.cotizacion-hoja .cot-marca {
  display: flex; align-items: center; justify-content: space-between;
  gap: 8mm; margin-bottom: 2.5mm;
}
/* El logo es el lockup completo (marca + nombre + bajada), 1070x713. A 34 mm
   de ancho la bajada «ESPECIALIDADES MEDICAS Y ODONTOLOGICAS» todavía se lee
   impresa; más pequeño se emplasta. */
.cotizacion-hoja .cot-logo { width: 30mm; height: auto; flex: none; }
.cotizacion-hoja .cot-emisor {
  display: flex; flex-direction: column; align-items: flex-end;
  text-align: right; font-size: 8.5pt; line-height: 1.35; color: var(--cot-suave);
}
.cotizacion-hoja .cot-emisor b {
  font-size: 12pt; letter-spacing: .4pt; color: var(--cot-marino);
  text-transform: uppercase;
}
.cotizacion-hoja .cot-emisor-que {
  font-size: 8pt; letter-spacing: 1.1pt; text-transform: uppercase;
  color: var(--cot-turquesa); margin-bottom: .8mm;
}
.cotizacion-hoja .cot-emisor-rif {
  margin-top: .8mm; font-weight: bold; color: var(--cot-tinta);
  font-variant-numeric: tabular-nums;
}

/* La cenefa de cuatro tramos del pie de la hoja membretada, en filete. Es la
   firma de color de la marca: la que hace que este papel y el informe se
   reconozcan como del mismo sitio sin necesidad de leerlos. */
/* `flex: none` porque la hoja es una columna flex: sin él, la cenefa es un
   hijo más y el navegador la puede encoger hasta dejarla en nada. Pasó con la
   del pie, que se quedó en cero de alto y desapareció del papel. */
.cotizacion-hoja .cot-cenefa { display: flex; height: 1.6mm; margin-bottom: 4.5mm; flex: none; }
.cotizacion-hoja .cot-cenefa i { flex: 1; }
.cotizacion-hoja .cot-cenefa i:nth-child(1) { background: #113458; }
.cotizacion-hoja .cot-cenefa i:nth-child(2) { background: #2E6DA4; }
.cotizacion-hoja .cot-cenefa i:nth-child(3) { background: #5BA7C9; }
.cotizacion-hoja .cot-cenefa i:nth-child(4) { background: #38B6B8; }
/* El cierre —el «gracias» y la cenefa— con margen de arriba automático: se
   come el blanco que sobre y se queda pegado al pie de la hoja, tenga la
   cotización dos exámenes o veinte. */
.cotizacion-hoja .cot-cierre { margin-top: auto; flex: none; }
.cotizacion-hoja .cot-cierre .cot-cenefa { margin-bottom: 0; }

/* --- El título y el número ------------------------------------------------- */
.cotizacion-hoja .cot-titulo {
  display: flex; align-items: center; justify-content: space-between;
  gap: 8mm; margin-bottom: 4mm;
}
.cotizacion-hoja .cot-titulo h1 {
  margin: 0; font-size: 19pt; font-weight: bold; letter-spacing: 1.8pt;
  text-transform: uppercase; color: var(--cot-marino); line-height: 1;
}
.cotizacion-hoja .cot-subtitulo {
  margin: 1.2mm 0 0; font-size: 8.5pt; letter-spacing: .5pt;
  text-transform: uppercase; color: var(--cot-suave);
}
/* El número, en un sello marino: es el dato con el que el paciente vuelve y
   el que la secretaria busca, así que se encuentra sin leer la hoja. */
.cotizacion-hoja .cot-sello {
  flex: none; text-align: right; padding: 1.6mm 3.5mm;
  background: var(--cot-marino); color: #fff;
  display: flex; flex-direction: column; align-items: flex-end;
}
.cotizacion-hoja .cot-sello span {
  font-size: 7pt; letter-spacing: 1pt; text-transform: uppercase; opacity: .85;
}
.cotizacion-hoja .cot-sello b {
  font-size: 13pt; letter-spacing: .5pt; font-variant-numeric: tabular-nums;
}

/* --- A quién va, y hasta cuándo -------------------------------------------- */
/* Los cuatro datos en un panel, con el rótulo pequeño encima y el dato
   debajo: se lee de un vistazo sin buscar los dos puntos. El nombre ocupa la
   fila entera porque es el único que puede ser largo de verdad. */
/* Cuatro columnas en UNA fila, no dos filas de tres. El nombre se lleva la
   mitad del ancho —que es lo que necesita el más largo de la base— y los
   otros tres caben al lado. Medido: en dos filas este panel gastaba 118 px de
   los 1054 de una carta, y cada 26 px es un examen más que cabe en la hoja. */
.cotizacion-hoja .cot-datos {
  display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 2mm 5mm;
  margin-bottom: 4.5mm; padding: 2.5mm 3.5mm;
  background: var(--cot-fondo); border-left: 1.5pt solid var(--cot-turquesa);
}
.cotizacion-hoja .cot-datos > div { display: flex; flex-direction: column; min-width: 0; }
/* El nombre puede ser larguísimo: se parte en dos líneas antes que empujar a
   las otras columnas. Los demás datos son cortos y no se parten. */
.cotizacion-hoja .cot-datos-ancho b { overflow-wrap: anywhere; }
.cotizacion-hoja .cot-datos span {
  font-size: 7.5pt; letter-spacing: .6pt; text-transform: uppercase; color: var(--cot-suave);
}
.cotizacion-hoja .cot-datos b { font-size: 10.5pt; color: var(--cot-tinta); line-height: 1.2; }
.cotizacion-hoja .cot-datos-ancho b { font-size: 11.5pt; }

/* --- Los exámenes ---------------------------------------------------------- */
.cotizacion-hoja .cot-lineas { width: 100%; border-collapse: collapse; }
.cotizacion-hoja .cot-lineas th {
  font-size: 8pt; letter-spacing: .6pt; text-transform: uppercase;
  color: #fff; background: var(--cot-marino);
  text-align: left; padding: 1.3mm 2.5mm;
}
.cotizacion-hoja .cot-lineas td {
  font-size: 10pt; padding: 1.25mm 2.5mm; border-bottom: .4pt solid var(--cot-linea);
  vertical-align: top; line-height: 1.15;
}
/* Una fila sí y otra no, muy flojo: sobre papel basta para no saltar de
   renglón al recorrer la columna de precios con el dedo. */
.cotizacion-hoja .cot-lineas tbody tr:nth-child(even) td { background: #F7FAFC; }
.cotizacion-hoja .cot-lineas small { color: var(--cot-suave); }
.cotizacion-hoja .cot-col-cod {
  width: 26mm; font-variant-numeric: tabular-nums; color: var(--cot-suave);
}
.cotizacion-hoja .cot-lineas td.cot-col-cod { font-weight: bold; color: var(--cot-tinta); }
.cotizacion-hoja .cot-col-precio {
  width: 26mm; text-align: right; font-variant-numeric: tabular-nums;
}
/* La columna en bolívares: el equivalente, no el precio. Va en gris para que
   se lea como lo que es y no compita con la cifra en dólares. */
.cotizacion-hoja .cot-col-bs {
  width: 32mm; text-align: right; font-variant-numeric: tabular-nums; color: #4A5A6C;
}
.cotizacion-hoja .cot-lineas.con-bs .cot-col-cod { width: 22mm; }

/* --- Las cifras, pegadas a la derecha bajo la columna de precios ------------ */
.cotizacion-hoja .cot-cifras { margin: 3.5mm 0 0; margin-left: auto; width: 84mm; }
.cotizacion-hoja .cot-cifras > div {
  display: flex; justify-content: space-between; font-size: 10pt; padding: .8mm 2.5mm;
}
.cotizacion-hoja .cot-rebaja { color: #B0561F; }
/* El total, en marino macizo: es la cifra que el paciente va a recordar. */
.cotizacion-hoja .cot-total {
  margin-top: 1.2mm; padding: 2mm 2.5mm !important;
  background: var(--cot-marino); color: #fff;
  font-size: 13pt; font-weight: bold;
}
.cotizacion-hoja .cot-total-bs {
  display: flex; justify-content: space-between;
  font-size: 10.5pt; color: #4A5A6C; padding-top: 1.5mm !important;
  border-bottom: .8pt solid var(--cot-linea);
}
.cotizacion-hoja .cot-tasa {
  margin-top: 1.5mm !important; padding: 1.5mm 3mm;
  background: var(--cot-fondo); border-left: 1.5pt solid var(--cot-turquesa);
}
.cotizacion-hoja .cot-nota {
  margin: 6mm 0 0; padding: 2.5mm 3mm; font-size: 9pt;
  background: var(--cot-fondo); border-left: 1.5pt solid var(--cot-marino);
}

/* --- 162 · Dónde se paga --------------------------------------------------- */
/* Enmarcado y no suelto al pie: son cifras que alguien va a copiar en el
   teléfono, y un recuadro dice «esto se transcribe» sin tener que escribirlo. */
.cotizacion-hoja .cot-cuenta {
  margin-top: 4.5mm; padding: 2.5mm 3.5mm;
  border: .8pt solid var(--cot-linea); border-top: 2pt solid var(--cot-turquesa);
  background: var(--cot-fondo);
}
.cotizacion-hoja .cot-cuenta h2 {
  margin: 0 0 1.8mm; font-size: 8.5pt; letter-spacing: 1pt;
  text-transform: uppercase; color: var(--cot-marino);
}
.cotizacion-hoja .cot-cuenta-rejilla {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.8mm 6mm;
}
.cotizacion-hoja .cot-cuenta-rejilla > div { display: flex; flex-direction: column; min-width: 0; }
.cotizacion-hoja .cot-cuenta-rejilla > .ancho2 { grid-column: span 2; }
.cotizacion-hoja .cot-cuenta-rejilla span {
  font-size: 7.5pt; letter-spacing: .6pt; text-transform: uppercase; color: var(--cot-suave);
}
.cotizacion-hoja .cot-cuenta-rejilla b { font-size: 10pt; color: var(--cot-tinta); }
/* El número de cuenta, en cuerpo mayor y con las cifras de ancho fijo: es lo
   que alguien va a copiar en el teléfono, y copiar mal veinte cifras es
   mandar el dinero a otro sitio. Ocupa dos columnas para no partirse. */
.cotizacion-hoja .cot-cuenta-num b {
  white-space: nowrap;
}
.cotizacion-hoja .cot-cuenta-num b {
  font-size: 13pt; font-weight: bold; letter-spacing: .8pt;
  font-variant-numeric: tabular-nums; color: var(--cot-marino);
}
.cotizacion-hoja .cot-cuenta p {
  margin: 1.8mm 0 0; font-size: 8pt; color: var(--cot-suave);
}

/* --- El pie ---------------------------------------------------------------- */
.cotizacion-hoja .cot-pie { margin-top: 4.5mm; font-size: 8.5pt; color: #4A5A6C; }
.cotizacion-hoja .cot-pie p { margin: 0 0 1.2mm; }
.cotizacion-hoja .cot-gracias {
  margin: 0 0 2.5mm; font-style: italic; text-align: center;
  font-size: 9.5pt; color: var(--cot-marino);
}

/* La hoja de la cotización CRECE. El informe pagina solo y reparte el
   contenido; esta no, y con `height` fijo más `overflow: hidden` —lo que vale
   para el informe— una cotización larga perdía exámenes por abajo sin avisar
   a nadie. Creciendo, el navegador la parte en dos hojas al imprimir. */
/* La hoja CRECE mientras se arma, y después `paginarCotizacion()`
   (app/pantallas/cotizacion.js) la reparte en hojas carta de verdad. Las dos
   cosas hacen falta: si no creciera, una cotización larga perdería exámenes
   por abajo —`overflow: hidden`, que es lo que le vale al informe—; y si se
   quedara crecida, `pdfDeHojas` la aplastaría dentro de una sola carta,
   porque mete cada `.pagina` en una hoja del PDF.

   O sea que al terminar de pintar, TODAS las `.pagina` vuelven a medir una
   carta exacta. Si alguna vez se ve una hoja larguísima en la vista previa,
   es que la paginación no llegó a correr. */
#paraImprimir .pagina.pagina-cotizacion {
  height: auto; min-height: var(--papel-alto); overflow: visible;
}
/* «N.º C-00002 · continuación», en las hojas segunda y siguientes: quien
   recibe tres papeles grapados tiene que poder saber de cuál son. */
.cotizacion-hoja .cot-sigue {
  margin: 0 0 4mm; font-size: 8.5pt; letter-spacing: .5pt;
  text-transform: uppercase; color: var(--cot-suave);
}
/* Y si de verdad se va a dos hojas: que la cabecera de la tabla se repita
   arriba de la segunda —si no, la columna de precios llega sin rótulo— y que
   ningún renglón se parta por la mitad entre una hoja y la otra. */
.cotizacion-hoja .cot-lineas thead { display: table-header-group; }
.cotizacion-hoja .cot-lineas tr { break-inside: avoid; page-break-inside: avoid; }
.cotizacion-hoja .cot-cuenta,
.cotizacion-hoja .cot-cifras { break-inside: avoid; page-break-inside: avoid; }

/* La vista previa y la impresión: lo mismo que el informe, con su propia
   llave para no encender las dos barras a la vez. */
body.previsualizando-cotizacion #paraImprimir {
  display: block;
  position: fixed; inset: 0; z-index: 300;
  overflow: auto; background: #6B7B8C; padding: 74px 0 26px;
}
body.previsualizando-cotizacion #paraImprimir > .hoja-fondo { display: none; }
body.previsualizando-cotizacion #paraImprimir .pagina {
  margin: 0 auto 18px; box-shadow: 0 10px 34px rgba(0, 0, 0, .3);
}
body:not(.previsualizando-cotizacion) .previa-barra.cotizacion { display: none; }
@media print {
  .previa-barra.cotizacion { display: none !important; }
  body.imprimiendo-cotizacion > *:not(#paraImprimir) { display: none !important; }
  body.imprimiendo-cotizacion #paraImprimir { display: block; }
  body.imprimiendo-cotizacion { background: #fff; margin: 0; }
}

/* ===========================================================================
   053 · LAS HOJAS DE UN PDF ANEXO
   Cada hoja del documento del laboratorio externo entra como una `.pagina`
   más, con la imagen ocupando el papel entero. Sin membrete ni marca de agua
   nuestros: el anexo ya trae los suyos, del laboratorio que lo firmó, y
   ponerle los nuestros encima sería decir que lo hicimos nosotros.
   =========================================================================== */

#paraImprimir .pagina.pagina-anexo { padding: 0; }
#paraImprimir .pagina.pagina-anexo > .hoja-fondo,
#paraImprimir .pagina.pagina-anexo > .marca-agua,
#paraImprimir .pagina.pagina-anexo > .pagina-num { display: none; }
#paraImprimir .anexo-hoja {
  display: block; width: 100%; height: 100%;
  object-fit: contain; object-position: center top;
}

/* El título del perfil en el papel, encima de los exámenes que agrupa. Es el
   mismo que en la pantalla y el que pone Nubelab: «PERFIL TIROIDEO III
   (GENERAL) (PT3)» (Iralis, 14/09/2026). */
.titulo-perfil {
  font-family: Arial, Helvetica, sans-serif; font-size: 9pt; font-weight: bold;
  color: #000; text-transform: uppercase; letter-spacing: .2pt;
  margin: 8pt 0 0; padding-bottom: 2pt;
  border-bottom: 1pt dotted #999;
  /* `table` y no `inline-block`: se encoge al ancho del texto (para que la
     raya de puntos no cruce la hoja) pero NO deja que el título del examen se
     le siente al lado, que era lo que pasaba (Iralis, 14/09/2026). */
  display: table;
}

/* El sello del firmante, al lado de la firma y detras de ella. Solo sale si hay
   uno cargado (migracion 088, 14/09/2026). */
.firma .sello {
  position: absolute; right: 0; bottom: 10pt; max-height: 56pt; max-width: 72pt;
  opacity: .85; z-index: 0;
}
.firma { position: relative; }
.firma img:not(.sello) { position: relative; z-index: 1; }
/* 313 · El sello con SU tamaño. Hasta hoy heredaba el alto de la firma (las
   reglas `.firma img` de arriba pesan más que `.firma .sello`): 16 mm en
   pantalla y 15,9 mm en el papel, topado a 56 × 72 pt. Al 100 % queda igual;
   `--sello-escala` lo agranda o lo achica sin tocar la firma. */
.informe .firma img.sello, #paraImprimir .pagina .firma img.sello {
  width: auto;
  max-height: calc(56pt * var(--sello-escala, 1)); max-width: calc(72pt * var(--sello-escala, 1));
}
.informe .firma img.sello { height: calc(16mm * var(--sello-escala, 1)); }
#paraImprimir .pagina .firma img.sello { height: calc(15.9mm * var(--sello-escala, 1)); }

/* ===========================================================================
   199 · LA HOJA DE ENVÍO A UN LABORATORIO (app/remesas.js). Carta apaisada,
   en blanco y negro: nada se entiende por el color.
   =========================================================================== */
/* Si no cabe en una hoja sigue en la siguiente (Iralis, 25/09/2026): la
   cabecera de la tabla se repite, un paciente no se parte entre dos hojas, las
   firmas van al final y cada hoja dice «Hoja 1 de 2» abajo a la derecha. */
@page remesa {
  size: letter landscape; margin: 10mm 10mm 12mm;
  @bottom-right { content: 'Hoja ' counter(page) ' de ' counter(pages);
    font-family: 'Inter', 'Segoe UI', sans-serif; font-size: 7pt; color: #5F7086; }
}
@media print {
  body.imprimiendo-remesa > *:not(#paraRemesa) { display: none !important; }
  body.imprimiendo-remesa #paraRemesa { display: block !important; }
  body.imprimiendo-remesa { background: #fff; margin: 0; }
}
/* Con el color de la casa, como la maqueta que vio Iralis
   (auditoria/modelo-hoja-envio.html) y el logo de la clínica (Iralis,
   25/09/2026: «antes la habías hecho más profesional con más colores y el
   logo»). El azul y el aguamarina son acento: en una impresora en blanco y
   negro se lee igual. `print-color-adjust` para que el fondo de la cabecera
   de la tabla salga aunque no se marque «Gráficos de fondo». */
.hoja-envio {
  --he-azul: #113458; --he-agua: #38B6B8; --he-tinta: #1F2D3D; --he-gris: #5F7086;
  --he-linea: #CBD5E1; --he-suave: #F3F6FA;
  font-family: 'Inter', 'Segoe UI', Tahoma, sans-serif; color: var(--he-tinta);
  font-size: 9pt; display: flex; flex-direction: column; min-height: 185mm;
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
#paraRemesa .hoja-envio { page: remesa; }
/* El membrete: una sola franja baja (Iralis, 25/09/2026: «que ocupe menos
   espacio»). Emblema + nombre | título con el resumen debajo | número y fecha. */
.he-cab { display: grid; grid-template-columns: 1fr auto 1fr; gap: 6mm; align-items: center;
  padding-bottom: 2.2mm; }
.he-marca { display: flex; align-items: center; gap: 2.6mm; }
.he-logo { height: 11.5mm; width: 11.5mm; display: block; }
.he-marca b { display: block; font-family: 'Plus Jakarta Sans', 'Inter', sans-serif; font-size: 11pt; font-weight: 800;
  color: var(--he-azul); line-height: 1.1; }
.he-marca small { display: block; font-size: 6pt; letter-spacing: .18em; font-weight: 700; color: var(--he-gris); margin-top: .6mm; }
.he-titulo { text-align: center; }
.he-titulo h1 { margin: 0; font-family: 'Plus Jakarta Sans', 'Inter', sans-serif; font-size: 13.5pt; font-weight: 800;
  color: var(--he-azul); letter-spacing: -.2pt; line-height: 1.15; }
.he-titulo h1 span { color: var(--he-tinta); }
.he-titulo p { margin: 1mm 0 0; font-size: 7.8pt; color: var(--he-gris); white-space: nowrap; }
.he-titulo p b { color: var(--he-tinta); font-family: 'IBM Plex Mono', ui-monospace, monospace; }
.he-datos { text-align: right; font-size: 7.8pt; line-height: 1.45; color: var(--he-gris); }
.he-datos b { display: block; font-family: 'IBM Plex Mono', ui-monospace, monospace; font-weight: 600; font-size: 10pt; color: var(--he-azul); }
.he-datos span { display: block; }
.he-tabla { width: 100%; border-collapse: collapse; font-size: 8pt; margin-top: 0; }
.he-tabla th { text-align: left; font-size: 6.6pt; font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
  color: var(--he-azul); background: var(--he-suave); padding: 1.8mm 1.4mm;
  border-top: 1.6pt solid var(--he-azul); border-bottom: 1.2pt solid var(--he-azul); white-space: nowrap; }
/* 28/09 (Jean): sin «Orden» ni «Días», con «Nacimiento»: Exámenes es la 8.ª, y el
   espacio que queda es para el diagnóstico y las observaciones */
.he-tabla th:nth-child(8) { width: 19%; }
.he-tabla th:nth-child(9), .he-tabla th:nth-child(10) { width: 19%; }
.he-tabla td { padding: 1.8mm 1.4mm; border-bottom: .6pt solid var(--he-linea); vertical-align: top; }
.he-tabla tbody tr:nth-child(even) td { background: #FAFBFD; }
.he-tabla tr { break-inside: avoid; }
.he-tabla thead { display: table-header-group; }
.he-n { text-align: right; width: 5mm; color: var(--he-gris); font-family: 'IBM Plex Mono', ui-monospace, monospace; }
.he-mono { font-family: 'IBM Plex Mono', ui-monospace, monospace; font-variant-numeric: tabular-nums; white-space: nowrap; }
.he-orden { font-weight: 600; color: var(--he-azul); }
.he-centro { text-align: center; white-space: nowrap; }
.he-nom { font-weight: 700; white-space: nowrap; }
.he-ex { display: block; font-weight: 600; }
.he-ex + .he-ex { margin-top: .6mm; }
.he-ex::before { content: '□ '; font-weight: 400; color: var(--he-gris); }
.he-vacio { color: #A0AEC0; }
.he-pie { padding-top: 10mm; }
/* El último paciente y las firmas no se separan */
.he-cierre { break-inside: avoid; }
.he-tabla tbody tr.he-fila-firmas td { border-bottom: 0; background: none; padding: 0; }
.he-firmas { display: grid; grid-template-columns: 1fr 1fr; gap: 16mm; font-size: 8pt; color: var(--he-gris); }
.he-firmas b { color: var(--he-tinta); }
.he-raya { border-bottom: 1pt solid var(--he-tinta); height: 11mm; margin-bottom: 1.5mm; }
.he-linea { display: flex; gap: 6mm; margin-top: 2.5mm; }
.he-linea span { flex: 1; border-bottom: .6pt solid var(--he-linea); padding-bottom: .5mm; }
.he-nota { margin-top: 4mm; display: flex; justify-content: space-between; font-size: 6.5pt; color: var(--he-gris); }

/* 328 · Un texto largo (el examen al fresco de un cultivo) ocupa el valor, la
   unidad y el rango, y se parte en varias líneas: `esTextoLargo` en informe.js
   (Jean, 19/10/2026). */
/* (Jean, 19/10) Los renglones como en el PDF de UNILAB, y un poco más juntos
   (9,5 pt) para que un cultivo con su Gram quepa en una hoja con la firma. */
.informe td.valor.valor-largo { white-space: normal; text-align: left; font-size: 9.5pt; line-height: 1.18;
  padding-top: 1px; padding-bottom: 1px; }
/* 341 · El nombre de la prueba arriba, a la altura del primer renglón (con un
   bloque de 13 renglones quedaba suelto a media altura; Anticoagulante lúpico, 26/10) */
.informe tr.fila-texto-largo > td.parametro { vertical-align: top; }
/* (Jean, 28/10) «OBSERVACIONES:» siempre en negrita y separada de lo de arriba */
/* (más fuerte que `td.valor.valor-largo`, que deja el texto con 1px arriba) */
.informe table.resultados tr.fila-observacion > td { padding-top: 3mm; }
.informe tr.fila-observacion > td.parametro { font-weight: 700; }
/* (Jean, 31/10) El texto pegado al rótulo, a la izquierda, con la sangría del nombre */
.informe table.resultados tr.fila-observacion > td.observacion-junta { padding-left: 4mm; }
.informe td.observacion-junta .rotulo-obs { font-weight: 700; }
/* 363 · (Jean, 31/10) Los renglones de debajo de una fila tal cual (el cálculo de
   la depuración de BUN): a la izquierda, bajo el nombre y un poco más adentro,
   con aire arriba para que no queden pegados a él */
.informe table.resultados tr.fila-nota-tal-cual > td.valor-largo { padding: 1.6mm 1.5mm 1.2mm 8mm; }

/* VISTA PREVIA DE UNA PRUEBA SIN VALIDAR (Jean, 19/10/2026; `previaSinValidar`
   en informe.js). Su barra solo tiene «Cerrar»; la de la vista previa normal se
   esconde mientras tanto, y la normal esconde esta. Lleva el sello «SIN
   VALIDAR» en cada hoja y, si alguien pulsa Ctrl + P, no sale nada. */
body:not(.previa-borrador) .previa-barra.previa-borrador { display: none; }
body.previa-borrador #previaBarra { display: none; }
.previa-barra.previa-borrador { background: #9A3412; }
#paraImprimir .pagina .sello-sin-validar {
  position: absolute; z-index: 5; top: 42%; left: 0; right: 0; text-align: center;
  transform: rotate(-24deg); pointer-events: none;
  font: 800 64pt/1 var(--font, sans-serif); letter-spacing: 6px;
  color: rgba(154, 52, 18, .16); border: 0;
}
@media print { body.previa-borrador #paraImprimir { display: none !important; } }