.ta-input-radiobutons {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #f3f3f3;
    padding: 2px;
    border-radius: 2px;
    position: relative;
    width: 100%;
    height: 26px;
    max-width: 120px;

    &.disabled {
        background: #fbfbfb;
    }

    &.required {
        background: #e5737333;
    }

    .radio-button-label {
        width: 60px;
        height: 22px;
        cursor: pointer;
        border-radius: 2px;
        background: #f3f3f3;
        font-size: 12px;
        text-align: center;
        font-weight: 700;

        &.checked {
            background-color: #ffffff !important;
            transition: all 0.3 ease-in-out !important;
        }

        &.no-checked {
            &:hover {
                .radio-button-text {
                    color: #424242 !important;
                    transition: all 0.3 ease-in-out !important;
                }
            }
        }

        &.disabled {
            pointer-events: none;

            &.checked {
                .radio-button:checked ~ .radio-button-text {
                    color: #3074d3;
                }
            }

            &.no-checked {
                background: transparent;

                .radio-button-text {
                    color: #dadada;
                }
            }
        }

        &.required {
            background: transparent;
            transition: background 0.2s ease-in-out;

            .radio-button-text {
                color: #ef5350 !important;
            }

            &:hover {
                background: #fff;

                .radio-button-text {
                    color: #ef5350 !important;
                }
            }
        }

        .radio-button {
            appearance: none;
            outline: none;
        }

        .radio-button:checked ~ .radio-button-text {
            color: #3074d3;
            transition: all 0.3 ease-in-out;
        }

        .radio-button-text {
            color: #b7b7b7;
            user-select: none !important;
            position: relative;
            top: 1.5px;
        }
    }
}
