/* ------------------------------------------------------------------
   styles/aranceles.css — La lista de aranceles, en pantalla y en papel

   El PDF lo genera el navegador desde este mismo HTML, así que lo que se ve
   editando es lo que sale impreso. Un generador de PDF aparte sería la forma
   segura de que las dos cosas se desincronicen.

   Medidas tomadas del PDF de diciembre 2025: A4, cuerpo centrado de ~150mm,
   columna de importes a la derecha con su regla vertical.
   ------------------------------------------------------------------ */

:root {
  --doc-acento: #29ABE2;      /* el celeste de los títulos */
  --doc-tinta: #222;
  --doc-regla: #555;
}

/* La tabla exterior existe para que el navegador repita <thead> y <tfoot> en
   cada hoja impresa. No aporta nada visual. */
.doc-hoja { width: 100%; border-collapse: collapse; }
.doc-hoja > thead > tr > td,
.doc-hoja > tfoot > tr > td,
.doc-hoja > tbody > tr > td { padding: 0; }

.doc-aranceles {
  --doc-ancho: 170mm;
  background: #fff;
  color: var(--doc-tinta);
  font-family: Arial, Helvetica, sans-serif;
  font-size: 10pt;
  line-height: 1.35;
}

/* --- Encabezado --- */
.doc-cab {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 6mm 0 3mm;
  border-bottom: 2px solid var(--doc-tinta);
  margin: 0 auto;
  width: var(--doc-ancho);
}
.doc-logo        { height: 16mm; }
.doc-logo-texto  { font-weight: 700; font-size: 12pt; }
.doc-titulo {
  flex: 1;
  text-align: center;
  font-weight: 700;
  font-size: 16pt;
  letter-spacing: .32em;
  text-transform: uppercase;
}
.doc-periodo { font-size: 9.5pt; letter-spacing: .18em; text-transform: uppercase; }

/* --- Cuerpo --- */
.doc-cuerpo { width: var(--doc-ancho); margin: 0 auto; padding: 6mm 0 0; }

.doc-seccion-titulo {
  text-align: center;
  color: var(--doc-acento);
  font-size: 17pt;
  font-weight: 700;
  margin: 6mm 0 5mm;
}

/* Cada grupo lleva su etiqueta rotada en el margen, como en el original. */
.doc-grupo { display: flex; gap: 6mm; margin-bottom: 7mm; }
.doc-lateral {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-size: 6.5pt;
  letter-spacing: .22em;
  color: #9aa0a6;
  text-align: center;
  flex: 0 0 5mm;
}
.doc-grupo-cuerpo { flex: 1; min-width: 0; }

.doc-grupo-titulo {
  color: var(--doc-acento);
  font-size: 11.5pt;
  font-weight: 700;
  text-transform: uppercase;
  margin: 0 0 1mm;
  padding-bottom: 1mm;
  border-bottom: 1.2px solid var(--doc-regla);
}

.doc-tabla { width: 100%; border-collapse: collapse; }
.doc-renglon > td {
  border-bottom: .5px solid #b9bec4;
  padding: .9mm 0;
  vertical-align: baseline;
}
.doc-texto  { padding-right: 4mm; }
.doc-importe {
  /* La regla vertical que separa la columna de precios. */
  border-left: 1.2px solid var(--doc-regla);
  padding-left: 3mm;
  text-align: right;
  white-space: nowrap;
  width: 26mm;
}
.doc-renglon.nivel-1 .doc-texto { padding-left: 5mm; }
.doc-renglon.nivel-2 .doc-texto { padding-left: 10mm; }
.doc-vineta { margin-right: 1.5mm; }
/* Los encabezados de bloque no llevan línea inferior: abren una lista. */
.doc-renglon.es-nota > td { border-bottom: none; }
.doc-texto em { font-style: italic; }

.doc-notas { margin-top: 10mm; font-size: 8.5pt; line-height: 1.45; }
.doc-notas p { margin: 0 0 1mm; }
.doc-notas-titulo { color: var(--doc-acento); font-weight: 700; font-size: 10pt; }

/* --- Pie --- */
.doc-pie {
  display: flex;
  align-items: flex-end;
  gap: 10mm;
  width: var(--doc-ancho);
  margin: 8mm auto 0;
  padding-top: 3mm;
  border-top: 1.2px solid var(--doc-tinta);
  font-size: 8pt;
  letter-spacing: .08em;
  color: #333;
}
.doc-pie-datos { line-height: 1.6; }
.doc-pie-pagina { margin-left: auto; font-size: 20pt; font-style: italic; color: #555; }

/* La portada sólo existe en papel. */
.doc-portada { display: none; }

/* ------------------------------------------------------------------
   EDICIÓN — sólo en pantalla
   ------------------------------------------------------------------ */
.doc-editable .doc-renglon { cursor: pointer; }
.doc-editable .doc-renglon:hover > td { background: color-mix(in srgb, var(--doc-acento) 10%, transparent); }
.doc-editable .doc-renglon:focus-visible { outline: 2px solid var(--doc-acento); }
.doc-editable [data-edit-seccion], .doc-editable [data-edit-grupo] { cursor: pointer; }
.doc-editable [data-edit-seccion]:hover,
.doc-editable [data-edit-grupo]:hover { text-decoration: underline dotted; }

.doc-agregar {
  margin-top: 1.5mm;
  border: 1px dashed #c3c8ce;
  background: none;
  color: #8a9096;
  border-radius: 4px;
  padding: 2px 10px;
  font-size: 8.5pt;
  cursor: pointer;
  font-family: inherit;
}
.doc-agregar:hover { color: var(--doc-acento); border-color: var(--doc-acento); }

/* Un renglón calculado cuyo precio no se pudo resolver no puede imprimirse en
   blanco sin que nadie se entere. */
.doc-renglon.sin-resolver > td { background: #fff4f4; }
.doc-falta { color: #b91c1c; font-size: 8pt; }
.doc-calc  { color: var(--doc-acento); font-size: 8pt; margin-left: 3px; }

/* ------------------------------------------------------------------
   IMPRESIÓN
   ------------------------------------------------------------------ */
@page {
  size: A4;
  /* El encabezado y el pie ocupan lugar real dentro del flujo (van en thead y
     tfoot), así que el margen es sólo el borde de la hoja. */
  margin: 12mm 14mm;
}

@media print {
  /* Al imprimir, `core/impresion.js` clona el documento dentro de
     `#print-portal`, que SÍ es hijo directo de <body>. Esconder los hermanos
     alcanza y no depende de dónde esté montado el módulo — esconder los
     hermanos del nodo anidado dejaba la hoja en blanco, porque el que se
     ocultaba era el contenedor que lo contenía. */
  body > *:not(#print-portal) { display: none !important; }
  #print-portal { display: block; }

  /* Medido contra el PDF original: sus renglones avanzan 12pt. Con 9,5pt de
     cuerpo y línea 1.35 el mío daba 18,7pt y la lista pasaba de 4 hojas a 8. */
  .doc-aranceles { font-size: 8.5pt; line-height: 1.15; }
  .doc-renglon > td { padding: .4mm 0; }
  .doc-seccion-titulo { font-size: 15pt; margin: 1mm 0 3.5mm; }
  .doc-grupo { margin-bottom: 4mm; }
  .doc-grupo-titulo { font-size: 10.5pt; margin-bottom: .6mm; padding-bottom: .6mm; }
  .doc-notas { margin-top: 6mm; font-size: 7.5pt; }
  .doc-editable .doc-agregar,
  .doc-editable .doc-calc,
  .doc-no-imprimir { display: none !important; }

  /* `thead`/`tfoot` ya los repite el navegador en cada hoja; acá sólo se
     ajustan al ancho útil de la página. */
  .doc-cab, .doc-pie, .doc-cuerpo { width: auto; margin: 0; }
  .doc-cab { padding: 0 0 2mm; }
  .doc-pie { padding-top: 2mm; }
  .doc-cuerpo { padding: 4mm 0; }

  .doc-portada {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 80vh;
    break-after: page;
  }
  .doc-portada img { max-width: 90mm; }
  .doc-portada-nombre  { font-size: 26pt; font-weight: 700; }
  .doc-portada-periodo { margin-top: 40mm; font-size: 14pt; font-style: italic; color: #bbb; }

  .doc-seccion.con-salto { break-before: page; }
  /* Un grupo partido entre dos hojas es ilegible: el título queda solo arriba. */
  .doc-grupo { break-inside: avoid; }
  .doc-renglon { break-inside: avoid; }
  .doc-notas { break-inside: avoid; }

  /* Los fondos de la edición no van al papel. */
  .doc-renglon.sin-resolver > td { background: none; }
}
