///*------------------------------------*\
//    #OBJECTS-RADIO-BUTTON
//\*------------------------------------*/

// Radio group
.radio-group {
    .radio-button {
        margin-bottom: $base-spacing-unit;

        &:last-child {
            margin-bottom: 0;
        }
    }
}





// Checkbox base styles
.radio-button {
    min-width: 24px;
    min-height: 24px;
}

@each $key, $color in $colors {
    .radio-button--#{$key} .radio-button__input:checked + .radio-button__label:before {
        color: $color;
    }
}

    // Checkbox input
    .radio-button__input {
        @include visually-hidden();

        &:not(:checked) + .radio-button__label:before {
            @include mdi-icon('radiobox-blank');

            .radio-button--theme-light & {
                color: $black-2;
            }

            .radio-button--theme-dark & {
                color: $white-2;
            }
        }

        &:checked + .radio-button__label:before {
            @include mdi-icon('radiobox-marked');
            color: $accent;
        }

        &[disabled] {
            & + .radio-button__label {
                cursor: not-allowed;

                &,
                &:before {
                    .radio-button--theme-light & {
                        color: $black-3;
                    }

                    .radio-button--theme-dark & {
                        color: $white-3;
                    }
                }
            }

            & ~ .radio-button__help {
                .radio-button--theme-light & {
                    color: $black-3;
                }

                .radio-button--theme-dark & {
                    color: $white-3;
                }
            }
        }
    }

    // Checkbox label
    .radio-button__label {
        display: block;
        position: relative;
        padding-left: $base-spacing-unit * 4;
        @include typography('subheading-1');
        cursor: pointer;
        @include user-select(none);

        .radio-button--theme-light & {
            color: $black-1;
        }

        .radio-button--theme-dark & {
            color: $white-1;
        }

        .radio-button--standalone & {
            padding-left: 0;
        }

        &:before {
            @include mdi;
            @include position(absolute, 0 null null 0);
            @include font-size(24px);
            line-height: 24px;
        }
    }

    // Checkbox help
    .radio-button__help {
        display: block;
        padding-left: $base-spacing-unit * 4;
        @include typography('body-1');
        text-align: left;

        .radio-button--theme-light & {
            color: $black-2;
        }

        .radio-button--theme-dark & {
            color: $white-2;
        }
    }
