/* ===== Topologia OLT → PON → CTO (modal #mPons) ===== */
.modal .box.pon{width:980px}
.pon-resumo{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:10px;margin-bottom:16px}
.pon-kpi{background:var(--papel);border:1px solid var(--linha);border-radius:var(--r-sm);padding:10px 12px}
.pon-kpi b{display:block;font-size:22px;font-weight:800;color:var(--tinta);line-height:1.1}
.pon-kpi small{font-size:11px;color:var(--suave);font-weight:600}
.pon-kpi.warn b{color:var(--amber)} .pon-kpi.bad b{color:var(--vermelho)}
.pon-lista{display:flex;flex-direction:column;gap:8px;max-height:52vh;overflow-y:auto;padding-right:2px}
.pon-row{border:1px solid var(--linha);border-radius:var(--r-sm);background:#fff;overflow:hidden}
.pon-row.atencao{border-color:#F0C98A} .pon-row.critico{border-color:#F1A6AE}
.pon-row.lotada{border-color:#C9A6E0;background:#FCFAFE}
.pon-main{display:grid;grid-template-columns:96px 52px 62px 72px 76px 1fr 88px 88px auto;align-items:center;gap:8px;padding:10px 12px;cursor:pointer}
.pon-main:hover{background:#F8FAFD}
.pon-id{display:flex;flex-direction:column;gap:2px}
.pon-slot{font-size:10.5px;font-weight:800;color:var(--suave);letter-spacing:.04em}
.pon-num{font-size:15px;font-weight:800;color:var(--azul-esc)}
.pon-cell b{display:block;font-size:15px;font-weight:800;color:var(--tinta);line-height:1.1}
.pon-cell small{font-size:10.5px;color:var(--suave);font-weight:600;white-space:nowrap}
.pon-cell b.sig-bom{color:var(--verde)} .pon-cell b.sig-med{color:var(--amber)} .pon-cell b.sig-ruim{color:var(--vermelho)}
.pon-uso{min-width:130px}
.pon-bar{height:9px;border-radius:6px;background:#E4ECF5;overflow:hidden}
.pon-bar>span{display:block;height:100%;border-radius:6px;background:linear-gradient(90deg,var(--verde),#36D399)}
.pon-row.atencao .pon-bar>span{background:linear-gradient(90deg,var(--amber),#F2B33D)}
.pon-row.critico .pon-bar>span{background:linear-gradient(90deg,var(--vermelho),#F0616F)}
.pon-row.lotada .pon-bar>span{background:linear-gradient(90deg,var(--roxo),#A469C9)}
.pon-uso-txt{font-size:11px;color:var(--suave);margin-top:4px;white-space:nowrap}
.pon-uso-txt b{color:var(--tinta)}
.pon-flags{display:flex;gap:5px;flex-wrap:wrap;margin-top:5px}
.pon-flags:empty{display:none}
.pon-flag{font-size:10.5px;font-weight:800;padding:3px 8px;border-radius:99px;white-space:nowrap}
.pon-flag.ruim,.pon-flag.crit{color:var(--vermelho);background:var(--vermelho-bg)}
.pon-flag.lot{color:#fff;background:var(--roxo)}
.pon-flag.off{color:#fff;background:#6B7E92}
.pon-flag.aten{color:var(--amber);background:var(--amber-bg)}
.pon-filtrar{border:1px solid var(--linha);background:#fff;color:var(--azul-esc);font-weight:700;font-size:12px;padding:7px 11px;border-radius:8px;cursor:pointer;white-space:nowrap}
.pon-filtrar:hover{background:var(--azul-esc);color:#fff;border-color:var(--azul-esc)}
.pon-ctos{border-top:1px dashed var(--linha);background:var(--papel);padding:8px 12px 10px}
.pon-cto{display:grid;grid-template-columns:1fr 1fr 150px 110px auto auto;gap:10px;align-items:center;padding:7px 8px;border-radius:8px;cursor:pointer;font-size:12.5px}
.pon-cto:hover{background:#fff}
.pon-cto-nome{font-weight:800;color:var(--tinta)} .pon-cto-nome em{font-style:normal;font-size:10.5px;color:var(--suave);font-weight:600}
.pon-cto-ref{color:var(--suave);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pon-cto-n{color:var(--texto)} .pon-cto-n b{color:var(--tinta)}
.pon-cto-sig{font-weight:700;color:var(--suave)} .pon-cto-sig.sig-bom{color:var(--verde)} .pon-cto-sig.sig-med{color:var(--amber)} .pon-cto-sig.sig-ruim{color:var(--vermelho)}
.pon-nota{font-size:11.5px;color:var(--suave);padding:6px 8px 0}
.pon-sem{margin-top:14px;background:var(--amber-bg);border:1px solid #F0C98A;border-radius:var(--r-sm);padding:10px 12px}
.pon-sem-t{font-size:12px;font-weight:800;color:var(--amber);margin-bottom:6px}
.pon-sem-l{display:flex;flex-wrap:wrap;gap:6px}
.pon-sem-l span{font-size:11.5px;background:#fff;border:1px solid #F0C98A;border-radius:99px;padding:3px 9px;cursor:pointer;color:var(--texto)}
.pon-sem-l span:hover{background:var(--amber);color:#fff}
.pon-budget{margin-top:14px;font-size:12px;color:var(--suave);line-height:1.55;background:var(--papel);border:1px solid var(--linha);border-radius:var(--r-sm);padding:10px 12px}
.pon-budget b{color:var(--tinta)}
.pf-pons{display:inline-flex;align-items:center;gap:6px;background:#fff;color:var(--azul-esc);border:1px solid var(--linha)}
.pf-pons:hover{background:var(--azul-esc);color:#fff;border-color:var(--azul-esc);filter:none}
@media (max-width:900px){
  .pon-resumo{grid-template-columns:repeat(3,1fr)}
  .pon-main{grid-template-columns:1fr 1fr 1fr;gap:8px}
  .pon-uso{grid-column:1 / -1} .pon-filtrar{grid-column:1 / -1}
  .pon-cto{grid-template-columns:1fr 1fr}
  .pon-lista{max-height:60vh}
}