/* Páginas de lugar (lugares/<key>.html: concelho/distrito, região/zona,
   país). Tokens, grelha, fontes e primitivas vêm do site.css. Aqui só o que
   é próprio destas páginas. */

a:hover { text-decoration-color: var(--tinta); }

#regiao {
  max-width: 820px; margin: 0 auto; padding: 22px 18px 72px;
  overflow-x: clip;
}
.reg-estado { color: var(--tinta-2); padding: 48px 0; text-align: center; }
.reg-erro { color: #e88a6a; }

/* cabeçalho */
.reg-cab h1 { margin: 0; }
/* alvo "ver no mapa" ao lado do título (site.css .lb-saltar); um pouco maior
   e mais afastado do que na linha densa do leaderboard */
.reg-cab h1 .lb-saltar { width: 15px; height: 15px; margin-left: 10px; vertical-align: 3px; }
.reg-cab .sub {
  margin: 5px 0 0; font-family: var(--f-mono); font-size: 12px;
  color: var(--tinta-3); letter-spacing: .02em;
}

/* secções: .sec vem do site.css */

/* ranking + tabelas de sub-regiões */
.reg-rank { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.reg-rank th {
  padding: 0 5px 6px; text-align: right; font-size: 10.5px;
  color: var(--tinta-3); font-weight: 400;
}
.reg-rank th.h-nome { text-align: left; }
.reg-rank td { padding: 6px 5px; border-bottom: 1px solid var(--hair); }
.reg-rank td.tira-td { width: 150px; padding-right: 14px; line-height: 0; }
.reg-rank tr:last-child td { border-bottom: 0; }
.reg-rank td.num { text-align: right; white-space: nowrap; color: var(--tinta); }
.reg-rank td.uni { text-align: right; white-space: nowrap; color: var(--tinta-2); }
.reg-rank td.uni .tile { margin-right: 5px; }
.reg-rank td.pct { text-align: right; white-space: nowrap; color: var(--tinta-3); width: 52px; }
.reg-rank .pos { color: var(--tinta-3); width: 26px; font-family: var(--f-mono); font-size: 12px; }
.reg-rank .nome { display: flex; align-items: center; gap: 8px; }
.reg-rank .nome a { color: var(--tinta); text-decoration: none; font-weight: 500; }
.reg-rank .nome a:hover { text-decoration: underline; text-decoration-color: var(--marca); }
.reg-rank .tira { color: var(--tinta-2); }         /* fallback; style inline manda */

/* tabela de sub-regiões ordenável */
.sr-scroll { overflow-x: auto; max-width: 100%; }
.sr-scroll .reg-rank { min-width: 560px; }
.reg-rank.sr-sort th[data-sort] { cursor: pointer; user-select: none; white-space: nowrap; }
.reg-rank.sr-sort th[data-sort]:hover,
.reg-rank.sr-sort th[data-sort]:focus-visible { color: var(--tinta); }
.reg-rank.sr-sort th.ord { color: var(--tinta); }
.reg-rank .sr-total { width: 66px; }
.reg-rank .sr-explorar { width: 88px; }
.reg-rank .sr-membros { width: 66px; color: var(--tinta-3); }
.reg-rank th.sr-membros { color: var(--tinta-3); }

/* linha de cobertura da região */
.reg-cobre { margin: 14px 0 0; font-size: 12.5px; color: var(--tinta-2); }
.reg-cobre b { color: var(--tinta); font-weight: 500; font-family: var(--f-mono); }

/* sub-regiões expansíveis (país) */
.reg-rank .sr-nome { color: var(--tinta); }
.reg-rank.sr-exp .sr-row.exp { cursor: pointer; }
.reg-rank.sr-exp .sr-row.exp:hover td { background: var(--ch-1); }
.sr-tri { display: inline-block; width: 12px; color: var(--tinta-3); font-size: 9px;
  transition: transform .12s;
  background: none; border: 0; padding: 0; line-height: 1; font-family: inherit;
  cursor: pointer; vertical-align: baseline; }
.sr-row.aberto .sr-tri { transform: rotate(90deg); }
.sr-det > td { padding: 6px 5px 14px 20px; border-bottom: 1px solid var(--hair);
  background: var(--ch-1); }
.sr-det .reg-rank { margin: 0; }

/* feed de eventos */
.reg-ev {
  display: grid; grid-template-columns: 56px 20px 1fr; gap: 0 10px;
  align-items: baseline; padding: 8px 0; border-bottom: 1px solid var(--hair);
}
.reg-ev:last-child { border-bottom: 0; }
.reg-ev .dia { font-family: var(--f-mono); font-size: 11px; color: var(--tinta-3); white-space: nowrap; }
.reg-ev .ico { font-size: 13px; align-self: center; }
.reg-ev .corpo { font-size: 13px; line-height: 1.5; }
.reg-ev .corpo .tile { margin: 0 5px 0 3px; }
.reg-ev .corpo .atl { color: var(--tinta); font-weight: 500; text-decoration: none; }
.reg-ev .corpo .atl:hover { text-decoration: underline; text-decoration-color: var(--marca); }
.reg-ev .corpo .num { color: var(--tinta-2); white-space: nowrap; margin-left: 3px; }
.reg-vazio { color: var(--tinta-3); font-size: 12px; padding: 8px 0; }

/* vizinhos: links separados por espaço, sem chips */
.reg-viz { font-size: 12.5px; line-height: 2; color: var(--tinta-3); }
.reg-viz a { color: var(--tinta); text-decoration: underline;
  text-decoration-color: var(--marca); text-underline-offset: 3px; margin-right: 4px; }
.reg-viz a:hover { text-decoration-color: var(--tinta); }
.reg-viz a.viz-disp { text-decoration-color: var(--ouro); }
.reg-viz span { color: var(--tinta-3); margin-right: 4px; }
.reg-viz-nota { font-size: 11.5px; color: var(--tinta-3); margin: 10px 0 0; max-width: 62ch; }

.reg-rodape {
  margin-top: 44px; padding-top: 16px; border-top: 1px solid var(--rule);
  font-size: 11.5px; color: var(--tinta-3); line-height: 1.75; max-width: 66ch;
}
.reg-rodape .voltar { display: inline-block; margin-bottom: 6px; color: var(--tinta-2); }