@avatar-prefix-cls: ~"@{ant-prefix}-avatar";
@import "../../core/styles/themes/default";
@import "../../core/styles/mixins/index";
.@{avatar-prefix-cls} {
    .reset-component;
    display: inline-block;
    text-align: center;
    background: @avatar-bg;
    color: @avatar-color;
    white-space: nowrap;
    position: relative;
    overflow: hidden;
    vertical-align: middle;
    &-image {
        background: transparent;
    }
    .avatar-size(@avatar-size-base, @avatar-font-size-base);
    &-lg {
        .avatar-size(@avatar-size-lg, @avatar-font-size-lg);
    }
    &-sm {
        .avatar-size(@avatar-size-sm, @avatar-font-size-sm);
    }
    &-square {
        border-radius: @avatar-border-radius;
    }
    & > img {
        width: 100%;
        height: 100%;
        display: block;
    }
    &-string {
        position: absolute;
        left: 50%;
        -webkit-transform-origin: 0 center;
        -ms-transform-origin: 0 center;
        transform-origin: 0 center;
    }
}

.avatar-size(@size, @font-size) {
    width: @size;
    height: @size;
    line-height: @size;
    border-radius: 50%;
    & > * {
        line-height: @size;
    }
    &.@{avatar-prefix-cls}-icon {
        font-size: @font-size;
    }
}
