/* FreeClinical — UI funcional, clareza > estética (beta) */
* { box-sizing: border-box; }
body { margin: 0; font: 15px/1.45 system-ui, "Segoe UI", Arial, sans-serif; background: #f2f4f7; color: #15202b; }
/* faixa de AMBIENTE (D-58): largura total, alto contraste, inequívoca — só aparece quando /api/me traz `ambiente` */
#faixa-ambiente { background: #b45309; color: #fff; text-align: center; font-weight: 700; font-size: 14px; letter-spacing: .06em; text-transform: uppercase; padding: 8px 12px; }
#faixa-ambiente[hidden] { display: none; }
/* toast global (erro sem catch, ex.: 403 do modo consulta) — fixo embaixo, não cobre a faixa nem o cabeçalho */
#avisos-globais { position: fixed; bottom: 16px; left: 50%; transform: translateX(-50%); z-index: 1000; max-width: min(92vw, 640px); }
#avisos-globais .erro { box-shadow: 0 4px 16px #0003; }
header { background: #0d3b66; color: #fff; padding: 10px 18px; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
header h1 { font-size: 18px; margin: 0; }
header .quem { margin-left: auto; font-size: 13px; opacity: .9; }
header button { background: #fff2; color: #fff; border: 1px solid #fff5; border-radius: 6px; padding: 4px 10px; cursor: pointer; }
nav { background: #10477c; padding: 0 12px; display: flex; flex-wrap: wrap; }
nav a { color: #cfe3f7; padding: 9px 13px; text-decoration: none; font-size: 14px; border-bottom: 3px solid transparent; }
nav a.ativa { color: #fff; border-bottom-color: #ffd166; font-weight: 600; }
main { padding: 16px 18px; max-width: 1240px; margin: 0 auto; }
h2 { font-size: 17px; margin: 6px 0 10px; }
h3 { font-size: 15px; margin: 14px 0 6px; }
.cartao { background: #fff; border: 1px solid #dde3ea; border-radius: 8px; padding: 12px 14px; margin-bottom: 14px; }
table { border-collapse: collapse; width: 100%; background: #fff; }
th, td { border: 1px solid #dde3ea; padding: 6px 8px; text-align: left; font-size: 13.5px; vertical-align: top; }
th { background: #eef2f6; }
tr:hover td { background: #f7fafc; }
button, .btn { background: #0d3b66; color: #fff; border: 0; border-radius: 6px; padding: 6px 12px; cursor: pointer; font-size: 13.5px; }
button.mini { padding: 3px 8px; font-size: 12.5px; }
button.cinza { background: #64748b; }
button.verde { background: #1a7f37; }
button.ambar { background: #b45309; }
button.vermelho { background: #b42318; }
button:disabled { opacity: .5; cursor: default; }
input, select, textarea { padding: 6px 8px; border: 1px solid #c4ccd6; border-radius: 6px; font-size: 14px; background: #fff; }
label { font-size: 13px; color: #445; display: block; margin-bottom: 2px; }
.linha { display: flex; gap: 12px; flex-wrap: wrap; align-items: flex-end; margin: 8px 0; }
.linha > div { min-width: 140px; }
.aviso { background: #fff7e6; border: 1px solid #e8b046; color: #7a4d00; padding: 8px 12px; border-radius: 6px; margin: 6px 0; }
.erro { background: #ffe9e6; border: 1px solid #e0705f; color: #8a1c10; padding: 8px 12px; border-radius: 6px; margin: 6px 0; }
.ok { background: #e7f6ec; border: 1px solid #6fbf87; color: #14522a; padding: 8px 12px; border-radius: 6px; margin: 6px 0; }
.chip { display: inline-block; border-radius: 10px; padding: 1px 9px; font-size: 12px; font-weight: 600; }
.chip.aberto { background: #dbeafe; color: #1d4ed8; }
.chip.fechado { background: #dcfce7; color: #166534; }
.chip.cancelado { background: #fee2e2; color: #991b1b; }
.chip.pendente { background: #fef9c3; color: #854d0e; }
.chip.executado, .chip.recebido { background: #dbeafe; color: #1d4ed8; }
.chip.conferido, .chip.CONFIRMED, .chip.assinado, .chip.em_dia { background: #dcfce7; color: #166534; }
.chip.dispensado, .chip.externo, .chip.nunca { background: #e5e7eb; color: #374151; }
.chip.particular { background: #ffedd5; color: #9a3412; border: 1px solid #fdba74; }
.chip.PENDING, .chip.SENDING, .chip.CONFIRMING, .chip.pre_impresso, .chip.vence_breve { background: #fef3c7; color: #92400e; }
.chip.RECONCILING, .chip.FAILED, .chip.vencido { background: #fee2e2; color: #991b1b; }
.chip.concluido { background: #dbeafe; color: #1d4ed8; }
.mono { font-family: Consolas, monospace; font-size: 12.5px; }
.mudo { color: #66788a; font-size: 12.5px; }
.grade2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 900px) { .grade2 { grid-template-columns: 1fr; } }
details summary { cursor: pointer; font-weight: 600; margin: 6px 0; }

/* PWA/mobile (D-20 E1): tabela larga rola DENTRO do cartão — a página nunca rola de lado */
.cartao { overflow-x: auto; }

/* Painel "conferir guia" (Marco, 17/09): a guia ORIGINAL ganha mais largura que os campos — numa guia A4 densa,
   50/50 deixava o papel ilegível. `minmax(0,…)` impede o iframe de estourar a coluna. Em tela estreita, empilha:
   ler a guia espremida em 3 cm de largura não é conferir. */
.g-conf-painel { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); gap: 14px; padding: 10px 4px; }
@media (max-width: 1100px) { .g-conf-painel { grid-template-columns: minmax(0, 1fr); } }