/* Band Rede — barra de chegada e seletor de praças (CSS puro, sem build). */

.band-rede-barra {
  background: #0d0f13;
  color: #e4e6ea;
  font: 500 13px/1.4 Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
}

.band-rede-barra__interno {
  max-width: 1200px;
  margin: 0 auto;
  padding: 10px 20px;
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.band-rede-barra p {
  margin: 0;
  flex: 1 1 260px;
}

.band-rede-barra strong {
  color: #fff;
}

.band-rede-barra__ponto {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #ff982d;
  box-shadow: 0 0 0 3px rgba(255, 152, 45, .22);
  flex: none;
}

.band-rede-barra__acoes {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.band-rede-barra__acoes a {
  color: #b9bec7;
  text-decoration: none;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 8px;
  padding: 5px 10px;
  transition: all .15s;
  white-space: nowrap;
}

.band-rede-barra__acoes a:hover {
  color: #0d0f13;
  background: #ff982d;
  border-color: #ff982d;
}

/* seletor de praças */
.band-pracas {
  margin: 32px 0;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.band-pracas__titulo {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #8b919c;
  margin: 0 0 12px;
}

.band-pracas__lista {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
}

.band-pracas__item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid #e3e5e9;
  border-radius: 12px;
  background: #fff;
  color: #24282e;
  text-decoration: none;
  transition: all .15s;
}

.band-pracas__item:hover {
  border-color: #ff982d;
  background: #fff8ee;
}

.band-pracas__item.e-atual {
  border-color: #16181d;
  background: #16181d;
  color: #fff;
}

.band-pracas__uf {
  font-weight: 700;
  font-size: 11px;
  letter-spacing: .06em;
  background: #f0f1f4;
  color: #5b6270;
  border-radius: 6px;
  padding: 3px 6px;
  min-width: 30px;
  text-align: center;
}

.band-pracas__item.e-atual .band-pracas__uf {
  background: rgba(255, 152, 45, .18);
  color: #ffb257;
}

.band-pracas__nome {
  font-size: 13.5px;
  font-weight: 500;
}

@media (prefers-color-scheme: dark) {
  .band-pracas__item {
    background: #14171c;
    border-color: rgba(255, 255, 255, .1);
    color: #e4e6ea;
  }

  .band-pracas__uf {
    background: rgba(255, 255, 255, .07);
    color: #b9bec7;
  }
}

/* -------------------------------------------------------------------------
 * Barra cinza das praças, no topo de qualquer tema (inc/barra-estados.php).
 * A cor de cada estado chega pela variável --band-uf-cor, escrita no HTML.
 * ---------------------------------------------------------------------- */

.band-uf-barra {
  background: #eceef1;
  border-bottom: 1px solid #dcdfe4;
  font: 600 11.5px/1 Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  position: relative;
  z-index: 80;
}

.band-uf-barra__int {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  align-items: center;
  gap: 14px;
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.band-uf-barra__int::-webkit-scrollbar { display: none; }

.band-uf-barra__rot {
  flex: none;
  color: #8b929c;
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.band-uf-barra__lista {
  display: flex;
  align-items: center;
  gap: 2px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.band-uf-barra__lista > li { margin: 0; padding: 0; }
.band-uf-barra__lista > li::marker { content: none; }

.band-uf {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 34px;
  padding: 0 9px;
  color: #4a5059;
  text-decoration: none;
  white-space: nowrap;
  border-bottom: 2px solid transparent;
  transition: color .15s ease, border-color .15s ease, background-color .15s ease;
}

.band-uf::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--band-uf-cor, #4a5059);
  flex: none;
}

.band-uf__sigla {
  font-weight: 800;
  letter-spacing: .06em;
}

.band-uf__nome { font-weight: 600; }

.band-uf:hover,
.band-uf:focus-visible {
  color: var(--band-uf-cor, #4a5059);
  border-bottom-color: var(--band-uf-cor, #4a5059);
  background: rgba(255, 255, 255, .6);
  text-decoration: none;
}

.band-uf.e-atual {
  color: var(--band-uf-cor, #4a5059);
  border-bottom-color: var(--band-uf-cor, #4a5059);
  background: #fff;
}

.band-uf.e-atual .band-uf__nome { font-weight: 800; }

.band-uf.e-fora {
  color: #a9aeb7;
  cursor: default;
}

.band-uf.e-fora::before {
  background: #c6cad1;
}

/* No celular a barra rola de lado e mostra só as siglas. */
@media (max-width: 900px) {
  .band-uf-barra__int { padding: 0 14px; gap: 10px; }
  .band-uf-barra__rot { display: none; }
  .band-uf__nome { display: none; }
  .band-uf { padding: 0 8px; }
  .band-uf.e-atual .band-uf__nome,
  .band-uf.e-atual .band-uf__sigla { font-weight: 800; }
}

@media print {
  .band-uf-barra { display: none; }
}