.sr-range-slider {
padding: 14px 10px 6px;
box-sizing: border-box;
width: 100%;
}

.sr-range-values {
display: flex;
justify-content: space-between;
margin-bottom: 10px;
}

.sr-range-value {
display: inline-block;
padding: 3px 9px;
background-color: #666;
color: #fff;
font-size: 13px;
font-weight: 600;
border-radius: 4px;
line-height: 1.4;
}

.sr-range-track {
position: relative;
height: 4px;
background-color: #e2e2de;
border-radius: 2px;
}

.sr-range-bar {
position: absolute;
top: 0;
height: 4px;
background-color: #666;
border-radius: 2px;
}

.sr-range-handle {
position: absolute;
top: 50%;
width: 16px;
height: 16px;
margin-left: -8px;
margin-top: -8px;
background-color: #fff;
border: 2px solid #666;
border-radius: 50%;
cursor: pointer;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
touch-action: none;
}

.sr-range-handle:focus {
outline: none;
box-shadow: 0 0 0 3px rgba(24, 79, 149, 0.3);
}

.sr-range-grid {
display: flex;
justify-content: space-between;
margin-top: 8px;
font-size: 11px;
color: #898989;
}

.sr-range-grid span {
/* У крайних делений подпись прижимается к своему краю, у средних --
   центрируется, чтобы деления совпадали с точками на шкале визуально,
   а не просто равномерно распределялись как текст. */
flex: 0 0 auto;
}

/* [FIX] Раньше эти поля прятало CSS самого ion.rangeSlider (класс
   irs-hidden-input из его же комплекта) -- после отказа от плагина
   правило нужно перенести сюда, иначе служебные текстовые поля
   "от"/"до" станут видимыми поверх нового ползунка. */
.irs-hidden-input {
display: none;
}