/* ============================================================
   print.css — Tudo que vai para o papel.
   Medidas em MILÍMETROS: o que se vê na prévia é o que sai impresso.
   Cores sempre em preto no branco, nos dois temas do site.
   ============================================================ */

/* ====== FOLHA ====== */

.pr-folha {
  position: relative;
  background: #fff;
  color: #000;
  box-sizing: border-box;
  font-family: 'Times New Roman', Times, serif;
  overflow: hidden;
  page-break-after: always;
  break-after: page;
}

.pr-folha:last-child {
  page-break-after: auto;
  break-after: auto;
}

.pr-grade {
  display: grid;
  width: 100%;
  height: 100%;
  align-content: start;
  justify-content: start;
}

.pr-celula {
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
}

/* Linha de corte tracejada, para recortar depois */
.pr-celula.pr-corte { outline: .2mm dashed #999; outline-offset: 0; }

/* Marca de canto: quatro cantinhos em vez da linha inteira */
.pr-marca-canto {
  position: absolute;
  width: 3mm;
  height: 3mm;
  border: 0 solid #666;
  pointer-events: none;
}

.pr-marca-canto.tl { top: 0; left: 0; border-top-width: .2mm; border-left-width: .2mm; }
.pr-marca-canto.tr { top: 0; right: 0; border-top-width: .2mm; border-right-width: .2mm; }
.pr-marca-canto.bl { bottom: 0; left: 0; border-bottom-width: .2mm; border-left-width: .2mm; }
.pr-marca-canto.br { bottom: 0; right: 0; border-bottom-width: .2mm; border-right-width: .2mm; }

/* ====== DOCUMENTO ====== */

.pr-doc {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  color: #000;
  background: #fff;
  display: flex;
  flex-direction: column;
}

.pr-doc * { color: #000; -webkit-text-fill-color: #000; }

/* ====== CABEÇALHO DO SINDICATO ====== */

.pr-cabecalho {
  display: flex;
  align-items: flex-start;
  gap: 4mm;
  border-bottom: .5mm solid #000;
  padding-bottom: 2mm;
  margin-bottom: 2mm;
}

.pr-cabecalho-compacto { gap: 3mm; padding-bottom: 1.5mm; margin-bottom: 1.5mm; }

.pr-logo {
  width: 16mm;
  height: 16mm;
  object-fit: contain;
  flex-shrink: 0;
}

.pr-cabecalho-compacto .pr-logo { width: 13mm; height: 13mm; }

.pr-cabecalho-texto { flex: 1; min-width: 0; }

.pr-cabecalho-texto h1 {
  font-size: 3.6mm;
  font-weight: bold;
  font-style: italic;
  line-height: 1.15;
  margin-bottom: .8mm;
}

.pr-cabecalho-compacto .pr-cabecalho-texto h1 { font-size: 3.2mm; }

.pr-cabecalho-texto p {
  font-size: 2.1mm;
  line-height: 1.3;
  margin: 0;
}

/* ====== TÍTULO ====== */

.pr-titulo {
  text-align: center;
  font-size: 4.6mm;
  font-weight: bold;
  letter-spacing: .5mm;
  margin: 2mm 0 2.5mm;
}

/* ====== LINHAS PREENCHÍVEIS ====== */

.pr-linha {
  display: flex;
  align-items: baseline;
  gap: 1mm;
  font-size: 3mm;
  margin-bottom: 2.2mm;
  line-height: 1.5;
}

.pr-rot { white-space: nowrap; flex-shrink: 0; }

.pr-val {
  flex: 1;
  min-width: 0;
  border-bottom: .25mm solid #000;
  padding: 0 1mm;
  min-height: 4mm;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Campo de medida fixa: não estica, igual ao espaço do bloco de papel */
.pr-val-fixo { flex: 0 0 auto; }

/* Quando vazio, a linha fica lá para escrever à mão */
.pr-val.pr-vazio::after { content: '\00a0'; }

.pr-par { flex-shrink: 0; }

.pr-data { margin-top: 3mm; }
.pr-data .pr-val { flex: 0 1 auto; }

/* ====== ASSINATURAS ====== */

.pr-assinaturas {
  display: flex;
  justify-content: space-around;
  gap: 8mm;
  margin-top: auto;
  padding-top: 6mm;
}

.pr-assinaturas-ficha { padding-top: 12mm; }

.pr-assinatura {
  flex: 1;
  max-width: 62mm;
  text-align: center;
  font-size: 2.7mm;
}

.pr-assinatura small { display: block; font-size: 2.3mm; }

.pr-risco {
  border-top: .25mm solid #000;
  margin-bottom: .8mm;
}

/* ============================================================
   RECIBO
   ============================================================ */

.pr-recibo { padding: 4mm 5mm; }
.pr-recibo .pr-titulo { margin: 1.5mm 0 2mm; font-size: 4.2mm; }
.pr-recibo .pr-assinaturas { padding-top: 5mm; }

/* ============================================================
   CARTEIRINHA — 85 × 54 mm
   ============================================================ */

.pr-carteirinha {
  padding: 2.5mm;
  border: .3mm solid #000;
  font-family: Arial, Helvetica, sans-serif;
}

.pr-cart-topo {
  text-align: center;
  border-bottom: .25mm solid #000;
  padding-bottom: 1mm;
  margin-bottom: 1.5mm;
}

.pr-cart-topo h1 { font-size: 2.1mm; font-weight: bold; line-height: 1.2; }
.pr-cart-topo p { font-size: 1.7mm; margin-top: .3mm; }

.pr-cart-corpo { display: flex; gap: 2.5mm; flex: 1; }

.pr-cart-foto {
  width: 18mm;
  height: 24mm;
  border: .25mm solid #000;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.8mm;
  flex-shrink: 0;
  overflow: hidden;
}

.pr-cart-foto img { width: 100%; height: 100%; object-fit: cover; }

.pr-cart-dados { flex: 1; min-width: 0; font-size: 2.2mm; display: flex; flex-direction: column; gap: 1mm; }
.pr-cart-dados b { font-size: 1.9mm; letter-spacing: .1mm; }
.pr-cart-dados .pr-val { border-bottom-width: .2mm; min-height: 3mm; font-size: 2.2mm; }
.pr-cart-nome { font-size: 2.4mm; font-weight: bold; }

.pr-cart-rodape { margin-top: auto; padding-top: 3mm; text-align: center; font-size: 1.7mm; }
.pr-cart-rodape .pr-risco { width: 34mm; margin: 0 auto .5mm; }

/* Verso da carteirinha */

.pr-carteirinha-verso { justify-content: space-between; }

.pr-cart-verso-topo {
  text-align: center;
  font-size: 2.3mm;
  font-weight: bold;
  letter-spacing: .3mm;
  border-bottom: .25mm solid #000;
  padding-bottom: 1mm;
}

.pr-cart-verso-dados { font-size: 2.1mm; display: flex; flex-direction: column; gap: 1.2mm; margin-top: 1.5mm; }
.pr-cart-verso-dados .pr-val { border-bottom-width: .2mm; min-height: 3mm; }

.pr-cart-verso-nota { font-size: 1.7mm; line-height: 1.35; text-align: justify; margin: 1.5mm 0; }

.pr-cart-verso-assinatura { text-align: center; font-size: 1.7mm; }
.pr-cart-verso-assinatura .pr-risco { width: 32mm; margin: 0 auto .5mm; }

.pr-cart-verso-rodape {
  text-align: center;
  font-size: 1.4mm;
  line-height: 1.3;
  border-top: .2mm solid #000;
  padding-top: .8mm;
}

/* ============================================================
   FICHA DE FILIAÇÃO — A4
   ============================================================ */

.pr-ficha { padding: 10mm; font-family: Arial, Helvetica, sans-serif; }
.pr-ficha .pr-titulo { font-size: 5mm; margin: 3mm 0 4mm; }

.pr-ficha-secao {
  background: #e8e8e8;
  border: .25mm solid #000;
  padding: 1mm 2mm;
  font-size: 2.8mm;
  font-weight: bold;
  letter-spacing: .3mm;
  margin: 3mm 0 1.5mm;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

.pr-ficha-grade {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5mm;
}

.pr-ficha-campo { display: flex; flex-direction: column; min-width: 0; }

.pr-ficha-rot {
  font-size: 2mm;
  text-transform: uppercase;
  letter-spacing: .1mm;
}

.pr-ficha-val {
  font-size: 2.8mm;
  border-bottom: .25mm solid #000;
  min-height: 4.5mm;
  padding-bottom: .3mm;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pr-ficha-declaracao {
  font-size: 2.6mm;
  line-height: 1.5;
  text-align: justify;
  margin: 6mm 0 4mm;
  padding: 2.5mm;
  border: .25mm solid #000;
}

/* ============================================================
   CARNÊ — A4 com 12 canhotos
   ============================================================ */

.pr-carne { padding: 8mm; font-family: Arial, Helvetica, sans-serif; }
.pr-carne .pr-titulo { font-size: 4.4mm; margin: 2mm 0 2.5mm; }

.pr-carne-cabecalho {
  display: flex;
  justify-content: space-between;
  gap: 4mm;
  font-size: 2.8mm;
  border: .25mm solid #000;
  padding: 1.5mm 2mm;
  margin-bottom: 3mm;
}

.pr-carne-grade {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2mm;
  flex: 1;
}

.pr-canhoto {
  display: flex;
  border: .25mm solid #000;
  min-height: 17mm;
  overflow: hidden;
}

.pr-canhoto-mes {
  width: 14mm;
  flex-shrink: 0;
  background: #eee;
  border-right: .25mm dashed #000;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 2.8mm;
  font-weight: bold;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

.pr-canhoto-mes small { font-size: 1.9mm; font-weight: normal; }

.pr-canhoto-corpo {
  flex: 1;
  min-width: 0;
  padding: 1.2mm 1.8mm;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  font-size: 2.2mm;
}

.pr-canhoto-nome {
  font-weight: bold;
  font-size: 2.4mm;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pr-canhoto-linha { display: flex; justify-content: space-between; gap: 2mm; }

.pr-canhoto-risco {
  border-top: .2mm solid #000;
  padding-top: .5mm;
  font-size: 1.9mm;
}

/* ============================================================
   PRÉVIA NA TELA
   A folha é desenhada no tamanho real e depois reduzida com scale()
   só para caber no monitor. As medidas em mm continuam exatas.
   ============================================================ */

.previa-palco {
  min-width: 0;
  background: var(--fundo-alt);
  border: 1px solid var(--borda);
  border-radius: var(--r3);
  padding: var(--e5);
  overflow: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--e5);
  min-height: 320px;
}

/* A folha é desenhada em tamanho real e reduzida com scale(). A caixa de
   layout continuaria com o tamanho original e empurraria a página para o
   lado no celular — por isso o JS também fixa width/height já reduzidos. */
.previa-envelope {
  transform-origin: top left;
  flex-shrink: 0;
  overflow: hidden;
}

.previa-rotulo {
  font-size: .78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--texto-3);
  text-align: center;
  margin-bottom: var(--e2);
}

.previa-palco .pr-folha {
  box-shadow: var(--sombra-2);
  border: 1px solid var(--borda);
}

/* A área que vai para o papel fica escondida na tela: quem aparece
   para a pessoa é a prévia reduzida. Na impressão elas trocam de lugar. */
#areaImpressao { display: none; }

/* ============================================================
   IMPRESSÃO DE VERDADE
   Some tudo menos as folhas. O @page (tamanho e margem) é injetado
   por impressao.js, porque @page não aceita variável CSS.
   ============================================================ */

@media print {
  html, body {
    background: #fff !important;
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
    height: auto !important;
  }

  /* Nada da interface vai para o papel */
  .nav, .no-print, .toasts, .modal, .previa-rotulo,
  .container > *:not(#areaImpressao),
  #areaImpressao > .no-print {
    display: none !important;
  }

  .container { max-width: none !important; margin: 0 !important; padding: 0 !important; }

  #areaImpressao { display: block !important; }

  /* Na impressão a folha perde o palco, a sombra e a redução de escala */
  .previa-palco {
    display: block !important;
    background: none !important;
    border: none !important;
    padding: 0 !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  .previa-envelope { transform: none !important; }

  .pr-folha {
    box-shadow: none !important;
    border: none !important;
    margin: 0 !important;
  }

  /* Fundos cinza (seções da ficha, meses do carnê) precisam sair impressos */
  * {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }
}
