/* mapas/imoveis-mapa.css - busca de imoveis no mapa (estilo DWV). ASCII puro. */

/* Tela do mapa: oculta o titulo (h1) e a secao social do template do tenant (nao cabem aqui) */
.interna__title, .social { display: none !important; }

/* Container do template ocupa 100% (o mapa valoriza a largura toda) */
.interna__content .container, .incontainer { width: 100%; }
.container { width: 100% !important; max-width: 100% !important; }
.incontainer { padding: 10px 0%; }

#imoveis-mapa-wrap { display: flex; flex-direction: column; width: 100%; position: relative; }

/* Isola o mapa da tipografia/box herdada do template do tenant (modelos antigos vazam Tahoma/espacamento) */
#imoveis-mapa-wrap { font-family: -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: 14px; line-height: 1.4; color: #1f2937; letter-spacing: normal;
  text-transform: none; -webkit-text-size-adjust: 100%; }
#imoveis-mapa-wrap *, #imoveis-mapa-wrap *::before, #imoveis-mapa-wrap *::after { box-sizing: border-box; }
/* forca heranca da fonte do mapa nos elementos que templates legados estilizam por tag */
#imoveis-mapa-wrap p, #imoveis-mapa-wrap span, #imoveis-mapa-wrap a,
#imoveis-mapa-wrap h1, #imoveis-mapa-wrap h2, #imoveis-mapa-wrap h3,
#imoveis-mapa-wrap h4, #imoveis-mapa-wrap h5, #imoveis-mapa-wrap h6,
#imoveis-mapa-wrap ul, #imoveis-mapa-wrap ol, #imoveis-mapa-wrap li,
#imoveis-mapa-wrap label, #imoveis-mapa-wrap input, #imoveis-mapa-wrap select,
#imoveis-mapa-wrap button, #imoveis-mapa-wrap textarea { font-family: inherit; }
#imoveis-mapa-wrap input, #imoveis-mapa-wrap select,
#imoveis-mapa-wrap button, #imoveis-mapa-wrap textarea { font-size: inherit; line-height: normal; }

/* ---- Barra compacta de filtros ---- */
#im-flt-bar { display: flex; align-items: center; gap: 10px; padding: 12px 16px; background: #fff; border-bottom: 1px solid #e5e7eb; }
/* pill (resumo+botao) so no mobile; no desktop os controles fluem direto na barra */
#im-flt-pill { display: none; }
#im-flt-controls { display: contents; }
/* "Ver no mapa": botao so aparece no mobile (fecha o painel de filtros) */
#flt-ver-mapa { display: none; }
/* rotulo alternativo do toggle avancado (desktop: "Busca avancada"; mobile: "Mais filtros") */
.im-lbl-mob { display: none; }
/* Input de busca em pilula com pin (estilo QuintoAndar). !important vence CSS global do tema. */
#im-flt-bar input#flt-busca { flex: 0 1 320px; min-width: 200px; height: 46px; padding: 0 14px 0 40px; border: 0 !important; border-radius: 9999px; font-size: 15px; color: #1f2937;
  background: #f0f1f3 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E") no-repeat 14px center; }
#im-flt-bar input#flt-busca::placeholder { color: #6b7280; }

/* Grupo de chips em linha unica com scroll horizontal + seta de continuacao */
#im-flt-scrollwrap { position: relative; flex: 1 1 auto; min-width: 0; }
#im-flt-scroll { display: flex; align-items: center; gap: 8px; overflow-x: auto; flex-wrap: nowrap; scroll-behavior: smooth; scrollbar-width: none; -ms-overflow-style: none; padding: 1px 0; }
#im-flt-scroll::-webkit-scrollbar { display: none; }

/* Selects como chips neutros (cinza-claro, sem borda, chevron proprio). border transparente
   evita deslocamento quando o estado ativo adiciona a borda azul. */
#im-flt-bar select { flex: 0 0 auto; height: 40px; padding: 0 30px 0 14px; border: 1px solid transparent !important; border-radius: 9999px; font-size: 14px; font-weight: 500; color: #1f2937; max-width: 180px;
  -webkit-appearance: none; -moz-appearance: none; appearance: none; cursor: pointer;
  background: #f0f1f3 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23374151' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center; }
#im-flt-bar select:hover { background-color: #e6e8eb; }
#im-flt-bar select.im-chip-ativo { color: #2f6fed; border-color: #2f6fed !important;
  background: #eef4ff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%232f6fed' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center; }

/* Setas circulares "role para ver mais" (esq/dir). Visibilidade via .tem-prev/.tem-next (JS). */
#im-flt-scroll-prev, #im-flt-scroll-next { display: none; position: absolute; top: 50%; transform: translateY(-50%); width: 30px; height: 30px; border-radius: 50%; border: 1px solid #e5e7eb; background: #fff no-repeat center; box-shadow: 0 1px 6px rgba(0,0,0,.18); cursor: pointer; padding: 0; z-index: 3; }
#im-flt-scroll-prev { left: -2px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23374151' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 6l-6 6 6 6'/%3E%3C/svg%3E"); }
#im-flt-scroll-next { right: -2px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23374151' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E"); }
#im-flt-scrollwrap.tem-prev #im-flt-scroll-prev { display: block; }
#im-flt-scrollwrap.tem-next #im-flt-scroll-next { display: block; }
/* Esmaecimento (fade) nas bordas, sob as setas, indicando continuacao do scroll */
#im-flt-scrollwrap::before, #im-flt-scrollwrap::after { content: ''; position: absolute; top: 0; bottom: 0; width: 48px; pointer-events: none; opacity: 0; transition: opacity .15s; z-index: 1; }
#im-flt-scrollwrap::before { left: 0; background: linear-gradient(90deg, rgb(255,255,255) 30%, rgba(255,255,255,0)); }
#im-flt-scrollwrap::after { right: 0; background: linear-gradient(90deg, rgba(255,255,255,0), rgb(255,255,255) 70%); }
#im-flt-scrollwrap.tem-prev::before { opacity: 1; }
#im-flt-scrollwrap.tem-next::after { opacity: 1; }

#imoveis-contador { font-weight: 700; color: #374151; white-space: nowrap; margin-left: 4px; }

.im-btn { height: 38px; padding: 0 16px; border-radius: 20px; font-size: 13px; font-weight: 600; cursor: pointer; border: 1px solid transparent; white-space: nowrap; }
.im-btn-pri { background: #2f6fed; color: #fff; }
.im-btn-pri:hover { background: #2559c4; }
.im-btn-sec { background: #fff; color: #2f6fed; border-color: #2f6fed; }
.im-btn-sec:hover { background: #eef4ff; }
.im-btn-ghost { background: #fff; color: #6b7280; border-color: #cbd5e1; }
.im-btn-ghost:hover { background: #f3f4f6; }

/* Chips/CTA da barra (adaptacao QuintoAndar) - altura de chip 40px + pilula */
#im-flt-bar .im-btn { flex: 0 0 auto; height: 40px; border-radius: 9999px; }
/* "Mais filtros": chip neutro com icone de sliders (vence .im-btn-sec) */
#flt-toggle-adv { display: inline-flex; align-items: center; gap: 6px; background: #f0f1f3 !important; color: #1f2937 !important; border-color: transparent !important; padding: 0 16px; }
#flt-toggle-adv:hover { background: #e6e8eb !important; }
#flt-toggle-adv::before { content: ''; width: 16px; height: 16px; flex: 0 0 auto;
  background: no-repeat center / 16px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%231f2937' stroke-width='2' stroke-linecap='round'%3E%3Cline x1='4' y1='8' x2='20' y2='8'/%3E%3Cline x1='4' y1='16' x2='20' y2='16'/%3E%3Ccircle cx='9' cy='8' r='2.2' fill='%23f0f1f3'/%3E%3Ccircle cx='15' cy='16' r='2.2' fill='%23f0f1f3'/%3E%3C/svg%3E"); }
/* "Limpar": baixo relevo (link neutro) */
#flt-limpar { background: transparent !important; color: #6b7280 !important; border-color: transparent !important; }
#flt-limpar:hover { background: #f0f1f3 !important; }
/* "Ver em lista": CTA principal com icone de lista, a direita */
#flt-verlista { display: inline-flex; align-items: center; gap: 6px; padding: 0 18px; }
#flt-verlista::before { content: ''; width: 16px; height: 16px; flex: 0 0 auto;
  background: no-repeat center / 16px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round'%3E%3Cline x1='8' y1='6' x2='20' y2='6'/%3E%3Cline x1='8' y1='12' x2='20' y2='12'/%3E%3Cline x1='8' y1='18' x2='20' y2='18'/%3E%3Ccircle cx='4' cy='6' r='1'/%3E%3Ccircle cx='4' cy='12' r='1'/%3E%3Ccircle cx='4' cy='18' r='1'/%3E%3C/svg%3E"); }

/* ---- Corpo: lista + mapa (mapa valorizado) ---- */
#imoveis-mapa-corpo { display: flex; width: 100%; height: calc(100vh - 150px); min-height: 520px; position: relative; }
#imoveis-lista-col { width: 400px; min-width: 320px; max-width: 42%; overflow-y: auto; border-right: 1px solid #e5e7eb; }
#imoveis-lista { display: flex; flex-direction: column; gap: 12px; padding: 12px; }
#imoveis-map { flex: 1; min-height: 100%; }

/* ---- Card rico (horizontal) ---- */
.im-card { display: flex; background: #fff; border: 1px solid #e5e7eb; border-radius: 10px; overflow: hidden; text-decoration: none; color: inherit; transition: box-shadow .15s, transform .15s; min-height: 120px; }
.im-card:hover { box-shadow: 0 6px 18px rgba(0,0,0,.12); transform: translateY(-2px); }
.im-card-ativo { box-shadow: 0 0 0 2px #2f6fed, 0 6px 18px rgba(0,0,0,.12); border-color: #2f6fed; }
.im-card-foto { position: relative; flex: 0 0 140px; background: #e5e7eb center/cover no-repeat; }
.im-badge-destaque { position: absolute; top: 8px; left: 8px; background: #2f6fed; color: #fff; font-size: 10px; font-weight: 700; letter-spacing: .04em; padding: 3px 8px; border-radius: 10px; }
.im-card-info { flex: 1; padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.im-card-head { font-size: 14px; font-weight: 700; color: #111827; line-height: 1.25; }
.im-card-local { font-size: 12px; color: #6b7280; line-height: 1.2; }
.im-card-specs { display: flex; flex-wrap: wrap; gap: 8px 12px; font-size: 12px; color: #374151; margin: 4px 0; }
.im-card-specs b { color: #111827; }
.im-card-preco { font-size: 16px; font-weight: 800; color: #111827; margin-top: auto; display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.im-card-ref { font-size: 11px; font-weight: 600; color: #9ca3af; white-space: nowrap; }
.im-card-pm2 { font-size: 11px; color: #6b7280; }
.im-card-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.im-badge-estagio { background: #f59e0b; color: #fff; font-size: 10px; font-weight: 700; padding: 3px 8px; border-radius: 4px; }
.im-card-entrega { font-size: 11px; color: #6b7280; }

.im-vazio { padding: 28px 16px; text-align: center; color: #6b7280; }

/* ---- Popup ---- */
.maplibregl-popup-content { padding: 0; border-radius: 10px; overflow: hidden; }
.maplibregl-popup-close-button { position: absolute; top: 8px; right: 8px; width: 26px; height: 26px; padding: 0; border-radius: 50%; background: #fff; color: #374151; border: 1px solid #e5e7eb; box-shadow: 0 1px 3px rgba(0,0,0,.25); font-size: 17px; line-height: 1; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background .1s, color .1s; }
.maplibregl-popup-close-button:hover { background: #f3f4f6; color: #111827; }
.im-pop { display: block; width: 230px; text-decoration: none; color: inherit; }
.im-pop-foto { width: 100%; height: 130px; background: #e5e7eb center/cover no-repeat; }
.im-pop-preco { font-size: 17px; font-weight: 800; padding: 8px 10px 0; color: #111827; }
.im-pop-titulo { font-size: 13px; font-weight: 600; padding: 2px 10px 0; color: #111827; }
.im-pop-local { font-size: 12px; color: #6b7280; padding: 0 10px 6px; }
.im-pop-ref { font-size: 11px; font-weight: 600; color: #9ca3af; padding: 0 10px 10px; }

/* ---- Pino de preco no mapa (estilo Airbnb) ---- */
/* O wrapper carrega o transform de posicao do MapLibre (sem transition, senao os pinos
   "arrastam" atras do mapa ao mover); todo o visual/hover fica no filho .im-price-pin. */
.im-pin-wrap { cursor: pointer; }
.im-price-pin { background: #fff; color: #111827; font: 700 12px/1 -apple-system, "Segoe UI", Roboto, Arial, sans-serif; padding: 6px 10px; border-radius: 16px; border: 1px solid rgba(0,0,0,.08); box-shadow: 0 1px 4px rgba(0,0,0,.28); white-space: nowrap; user-select: none; transition: transform .1s, box-shadow .1s, background .1s, color .1s; }
.im-price-pin.venda { color: #1d4ed8; }
.im-price-pin.locacao { color: #b45309; }
.im-price-pin.temporada { color: #6d28d9; }
.im-pin-wrap:hover .im-price-pin { transform: scale(1.06); box-shadow: 0 3px 10px rgba(0,0,0,.32); }
.im-pin-wrap.ativo .im-price-pin, .im-pin-wrap:active .im-price-pin { background: var(--fin-cor); color: #fff; border-color: var(--fin-cor); }

/* Esconde a busca por codigo (topsearch) herdada do template nesta pagina de mapa. */
.topsearch__buscar { display: none !important; }

/* ---- Drawer "Busca avancada" (sobre o mapa) ---- */
/* Oculto por padrao; so aparece com a classe .aberto (botao "Busca avancada"). */
#im-flt-drawer { position: absolute; top: 0; right: 0; height: 100%; width: 360px; max-width: 90%; background: #fff; box-shadow: -6px 0 24px rgba(0,0,0,.15); transform: translateX(100%); visibility: hidden; transition: transform .2s ease, visibility .2s ease; display: flex; flex-direction: column; z-index: 20; }
#im-flt-drawer.aberto { transform: translateX(0); visibility: visible; }
.im-drawer-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid #e5e7eb; font-size: 16px; }
.im-drawer-head button { background: none; border: 0; font-size: 26px; line-height: 1; color: #6b7280; cursor: pointer; }
.im-drawer-body { flex: 1; overflow-y: auto; padding: 14px 16px; }
.im-flt-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.im-flt { display: flex; flex-direction: column; font-size: 12px; color: #6b7280; }
.im-flt > span { margin-bottom: 3px; font-weight: 600; }
.im-flt select, .im-flt input { height: 36px; padding: 0 8px; border: 1px solid #cbd5e1 !important; border-radius: 6px; font-size: 14px; color: #111827; background: #fff; width: 100%; }
.im-drawer-foot { display: flex; gap: 10px; padding: 12px 16px; border-top: 1px solid #e5e7eb; }
.im-drawer-foot .im-btn { flex: 1; }

/* ---- Secoes do drawer estilo QuintoAndar (titulo + pills) ---- */
.im-sec { padding: 14px 0; border-bottom: 1px solid #f0f2f5; }
.im-sec:first-child { padding-top: 2px; }
.im-sec:last-child { border-bottom: 0; }
.im-sec h4 { margin: 0 0 10px; font-size: 14px; font-weight: 700; color: #111827; }
.im-sec-row { display: flex; gap: 12px; }
.im-sub { flex: 1; display: flex; flex-direction: column; font-size: 12px; color: #6b7280; min-width: 0; }
.im-sub > span { margin-bottom: 4px; font-weight: 600; }
.im-sub select, .im-sub input, select.im-sel { height: 40px; padding: 0 10px; border: 1px solid #cbd5e1 !important; border-radius: 8px; font-size: 14px; color: #111827; background: #fff; width: 100%; }
.im-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.im-pill { height: 36px; min-width: 44px; padding: 0 16px; border-radius: 18px; border: 1px solid #cbd5e1; background: #fff; color: #374151; font-size: 13px; font-weight: 600; cursor: pointer; }
.im-pill:hover { border-color: #94a3b8; }
.im-pill.ativo { background: #eef4ff; border-color: #2f6fed; color: #2f6fed; }

/* ---- Abas de finalidade (segmented, na barra) ---- */
.im-tabs { display: inline-flex; flex: 0 0 auto; gap: 4px; background: #f1f5f9; border-radius: 9999px; padding: 3px; }
.im-tab { height: 32px; padding: 0 8px; border: 0; background: transparent; border-radius: 16px; font-size: 13px; font-weight: 600; color: #475569; cursor: pointer; white-space: nowrap; }
.im-tab:hover { color: #111827; }
.im-tab.ativo { background: #2f6fed; color: #fff; }

/* ---- Checkboxes de tipo de imovel ---- */
.im-checks { display: flex; flex-direction: column; gap: 2px; max-height: 220px; overflow-y: auto; }
.im-check { display: flex; align-items: center; gap: 10px; padding: 7px 2px; font-size: 14px; color: #111827; cursor: pointer; }
.im-check input { width: 18px; height: 18px; accent-color: #2f6fed; margin: 0; }

/* ---- Slider duplo (min/max) ---- */
.im-range { padding: 4px 6px 2px; }
.im-range-head { display: flex; justify-content: space-between; font-size: 13px; font-weight: 600; color: #111827; margin-bottom: 14px; }
.im-range-track { position: relative; height: 22px; }
.im-range-track::before { content: ''; position: absolute; left: 0; right: 0; top: 9px; height: 4px; background: #e5e7eb; border-radius: 2px; }
.im-range-fill { position: absolute; top: 9px; height: 4px; background: #2f6fed; border-radius: 2px; }
.im-range-input { position: absolute; left: 0; top: 0; width: 100%; height: 22px; margin: 0; background: transparent; pointer-events: none; -webkit-appearance: none; appearance: none; }
.im-range-input::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 20px; height: 20px; border-radius: 50%; background: #fff; border: 2px solid #2f6fed; box-shadow: 0 1px 4px rgba(0,0,0,.25); cursor: pointer; pointer-events: auto; }
.im-range-input::-moz-range-thumb { width: 20px; height: 20px; border-radius: 50%; background: #fff; border: 2px solid #2f6fed; box-shadow: 0 1px 4px rgba(0,0,0,.25); cursor: pointer; pointer-events: auto; }
.im-range-input::-webkit-slider-runnable-track { background: transparent; border: 0; }
.im-range-input::-moz-range-track { background: transparent; border: 0; }

/* ---- Atribuicao compacta ---- */
.maplibregl-ctrl-attrib.maplibregl-compact { margin: 0 8px 8px 0; }

/* ---- Botao flutuante mostrar lista/mapa (so mobile) ---- */
.im-toggle-view { display: none; position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%); z-index: 9;
  background: #111827; color: #fff; border: 0; border-radius: 24px; height: 44px; padding: 0 22px; font-size: 14px; font-weight: 700;
  box-shadow: 0 4px 14px rgba(0,0,0,.3); cursor: pointer; }

/* ---- Gate de interacao (mobile): toque e segure 3s p/ liberar o arrasto do mapa ---- */
#im-map-gate { position: absolute; inset: 0; z-index: 11; display: none; align-items: center; justify-content: center; background: rgba(17,24,39,.32); pointer-events: none; }
#im-map-gate.ativo { display: flex; }
#im-map-gate .im-gate-box { background: rgba(17,24,39,.92); color: #fff; border-radius: 14px; padding: 16px 20px; max-width: 78%; text-align: center; box-shadow: 0 6px 24px rgba(0,0,0,.35); }
#im-map-gate .im-gate-txt { font-size: 14px; font-weight: 600; line-height: 1.3; margin-bottom: 12px; }
#im-map-gate .im-gate-track { height: 6px; background: rgba(255,255,255,.25); border-radius: 3px; overflow: hidden; }
#im-map-gate .im-gate-bar { height: 100%; width: 0; background: #2f6fed; border-radius: 3px; }
/* Dica ao rolar a roda do mouse sobre o mapa travado: so a mensagem, sem a barra de progresso */
#im-map-gate.im-gate-hint .im-gate-track { display: none; }
#im-map-gate.im-gate-hint .im-gate-txt { margin-bottom: 0; }
#im-legenda { position: absolute; left: 10px; bottom: 26px; z-index: 6; background: rgba(255,255,255,.94); border: 1px solid #e3e8ee; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,.14); padding: 7px 10px; display: flex; flex-direction: column; gap: 5px; font-size: 12px; color: #33506b; pointer-events: none; }
#im-legenda .im-leg-item { display: flex; align-items: center; gap: 7px; white-space: nowrap; }
#im-legenda .im-leg-cor { width: 12px; height: 12px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px rgba(0,0,0,.15); flex: 0 0 auto; }

/* Botao "Sair do mapa" (so mobile, aparece quando o mapa esta ativo) */
#im-map-sair { display: none; position: absolute; top: 90px; left: 12px; z-index: 10; align-items: center;
  background: #fff; color: #111827; border: 1px solid #cbd5e1; border-radius: 24px; height: 40px; padding: 0 16px;
  font-size: 13px; font-weight: 700; box-shadow: 0 4px 14px rgba(0,0,0,.2); cursor: pointer; }

@media (max-width: 768px) {
  /* Barra flutuante sobre o mapa: pill (resumo + botao) que abre o painel de filtros */
  /* full-bleed: ignora o padding do container do template p/ o mapa ocupar 100% da largura */
  #imoveis-mapa-wrap { position: relative; width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }
  #im-flt-bar { position: absolute; top: 10px; left: 10px; right: 10px; z-index: 12;
    flex-direction: column; align-items: stretch; gap: 0; padding: 0; background: #fff;
    border: 0; border-radius: 16px; box-shadow: 0 4px 16px rgba(0,0,0,.2);
    max-height: calc(100% - 20px); overflow: hidden; }
  #im-flt-pill { display: flex; align-items: center; gap: 10px; padding: 12px 12px 12px 16px; }
  #im-flt-resumo { flex: 1; font-size: 14px; font-weight: 600; color: #111827; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  #im-flt-abrir { flex: 0 0 auto; width: 42px; height: 42px; border-radius: 50%; border: 1px solid #cbd5e1; background: #fff; color: #111827; display: flex; align-items: center; justify-content: center; cursor: pointer; }
  #im-flt-controls { display: none; }
  #im-flt-bar.aberto { overflow-y: auto; }
  #im-flt-bar.aberto #im-flt-controls { display: flex; flex-direction: column; gap: 8px; padding: 0 12px 12px; }
  #im-flt-bar.aberto #im-flt-controls > * { width: 100%; max-width: none; }
  /* No mobile os wrappers de scroll "somem" (display:contents): os chips voltam a empilhar
     como itens de coluna, igual ao comportamento anterior. */
  #im-flt-scrollwrap, #im-flt-scroll { display: contents; }
  #im-flt-bar.aberto #im-flt-scroll > * { width: 100%; max-width: none; }
  #im-flt-scroll-prev, #im-flt-scroll-next { display: none !important; }
  #im-flt-bar select, #im-flt-bar input#flt-busca { max-width: none; }
  /* no eixo coluna do mobile o flex-basis (320px) viraria altura -> deforma o input; reseta */
  #im-flt-bar input#flt-busca { flex: 0 0 auto; }
  .im-tab { padding: 0 13px; }
  .im-flt-grid { grid-template-columns: 1fr; }

  /* "Ver em lista" ja existe como botao flutuante no rodape -> ocultar aqui */
  #im-flt-bar #flt-verlista { display: none; }
  /* toggle avancado vira "Mais filtros" (nao sugere busca imediata) */
  #im-flt-bar .im-lbl-desk { display: none; }
  #im-flt-bar .im-lbl-mob { display: inline; }
  /* "Limpar" compacto: nao ocupa a largura toda */
  #im-flt-bar.aberto #flt-limpar { width: auto; max-width: none; align-self: center; height: 32px; padding: 0 18px; font-size: 12px; }
  /* "Ver no mapa": CTA que fecha o painel e volta ao mapa (por ultimo) */
  #im-flt-bar.aberto #flt-ver-mapa { display: inline-flex; align-items: center; justify-content: center; order: 99; }

  /* empurra os controles do mapa para baixo da barra flutuante */
  .maplibregl-ctrl-top-right { margin-top: 90px; }

  /* Mapa em tela cheia por padrao (prioriza o mapa, estilo QuintoAndar) */
  #imoveis-mapa-corpo { height: 100vh; height: 100dvh; min-height: 480px; }
  #imoveis-lista-col { display: none; width: 100%; min-width: 0; max-width: none; }
  #imoveis-map { display: block; position: absolute; inset: 0; }
  #imoveis-mapa-wrap.ver-lista #imoveis-lista-col { display: block; position: absolute; inset: 0; z-index: 8; }
  #imoveis-mapa-wrap.ver-lista #imoveis-map { display: none; }
  /* no modo lista a barra flutuante some (libera a tela); lista ganha espaco p/ o botao */
  #imoveis-mapa-wrap.ver-lista #im-flt-bar { display: none; }
  #imoveis-mapa-wrap.ver-lista #imoveis-lista { padding-bottom: 80px; }

  .im-toggle-view { display: inline-flex; align-items: center; }
  #im-flt-drawer { width: 100%; }
}