/* Shared by the signed-in route map and the public share map. */
.route-notes-map-zone-label {
  display:block;
  width:max-content;
  color:#1E293B;
  font-size:14px;
  font-weight:700;
  white-space:nowrap;
  text-shadow:0 0 3px #fff,0 0 3px #fff,0 0 3.5px #fff;
  user-select:none;
  pointer-events:none;
  transform:translate(-50%,-50%);
}

.route-notes-map-tip-marker,.route-notes-map-picked-marker {
  --route-note-marker-color:#2466C3;
  position:relative;
  display:grid;
  place-items:center;
  box-sizing:border-box;
  width:44px;
  height:44px;
  padding:0;
  border:1px solid #D5DEE8;
  border-radius:50%;
  background:#fff;
  color:var(--route-note-marker-color);
  box-shadow:0 2px 7px rgb(38 61 95 / .13);
  cursor:pointer;
  touch-action:manipulation;
  color-scheme:light;
}
.route-notes-map-tip-marker[data-alert="true"] { --route-note-marker-color:#DF655D; }
.route-notes-map-picked-marker { border:0; background:transparent; box-shadow:none; pointer-events:none; }
.route-notes-map-tip-marker .route-notes-map-icon {
  display:block;
  width:22px;
  height:22px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.35;
  stroke-linecap:round;
  stroke-linejoin:round;
  pointer-events:none;
  transition:transform 140ms ease;
}
.route-notes-map-tip-marker .route-notes-icon,.route-notes-map-picked-marker .route-notes-icon {
  display:block;
  width:26px;
  height:26px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.2;
  stroke-linecap:round;
  stroke-linejoin:round;
  overflow:visible;
  filter:drop-shadow(1px 0 0 #fff) drop-shadow(-1px 0 0 #fff) drop-shadow(0 1px 0 #fff) drop-shadow(0 -1px 0 #fff);
  transition:transform 140ms ease;
  pointer-events:none;
}
.route-notes-map-tip-marker[aria-pressed="true"] { box-shadow:0 0 0 3px color-mix(in srgb, currentColor 18%, transparent),0 3px 9px rgb(38 61 95 / .18); }
.route-notes-map-tip-marker[aria-pressed="true"] .route-notes-map-icon { width:24px; height:24px; transform:scale(1.04); }
.route-notes-overview-map[data-has-selected-tip="true"] .route-notes-map-tip-marker:not([aria-pressed="true"]) { opacity:.44; }
.route-notes-map-tip-marker[aria-pressed="true"]::after {
  content:"";
  position:absolute;
  bottom:1px;
  left:50%;
  width:6px;
  height:6px;
  border:2px solid #fff;
  border-radius:50%;
  background:currentColor;
  transform:translateX(-50%);
}
.route-notes-map-tip-marker:active .route-notes-map-icon { transform:scale(.9); }
.route-notes-map-tip-marker:focus-visible {
  outline:3px solid #1B62D6;
  outline-offset:1px;
}
@media (prefers-reduced-motion:reduce) {
  .route-notes-map-tip-marker .route-notes-map-icon,.route-notes-map-picked-marker .route-notes-icon { transition:none; }
}
.route-notes-map-vertex {
  width: 44px; height: 44px; border: 8px solid transparent; background: #fff;
  background-clip: padding-box; border-radius: 50%; color: #174da4;
  font: 700 12px/1 system-ui, sans-serif; padding: 0; cursor: grab;
  box-shadow: 0 0 0 1px #1b62d6 inset; touch-action: none;
}
.route-notes-map-vertex[aria-pressed="true"] { background-color: #1b62d6; color: #fff; }
.route-notes-map-vertex:focus-visible { outline: 3px solid #1b62d6; outline-offset: 2px; }
