@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;600;700&family=Source+Sans+3:wght@400;600&display=swap');

@media print {
    html, body {
      height: auto !important;
    }

  .bitacora-wrapper{
      position: relative;
      overflow: hidden;
      background: white;
  }

}

:root {
  --azul-header: #1a3a6b;
  --azul-seccion: #1e4d8c;
  --azul-claro: #2563b0;
  --verde-numero: #1a7a3a;
  --borde: #2a4a8a;
  --fondo-campo: #ffffff;
  --texto: #111111;
  --linea: #c0c8d8;
}

body {
  margin: 0;
  background: #e9ebf0;
  font-family: 'Source Sans 3', Arial, sans-serif;
}

.mini-jaula {
    position: relative;
    width: 100%;
    height: 100%;

    display: flex;
    align-items: center;
    justify-content: center;
}

.mini-cara {
    position: absolute;
    background: var(--azul-claro);
    border-radius: 2px;
}

/* Pared 1 - arriba */
.mini-cara-1 {
    top: 0px;
    left: 0px;
    right: 0px;
    height: 5px;
}

/* Pared 2 - derecha */
.mini-cara-2 {
    top: 0px;
    right: 0px;
    bottom: 0px;
    width: 5px;
}

/* Pared 3 - abajo */
.mini-cara-3 {
    left: 0px;
    right: 0px;
    bottom: 0px;
    height: 5px;
}

/* Pared 4 - izquierda */
.mini-cara-4 {
    top: 0px;
    left: 0px;
    bottom: 0px;
    width: 5px;
}

.contenedor-jaulas {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 10px;
    color: #000000;
}


/* ==============================
   FILA DEL MÓDULO
   ============================== */

.fila-modulo {
    display: flex;
    align-items: center;
    color: #000000;
}


/* ==============================
   NOMBRE DEL MÓDULO
   ============================== */

.nombre-modulo {
    width: 60px;
    margin-right: 12px;

    color: #000000 !important;

    text-align: right;

    font-size: 14px;
    font-weight: 700;

    display: block;
}


/* ==============================
   GRILLA
   ============================== */

.grilla-jaulas {
    display: grid;

    grid-template-rows: 40px 40px;

    gap: 5px;
}


/* ==============================
   CELDA
   ============================== */

.celda-jaula {
    position: relative;

    width: 50px;
    height: 40px;

    display: flex;
    align-items: center;
    justify-content: center;

    box-sizing: border-box;

    border: 1px solid #999999;
    border-radius: 3px;

    background: #eeeeee;

    color: #000000 !important;

    font-size: 12px;
}


/* ==============================
   NÚMERO JAULA
   ============================== */

.numero-jaula {
    display: block;
    position: relative;
    z-index: 10;

    color: #000000 !important;

    font-size: 12px;
    font-weight: 700;

    visibility: visible !important;
    opacity: 1 !important;
}


/* ==============================
   MANTENCIÓN
   ============================== */

/* .celda-mantencion {
    border: 3px solid red !important;
} */

.celda-mantencion .numero-jaula {
    color: var(--azul-claro) !important;
}



.bitacora-wrapper {
  width: 210mm;
  min-height: 297mm;
  margin: 20px auto;
  background: #fff;
  box-shadow: 0 4px 24px rgba(0,0,0,0.18);
  padding: 10mm 10mm 8mm;
  font-size: 9pt;
  line-height: 1.3;
  position: relative;
}

.marca-agua {
    position: absolute;
    z-index: 0;

    width: 100%;
    height: 100%;

    left: 50%;
    top: 50%;

    transform: translate(-50%, -50%);

    opacity: 0.10;

    pointer-events: none;
}

.contenido-reporte {
    position: relative;
    z-index: 1;
}

/* ── HEADER ── */
.header-top {
  display: grid;
  grid-template-columns: 60px 1fr 110px;
  align-items: center;
  gap: 6px;
  margin-bottom: 6px;
}

.logo-box {
  align-items: center;
  justify-content: center;
}

.logo-box svg { width: 52px; height: 52px; }

.empresa-info {
  text-align: center;
  line-height: 1.35;
}

.empresa-nombre {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 13pt;
  font-weight: 700;
  color: var(--azul-header);
  letter-spacing: 0.5px;
}

.empresa-sub {
  font-size: 7.5pt;
  color: #444;
}

.titulo-doc {
  margin-top: 4px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 13pt;
  font-weight: 700;
  color: var(--azul-header);
  letter-spacing: 0.3px;
}

.titulo-sub {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10.5pt;
  font-weight: 600;
  color: var(--azul-header);
}

.fecha-numero {
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: flex-end;
}

.fecha-box, .numero-box {
  border: 1.5px solid var(--borde);
  padding: 3px 8px;
  border-radius: 3px;
  white-space: nowrap;
  font-size: 8.5pt;
  color:var(--texto);
}

.numero-box {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 13pt;
  font-weight: 700;
  color: var(--verde-numero);
  border-color: var(--verde-numero);
  letter-spacing: 1px;
}

.centro-row {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 6px;
  margin-bottom: 6px;
  font-weight: 600;
  font-size: 9.5pt;
  color: var(--azul-header);
  border-bottom: 1px solid var(--linea);
  padding-bottom: 4px;
}

.centro-row .val {
  font-size: 9.5pt;
  font-weight: 400;
  color: var(--texto);
}

/* ── SECCIONES ── */
.seccion {
  margin-bottom: 5px;
  border: 1.5px solid var(--borde);
  border-radius: 3px;
  overflow: hidden;
}

.seccion-header {
  background: var(--azul-seccion);
  color: #fff;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10pt;
  font-weight: 600;
  letter-spacing: 0.8px;
  padding: 3px 8px;
  text-align: center;
  text-transform: uppercase;
}

.seccion-body {
  padding: 5px 8px;
  background: var(--fondo-campo);
}

/* ── GRID DE CAMPOS ── */
.campos-grid {
  display: grid;
  gap: 3px 10px;
}

.reporte-col-2 { grid-template-columns: 1fr 1fr; }
.reporte-col-3 { grid-template-columns: 1fr 1fr 1fr; }
.reporte-col-4 { grid-template-columns: 1fr 1fr 1fr 1fr; }

.campo {
  display: flex;
  align-items: baseline;
  gap: 4px;
  border-bottom: 1px solid var(--linea);
  padding-bottom: 2px;
  min-height: 18px;
}

.campo-label {
  font-weight: 600;
  white-space: nowrap;
  font-size: 7.5pt;
  color: var(--azul-claro);
  flex-shrink: 0;
}

.campo-val {
  font-size: 9.5pt;
  color: var(--texto);
  flex: 1;
}

/* ── CONDICIÓN TIEMPO / COMPRESORES ── */
.dos-columnas {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px;
  margin-bottom: 5px;
}

.check-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 3px;
}

.check-item {
  display: flex;
  align-items: center;
  gap: 3px;
  font-size: 8.5pt;
  color: var(--texto);
}

.check-box {
  width: 11px;
  height: 11px;
  border: 1.5px solid var(--borde);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 8pt;
  background: #fff;
  flex-shrink: 0;
}

.check-box.marcado { background: var(--azul-claro); color: #fff; }

/* ── TABLA BUZOS ── */
.tabla-buzos {
  width: 100%;
  border-collapse: collapse;
  font-size: 7.8pt;
  margin-top: 3px;
}

.tabla-buzos th {
  background: var(--azul-claro);
  color: #fff;
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 600;
  font-size: 7.5pt;
  text-align: center;
  padding: 3px 4px;
  border: 1px solid var(--borde);
  line-height: 1.15;
}

.tabla-buzos td {
  border: 1px solid var(--linea);
  padding: 3px 5px;
  text-align: center;
}

.tabla-buzos td.left { text-align: left; }
.tabla-buzos td.right { text-align: right; }

.tabla-buzos tr:nth-child(even) td { background: #f4f7fb; }

.th-sub {
  font-size: 6.5pt;
  font-weight: 400;
  display: block;
  opacity: 0.85;
}

/* ── DETALLE BUZO ── */
.detalle-buzo {
  margin-bottom: 4px;
}

.detalle-label {
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 600;
  color: var(--azul-claro);
  font-size: 8.5pt;
  margin-bottom: 2px;
}

.detalle-lineas {
  color: var(--texto);
  border: 1px solid var(--linea);
  border-radius: 2px;
  padding: 4px 6px;
  min-height: 30px;
  background: #fafbfd;
  font-size: 9.5pt;
  line-height: 1.5;
}

/* ── OBSERVACIONES ── */
.obs-box {
  color: var(--texto);
  border: 1px solid var(--linea);
  border-radius: 2px;
  padding: 5px 7px;
  min-height: 35px;
  background: #fafbfd;
  font-size: 9.5pt;
}

/* ── FIRMAS ── */
.firmas-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-top: 10px;
  border-top: 1.5px solid var(--borde);
  padding-top: 8px;
}

.firma-bloque { text-align: center; }

.firma-linea {
  border-bottom: 1.5px solid #333;
  height: 35px;
  margin-bottom: 4px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  font-size: 7.5pt;
  color: #666;
}

.firma-nombre {
  color: var(--texto);
  font-weight: 700;
  font-size: 9.5pt;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}

.firma-cargo {
  color: var(--texto);
  font-size: 9.5pt;
  color: #555;
}

.firma-rut {
  font-size: 7pt;
  color: #777;
}

/* ── DISCLAIMER ── */
.disclaimer {
  margin-top: 8px;
  font-size: 6pt;
  color: #888;
  text-align: center;
  border-top: 1px solid var(--linea);
  padding-top: 5px;
  line-height: 1.4;
}

.nota-capacidad {
  font-size: 6.5pt;
  color: #888;
  text-align: right;
  margin-top: 2px;
  font-style: italic;
}

/* ── GRILLAS M100 / M200 (extensión para Informe Lavado de Redes) ── */
.grilla-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 2px;
}

.grilla-etiqueta {
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 700;
  font-size: 9pt;
  color: var(--azul-header);
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  flex-shrink: 0;
}

.grilla {
  flex: 1;
  display: grid;
  grid-template-columns: repeat(15, 1fr);
  grid-auto-rows: 16px;
  gap: 1.5px;
}

.celda {
  border: 1px solid var(--linea);
  background: #fafbfd;
}

/* ── PRINT ── */
@media print {
  body { background: white; }
  .p-dialog-footer, .p-dialog-header { display: none !important; }
  .bitacora-wrapper {
    width: 100%;
    margin: 0;
    padding: 1px;
    box-shadow: none;
  }
  @page {
    size: A4;
    margin: 0;
  }
}