/* Mapa no celular (≤ 767px). Só vale com html.pm-mh-map, ligado por pm-mobile-map.js.
   Os seletores usam IDs para vencer as regras !important do layout desktop sem alterá-las. */
:root {
  --pm-mh-sheet-peek: 28px;
  --pm-mh-sheet-top: calc(var(--pm-safe-top, env(safe-area-inset-top, 0px)) + 176px);
  --pm-mh-map-surface: #f5f6f8;
  --pm-mh-map-shadow: 0 6px 18px rgba(23, 46, 77, 0.1);
  /* Cartões do mapa (região, ponto, rua): terminam 15px antes da bússola (right 14px + 46px). */
  --pm-mh-card-right: calc(14px + 46px + 15px);
  --pm-mh-card-close-w: 40px;
}

#pmMhMapBar {
  display: none;
}

/* ── Topo: busca + avatar ─────────────────────────────────────── */
html.pm-mh-map header.topbar.pm-apple-topbar:not(#pm-mh-x) {
  display: none !important;
}

html.pm-mh-map #pmMhMapBar {
  position: fixed;
  top: calc(var(--pm-safe-top, env(safe-area-inset-top, 0px)) + 12px);
  left: 14px;
  right: calc(14px + 52px + 10px);
  z-index: 8400;
  display: flex;
  align-items: center;
  gap: 8px;
  height: 52px;
  padding: 0 7px 0 16px;
  border-radius: 999px;
  background: var(--pm-mh-map-surface);
  box-shadow: var(--pm-mh-map-shadow);
  font-family: "Roboto", system-ui, -apple-system, "Segoe UI", sans-serif;
  -webkit-tap-highlight-color: transparent;
}

#pmMhMapSearchSlot {
  flex: 1 1 auto;
  min-width: 0;
  height: 100%;
  display: flex;
  align-items: center;
}

#pmMhMapBar #pmMhMapSearchSlot #pmTopbarSearch {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}

#pmMhMapBar #pmMhMapSearchSlot #pmTopbarSearch::before,
#pmMhMapBar #pmMhMapSearchSlot #pmTopbarSearch::after {
  display: none !important;
}

#pmMhMapBar #pmMhMapSearchSlot #pmTopbarSearch #pmSearchToggleBtn {
  flex: none !important;
  display: grid !important;
  place-items: center !important;
  width: 22px !important;
  height: 22px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--pm-mh-blue, #2c77c9) !important;
  pointer-events: none !important;
}

#pmMhMapBar #pmMhMapSearchSlot #pmTopbarSearch #pmSearchToggleBtn::before,
#pmMhMapBar #pmMhMapSearchSlot #pmTopbarSearch #pmSearchToggleBtn::after {
  display: none !important;
}

#pmMhMapBar #pmMhMapSearchSlot #pmTopbarSearch #pmSearchToggleBtn svg {
  width: 20px !important;
  height: 20px !important;
  stroke-width: 2.2 !important;
}

#pmMhMapBar #pmMhMapSearchSlot #pmTopbarSearch .pm-apple-search-expand__field {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  clip-path: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

#pmMhMapBar #pmMhMapSearchSlot #pmTopbarSearch #globalSearch {
  display: block !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: none !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #172438 !important;
  font: 400 15px/1.2 "Roboto", system-ui, sans-serif !important;
  opacity: 1 !important;
  visibility: visible !important;
}

#pmMhMapBar #pmMhMapSearchSlot #pmTopbarSearch #globalSearch::placeholder {
  color: #5d6878;
  opacity: 1;
}

#pmMhMapBar #pmMhMapSearchSlot #pmTopbarSearch #pmSearchCloseBtn {
  display: none !important;
}

#pmMhMapBar #pmMhMapSearchSlot #pmTopbarSearch #pmSearchCloseBtn.is-clear-mode {
  display: grid !important;
  place-items: center !important;
  flex: none !important;
  width: 28px !important;
  height: 28px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #eeeae4 !important;
  color: #5d6878 !important;
  box-shadow: none !important;
}

/* Resultados da busca: alinhados à barra e com fundo sólido (o JS posiciona via estilo inline). */
html.pm-mh-map #globalSearchResults#globalSearchResults {
  left: 14px !important;
  right: 14px !important;
  top: calc(var(--pm-safe-top, env(safe-area-inset-top, 0px)) + 72px) !important;
  width: auto !important;
  max-height: min(60dvh, 420px) !important;
  overflow-y: auto !important;
  background: var(--pm-mh-map-surface) !important;
  border: 0 !important;
  border-radius: 20px !important;
  box-shadow: var(--pm-mh-map-shadow) !important;
}

#pmMhMapUser {
  flex: none;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: #e6edf7;
  color: var(--pm-mh-blue, #2c77c9);
  font: 600 13px/1 "Roboto", system-ui, sans-serif;
  letter-spacing: 0.02em;
  cursor: pointer;
}

#pmMhMapUser .pm-mh-mapbar__person {
  width: 22px;
  height: 22px;
}

#pmMhMapUser.has-initials .pm-mh-mapbar__person {
  display: none;
}

#pmMhMapUser:focus-visible {
  outline: 2px solid var(--pm-mh-blue, #2c77c9);
  outline-offset: 2px;
}

/* ── Painel inferior retrátil ─────────────────────────────────── */
html.pm-mh-map #pmMapSidebar.pm-mh-sheet {
  position: fixed !important;
  top: auto !important;
  left: 0 !important;
  right: 0 !important;
  bottom: calc(var(--pm-mh-dock-h, 72px) + env(safe-area-inset-bottom, 0px)) !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: calc(100dvh - var(--pm-mh-dock-h, 72px) - env(safe-area-inset-bottom, 0px) - var(--pm-mh-sheet-top)) !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 24px 24px 0 0 !important;
  background: var(--pm-mh-map-surface) !important;
  box-shadow: 0 -8px 28px rgba(23, 46, 77, 0.12) !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  z-index: 60 !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  translate: 0 calc(100% - var(--pm-mh-sheet-peek));
  transition: translate 0.44s cubic-bezier(0.32, 0.72, 0, 1) !important;
}

/* Recolhido, só a alça recebe toque. O resto do painel não pode cobrir o mapa
   (no iPhone o hit-test ignora o translate e engole os cliques depois que o app carrega).
   Com filtros abertos o mesmo painel vira o cartão do topo e precisa receber toque. */
html.pm-mh-map:not(.pm-mh-filters) #pmMapSidebar.pm-mh-sheet:not(.is-mh-expanded) {
  pointer-events: none !important;
}
html.pm-mh-map:not(.pm-mh-filters) #pmMapSidebar.pm-mh-sheet:not(.is-mh-expanded) .pm-mh-sheet__head {
  pointer-events: none !important;
}
html.pm-mh-map:not(.pm-mh-filters) #pmMapSidebar.pm-mh-sheet:not(.is-mh-expanded) .pm-mh-sheet__grip {
  pointer-events: auto !important;
}

html.pm-mh-map #pmMapSidebar.pm-mh-sheet.is-mh-expanded {
  translate: 0 0;
}

html.pm-mh-map #pmMapSidebar.pm-mh-sheet.is-mh-dragging,
html.pm-mh-map #pmMapSidebar.pm-mh-sheet.is-mh-instant {
  transition: none !important;
}

html.pm-mh-map #pmMapSidebar.pm-mh-sheet::before,
html.pm-mh-map #pmMapSidebar.pm-mh-sheet::after {
  display: none !important;
}

html.pm-mh-map #pmMapSidebar .pm-mh-sheet__head {
  flex: none;
  padding: 0 14px 4px;
  touch-action: none;
  -webkit-tap-highlight-color: transparent;
}

html.pm-mh-map #pmMapSidebar .pm-mh-sheet__grip {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: var(--pm-mh-sheet-peek);
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  cursor: grab;
}

html.pm-mh-map #pmMapSidebar .pm-mh-sheet__grip span {
  width: 40px;
  height: 4px;
  border-radius: 999px;
  background: #d5d1cc;
}

html.pm-mh-map #pmMapSidebar .pm-mh-sheet__tabs {
  position: relative;
  isolation: isolate;
  display: none;
  gap: 10px;
  margin: 2px 0 6px;
}

/* Categorias e camadas ficam na mesma tela (categorias em fileira, camadas em lista): sem abas. */
html.pm-mh-map #pmMapSidebar.pm-has-cats:not(#pm-mh-x) .pm-mh-sheet__tabs {
  display: none;
}

/* Mesmas camadas do dock: fundo inativo (0) → gota azul (1) → rótulo ativo (2). */
html.pm-mh-map #pmMapSidebar .pm-mh-sheet__tab {
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  height: 42px;
  margin: 0;
  padding: 0 8px;
  border: 0;
  border-radius: 14px;
  background: transparent;
  box-shadow: none;
  color: #6b7584;
  font: 500 14px/1 "Roboto", system-ui, sans-serif;
  cursor: pointer;
}

html.pm-mh-map #pmMapSidebar .pm-mh-sheet__tab::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: inherit;
  background: #f3efe9;
}

html.pm-mh-map #pmMapSidebar .pm-mh-sheet__tab > span {
  position: relative;
  z-index: 0;
}

html.pm-mh-map #pmMapSidebar .pm-mh-sheet__tab.is-active > span {
  z-index: 2;
  color: #fff;
  transition: color 0.24s ease 0.26s;
}

html.pm-mh-map #pmMapSidebar .pm-mh-sheet__tabs-thumb {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 0;
  height: 42px;
  border-radius: 14px;
  background: linear-gradient(180deg, #3a86d6 0%, var(--pm-mh-blue, #2c77c9) 100%);
  box-shadow:
    0 4px 12px rgba(44, 119, 201, 0.28),
    inset 0 1px 1px rgba(255, 255, 255, 0.28);
  pointer-events: none;
  transform-origin: center;
  will-change: left, width, transform;
}

html.pm-mh-map #pmMapSidebar .pm-mh-sheet__grip:focus,
html.pm-mh-map #pmMapSidebar .pm-mh-sheet__tab:focus {
  outline: none !important;
  box-shadow: none !important;
}

html.pm-mh-map #pmMapSidebar .pm-mh-sheet__grip:focus-visible,
html.pm-mh-map #pmMapSidebar .pm-mh-sheet__tab:not(.is-active):focus-visible {
  outline: 2px solid var(--pm-mh-blue, #2c77c9) !important;
  outline-offset: 2px;
}

/* As abas do desktop ficam escondidas; o dock e as abas acima as substituem. */
html.pm-mh-map #pmMapSidebar .pm-sb-tabs {
  display: none !important;
}

html.pm-mh-map #pmMapSidebar .pm-sb-panel.active {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

/* ── Categorias: fileira de pílulas que rola de lado, presa no topo do painel ── */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #pmtab-categorias .pm-cat-section {
  position: sticky !important;
  top: 0 !important;
  z-index: 4 !important;
  width: auto !important;
  margin: 0 -10px !important;
  padding: 2px 0 12px !important;
  border: 0 !important;
  background: var(--pm-mh-map-surface) !important;
  box-shadow: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #pmtab-categorias .pm-cat-section-head,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #pmtab-categorias .pm-cat-section .pm-sb-search {
  display: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #pmtab-categorias .pm-map-cat-scroll {
  max-height: none !important;
  margin: 0 !important;
  padding: 0 10px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  overscroll-behavior-x: contain;
  scroll-padding-inline: 10px;
  scrollbar-width: none;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #pmtab-categorias .pm-map-cat-scroll::-webkit-scrollbar {
  display: none;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapCatChips {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  width: max-content !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapCatChips .map-cat-item {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: none !important;
  gap: 7px !important;
  width: auto !important;
  height: 38px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 14px 0 11px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #fffcf8 !important;
  box-shadow: inset 0 0 0 1px #e8e2d9 !important;
  color: #172438 !important;
  text-align: left !important;
  white-space: nowrap !important;
  transform: none !important;
  transition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease !important;
  -webkit-tap-highlight-color: transparent;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapCatChips .map-cat-item::before,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapCatChips .map-cat-item::after {
  display: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapCatChips .map-cat-item .pm-cat-icon {
  display: grid !important;
  place-items: center !important;
  flex: none !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--pm-mh-blue, #2c77c9) !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapCatChips .map-cat-item .pm-cat-icon svg {
  width: 18px !important;
  height: 18px !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapCatChips .map-cat-item .pm-cat-icon svg,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapCatChips .map-cat-item .pm-cat-icon svg *,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .mls-icon svg,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .mls-icon svg *,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .mlr-icon svg,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .mlr-icon svg * {
  color: inherit !important;
  opacity: 1 !important;
  filter: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapCatChips .map-cat-item .pm-cat-icon svg [stroke]:not([stroke="none"]),
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .mls-icon svg [stroke]:not([stroke="none"]),
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .mlr-icon svg [stroke]:not([stroke="none"]) {
  stroke: currentColor !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapCatChips .map-cat-item .pm-cat-icon svg[stroke]:not([stroke="none"]),
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .mls-icon svg[stroke]:not([stroke="none"]),
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .mlr-icon svg[stroke]:not([stroke="none"]) {
  stroke: currentColor !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapCatChips .map-cat-item .pm-cat-icon svg *:not([stroke]),
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .mls-icon svg *:not([stroke]),
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .mlr-icon svg *:not([stroke]) {
  stroke: inherit !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapCatChips .map-cat-item .pm-cat-label {
  flex: none !important;
  min-width: 0 !important;
  color: inherit !important;
  font: 500 14px/1 "Roboto", system-ui, sans-serif !important;
  text-align: left !important;
  text-shadow: none !important;
}

/* A categoria escolhida é a que tem as camadas listadas abaixo. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapCatChips .map-cat-item.on {
  background: linear-gradient(180deg, #3a86d6 0%, var(--pm-mh-blue, #2c77c9) 100%) !important;
  box-shadow: 0 4px 12px rgba(44, 119, 201, 0.26) !important;
  color: #fff !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapCatChips .map-cat-item.on .pm-cat-icon {
  color: #fff !important;
}

/* Cabeçalho da lista: categoria, quantas camadas e ativar/desativar todas. */
#pmMhLayersHead {
  display: none;
}

html.pm-mh-map #pmMapSidebar #pmMhLayersHead:not([hidden]) {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin: 2px 2px 10px;
}

#pmMhLayersHead strong {
  font: 600 17px/1.2 "Roboto", system-ui, sans-serif;
  color: #172438;
}

#pmMhLayersHead span {
  font: 400 13px/1.2 "Roboto", system-ui, sans-serif;
  color: #8a94a3;
}

#pmMhLayersHead button {
  margin: 0 0 0 auto;
  padding: 4px 0;
  border: 0;
  background: transparent;
  color: var(--pm-mh-blue, #2c77c9);
  font: 500 14px/1.2 "Roboto", system-ui, sans-serif;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

#pmMhLayersHead button[hidden] {
  display: none;
}

/* Lista de camadas: grupos sem cartão, cada camada é um botão. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #pmtab-categorias .pm-layers-card,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #pmtab-categorias .pm-layers-card-body,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-section-group {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-section {
  min-height: 0 !important;
  padding: 2px 2px 8px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #687586 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-section-label {
  color: #8a94a3 !important;
  -webkit-text-fill-color: #8a94a3 !important;
  font: 600 11.5px/1.2 "Roboto", system-ui, sans-serif !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-section-count {
  display: none !important;
}

/* No celular as seções são só rótulos: ficam sempre abertas, sem sanfona. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-section {
  pointer-events: none !important;
  cursor: default !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-section-chevron {
  display: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-section-body {
  display: block !important;
  grid-template-rows: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  opacity: 1 !important;
  transition: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-section-body-inner {
  overflow: visible !important;
}

/* Obras e Serviços não fazem parte do mapa no celular. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList [data-map-layer-section="infraestrutura::obras"] {
  display: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-section-group[data-map-layer-section="infraestrutura::obras"] + .map-layer-section-group {
  margin-top: 0 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-section-body-inner {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  padding: 0 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-special,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-row.has-row-icon {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  min-height: 60px !important;
  margin: 0 !important;
  padding: 10px 14px 10px 12px !important;
  border: 0 !important;
  border-radius: 16px !important;
  background: #fffcf8 !important;
  box-shadow: inset 0 0 0 1px #ece6dd !important;
  color: #172438 !important;
  text-align: left !important;
  transform: none !important;
  transition: background-color 0.2s ease, box-shadow 0.2s ease !important;
  -webkit-tap-highlight-color: transparent;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-row.has-row-icon {
  padding-right: 66px !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList > :is(.map-layer-row, .map-layer-special, .map-layer-section-group) + :is(.map-layer-row, .map-layer-special, .map-layer-section-group) {
  margin-top: 8px !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList > :is(.map-layer-row, .map-layer-special, .map-layer-section-group) + .map-layer-section-group {
  margin-top: 16px !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-special::before,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-special::after,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-row.has-row-icon::before,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-row.has-row-icon::after {
  display: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-special .mls-icon,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-row.has-row-icon .mlr-icon {
  display: grid !important;
  place-items: center !important;
  flex: none !important;
  width: 34px !important;
  height: 34px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: #e6edf7 !important;
  box-shadow: none !important;
  color: var(--pm-mh-blue, #2c77c9) !important;
}

/* Atalhos que abrem um painel próprio levam uma seta no lugar da chave. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-special:not(.is-placeholder)::after {
  content: "" !important;
  display: block !important;
  position: static !important;
  flex: none !important;
  width: 8px !important;
  height: 8px !important;
  margin: 0 6px 0 auto !important;
  border: solid #8a94a3 !important;
  border-width: 0 2px 2px 0 !important;
  border-radius: 1px !important;
  background: none !important;
  opacity: 1 !important;
  transform: rotate(-45deg) !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .mls-title,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .mlr-title {
  color: inherit !important;
  font: 500 15px/1.25 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .mls-sub,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .mlr-sub {
  color: #687586 !important;
  font: 400 12.5px/1.3 "Roboto", system-ui, sans-serif !important;
}

/* A linha inteira liga/desliga (a chave cobre o cartão); só o trilho aparece, à direita. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-row.has-row-icon .mlr-state {
  display: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-row.has-row-icon .mlr-action {
  position: static !important;
  display: flex !important;
  margin-left: auto !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-row.has-row-icon .map-toggle {
  position: absolute !important;
  inset: 0 !important;
  z-index: 3 !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  opacity: 1 !important;
  cursor: pointer !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-row.has-row-icon .map-toggle input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-row.has-row-icon .map-toggle-track {
  position: absolute !important;
  top: 50% !important;
  right: 14px !important;
  left: auto !important;
  display: block !important;
  width: 40px !important;
  height: 24px !important;
  min-width: 0 !important;
  margin: -12px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #ddd7cf !important;
  box-shadow: none !important;
  transform: none !important;
  transition: background-color 0.2s ease !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-row.has-row-icon .map-toggle-thumb {
  position: absolute !important;
  top: 2px !important;
  left: 2px !important;
  display: block !important;
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: #fff !important;
  box-shadow: 0 1px 3px rgba(23, 36, 56, 0.22) !important;
  transform: none !important;
  transition: transform 0.2s ease !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-row.has-row-icon .map-toggle-track::before,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-row.has-row-icon .map-toggle-track::after,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-row.has-row-icon .map-toggle-thumb::before,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-row.has-row-icon .map-toggle-thumb::after {
  display: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-row.has-row-icon .map-toggle input:checked + .map-toggle-track,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-row.has-row-icon.on .map-toggle-track {
  background: var(--pm-mh-blue, #2c77c9) !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-row.has-row-icon .map-toggle input:checked + .map-toggle-track .map-toggle-thumb,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-row.has-row-icon.on .map-toggle-thumb {
  transform: translateX(16px) !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-row.has-row-icon .pm-layer-edit-points-btn {
  position: relative !important;
  z-index: 4 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-special:active,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-row.has-row-icon:active {
  background: #f6f2ec !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-special.is-open,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .map-layer-row.has-row-icon.on {
  background: #fffcf8 !important;
  box-shadow: inset 0 0 0 1.5px var(--pm-mh-blue, #2c77c9), 0 3px 10px rgba(44, 119, 201, 0.1) !important;
  color: #172438 !important;
}

/* ── Filtros da camada: o painel vira um cartão no topo, abaixo da busca ── */
html.pm-mh-map.pm-mh-filters #pmMapSidebar.pm-mh-sheet.pm-has-cats.pm-has-special-back:not(#pm-mh-x) {
  top: calc(var(--pm-safe-top, env(safe-area-inset-top, 0px)) + 74px) !important;
  bottom: auto !important;
  left: 12px !important;
  right: 12px !important;
  height: auto !important;
  max-height: calc(100dvh - var(--pm-safe-top, env(safe-area-inset-top, 0px)) - 74px - var(--pm-mh-dock-h, 72px) - env(safe-area-inset-bottom, 0px) - 86px) !important;
  border-radius: 22px !important;
  box-shadow: var(--pm-mh-map-shadow) !important;
  translate: 0 0;
}

html.pm-mh-map.pm-mh-filters #pmMapSidebar.pm-has-cats.pm-has-special-back:not(#pm-mh-x) .pm-mh-sheet__head,
html.pm-mh-map.pm-mh-filters #pmMapSidebar.pm-has-cats.pm-has-special-back:not(#pm-mh-x) #pmtab-categorias .pm-cat-section {
  display: none !important;
}

html.pm-mh-map.pm-mh-filters #pmMapSidebar.pm-has-cats.pm-has-special-back:not(#pm-mh-x) #pmtab-categorias {
  padding: 0 !important;
}

/* Alça do painel inferior enquanto o cartão de filtros ocupa o topo. */
#pmMhSheetPeek {
  display: none;
}

html.pm-mh-map.pm-mh-filters #pmMhSheetPeek {
  position: fixed;
  left: 0;
  right: 0;
  bottom: calc(var(--pm-mh-dock-h, 72px) + env(safe-area-inset-bottom, 0px));
  z-index: 60;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: var(--pm-mh-sheet-peek);
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 24px 24px 0 0;
  background: var(--pm-mh-map-surface);
  box-shadow: 0 -8px 28px rgba(23, 46, 77, 0.12);
  cursor: grab;
  touch-action: none;
  -webkit-tap-highlight-color: transparent;
}

#pmMhSheetPeek span {
  width: 40px;
  height: 4px;
  border-radius: 999px;
  background: #d5d1cc;
}

#pmMhSheetPeek:focus {
  outline: none;
}

#pmMhSheetPeek:focus-visible {
  outline: 2px solid var(--pm-mh-blue, #2c77c9);
  outline-offset: -4px;
}

/* Aba retrátil do cartão de filtros. */
html.pm-mh-map #pmMapSidebar .pm-mh-filters-toggle {
  display: none;
}

html.pm-mh-map.pm-mh-filters #pmMapSidebar.pm-has-cats.pm-has-special-back:not(#pm-mh-x) .pm-mh-filters-toggle {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 5;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: #f3efe9;
  box-shadow: none;
  color: var(--pm-mh-blue, #2c77c9);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) .pm-mh-filters-toggle,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) .pm-mh-filters-toggle svg,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) .pm-mh-filters-toggle svg * {
  color: var(--pm-mh-blue, #2c77c9) !important;
  stroke: var(--pm-mh-blue, #2c77c9) !important;
  fill: none !important;
  opacity: 1 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) .pm-mh-filters-toggle {
  background: #f3efe9 !important;
  box-shadow: none !important;
  border: 0 !important;
}

html.pm-mh-map #pmMapSidebar .pm-mh-filters-toggle svg {
  transition: transform 0.3s cubic-bezier(0.32, 0.72, 0, 1);
}

html.pm-mh-map #pmMapSidebar .pm-mh-filters-toggle[aria-expanded="false"] svg {
  transform: rotate(180deg);
}

html.pm-mh-map #pmMapSidebar .pm-mh-filters-toggle:focus-visible {
  outline: 2px solid var(--pm-mh-blue, #2c77c9);
  outline-offset: 2px;
}

html.pm-mh-map.pm-mh-filters #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-hero > .pm-bairros-hero__title {
  padding-right: 46px !important;
}

/* Recolhido: só voltar + título + legenda do filtro; o resto do cartão some. */
html.pm-mh-map.pm-mh-filters-min #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-hero > :not(.pm-bairros-back-wrap):not(.pm-bairros-hero__title):not(.pm-special-filter-line),
html.pm-mh-map.pm-mh-filters-min #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-special-panel .map-legend-card > :not(.pm-bairros-hero),
html.pm-mh-map.pm-mh-filters-min #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-special-panel > :not(.pm-bairros-hero):not(.map-legend-card):not(.pm-bairros-back-wrap),
html.pm-mh-map.pm-mh-filters-min #pmMapSidebar:not(#pm-mh-x) #mapLayersList > div:not(.pm-special-panel, .map-layer-section-group, .map-layer-row) > :not(.pm-bairros-back-wrap) {
  display: none !important;
}

html.pm-mh-map.pm-mh-filters-min #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-special-panel .map-legend-card.pm-bairros-card,
html.pm-mh-map.pm-mh-filters-min #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-panel {
  padding-bottom: 14px !important;
}

html.pm-mh-map.pm-mh-filters-min #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-hero__title {
  cursor: pointer !important;
}

html.pm-mh-map.pm-mh-filters-min #pmMapSidebar:not(#pm-mh-x) #pmtab-categorias {
  overflow: hidden !important;
}

/* Conteúdo dos filtros: mesmas informações, em tons suaves e com os botões do celular. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-special-panel {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-special-panel .map-legend-card.pm-bairros-card {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  margin: 0 !important;
  padding: 14px 14px 16px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-hero {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  gap: 6px 12px !important;
  grid-template-rows: none !important;
  align-items: center !important;
  align-content: start !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #172438 !important;
  overflow: visible !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-hero::before,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-hero::after {
  display: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-hero > .pm-bairros-hero__title {
  max-width: none !important;
  margin: 0 !important;
  color: #172438 !important;
  -webkit-text-fill-color: #172438 !important;
  font: 600 19px/1.2 "Roboto", system-ui, sans-serif !important;
  letter-spacing: 0 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-hero > .pm-bairros-hero__sub {
  max-width: none !important;
  margin: 2px 0 0 !important;
  color: #687586 !important;
  -webkit-text-fill-color: #687586 !important;
  font: 400 13px/1.4 "Roboto", system-ui, sans-serif !important;
}

/* Legenda do filtro ativo: cores da malha + recorte escolhido. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-hero > .pm-special-filter-line {
  grid-column: 1 / -1 !important;
  display: flex !important;
  align-items: center;
  gap: 8px;
  min-width: 0;
  max-width: none !important;
  margin: 2px 0 0 !important;
  padding: 0 !important;
  color: #2c3e55 !important;
  -webkit-text-fill-color: #2c3e55 !important;
  font: 500 13px/1.35 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-special-filter-line__scale {
  display: inline-flex;
  flex: none;
  height: 10px;
  overflow: hidden;
  border-radius: 5px;
  box-shadow: inset 0 0 0 1px rgba(23, 36, 56, 0.08);
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-special-filter-line__scale > span {
  width: 12px;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-special-filter-line--keys {
  flex-wrap: wrap;
  gap: 4px 12px;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-special-filter-line__key {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-special-filter-line__key > i {
  width: 10px;
  height: 10px;
  flex: none;
  border-radius: 50%;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-special-filter-line__text {
  display: -webkit-box;
  min-width: 0;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-hero > .pm-bairros-faixa-picker,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-hero > .pm-dom-picker-anchor {
  margin: 6px 0 0 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-back-wrap {
  position: static !important;
  margin: 0 !important;
  padding: 0 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-hero__icon {
  display: none !important;
}

/* Alfabetização, Pessoas e Domicílios trazem o voltar fora do cabeçalho: vai para a linha do título.
   Sem :has() aqui e nos ancestrais da lista: cada linha inserida fazia o Chrome recalcular o estilo da página. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-special-panel {
  position: relative !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-special-panel > .pm-bairros-back-wrap {
  position: absolute !important;
  top: 14px !important;
  left: 14px !important;
  z-index: 2 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-special-panel > :not(.map-legend-card):not(.pm-bairros-back-wrap) {
  margin-left: 14px !important;
  margin-right: 14px !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-special-panel > :last-child:not(.map-legend-card):not(.pm-bairros-back-wrap) {
  margin-bottom: 16px !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-special-panel > .pm-bairros-back-wrap ~ * .pm-bairros-hero > * {
  grid-column: 1 / -1 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-special-panel > .pm-bairros-back-wrap ~ * .pm-bairros-hero > .pm-bairros-hero__title {
  display: flex !important;
  align-items: center !important;
  min-height: 38px !important;
  padding-left: 50px !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-back {
  display: grid !important;
  place-items: center !important;
  width: 38px !important;
  height: 38px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #f3efe9 !important;
  box-shadow: none !important;
  color: var(--pm-mh-blue, #2c77c9) !important;
  transform: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-back::before,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-back::after {
  display: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-back svg,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-back svg * {
  color: var(--pm-mh-blue, #2c77c9) !important;
  stroke: var(--pm-mh-blue, #2c77c9) !important;
  fill: none !important;
}

/* Seletores (mapa temático, faixa, indicador): botão bege com texto azul. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-faixa-toggle,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-select {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: #f3efe9 !important;
  box-shadow: none !important;
  color: var(--pm-mh-blue, #2c77c9) !important;
  -webkit-text-fill-color: var(--pm-mh-blue, #2c77c9) !important;
  font: 500 14px/1.25 "Roboto", system-ui, sans-serif !important;
  text-align: left !important;
  transform: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-faixa-toggle::before,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-faixa-toggle::after,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-select::before,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-select::after {
  display: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-faixa-toggle *,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-select * {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
  font-weight: inherit !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-faixa-toggle svg [stroke]:not([stroke="none"]),
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-select svg [stroke]:not([stroke="none"]),
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-faixa-toggle svg[stroke]:not([stroke="none"]),
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-select svg[stroke]:not([stroke="none"]) {
  stroke: currentColor !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-select > svg {
  margin-left: auto !important;
}

/* Legenda compacta: cada faixa vira uma pílula, para o cartão ocupar pouco do mapa. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-legend {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-legend-row {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 6px 11px 6px 7px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #f3efe9 !important;
  box-shadow: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-legend-swatch {
  width: 14px !important;
  height: 14px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(23, 36, 56, 0.1) !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-legend-label {
  color: #4b5563 !important;
  -webkit-text-fill-color: #4b5563 !important;
  font: 500 12.5px/1.2 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-foot {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #8a94a3 !important;
  -webkit-text-fill-color: #8a94a3 !important;
  font: 400 12px/1.4 "Roboto", system-ui, sans-serif !important;
  text-align: left !important;
}

/* Pessoas, alfabetização e socioeconômico. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-body,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-section,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-socio-body,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-macro-body,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-macro-card {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-body,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-socio-body,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-macro-body {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-body::before,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-body::after,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-section::before,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-section::after {
  display: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-label,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-macro-section-title strong {
  margin: 0 0 6px !important;
  color: #687586 !important;
  -webkit-text-fill-color: #687586 !important;
  font: 500 12.5px/1.2 "Roboto", system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-macro-section-title span {
  color: #8a94a3 !important;
  -webkit-text-fill-color: #8a94a3 !important;
  font: 400 12px/1.35 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList input[type="range"] {
  accent-color: var(--pm-mh-blue, #2c77c9) !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-territory-btn,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-socio-reset {
  border: 0 !important;
  border-radius: 12px !important;
  background: #f3efe9 !important;
  box-shadow: none !important;
  font-weight: 500 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-territory-btn.is-active {
  background: #e6edf7 !important;
}

/* Blocos de números (macrorregião, socioeconômico): fundo bege, sem sombra. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-macro-kpis {
  gap: 8px !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-macro-kpi,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-socio-card,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-socio-stat {
  border: 0 !important;
  border-radius: 14px !important;
  background: #f3efe9 !important;
  box-shadow: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-macro-kpi span,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-macro-kpi small {
  color: #687586 !important;
  -webkit-text-fill-color: #687586 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-macro-kpi strong {
  color: #172438 !important;
  -webkit-text-fill-color: #172438 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-macro-legend-item {
  border: 0 !important;
  box-shadow: none !important;
}

/* Rotas de coleta. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-panel {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  padding: 14px 14px 16px !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-card {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-seg {
  gap: 4px !important;
  padding: 4px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: #f3efe9 !important;
  box-shadow: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-chip {
  border: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #6b7584 !important;
  -webkit-text-fill-color: #6b7584 !important;
  font-weight: 500 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-chip.is-on {
  background: linear-gradient(180deg, #3a86d6 0%, var(--pm-mh-blue, #2c77c9) 100%) !important;
  box-shadow: 0 3px 10px rgba(44, 119, 201, 0.24) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-carga,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-row {
  border: 0 !important;
  border-radius: 14px !important;
  background: #f3efe9 !important;
  box-shadow: none !important;
  color: #172438 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-carga span:first-child {
  color: #4b5563 !important;
  -webkit-text-fill-color: #4b5563 !important;
  font-weight: 500 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-row .mlr-title {
  color: #172438 !important;
  -webkit-text-fill-color: #172438 !important;
  font-size: 14px !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-row:not(.on) {
  opacity: 0.62 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-km,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-rel {
  border: 0 !important;
  background: #fffcf8 !important;
  box-shadow: none !important;
  color: #687586 !important;
  -webkit-text-fill-color: #687586 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-rel,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-rel svg,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-rel svg * {
  color: var(--pm-mh-blue, #2c77c9) !important;
  stroke: var(--pm-mh-blue, #2c77c9) !important;
  fill: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-resumo strong {
  color: #172438 !important;
  -webkit-text-fill-color: #172438 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-resumo span,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-grupo-head {
  color: #687586 !important;
  -webkit-text-fill-color: #687586 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-turno {
  color: var(--pm-mh-blue, #2c77c9) !important;
  -webkit-text-fill-color: var(--pm-mh-blue, #2c77c9) !important;
}

/* Menu de indicador (pessoas, alfabetização, socioeconômico): abre no fluxo do cartão,
   que cresce junto, em vez de flutuar e ser cortado pela borda. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-menu {
  position: static !important;
  inset: auto !important;
  width: auto !important;
  max-height: none !important;
  margin: 8px 0 0 !important;
  padding: 6px !important;
  border: 0 !important;
  border-radius: 16px !important;
  background: #fffcf8 !important;
  box-shadow: 0 4px 14px rgba(23, 46, 77, 0.08) !important;
  transform: none !important;
  overflow: visible !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-menu-option {
  border: 0 !important;
  border-radius: 12px !important;
  background: #f3efe9 !important;
  box-shadow: none !important;
  color: #4b5563 !important;
  -webkit-text-fill-color: #4b5563 !important;
  font-weight: 500 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-menu-option.is-active {
  background: linear-gradient(180deg, #3a86d6 0%, var(--pm-mh-blue, #2c77c9) 100%) !important;
  box-shadow: 0 3px 10px rgba(44, 119, 201, 0.22) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-menu-option * {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-socio-menu-group__label {
  color: #687586 !important;
  -webkit-text-fill-color: #687586 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-age-value,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-hint {
  border: 0 !important;
  border-radius: 12px !important;
  background: #f3efe9 !important;
  box-shadow: none !important;
  color: #4b5563 !important;
  -webkit-text-fill-color: #4b5563 !important;
  font-weight: 400 !important;
}

/* Seções recolhíveis (filtros de bairros, faixa etária). */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-mh-fold {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 4px 6px 4px 14px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: #f3efe9 !important;
  box-shadow: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-mh-fold:not(.is-mh-folded) {
  padding-bottom: 14px !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-mh-fold.is-mh-folded > :not(.pm-mh-fold-head) {
  display: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-mh-fold-head {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  cursor: pointer !important;
  -webkit-tap-highlight-color: transparent;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-mh-fold-head > strong,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-mh-fold-head > .pm-people-label {
  flex: none !important;
  margin: 0 !important;
  color: #172438 !important;
  -webkit-text-fill-color: #172438 !important;
  font: 500 14px/1.2 "Roboto", system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-mh-fold-summary {
  flex: 1 1 auto !important;
  width: 0 !important;
  min-width: 0 !important;
  overflow: hidden !important;
  color: #687586 !important;
  -webkit-text-fill-color: #687586 !important;
  font: 400 12.5px/1.2 "Roboto", system-ui, sans-serif !important;
  text-align: right !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

/* Cabeçalho com título e descrição em bloco: a descrição quebra linha e o resumo mantém a largura dele. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-mh-fold-head > div:first-child {
  flex: 1 1 0 !important;
  min-width: 0 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-mh-fold-head > div:first-child + .pm-mh-fold-summary {
  flex: none !important;
  width: auto !important;
  max-width: 40% !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-mh-fold:not(.is-mh-folded) .pm-mh-fold-summary {
  display: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-mh-fold:not(.is-mh-folded) .pm-mh-fold-head > :first-child {
  flex: 1 1 auto !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-mh-fold-btn {
  flex: none !important;
  display: grid !important;
  place-items: center !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--pm-mh-blue, #2c77c9) !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-mh-fold-btn svg,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-mh-fold-btn svg * {
  color: var(--pm-mh-blue, #2c77c9) !important;
  stroke: var(--pm-mh-blue, #2c77c9) !important;
  fill: none !important;
  opacity: 1 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-mh-fold-btn svg {
  transition: transform 0.25s ease !important;
}

/* Nada no cartão pode forçar largura maior que a dele. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList > *,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-special-panel,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-card,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-body,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-socio-body,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-section,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-mh-fold {
  min-width: 0 !important;
  max-width: 100% !important;
}

/* Controles deslizantes: trilho bege e bolinha azul. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList input[type="range"] {
  -webkit-appearance: none !important;
  appearance: none !important;
  display: block !important;
  width: 100% !important;
  height: 26px !important;
  margin: 2px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  opacity: 1 !important;
  cursor: pointer;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList input[type="range"]::-webkit-slider-runnable-track {
  height: 6px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #e2dbd1 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList input[type="range"]::-moz-range-track {
  height: 6px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #e2dbd1 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList input[type="range"]::-moz-range-progress {
  height: 6px !important;
  border-radius: 999px !important;
  background: var(--pm-mh-blue, #2c77c9) !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none !important;
  appearance: none !important;
  width: 22px !important;
  height: 22px !important;
  margin-top: -8px !important;
  border: 3px solid #fff !important;
  border-radius: 999px !important;
  background: var(--pm-mh-blue, #2c77c9) !important;
  box-shadow: 0 2px 6px rgba(23, 46, 77, 0.25) !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList input[type="range"]::-moz-range-thumb {
  width: 16px !important;
  height: 16px !important;
  border: 3px solid #fff !important;
  border-radius: 999px !important;
  background: var(--pm-mh-blue, #2c77c9) !important;
  box-shadow: 0 2px 6px rgba(23, 46, 77, 0.25) !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-mh-fold-btn[aria-expanded="true"] svg {
  transform: rotate(180deg) !important;
}

/* Faixa etária de pessoas: o invólucro animado do app não pode cortar a seção. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-age-collapse.is-open,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-age-collapse.is-open > .pm-people-age-collapse__inner {
  max-height: none !important;
  overflow: visible !important;
  border: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

/* Indicadores socioeconômicos. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-socio-card-head .pm-socio-reset {
  flex: none !important;
  min-height: 0 !important;
  padding: 6px 10px !important;
  border-radius: 999px !important;
  background: #fffcf8 !important;
  color: var(--pm-mh-blue, #2c77c9) !important;
  -webkit-text-fill-color: var(--pm-mh-blue, #2c77c9) !important;
  font: 500 12.5px/1 "Roboto", system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-socio-slider-row {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  margin: 0 !important;
  padding: 0 8px 0 0 !important;
  border: 0 !important;
  background: transparent !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-socio-slider-block {
  display: grid !important;
  gap: 4px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-socio-slider-block label {
  color: #687586 !important;
  -webkit-text-fill-color: #687586 !important;
  font: 500 12.5px/1.2 "Roboto", system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-socio-slider-value strong {
  color: #172438 !important;
  -webkit-text-fill-color: #172438 !important;
  font: 600 14px/1.2 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-socio-slider-value span,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-age-ticks span {
  color: #8a94a3 !important;
  -webkit-text-fill-color: #8a94a3 !important;
  font: 400 12px/1.2 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-socio-stats {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-socio-stat {
  display: grid !important;
  gap: 2px !important;
  padding: 10px 8px !important;
  text-align: center !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-socio-stat span {
  color: #687586 !important;
  -webkit-text-fill-color: #687586 !important;
  font: 400 11.5px/1.2 "Roboto", system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-socio-stat strong {
  color: #172438 !important;
  -webkit-text-fill-color: #172438 !important;
  font: 600 16px/1.2 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-legend > .pm-socio-legend-head,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-legend > .pm-bairros-foot {
  flex: 1 1 100% !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-socio-legend-head {
  display: flex !important;
  align-items: baseline !important;
  gap: 8px !important;
  margin: 2px 0 2px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-socio-legend-head strong {
  color: #172438 !important;
  -webkit-text-fill-color: #172438 !important;
  font: 500 13px/1.2 "Roboto", system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-socio-legend-head span {
  color: #8a94a3 !important;
  -webkit-text-fill-color: #8a94a3 !important;
  font: 400 12px/1.2 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-legend > .pm-bairros-foot {
  margin-top: 4px !important;
}

/* ── Tipografia padrão de todos os filtros ─────────────────────────
   Roboto, sem caixa-alta: títulos em tinta (500), apoio em cinza (400), ações em azul. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList *,
html.pm-mh-map #pmDomiciliosSidebarPopover *,
html.pm-mh-map #pmBairrosFaixaPortal * {
  font-family: "Roboto", system-ui, -apple-system, "Segoe UI", sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-shadow: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-dom-picker-toggle-main {
  font: 500 14px/1.25 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-bairros-faixa-toggle .pm-dom-picker-toggle-extra {
  color: #687586 !important;
  -webkit-text-fill-color: #687586 !important;
  font: 400 12px/1.25 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-age-value {
  color: #172438 !important;
  -webkit-text-fill-color: #172438 !important;
  font: 500 13px/1.3 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-hint {
  font: 400 13px/1.4 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-menu-option {
  font: 500 14px/1.25 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-socio-menu-group__label {
  font: 500 12.5px/1.2 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-territory-btn,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-people-territory-btn * {
  font-size: 13.5px !important;
  font-weight: 500 !important;
}

/* Macrorregião */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-macro-kpi span,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-macro-kpi small {
  font: 400 11.5px/1.3 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-macro-kpi strong {
  font: 600 17px/1.2 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-macro-legend-item strong {
  color: #172438 !important;
  -webkit-text-fill-color: #172438 !important;
  font: 500 13.5px/1.25 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-macro-legend-item span:not(.pm-macro-swatch) {
  color: #687586 !important;
  -webkit-text-fill-color: #687586 !important;
  font: 400 12px/1.3 "Roboto", system-ui, sans-serif !important;
}

/* Rotas de coleta */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-chip {
  font-size: 13.5px !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-resumo strong {
  font: 500 15px/1.25 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-resumo span,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-grupo-head,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-grupo-head span,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-hint,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-vazio,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-carga-legenda span {
  font-size: 12.5px !important;
  font-weight: 400 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-hint,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-vazio,
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-carga-legenda span {
  color: #8a94a3 !important;
  -webkit-text-fill-color: #8a94a3 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-grupo-head .pm-coleta-turno {
  font-weight: 500 !important;
  text-transform: capitalize !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-row .mlr-title {
  font-weight: 500 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-km {
  font: 500 12px/1 "Roboto", system-ui, sans-serif !important;
}

/* No celular as rotas não se desligam: a linha só enquadra a rota no mapa. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-row .map-toggle {
  display: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-card {
  width: auto !important;
}

/* Filtros com rótulo em cima, como nos outros painéis do celular. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-campo {
  display: block;
  margin: 4px 0 0;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList .pm-coleta-campo > .pm-people-label {
  display: block;
}

/* Rendimento: o app escreve o estilo direto no HTML; o !important da folha vence o inline. */
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList > div:not(.pm-special-panel, .map-layer-section-group, .map-layer-row) {
  padding: 14px 14px 16px !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList > div:not(.pm-special-panel, .map-layer-section-group, .map-layer-row) > .map-legend-card {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList > div:not(.pm-special-panel, .map-layer-section-group, .map-layer-row) [style*="font-size:15px"] {
  color: #172438 !important;
  font: 600 17px/1.25 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList > div:not(.pm-special-panel, .map-layer-section-group, .map-layer-row) [style*="font-size:12px"],
html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList > div:not(.pm-special-panel, .map-layer-section-group, .map-layer-row) [style*="font-size:11px"] {
  color: #687586 !important;
  font-weight: 400 !important;
  font-size: 12.5px !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList > div:not(.pm-special-panel, .map-layer-section-group, .map-layer-row) [style*="font-size:10px"] {
  background: #e6edf7 !important;
  color: var(--pm-mh-blue, #2c77c9) !important;
  font-size: 11.5px !important;
  font-weight: 500 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList > div:not(.pm-special-panel, .map-layer-section-group, .map-layer-row) [style*="border-radius:14px"] {
  border: 0 !important;
  background: #f3efe9 !important;
}

html.pm-mh-map #pmMapSidebar:not(#pm-mh-x) #mapLayersList > div:not(.pm-special-panel, .map-layer-section-group, .map-layer-row) [style*="border-radius:14px"] > div {
  color: #4b5563 !important;
  font-weight: 500 !important;
  font-size: 13px !important;
}

/* Janelinhas de seleção (mapas de domicílios, faixas etárias). */
html.pm-mh-map #pmDomiciliosSidebarPopover .pm-domicilios-sidebar-popover-head strong,
html.pm-mh-map #pmBairrosFaixaPortal .pm-bairros-faixa-popover__title {
  color: #172438 !important;
  -webkit-text-fill-color: #172438 !important;
  font: 500 14px/1.2 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmDomiciliosSidebarPopover .pm-domicilios-sidebar-popover-head button,
html.pm-mh-map #pmBairrosFaixaPortal .pm-bairros-faixa-popover__close {
  min-height: 0 !important;
  padding: 6px 12px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #f3efe9 !important;
  box-shadow: none !important;
  color: var(--pm-mh-blue, #2c77c9) !important;
  -webkit-text-fill-color: var(--pm-mh-blue, #2c77c9) !important;
  font: 500 13px/1 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmDomiciliosSidebarPopover .pm-dom-sidebar-option-check,
html.pm-mh-map #pmBairrosFaixaPortal .pm-bairros-faixa-option__mark {
  display: grid !important;
  place-items: center !important;
  flex: none !important;
  width: 22px !important;
  height: 22px !important;
  border: 1.5px solid #cfc7bb !important;
  border-radius: 999px !important;
  background: #fffcf8 !important;
  box-shadow: none !important;
}

html.pm-mh-map #pmDomiciliosSidebarPopover .pm-dom-sidebar-option.is-active .pm-dom-sidebar-option-check,
html.pm-mh-map #pmBairrosFaixaPortal .pm-bairros-faixa-option.is-active .pm-bairros-faixa-option__mark {
  border-color: var(--pm-mh-blue, #2c77c9) !important;
  background: var(--pm-mh-blue, #2c77c9) !important;
}

html.pm-mh-map #pmDomiciliosSidebarPopover .pm-dom-sidebar-option-check svg,
html.pm-mh-map #pmDomiciliosSidebarPopover .pm-dom-sidebar-option-check svg *,
html.pm-mh-map #pmBairrosFaixaPortal .pm-bairros-faixa-option__mark svg,
html.pm-mh-map #pmBairrosFaixaPortal .pm-bairros-faixa-option__mark svg * {
  color: #fff !important;
  stroke: #fff !important;
  fill: none !important;
  opacity: 1 !important;
}

/* Popovers dos seletores: mesma superfície do cartão. */
html.pm-mh-map #pmDomiciliosSidebarPopover,
html.pm-mh-map #pmBairrosFaixaPortal {
  border: 0 !important;
  border-radius: 18px !important;
  background: var(--pm-mh-map-surface) !important;
  box-shadow: 0 10px 28px rgba(23, 46, 77, 0.16) !important;
}

html.pm-mh-map #pmDomiciliosSidebarPopover .pm-dom-sidebar-option,
html.pm-mh-map #pmBairrosFaixaPortal .pm-bairros-faixa-option {
  border: 0 !important;
  border-radius: 14px !important;
  background: #f3efe9 !important;
  box-shadow: none !important;
}

html.pm-mh-map #pmDomiciliosSidebarPopover .pm-dom-sidebar-option.is-active,
html.pm-mh-map #pmBairrosFaixaPortal .pm-bairros-faixa-option.is-active {
  background: #e6edf7 !important;
}

html.pm-mh-map #pmDomiciliosSidebarPopover .pm-dom-sidebar-option-main,
html.pm-mh-map #pmBairrosFaixaPortal .pm-bairros-faixa-option {
  color: #172438 !important;
  -webkit-text-fill-color: #172438 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
}

html.pm-mh-map #pmDomiciliosSidebarPopover .pm-dom-sidebar-option-extra {
  color: #687586 !important;
  -webkit-text-fill-color: #687586 !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
}

/* ── Controles do mapa ────────────────────────────────────────── */
html.pm-mh-map #pmMapLayout .pm-map-corner-right {
  position: fixed !important;
  top: auto !important;
  left: auto !important;
  right: 14px !important;
  bottom: calc(var(--pm-mh-dock-h, 72px) + env(safe-area-inset-bottom, 0px) + var(--pm-mh-sheet-peek) + 14px) !important;
  display: flex !important;
  flex-direction: column !important;
  width: auto !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  overflow: visible !important;
  z-index: 55 !important;
}

html.pm-mh-map #pmMapLayout .pm-map-corner-right > :not(#pmMapCompassBtn) {
  display: none !important;
}

html.pm-mh-map #pmMapLayout #pmMapCompassBtn {
  display: grid !important;
  place-items: center !important;
  width: 46px !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--pm-mh-map-surface) !important;
  box-shadow: var(--pm-mh-map-shadow) !important;
  color: var(--pm-mh-blue, #2c77c9) !important;
}

html.pm-mh-map #pmMapLayout .pm-map-bottom-hud {
  display: none !important;
}

/* A legenda já vem dentro do cartão de filtros. */
html.pm-mh-map #pmPeopleNativePanel.pm-macro-legend-panel {
  display: none !important;
}

/* ── Cartão da região tocada: valor em baixo à esquerda, expande com as camadas ── */

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel, #pmWeatherNativePanel) {
  position: fixed !important;
  top: auto !important;
  right: var(--pm-mh-card-right) !important;
  left: 12px !important;
  bottom: calc(var(--pm-mh-dock-h, 72px) + env(safe-area-inset-bottom, 0px) + var(--pm-mh-sheet-peek, 28px) + 12px) !important;
  z-index: 55 !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  max-height: none !important;
  display: flex !important;
  flex-direction: column !important;
  border: 0 !important;
  border-radius: 18px !important;
  background: var(--pm-mh-map-surface, #fbf8f3) !important;
  box-shadow: var(--pm-mh-map-shadow) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  overflow: hidden !important;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel, #pmWeatherNativePanel)[hidden] {
  display: none !important;
}

/* Aberto, quem rola é a lista de camadas: assim a faixa do fechar cobre o cartão inteiro. */
html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel, #pmWeatherNativePanel).is-mh-open {
  max-height: calc(100dvh - var(--pm-mh-dock-h, 72px) - env(safe-area-inset-bottom, 0px) - var(--pm-mh-sheet-peek, 28px) - 120px - var(--pm-mh-point-h, 0px)) !important;
  cursor: default;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel, #pmWeatherNativePanel).is-mh-open > :not(.pm-weather-native-layers) {
  flex: none;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel, #pmWeatherNativePanel).is-mh-open .pm-weather-native-layers {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto !important;
  overscroll-behavior: contain;
}

/* Botões: seta de expandir no canto e o fechar como faixa na lateral direita, de cima a baixo. */
html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel, #pmWeatherNativePanel) .pm-weather-native-panel-head {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  order: 0;
  display: flex;
  align-items: flex-start;
  gap: 0;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  pointer-events: none;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel, #pmWeatherNativePanel) .pm-weather-native-panel-head > button {
  pointer-events: auto;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel, #pmWeatherNativePanel) .pm-weather-native-panel-title {
  display: none;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel, #pmWeatherNativePanel) :is(.pm-weather-native-panel-close, .pm-mh-region-toggle) {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  margin: 0;
  padding: 0;
  border: 0 !important;
  border-radius: 999px;
  background: #f3efe9 !important;
  box-shadow: none !important;
  color: #4a5566 !important;
  cursor: pointer;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel, #pmWeatherNativePanel) .pm-weather-native-panel-close :is(svg, svg *) {
  stroke: currentColor !important;
  color: inherit !important;
}

/* Fechado, a seta fica no meio da altura do cartão; aberto, sobe para o topo junto do título. */
html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel, #pmWeatherNativePanel) .pm-mh-region-toggle,
:is(#pmMhPointCard, #pmMhStreetCard, #pmMhRadiusCard) .pm-mh-card-actions .pm-mh-region-toggle {
  align-self: center;
  margin: 0 8px 0 0;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel, #pmWeatherNativePanel).is-mh-open .pm-mh-region-toggle,
:is(#pmMhStreetCard, #pmMhRadiusCard).is-mh-open .pm-mh-card-actions .pm-mh-region-toggle {
  align-self: flex-start;
  margin-top: 8px;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel, #pmWeatherNativePanel) .pm-weather-native-panel-close,
:is(#pmMhPointCard, #pmMhStreetCard, #pmMhRadiusCard) .pm-mh-card-actions .pm-mh-card-close {
  align-self: stretch;
  width: var(--pm-mh-card-close-w) !important;
  min-width: var(--pm-mh-card-close-w) !important;
  height: auto !important;
  border-radius: 0 !important;
  background: #e6edf7 !important;
  box-shadow: none !important;
  color: var(--pm-mh-blue, #2c77c9) !important;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel, #pmWeatherNativePanel) .pm-weather-native-panel-close:active,
:is(#pmMhPointCard, #pmMhStreetCard, #pmMhRadiusCard) .pm-mh-card-actions .pm-mh-card-close:active {
  background: #d6e3f4 !important;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel, #pmWeatherNativePanel, #pmMhPointCard, #pmMhStreetCard, #pmMhRadiusCard) .pm-mh-region-toggle svg {
  width: 14px;
  height: 14px;
  transform: rotate(180deg);
  transition: transform 0.24s ease;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel, #pmWeatherNativePanel, #pmMhPointCard, #pmMhStreetCard, #pmMhRadiusCard).is-mh-open .pm-mh-region-toggle svg {
  transform: none;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel) .pm-weather-native-legend {
  order: 1;
  padding: 10px calc(var(--pm-mh-card-close-w) + 42px) 10px 14px !important;
  border: 0 !important;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel) .pm-weather-native-legend-title {
  margin: 0 0 1px;
  font: 500 11px/1.3 Roboto, system-ui, sans-serif;
  letter-spacing: 0.02em;
  text-transform: none;
  color: #687586;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel) .pm-people-native-bairro {
  font: 500 13.5px/1.25 Roboto, system-ui, sans-serif;
  color: #172438;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel) .pm-people-native-sex {
  font-size: 16px;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel) .pm-people-native-value {
  margin-top: 1px;
  font: 600 16px/1.2 Roboto, system-ui, sans-serif;
  color: var(--pm-mh-blue, #2c77c9);
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel):not(.is-mh-open) :is(.pm-people-native-street, .pm-people-native-hint, .pm-weather-native-layers, .pm-weather-native-foot) {
  display: none !important;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel).is-mh-open .pm-weather-native-legend {
  padding-bottom: 6px !important;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel) .pm-weather-native-layers {
  order: 2;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 8px calc(var(--pm-mh-card-close-w) + 10px) 4px 12px !important;
  border: 0 !important;
  background: transparent !important;
  overflow: visible !important;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel) .pm-weather-native-layers::before {
  content: "Na região";
  padding: 4px 4px 0;
  font: 500 12.5px/1.3 Roboto, system-ui, sans-serif;
  color: #687586;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel) .pm-people-native-row.map-layer-row {
  position: relative;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  width: 100% !important;
  min-height: 58px !important;
  margin: 0 !important;
  padding: 10px 14px 10px 12px !important;
  border: 0 !important;
  border-radius: 16px !important;
  background: #f3efe9 !important;
  box-shadow: none !important;
  color: #172438 !important;
  cursor: pointer;
  transition: background-color 0.18s ease, color 0.18s ease;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel) .pm-people-native-row.map-layer-row[hidden],
html.pm-mh-map #pmPeopleNativePanel .pm-people-native-row.is-people-catalog-hidden {
  display: none !important;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel) .pm-people-native-row .mlr-left {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel) .pm-people-native-row .mlr-icon {
  display: grid !important;
  place-items: center !important;
  flex: none !important;
  width: 34px !important;
  height: 34px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: #fffcf8 !important;
  color: var(--pm-mh-blue, #2c77c9) !important;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel) .pm-people-native-row .mlr-title {
  font: 500 15px/1.25 Roboto, system-ui, sans-serif !important;
  color: inherit !important;
  white-space: normal !important;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel) .pm-people-native-row .mlr-sub {
  margin-top: 1px;
  font: 400 12.5px/1.3 Roboto, system-ui, sans-serif !important;
  color: #687586 !important;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel) .pm-people-native-row .mlr-action {
  position: absolute !important;
  inset: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel) .pm-people-native-row.map-layer-row:is(.on, :has(input:checked)) {
  background: linear-gradient(180deg, #3a86d6 0%, var(--pm-mh-blue, #2c77c9) 100%) !important;
  color: #fff !important;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel) .pm-people-native-row.map-layer-row:is(.on, :has(input:checked)) .mlr-icon {
  background: rgba(255, 255, 255, 0.2) !important;
  color: #fff !important;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel) .pm-people-native-row.map-layer-row:is(.on, :has(input:checked)) .mlr-sub {
  color: rgba(255, 255, 255, 0.82) !important;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel) .pm-people-native-row.is-empty {
  opacity: 0.55;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel) .pm-people-native-street {
  order: 1;
}

html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel) .pm-weather-native-foot {
  order: 3;
  margin: 0 !important;
  padding: 8px calc(var(--pm-mh-card-close-w) + 14px) 14px 16px !important;
  font: 400 11.5px/1.35 Roboto, system-ui, sans-serif !important;
  color: #8a94a2 !important;
}

/* ── Cartão do ponto tocado (acima do cartão da região quando os dois existem) ── */

:is(#pmMhPointCard, #pmMhStreetCard, #pmMhRadiusCard) {
  display: none;
}

html.pm-mh-map :is(#pmMhPointCard, #pmMhStreetCard, #pmMhRadiusCard):not([hidden]) {
  position: fixed;
  left: 12px;
  right: var(--pm-mh-card-right);
  bottom: calc(var(--pm-mh-dock-h, 72px) + env(safe-area-inset-bottom, 0px) + var(--pm-mh-sheet-peek, 28px) + 12px);
  z-index: 56;
  display: flex;
  flex-direction: column;
  border-radius: 18px;
  background: var(--pm-mh-map-surface, #fbf8f3);
  box-shadow: var(--pm-mh-map-shadow);
  overflow: hidden;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transform: translate3d(0, 0, 0);
  opacity: 1;
  transition:
    transform 0.42s cubic-bezier(0.22, 1, 0.36, 1),
    opacity 0.3s ease;
}

html.pm-mh-map :is(#pmMhPointCard, #pmMhStreetCard, #pmMhRadiusCard).is-enter-from,
html.pm-mh-map :is(#pmMhPointCard, #pmMhStreetCard, #pmMhRadiusCard).is-closing {
  transform: translate3d(calc(-100% - 28px), 0, 0);
  opacity: 0;
}

html.pm-mh-map :is(#pmMhPointCard, #pmMhStreetCard, #pmMhRadiusCard).is-closing {
  pointer-events: none;
}

:is(#pmMhPointCard, #pmMhStreetCard, #pmMhRadiusCard) .pm-mh-card-actions {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  display: flex;
  align-items: flex-start;
}

:is(#pmMhPointCard, #pmMhStreetCard, #pmMhRadiusCard) .pm-mh-card-actions button {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: #f3efe9;
  color: #4a5566;
  cursor: pointer;
}

:is(#pmMhPointCard, #pmMhStreetCard, #pmMhRadiusCard) .pm-mh-point-card__head {
  flex: none;
  padding: 10px calc(var(--pm-mh-card-close-w) + 42px) 10px 14px;
}

:is(#pmMhPointCard, #pmMhStreetCard, #pmMhRadiusCard) .pm-mh-point-card__layer {
  margin: 0 0 1px;
  font: 500 11px/1.3 Roboto, system-ui, sans-serif;
  letter-spacing: 0.02em;
  color: #687586;
}

:is(#pmMhPointCard, #pmMhStreetCard, #pmMhRadiusCard) .pm-mh-point-card__title {
  font: 500 13.5px/1.3 Roboto, system-ui, sans-serif;
  color: #172438;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

/* Logradouro: aberto, mostra os dados da rua no próprio cartão. */
html.pm-mh-map #pmMhStreetCard.is-mh-open:not([hidden]) {
  cursor: default;
}

#pmMhStreetCard.is-mh-open .pm-mh-point-card__head {
  cursor: pointer;
}

#pmMhStreetCard.is-mh-open .pm-mh-point-card__title {
  -webkit-line-clamp: 3;
}

#pmMhStreetCard .pm-mh-street-card__rows {
  display: none;
}

#pmMhStreetCard.is-mh-open .pm-mh-street-card__rows {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-height: 0;
  padding: 0 calc(var(--pm-mh-card-close-w) + 10px) 12px 12px;
  overflow-y: auto;
  overscroll-behavior: contain;
}

#pmMhStreetCard .pm-mh-street-card__row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px;
  border-radius: 14px;
  background: #f3efe9;
}

#pmMhStreetCard .pm-mh-street-card__row span {
  font: 400 13px/1.3 Roboto, system-ui, sans-serif;
  color: #687586;
}

#pmMhStreetCard .pm-mh-street-card__row strong {
  font: 500 14px/1.3 Roboto, system-ui, sans-serif;
  color: #172438;
  text-align: right;
  overflow-wrap: anywhere;
}

#pmMhStreetCard .pm-mh-street-card__row span {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

#pmMhStreetCard .pm-mh-street-card__rows > * {
  flex: none;
}

#pmMhStreetCard .pm-mh-street-card__dot {
  flex: none;
  width: 10px;
  height: 10px;
  border-radius: 999px;
}

#pmMhStreetCard .pm-mh-street-card__action {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  margin: 4px 0 0;
  padding: 0 12px;
  border: 0;
  border-radius: 12px;
  background: #e6edf7;
  color: var(--pm-mh-blue, #2c77c9);
  font: 500 14px/1 Roboto, system-ui, sans-serif;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

#pmMhStreetCard .pm-mh-street-card__action:active {
  background: #d6e3f4;
}

/* A rua tem cartão próprio; no cartão da região ela ficaria repetida. */
html.pm-mh-map :is(#pmPeopleNativePanel, #pmSocioNativePanel) .pm-people-native-street {
  display: none !important;
}

/* Com o painel inferior (ou o de ferramentas) aberto, os cartões do mapa saem da frente dele. */
html.pm-mh-map.pm-mh-sheet-open :is(#pmPeopleNativePanel, #pmSocioNativePanel, #pmWeatherNativePanel, #pmMhPointCard, #pmMhStreetCard, #pmMhRadiusCard),
html.pm-mh-map.pm-mh-tools-open :is(#pmPeopleNativePanel, #pmSocioNativePanel, #pmWeatherNativePanel, #pmMhPointCard, #pmMhStreetCard, #pmMhRadiusCard) {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: opacity 0.2s ease, visibility 0s linear 0.2s !important;
}

/* Ficha completa do ponto em tela cheia: é o mesmo #pmtab-indicadores do desktop, movido para cá. */

#pmMhPointView {
  display: none;
}

html.pm-mh-map #pmMhPointView:not([hidden]) {
  position: fixed;
  inset: 0;
  z-index: 9000;
  display: block;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  padding: var(--pm-safe-top, env(safe-area-inset-top, 0px)) 0 calc(env(safe-area-inset-bottom, 0px) + 24px);
  background: var(--pm-mh-map-surface, #fbf8f3);
  transform: translate3d(0, 0, 0);
  opacity: 1;
  transition:
    transform 0.38s cubic-bezier(0.22, 1, 0.36, 1),
    opacity 0.26s ease;
}

html.pm-mh-map #pmMhPointView.is-enter-from,
html.pm-mh-map #pmMhPointView.is-closing {
  transform: translate3d(0, 28px, 0);
  opacity: 0;
}

html.pm-mh-map #pmMhPointView #pmtab-indicadores {
  position: static !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 12px 12px 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}

html.pm-mh-map #pmMhPointView .pm-ind-section-head,
html.pm-mh-map #pmMhPointView .pm-point-hero__back {
  display: none !important;
}

#pmMhPointView .pm-mh-point-view__bar {
  position: sticky;
  top: 0;
  z-index: 5;
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 60px;
  padding: 10px 16px 10px 12px;
  background: var(--pm-mh-map-surface, #fbf8f3);
  box-shadow: 0 1px 0 rgba(23, 36, 56, 0.08);
}

#pmMhPointView .pm-mh-point-view__back {
  display: grid;
  place-items: center;
  flex: none;
  width: 40px;
  height: 40px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: #f3efe9;
  color: var(--pm-mh-blue, #2c77c9);
  cursor: pointer;
}

#pmMhPointView .pm-mh-point-view__title {
  min-width: 0;
  overflow: hidden;
  font: 500 17px/1.25 Roboto, system-ui, sans-serif;
  color: #172438;
  white-space: nowrap;
  text-overflow: ellipsis;
}

html.pm-mh-map #pmMhPointView #mapInfoPanel {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

/* ── Indicadores Socioeconômicos: ficha do bairro só pelo "Mais informações" do cartão ── */
.pm-mh-region-more {
  display: none;
}

html.pm-mh-map #pmSocioNativePanel.is-mh-open > .pm-mh-region-more:not([hidden]) {
  order: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  height: 40px;
  margin: 2px calc(var(--pm-mh-card-close-w) + 10px) 2px 12px;
  padding: 0 12px;
  border: 0;
  border-radius: 12px;
  background: #e6edf7;
  color: var(--pm-mh-blue, #2c77c9);
  font: 500 14px/1 Roboto, system-ui, sans-serif;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

html.pm-mh-map #pmSocioNativePanel > .pm-mh-region-more:active {
  background: #d6e3f4;
}

#pmMhPointView .pm-mh-socio-detail {
  padding: 16px 16px 0;
  color: #687586;
}

#pmMhPointView .pm-socio-popup-head {
  display: grid;
  gap: 2px;
  margin-bottom: 14px;
}

#pmMhPointView .pm-socio-popup-title {
  margin: 0;
  font: 600 22px/1.2 Roboto, system-ui, sans-serif;
  letter-spacing: -0.01em;
  color: #172438;
}

#pmMhPointView .pm-socio-popup-sub {
  margin: 0;
  font: 400 13px/1.35 Roboto, system-ui, sans-serif;
  color: #687586;
}

#pmMhPointView .pm-socio-popup-hero {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 10px;
  padding: 16px;
  border: 0;
  border-radius: 18px;
  background: #e6edf7;
  box-shadow: none;
}

#pmMhPointView .pm-socio-popup-hero__icon {
  display: grid;
  place-items: center;
  flex: none;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  background: #fffcf8;
  color: var(--pm-mh-blue, #2c77c9);
}

#pmMhPointView .pm-socio-popup-hero__icon svg {
  width: 20px;
  height: 20px;
}

#pmMhPointView .pm-socio-popup-hero__main {
  display: grid;
  gap: 4px;
  min-width: 0;
}

#pmMhPointView .pm-socio-popup-hero__value {
  font: 700 28px/1.1 Roboto, system-ui, sans-serif;
  letter-spacing: -0.02em;
  color: var(--pm-mh-blue, #2c77c9);
  font-variant-numeric: tabular-nums;
}

#pmMhPointView .pm-socio-popup-hero__desc {
  font: 400 12.5px/1.4 Roboto, system-ui, sans-serif;
  color: #4a5566;
}

#pmMhPointView .pm-socio-popup-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

#pmMhPointView .pm-socio-popup-stat {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  min-width: 0;
  padding: 12px;
  border: 0;
  border-radius: 16px;
  background: #f3efe9;
  box-shadow: none;
}

#pmMhPointView .pm-socio-popup-stat__icon {
  display: grid;
  place-items: center;
  flex: none;
  width: 32px;
  height: 32px;
  border-radius: 999px;
  background: #fffcf8;
  color: var(--pm-mh-blue, #2c77c9);
}

#pmMhPointView .pm-socio-popup-stat__icon svg {
  width: 15px;
  height: 15px;
}

#pmMhPointView .pm-socio-popup-stat__copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}

#pmMhPointView .pm-socio-popup-stat__label {
  font: 400 12px/1.3 Roboto, system-ui, sans-serif;
  color: #687586;
}

#pmMhPointView .pm-socio-popup-stat__value {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

#pmMhPointView .pm-socio-popup-stat__value strong {
  font: 600 16px/1.2 Roboto, system-ui, sans-serif;
  color: #172438;
  font-variant-numeric: tabular-nums;
}

#pmMhPointView .pm-socio-popup-stat__value em {
  padding: 2px 7px;
  border-radius: 999px;
  background: #e6edf7;
  color: var(--pm-mh-blue, #2c77c9);
  font: 600 11px/1.2 Roboto, system-ui, sans-serif;
  font-style: normal;
}

/* ── "×" redondo acima do painel aberto (painel principal e ferramentas) ── */
.pm-mh-float-close {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: rgba(251, 248, 243, 0.94);
  box-shadow: 0 4px 14px rgba(23, 46, 77, 0.16);
  color: #4a5566;
  cursor: pointer;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  -webkit-tap-highlight-color: transparent;
}

.pm-mh-float-close:active {
  background: #efeae3;
}

#pmMhSheetClose {
  display: none;
}

html.pm-mh-map #pmMhSheetClose {
  position: fixed;
  top: calc(var(--pm-mh-sheet-top) - 44px - 12px);
  left: 50%;
  z-index: 8300;
  display: grid;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  translate: -50% 10px;
  transition: opacity 0.2s ease, translate 0.2s ease, visibility 0s linear 0.2s;
}

html.pm-mh-map.pm-mh-sheet-open:not(.pm-mh-filters) #pmMhSheetClose {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  translate: -50% 0;
  transition: opacity 0.24s ease 0.16s, translate 0.24s ease 0.16s, visibility 0s;
}

/* ── Botão de ferramentas ao lado da busca ─────────────────────── */
#pmMhToolsBtnWrap {
  display: none;
}

html.pm-mh-map #pmMhToolsBtnWrap:not([hidden]) {
  position: fixed;
  top: calc(var(--pm-safe-top, env(safe-area-inset-top, 0px)) + 12px);
  right: 14px;
  z-index: 8400;
  display: block;
  width: 52px;
  height: 52px;
}

#pmMhToolsBtn {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 18px;
  background: var(--pm-mh-map-surface);
  box-shadow: var(--pm-mh-map-shadow);
  color: var(--pm-mh-blue, #2c77c9);
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease;
  -webkit-tap-highlight-color: transparent;
}

#pmMhToolsBtn svg {
  width: 24px;
  height: 24px;
}

#pmMhToolsBtn[aria-expanded="true"],
#pmMhToolsBtn.is-tool-active {
  background: linear-gradient(180deg, #3a86d6 0%, var(--pm-mh-blue, #2c77c9) 100%);
  box-shadow: 0 6px 16px rgba(44, 119, 201, 0.3);
  color: #fff;
}

/* Dica curta depois de ligar uma ferramenta. */
.pm-mh-tool-hint {
  position: fixed;
  top: calc(var(--pm-safe-top, env(safe-area-inset-top, 0px)) + 74px);
  left: 14px;
  right: 14px;
  z-index: 8450;
  padding: 11px 16px;
  border-radius: 16px;
  background: rgba(23, 36, 56, 0.92);
  color: #fff;
  font: 500 13.5px/1.35 "Roboto", system-ui, sans-serif;
  text-align: center;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  translate: 0 -6px;
  transition: opacity 0.22s ease, translate 0.22s ease, visibility 0s linear 0.22s;
}

.pm-mh-tool-hint.is-visible {
  opacity: 1;
  visibility: visible;
  translate: 0 0;
  transition: opacity 0.22s ease, translate 0.22s ease, visibility 0s;
}

/* ── Painel "Ferramentas" ──────────────────────────────────────── */
#pmMhTools {
  display: none;
}

html.pm-mh-map #pmMhTools {
  position: fixed;
  left: 0;
  right: 0;
  bottom: calc(var(--pm-mh-dock-h, 72px) + env(safe-area-inset-bottom, 0px));
  z-index: 8300;
  display: flex;
  flex-direction: column;
  align-items: center;
  max-height: calc(100dvh - var(--pm-mh-dock-h, 72px) - env(safe-area-inset-bottom, 0px) - var(--pm-safe-top, env(safe-area-inset-top, 0px)) - 84px);
  pointer-events: none;
  visibility: hidden;
  translate: 0 calc(100% + 24px);
  transition: translate 0.4s cubic-bezier(0.32, 0.72, 0, 1), visibility 0s linear 0.4s;
}

html.pm-mh-map #pmMhTools.is-open {
  visibility: visible;
  translate: 0 0;
  transition: translate 0.44s cubic-bezier(0.32, 0.72, 0, 1), visibility 0s;
}

#pmMhTools .pm-mh-tools__close {
  flex: none;
  margin: 0 0 12px;
  pointer-events: auto;
}

#pmMhTools .pm-mh-tools__sheet {
  display: flex;
  flex-direction: column;
  width: 100%;
  min-height: 0;
  border-radius: 24px 24px 0 0;
  background: var(--pm-mh-map-surface);
  box-shadow: 0 -8px 28px rgba(23, 46, 77, 0.12);
  font-family: "Roboto", system-ui, -apple-system, "Segoe UI", sans-serif;
  pointer-events: auto;
  touch-action: pan-y;
}

#pmMhTools .pm-mh-tools__grip {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 100%;
  height: 24px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: grab;
}

#pmMhTools .pm-mh-tools__grip span {
  width: 40px;
  height: 4px;
  border-radius: 999px;
  background: #d5d1cc;
}

#pmMhTools .pm-mh-tools__title {
  flex: none;
  margin: 2px 20px 12px;
  color: #172438;
  font: 600 19px/1.2 "Roboto", system-ui, sans-serif;
}

#pmMhTools .pm-mh-tools__body {
  min-height: 0;
  padding: 0 0 28px;
  overflow-y: auto;
  overscroll-behavior: contain;
}

#pmMhTools .pm-mh-tools__label {
  margin: 18px 20px 10px;
  color: #8a94a3;
  font: 600 11.5px/1.2 "Roboto", system-ui, sans-serif;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

#pmMhTools .pm-mh-tools__label[hidden] {
  display: none;
}

/* Tipos de mapa: miniaturas numa fileira que rola de lado.
   A rolagem lateral também recorta em cima e embaixo: o respiro deixa o anel da escolhida inteiro. */
#pmMhTools .pm-mh-tools__types {
  display: flex;
  gap: 12px;
  padding: 6px 20px;
  overflow-x: auto;
  scrollbar-width: none;
  overscroll-behavior-x: contain;
}

#pmMhTools .pm-mh-tools__types::-webkit-scrollbar {
  display: none;
}

#pmMhTools .pm-mh-tools__type {
  display: flex;
  flex: none;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  width: 116px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #4a5566;
  font: 500 13px/1.2 "Roboto", system-ui, sans-serif;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

#pmMhTools .pm-mh-tools__thumb {
  display: block;
  width: 100%;
  height: 76px;
  border-radius: 14px;
  box-shadow: inset 0 0 0 1px rgba(23, 36, 56, 0.08);
  background-size: cover;
  background-position: center;
}

#pmMhTools .pm-mh-tools__type.is-active {
  color: var(--pm-mh-blue, #2c77c9);
}

#pmMhTools .pm-mh-tools__type.is-active .pm-mh-tools__thumb {
  box-shadow: 0 0 0 2px var(--pm-mh-map-surface), 0 0 0 4px var(--pm-mh-blue, #2c77c9);
}

/* Ferramentas: grade de quatro. */
#pmMhTools .pm-mh-tools__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  padding: 0 16px;
}

#pmMhTools .pm-mh-tools__tool {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  min-width: 0;
  min-height: 104px;
  margin: 0;
  padding: 14px 4px 12px;
  border: 0;
  border-radius: 16px;
  background: #fffcf8;
  box-shadow: inset 0 0 0 1px #ece6dd;
  color: #172438;
  font: 500 12px/1.25 "Roboto", system-ui, sans-serif;
  text-align: center;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

#pmMhTools .pm-mh-tools__tool:active {
  background: #f6f2ec;
}

#pmMhTools .pm-mh-tools__tool-icon {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: #e6edf7;
  color: var(--pm-mh-blue, #2c77c9);
}

#pmMhTools .pm-mh-tools__tool-icon svg {
  width: 22px;
  height: 22px;
}

#pmMhTools .pm-mh-tools__tool.is-active {
  box-shadow: inset 0 0 0 1.5px var(--pm-mh-blue, #2c77c9);
}

#pmMhTools .pm-mh-tools__tool.is-active .pm-mh-tools__tool-icon {
  background: var(--pm-mh-blue, #2c77c9);
  color: #fff;
}

/* ── Clima por bairro (ferramenta): mesmo cartão da região ──────────
   Fechado: camada · horário, bairro tocado e valor. Aberto: métricas do bairro, camadas,
   legenda e horários. A posição, a seta e a faixa de fechar vêm das regras do cartão da região. */
html.pm-mh-map #pmWeatherNativePanel:not(#pm-mh-x) {
  padding: 0 !important;
  gap: 0 !important;
  font-family: "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmWeatherNativePanel:not(.is-mh-open):not(#pm-mh-x) > :not(.pm-weather-native-panel-head, .pm-mh-weather-summary) {
  display: none !important;
}

html.pm-mh-map #pmWeatherNativePanel .pm-mh-weather-summary {
  display: flex;
  flex: none;
  flex-direction: column;
  gap: 1px;
  padding: 10px calc(var(--pm-mh-card-close-w) + 42px) 10px 14px;
}

html.pm-mh-map #pmWeatherNativePanel .pm-mh-weather-summary__label {
  font: 500 11px/1.3 Roboto, system-ui, sans-serif;
  letter-spacing: 0.02em;
  color: #687586;
}

html.pm-mh-map #pmWeatherNativePanel .pm-mh-weather-summary__name {
  overflow: hidden;
  font: 500 13.5px/1.25 Roboto, system-ui, sans-serif;
  color: #172438;
  white-space: nowrap;
  text-overflow: ellipsis;
}

html.pm-mh-map #pmWeatherNativePanel .pm-mh-weather-summary__value {
  margin-top: 1px;
  font: 600 16px/1.2 Roboto, system-ui, sans-serif;
  color: var(--pm-mh-blue, #2c77c9);
}

html.pm-mh-map #pmWeatherNativePanel .pm-mh-weather-summary:not(.has-value) .pm-mh-weather-summary__value {
  display: none;
}

html.pm-mh-map #pmWeatherNativePanel.is-mh-open > :not(.pm-weather-native-panel-head) {
  flex: none !important;
}

/* Métricas do bairro tocado, em duas colunas. */
html.pm-mh-map #pmWeatherNativePanel .pm-mh-weather-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0 calc(var(--pm-mh-card-close-w) + 10px) 12px 12px;
}

html.pm-mh-map #pmWeatherNativePanel .pm-mh-weather-metrics[hidden] {
  display: none !important;
}

html.pm-mh-map #pmWeatherNativePanel .pm-mh-weather-metrics > div {
  padding: 8px 10px;
  border-radius: 12px;
  background: #f3efe9;
}

html.pm-mh-map #pmWeatherNativePanel .pm-mh-weather-metrics dt {
  font: 400 11.5px/1.3 Roboto, system-ui, sans-serif;
  color: #687586;
}

html.pm-mh-map #pmWeatherNativePanel .pm-mh-weather-metrics dd {
  margin: 1px 0 0;
  font: 600 14px/1.25 Roboto, system-ui, sans-serif;
  color: #172438;
}

/* Camadas: fileira de pílulas que rola de lado. */
html.pm-mh-map #pmWeatherNativePanel:not(#pm-mh-x) .pm-weather-native-layers {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  max-height: none !important;
  margin: 0 var(--pm-mh-card-close-w) 0 0 !important;
  padding: 0 10px 12px 12px !important;
  border: 0 !important;
  background: transparent !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none;
}

html.pm-mh-map #pmWeatherNativePanel:not(#pm-mh-x) .pm-weather-native-layers::-webkit-scrollbar {
  display: none;
}

html.pm-mh-map #pmWeatherNativePanel:not(#pm-mh-x) .pm-weather-native-layer {
  display: flex !important;
  flex: none !important;
  flex-direction: row-reverse !important;
  align-items: center !important;
  gap: 6px !important;
  width: auto !important;
  height: 34px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 12px 0 9px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #fffcf8 !important;
  box-shadow: inset 0 0 0 1px #e8e2d9 !important;
  color: #172438 !important;
  transform: none !important;
  white-space: nowrap !important;
}

html.pm-mh-map #pmWeatherNativePanel:not(#pm-mh-x) .pm-weather-native-layer-label {
  color: inherit !important;
  font: 500 13px/1 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmWeatherNativePanel:not(#pm-mh-x) .pm-weather-native-layer-icon {
  display: grid !important;
  place-items: center !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--pm-mh-blue, #2c77c9) !important;
}

html.pm-mh-map #pmWeatherNativePanel:not(#pm-mh-x) .pm-weather-native-layer-icon svg {
  width: 17px !important;
  height: 17px !important;
}

html.pm-mh-map #pmWeatherNativePanel:not(#pm-mh-x) .pm-weather-native-layer.is-active {
  background: linear-gradient(180deg, #3a86d6 0%, var(--pm-mh-blue, #2c77c9) 100%) !important;
  box-shadow: 0 3px 10px rgba(44, 119, 201, 0.24) !important;
  color: #fff !important;
}

html.pm-mh-map #pmWeatherNativePanel:not(#pm-mh-x) .pm-weather-native-layer.is-active .pm-weather-native-layer-icon {
  color: #fff !important;
}

html.pm-mh-map #pmWeatherNativePanel:not(#pm-mh-x) :is(.pm-weather-native-legend, .pm-weather-native-timeline) {
  margin: 0 !important;
  padding: 0 calc(var(--pm-mh-card-close-w) + 10px) 12px 14px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.pm-mh-map #pmWeatherNativePanel:not(#pm-mh-x) .pm-weather-native-hour-btns {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

html.pm-mh-map #pmWeatherNativePanel:not(#pm-mh-x) .pm-weather-native-hour-btn {
  height: 32px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: #f3efe9 !important;
  box-shadow: none !important;
  color: #172438 !important;
  font: 500 13px/1 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map #pmWeatherNativePanel:not(#pm-mh-x) .pm-weather-native-hour-btn.is-active {
  background: #e6edf7 !important;
  color: var(--pm-mh-blue, #2c77c9) !important;
  box-shadow: inset 0 0 0 1.5px var(--pm-mh-blue, #2c77c9) !important;
}

html.pm-mh-map #pmWeatherNativePanel:not(#pm-mh-x) .pm-weather-native-foot {
  display: none !important;
}

/* ── Raio e análise (ferramenta): cartão da zona marcada ────────────
   É o #pmtab-raio do app movido para o cartão. Fechado: só o tamanho da zona.
   Aberto: Nova zona, Remover e a análise da área. Posição, seta e faixa vêm do cartão do ponto. */

/* O painel inferior segue com as camadas enquanto o raio está no cartão. */
html.pm-mh-map.pm-mh-radius-on #pmMapSidebar #pmtab-categorias.pm-sb-panel {
  display: flex !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
}

html.pm-mh-map #pmMhRadiusCard:not([hidden]) {
  z-index: 55;
  cursor: default;
}

html.pm-mh-map #pmMhRadiusCard.is-mh-open:not([hidden]) {
  max-height: calc(100dvh - var(--pm-mh-dock-h, 72px) - env(safe-area-inset-bottom, 0px) - var(--pm-mh-sheet-peek, 28px) - 120px - var(--pm-mh-point-h, 0px));
}

#pmMhRadiusCard .pm-mh-card-actions {
  pointer-events: none;
}

#pmMhRadiusCard .pm-mh-card-actions button {
  pointer-events: auto;
}

/* Aberto, quem rola é a análise: o tamanho e os botões ficam no topo, junto da seta. */
#pmMhRadiusCard .pm-mh-radius-card__body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-panel {
  flex: none !important;
}

html.pm-mh-map #pmMhRadiusCard.is-mh-open:not(#pm-mh-x) #pmRadiusResults {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) :is(#pmRadiusResults, #pmRadiusMorePanel) > * {
  flex: none !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) #pmtab-raio {
  position: static !important;
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  width: auto !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) :is(.pm-radius-panel, .pm-radius-hero, .pm-radius-hero__body, .pm-radius-hero__size, .pm-radius-results, .pm-radius-layers-card, .pm-layers-card-body, .pm-radius-layers-list, .pm-radius-more-panel) {
  position: static !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  overflow: visible !important;
  color: #172438 !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) :is(.pm-radius-panel, .pm-radius-hero, .pm-radius-hero__body)::before,
html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) :is(.pm-radius-panel, .pm-radius-hero, .pm-radius-hero__body)::after {
  display: none !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) :is(.pm-radius-back-wrap, .pm-radius-status) {
  display: none !important;
}

/* Fechado: só o tamanho da zona. */
html.pm-mh-map #pmMhRadiusCard:not(.is-mh-open):not(#pm-mh-x) :is(.pm-radius-hero__actions, #pmRadiusResults) {
  display: none !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-hero__size {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  padding: 10px calc(var(--pm-mh-card-close-w) + 42px) 10px 14px !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-size-row {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-size-label {
  color: #687586 !important;
  font: 500 11px/1.3 Roboto, system-ui, sans-serif !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-size-value {
  display: flex !important;
  align-items: baseline !important;
  gap: 3px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--pm-mh-blue, #2c77c9) !important;
  font: 600 16px/1.2 Roboto, system-ui, sans-serif !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-size-value input {
  width: 4.6ch !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: inherit !important;
  font: inherit !important;
  text-align: right !important;
  -moz-appearance: textfield;
  appearance: textfield;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-size-value input::-webkit-inner-spin-button,
html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-size-value input::-webkit-outer-spin-button {
  margin: 0;
  -webkit-appearance: none;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-size-value span {
  color: inherit !important;
  font: inherit !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-range {
  display: block !important;
  width: 100% !important;
  height: 28px !important;
  margin: 2px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  accent-color: var(--pm-mh-blue, #2c77c9);
  -webkit-appearance: none !important;
  appearance: none !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-range::-webkit-slider-runnable-track {
  height: 6px;
  border: 0;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--pm-mh-blue, #2c77c9) var(--pm-radius-pct, 0%), #e2ddd5 var(--pm-radius-pct, 0%));
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-range::-moz-range-track {
  height: 6px;
  border: 0;
  border-radius: 999px;
  background: #e2ddd5;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-range::-moz-range-progress {
  height: 6px;
  border-radius: 999px;
  background: var(--pm-mh-blue, #2c77c9);
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-range::-webkit-slider-thumb {
  width: 24px;
  height: 24px;
  margin-top: -9px;
  border: 0;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 4px rgba(23, 36, 56, 0.28);
  -webkit-appearance: none;
  appearance: none;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-range::-moz-range-thumb {
  width: 24px;
  height: 24px;
  border: 0;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 4px rgba(23, 36, 56, 0.28);
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-scale {
  display: flex !important;
  justify-content: space-between !important;
  margin: 0 !important;
  color: #8a94a3 !important;
  font: 400 11px/1.2 Roboto, system-ui, sans-serif !important;
}

/* Aberto: Nova zona e Remover lado a lado. */
html.pm-mh-map #pmMhRadiusCard.is-mh-open:not(#pm-mh-x) .pm-radius-hero__actions {
  display: flex !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 2px calc(var(--pm-mh-card-close-w) + 10px) 12px 12px !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-hero__actions button {
  flex: 1 1 0 !important;
  height: 40px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: #e6edf7 !important;
  box-shadow: none !important;
  color: var(--pm-mh-blue, #2c77c9) !important;
  font: 500 14px/1 Roboto, system-ui, sans-serif !important;
  text-shadow: none !important;
  cursor: pointer;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-hero__actions .pm-radius-remove {
  background: #f3efe9 !important;
  color: #4a5566 !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-hero__actions button[hidden] {
  display: none !important;
}

/* Aberto: camadas da área, no mesmo cartão de linha da lista de camadas. */
html.pm-mh-map #pmMhRadiusCard.is-mh-open:not(#pm-mh-x) #pmRadiusResults {
  padding: 0 calc(var(--pm-mh-card-close-w) + 10px) 12px 12px !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) #pmRadiusResults .pm-cat-section-head {
  margin: 4px 2px 8px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #8a94a3 !important;
  font: 600 11.5px/1.2 Roboto, system-ui, sans-serif !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-layers-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-layer-row {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 56px !important;
  margin: 0 !important;
  padding: 8px 64px 8px 10px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: #fffcf8 !important;
  box-shadow: inset 0 0 0 1px #ece6dd !important;
  transform: none !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-layer-row.on {
  box-shadow: inset 0 0 0 1.5px var(--pm-mh-blue, #2c77c9) !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-layer-row::before,
html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-layer-row::after {
  display: none !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-layer-count {
  display: grid !important;
  place-items: center !important;
  flex: none !important;
  width: 34px !important;
  height: 34px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: #e6edf7 !important;
  box-shadow: none !important;
  color: var(--pm-mh-blue, #2c77c9) !important;
  font: 600 14px/1 Roboto, system-ui, sans-serif !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-layer-row .mlr-text {
  min-width: 0 !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-layer-row .mlr-title {
  color: #172438 !important;
  font: 500 14px/1.25 Roboto, system-ui, sans-serif !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-layer-row .mlr-sub {
  display: none !important;
}

/* A linha inteira liga/desliga; só o trilho aparece, à direita. */
html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-layer-row .mlr-action {
  position: static !important;
  margin: 0 !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-layer-row .map-toggle {
  position: absolute !important;
  inset: 0 !important;
  z-index: 3 !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  cursor: pointer !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-layer-row .map-toggle input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-layer-row .map-toggle-track {
  position: absolute !important;
  top: 50% !important;
  right: 12px !important;
  left: auto !important;
  display: block !important;
  width: 40px !important;
  height: 24px !important;
  min-width: 0 !important;
  margin: -12px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #ddd7cf !important;
  box-shadow: none !important;
  transform: none !important;
  transition: background-color 0.2s ease !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-layer-row .map-toggle-thumb {
  position: absolute !important;
  top: 2px !important;
  left: 2px !important;
  display: block !important;
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: #fff !important;
  box-shadow: 0 1px 3px rgba(23, 36, 56, 0.22) !important;
  transform: none !important;
  transition: transform 0.2s ease !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-layer-row :is(.map-toggle-track, .map-toggle-thumb)::before,
html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-layer-row :is(.map-toggle-track, .map-toggle-thumb)::after {
  display: none !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-layer-row .map-toggle input:checked + .map-toggle-track {
  background: var(--pm-mh-blue, #2c77c9) !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-layer-row .map-toggle input:checked + .map-toggle-track .map-toggle-thumb {
  transform: translateX(16px) !important;
}

/* "Ver mais informações" e os números da área. */
html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-more-toggle {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  width: 100% !important;
  height: 40px !important;
  margin: 10px 0 0 !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: #f3efe9 !important;
  box-shadow: none !important;
  color: var(--pm-mh-blue, #2c77c9) !important;
  font: 500 14px/1 Roboto, system-ui, sans-serif !important;
  cursor: pointer;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-more-toggle__icon {
  display: grid !important;
  color: inherit !important;
  transition: transform 0.2s ease;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-more-toggle.is-open .pm-radius-more-toggle__icon {
  transform: rotate(180deg);
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-more-panel:not([hidden]) {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin-top: 10px !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  margin: 0 !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-metric {
  min-width: 0 !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: #f3efe9 !important;
  box-shadow: none !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-metric-label {
  color: #687586 !important;
  font: 400 12px/1.3 Roboto, system-ui, sans-serif !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-metric-value {
  margin-top: 2px !important;
  color: #172438 !important;
  font: 600 16px/1.2 Roboto, system-ui, sans-serif !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-age-details {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: #f3efe9 !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-age-details summary {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 10px 12px !important;
  list-style: none !important;
  cursor: pointer;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-age-details summary::-webkit-details-marker {
  display: none;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-age-summary-copy strong {
  display: block !important;
  color: #172438 !important;
  font: 500 14px/1.3 Roboto, system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-age-summary-copy small {
  display: none !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-age-summary-icon {
  display: grid !important;
  place-items: center !important;
  width: 24px !important;
  height: 24px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #687586 !important;
  font: 400 20px/1 Roboto, system-ui, sans-serif !important;
  transition: transform 0.2s ease;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-age-details[open] .pm-radius-age-summary-icon {
  transform: rotate(90deg);
}

/* CadÚnico no raio: mesmos blocos bege do cartão. */
html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-socio-slot {
  margin: 0 !important;
  padding: 0 !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-socio-cross {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin: 4px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-socio-cross-head {
  margin: 0 !important;
  padding: 0 2px !important;
  border: 0 !important;
  background: transparent !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-socio-cross-eyebrow {
  display: block !important;
  margin: 6px 0 4px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #8a94a3 !important;
  font: 600 11.5px/1.2 Roboto, system-ui, sans-serif !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-socio-cross-title {
  display: block !important;
  color: #172438 !important;
  font: 500 15px/1.3 Roboto, system-ui, sans-serif !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-socio-cross-sub {
  margin: 2px 0 0 !important;
  color: #687586 !important;
  font: 400 12px/1.35 Roboto, system-ui, sans-serif !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) :is(.pm-socio-cross-kpis, .pm-socio-cross-highlights) {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) :is(.pm-socio-cross-kpi, .pm-socio-cross-highlight) {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: #f3efe9 !important;
  box-shadow: none !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) :is(.pm-socio-cross-kpi, .pm-socio-cross-highlight) span {
  color: #687586 !important;
  font: 400 12px/1.3 Roboto, system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) :is(.pm-socio-cross-kpi, .pm-socio-cross-highlight) strong {
  color: #172438 !important;
  font: 600 15px/1.25 Roboto, system-ui, sans-serif !important;
  overflow-wrap: anywhere;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-socio-cross-highlight em {
  align-self: flex-start !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--pm-mh-blue, #2c77c9) !important;
  font: 500 12px/1.2 Roboto, system-ui, sans-serif !important;
  font-style: normal !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-socio-cross-bairros {
  margin: 0 !important;
  padding: 10px 12px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: #f3efe9 !important;
  box-shadow: none !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-socio-cross-bairros-head {
  display: flex !important;
  flex-direction: column !important;
  gap: 1px !important;
  margin: 0 0 6px !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-socio-cross-bairros-head strong {
  color: #172438 !important;
  font: 500 14px/1.3 Roboto, system-ui, sans-serif !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-socio-cross-bairros-head span {
  color: #687586 !important;
  font: 400 12px/1.3 Roboto, system-ui, sans-serif !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-socio-cross-bairro-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-socio-cross-bairro-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 7px 0 !important;
  border: 0 !important;
  border-top: 1px solid #e4ded5 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-socio-cross-bairro-item strong {
  display: block !important;
  color: #172438 !important;
  font: 500 13px/1.3 Roboto, system-ui, sans-serif !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-socio-cross-bairro-item span {
  color: #687586 !important;
  font: 400 11.5px/1.3 Roboto, system-ui, sans-serif !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-socio-cross-bairro-item em {
  flex: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--pm-mh-blue, #2c77c9) !important;
  font: 500 12px/1.2 Roboto, system-ui, sans-serif !important;
  font-style: normal !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-socio-cross-foot {
  margin: 0 !important;
  padding: 0 2px 4px !important;
  border: 0 !important;
  background: transparent !important;
  color: #8a94a3 !important;
  font: 400 11px/1.35 Roboto, system-ui, sans-serif !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-age-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  padding: 0 12px 10px !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-age-item {
  display: flex !important;
  justify-content: space-between !important;
  padding: 4px 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #4a5566 !important;
  font: 400 13px/1.3 Roboto, system-ui, sans-serif !important;
}

html.pm-mh-map #pmMhRadiusCard:not(#pm-mh-x) .pm-radius-age-item strong {
  color: #172438 !important;
  font-weight: 600 !important;
}

/* ── Visões em tela cheia (Street View aberto, Biomas, Meteorologia) ──
   A busca, o painel inferior e os cartões saem; fica só o "Voltar ao mapa". */
html.pm-mh-map.pm-mh-fullview :is(#pmMhMapBar, #pmMhToolsBtnWrap, #pmMhToolHint, #pmMhSheetClose, #pmMhSheetPeek, #pmPeopleNativePanel, #pmSocioNativePanel, #pmWeatherNativePanel, #pmMhPointCard, #pmMhStreetCard, #pmMhRadiusCard),
html.pm-mh-map.pm-mh-fullview .pm-map-corner-right:not(#pm-mh-x) {
  display: none !important;
}

html.pm-mh-map.pm-mh-fullview #pmMapSidebar.pm-mh-sheet {
  visibility: hidden !important;
  pointer-events: none !important;
  translate: 0 100% !important;
}

#pmMhViewExit {
  display: none;
}

html.pm-mh-map.pm-mh-fullview #pmMhViewExit {
  position: fixed;
  top: calc(var(--pm-safe-top, env(safe-area-inset-top, 0px)) + 12px);
  left: 14px;
  z-index: 8450;
  display: flex;
  align-items: center;
  gap: 6px;
  height: 44px;
  margin: 0;
  padding: 0 16px 0 10px;
  border: 0;
  border-radius: 999px;
  background: var(--pm-mh-map-surface);
  box-shadow: 0 4px 14px rgba(23, 46, 77, 0.18);
  color: var(--pm-mh-blue, #2c77c9);
  font: 500 14.5px/1 "Roboto", system-ui, sans-serif;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

/* No Street View o endereço (Google) ocupa o canto esquerdo; o voltar fica no direito, onde era a tela cheia. */
html.pm-mh-map[data-mh-fullview="streetview"] #pmMhViewExit {
  top: calc(var(--pm-safe-top, env(safe-area-inset-top, 0px)) + 8px);
  right: 4px;
  left: auto;
  height: 46px;
}

/* O zoom do Google fica no pé do visor: o visor desce além da tela e ele some atrás da barra de baixo,
   ficando só a bússola. */
html.pm-mh-map[data-mh-fullview="streetview"] #pmStreetViewViewer:not(#pm-mh-x) {
  overflow: hidden !important;
}

html.pm-mh-map[data-mh-fullview="streetview"] #pmStreetViewViewer:not(#pm-mh-x) .pm-streetview-embed {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: calc(100% + 48px) !important;
  max-height: none !important;
}

html.pm-mh-map[data-mh-fullview="streetview"] :is(#pmStreetViewClose, #pmStreetViewExitBtn):not(#pm-mh-x),
html.pm-mh-map.pm-mh-fullview #pmBiomasExitWrap:not(#pm-mh-x) {
  display: none !important;
}

/* Meteorologia: camadas numa fileira de pílulas logo abaixo do "Voltar ao mapa". */
html.pm-mh-map[data-mh-fullview="meteorologia"] #pmMeteorologiaPanel:not(#pm-mh-x) {
  position: fixed !important;
  top: calc(var(--pm-safe-top, env(safe-area-inset-top, 0px)) + 66px) !important;
  left: 0 !important;
  right: 0 !important;
  bottom: auto !important;
  z-index: 8440 !important;
  width: auto !important;
  max-width: none !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  transform: none !important;
}

html.pm-mh-map[data-mh-fullview="meteorologia"] #pmMeteorologiaPanel :is(.pm-meteorologia-panel-head, .pm-meteorologia-panel-note) {
  display: none !important;
}

html.pm-mh-map[data-mh-fullview="meteorologia"] #pmMeteorologiaPanel .pm-meteorologia-layers {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 14px 6px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none;
}

html.pm-mh-map[data-mh-fullview="meteorologia"] #pmMeteorologiaPanel .pm-meteorologia-layers::-webkit-scrollbar {
  display: none;
}

html.pm-mh-map[data-mh-fullview="meteorologia"] #pmMeteorologiaPanel .pm-meteorologia-layer {
  display: flex !important;
  flex: none !important;
  flex-direction: row-reverse !important;
  align-items: center !important;
  gap: 6px !important;
  width: auto !important;
  height: 36px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 13px 0 10px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--pm-mh-map-surface) !important;
  box-shadow: 0 3px 10px rgba(23, 46, 77, 0.16) !important;
  color: #172438 !important;
  transform: none !important;
  white-space: nowrap !important;
}

html.pm-mh-map[data-mh-fullview="meteorologia"] #pmMeteorologiaPanel .pm-meteorologia-layer-label {
  color: inherit !important;
  font: 500 13.5px/1 "Roboto", system-ui, sans-serif !important;
}

html.pm-mh-map[data-mh-fullview="meteorologia"] #pmMeteorologiaPanel .pm-meteorologia-layer-icon {
  display: grid !important;
  place-items: center !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--pm-mh-blue, #2c77c9) !important;
}

html.pm-mh-map[data-mh-fullview="meteorologia"] #pmMeteorologiaPanel .pm-meteorologia-layer.is-active {
  background: linear-gradient(180deg, #3a86d6 0%, var(--pm-mh-blue, #2c77c9) 100%) !important;
  color: #fff !important;
}

html.pm-mh-map[data-mh-fullview="meteorologia"] #pmMeteorologiaPanel .pm-meteorologia-layer.is-active .pm-meteorologia-layer-icon {
  color: #fff !important;
}

/* ── Menu do perfil no celular: folha inferior (mesmo modelo dos Dashboards) ──
   #userMenu#userMenu vence os vidros com !important do tema desktop (pm-map-light-ui.css). */
html body #userMenu#userMenu.user-menu {
  inset: auto 0 0 0 !important;
  width: auto !important;
  max-width: none !important;
  max-height: calc(100dvh - var(--pm-safe-top, env(safe-area-inset-top, 0px)) - 24px) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  box-sizing: border-box;
  padding: 10px 16px calc(18px + env(safe-area-inset-bottom, 0px)) !important;
  border: 0 !important;
  border-radius: 28px 28px 0 0 !important;
  background: #f5f6f8 !important;
  background-color: #f5f6f8 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: 0 -8px 32px rgba(23, 46, 77, 0.18) !important;
  color: #172438;
  font-family: "Roboto", system-ui, -apple-system, sans-serif !important;
  opacity: 1 !important;
  transition: none !important;
}

html body #userMenu#userMenu.user-menu.open {
  animation: pmUmSheetUp 0.34s cubic-bezier(0.32, 0.72, 0, 1) both;
}

@keyframes pmUmSheetUp {
  from { transform: translate3d(0, 100%, 0); }
  to { transform: none; }
}

html body #userMenu#userMenu.user-menu::before {
  content: "";
  display: block;
  width: 40px;
  height: 5px;
  margin: 0 auto 14px;
  border-radius: 3px;
  background: #d3dae3;
}

html body #userMenu#userMenu :is(.user-menu-header, .user-menu-body, .user-menu-footer) {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body #userMenu#userMenu .user-menu-header {
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 14px;
  padding: 2px 4px 16px !important;
}

html body #userMenu#userMenu .user-menu-avatar-lg {
  width: 56px;
  height: 56px;
  background: #eaf3ff !important;
  color: #2476ce !important;
  font: 600 22px/1 "Roboto", sans-serif;
}

html body #userMenu#userMenu .user-menu-name {
  font: 600 19px/1.25 "Roboto", sans-serif !important;
  color: #172438 !important;
}

html body #userMenu#userMenu .user-menu-role {
  margin-top: 2px;
  font: 400 14px/1.3 "Roboto", sans-serif !important;
  color: #65798f !important;
}

html body #userMenu#userMenu .user-menu-access-badge {
  margin-top: 7px;
  padding: 4px 10px;
  font: 500 12px/1 "Roboto", sans-serif !important;
  background: #eaf3ff !important;
  color: #2476ce !important;
}

html body #userMenu#userMenu > .user-menu-separator {
  display: none;
}

html body #userMenu#userMenu .user-menu-body {
  padding: 4px 0 !important;
  border-radius: 20px !important;
  background: #fff !important;
  box-shadow: 0 1px 2px rgba(23, 46, 77, 0.06) !important;
}

html body #userMenu#userMenu .user-menu-body .user-menu-separator {
  margin: 0 16px 0 64px;
  background: #eef1f5 !important;
}

html body #userMenu#userMenu .user-menu-item {
  grid-template-columns: 36px 1fr 16px;
  gap: 14px;
  min-height: 56px;
  padding: 8px 16px !important;
  border-radius: 0 !important;
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  -webkit-tap-highlight-color: transparent;
}

html body #userMenu#userMenu .user-menu-item:active {
  background: #f3f6fa !important;
}

html body #userMenu#userMenu .user-menu-item-icon {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #eaf3ff;
  color: #2476ce !important;
}

html body #userMenu#userMenu .user-menu-item-icon svg {
  width: 19px;
  height: 19px;
  stroke-width: 1.8;
}

html body #userMenu#userMenu .user-menu-item-label {
  font: 500 16px/1.3 "Roboto", sans-serif !important;
  color: #172438 !important;
}

html body #userMenu#userMenu .user-menu-chevron {
  color: #a9b6c4 !important;
}

html body #userMenu#userMenu .user-menu-chevron svg {
  width: 16px;
  height: 16px;
}

/* As preferências da gaveta Configurações (modo compacto, animações, item Mapa) só valem no computador. */
html body #userMenu#userMenu :is(#umSettings, #umSepAfterSettings) {
  display: none !important;
}

html body #userMenu#userMenu .user-menu-footer {
  padding: 14px 0 0 !important;
}

html body #userMenu#userMenu .user-menu-logout {
  justify-content: center;
  gap: 10px;
  min-height: 52px;
  padding: 0 20px !important;
  border: 1px solid #f1d5d5 !important;
  border-radius: 26px !important;
  background: #fff !important;
  font: 500 16px/1 "Roboto", sans-serif !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  -webkit-tap-highlight-color: transparent;
}

html body #userMenu#userMenu .user-menu-logout :is(.user-menu-item-icon, .user-menu-item-label) {
  width: auto;
  height: auto;
  background: transparent;
  color: #c2412d !important;
  font: inherit !important;
}

html body #userMenu#userMenu #umLogin.user-menu-logout {
  border-color: transparent !important;
  background: #2476ce !important;
}

html body #userMenu#userMenu #umLogin.user-menu-logout :is(.user-menu-item-icon, .user-menu-item-label) {
  color: #fff !important;
}

html body #userMenuBackdrop#userMenuBackdrop.user-menu-backdrop.open {
  opacity: 1 !important;
  background: rgba(15, 23, 42, 0.32) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  animation: pmUmFade 0.25s ease both;
}

@keyframes pmUmFade {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* ── Janelas abertas pelo menu do perfil: também como folha inferior no celular ── */
html body .pm-modal-backdrop:is(#modalProfile, #modalChangePass, #modalPhoto).open {
  align-items: flex-end !important;
  justify-content: stretch !important;
  padding: 0 !important;
  background: rgba(15, 23, 42, 0.32) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  z-index: 2147483200;
}

html body .pm-modal-backdrop:is(#modalProfile, #modalChangePass, #modalPhoto) .pm-modal {
  position: relative;
  width: 100% !important;
  max-width: none !important;
  max-height: calc(100dvh - var(--pm-safe-top, env(safe-area-inset-top, 0px)) - 24px) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  box-sizing: border-box;
  padding: 10px 0 env(safe-area-inset-bottom, 0px) !important;
  border: 0 !important;
  border-radius: 28px 28px 0 0 !important;
  background: #f5f6f8 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: 0 -8px 32px rgba(23, 46, 77, 0.18) !important;
  font-family: "Roboto", system-ui, -apple-system, sans-serif !important;
  transition: none !important;
}

html body .pm-modal-backdrop:is(#modalProfile, #modalChangePass, #modalPhoto).open .pm-modal {
  animation: pmUmSheetUp 0.34s cubic-bezier(0.32, 0.72, 0, 1) both;
}

html body .pm-modal-backdrop:is(#modalProfile, #modalChangePass, #modalPhoto) .pm-modal::before {
  content: "";
  display: block;
  width: 40px;
  height: 5px;
  margin: 0 auto 6px;
  border-radius: 3px;
  background: #d3dae3;
}

html body .pm-modal-backdrop:is(#modalProfile, #modalChangePass, #modalPhoto) .pm-modal-head {
  padding: 6px 16px 10px 20px !important;
  border: 0 !important;
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html body .pm-modal-backdrop:is(#modalProfile, #modalChangePass, #modalPhoto) .pm-modal-title {
  font: 600 19px/1.25 "Roboto", sans-serif !important;
  color: #172438 !important;
}

html body .pm-modal-backdrop:is(#modalProfile, #modalChangePass, #modalPhoto) .pm-modal-close {
  width: 36px;
  height: 36px;
  align-items: center;
  justify-content: center;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: #eaf3ff !important;
  color: #2476ce !important;
  transform: none !important;
}

html body .pm-modal-backdrop:is(#modalProfile, #modalChangePass, #modalPhoto) .pm-modal-body {
  margin: 0 16px 18px;
  padding: 20px 18px !important;
  border-radius: 20px;
  background: #fff !important;
}

html body .pm-modal-backdrop:is(#modalProfile, #modalChangePass, #modalPhoto) .pm-modal-body :is(input, select, textarea, button) {
  font-family: inherit !important;
}
