/* Walkje global rule:
   Distance/radius slider belongs directly under the map.
*/

.wj-map-distance-slot{
  margin:0;
  padding:12px 14px 14px;
  background:rgba(7,19,13,.96);
  border-top:1px solid rgba(255,255,255,.10);
}

.wj-map-distance-slot .find-slider-card,
.wj-map-distance-slot .com-slider-card,
.wj-map-distance-slot .dw-slider,
.wj-map-distance-slot .dw-filter,
.wj-map-distance-slot .wj-soft-slider-wrap,
.wj-map-distance-slot .distance-card,
.wj-map-distance-slot .radius-card,
.wj-map-distance-card{
  margin:0!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.055)!important;
  border:1px solid rgba(255,255,255,.13)!important;
  padding:12px!important;
  width:100%!important;
  box-sizing:border-box!important;
}

.wj-map-distance-card{
  display:block;
}

.wj-map-distance-head,
.wj-map-distance-slot .find-slider-head,
.wj-map-distance-slot .com-slider-head,
.wj-map-distance-slot .dw-slider-head,
.wj-map-distance-slot .wj-soft-slider-head{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  gap:10px!important;
  margin-bottom:7px!important;
  color:#d8ffe3!important;
  font-size:13px!important;
  font-weight:1000!important;
}

.wj-map-distance-head strong,
.wj-map-distance-slot strong,
.wj-map-distance-slot output{
  color:#f5fff7!important;
  white-space:nowrap!important;
  font-weight:1000!important;
}

.wj-map-distance-slot input[type="range"],
.wj-map-distance-card input[type="range"]{
  width:100%!important;
  accent-color:#22c55e!important;
}

.wj-map-distance-note{
  margin:7px 0 0!important;
  color:#a7c6ae!important;
  font-size:12.5px!important;
  line-height:1.35!important;
  font-weight:800!important;
}

/* Hide empty old distance cards after moving, but leave non-distance filters alone. */
[data-wj-distance-moved-placeholder="1"]{
  display:none!important;
}

/* Make map captions and the distance slider feel like one unit. */
.find-map-caption,
.dw-map-caption,
.com-map-caption,
.map-caption,
.live-map-caption{
  border-bottom:0!important;
}

/* Phone spacing */
@media(max-width:900px){
  .wj-map-distance-slot{
    padding:10px 12px 12px!important;
  }

  .wj-map-distance-slot .find-slider-card,
  .wj-map-distance-slot .com-slider-card,
  .wj-map-distance-slot .dw-slider,
  .wj-map-distance-slot .dw-filter,
  .wj-map-distance-slot .wj-soft-slider-wrap,
  .wj-map-distance-card{
    border-radius:16px!important;
    padding:10px 11px!important;
  }

  .wj-map-distance-head,
  .wj-map-distance-slot .find-slider-head,
  .wj-map-distance-slot .com-slider-head,
  .wj-map-distance-slot .dw-slider-head,
  .wj-map-distance-slot .wj-soft-slider-head{
    font-size:12.5px!important;
  }
}