/*
 * consell-map.css
 *
 * Ajuste del ancho del popup de Esri (ArcGIS Maps SDK 5.x) para mapas pequeños.
 *
 * El tema de Esri (esri/themes/light/main.css) fija anchos rígidos para el popup
 * según el breakpoint de la vista:
 *   .esri-popup__main-container                                   { width: 340px }
 *   .esri-view-width-less-than-medium .esri-popup__main-container { width: 280px }  <- mínimo
 *   ...medium 340px, large 400px, xlarge 460px
 * En un mapa de ~255px el popup de 280px se sale por los lados.
 *
 * Solución: NO se toca ninguna regla de Esri (width, max-height, posicionamiento,
 * docking, animaciones). Solo se añade un max-width que limita el popup al ancho
 * real del mapa (menos un margen). Mientras el mapa sea más ancho que el popup,
 * esta regla no tiene ningún efecto.
 *
 * --consell-map-w lo actualiza consell-map.js con el ancho real del contenedor.
 * Esri mide el popup al abrirlo, así que el centrado y la flecha siguen siendo
 * correctos.
 */
.consell-map {
  /* Margen total horizontal (8px a cada lado) entre el popup y el borde del mapa */
  --consell-map-popup-gap: 16px;
}

.consell-map .esri-popup:not(.esri-popup--is-docked) .esri-popup__main-container {
  max-width: calc(var(--consell-map-w, 100vw) - var(--consell-map-popup-gap));
}

/* Enlace "Ir a Maps" dentro del popup */
.consell-map .consell-map-popup-content {
  overflow-wrap: anywhere;
}