/* ===== Documento "Previsão de Honorários" — A4 retrato =====
   A mesma marcação serve para a prévia (tela de revisão) e para a impressão. */

.folha {
  width: 210mm;
  min-height: 297mm;
  background: #fff;
  color: var(--grafite);
  font-family: var(--body);
  font-size: 10.5pt;
  line-height: 1.45;
  padding: 14mm 14mm 12mm;
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
}

/* Onda decorativa discreta no rodapé da folha */
.folha::after {
  content: "";
  position: absolute; left: 0; right: 0; bottom: 0;
  height: 7mm;
  background: linear-gradient(90deg, var(--turquesa), var(--espuma));
  border-radius: 100% 100% 0 0 / 180% 180% 0 0;
}

/* --- Cabeçalho --- */
.doc-cabeca {
  display: flex; align-items: center; gap: 8mm;
  padding-bottom: 5mm;
  border-bottom: 1mm solid var(--turquesa);
}
.doc-logo { width: 30mm; height: 30mm; object-fit: contain; flex: none; }
.doc-titulos { flex: 1; }
.doc-titulos h1 {
  font-family: var(--display);
  font-size: 23pt; font-weight: 800;
  color: var(--grafite);
  letter-spacing: -.01em;
}
.doc-titulos .doc-clinica {
  color: var(--fundo-mar); font-weight: 700;
  font-size: 9pt; letter-spacing: .14em; text-transform: uppercase;
  margin-top: 1mm;
}

/* --- Faixa de informações --- */
.doc-info {
  display: flex; gap: 4mm; flex-wrap: wrap;
  margin: 5mm 0 6mm;
}
.doc-info-item {
  flex: 1 1 30%;
  background: var(--menta);
  border-radius: 3mm;
  padding: 2.5mm 4mm;
}
.doc-info-item .rotulo {
  display: block;
  font-size: 7pt; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--fundo-mar-escuro);
}
.doc-info-item .valor { font-weight: 700; font-size: 10.5pt; }

/* --- Planos --- */
.doc-plano {
  border: .5mm solid var(--espuma);
  border-radius: 4mm;
  padding: 5mm 5mm 4mm;
  margin-bottom: 5mm;
  break-inside: auto;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}
.doc-plano-titulo {
  font-family: var(--display);
  font-size: 13pt; font-weight: 700;
  color: var(--fundo-mar);
  margin-bottom: 3mm;
  display: flex; align-items: center; gap: 3mm;
  break-after: avoid;
  break-inside: avoid;
}
.doc-plano-titulo::before {
  content: "";
  width: 6mm; height: 1.2mm; border-radius: 1mm;
  background: var(--turquesa);
}

.doc-item {
  display: flex; justify-content: space-between; align-items: center; gap: 6mm;
  padding: 2.2mm 0;
  border-bottom: .3mm dashed var(--espuma);
  break-inside: avoid;
}
.doc-item:last-of-type { border-bottom: none; }
.doc-item-nome { flex: 1; }
.doc-item-elementos { display: block; font-size: 8.5pt; color: var(--muted); margin-top: .6mm; }
.doc-item-precos { display: flex; align-items: center; gap: 3mm; white-space: nowrap; }
.doc-preco-original {
  text-decoration: line-through;
  color: var(--muted); font-size: 9pt;
}
.doc-preco {
  font-weight: 700; font-size: 11pt; color: var(--grafite);
}
.doc-selo-desconto {
  font-size: 6.5pt; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: #fff; background: var(--fundo-mar);
  border-radius: 10mm; padding: .8mm 2.5mm;
}
.doc-preco-cortesia { color: var(--fundo-mar); }

.doc-plano-total {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 3mm;
  background: var(--grafite); color: #fff;
  border-radius: 3mm;
  padding: 2.6mm 4mm;
  font-weight: 700; font-size: 11.5pt;
  break-inside: avoid;
}
.doc-plano-total .doc-preco { color: var(--turquesa); font-size: 13pt; }

.doc-obs {
  margin-top: 3mm;
  background: var(--porcelana);
  border: .3mm solid var(--espuma);
  border-radius: 3mm;
  padding: 2.5mm 4mm;
  font-size: 9.5pt;
  break-inside: avoid;
}
.doc-obs strong { color: var(--fundo-mar); }

.doc-escolha {
  text-align: center; font-size: 9pt; color: var(--muted);
  margin: -1mm 0 5mm;
}

/* --- Condições de pagamento (rodapé fixo) --- */
.doc-condicoes {
  margin-top: auto; /* empurra para o fim da folha */
  background: var(--menta);
  border-radius: 4mm;
  padding: 4mm 5mm 4.5mm;
  break-inside: avoid;
}
.doc-condicoes h2 {
  font-family: var(--display);
  font-size: 11.5pt; font-weight: 700; color: var(--fundo-mar);
  margin-bottom: 2mm;
}
.doc-condicoes ul { list-style: none; }
.doc-condicoes li {
  font-size: 9pt;
  padding-left: 4.5mm;
  position: relative;
  margin-bottom: 1.2mm;
}
.doc-condicoes li::before {
  content: "";
  position: absolute; left: 0; top: 1.7mm;
  width: 2mm; height: 2mm; border-radius: 50%;
  background: var(--turquesa);
}

.doc-rodape {
  margin-top: 3.5mm;
  padding-bottom: 5mm;
  text-align: center;
  font-size: 8pt; color: var(--muted);
}

/* --- Prévia na tela (escala via zoom, calculada no JS) --- */

/* --- Impressão --- */
@page { size: A4 portrait; margin: 0; }

@media print {
  body { background: #fff; }
  #documento { display: block !important; }
  .folha {
    width: 210mm; min-height: 297mm;
    transform: none;
    box-shadow: none;
  }
}

/* Fora da impressão, o #documento raiz fica escondido (a revisão usa uma cópia) */
#documento { display: none; }

/* ===== Relatório — A4 paisagem =====
   O @page paisagem é injetado dinamicamente só na hora de imprimir o relatório
   (ver imprimirPaisagem() em admin.js) — uma página nomeada aqui não bastava:
   como o @page padrão (retrato, acima) também existe na mesma folha de estilos,
   o Chrome usava "Retrato" como padrão na caixa de diálogo de impressão mesmo
   com o conteúdo já saindo em paisagem. */
.folha-relatorio { font-family: var(--body); color: var(--grafite); }
.rel-cabeca {
  display: flex; align-items: center; justify-content: space-between; gap: 6mm;
  padding-bottom: 4mm; margin-bottom: 5mm;
  border-bottom: 1mm solid var(--turquesa);
}
.rel-cabeca h1 { font-family: var(--display); font-size: 16pt; font-weight: 800; }
.rel-cabeca .rel-clinica { color: var(--fundo-mar); font-weight: 700; font-size: 8pt; letter-spacing: .12em; text-transform: uppercase; }
.rel-cabeca .rel-periodo { text-align: right; font-size: 9.5pt; }
.rel-resumo-impressao { display: flex; gap: 6mm; margin-bottom: 4mm; font-size: 9.5pt; }
.rel-resumo-impressao strong { color: var(--fundo-mar); }

.rel-tabela { width: 100%; border-collapse: collapse; font-size: 9pt; }
.rel-tabela th, .rel-tabela td { text-align: left; padding: 1.8mm 2.5mm; border-bottom: .3mm solid var(--espuma); }
.rel-tabela th { background: var(--porcelana); font-size: 7.5pt; text-transform: uppercase; letter-spacing: .05em; }
.rel-tabela thead { display: table-header-group; }
.rel-tabela tr { break-inside: avoid; }
.rel-tabela td.col-valor { font-weight: 700; white-space: nowrap; }

@media print {
  #documento-relatorio { display: block !important; }
}
#documento-relatorio { display: none; }