/* Tela Remessa × Faturamento — usa as cores da marca (marca.css) */
.wrap:has(.rf){max-width:1180px}
.rf{display:flex;flex-direction:column;gap:12px;min-width:0}
.rf-topo{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;justify-content:space-between}
.rf-per{display:flex;flex-wrap:wrap;gap:4px}
.rf-per button{font:inherit;font-size:12px;font-weight:600;padding:5px 11px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink-2);cursor:pointer}
.rf-per button.on{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.rf-per button.on .muted{color:inherit;opacity:.8}
.rf-alerta{color:var(--crit);font-weight:600}

.rf-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.rf-card{display:flex;flex-direction:column;gap:3px;padding:12px 14px;background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--line);border-radius:var(--r);color:inherit;text-decoration:none;min-width:0}
.rf-card:hover{border-color:var(--accent)}
.rf-card.rf-c{border-left-color:var(--crit)} .rf-card.rf-w{border-left-color:var(--warn)} .rf-card.rf-g{border-left-color:var(--good)}
.rf-ct{font-size:12px;font-weight:600;color:var(--ink-2)}
.rf-cv{font-size:22px;font-weight:800;letter-spacing:-.01em}
.rf-card.rf-c .rf-cv{color:var(--crit)}

.rf-funil{display:flex;align-items:stretch;gap:8px}
.rf-seta{align-self:center;color:var(--ink-3);font-size:20px}
.rf-et{flex:1;display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:calc(var(--r) - 2px);background:var(--accent-soft);min-width:0}
.rf-et b{font-size:18px}
.rf-sobra{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.rf-sobra .rf-et{background:var(--bg);border:1px solid var(--line)}
.rf-et.c b{color:var(--crit)} .rf-et.w b{color:var(--warn)}

.rf-aging{display:flex;flex-direction:column;gap:6px}
.rf-fx{display:grid;grid-template-columns:110px 1fr 120px 34px;gap:10px;align-items:center}
.rf-barra{height:10px;background:var(--bg);border-radius:999px;overflow:hidden}
.rf-barra i{display:block;height:100%;border-radius:999px;background:var(--dy-oliva)}
.rf-fx.acao .rf-barra i{background:var(--crit)}
.rf-fx b{text-align:right}

.rf-v{white-space:nowrap}
.rf-sug{margin-top:4px;padding:6px 8px;border-radius:6px;background:var(--accent-soft);color:var(--ink)}

.rf-g{border-top:1px solid var(--line);padding:8px 0}
.rf-g summary{display:flex;gap:10px;align-items:flex-start;cursor:pointer;list-style:none}
.rf-g summary::-webkit-details-marker{display:none}
.rf-g summary .bd{flex:1;min-width:0}
.rf-dif{font-weight:800;white-space:nowrap}
.rf-dif.menos{color:var(--crit)} .rf-dif.mais{color:var(--info)}
.rf-gd{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:8px;padding:8px 10px;background:var(--bg);border-radius:6px}

.rf-filtros{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between}
.rf-busca{max-width:280px;flex:1 1 200px}
.rf-tab-w{overflow-x:auto;margin:0 -14px;padding:0 14px}
.rf-tab{width:100%;border-collapse:collapse;font-size:13px}
.rf-tab th{text-align:left;font-size:11px;font-weight:700;color:var(--ink-3);text-transform:uppercase;letter-spacing:.03em;padding:6px 8px;border-bottom:1px solid var(--line);white-space:nowrap}
.rf-tab td{padding:7px 8px;border-bottom:1px solid var(--line);vertical-align:top}
.rf-tab .r{text-align:right;white-space:nowrap}
.rf-cli{max-width:260px}
.rf-regra{margin:0 2px}

@media (max-width:900px){.rf-cards{grid-template-columns:1fr 1fr}}
@media (max-width:640px){
  .rf-funil{flex-direction:column}.rf-seta{transform:rotate(90deg)}
  .rf-sobra,.rf-gd{grid-template-columns:1fr}
  .rf-fx{grid-template-columns:86px 1fr 96px;}.rf-fx>.muted{display:none}
  .rf-cv{font-size:19px}
}

/* cascata "do que saiu ao que virou cobrança" */
.rf-cascata{display:flex;flex-direction:column;gap:14px;margin:4px 0}
.rf-cd{display:grid;grid-template-columns:96px minmax(0,1fr) 230px;gap:12px;align-items:start}
.rf-cd-r{font-size:13px;color:var(--ink-2);text-align:right;padding-top:7px}
.rf-cd-l{display:flex;flex-direction:column;gap:4px;min-width:0}
.rf-cd-trilho{display:flex;height:32px}
.rf-cd-b{display:flex;align-items:center;height:100%;background:var(--dy-oliva);border-radius:4px;color:#fff;padding:0 12px;white-space:nowrap;overflow:hidden;min-width:3px;box-sizing:border-box}
.rf-cd-trilho:has(.rf-cd-b) .rf-cd-p{border-left:0}
.rf-cd-trilho:not(:has(.rf-cd-b)) .rf-cd-p{border-left:1.5px dashed color-mix(in srgb,var(--crit) 55%,transparent);border-radius:4px}
.rf-cd-v{color:var(--ink)}
.rf-cd-b b{font-size:14px}
.rf-cd-p{height:100%;border:1.5px dashed color-mix(in srgb,var(--crit) 55%,transparent);border-left:0;border-radius:0 4px 4px 0;background:color-mix(in srgb,var(--crit) 7%,var(--surface));cursor:pointer;padding:0;min-width:6px}
.rf-cd-p:hover{background:color-mix(in srgb,var(--crit) 16%,var(--surface))}
.rf-cd-x{padding-top:6px}
.rf-cd-lk{font:inherit;font-size:12.5px;font-weight:600;color:var(--crit);background:none;border:0;padding:0;cursor:pointer;text-align:left}
.rf-cd-lk:hover{text-decoration:underline}
@media (max-width:640px){
  .rf-cd{grid-template-columns:1fr;gap:4px}.rf-cd-r{text-align:left;padding:0;font-weight:600}.rf-cd-x{padding:0}
}