/* ===================================== */
/* MAP MARKERS */
/* ===================================== */

.own-marker,
.dataset-marker {

  position: relative;

  box-sizing: border-box;

  width: 10px;
  height: 10px;

  border-radius: 50%;

  border: 2px solid white;

  opacity: 0.98;

  z-index: 10;

  box-shadow:
    0 2px 8px rgba(0,0,0,0.35);

  transition:
    transform 0.12s ease,
    box-shadow 0.12s ease;
}

/* ===================================== */
/* DARK OUTER RING */
/* ===================================== */

.own-marker::before,
.dataset-marker::before {

  content: '';

  position: absolute;

  inset: -3px;

  border-radius: inherit;

  border:
    2px solid rgba(0,0,0,0.75);

  pointer-events: none;
}

/* ===================================== */
/* OWN */
/* ===================================== */

.own-marker {

  border-radius: 50%;
}

/* ===================================== */
/* DATASET */
/* ===================================== */

.dataset-marker {

  border-radius: 4px;
}

/* ===================================== */
/* INNER HIGHLIGHT */
/* ===================================== */

.own-marker::after,
.dataset-marker::after {

  content: '';

  position: absolute;

  inset: 18%;

  border-radius: inherit;

  background:
    rgba(255,255,255,0.25);

  pointer-events: none;
}

/* ===================================== */
/* HOVER */
/* ===================================== */

.own-marker:hover,
.dataset-marker:hover {

  transform: scale(1.18);

  z-index: 999;

  box-shadow:
    0 0 0 2px white,
    0 0 12px rgba(37,99,235,0.35),
    0 4px 12px rgba(0,0,0,0.45);
}

/* ===================================== */
/* SELECTED */
/* ===================================== */

.selected-marker {

  transform: scale(1.45);

  z-index: 9999;

  box-shadow:
    0 0 0 2px white,
    0 0 20px rgba(37,99,235,0.9),
    0 4px 14px rgba(0,0,0,0.45);
}

/* ===================================== */
/* CLUSTERS */
/* ===================================== */

.marker-cluster-small,
.marker-cluster-medium,
.marker-cluster-large {

  background:
    rgba(37,99,235,0.18);
}

.marker-cluster div {

  background:
    rgba(37,99,235,0.88);

  color: white;

  font-weight: 700;

  border:
    3px solid white;

  box-shadow:
    0 2px 10px rgba(0,0,0,0.35);
}

/* ===================================== */
/* MAP TOOLTIP */
/* ===================================== */

.leaflet-tooltip {

  border: none !important;

  border-radius: 10px;

  background:
    rgba(17,24,39,0.96) !important;

  color: white !important;

  box-shadow:
    0 6px 20px rgba(0,0,0,0.35);

  padding:
    10px 12px;

  font-size: 13px;
}

.mapTooltipTitle {

  font-weight: 700;

  margin-bottom: 4px;

  color: white;
}

.mapTooltipStats {

  font-size: 12px;

  color: rgba(255,255,255,0.82);

  margin-bottom: 4px;
}

.mapTooltipScore {

  font-size: 12px;

  font-weight: 600;

  color: #93c5fd;
}

.leaflet-container {
    width: 100%;
    height: 100%;
}

.trailq-map-toolbar a.disabled {
    opacity: 0.65;
    pointer-events: none;
    cursor: default;
    color: #93c5fd;
}

.trailq-map-toolbar {
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
}