/* Shared ramp and markers for the map and both Atlas viewers. */
.agv3-colour-ramp { position:relative; height:10px; border-radius:3px; }
.agv3-colour-reading { position:absolute; top:-4px; width:2px; height:18px; transform:translateX(-50%); background:#c02632; z-index:1; }
.agv3-colour-threshold { position:absolute; top:-3px; bottom:-3px; width:2px; transform:translateX(-50%); background:#788185; box-shadow:0 0 0 1px #ffffff9c; }
.agv3-colour-ramp[data-orientation=vertical] { width:10px; height:100%; }
.agv3-colour-ramp[data-orientation=vertical] > span { top:auto; left:-3px; right:-3px; width:auto; height:2px; transform:translateY(50%); }
.agv3-colour-ramp[data-orientation=vertical] > .agv3-colour-reading { left:-5px; right:-5px; }

/* Only the two handles capture gestures; the scale passes them to the map. */
.agv3-dmha-legend {
  /* Keep the draggable overlay above the map selection card at saved positions. */
  position:absolute; z-index:calc(var(--agv3-z-map-dialog, 1500) + 1);
  top:calc(var(--agv3-map-control-top, 66px) + 76px);
  right:calc(8px + env(safe-area-inset-right, 0px));
  box-sizing:border-box; width:66px; padding:7px 5px 13px 9px;
  border:1px solid #c7d6cd; border-radius:10px;
  background:rgba(250,253,249,.94); color:#183c41;
  box-shadow:0 3px 12px #0002; font:11px/13px system-ui;
  pointer-events:none;
}
.agv3-dmha-legend *, .agv3-dmha-legend { pointer-events:none; }
.agv3-dmha-legend[hidden] { display:none; }
.agv3-dmha-legend > strong { display:block; font-size:11px; line-height:13px; font-weight:600; }
.agv3-dmha-legend .agv3-dmha-legend-move,
.agv3-dmha-legend .agv3-dmha-legend-resize { pointer-events:auto; touch-action:none; user-select:none; }
.agv3-dmha-legend-move {
  display:block; width:calc(100% + 14px); min-height:36px; margin:-7px -5px 0 -9px; padding:7px 5px 4px 9px;
  border:0; border-radius:9px 9px 0 0; box-shadow:none; background:transparent;
  color:inherit; font:inherit; text-align:left; cursor:grab;
}
.agv3-dmha-legend-move strong { display:block; font-size:11px; line-height:13px; font-weight:600; white-space:nowrap; }
.agv3-dmha-legend-move small { display:block; font-size:10px; line-height:12px; }
.agv3-dmha-legend-move strong::after { content:'⠿'; margin-left:3px; color:#788185; font-size:12px; }
.agv3-dmha-legend-resize { position:absolute; bottom:-6px; left:0; right:0; height:24px; cursor:ns-resize; border-radius:0 0 9px 9px; }
.agv3-dmha-legend-resize::after { content:''; position:absolute; left:calc(50% - 9px); top:11px; width:18px; height:2px; border-radius:2px; background:#788185; }
.agv3-dmha-legend-move:focus-visible, .agv3-dmha-legend-resize:focus-visible { outline:2px solid #355c36; outline-offset:1px; }
.agv3-dmha-legend.is-dragging .agv3-dmha-legend-move { cursor:grabbing; }
.agv3-dmha-legend-axis { position:relative; height:80px; margin:10px 0 9px; }
.agv3-dmha-legend-tick { position:absolute; left:18px; transform:translateY(50%); white-space:nowrap; }
.agv3-dmha-legend-name { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:10px; min-height:12px; }
.agv3-dmha-legend-value { color:#a31e29; min-height:13px; }
.agv3-dmha-legend-name:empty, .agv3-dmha-legend-value:empty { display:none; }
#agv3App.agv3-area-drawing .agv3-dmha-legend { display:none; }
@media (max-height:500px) { .agv3-dmha-legend-axis { height:64px; } }
