@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
.leaflet-ruler {
    height: 35px;
    width: 35px;
    background-image: url("../dist/icon.png");
    /* <div>Icons made by <a href="http://www.freepik.com" title="Freepik">Freepik</a> from <a href="http://www.flaticon.com" title="Flaticon">www.flaticon.com</a> is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" target="_blank">CC 3.0 BY</a></div> */
    background-repeat: no-repeat;
    background-position: center;
}

.leaflet-ruler:hover {
    background-image: url("../dist/icon-colored.png");
    /* <div>Icons made by <a href="http://www.freepik.com" title="Freepik">Freepik</a> from <a href="http://www.flaticon.com" title="Flaticon">www.flaticon.com</a> is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" target="_blank">CC 3.0 BY</a></div> */
}

.leaflet-ruler-clicked {
    height: 35px;
    width: 35px;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url("../dist/icon-colored.png");
    border-color: chartreuse !important;
}

.leaflet-bar {
    background-color: #ffffff;
}

.leaflet-control {
    cursor: pointer;
}

.result-tooltip {
    font-family: "Montserrat", sans-serif;
    background-color: #ffcc33b2;
    color: rgba(61, 61, 61, 0.932);
    border: 1px solid rgb(172, 172, 172);
    font-size: 13px;
    font-weight: 400;
}

.temp-line-tooltip {
    background-color: rgba(70, 70, 70, 0.7);
    color: #fff;
    opacity: 0.5;
    border: none;
    font-size: 12px;
}
.line-tooltip {
    font-family: "Montserrat", sans-serif;
    font-weight: 700;
    background-color: transparent;
    text-shadow: -0.5px 0.5px 0 #ffad33ad, 0.5px -1px 0 #ff9b33ad, 0.5px -0.5px 0 #ffb733ad, -0.5px -0.5px 0 #ff9b33ad;
    color: black;
    opacity: 0.8;
    border: none;
    font-size: 13.5px;
    box-shadow: none;
}
.result-tooltip.leaflet-tooltip-bottom:before {
    border-color: transparent transparent transparent transparent; /* Tip color */
}

.result-tooltip.leaflet-tooltip-top:before {
    border-color: #ffcc33b2 transparent transparent transparent; /* Tip color */
}
.result-tooltip.leaflet-tooltip-bottom:before {
    border-color: transparent transparent  #ffcc33b2 transparent; /* Tip color */
}
.result-tooltip.leaflet-tooltip-left:before {
    border-color: transparent #ffcc33b2 transparent  transparent; /* Tip color */
}
.result-tooltip.leaflet-tooltip-right:before {
    border-color: transparent transparent transparent #ffcc33b2; /* Tip color */
}

.moving-tooltip {
    background-color: rgba(70, 70, 70, 0.7);
    color: #fff;
    opacity: 0.5;
    border: none;
    font-size: 12px;
}
/* Custom styles for the tooltip tip */
.moving-tooltip.leaflet-tooltip-top:before {
    border-color: rgba(70, 70, 70, 0.7) transparent transparent transparent; /* Tip color */
}
.moving-tooltip.leaflet-tooltip-bottom:before {
    border-color: transparent transparent  rgba(70, 70, 70, 0.7) transparent; /* Tip color */
}
.moving-tooltip.leaflet-tooltip-left:before {
    border-color: transparent rgba(70, 70, 70, 0.7) transparent  transparent; /* Tip color */
}
.moving-tooltip.leaflet-tooltip-right:before {
    border-color: transparent transparent transparent rgba(70, 70, 70, 0.7); /* Tip color */
}

.plus-length {
    padding-left: 45px;
}