.ipm-map-container { position: relative; width: 100%; min-width: 280px; height: var(--ipm-height, 520px); font-family: var(--ipm-font-family, inherit); /* * Todo o conteúdo do mapa (camada do mapa, painel lateral) usa * position:absolute para o desenho funcionar. Isso significa que este * elemento não tem, por si só, nenhum conteúdo "em fluxo normal" — e em * containers flex do Elementor (Container em modo flex), o browser pode * calcular a largura intrínseca deste elemento como 0px e encolhê-lo * para 0, mesmo com width:100% definido, porque o auto-dimensionamento * do container à volta não tem nada de concreto para medir. O * min-width acima garante que nunca colapsa, e o flex/align-self * abaixo força-o a esticar/preencher o espaço disponível caso ele * próprio seja um item flex (ex: coluna de um Container do Elementor). */ flex: 1 1 auto; align-self: stretch; } /* * Mesma blindagem aplicada ao próprio wrapper que o Elementor gera à volta * do widget — nalguns layouts é este elemento (não o .ipm-map-container * lá dentro) que fica com largura 0 por ser ele o item flex real. */ .elementor-widget-interactive_points_map, .elementor-widget-interactive_points_map > .elementor-widget-container { width: 100%; flex: 1 1 auto; align-self: stretch; } /* * O recorte de cantos arredondados (overflow:hidden) fica só nesta camada * interior, que contém apenas o mapa. Assim, um ponto perto da borda nunca * fica cortado pelo hidden do painel, e o painel lateral (fora desta camada) * pode ter uma altura própria, maior do que a altura do mapa. */ .ipm-map-inner { position: absolute; inset: 0; overflow: hidden; border-radius: var(--ipm-map-radius, 12px); box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08); /* * Fundo cinza claro por defeito: sem isto, se os tiles do Leaflet ainda * não carregaram (ou falharem a carregar), o mapa fica um retângulo * branco sobre fundo branco — parece "não aparecer nada" quando na * verdade o espaço está lá, só que invisível. Com este fundo, o * contentor é sempre visível mesmo antes/sem os tiles. */ background: #e5e3df; } .ipm-map-canvas { position: absolute; inset: 0; width: 100%; height: 100%; } /* * Fundo escurecido por trás do cartão: dá foco ao conteúdo e deixa claro * que é uma camada temporária sobre o mapa, independente do tamanho deste. */ .ipm-map-backdrop { position: absolute; inset: 0; background: var(--ipm-backdrop-bg, rgba(20, 20, 20, 0.5)); border-radius: var(--ipm-map-radius, 12px); opacity: 0; pointer-events: none; transition: opacity 0.3s ease; z-index: 999; } .ipm-map-container.ipm-panel-open .ipm-map-backdrop { opacity: 1; pointer-events: auto; } /* * Cartão de informação: flutua centrado por cima do mapa, com o seu próprio * tamanho consoante o conteúdo (até um limite razoável, com scroll interno * só se for mesmo preciso). Ao não depender da altura/largura do mapa, * fica sempre bem proporcionado, seja o mapa grande ou pequeno. */ .ipm-info-panel { position: absolute; top: 50%; left: 50%; width: var(--ipm-panel-width, min(420px, 92%)); max-height: min(80%, 620px); background: var(--ipm-panel-bg, #ffffff); color: var(--ipm-panel-text, #333333); box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28); border-radius: var(--ipm-map-radius, 12px); z-index: 1000; overflow-y: auto; overflow-x: hidden; /* * Opacidade 0 + pointer-events:none garantem que fica mesmo invisível * (e não bloqueia cliques) enquanto fechado — o transform sozinho só * desloca a caixa, não a esconde de facto, e esta camada está fora do * .ipm-map-inner, que é o único sítio com overflow:hidden a "cortar" * o que sai da área do mapa. */ opacity: 0; pointer-events: none; transform: translate(-50%, -50%) scale(0.94); transition: opacity 0.3s ease, transform 0.3s cubic-bezier(0.22, 1, 0.36, 1); } .ipm-map-container.ipm-panel-open .ipm-info-panel { opacity: 1; pointer-events: auto; transform: translate(-50%, -50%) scale(1); } /* * Botão fechar: por defeito é só o "×", sem fundo — apenas uma sombra subtil * no texto para se manter legível em qualquer foto. Todas as propriedades * levam !important porque temas/Elementor costumam ter uma regra global * para