/* Глобальная настройка размера */
.t-input-group {
    --switch-size: 16px; /* Размер внешнего квадрата */
}

/* Скрытие чекбокса */
.t-checkbox {
    display: none;
}

/* Основной скругленный квадрат */
.t-checkbox__indicator {
    position: relative !important;
    display: inline-block !important;
    width: var(--switch-size) !important;
    height: var(--switch-size) !important;
    background-color: rgb(255, 255, 255) !important; /* Цвет фона в неактивном состоянии */
    border-radius: calc(var(--switch-size) * 0.2) !important; /* Скругление углов */
    transition: background-color 0.3s ease !important;
    overflow: hidden !important; /* Обрезка внутренних элементов */
    border: 1px solid #ffffff !important;
}

/* Переопределение стилей участка №1 (галочки) */
.t-checkbox__indicator::after {
    content: "" !important;
    display: block !important; /* Отменяем display: none из участка №1 */
    position: absolute !important;
    top: 2px !important; /* Отступ сверху */
    left: 2px !important; /* Отступ слева */
    right: 2px !important; /* Отступ справа */
    bottom: 2px !important; /* Отступ снизу */
    background-color: #FE8010 !important; /* Цвет заполнения */
    border-radius: calc(var(--switch-size) * 0.2 - 2px) !important; /* Скругление углов внутреннего квадрата */
    transform: scale(0) !important; /* Начальное состояние (невидимый) */
    transition: transform 0.3s ease, opacity 0.3s ease !important; /* Добавляем анимацию прозрачности */
    opacity: 0 !important; /* Полностью прозрачный в неактивном состоянии */
    border: none !important; /* Отменяем border из участка №1 */
    border-width: 0 !important; /* Отменяем border-width из участка №1 */
    height: auto !important; /* Отменяем height из участка №1 */
    width: auto !important; /* Отменяем width из участка №1 */
    -webkit-transform: none !important; /* Отменяем rotate(45deg) из участка №1 */
    transform: none !important;
}

/* Активное состояние: показываем внутренний квадрат */
.t-checkbox__control .t-checkbox:checked ~ .t-checkbox__indicator::after {
    transform: scale(1) !important; /* Показываем внутренний квадрат */
    opacity: 1 !important; /* Полностью видимый в активном состоянии */
}