.tab-item {
  --tab-item-gap: 32rpx;
  --tab-item-image-size: 90rpx;
  --tab-item-active: var(--text-color-active);

  display: inline-block;
  width: var(--tab-item-image-size);
  height: 136rpx;
  line-height: 0;
  text-align: center;
  vertical-align: middle;

  &:not(.last) {
    margin-right: var(--tab-item-gap);
  }

  &-image {
    box-sizing: border-box;
    max-width: var(--tab-item-image-size);
    max-height: var(--tab-item-image-size);
    border-radius: 50%;
  }

  &-label {
    max-width: 88rpx;
    margin-top: 15rpx;
    overflow: hidden;
    font-size: 22rpx;
    line-height: 22rpx;
    color: var(--color-gray-0);
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  &.selected &-label {
    color: var(--tab-item-active);
  }
}