/* idade-gestacional.css — a calculadora de idade gestacional e o calendario do pre-natal (/ferramentas-gratis/idade-gestacional).
   Prefixo ig-. So carrega nesta ferramenta. Na tela: os campos e o resultado (fer-grade) e, embaixo, a previa da folha
   A4. No papel sai so a folha (fer-so-folhas), em mm: 186 x 273 mm de area util (A4 com 12 mm de margem). */

.ig-app { display: flex; flex-direction: column; gap: 1.25rem; min-width: 0; }
.ig-linha { display: flex; flex-wrap: wrap; gap: .75rem; align-items: end; }
.ig-data { flex: 1 1 10rem; min-width: 0; }
.ig-curto { flex: 0 1 7rem; min-width: 0; }
.ig-em { display: flex; gap: .5rem; align-items: stretch; }
.ig-em .fer-campo { flex: 1 1 auto; }
.ig-em .fer-btn { flex: 0 0 auto; }
.ig-detalhes { font-family: inherit; font-size: .84rem; }

/* o que aparece em cada modo */
.ig-app:not([data-modo="dum"]) .ig-so-dum,
.ig-app:not([data-modo="fiv"]) .ig-so-fiv,
.ig-app:not([data-modo="usg"]) .ig-so-usg { display: none; }

.ig-cal { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 1rem; padding-top: 1.1rem; border-top: 1px solid var(--border); }
.ig-cal > div { flex: 1 1 18rem; min-width: 0; }
.ig-cal__t { margin: 0 0 .25rem; font-size: 1.1rem; letter-spacing: -.01em; }

/* ---- a folha A4 (papel branco nos dois temas; medidas em mm) */
.ig-folha { padding: 12mm; color: #111; font-size: 8.4pt; line-height: 1.32; display: flex; flex-direction: column; gap: 2.8mm; }
.ig-folha b { font-weight: 700; }
.ig-f-topo { display: flex; justify-content: space-between; align-items: flex-end; gap: 6mm; padding-bottom: 2mm; border-bottom: .5mm solid #111; }
.ig-f-tit { margin: 0; font-size: 17pt; line-height: 1.1; font-weight: 800; letter-spacing: -.01em; color: #111; }
.ig-f-sub { margin: .8mm 0 0; font-size: 8pt; color: #444; }
.ig-f-aviso { margin: 0; max-width: 78mm; font-size: 7.4pt; line-height: 1.3; color: #444; text-align: right; }
.ig-f-datas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.5mm; }
.ig-f-caixa { border: .35mm solid #333; border-radius: 2mm; padding: 1.8mm 2.5mm; }
.ig-f-caixa span { display: block; font-size: 6.8pt; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #555; }
.ig-f-caixa b { display: block; margin-top: .4mm; font-size: 12.5pt; line-height: 1.15; font-weight: 800; font-variant-numeric: tabular-nums; }
.ig-f-caixa small { display: block; margin-top: .3mm; font-size: 7.2pt; color: #555; }
.ig-f-tris { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.5mm; }
.ig-f-tri { border-left: .9mm solid #111; padding: .6mm 0 .6mm 2.4mm; display: flex; flex-direction: column; gap: .2mm; }
.ig-f-tri b { font-size: 9.5pt; }
.ig-f-tri span { font-size: 7.8pt; color: #333; font-variant-numeric: tabular-nums; }
.ig-f-h { margin: 0 0 1.2mm; padding-bottom: .7mm; border-bottom: .25mm solid #999; font-size: 8.6pt; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: #111; }
.ig-f-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5mm; }
.ig-f-lista { margin: 0; padding-left: 3.6mm; list-style: disc; }
.ig-f-lista li { margin: 0 0 .65mm; }
.ig-f-exames { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4mm; }
.ig-f-sub2 { display: block; margin-bottom: .8mm; font-size: 8.4pt; }
.ig-f-nota { margin: 1.2mm 0 0; font-size: 7.6pt; color: #333; }
.ig-f-semanas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 5mm; font-variant-numeric: tabular-nums; }
.ig-f-semanas ul { margin: 0; padding: 0; list-style: none; }
.ig-f-semanas li { display: flex; justify-content: space-between; gap: 2mm; padding: .42mm .6mm .42mm 0; border-bottom: .2mm dotted #aaa; font-size: 7.9pt; }
.ig-f-semanas li span:first-child { font-weight: 700; }
.ig-f-rod { margin-top: auto; padding-top: 1.4mm; border-top: .25mm solid #999; font-size: 6.9pt; line-height: 1.35; color: #555; }

/* A janela (o @media de sempre) e a PAGINA (o @container: a Dori aberta tira espaco sem mudar a janela; N = janela - 112;
   ate 768 px, o mesmo numero) */
@media (max-width: 480px) {
    .ig-curto { flex-basis: 6rem; }
    .ig-cal .fer-btn { width: 100%; }
}
@container pagina (max-width: 480px) {
    .ig-curto { flex-basis: 6rem; }
    .ig-cal .fer-btn { width: 100%; }
}

/* No papel: so a folha, 1 pagina A4 em pe */
@media print {
    @page { size: A4 portrait; margin: 12mm; }
    .ig-app { display: block; }
    /* 1 mm dos lados: o Chrome corta o que encosta na borda da area de impressao (o ultimo digito da data saia cortado) */
    .ig-app .fer-folha.ig-folha { padding: 0 1mm; min-height: 0; height: 272mm; }
}
