@import '~@ucap/ng-ui-material/material';

/// var
/// --ucap-organization-profile-list-item-01-size: 70px

.ucap-group-profile-list-item-01-container {
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
  padding: 0 16px;
  height: 70px;
  align-items: center;
  &.line-top {
    // border-top: 1px solid $gray-rec;
  }
  .user-profile-info {
    display: inline-flex;
    flex-direction: row;
    flex-grow: 2.3;
    // .user-profile-thumb {
    //   @include profile-avatar-default(
    //     0 5px 5px 0,
    //     8,
    //     $green,
    //     18px
    //   ); //오른 아래 공간, 모바일 온라인 아이콘 크기, 모바일 아이콘 색, 모바일 아이콘 bg크기
    //   .presence {
    //     //PC 상태
    //     @include presence-state(8px); //원크기
    //   }
    //   .profile-image {
    //     @include avatar-img(36px, 2px); //아바타 크기, 왼쪽공간
    //   }
    // }
    .user-info {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: flex-start;
      padding-left: 16px;
      .user-n-g {
        display: flex;
        flex-flow: row-reverse nowrap;
        align-items: flex-end;
        height: 22px;
        .user-name {
          @include ellipsis-column(1);
          height: 22px;
          font: {
            size: 16px;
            weight: 600;
          }
          // color: $gray-re21;
          order: 1;
          -ms-flex-order: 1;
        }
        .user-grade {
          @include ellipsis(1);
          align-self: stretch;
          font: {
            size: 13px;
          }
          // color: $gray-re70;
          margin-left: 4px;
          order: 0;
          -ms-flex-order: 0;
        }
      }
      .dept-name {
        @include ellipsis(1);
        font-size: 12px;
        // color: $gray-re6;
        line-height: 16px;
      }
    }
  }
  .intro {
    display: inline-flex;
    flex-flow: row nowrap;
    flex-basis: 35%;
    flex-grow: 0;
    align-items: baseline;
    p {
      font-size: 11px;
      line-height: 1.4;
      @include ellipsis(2);
      height: 30px;
    }
    &:before {
      content: 'chat';
      // @include font-family-ico($font-ico-default, 12, center, $lipstick);
      flex-direction: row;
      align-items: flex-start;
      width: 12px;
      height: 12px;
      line-height: 12px;
      margin-right: 4.8px;
      position: relative;
      top: 2px;
    }
  }
  .btn-partner-set {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 25px;
    border-top: 1px solid rgba(255, 255, 255, 0.8);
    border-bottom: 1px solid rgba(255, 255, 255, 0.8);
    height: 20px;
    margin-top: 20px;
    img {
      vertical-align: top;
    }
  }
  .intro-name {
    display: inline-flex;
    flex-flow: row nowrap;
    flex-basis: 35%;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    span {
      display: inline-block;
      text-align: center;
      width: 100%;
      height: 20px;
      line-height: 20px;
      // color: $gray-re70;
      font-size: 11px;
      padding: 0 10px;
      border-radius: 30px;
      // border: solid 1px $warm-pink;
      background-color: #ffffff;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
  }
}
