/* smi-trilha.css — cards no quadro e "trilha do dado" (telas Vertimento / SMF / Cálculo do IVV). Complementa smi-shell.css. */
.quadro{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.ccard{background:#fff;border:1px solid var(--nec-gray-20);display:flex;flex-direction:column;gap:10px;padding:16px 20px;position:relative}
.ccard.on{border-color:var(--nec-cyan);box-shadow:inset 0 3px 0 var(--nec-cyan)}
.ccard .tipo{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--nec-gray-60);font-weight:600}
.ccard .nome{font-size:15px;font-weight:700;color:var(--nec-gray-warm)}
.ccard .num{font-size:26px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--nec-gray-warm);line-height:1.1}
.ccard .num small{font-size:12px;font-weight:500;color:var(--nec-gray-60);margin-left:4px}
.ccard .acoes{display:flex;gap:6px;margin-top:auto;padding-top:6px;border-top:1px solid var(--nec-gray-08)}
.farol{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 8px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border-radius:2px;white-space:nowrap}
.farol .d{width:8px;height:8px;border-radius:50%;background:currentColor}
.farol.completo{background:var(--smi-qualidade-boa-fundo);color:var(--smi-qualidade-boa)}
.farol.incompleto{background:var(--smi-qualidade-suspeita-fundo);color:var(--smi-qualidade-suspeita)}
.farol.semdado{background:var(--nec-gray-08);color:var(--smi-sem-dado)}
.farol.divergente{background:var(--smi-qualidade-ruim-fundo);color:var(--smi-qualidade-ruim)}
.farol.retirado{background:var(--smi-reprocessado-fundo);color:var(--smi-reprocessado)}
.ccard.add{border:1px dashed var(--nec-gray-40);background:transparent;align-items:center;justify-content:center;gap:8px;color:var(--nec-cyan);font-weight:600;min-height:150px}
.ccard.add.off{color:var(--nec-gray-40);border-color:var(--nec-gray-20)}
/* gaveta da trilha */
.gaveta{background:#fff;border:1px solid var(--nec-cyan);display:flex;flex-direction:column;gap:0}
.gaveta .gtop{display:flex;align-items:center;gap:16px;padding:14px 24px;border-bottom:1px solid var(--nec-gray-20);background:#e6f5fb}
.gaveta .gtop h2{margin:0;font-size:16px;font-weight:700}
.etapas{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.etapa{padding:18px 20px;border-right:1px solid var(--nec-gray-20);display:flex;flex-direction:column;gap:10px;min-height:280px}
.etapa:last-child{border-right:0}
.etapa .n{display:flex;align-items:center;gap:10px}
.etapa .n b{width:26px;height:26px;border-radius:50%;background:var(--nec-cyan);color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;flex:none}
.etapa .n span{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.etapa .lbl{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--nec-gray-60);font-weight:600}
.etapa .vivo{font-size:24px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1}
.etapa .vivo small{font-size:12px;font-weight:500;color:var(--nec-gray-60);margin-left:4px}
.etapa .form{font-family:"Montserrat",monospace;font-size:12px;background:var(--nec-gray-08);padding:8px 10px;font-variant-numeric:tabular-nums;color:var(--nec-gray-warm);line-height:1.5}
.etapa .cfg{font-size:12px;color:var(--nec-gray-warm);display:flex;flex-direction:column;gap:4px}
.etapa .cfg span{display:flex;justify-content:space-between;gap:8px}
.etapa .cfg span i{font-style:normal;color:var(--nec-gray-60)}
.etapa.bloq{background:var(--nec-gray-08);color:var(--nec-gray-60)}
.etapa.bloq .n b{background:var(--nec-gray-40)}
.etapa.bloq .vivo{color:var(--smi-sem-dado)}
.falta{font-size:12px;padding:8px 10px;background:var(--smi-qualidade-suspeita-fundo);color:var(--smi-qualidade-suspeita);display:flex;gap:6px;align-items:flex-start}
.ok{font-size:12px;padding:8px 10px;background:var(--smi-qualidade-boa-fundo);color:var(--smi-qualidade-boa);display:flex;gap:6px;align-items:center}
.saude{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:.06em;padding:0 8px;height:22px;border-radius:2px}
.saude.ok{background:var(--smi-qualidade-boa-fundo);color:var(--smi-qualidade-boa);padding:0 8px}
.saude.div{background:var(--smi-qualidade-ruim-fundo);color:var(--smi-qualidade-ruim)}
.saude.semred{background:var(--smi-qualidade-suspeita-fundo);color:var(--smi-qualidade-suspeita)}
.saude.aus{background:var(--smi-qualidade-ruim-fundo);color:var(--smi-qualidade-ruim)}
.saude.naocfg{background:var(--nec-gray-08);color:var(--smi-sem-dado)}
.rodape-fixo{background:var(--nec-navy);color:#fff;display:flex;align-items:center;gap:40px;padding:14px 40px;flex:none}
.rodape-fixo .l{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.6);font-weight:600}
.rodape-fixo .v{font-size:24px;font-weight:700;font-variant-numeric:tabular-nums}
.rodape-fixo .v small{font-size:12px;color:rgba(255,255,255,.6);margin-left:4px;font-weight:500}
.rodape-fixo a{color:var(--nec-cyan);font-weight:600;margin-left:auto;display:flex;align-items:center;gap:6px}
/* mapa do IVV */
.mapa{display:grid;grid-template-columns:260px 40px 1fr 40px 300px;gap:0;align-items:center}
.seta{display:flex;align-items:center;justify-content:center;color:var(--nec-gray-40)}
.mcard{background:#fff;border:1px solid var(--nec-gray-20);padding:12px 14px;display:flex;flex-direction:column;gap:4px;color:inherit}
.mcard .tipo{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--nec-gray-60);font-weight:600}
.mcard .nome{font-size:13px;font-weight:700}
.mcard .num{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums}
.mcard .num small{font-size:11px;color:var(--nec-gray-60);font-weight:500;margin-left:3px}
.mcard.res{background:var(--nec-navy);color:#fff;border:0;padding:20px 24px;gap:8px}
.mcard.res .tipo{color:rgba(255,255,255,.6)}
table.t tr.rep td{background:var(--smi-reprocessado-fundo)}
table.t td.mini,table.t th.mini{font-size:11px;padding:6px 8px}

/* --- formulário suspenso (modal na própria tela) --- */
.modal-scrim{position:absolute;inset:0;background:rgba(13,58,91,.58);z-index:20;display:flex;align-items:flex-start;justify-content:center;padding:56px 40px 40px}
.modal{background:#fff;width:1260px;max-height:calc(100% - 96px);display:flex;flex-direction:column;border:1px solid var(--nec-gray-20);box-shadow:0 24px 64px rgba(13,58,91,.4);overflow:hidden}
.modal .mhead{display:flex;align-items:center;gap:16px;padding:14px 16px 14px 24px;background:var(--nec-navy);color:#fff;flex:none}
.modal .mhead h2{margin:0;font-size:16px;font-weight:700;color:#fff}
.modal .mhead .sub{color:rgba(255,255,255,.72);font-size:12px}
.modal .mhead .chip{margin-left:auto}
.modal .mhead .x{width:40px;height:40px;background:none;border:0;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;flex:none}
.modal .mhead .x:hover{background:var(--nec-navy-soft)}
.modal .mbody{overflow:auto;display:flex;flex-direction:column;min-height:0}
.modal .mfoot{display:flex;align-items:center;gap:12px;padding:14px 24px;border-top:1px solid var(--nec-gray-20);flex:none}
.modal .mfoot .btn{white-space:nowrap}