@import '../common/style/index.less';

.@{prefix}-avatar-group {
  display: block;

  &--content {
    display: flex;
  }

  &--large {
    .@{prefix}-size-l {
      width: 96rpx;
      height: 96rpx;
      font-weight: 600;
      font-size: 36rpx;
    }
  }

  &--medium {
    .@{prefix}-size-m {
      width: 80rpx;
      height: 80rpx;
      font-weight: 600;
      font-size: 32rpx;
    }
  }

  &--small {
    .@{prefix}-size-s {
      width: 64rpx;
      height: 64rpx;
      font-weight: 600;
      font-size: 24rpx;
    }
  }

  &__collapse--slot {
    float: left;
  }

  &__collapse--slot:not(:empty) + &__collapse--default {
    display: none;
    float: left;
  }

  &__collapse--slot:empty + &__collapse--default {
    display: block;
    float: left;
  }

  .@{prefix}-is-hidden {
    display: none;
  }

  .alt-default {
    background-color: #d4e3fc;
    color: #0052d9;

    &-l {
      font-size: 64rpx;
    }

    &-m {
      font-size: 48rpx;
    }

    &-s {
      font-size: 32rpx;
    }
  }
}