:root {
    --slider-border-color: rgb(124, 124, 129);
    --slider-background: rgb(26, 26, 30);
    --slider-text-color: rgb(255, 255, 255);
    --slider-thumb-color: rgb(255, 255, 255);
    --slider-thumb-size: 16px;
}

.drui-slider {
    -webkit-appearance: none; /* Для Chrome/Safari */
    appearance: none;
    background: var(--slider-background);
    color: var(--slider-text-color);
    border: 1px solid var(--slider-border-color);
    cursor: pointer;
    border-radius: 10px;
}

.drui-slider:focus {
    outline: none;
}

.drui-slider::-webkit-slider-runnable-track {
  background: var(--slider-background);
  height: 16px;
  border-radius: 10px;
}

.drui-slider::-moz-range-track {
  background: var(--slider-background);
  height: 16px;
  border-radius: 10px;
}

.drui-slider::-webkit-slider-thumb {
  -webkit-appearance: none; /* Обязательно для Chrome */
  appearance: none;
  background-color: var(--slider-thumb-color);
  height: var(--slider-thumb-size);
  width: var(--slider-thumb-size);
  border-radius: 50%;
  border: 1px solid var(--slider-border-color);
}

.drui-slider::-moz-range-thumb {
  background-color: var(--slider-thumb-color);
  height: var(--slider-thumb-size);
  width: var(--slider-thumb-size);
  border-radius: 50%;
  border: 1px solid var(--slider-border-color);
}