/* CSS Document */

.slider-multithumb {
  padding: 6px;
  width: 350px;
  touch-action: pan-y;
}

.slider-multithumb svg {
  forced-color-adjust: auto;
}

.slider-multithumb .slider-group {
  color: black;
}

.slider-multithumb .slider-group .value {
  font-size: 80%;
  color: currentcolor;
  fill: currentcolor;
}

.slider-multithumb .slider-group .rail {
  stroke: currentcolor;
  stroke-width: 2px;
  fill-opacity: 0;
}

.slider-multithumb .slider-group .range {
  fill: currentcolor;
  opacity: 0.4;
  pointer-events: none;
}

.slider-multithumb .slider-group .thumb {
  stroke-opacity: 0;
  stroke-width: 2px;
  fill: currentcolor;
}

.slider-multithumb .slider-group .focus-ring {
  stroke-opacity: 0;
  fill-opacity: 0;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Focus and hover styling */

.slider-multithumb .slider-group g.rail,
.slider-multithumb .slider-group g.focus {
  color: currentcolor;
}

.slider-multithumb .slider-group.active g.rail {
  opacity: 0.8;
}

.slider-multithumb .slider-group.active g.range {
  fill: #005a9c;
  fill-opacity: 1;
}

.slider-multithumb [role="slider"]:focus {
  outline: none;
  color: #005a9c;
}

.slider-multithumb [role="slider"]:hover .focus-ring {
  stroke: currentcolor;
  stroke-width: 1px;
  stroke-opacity: 0.8;
}

.slider-multithumb [role="slider"]:hover .focus-ring,
.slider-multithumb [role="slider"]:focus .focus-ring {
  stroke: currentcolor;
  stroke-opacity: 1;
  stroke-width: 3px;
}

.slider-multithumb [role="slider"]:focus .thumb {
  stroke: currentcolor;
}

.slider-multithumb [role="slider"]:focus .value {
  color: currentcolor;
  font-weight: bold;
}