/* v0.42.4A: estilos específicos del proveedor MapLibre.
   El layout general vive en mapa.css; este archivo sólo estiliza el SDK. */

.maplibregl-map,
.maplibregl-canvas-container,
.maplibregl-canvas {
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  font-family: inherit;
}

.map-provider-canvas-maplibre {
  background: #dbe4ee;
}

.maplibregl-canvas {
  outline: none;
}

.maplibregl-ctrl-bottom-right,
.maplibregl-ctrl-bottom-left {
  z-index: 2;
}

.maplibregl-ctrl-attrib,
body.page-mapa .maplibregl-ctrl-attrib {
  border: 1px solid var(--map-overlay-border) !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
  border-radius: 10px 0 0 0 !important;
  background: var(--map-overlay-bg) !important;
  color: rgba(15, 23, 42, 0.78) !important;
  box-shadow: var(--map-overlay-shadow) !important;
  font-family: inherit !important;
  font-size: 10px !important;
  backdrop-filter: blur(var(--map-overlay-blur));
  -webkit-backdrop-filter: blur(var(--map-overlay-blur));
}

.maplibregl-ctrl-attrib a {
  color: #0f766e !important;
  font-weight: 800;
}

.maplibregl-ctrl-attrib-button {
  background-color: rgba(255, 255, 255, 0.7) !important;
}

@media (max-width: 840px) {
  .map-shell.has-photo-tray .maplibregl-ctrl-bottom-right,
  .map-shell.has-photo-tray .maplibregl-ctrl-bottom-left {
    bottom: 126px;
  }
}

/* C042.8N: shared MapLibre HTML marker overlay styles.
   The DOM marker overlay is used both by mapa.html and by the embedded company
   mini-map in empresa.html. Keeping the essential marker sizing here, instead
   of only in mapa.css, prevents the company detail preview from rendering an
   unstyled, oversized HTML marker that visually covers the real map tiles. */
.maplibregl-marker.facilitator-maplibre-html-marker,
.facilitator-maplibre-html-marker {
  z-index: 6;
  display: grid;
  width: var(--marker-size, 44px);
  height: var(--marker-size, 44px);
  padding: 0;
  place-items: center;
  border: 0;
  background: transparent;
  cursor: pointer;
  pointer-events: auto;
}

.facilitator-maplibre-html-marker .map-marker {
  position: relative;
  display: flex;
  width: var(--marker-size, 44px);
  height: var(--marker-size, 44px);
  align-items: center;
  justify-content: center;
  overflow: visible;
  border: 4px solid var(--map-marker-border, #007681);
  border-radius: 999px;
  background: #ffffff;
  color: var(--map-marker-text, #007681);
  box-shadow:
    0 16px 34px rgba(5, 8, 22, 0.24),
    0 0 0 1px rgba(5, 8, 22, 0.08);
  font-size: 13px;
  font-weight: 950;
}

.facilitator-maplibre-html-marker .map-marker-normal {
  --map-marker-border: #007681;
  --map-marker-text: #007681;
}

.facilitator-maplibre-html-marker .map-marker-featured {
  --map-marker-border: #f59e0b;
  --map-marker-text: #92400e;
}

.facilitator-maplibre-html-marker .map-marker-selected {
  --map-marker-border: var(--map-accent, #04d4cb);
  --map-marker-text: var(--map-selected-bg, #041111);
  box-shadow:
    0 18px 44px rgba(5, 8, 22, 0.34),
    0 0 0 6px rgba(4, 212, 203, 0.28);
}

.facilitator-maplibre-html-marker .map-marker-hovered {
  --map-marker-border: #0d6fb7;
  --map-marker-text: #0d6fb7;
}

.facilitator-maplibre-html-marker .map-marker-logo-img {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 999px;
  background: #ffffff;
  object-fit: cover;
}

.facilitator-maplibre-html-marker .map-marker-initials {
  position: absolute;
  inset: 0;
  display: grid;
  width: 100%;
  height: 100%;
  place-items: center;
  font-size: 0.78em;
  font-weight: 950;
  letter-spacing: -0.06em;
}

.facilitator-maplibre-html-marker .map-marker-status-glyph {
  position: absolute;
  top: -0.35rem;
  right: -0.35rem;
  z-index: 2;
  display: grid;
  min-width: 1rem;
  height: 1rem;
  place-items: center;
  border: 2px solid #ffffff;
  border-radius: 999px;
  background: #fff7ed;
  color: #92400e;
  font-size: 0.72rem;
  font-weight: 950;
  box-shadow: 0 0 0 2px #ffffff;
}

.facilitator-maplibre-html-marker:focus-visible .map-marker {
  outline: 3px solid rgba(4, 212, 203, 0.62);
  outline-offset: 4px;
}

/* C3.2.2 — lighter attribution on compact map. */
body.page-mapa .maplibregl-ctrl-attrib {
  opacity: 0.68 !important;
  background: rgba(255, 255, 255, 0.62) !important;
  box-shadow: none !important;
  font-size: 9px !important;
  line-height: 1.15 !important;
}
