/* ==========================================================================
 * EcoRadar Urba · La Seu d'Urgell
 * 03-mapa.css — Mapa interactivo: capas SVG, simbolos y leyenda del mapa.
 *
 * Colores y trazos de edificios, verde, agua, viario, capas raster, flujo de
 * rio, lugares, celdas de perill y leyenda de contexto del mapa.
 *
 * Hojas de estilo del visor, en orden de carga: 01-base, 02-paneles, 03-mapa,
 * 04-lecturas, 05-tema-visual, 06-adaptativo, 07-visual-v1.
 * El orden y el prefijo de ambito (#ecoradar-urba-la-seu) forman parte del
 * diseno congelado: no reordenar reglas ni cambiar el prefijo.
 * ========================================================================== */

#ecoradar-urba-la-seu .eu-map-panel svg {
  transform: translateZ(0);
  shape-rendering: auto;
}
#ecoradar-urba-la-seu .eu-scene {
  will-change: transform;
  transform-origin: 0 0;
}
#ecoradar-urba-la-seu .eu-map-panel.is-zooming svg {
  shape-rendering: optimizeSpeed !important;
  text-rendering: optimizeSpeed !important;
}
#ecoradar-urba-la-seu .eu-map-panel.is-zooming .eu-scene * {
  pointer-events: none !important;
}
#ecoradar-urba-la-seu .eu-map-panel.is-zooming .eu-vectors,
#ecoradar-urba-la-seu .eu-map-panel.is-zooming .eu-rasters,
#ecoradar-urba-la-seu .eu-map-panel.is-zooming .eu-road-hit-layer {
  pointer-events: none !important;
}
#ecoradar-urba-la-seu .eu-map-panel.is-zooming .eu-rasters {
  mix-blend-mode: normal !important;
}
#ecoradar-urba-la-seu .eu-map-bg {
  fill: #f4f0e8;
  pointer-events: all;
}
#ecoradar-urba-la-seu .eu-rasters {
  mix-blend-mode: multiply;
  opacity: 0.88;
  pointer-events: none;
}
#ecoradar-urba-la-seu .eu-rasters image {
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
}
#ecoradar-urba-la-seu .eu-boundary {
  pointer-events: none;
}
#ecoradar-urba-la-seu .eu-building {
  fill: #e8e4da;
  stroke: #c8c2b5;
  stroke-width: 0.45;
}
#ecoradar-urba-la-seu .eu-green {
  fill: #a8c88f;
  fill-opacity: 0.85;
  stroke: #5f965a;
  stroke-width: 0.8;
}
#ecoradar-urba-la-seu .eu-water {
  stroke: #3f9ec0;
  stroke-width: 1.2;
}
#ecoradar-urba-la-seu .eu-water.area {
  fill: #96c9db;
  fill-opacity: 0.9;
}
#ecoradar-urba-la-seu .eu-water.line {
  fill: none;
  stroke-width: 1.7;
}
#ecoradar-urba-la-seu .eu-road {
  fill: none;
  stroke: #bab09d;
  stroke-width: 0.85;
  stroke-linecap: round;
  stroke-linejoin: round;
}
#ecoradar-urba-la-seu .eu-road-hit {
  fill: none;
  stroke: transparent;
  stroke-width: 12;
  pointer-events: stroke;
  cursor: help;
}
#ecoradar-urba-la-seu .eu-road.viaria {
  stroke: #bab09d;
  stroke-width: 0.85;
}
#ecoradar-urba-la-seu .eu-road.a_peu {
  stroke: #987cb3;
  stroke-width: 0.75;
  stroke-dasharray: 3 2;
}
#ecoradar-urba-la-seu .eu-road.ciclable {
  stroke: #0e8ea9;
  stroke-width: 1.25;
}

/* Jerarquia arquitectònica CAD lleugera, nítida i equilibrada */
#ecoradar-urba-la-seu .eu-road.hw-motorway,
#ecoradar-urba-la-seu .eu-road.hw-trunk,
#ecoradar-urba-la-seu .eu-road.hw-motorway_link,
#ecoradar-urba-la-seu .eu-road.hw-trunk_link {
  stroke: #6f6553;
  stroke-width: 1.6;
  stroke-opacity: 0.95;
}
#ecoradar-urba-la-seu .eu-road.hw-primary,
#ecoradar-urba-la-seu .eu-road.hw-primary_link {
  stroke: #827764;
  stroke-width: 1.3;
  stroke-opacity: 0.92;
}
#ecoradar-urba-la-seu .eu-road.hw-secondary,
#ecoradar-urba-la-seu .eu-road.hw-secondary_link {
  stroke: #948976;
  stroke-width: 1.1;
  stroke-opacity: 0.9;
}
#ecoradar-urba-la-seu .eu-road.hw-tertiary,
#ecoradar-urba-la-seu .eu-road.hw-tertiary_link {
  stroke: #a79b88;
  stroke-width: 0.95;
}
#ecoradar-urba-la-seu .eu-road.hw-residential,
#ecoradar-urba-la-seu .eu-road.hw-living_street {
  stroke: #bab09d;
  stroke-width: 0.85;
}
#ecoradar-urba-la-seu .eu-road.hw-service,
#ecoradar-urba-la-seu .eu-road.hw-track {
  stroke: #ccc4b3;
  stroke-width: 0.65;
  stroke-dasharray: 2 1;
}
#ecoradar-urba-la-seu .eu-road.hw-pedestrian {
  stroke: #8767a4;
  stroke-width: 1.0;
  stroke-dasharray: none;
}
#ecoradar-urba-la-seu .eu-road.hw-footway,
#ecoradar-urba-la-seu .eu-road.hw-path,
#ecoradar-urba-la-seu .eu-road.hw-steps {
  stroke: #987cb3;
  stroke-width: 0.75;
  stroke-dasharray: 3 2;
}
#ecoradar-urba-la-seu .eu-road.hw-cycleway {
  stroke: #0e8ea9;
  stroke-width: 1.25;
}

/* Línia interactiva d'il·luminació suau al passar el cursor */
#ecoradar-urba-la-seu .eu-road-hover-highlight {
  fill: none;
  stroke: #e76f51;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
  pointer-events: none;
  vector-effect: non-scaling-stroke;
  filter: drop-shadow(0 0 2px rgba(231, 111, 81, 0.45));
}
#ecoradar-urba-la-seu .eu-facility {
  fill: #0b477d;
  stroke: #fff;
  stroke-width: 1.3;
  vector-effect: non-scaling-stroke;
}
#ecoradar-urba-la-seu .eu-flow-halo {
  fill: #fff;
  fill-opacity: 0.92;
  stroke: #0b477d;
  stroke-width: 2.2;
  vector-effect: non-scaling-stroke;
}
#ecoradar-urba-la-seu .eu-flow-station {
  fill: #1688bd;
  stroke: #fff;
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
  cursor: pointer;
}
#ecoradar-urba-la-seu .eu-flow-label {
  fill: #0b3d72;
  stroke: #fff;
  stroke-width: 3px;
  paint-order: stroke;
  font-size: 10px;
  font-weight: 800;
  pointer-events: none;
}
#ecoradar-urba-la-seu .eu-flow-date {
  fill: #4c6883;
  stroke: #fff;
  stroke-width: 2px;
  paint-order: stroke;
  font-size: 8px;
  font-weight: 600;
}
#ecoradar-urba-la-seu .eu-place-halo {
  fill: #164b39;
  stroke: #103b2f;
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
}
#ecoradar-urba-la-seu .eu-place-marker {
  fill: #fff;
  stroke: none;
  vector-effect: non-scaling-stroke;
}
#ecoradar-urba-la-seu .eu-place-label {
  fill: #164b39;
  stroke: #fff;
  stroke-width: 4px;
  paint-order: stroke;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  pointer-events: none;
}
#ecoradar-urba-la-seu .eu-air-quality-cell {
  stroke: rgba(255, 255, 255, 0.7);
  stroke-width: 1.5;
  stroke-dasharray: 4 4;
  fill-opacity: 0.75;
  vector-effect: non-scaling-stroke;
}
#ecoradar-urba-la-seu .eu-map-legend {
  position: absolute;
  right: 20px;
  bottom: 20px;
  width: 250px;
  padding: 16px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
  z-index: 10;
}
#ecoradar-urba-la-seu .eu-cool-street {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.6;
  opacity: 0.88;
  vector-effect: non-scaling-stroke;
  cursor: pointer;
}
#ecoradar-urba-la-seu .eu-cool-street.alt,
#ecoradar-urba-la-seu .eu-cool-street.alta {
  stroke: #20713f;
}
#ecoradar-urba-la-seu .eu-cool-street.mitjà,
#ecoradar-urba-la-seu .eu-cool-street.mitja {
  stroke: #e0a32c;
}
#ecoradar-urba-la-seu .eu-cool-street.baix,
#ecoradar-urba-la-seu .eu-cool-street.baixa {
  stroke: #c74836;
}
#ecoradar-urba-la-seu .eu-route-planner {
  grid-column: 1/-1;
}
#ecoradar-urba-la-seu .eu-route-controls {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin: 10px 0;
}
#ecoradar-urba-la-seu .eu-route-pick,
#ecoradar-urba-la-seu .eu-route-clear {
  border: 1px solid #b9d4c2;
  border-radius: 9px;
  background: #f5faf6;
  color: #174a36;
  padding: 9px 12px;
  font: inherit;
  cursor: pointer;
}
#ecoradar-urba-la-seu .eu-route-status {
  color: #496257;
  font-size: 12px;
  margin: 8px 0;
}
#ecoradar-urba-la-seu .eu-route-results {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
#ecoradar-urba-la-seu .eu-route-result {
  border: 1px solid #d5e4d9;
  border-radius: 10px;
  padding: 10px;
  background: #fbfdfb;
}
#ecoradar-urba-la-seu .eu-route-result.is-comfort {
  border-color: #8ec5a0;
  background: #f2faf3;
}
#ecoradar-urba-la-seu .eu-route-result h4 {
  margin: 0 0 7px;
  color: #174a36;
}
#ecoradar-urba-la-seu .eu-route-result dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin: 0;
}
#ecoradar-urba-la-seu .eu-route-result dt {
  color: #64776c;
  font-size: 10px;
}
#ecoradar-urba-la-seu .eu-route-result dd {
  margin: 2px 0 0;
  font-weight: 700;
  font-size: 13px;
}
#ecoradar-urba-la-seu .eu-route-limit {
  margin-bottom: 0;
  font-size: 11px;
  color: #66766d;
}
@media (max-width: 760px) {
  #ecoradar-urba-la-seu .eu-route-results {
    grid-template-columns: 1fr;
  }
}
#ecoradar-urba-la-seu .eu-exposure-street {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.6;
  opacity: 0.88;
  vector-effect: non-scaling-stroke;
  cursor: pointer;
}
#ecoradar-urba-la-seu .eu-exposure-street.baix {
  stroke: #3d8b63;
}
#ecoradar-urba-la-seu .eu-exposure-street.moderat {
  stroke: #e0b446;
}
#ecoradar-urba-la-seu .eu-exposure-street.alt {
  stroke: #df7b35;
}
#ecoradar-urba-la-seu .eu-exposure-street.molt-alt {
  stroke: #8d2942;
}
#ecoradar-urba-la-seu .eu-exposure-warning {
  padding: 8px 10px;
  border-left: 3px solid #8d2942;
  background: #fff1f0;
  color: #682338 !important;
}
#ecoradar-urba-la-seu .eu-exposure-separation {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 9px 0;
}
#ecoradar-urba-la-seu .eu-exposure-separation article {
  padding: 9px;
  border: 1px solid #d8ded7;
  border-radius: 8px;
  background: #fff;
}
#ecoradar-urba-la-seu .eu-exposure-separation h4 {
  margin: 0 0 5px;
  color: var(--green);
  font-size: 11px;
}
#ecoradar-urba-la-seu .eu-exposure-counts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px;
  margin-top: 7px;
}
#ecoradar-urba-la-seu .eu-exposure-counts div {
  display: flex;
  justify-content: space-between;
  gap: 6px;
  padding: 5px;
  background: #f5f8f3;
  font-size: 9px;
}
#ecoradar-urba-la-seu .eu-climate-candidate {
  stroke: #fff;
  stroke-width: 1.4;
  vector-effect: non-scaling-stroke;
  cursor: pointer;
}
#ecoradar-urba-la-seu .eu-climate-candidate.alt,
#ecoradar-urba-la-seu .eu-climate-candidate.alta {
  fill: #1a7747;
}
#ecoradar-urba-la-seu .eu-climate-candidate.mitjà,
#ecoradar-urba-la-seu .eu-climate-candidate.mitja,
#ecoradar-urba-la-seu .eu-climate-candidate.mitjana {
  fill: #db8a2b;
}
#ecoradar-urba-la-seu .eu-climate-candidate.baix,
#ecoradar-urba-la-seu .eu-climate-candidate.baixa {
  fill: #c04938;
}
.eu-roof,
#ecoradar-urba-la-seu .eu-roof {
  stroke: #ffffff;
  stroke-width: 0.5;
  vector-effect: non-scaling-stroke;
  cursor: pointer;
  transition: opacity 0.15s ease;
}
.eu-roof:hover,
#ecoradar-urba-la-seu .eu-roof:hover {
  stroke: #0f172a;
  stroke-width: 1.2;
}
.eu-roof.favorable,
#ecoradar-urba-la-seu .eu-roof.favorable {
  fill: #16a34a !important;
  fill-opacity: 0.92 !important;
}
.eu-roof.condicionada,
#ecoradar-urba-la-seu .eu-roof.condicionada {
  fill: #f59e0b !important;
  fill-opacity: 0.92 !important;
}
.eu-roof.baixa,
#ecoradar-urba-la-seu .eu-roof.baixa {
  fill: #c95a47 !important;
  fill-opacity: 0.92 !important;
}
.eu-boundary,
#ecoradar-urba-la-seu .eu-boundary {
  fill: none;
  stroke: #0b3d72;
  stroke-width: 1.6;
  stroke-dasharray: 6 4;
  vector-effect: non-scaling-stroke;
  pointer-events: none;
}
#ecoradar-urba-la-seu .eu-place {
  fill: #fff;
  stroke: #0b3d72;
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
}
#ecoradar-urba-la-seu .eu-place-label {
  fill: #14395f;
  stroke: #fff;
  stroke-width: 3px;
  paint-order: stroke;
  font-size: 11px;
  font-weight: 750;
  pointer-events: none;
}
#ecoradar-urba-la-seu .eu-map-note {
  position: absolute;
  left: 10px;
  bottom: 10px;
  z-index: 4;
  max-width: 330px;
  padding: 7px 9px;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid #d5d0c4;
  font-size: 8px;
  line-height: 1.35;
  color: #455662;
}
#ecoradar-urba-la-seu .eu-map-legend-item {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
  font-size: 12px;
  color: var(--text-muted);
}
#ecoradar-urba-la-seu .eu-map-legend-item:last-child {
  margin-bottom: 0;
}
#ecoradar-urba-la-seu .eu-map-legend-item i {
  display: block;
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  border-radius: 2px;
  border: 1px solid rgba(0, 0, 0, 0.1);
}
#ecoradar-urba-la-seu .eu-legend {
  display: grid;
  gap: 5px;
  font-size: 9px;
  color: #445663;
}
#ecoradar-urba-la-seu .eu-legend-row {
  display: flex;
  align-items: center;
  gap: 7px;
}
#ecoradar-urba-la-seu .eu-swatch {
  width: 18px;
  height: 9px;
  border: 1px solid rgba(0, 0, 0, 0.12);
}
#ecoradar-urba-la-seu .eu-guide-title {
  margin: 0 0 6px;
  color: var(--green);
  font-size: 12px;
  line-height: 1.25;
  font-weight: 700;
}
#ecoradar-urba-la-seu .eu-temporal-context {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px 8px;
  margin: 0 0 8px;
  font-size: 8.5px;
  color: #52655d;
}
#ecoradar-urba-la-seu .eu-temporal-kind {
  border: 1px solid currentColor;
  border-radius: 999px;
  padding: 3px 7px;
  font-size: 8px;
  font-weight: 800;
}
#ecoradar-urba-la-seu .eu-temporal-kind.actual {
  color: #22613a;
  background: #e5f1e7;
}
#ecoradar-urba-la-seu .eu-temporal-kind.observation {
  color: #785819;
  background: #f6eed9;
}
#ecoradar-urba-la-seu .eu-temporal-kind.model {
  color: #5f466f;
  background: #f1eaf5;
}
#ecoradar-urba-la-seu .eu-temporal-kind.structural {
  color: #365774;
  background: #e8f0f5;
}
#ecoradar-urba-la-seu .eu-guide-copy {
  margin: 0 0 7px !important;
  color: #334d5d !important;
}
#ecoradar-urba-la-seu .eu-guide-legend-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
  gap: 5px 10px;
  margin: 9px 0 5px;
}
#ecoradar-urba-la-seu .eu-guide-label {
  margin: 0;
  color: var(--blue);
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.035em;
}
#ecoradar-urba-la-seu .eu-map-legend strong {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--eco-900);
  margin-bottom: 6px;
}
#ecoradar-urba-la-seu .eu-map-legend-group {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}
#ecoradar-urba-la-seu .eu-legend-observation {
  color: #785819;
  font-size: 8.5px;
  font-weight: 750;
}
#ecoradar-urba-la-seu .eu-legend-observation[hidden] {
  display: none;
}
#ecoradar-urba-la-seu .eu-guide-reading {
  margin-top: 8px !important;
  padding-top: 7px;
  border-top: 1px solid #e5e1d8;
}
#ecoradar-urba-la-seu .eu-guide-limit {
  margin-top: 7px !important;
  color: #6c5a47 !important;
}
#ecoradar-urba-la-seu .eu-age {
  display: flex;
  height: 11px;
  border-radius: 7px;
  overflow: hidden;
  margin: 8px 0 5px;
}
#ecoradar-urba-la-seu .eu-map-legend-item i.building {
  background: #e5e0d4;
  border-color: #a39e94;
}
#ecoradar-urba-la-seu .eu-map-legend-item i.green {
  background: #a8c88f;
  border-color: #5f965a;
}
#ecoradar-urba-la-seu .eu-map-legend-item i.water {
  background: #96c9db;
  border-color: #3f9ec0;
}
#ecoradar-urba-la-seu .eu-map-legend-item i.road {
  background: transparent;
  border: none;
  position: relative;
}
#ecoradar-urba-la-seu .eu-map-legend-item i.road::after {
  content: "";
  position: absolute;
  top: 7px;
  left: 0;
  right: 0;
  height: 2px;
  background: #dbd4c7;
}
#ecoradar-urba-la-seu .eu-age span:nth-child(1) {
  background: #65a2c4;
  width: 12.3%;
}
#ecoradar-urba-la-seu .eu-age span:nth-child(2) {
  background: #67a767;
  width: 67.6%;
}
#ecoradar-urba-la-seu .eu-age span:nth-child(3) {
  background: #d29d46;
  width: 16.6%;
}
#ecoradar-urba-la-seu .eu-age span:nth-child(4) {
  background: #934e73;
  width: 3.5%;
}
#ecoradar-urba-la-seu .eu-age-labels {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3px 8px;
  font-size: 8px;
  color: #50616e;
}
#ecoradar-urba-la-seu .eu-source {
  font-size: 8px !important;
  color: #74808a !important;
}
#ecoradar-urba-la-seu .eu-live-status {
  margin: 0 0 8px;
  padding: 7px 8px;
  border-left: 3px solid var(--green);
  background: #e8f2ea;
  color: #315a3f;
  font-size: 9px;
  line-height: 1.35;
}
#ecoradar-urba-la-seu .eu-live-status.is-loading {
  border-color: var(--cyan);
  background: #e8f2f7;
  color: #31576c;
}
#ecoradar-urba-la-seu .eu-live-status.is-fallback {
  border-color: var(--orange);
  background: #fff2db;
  color: #76521e;
}
#ecoradar-urba-la-seu .eu-daily-summary {
  margin-bottom: 9px;
  padding: 6px 7px;
  background: #eef3ec;
  border-left: 3px solid var(--green);
}

/* --- SATELLITE MODE, BOUNDARY MASK & CONTROLS --- */
.eu-outer-mask {
  shape-rendering: geometricPrecision;
  pointer-events: none;
}
.eu-toggle-ortho.is-active,
#ecoradar-urba-la-seu .eu-toggle-ortho.is-active {
  background: #198754 !important;
  color: #ffffff !important;
  border-color: #157347 !important;
  box-shadow: 0 0 10px rgba(25, 135, 84, 0.45) !important;
}
.eu-map-panel.is-satellite-mode .eu-building {
  fill: rgba(255, 255, 255, 0.18);
  stroke: rgba(255, 255, 255, 0.7);
  stroke-width: 0.5px;
}
.eu-map-panel.is-satellite-mode .eu-green {
  fill: rgba(72, 187, 120, 0.2);
  stroke: rgba(72, 187, 120, 0.6);
}
.eu-map-panel.is-satellite-mode .eu-water {
  fill: rgba(66, 153, 225, 0.4);
  stroke: #63b3ed;
  stroke-width: 1.5px;
}
.eu-map-panel.is-satellite-mode .eu-road {
  stroke: rgba(255, 255, 255, 0.75);
  stroke-width: 1.1px;
}
.eu-map-panel.is-satellite-mode .eu-boundary {
  stroke: #ffea00 !important;
  stroke-width: 2.2px !important;
  filter: drop-shadow(0 0 4px rgba(0, 0, 0, 0.95)) !important;
}
.eu-map-panel.is-satellite-mode .eu-place-label {
  fill: #ffffff !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.95), 0 0 6px rgba(0, 0, 0, 0.85);
  font-weight: 700;
}
.eu-raster-satellite {
  image-rendering: auto;
}