/* ══════════════════════════════════════════════════════════════
   RECIBO — formulário + pré-visualização (public/panels/recibo.html)
   ══════════════════════════════════════════════════════════════ */

.recibo-app{display:grid;grid-template-columns:minmax(320px,420px) 1fr;gap:var(--space-4);align-items:start;}
@media (max-width:960px){.recibo-app{grid-template-columns:1fr;}}

.recibo-form-card{padding:var(--space-4);}
.recibo-card-title{display:flex;align-items:center;margin:0 0 var(--space-3);font-size:14px;font-weight:700;color:var(--text);}

.recibo-preview-wrap{position:sticky;top:calc(var(--shell-offset,0px) + 12px);}
.recibo-preview-scroll{overflow:auto;max-height:calc(100vh - 140px);border-radius:var(--radius);background:var(--surface-2);padding:var(--space-4);display:flex;justify-content:center;}

/* Campo obrigatório vazio, sinalizado após tentativa de download */
.rec-input-erro{border-color:var(--danger) !important;box-shadow:0 0 0 1px var(--danger) !important;}

/* ── Folha do recibo ───────────────────────────────────────────
   Documento imprimível: fundo sempre branco/tinta escura, independente
   do tema ativo do sistema. Cores extraídas do logotipo oficial da
   Tropical Color (azul #003278, dourado #FAC800, laranja #F08C00). */
:root{
  --rec-azul:#003278;
  --rec-azul-2:#0a4faa;
  --rec-dourado:#e0a900;
  --rec-laranja:#f08c00;
  --rec-texto:#1b2233;
  --rec-muted:#6b7288;
  --rec-linha:#c7ccd8;
}

.recibo-doc{
  width:720px; max-width:100%;
  background:#fff; color:var(--rec-texto);
  border-radius:0; /* cantos retos: a moldura funciona como guia de corte na impressão */
  border:1.5px solid var(--rec-azul); /* borda real — nunca "vaza" o friso de cima, ao contrário do box-shadow usado antes */
  box-shadow:0 18px 44px -16px rgba(10,16,32,.45);
  box-sizing:border-box;
  overflow:hidden; /* trava qualquer filho (friso, gradiente) exatamente dentro da borda */
}

/* Friso é um bloco real (não um background sobreposto) — assim fica preso
   dentro da borda por construção, sem risco de sub-pixel "vazando" nos cantos. */
.recibo-doc-faixa{height:6px;background:linear-gradient(90deg,var(--rec-azul),var(--rec-dourado) 50%,var(--rec-laranja));}

.recibo-doc-inner{
  padding:26px 36px 26px;
  font-family:'Georgia','Times New Roman',serif;
  position:relative;
}

.recibo-doc-top{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;padding-bottom:16px;margin-bottom:18px;border-bottom:2.5px solid var(--rec-azul);}
.recibo-logo{height:44px;width:auto;object-fit:contain;justify-self:start;}
.recibo-doc-titulo{margin:0;text-align:center;font-size:24px;letter-spacing:6px;color:var(--rec-azul);font-weight:700;text-transform:uppercase;}

.recibo-valor-box{justify-self:end;display:flex;flex-direction:column;align-items:center;gap:3px;background:linear-gradient(180deg,#f6f8fc,#eef1f8);border:1.5px solid var(--rec-azul);border-radius:8px;padding:7px 20px;min-width:160px;}
.recibo-valor-box>span{font-family:'Segoe UI',Arial,sans-serif;font-size:9.5px;letter-spacing:2px;color:var(--rec-muted);font-weight:700;text-transform:uppercase;}
.recibo-valor-box strong{display:flex;align-items:baseline;gap:4px;white-space:nowrap;line-height:1;}
/* Tamanhos fixados explicitamente (não por herança) — o design system tem
   uma regra global de "span" que, sem isso, vencia por especificidade e
   deixava o número minúsculo. */
.recibo-valor-cifra{font-family:'Segoe UI',Arial,sans-serif !important;font-size:15px !important;font-weight:700 !important;color:var(--rec-laranja) !important;font-style:normal;letter-spacing:0;}
.recibo-valor-num{font-family:'Segoe UI',Arial,sans-serif !important;font-size:27px !important;font-weight:700 !important;color:var(--rec-azul) !important;letter-spacing:-.3px;}

.recibo-linha{font-size:14.5px;line-height:2;margin:0 0 6px;font-family:'Segoe UI',Arial,sans-serif;color:var(--rec-texto);}
.recibo-recebemos{margin-bottom:10px;}
.recibo-linha strong{font-weight:700;border-bottom:1px dotted var(--rec-linha);padding:0 3px;}

.recibo-campos{display:flex;flex-direction:column;gap:12px;margin:18px 0 4px;font-family:'Segoe UI',Arial,sans-serif;font-size:14px;padding-top:14px;border-top:1px dashed var(--rec-linha);}
.recibo-campo{display:flex;flex-direction:column;gap:2px;}
.recibo-campo span{font-size:10px;letter-spacing:1.2px;text-transform:uppercase;color:var(--rec-muted);font-weight:700;}
.recibo-campo strong{font-size:14.5px;color:var(--rec-texto);font-weight:600;border-bottom:1px dotted var(--rec-linha);padding-bottom:3px;}

.recibo-data-linha{font-family:'Segoe UI',Arial,sans-serif;font-size:14px;text-align:right;margin:18px 0 0;color:var(--rec-texto);}
.recibo-data-linha strong{font-weight:700;color:var(--rec-azul);}

.recibo-assinatura{display:flex;flex-direction:column;align-items:center;gap:7px;margin:34px auto 18px;width:62%;}
.recibo-assinatura-linha{width:100%;border-top:1.5px solid var(--rec-azul);}
.recibo-assinatura span{font-family:'Segoe UI',Arial,sans-serif;font-size:11px;color:var(--rec-muted);letter-spacing:.6px;text-transform:uppercase;}

.recibo-endereco-empresa{text-align:center;font-family:'Segoe UI',Arial,sans-serif;font-size:10.5px;color:var(--rec-muted);letter-spacing:.3px;margin:0;border-top:1px solid var(--rec-linha);padding-top:10px;}