/* Hub por horário [dnp_hub_horario] — referencia/widgets-rodada2.html, seção 4.
   Escopado a .dnp-hub. Estados extras (aguardando/fora_da_grade) não estavam
   no protótipo (que só mostra apurado) — cores seguem a mesma linguagem
   semântica âmbar/vermelho usada em dnp-horarios.css (.dnp-lista-item). */
:root{
  --dnp-verde-esc:#0d3a22;
  --dnp-verde-vivo:#0e7a43;
  --dnp-milhar:#111a15;
  --dnp-linha:#e6efe9;
  --dnp-cinza:#6c8177;
}
.dnp-hub,
.dnp-hub *{box-sizing:border-box}
.dnp-hub{
  max-width:900px;margin:0 auto;
  font-family:'Montserrat',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
}
.dnp-hub-head{text-align:center;margin-bottom:18px}

/* Modo pill-grid (home, [dnp_hub_horario] sem extracao=) */
.dnp-hub-pills{
  display:flex;flex-wrap:wrap;justify-content:center;gap:10px;
  margin:0 0 25px;
}
.dnp-hub-pill{
  display:inline-flex;align-items:center;gap:6px;
  padding:9px 18px;
  background:#eef6f1;border:1px solid var(--dnp-linha);border-radius:999px;
  color:var(--dnp-verde-esc);font-size:.86rem;font-weight:700;
  text-decoration:none;white-space:nowrap;
  transition:background .16s ease,border-color .16s ease;
}
.dnp-hub-pill-emoji{font-size:1rem;line-height:1}
.dnp-hub-pill:hover{background:#dcecdf;border-color:#bcd9c8}
.dnp-hub-pill:focus-visible{outline:2px solid var(--dnp-verde-esc);outline-offset:2px}

@media(max-width:640px){
  .dnp-hub-pill{padding:7px 14px;font-size:.8rem}
}

/* ---------- caixas de âncora "ir direto para..." ---------- */
.dnp-hub-anchors{margin:0 0 22px}
.dnp-hub-anchor-hoje{margin-bottom:14px}
.dnp-hub-anchors strong{
  display:block;text-align:center;
  margin:0 0 10px;padding:9px 14px;
  background:#eef6f1;border:1px solid var(--dnp-linha);border-radius:10px;
  color:var(--dnp-verde-esc);font-size:.86rem;font-weight:800;
}
.dnp-hub-anchors ul{
  display:flex;flex-wrap:wrap;justify-content:center;gap:8px;
  margin:0;padding:0;list-style:none;
}
.dnp-hub-anchors li{margin:0}
.dnp-hub-anchors a{
  display:inline-block;
  padding:8px 16px;
  background:#eef6f1;border:1px solid var(--dnp-linha);border-radius:999px;
  color:var(--dnp-verde-esc);font-size:.82rem;font-weight:700;
  text-decoration:none;white-space:nowrap;
  transition:background .16s ease,border-color .16s ease;
}
.dnp-hub-anchors a:hover{background:#dcecdf;border-color:#bcd9c8}
.dnp-hub-anchors a:focus-visible{outline:2px solid var(--dnp-verde-esc);outline-offset:2px}

@media(max-width:640px){
  .dnp-hub-anchors a{padding:7px 12px;font-size:.78rem}
}
.dnp-hub-head h1{margin:0 0 4px;font-size:1.4rem;color:var(--dnp-verde-esc);font-weight:900;letter-spacing:-.02em}
.dnp-hub-head p{margin:0;font-size:.88rem;color:var(--dnp-cinza);font-weight:600}
.dnp-hub .dnp-aviso{text-align:center;font-size:.9rem;color:var(--dnp-cinza)}
.dnp-hub-tabela{width:100%;border-collapse:separate;border-spacing:0 10px}
.dnp-hub-tabela tr{background:#fff}
.dnp-hub-tabela td{padding:12px 14px;border-top:1px solid var(--dnp-linha);border-bottom:1px solid var(--dnp-linha)}
.dnp-hub-tabela td:first-child{border-left:1px solid var(--dnp-linha);border-radius:12px 0 0 12px}
.dnp-hub-tabela td:last-child{border-right:1px solid var(--dnp-linha);border-radius:0 12px 12px 0}
.dnp-hub-banca{font-weight:900;color:var(--dnp-verde-esc);font-size:.92rem}
.dnp-hub-banca small{display:block;font-weight:600;color:var(--dnp-cinza);font-size:.72rem;margin-top:1px}
.dnp-hub-milhar{font-weight:800;color:var(--dnp-milhar);font-size:1.02rem;text-align:center}
.dnp-hub-bicho{color:var(--dnp-verde-vivo);font-weight:700;font-size:.88rem}
.dnp-hub-link{
  display:inline-flex;align-items:center;justify-content:center;min-width:34px;min-height:34px;
  border-radius:999px;background:#eef6f1;color:var(--dnp-verde-vivo);font-weight:900;text-decoration:none;font-size:1.1rem;
}
.dnp-hub-link:focus-visible{outline:2px solid var(--dnp-verde-esc);outline-offset:2px}

.dnp-hub-tabela tr[data-estado="aguardando"] .dnp-hub-milhar{color:#8a6a15}
.dnp-hub-tabela tr[data-estado="aguardando"] .dnp-hub-bicho{color:#8a7742}
.dnp-hub-tabela tr[data-estado="fora_da_grade"] .dnp-hub-milhar{color:#922323;font-weight:700;font-size:.86rem}
.dnp-hub-tabela tr[data-estado="fora_da_grade"] .dnp-hub-bicho{color:var(--dnp-cinza)}

@media(max-width:640px){
  .dnp-hub-tabela,.dnp-hub-tabela tbody,.dnp-hub-tabela tr,.dnp-hub-tabela td{display:block;width:100%}
  .dnp-hub-tabela tr{border-radius:12px;overflow:hidden;box-shadow:0 4px 12px rgba(0,41,22,.05);margin-bottom:10px}
  .dnp-hub-tabela td{border:0 !important;border-radius:0 !important;display:flex;align-items:center;justify-content:space-between}
  .dnp-hub-tabela td::before{content:attr(data-rotulo);font-size:.7rem;font-weight:800;color:var(--dnp-cinza);text-transform:uppercase}
  .dnp-hub-milhar,.dnp-hub-bicho{text-align:right}
}