@use '../abstracts/variables';
@use '../abstracts/mixins';
@use '../abstracts/functions';


@mixin pep-radio-button-size($size) {
    @if $size == 'xl' {
        $size: 2rem;
    }
    @else if $size == 'lg' {
        $size: 1.5rem;
    }
    @else if $size == 'md' {
        $size: 1.25rem;
    }
    @else if $size == 'sm' {
        $size: 1rem;
    }
    @else if $size == 'xs' {
        $size: 0.75rem;
    }

    &.mat-radio-button {
        .mat-radio-container,
        .mat-radio-outer-circle,
        .mat-radio-inner-circle {
            width: $size;
            height: $size;
        }
    }
}

// -----------------------------------------------------
//  Override material style
// -----------------------------------------------------
.pepperi-radio-button, .pep-radio-button {
    @include pep-radio-button-size('lg');
    &.xl {
        @include pep-radio-button-size('xl');
    }
    &.lg {
        @include pep-radio-button-size('lg');
    }
    &.md {
        @include pep-radio-button-size('md');
    }
    &.sm {
        @include pep-radio-button-size('sm');
    }
    &.xs {
        @include pep-radio-button-size('xs');
    }

    &.mat-radio-button {
        .mat-radio-label {
            @include mixins.fix-inline-z-index();
            margin: 0;
            font-weight: variables.$font-weight-normal;
        }

        &.mat-radio-checked {
            .mat-radio-inner-circle {
                transform: scale(0.45);
            }
        }
    }
}

@mixin pep-radio-button-theme() {
    .pepperi-radio-button, .pep-radio-button {
        &.mat-radio-button {
            .mat-radio-inner-circle,
            .mat-radio-outer-circle {
                @include mixins.state-regular-default(true);
            }

            &:hover {
                .mat-radio-inner-circle,
                .mat-radio-outer-circle {
                    @include mixins.state-regular-hover(true);
                }
            }

            &:active {
                .mat-radio-inner-circle,
                .mat-radio-outer-circle {
                    @include mixins.state-regular-active(true);
                }
            }

            // checked
            &.mat-radio-checked {
                .mat-radio-inner-circle {
                    border: unset;
                    background: functions.get-pep-color(color-system-primary, color-flat-l-10);
                }

                .mat-radio-outer-circle {
                    @include mixins.state-regular-active(true);
                    background: functions.get-pep-color(color-system-primary, color-flat-r-30);
                }

                &:hover {
                    .mat-radio-outer-circle {
                        @include mixins.state-regular-hover(true);
                    }

                    .mat-radio-inner-circle {
                        background: functions.get-pep-color(color-text, color-dimmed);
                    }
                }
            }

            // focused
            &.cdk-focused {
                &:hover {
                    .mat-radio-outer-circle {
                        @include mixins.state-regular-hover(true);
                        // @include mixins.focus();
                    }

                    .mat-radio-inner-circle {
                        background: functions.get-pep-color(color-text, color-dimmed);
                    }
                }

                &:active {
                    .mat-radio-outer-circle {
                        @include mixins.state-regular-active(true);
                        // @include mixins.focus();
                    }
                }

                .mat-radio-outer-circle {
                    @include mixins.state-regular-focus(true);
                }
            }

            // disabled
            &.mat-radio-disabled {
                pointer-events: none;

                .mat-radio-inner-circle {
                    background: functions.get-pep-color(color-text, color-disabled);
                }

                .mat-radio-outer-circle {
                    @include mixins.state-regular-disable(true);
                }
            }
        }
    }
}