src/js/poncho-map/src/scss/_variables.scss
@mixin borderRadius($value) {
    -webkit-border-radius: #{$value};
    -moz-border-radius: #{$value};
    border-radius: #{$value};
}




#{$scope}  {
    --pm-slider-width: 330px;
    --pm-tools-width: 300px;
    --pm-color-primary: var(--primary, #0072bb);
    --pm-map-background:white;
    
    --pm-color-base: var(--black, #333);
    --pm-content-padding: 15px;
    
    --pm-hover-background: #ddd;
    --pm-hover-color: var(--pm-color-base);
    --pm-link: var(--arg-enlace, #0767A7);
    --pm-active-color: white;
    --pm-active-background: var(--pm-color-primary);
    --pm-active-visited-color: var(--arg-uva, blueviolet);

    --pm-slider-background: rgba(255, 255, 255, 1);
    --pm-slider-border-color: #ddd;
    --pm-slider-border-width: 1px;

    --pm-slider-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    --pm-slider-distance: 10px;
    --pm-slider-radius: 22px;
    --pm-slider-media-mobile-height: 100%;
    
    // Colores para el tooltip
    --pm-tooltip: #333;
    --pm-tooltip-color: white;
    
    // Modal para mobiles.
    // Debajo del slider se crea un div con opacidad.
    --pm-slider-modal-color: var(--black);
    
    --pm-active-marker-color: var(--arg-maiz, gold);
    --pm-active-marker-color-darker: var(--arg-naranja, orange);

    --pm-accesible-background: #eaeaea;

    --pm-loader-background: var(--pm-map-background);
    --pm-loader-spinner-color: var(--pm-color-primary);
    --pm-loader-spinner-background: #ccc;
    --pm-loader-spinner-size: 80px;
    --pm-loader-spinner-weight: 4px;

    --pm-scrollbar-handle: #444;
    --pm-scrollbar-background: #ddd;
}