/* ================= ROTAS (src/js/13-rotas.js) ================= */
/* Margem por rota: barra de operação e período, busca, o formulário do target e a tabela. Os cartões,
   chips de status e a tabela reaproveitam as classes do faturamento do Dashboard (05-dashboard.css). */
.rot-barra{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px;}
.rot-periodo{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-left:auto;}
.rot-periodo .range{margin-left:0;}
.rot-barra .qbtn .fat-dot{margin-right:6px;}
.rot-barra .qbtn.on .fat-dot{box-shadow:0 0 0 1.5px #fff;}
.rot-acao{align-self:stretch;padding:0 14px;font-size:12px;}

.rot-target{margin-bottom:12px;}
.rot-target h3{font-family:'Plus Jakarta Sans',system-ui,sans-serif;font-size:14px;margin:0 0 6px;}
.rot-target .metas-dica{margin:0 0 12px;}
.rot-target-campos{display:grid;grid-template-columns:repeat(3,minmax(0,180px));gap:12px;}
.rot-target-campos input{font-family:'JetBrains Mono',ui-monospace,monospace;text-align:right;}
.rot-target-campos input[aria-invalid]{border-color:var(--loss);box-shadow:0 0 0 3px var(--loss-bg);}
.rot-target-campos label .fat-dot{margin-right:6px;}
.rot-target-msg{margin:8px 0 0;font-size:12px;}
.rot-target .metas-acoes{justify-content:flex-end;}
.rot-cancelar{background:var(--surface);border:1px solid var(--line-2);color:var(--ink-2);}
.rot-cancelar:hover{border-color:var(--brand);color:var(--ink);}

.rot-painel{padding-top:13px;}
.rot-topo{display:flex;align-items:center;justify-content:space-between;gap:10px 16px;flex-wrap:wrap;margin-bottom:10px;}
.rot-alvo{font-size:11.5px;color:var(--ink-soft);}
.rot-alvo b{color:var(--ink-2);font-weight:600;}
.rot-chip b{font-family:'JetBrains Mono',ui-monospace,monospace;font-weight:700;margin-left:4px;opacity:.8;}
.rot-chip.rot-bom:not(.on){color:var(--gain);}
.rot-chip.rot-acima:not(.on){color:var(--warn);}
.rot-chip.rot-prejuizo:not(.on){color:var(--loss);}

.rot-tabela th{padding-top:6px;}
.rot-tabela th{text-align:right;}
.rot-tabela th.rot-esq,.rot-tabela td.rot-esq{text-align:left;}
.rot-ordem{border:none;background:none;padding:0;font:inherit;color:inherit;text-transform:inherit;letter-spacing:inherit;cursor:pointer;}
.rot-ordem:hover,.rot-ordem.on{color:var(--ink);}
.rot-tabela td small{font-family:inherit;font-size:10.5px;color:var(--ink-soft);}
.rot-tabela td.neg{color:var(--loss);font-weight:700;}
.rot-tabela td.rot-pos,.rot-tabela th.rot-pos{text-align:left;color:var(--ink-soft);width:28px;font-weight:500;}
.rot-tabela td.rot-rota small.rot-cidades{display:block;margin:2px 0 0 15px;font-family:'Plus Jakarta Sans',system-ui,sans-serif;font-size:11px;white-space:normal;}
.rot-tabela td.rot-rota b{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:12px;letter-spacing:-.2px;}
.rot-tabela td.rot-tip{font-family:inherit;font-size:12px;color:var(--ink-2);}
.rot-tabela td.rot-op{font-family:inherit;}
.rot-linha{cursor:pointer;}
.rot-linha:hover td{background:var(--surface-2);}
.rot-linha:focus-visible{outline:2px solid var(--brand);outline-offset:-2px;}
.rot-linha.aberta td{background:var(--brand-soft);border-bottom-color:transparent;}
.rot-pct{font-weight:700;}
.rot-pct.rot-bom{color:var(--gain);}
.rot-pct.rot-acima{color:var(--warn);}
.rot-pct.rot-prejuizo{color:var(--loss);}
.rot-pct.rot-sem-dado{color:var(--ink-soft);font-weight:500;}
.rot-selo{display:inline-block;font-family:'Plus Jakarta Sans',system-ui,sans-serif;font-size:10.5px;font-weight:700;padding:3px 9px;border-radius:999px;white-space:nowrap;}
.rot-selo.rot-bom{background:var(--gain-bg);color:var(--gain);}
.rot-selo.rot-acima{background:var(--warn-bg);color:var(--warn);}
.rot-selo.rot-prejuizo{background:var(--loss-bg);color:var(--loss);}
.rot-selo.rot-sem-dado{background:var(--surface-2);color:var(--ink-soft);}
.rot-detalhe > td{background:var(--brand-soft);padding:4px 14px 14px;text-align:left;white-space:normal;}
.rot-det{max-width:820px;}
.rot-det-nome{margin:4px 0 8px;font-size:12px;color:var(--ink-2);}
.rot-det-tabela{background:var(--surface);border-radius:10px;}
.rot-vazio{margin:6px 0 4px;}

@media(max-width:700px){
  .rot-periodo{margin-left:0;width:100%;}
  .rot-target-campos{grid-template-columns:1fr;}
  .rot-acao{flex:1 1 auto;padding:8px 12px;}
}