@charset "UTF-8";

@import "../core/index-noreset.scss";

@import "scss/mixin";
@import "scss/variable";

/* put your code here */

#{$avatar-prefix} {
    position: relative;
    display: inline-block;
    overflow: hidden;
    color: $avatar-color;
    white-space: nowrap;
    text-align: center;
    vertical-align: middle;
    background: $avatar-default-bg;
    border: $avatar-size-border-width solid $avatar-border-color;
    box-shadow: $avatar-shadow;

    &-image {
        background: transparent;
    }

    @include avatar-size($avatar-size-medium);

    &-large {
        @include avatar-size($avatar-size-large);
    }

    &-small {
        @include avatar-size($avatar-size-small);
    }

    &-square {
        border-radius: $avatar-border-radius;
    }

    & > img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}