@import '~@zgfe/business-lib/es/assets/styles/inner.less';
.user-portrait {
  margin-top: @margin-lg;
  &-loading {
    display: block !important;
    padding: @padding-lg 0 !important;
  }
  &-group {
    margin-bottom: @margin-lg;
  }
  &-empty {
    text-align: center;
    img {
      display: block;
      width: 348px;
      height: 132px;
      margin: 0 auto;
    }
    label {
      font-size: @font-size-lg;
    }
  }
  &-title {
    display: flex;
    align-items: center;
    margin-bottom: @margin-sm;
    color: @heading-color;
    font-weight: 500;
    font-size: @heading-4-size;
    line-height: 28px;
    &::before {
      display: inline-block;
      width: 4px;
      height: 20px;
      margin-right: @margin-xs;
      vertical-align: middle;
      background: @primary-color;
      border-radius: 10px;
      content: '';
    }
  }
  &-events {
    margin-bottom: 32px;
    padding: @padding-lg;
    background: #fff;
    border-radius: @border-radius-normal;
  }
  &-item {
    display: inline-block;
    width: 50%;
    vertical-align: top;
    &:nth-child(n + 4) {
      margin-top: @margin-sm;
    }
    &-title {
      flex: none;
      color: @heading-color;
      font-weight: 500;
      font-size: @heading-5-size;
    }
    &-chart {
      flex: 1;
      padding-top: @padding-md;
    }
  }
  &-inner {
    display: flex;
    flex-direction: row;
    width: 100%;
  }
  &-item-content {
    display: flex;
    flex: 1;
    flex-direction: column;
    height: 380px;
    padding: @padding-lg;
    background: #fff;
    border-radius: @border-radius-normal;
  }
  &-item-empty {
    width: @margin-xs;
  }
  &-split {
    height: @margin-md;
  }
}