/* Route page map (RouteMapCanvas): terminal labels and the way into the live
 * tracker. Colours come from the shared map theme (app/map-theme.css, generated
 * from packages/ui/.../shared/map-theme.ts); the map stays light in dark mode,
 * so the fixed --mt-light-* values are used. The label is DOM so it never
 * depends on the basemap's glyphs. No `position` on .rm-label:
 * maplibre-gl.css makes markers absolute and the per-frame translate would
 * drift if it were overridden. Same pill as the tracker's terminal labels. */
.rm-label {
  font: 500 12px/1 var(--font-gt-ferry), system-ui, sans-serif;
  color: var(--mt-light-pin-label-fg);
  background: var(--mt-light-pin-label-bg);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
  padding: 5px 8px 4px;
  border-radius: 6px;
  white-space: nowrap;
  pointer-events: none;
}
.rm-open {
  position: absolute;
  z-index: 2;
  left: 8px;
  top: 8px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  /* 44px: the minimum touch target (AGENTS.md, WCAG AA). */
  min-height: 44px;
  padding: 0 14px;
  border-radius: 22px;
  background: var(--mt-light-pin-label-bg);
  color: var(--mt-light-pin-label-fg);
  font: 500 12.5px/1 var(--font-gt-ferry), system-ui, sans-serif;
  text-decoration: none;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.16);
}
.rm-open:hover {
  background: #fff;
}
.rm-open:focus-visible {
  outline: 2px solid var(--mt-route);
  outline-offset: 2px;
}