/* web/static/mapa.css -- CSS del mapa de trenes en movimiento (Tarea 5,
 * ronda de arreglo final tras auditoría de rama, FINDING #1).
 *
 * Por qué existe como hoja separada en vez de vivir en `estilo.css`: estas
 * reglas SOLO las pinta `mapa-estaciones.js` sobre `data-mapa-estaciones`,
 * que SOLO existe en `portada.html` (única página con mapa). Si vivieran en
 * `estilo.css` -- compartida por las 18 plantillas del módulo vía
 * `base.html` -- el `?v` de esa hoja subiría igual, el `<link>` de CADA
 * plantilla cambiaría de byte, y las 18 páginas se reescribirían en el
 * próximo regen aunque solo la portada tenga mapa: exactamente lo que
 * prohíbe la Regla 94 (`~/.claude/rules/ecc/common/94-deploy-regen-
 * lastmod.md`) y lo que exigía preservar el ADR D-053 / spec §9 / plan de
 * esta feature ("written=1, solo portada"). Separar el CSS de alcance-
 * portada en su propia hoja, cargada SOLO en `portada.html` (mismo `{%
 * block head_extra %}` que ya usa `leaflet.css`, ver docstring de esa
 * plantilla), hace que únicamente el `render_hash` de la portada cambie.
 *
 * Variables (`--space-*`, `--blog-bg`, `--blog-borde-sutil`, `--radar-
 * radius`, `--blog-texto-atenuado`): definidas en el bloque TOKENS de
 * `estilo.css` sobre `:root` -- se resuelven igual aquí porque `base.html`
 * siempre carga `estilo.css` antes que este `head_extra` (ver `base.html`
 * línea ~29 vs. bloque `head_extra`), y una custom property de `:root` no
 * depende de en qué hoja se definió. Esta hoja NO lleva su propio bloque de
 * tokens (no está en `ops/sync_tokens.py::HOJAS`, ver `tests/test_tokens.py`
 * -- solo `estilo.css` y `wp/astra-child/style.css` los llevan).
 *
 * Versionado: `?v=1` propio (independiente del `?v` de `estilo.css`), mismo
 * criterio de cache-busting que el resto de estáticos del módulo (D-039,
 * `tests/test_static.py`).
 */

/* Overlay de capas del mapa (Tarea 5, D4): toggle Estaciones|Trenes +
 * atribución de la capa de trenes, ambos pintados por mapa-estaciones.js
 * ENCIMA del mapa. `position: absolute` sobre el mismo ancestro posicionado
 * que `.mapa-leaflet` (`.portada-map-frame`, position:relative) + z-index
 * explícito para ganar a `.mapa-leaflet` (z-index:auto) -- sustituye a
 * `L.control.layers`, prohibido por D-049. Fondo opaco (--blog-bg) + borde
 * sutil: mismo criterio que `.portada-chip`/`.portada-card`, que ya usan
 * `--blog-borde-sutil` sin necesitar un par de contraste dedicado (no es
 * un límite que deba superar 3:1, es un divisor decorativo) -- por eso no
 * entra fila nueva en tests/test_contraste.py. */
.mapa-overlay {
  position: absolute;
  top: var(--space-3);
  left: var(--space-3);
  z-index: 1000;
  max-width: calc(100% - 2 * var(--space-3));
  background: var(--blog-bg);
  border: 1px solid var(--blog-borde-sutil);
  border-radius: var(--radar-radius);
  padding: var(--space-2) var(--space-3);
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.mapa-capas {
  display: flex;
  gap: var(--space-2);
}

/* Dentro del overlay compacto, sin el margen que .attrib/.alertas-vacio
   llevan para su uso habitual en el flujo normal de la página -- el `gap`
   del flex column ya separa los bloques. */
.mapa-overlay .attrib,
.mapa-overlay .alertas-vacio {
  margin: 0;
}

.mapa-popup__frescura {
  margin-top: 0.35rem;
  color: var(--blog-texto-atenuado);
}
