/* paper.css — A4 sheet layout system */

/* ── Página de impresión sin márgenes ni fondo ── */
@page {
  margin: 0;
  size: A4 portrait;
}

/* ── Base .sheet ── */
.sheet {
  position: relative;
  box-sizing: border-box;
}

/* ── Tamaños en PANTALLA: ancho fijo, altura libre (crece con el contenido) ── */
body.A3               .sheet { width: 297mm }
body.A3.landscape     .sheet { width: 420mm }
body.A4               .sheet { width: 210mm }
body.A4.landscape     .sheet { width: 297mm }
body.A5               .sheet { width: 148mm }
body.A5.landscape     .sheet { width: 210mm }
body.letter           .sheet { width: 216mm }
body.letter.landscape .sheet { width: 280mm }
body.legal            .sheet { width: 216mm }
body.legal.landscape  .sheet { width: 357mm }

/* ── Padding variants ── */
.sheet.padding-10mm { padding: 10mm }
.sheet.padding-15mm { padding: 15mm }
.sheet.padding-20mm { padding: 20mm }
.sheet.padding-25mm { padding: 25mm }

/* ── Vista en pantalla: fondo blanco con sombra ── */
@media screen {
  .sheet {
    background: white;
    box-shadow: 0 2mm 8mm rgba(0,0,0,.18);
    margin: 8mm auto;
    border-radius: 1px;
  }
}

/* ── IMPRESIÓN ────────────────────────────────────────────────────────────
   Clave: NO ponemos height fijo. Dejamos que cada .sheet ocupe lo que
   necesita y usamos page-break-before en el segundo sheet para forzar
   nueva página SIN añadir espacio vacío.
   El fondo gris del body se elimina con background: white.
──────────────────────────────────────────────────────────────────────── */
@media print {

  /* Eliminar fondo gris del body y del contenedor */
  body, .app-main, #sheet-view {
    background: white !important;
  }

  /* Primer sheet: sin salto previo, sin altura forzada */
  .sheet {
    width: 100% !important;
    height: auto !important;
    overflow: visible !important;
    page-break-inside: avoid;
    break-inside: avoid;
    background: white !important;
    box-shadow: none !important;
    margin: 0 !important;
    border-radius: 0 !important;
  }

  /* Cada sheet a partir del segundo empieza en página nueva */
  .sheet + .sheet {
    page-break-before: always;
    break-before: page;
  }

  /* Fixes de ancho para Chrome #273306 */
             body.A3.landscape { width: 420mm }
  body.A3,   body.A4.landscape { width: 297mm }
  body.A4,   body.A5.landscape { width: 210mm }
  body.A5                      { width: 148mm }
  body.letter, body.legal      { width: 216mm }
  body.letter.landscape        { width: 280mm }
  body.legal.landscape         { width: 357mm }
}

/* ── Ficha: cabecera ── */
.ficha-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 2px solid var(--accent, #1a3cff);
  padding-bottom: 4mm;
  margin-bottom: 5mm;
}

.ficha-header .ficha-id {
  font-size: 8px;
  color: #999;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-family: monospace;
}

.ficha-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--accent, #1a3cff);
  letter-spacing: .04em;
  text-transform: uppercase;
  margin: 0;
}

.ficha-subtitle {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: #888;
  margin: 0 0 2px;
}

/* ── Ficha: grid de campos ── */
.ficha-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3mm 6mm;
  margin-bottom: 5mm;
}
.ficha-grid.cols-1 { grid-template-columns: 1fr }
.ficha-grid.cols-3 { grid-template-columns: 1fr 1fr 1fr }

.ficha-field {
  display: flex;
  flex-direction: column;
  gap: 1mm;
}
.ficha-field label {
  font-size: 7px;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: #888;
  font-weight: 600;
}
.ficha-field .value {
  font-size: 11px;
  font-weight: 500;
  color: #111;
  border-bottom: .5px solid #ddd;
  padding-bottom: 1.5mm;
  min-height: 5mm;
}

/* ── Ficha: título de sección ── */
.ficha-section-title {
  font-size: 8px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .15em;
  color: var(--accent, #1a3cff);
  border-left: 2px solid var(--accent, #1a3cff);
  padding-left: 2mm;
  margin: 4mm 0 3mm;
}

/* ── Ficha: notas ── */
.ficha-notes {
  font-size: 10px;
  color: #333;
  line-height: 1.6;
  border: .5px solid #e0e0e0;
  padding: 3mm;
  border-radius: 1mm;
  min-height: 15mm;
  background: #fafafa;
}

/* ── Ficha: pie de página ── */
.ficha-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: .5px solid #ddd;
  padding-top: 2mm;
  margin-top: 6mm;
}
.ficha-footer span {
  font-size: 7px;
  color: #bbb;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-family: monospace;
}

/* ── Tabla de presupuesto (página 2) ── */
.pres-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 10px;
  margin-bottom: 4mm;
}
.pres-table thead tr {
  background: var(--accent, #1a3cff);
  color: white;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}
.pres-table th {
  font-size: 8px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  padding: 2.5mm 3mm;
  text-align: left;
}
.pres-table th.pres-num { text-align: right; }
.pres-table td {
  padding: 2mm 3mm;
  vertical-align: middle;
  border-bottom: .3px solid #e8e8e8;
  color: #222;
}
.pres-table .pres-num  { text-align: right; font-family: monospace; }
.pres-table .pres-concepto { max-width: 90mm; }
.pres-table .pres-total { font-weight: 600; }
.pres-table .row-even  { background: #ffffff; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.pres-table .row-odd   { background: #f7f8ff; -webkit-print-color-adjust: exact; print-color-adjust: exact; }

/* ── Totales del presupuesto ── */
.pres-totals-block {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 1.5mm;
  margin-top: 3mm;
  padding-top: 2mm;
}
.pres-total-row {
  display: flex;
  justify-content: space-between;
  gap: 12mm;
  font-size: 9px;
  width: 70mm;
}
.pres-total-row span:first-child {
  color: #666;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.pres-total-row span:last-child {
  font-family: monospace;
  font-weight: 600;
  text-align: right;
}
.pres-grand-total {
  border-top: 1.5px solid var(--accent, #1a3cff);
  padding-top: 1.5mm;
  margin-top: 1mm;
}
.pres-grand-total span {
  color: var(--accent, #1a3cff) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}