/* The interactive map on MapLibre GL (`?engine=gl`, im-view-gl.js), loaded after interactive-map.css. The page's own
 * look (labels, tooltips, the card popup, pins) is Leaflet's markup on DOM markers, styled by leaflet.css and
 * interactive-map.css as on the Leaflet page; this file only fits MapLibre's container to it. */

/* maplibre-gl.css makes the container `position: relative`: the page's map fills the shell. */
.im-map.maplibregl-map { position: absolute; inset: 0; font: 12px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif; }

/* The cursors interactive-map.css gives the Leaflet container. */
.im-map--pointer .maplibregl-canvas-container.maplibregl-interactive { cursor: pointer; }
.im-map--crosshair .maplibregl-canvas-container.maplibregl-interactive { cursor: crosshair !important; }
.im-map--laser .maplibregl-canvas-container.maplibregl-interactive { cursor: cell !important; }
.im-map--laser .maplibregl-canvas { touch-action: none !important; }

/* Stacking inside MapLibre's canvas container, as Leaflet's panes: the page's canvas (Present laser) over the map,
 * then grid labels, the player's pins, place names (inline z-index 1000-1200), tooltips, the card. */
.im-gl-overlay { position: absolute; top: 0; left: 0; z-index: 1; pointer-events: none; }
/* the GL view's DOM marks (im-view-gl.js domMark): placed by a transform from the container's top-left corner */
.im-gl-mark { position: absolute; top: 0; left: 0; }
.im-gridlabel-icon.im-gl-mark { z-index: 800; }
.im-mypin-icon.im-gl-mark { z-index: 900; touch-action: none; }
.im-gl-tip { z-index: 1300; pointer-events: none; }
.im-gl-popup { z-index: 1400; }

/* A POI's dot sits on its spot, under the name. */
.dz-loc-icon .im-gl-locdot { position: absolute; left: 69px; top: 4px; overflow: visible; }
.dz-loc-icon > .dz-loc { position: relative; }