/* Controlo de Selos PROSEFA — Angotabacos
   Folha de estilo (independente, funciona no PTISP). */

:root{
  --bg:#f6f5f0; --card:#ffffff; --border:#e4e2d8; --border2:#d3d1c7;
  --text:#23221f; --muted:#6f6e67; --faint:#9a988f;
  --accent:#9b2c2c;            /* vermelho discreto para titulos (marca) */
  --amber-bg:#faeeda; --amber-tx:#7a4a0a;
  --coral-bg:#faece7; --coral-tx:#8a3318;
  --blue-bg:#e6f1fb;  --blue-tx:#0c447c;
  --green-bg:#eef5e6; --green-tx:#2f5d14;
  --red-bg:#fcebeb;   --red-tx:#911f1f;
  --warn-bg:#faeeda;  --warn-tx:#7a4a0a;
}

*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:15px;line-height:1.6}

/* Cabecalho e navegacao */
.topo{background:var(--card);border-bottom:1px solid var(--border);
  padding:0 24px;display:flex;align-items:center;gap:28px;flex-wrap:wrap}
.marca{font-weight:600;font-size:16px;padding:16px 0}
.marca span{color:var(--faint);font-weight:400}
.topo nav{display:flex;gap:4px;flex-wrap:wrap}
.topo nav a{padding:16px 12px;color:var(--muted);text-decoration:none;font-size:14px;
  border-bottom:2px solid transparent}
.topo nav a:hover{color:var(--text)}
.topo nav a.activo{color:var(--accent);border-bottom-color:var(--accent);font-weight:500}

.conteudo{max-width:880px;margin:0 auto;padding:28px 24px 60px}
.rodape{max-width:880px;margin:0 auto;padding:20px 24px;color:var(--faint);font-size:12px}

h1{font-size:24px;font-weight:600;margin:0 0 18px}
h2{font-size:18px;font-weight:600;margin:0 0 12px}
.sec{font-size:12px;color:var(--faint);letter-spacing:.04em;text-transform:uppercase;
  margin:26px 0 10px}

/* Cartoes */
.card{background:var(--card);border:1px solid var(--border);border-radius:12px;
  padding:18px 20px;margin-bottom:14px}
.card.atencao{border-color:var(--border2)}

/* Cartoes-metrica */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}
.mc{background:#fbfaf6;border:1px solid var(--border);border-radius:10px;padding:14px 16px}
.mc .lb{font-size:13px;color:var(--muted);margin:0 0 6px}
.mc .nm{font-size:26px;font-weight:600;margin:0}
.mc .nm.ok{color:var(--green-tx)}

/* Botoes */
button,.btn{font:inherit;background:var(--card);border:1px solid var(--border2);
  color:var(--text);padding:9px 16px;border-radius:8px;cursor:pointer}
button:hover,.btn:hover{background:#f0efe9}
button:disabled{opacity:.5;cursor:not-allowed}
.btn-principal{background:var(--accent);border-color:var(--accent);color:#fff}
.btn-principal:hover{background:#852525}

/* Campos */
input[type=text],input[type=file],select{font:inherit;padding:8px 10px;
  border:1px solid var(--border2);border-radius:8px;background:#fff;color:var(--text)}
input[type=file]{padding:6px}

/* Tabela */
table{width:100%;border-collapse:collapse;font-size:14px}
th{text-align:left;color:var(--muted);font-weight:500;padding:8px 6px;
  border-bottom:1px solid var(--border2)}
td{padding:9px 6px;border-bottom:1px solid var(--border)}
.mono{font-family:ui-monospace,"SF Mono",Consolas,Menlo,monospace;font-size:13px}

/* Linhas de aviso / alarme */
.flag{display:flex;align-items:center;gap:12px;background:var(--card);
  border:1px solid var(--border2);border-radius:10px;padding:12px 14px;margin-bottom:8px}
.flag .tt{margin:0;font-size:14px;font-weight:500}
.flag .sb{margin:2px 0 0;font-size:12px;color:var(--muted)}
.flag .ic{font-size:20px;line-height:1}

/* Pills / etiquetas */
.pill{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:500;
  padding:4px 11px;border-radius:8px}
.dot{width:9px;height:9px;border-radius:50%;display:inline-block;margin-right:8px}

.amber{background:var(--amber-bg);color:var(--amber-tx)}
.coral{background:var(--coral-bg);color:var(--coral-tx)}
.blue {background:var(--blue-bg); color:var(--blue-tx)}
.green{background:var(--green-bg);color:var(--green-tx)}
.red  {background:var(--red-bg);  color:var(--red-tx)}
.warn {background:var(--warn-bg); color:var(--warn-tx)}

/* Zona de carregamento de ficheiro */
.drop{display:flex;align-items:center;gap:14px;background:#fbfaf6;
  border:1px dashed var(--border2);border-radius:12px;padding:18px 20px}

/* Mensagens */
.aviso-erro{background:var(--red-bg);color:var(--red-tx);border:1px solid #f0c9c9;
  border-radius:10px;padding:14px 16px;margin-bottom:16px}
.aviso-ok{background:var(--green-bg);color:var(--green-tx);border:1px solid #cfe3bd;
  border-radius:10px;padding:14px 16px;margin-bottom:16px}

.barra-accoes{display:flex;justify-content:flex-end;gap:10px;margin-top:18px;
  padding-top:14px;border-top:1px solid var(--border)}