src/js/poncho-map/src/scss/_caret.scss
$caret-front-size: 8px;
$caret-back-size: 10px;

#{$scope} {
    .pm-caret {
        &:after,
        &:before {
            content: " ";
            width: 0;
            height: 0;
            z-index: 990;
            position: absolute;
        }

        &:after {
            border-left: $caret-front-size solid rgba(0, 0, 0, 0);
            border-right: $caret-front-size solid rgba(0, 0, 0, 0);
            border-bottom: $caret-front-size + 1 solid var(--pm-slider-background);
        }

        &:before {
            border-left: $caret-back-size solid rgba(0, 0, 0, 0);
            border-right: $caret-back-size solid rgba(0, 0, 0, 0);
            border-bottom: $caret-back-size + 1 solid var(--pm-slider-border-color);
            transform: translateZ(-1px);
            -moz-transform: translateZ(-1px);
        }

        &-t:after {
            top: -7px;
            left: 11px;
        }

        &-t:before {
            top: calc(-7.75px - var(--pm-slider-border-width));
            left: 9px;
            transform: translateZ(-1px);
            -moz-transform: translateZ(-1px);
        }

        &-b:after {
            bottom: -7px;
            left: 11px;
            transform: rotate(180.1deg);
            -moz-transform: rotate(180.1deg);
        }

        &-b:before {
            bottom: calc(-7.75px - var(--pm-slider-border-width));
            left: 9px;
            transform: translateZ(-1px) rotate(180.1deg);
            -moz-transform: translateZ(-1px) rotate(180.1deg); /*Fix en el rotate*/
        }
    }
}
