<style>
/* ========== БАЗОВЫЙ СТИЛЬ ЧЕКБОКСА ========== */
/* Оформление чекбокса (по умолчанию) */
.t-store__filter__checkmark_radio,
.t-checkbox__indicator {
position: relative;
display: inline-block;
width: 22px; /* ← Размер чекбокса */
height: 22px;
border: 1px solid #888888; /* ← Цвет рамки по умолчанию */
border-radius: 4px; /* ← Скругление */
background-color: transparent;
box-sizing: border-box;
transition: background-color 0.3s ease, border-color 0.3s ease;
vertical-align: middle;
cursor: pointer;
}
/* ========== СТИЛЬ АКТИВНОГО ЧЕКБОКСА ========== */
/* Активный (выбранный) чекбокс */
.t-store__filter__item-controls-container_radio .active .t-store__filter__checkmark_radio,
input[type="checkbox"]:checked + .t-checkbox__indicator {
background-color: #1B63E9 !important; /* ← Синий фон */
border-color: #1B63E9 !important; /* ← Синяя рамка */
}
/* ========== СТИЛЬ ГАЛОЧКИ ========== */
/* Псевдоэлемент галочки — белая галка по центру */
.t-store__filter__checkmark_radio:after,
.t-store .t-checkbox__indicator:after {
content: "";
position: absolute;
top: 40%; /* ← Положение галочки по горизонтали */
left: 50%; /* ← Положение галочки по вертикали */
width: 4px; /* ← Размер маленькой линии галочки */
height: 8px; /* ← Размер длинной линии галочки */
border: solid #ffffff; /* ← Белая галочка */
border-width: 0 2px 2px 0;
transform: translate(-50%, -50%) rotate(45deg);
pointer-events: none;
display: block;
}
/* ========== СТИЛЬ ПОЛОСЫ С ЦЕНОЙ на 960+ ========== */
@media screen and (min-width: 960px) {
.t-store__filter__range_bg {
background-color: #1B63E9;
}
}
</style>