.middle-section {
    display: flex;
    justify-content: space-around;
    overflow-x: auto;
    white-space: nowrap;
    margin-top: 0px; /* 添加顶部间距 */
 
    .user-info-row {
      display: flex;
      align-items: center;
    }
  
    .info-col {
      margin-left: 10px; // 设置头像和信息之间的间距
      text-align: right;

    }
    .enlarge-col {
      width: 100px; // 设置宽度为200px（根据需要调整）
      height: 100px; // 设置高度为200px（根据需要调整）
    }

    .ion-avatar {
      border-radius: 50%; // 将头像设置为圆形
    }

    .order-card {   //卡片
      width: 110px;
      height: 80px;
      margin: 5px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
    }
   

    .middle-section {
      ion-card {
        margin-bottom: 10px;
        display: none; /* 默认隐藏所有内容部分 */
      }

      ion-card.active {
        display: block; /* 显示选中的内容部分 */
      }
    }


  }


