.intelligent-assistant {
  // width: 100%;
  // height: 100%;
  // display: flex;
  // align-items: center;
  // background-image: url('https://sieiot-resources.oss-cn-beijing.aliyuncs.com/web/gushen/images/pidb_home_bg.png');

  // background-image: url('./image/pmo_background.png');
  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial,
    sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  // background-color: #e7f0ff;

  width: 100%;
  height: 100%;
  // height: calc(100vh);
  //   @include flex-row(center, center);
  padding: 15px;
}
.fullDrawer {
  padding: 0;
  .container {
    border-radius: 0;
  }
}
.toolBar {
  .el-button--text {
    padding: 5px 0;
  }
  ::v-deep i {
    font-size: 18px;
  }
}
.container {
  box-shadow: 2px 0 10px rgba($color: #000000, $alpha: 0.1);
  border: 1px solid var(--color-text-extra);
  border-radius: 8px;
  width: 100%;
  height: 100%;
  background: #fff;
  padding: 0px;
}
.gpt {
  display: grid;
  grid-template-columns: minmax(290px, 1fr) 4fr;
  // grid-gap: 15px;
  height: 100%;
  width: 100%;
  padding: 0;
  &.only-content-gpt {
    grid-template-columns: 1fr;
  }
}
// 知识库列表
.Knowledge-list {
  display: flex;
  flex-direction: column;
  overflow-y: hidden;
  // overflow-y: scroll;

  .list {
    // overflow-y: scroll;
    .list-item {
      border-radius: 5px;
      margin-bottom: 15px;
      cursor: pointer;
      -webkit-user-select: none;
      -moz-user-select: none;
      user-select: none;
      position: relative;
      content-visibility: auto;
      background-color: #fff;
      ::v-deep .el-card__body {
        padding: 15px;
      }
    }
    // .list-item:hover {
    //   box-shadow: 0px 4px 4px 4px #eeeff8;
    // }
    .select-item {
      // border: 1px solid var(--color-primary);
      color: #3370ff;
      background-color: #f0f7ff;
      border: 1px solid #f0f7ff;
    }
    .item-main {
      display: flex;
      position: relative;
      -webkit-box-align: center;
      align-items: center;
      cursor: pointer;
      // display: flex;
      // align-items: center;
      // .Knowledge-img {
      //   width: 20px;
      //   height: 20px;
      //   padding-right: 5px;
      // }
      // span {
      //   margin-left: 10px;
      // }
      .Knowledge {
        margin-left: 10px;
        word-break: break-word;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
      }
      .icon {
        width: 20px;
        height: 20px;
        display: inline-block;
        flex-shrink: 0;
        color: currentcolor;
        box-sizing: content-box;
        vertical-align: top;
      }
    }
  }
  .footer {
    width: 100%;
    height: 70px;
    text-align: center;
    background-color: #fff;
  }
  .knowledgeNumBox {
    padding-top: 10px;
    // text-align: center;
    // display: flex;
    // align-items: center;
    // display: grid;
    // grid-template-columns: minmax(122px, 1fr) 1fr;
    // grid-gap: 5px;
  }
  .knowledgeNumBox label {
    color: #666;
    padding-right: 10px;
    word-break: break-word;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }
  .knowledgeNum {
    width: 100px;
  }
}
// 对话框
.gpt-chatting {
  height: 100%;
  width: 100%;
  font-size: 14px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow-y: hidden;
  border-left: 1px solid var(--color-text-extra);
  .chatBox {
    // overflow-y: scroll;
    overflow-x: hidden;
    padding-bottom: 20px;
    .receiveMessage {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      margin-left: 10px;
      margin-top: 10px;

      .gptImg {
        height: 38px !important;
        width: 35px !important;
        margin: 0 0 8px 8px;
      }

      .answerDate {
        color: var(--color-text-extra);
        font-size: 10px;
        margin: 4px 0 0 8px;
      }
      .loadingBox {
        width: 50px;
        height: 50px;
        border: 1px solid var(--color-text-extra);
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #f5f6fa;
        border-radius: 6px;
      }
      .loading {
        width: 100%;
        height: 100%;
        overflow: hidden;
        transform: scale(0.5, 0.5);
      }
      .messageArea {
        border: 1px solid var(--color-text-extra);
        border-radius: 8px;
        max-width: 70%;
        margin: 0 5px;
        padding: 5px 10px;
        background-color: #f5f6fa; // var(--color-bg-4);
        color: #333;
        white-space: normal;
        line-height: 2;
        overflow: auto;
      }
    }

    .sendMessage {
      display: flex;
      flex-direction: column;
      align-items: flex-end;
      margin-right: 10px;
      margin-top: 10px;
      .headImgBox {
        height: 35px;
        width: 35px;
        border: 1px solid #dedede;
        border-radius: 50%;
        box-shadow: 50px 50px 100px 10px rgba(0, 0, 0, 0.1);
        margin: 0 8px 8px 0;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .text {
        font-size: 20px;
        font-weight: 800;
        color: #fff;
        border-radius: 50%;
        background: var(--color-primary-light-2);
        &>div {
          margin-bottom: 1px;
        }
      }
      .headImg {
        height: 35px !important;
        width: 35px !important;
        border-radius: 50%;
      }

      .messageArea {
        border: 1px solid var(--color-primary-light-8);
        border-radius: 6px;
        margin: 0 5px;
        max-width: 70%;
        padding: 5px 10px;
        background-color: var(--color-primary-light-9);
        color: #333;
        white-space: pre-wrap;
      }
    }
  }
  .messageSendBox {
    flex: 1;
    padding: 10px;
    // border-radius: 10px;
    border-top: 1px solid var(--color-text-extra);
    // margin-top: 20px;
    // border: 1px solid var(--color-text-extra);
  }

  .messageSendBox textarea {
    height: 100%;
  }
}

.only-content-gpt .gpt-chatting {
  border-left: none;
  .chatBoxEx {
    flex: 1;
    height: 100%;
  }
}

.title {
  line-height: 55px;
  font-size: 1.6vh;
  font-weight: bold;
  margin-left: 20px;
  color: #333;
  &_img {
    width: auto;
    height: 50px;
  }
}
.chatBoxEx {
  height: calc(100% - 180px);
}
.help {
  width: 200px;
}
::v-deep .el-checkbox__inner {
  width: 18px;
  height: 18px;
  //修改选中框中的对勾的大小和位置
  &::after {
    height: 10px;
    left: 9px;
  }
}
::v-deep .el-textarea,
::v-deep .el-textarea__inner {
  height: 100%;
}
::v-deep .el-checkbox__label {
  font-weight: bold;
}
::v-deep .vuepress-markdown-body {
  padding: 0;
  background-color: var(--color-bg-4);
  font-size: 14px;
}

.vuepress-markdown-body:not(.custom) {
  padding: 0;
}

::v-deep .el-textarea__inner {
  border: none;
}

::v-deep .el-button.is-circle {
  border-radius: 50%;
  padding: 8px;
}

::v-deep .el-icon-refresh:before {
  color: #333;
  font-weight: bold;
}

::v-deep .el-icon-s-promotion:before {
  font-weight: bold;
  font-size: 26px;
  color: #2b6fd5;
  position: absolute;
  bottom: 0px;
  right: 20px;
}

::v-deep .el-icon-close:before {
  color: #333;
  // font-weight: 500;
}

::v-deep .el-icon-delete:before {
  color: #333;
  // font-weight: 600;
}

::v-deep .el-icon-video-pause {
  color: #333;
  // font-weight: bold;
}

::v-deep .vmdpreview * {
  margin: 0 !important;
}