.container {
  position: relative;
  //border: #eeff00 1px solid;
  .list {
    width: 250px;
    //border: #eeff00 1px solid;
    display: flex;
    flex-direction: column;
    gap: 20px;

    .defaultChat{
      padding: 6px 10px 0 20px;
    }
    .separate {
      font-size: 10px;
      color: #8c909a;
      //border: #1c1b1b solid 1px;
      margin-top: 0px;
      margin-bottom: -10px;
    }

    &.show {
      flex: 1;
      display: flex;
      transition: all 1s ease; // 添加过渡效果
      .handle-container {
        display: flex;
      }
    }

    &.hide {
      display: none;
      transition: all 1s ease; // 添加过渡效果
    }
  }



  .handleContainer {
    position: absolute;
    top: 50%;
    right: -16px;
    transform: translateY(-50%);
    width: 16px;
    height: 60px;
    //border: #5d57c9 1px solid;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    background-color: transparent;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;

    .handle {
      display: none;
      justify-content: center;
      align-items: center;
      text-align: center;
      //border: #ff006a 1px solid;
      width: 20px;
      height: 20px;
    }
  }

  &:hover {
    .handleContainer {
      background-color: #f0f0f0; /* 鼠标悬停时改变背景色 */
      border: #c9c9ce 1px solid;
      border-left: none;

      .handle {
        display: flex;
      }
    }
  }

}

