:root{
  --header-bg: #d9dde1;   /* cinza cabeçalho */
  --header-text: #2b2f33; /* texto cabeçalho */
  --row-alt: #f5f7f9;     /* zebra */
  --border: #c6cbd1;      /* bordas */
  --text: #222;
  --badge-red: #d32f2f;
  --badge-yellow: #f9a825;
  --badge-green: #2e7d32;
}
body{
  margin: 0; font-family: "Segoe UI", Roboto, Arial, sans-serif; color: var(--text);
  background: #fff;
}
header{
  padding: 16px 20px; border-bottom: 1px solid var(--border);
  display: flex; gap: 16px; align-items: center; flex-wrap: wrap;
}
header h1{ font-size: 18px; margin: 0 12px 0 0; font-weight: 600; }
.file-group{ display:flex; gap:8px; align-items:center; flex-wrap: wrap; }
.filter-group{ display:flex; gap:8px; align-items:center; }
.filter-group label{ display:flex; align-items:center; gap:6px; font-size:14px; color:var(--text); }
.spacer{ flex:1; }
button.primary{
  background:#0067c0; color:#fff; border:none; padding:10px 14px; border-radius:6px; cursor:pointer;
}
button.primary:disabled{ background:#9fb7d0; cursor:not-allowed; }

main{ padding: 14px 20px 40px; display: grid; gap: 28px; }
.table-card{
  border: 1px solid var(--border); border-radius: 6px; overflow: hidden;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
}
.table-title{
  background:#eef2f6; color:#39424e; font-weight:600; padding:10px 14px; border-bottom:1px solid var(--border);
}
.scroll-x{ overflow-x: auto; }

table{ border-collapse: separate; border-spacing: 0; width: 100%; min-width: 980px; }
thead th{
  position: sticky; top: 0;
  background: var(--header-bg); color: var(--header-text);
  font-weight: 600; font-size: 12.5px; text-transform: uppercase; letter-spacing: .3px;
  border-bottom: 1px solid var(--border);
  padding: 8px 10px; white-space: nowrap;
}
tbody td{
  border-bottom: 1px solid var(--border); font-size: 13.5px; padding: 6px 10px; vertical-align: middle;
  max-width: 360px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
tbody tr:nth-child(even){ background: var(--row-alt); }

/* larguras sugeridas (ajuste se necessário) */
th.col-emp, td.col-emp{ width: 160px; }
th.col-int-afet, td.col-int-afet{ width: 160px; }
th.col-km-i, td.col-km-i{ width: 80px; }
th.col-km-f, td.col-km-f{ width: 80px; }
th.col-interf, td.col-interf{ width: 150px; }
th.col-principal, td.col-principal{ width: 340px; }
th.col-alerta, td.col-alerta{ width: 90px; text-align: center; }
th.col-proc, td.col-proc{ width: 170px; }
th.col-data, td.col-data{ width: 120px; }

/* badges de alerta */
.alert-badge{ display:inline-flex; align-items:center; justify-content:center; gap:6px; }
.alert-dot{ width: 18px; height: 18px; border-radius: 50%; display:inline-block; vertical-align: middle; border: 2px solid rgba(0,0,0,.15); }
.a0{ background: var(--badge-red); }    /* nível 0 = vermelho */
.a1{ background: var(--badge-yellow);}  /* nível 1 = amarelo */ 
.a2{ background: var(--badge-green); }   /* nível 2 = verde */

.muted{ color:#6b7280; font-size:12px; }

/* impressão direta do navegador: quebra de página entre cartões */
@media print{
  .table-card{ page-break-inside: avoid; }
  .table-card + .table-card{ page-break-before: always; }
}
