<commit_before>@import 'abstracts/variables';
$m-checkbox--width: 16px;

.m-radio-buttons {
    display: inline;
    user-select: none;
    line-height: 1;
    list-style: none;
    padding-left: 0;

    &:not(.is-disabled) {
        .m-radio-buttons__wrap {
            display: inline-flex;
            align-items: center;
            cursor: pointer;

            &.m--is-right {
                flex-direction: row-reverse;

                .m-radio-buttons__label {
                    padding-right: $m-margin--s;
                }
            }

            &:not(.m--is-right) {
                .m-radio-buttons__label {
                    padding-left: $m-margin--s;
                }
            }

            &:hover {
                .m-radio-buttons__label {
                    color: $m-color--primary;
                }
            }

            &:hover,
            &.m--is-focus {
                .m-radio-buttons__input {
                    border-color: $m-color--primary;
                    background: $m-color--primary-lightest;
                }
            }
        }

        .m-radio-buttons__label {
            flex: 1;
            color: $m-color--text;
        }

        .m-radio-buttons__input {
            border-color: $m-color--black;
            color: $m-color--black;

            &.m--is-checked {
                &::before {
                    visibility: visible;
                    transform: scale(1);
                }
            }

            &::before {
                transition: 0.3s transform ease-out;
                content: '';
                display: block;
                width: 10px;
                height: 10px;
                background: $m-color--primary;
                border-radius: 50%;
                visibility: hidden;
                transform: scale(0);
            }
        }
    }

    &__input {
        transition: 0.3s background ease, 0.3s border-color ease;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: $m-checkbox--width;
        height: $m-checkbox--width;
        background: $m-color--white;
        border-width: 1px;
        border-style: solid;
        border-radius: 50%;
        z-index: 1;
    }

    &__label {
        transition: 0.3s color ease;
    }

    &__hidden {
        @include visuallyHidden;
    }
}<commit_msg>Change scss var in radio buttons component<commit_after>@import 'abstracts/variables';
$m-radio-buttons--width: 16px;

.m-radio-buttons {
    display: inline;
    user-select: none;
    line-height: 1;
    list-style: none;
    padding-left: 0;

    &:not(.is-disabled) {
        .m-radio-buttons__wrap {
            display: inline-flex;
            align-items: center;
            cursor: pointer;

            &.m--is-right {
                flex-direction: row-reverse;

                .m-radio-buttons__label {
                    padding-right: $m-margin--s;
                }
            }

            &:not(.m--is-right) {
                .m-radio-buttons__label {
                    padding-left: $m-margin--s;
                }
            }

            &:hover {
                .m-radio-buttons__label {
                    color: $m-color--primary;
                }
            }

            &:hover,
            &.m--is-focus {
                .m-radio-buttons__input {
                    border-color: $m-color--primary;
                    background: $m-color--primary-lightest;
                }
            }
        }

        .m-radio-buttons__label {
            flex: 1;
            color: $m-color--text;
        }

        .m-radio-buttons__input {
            border-color: $m-color--black;
            color: $m-color--black;

            &.m--is-checked {
                &::before {
                    visibility: visible;
                    transform: scale(1);
                }
            }

            &::before {
                transition: 0.3s transform ease-out;
                content: '';
                display: block;
                width: 10px;
                height: 10px;
                background: $m-color--primary;
                border-radius: 50%;
                visibility: hidden;
                transform: scale(0);
            }
        }
    }

    &__input {
        transition: 0.3s background ease, 0.3s border-color ease;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: $m-radio-buttons--width;
        height: $m-radio-buttons--width;
        background: $m-color--white;
        border-width: 1px;
        border-style: solid;
        border-radius: 50%;
        z-index: 1;
    }

    &__label {
        transition: 0.3s color ease;
    }

    &__hidden {
        @include visuallyHidden;
    }
}
{'fraction_non_alphanumeric': 0.11951118475559237, 'fraction_numerical': 0.010356255178127589, 'mean_word_length': 1.0358347386172007, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '7142718', 'n_tokens_mistral': 1442, 'n_tokens_neox': 1320, 'n_words': 238}