// .layoutContainer {
//   height: 100vh;
//   background: #fff;
//   display: flex;
//   flex-direction: column;
//   overflow-y: auto;

//   // 顶部栏
//   .tabBarHeader {
//     // background: rgba(255, 255, 255, 0.95);135deg, #667eea 0%, #764ba2 100%
//     padding: 0;
//     width: 100%;
//     height: 65px;
//     margin-bottom: -4px;
//     border-bottom: 1px solid rgba(0, 0, 0, 0.06);
//     box-shadow: 0 2px 4px rgba(31, 35, 41, 0.04);
//     background:
//       linear-gradient(120deg, #ffffff 0%, #f6f9ff 55%, #fff 100%);

//     .tabBarRow {
//       padding: 0 24px;
//       height: 100%;
//       display: flex;
//       align-items: center;
//       // position: relative;

//       .tabBarLeft {
//         display: flex;
//         justify-content: flex-start;
//         flex-wrap: nowrap;
//         align-items: center;

//         .leftLogo {
//           width: 40px;
//           height: 40px;
//           margin-right: 11px;
//           margin-top: -8px;
//           border-radius: 8px;
//         }

//         .leftTopText {
//           font-size: 24px;
//           height: 40px;
//           font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
//           font-weight: 600;
//           background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
//           -webkit-background-clip: text;
//           -webkit-text-fill-color: transparent;
//           background-clip: text;
//           letter-spacing: 0.02em;
//         }

//         .collapseButton {
//           color: #8f8f8f;
//           margin-left: 10px;
//           margin-top: -8px;
//           font-size: 20px;
//           transition: none !important;

//           :global {
//             .ant-layout-sider {
//               transition: none !important;
//             }
//           }

//           &:hover {
//             color: #000;
//             // cursor:pointer;
//             cursor: pointer;
//           }
//         }
//       }

//       .tabBarRight {
//         text-align: right;
//         display: flex;
//         justify-content: flex-end;
//         flex-wrap: nowrap;
//         align-items: center;

//         .tabBarRightAvaTor {
//           margin-right: 2px;
//           margin-top: -1px;
//           border: 2px solid rgba(102, 126, 234, 0.2);
//         }

//         .tabBarRightName {
//           margin-right: 0px;
//           font-weight: 500;
//           color: #333;
//         }

//         .tabBarRightBtn {
//           height: 40px;
//           width: 40px;
//           // border-radius: 6px;
//           background: transparent;
//           // background: rgba(102, 126, 234, 0.1);
//           border-color: transparent;
//           // border: 1px solid rgba(102, 126, 234, 0.2);
//           color: #666;
//           font-size: 18px;

//           &:hover {
//             background: transparent;
//             border-color: transparent;
//           }
//         }

//         .userNameContent {
//           width: 33px;
//           height: 33px;
//           background-color: #fff;
//           box-shadow: transparent;
//         }
//       }
//     }
//   }

//   // 内容 
//   .contentMain {
//     flex: 1;
//     display: flex;
//     overflow: hidden;
//     background: rgba(255, 255, 255);

//     .sider {
//       background: rgba(255, 255, 255);
//       overflow-y: auto;
//       overflow-x: hidden;

//       &::-webkit-scrollbar {
//         width: 6px;
//       }

//       &::-webkit-scrollbar-track {
//         background: rgba(255, 255, 255);
//       }

//       &::-webkit-scrollbar-thumb {
//         background: rgba(255, 255, 255);

//         &:hover {
//           background: rgba(255, 255, 255);
//         }
//       }

//       .sideMenu {
//         border-right: none;
//         background-color: transparent;
//         padding: 16px 0;

//         :global(.ant-menu-submenu) {
//           margin: 4px 12px;
//           border-radius: 8px;
//           overflow: hidden;

//           .ant-menu-submenu-title {
//             height: 48px;
//             line-height: 48px;
//             border-radius: 8px;
//             margin: 0;
//             font-weight: 500;
//             color: #333;
//             transition: all 0.3s ease;

//             &:hover {
//               background: rgba(255, 255, 255);
//               color: #667eea;
//             }

//             .ant-menu-submenu-arrow {
//               color: #667eea;
//             }
//           }

//           &.ant-menu-submenu-open>.ant-menu-submenu-title {
//             background: rgba(255, 255, 255);
//             color: #667eea;
//           }
//         }

//         :global(.ant-menu-item) {
//           margin: 2px 12px;
//           border-radius: 6px;
//           height: 40px;
//           line-height: 40px;
//           padding-left: 24px !important;
//           font-size: 14px;
//           transition: all 0.3s ease;

//           &:hover {
//             background: rgba(255, 255, 255);
//             color: #667eea;
//           }

//           &.ant-menu-item-selected {
//             background: rgba(255, 255, 255);
//             color: #667eea;
//             font-weight: 500;
//             border-right: 3px solid #667eea;
//           }
//         }

//         :global(.ant-menu-submenu-inline > .ant-menu) {
//           background: rgba(255, 255, 255, 0.5);
//           border-radius: 8px;
//           margin: 8px 0;
//         }
//       }

//       // 自定义菜单样式
//       .customMenu {
//         padding: 8px 0 16px 0;
//         margin: 10px 0px 0px 9px;
//         position: relative;
//         border: 1px solid rgba(0, 0, 0, 0.06);
//         border-radius: 8px;
//         background:
//           linear-gradient(#ffffff, #ffffff) padding-box,
//           linear-gradient(135deg, rgba(102, 126, 234, 0.25), rgba(118, 75, 162, 0.25)) border-box;
//         box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
//         backdrop-filter: blur(2px);

//         &:before {
//           content: '';
//           position: absolute;
//           left: 0;
//           top: 6px;
//           bottom: 6px;
//           width: 3px;
//           border-radius: 2px;
//           // background: linear-gradient(180deg, #667eea, #764ba2);
//         }

//         .menuGroup {
//           margin-bottom: 16px;

//           .menuGroupTitle {
//             display: flex;
//             align-items: center;
//             justify-content: space-between;
//             padding: 12px 16px;
//             font-weight: 500;
//             color: #030303;
//             cursor: pointer;
//             transition: background-color 0.2s ease;

//             &:hover {
//               background-color: #fafafa;
//             }

//             .menuGroupLabel {
//               flex: 1;
//               font-size: 16px;
//               text-align: center;

//               &:hover {
//                 background-color: #fafafa;
//               }
//             }

//             .menuGroupArrow {
//               font-size: 12px;
//               color: #999;
//               transition: transform 0.3s ease;
//             }
//           }

//           .menuGroupItems {

//             .menuItem {
//               display: flex;
//               align-items: center;
//               text-align: center;
//               padding: 8px 16px 8px 16px;
//               margin: 2px 12px;
//               border-radius: 6px;
//               height: 40px;
//               line-height: 24px;
//               font-size: 13px;
//               color: #030303;
//               font-weight: 500;
//               cursor: pointer;
//               transition: all 0.3s ease;

//               &:hover {
//                 background-color: #fafafa;
//                 color: #030303;
//               }

//               &.active {
//                 background-color: #fafafa;
//                 color: #030303;
//                 font-weight: 500;
//               }
//             }

//             .assistantMenuItem {
//               display: flex;
//               align-items: center;
//               justify-content: space-between;
//               padding: 8px 16px 8px 16px;
//               margin: 2px 12px;
//               border-radius: 6px;
//               height: 40px;
//               line-height: 24px;
//               font-size: 14px;
//               color: #333;
//               cursor: pointer;
//               transition: all 0.3s ease;

//               &:hover {
//                 background: rgba(102, 126, 234, 0.08);
//                 color: #667eea;
//               }

//               &.active {
//                 background: linear-gradient(135deg, rgba(102, 126, 234, 0.15) 0%, rgba(118, 75, 162, 0.15) 100%);
//                 color: #667eea;
//                 font-weight: 500;
//                 border-right: 3px solid #667eea;
//                 // box-shadow: 0 2px 8px rgba(102, 126, 234, 0.2);
//               }

//               .assistantArrow {
//                 font-size: 12px;
//                 color: #999;
//                 transition: transform 0.3s ease;

//                 &.expanded {
//                   transform: rotate(180deg);
//                 }
//               }
//             }

//             // 页面菜单项样式
//             .pageMenuItem {
//               display: flex;
//               align-items: center;
//               position: relative;
//               justify-content: center;
//               padding: 10px 14px;
//               cursor: pointer;
//               transition: all 0.2s ease;
//               border-radius: 6px;
//               margin: 4px 8px;
//               font-size: 12px;


//               &:hover {
//                 background: #f5f5f5;
//               }

//               &.active {
//                 background: #f5f5f5;
//               }

//               span {
//                 flex: 1;
//                 text-align: center;
//               }

//               .pageArrow {
//                 margin-left: auto;
//                 font-size: 12px;
//                 color: #999;
//                 transition: transform 0.3s ease;

//                 &.expanded {
//                   transform: rotate(180deg);
//                 }
//               }
//             }
//           }
//         }
//       }

//       // 智能助理展开内容样式
//       .assistantExpandedContent {
//         margin: 0 12px 16px 16px;
//         background: rgba(255, 255, 255, 0.8);
//         border-radius: 8px;
//         padding: 12px;

//         .assistantHeader {
//           margin-bottom: 8px;

//         }

//         // .conversationsList {
//         //   // .conversationsTitle {
//         //   //   display: flex;
//         //   //   align-items: center;
//         //   //       width: 100%;
//         //   //   gap: 8px;
//         //   //   font-size: 12px;
//         //   //   font-weight: 500;
//         //   //   // color: #666;
//         //   //   color: pink;
//         //   //   margin-bottom: 8px;
//         //   //   padding: 0 4px;

//         //   //   :global {
//         //   //     .ant-btn-primary {
//         //   //       background: #666 !important;
//         //   //     }
//         //   //   }

//         //   //   .anticon {
//         //   //     color: #999;
//         //   //     font-size: 14px;
//         //   //   }
//         //   // }

//         //   .conversationsContainer {
//         //     max-height: 200px;
//         //     overflow-y: auto;
//         //     padding-right: 4px;

//         //     // 自定义滚动条样式
//         //     &::-webkit-scrollbar {
//         //       width: 4px;
//         //     }

//         //     &::-webkit-scrollbar-track {
//         //       background: #f1f1f1;
//         //       border-radius: 2px;
//         //     }

//         //     &::-webkit-scrollbar-thumb {
//         //       background: #c1c1c1;
//         //       border-radius: 2px;
//         //     }

//         //     &::-webkit-scrollbar-thumb:hover {
//         //       background: #a8a8a8;
//         //     }

//         //     .conversationItem {
//         //       display: flex;
//         //       align-items: center;
//         //       justify-content: space-between;
//         //       padding: 8px;
//         //       margin-bottom: 6px;
//         //       border-radius: 6px;
//         //       cursor: pointer;
//         //       transition: all 0.2s ease;
//         //       border: 1px solid transparent;

//         //       &:hover {
//         //         background: #f5f5f5;
//         //         border-color: #e6e6e6;

//         //         .conversationActions {
//         //           opacity: 1;
//         //         }
//         //       }

//         //       &.active {
//         //         background: #e6f7ff;
//         //         border-color: #91d5ff;

//         //         .conversationTitle .titleText {
//         //           color: #1890ff;
//         //           font-weight: 500;
//         //         }
//         //       }

//         //       .conversationContent {
//         //         flex: 1;
//         //         min-width: 0;

//         //         .conversationTitle {
//         //           display: flex;
//         //           align-items: center;
//         //           gap: 6px;
//         //           margin-bottom: 2px;

//         //           .conversationIcon {
//         //             color: #52c41a;
//         //             font-size: 12px;
//         //           }

//         //           .titleText {
//         //             font-size: 13px;
//         //             color: #333;
//         //             overflow: hidden;
//         //             text-overflow: ellipsis;
//         //             white-space: nowrap;
//         //             max-width: 100px;
//         //           }
//         //         }

//         //         .conversationTime {
//         //           font-size: 11px;
//         //           color: #999;
//         //         }
//         //       }

//         //       .conversationActions {
//         //         opacity: 0;
//         //         transition: opacity 0.2s ease;

//         //         .ant-btn {
//         //           padding: 2px;
//         //           height: 20px;
//         //           width: 20px;
//         //           font-size: 12px;

//         //           &:hover {
//         //             background: rgba(0, 0, 0, 0.05);
//         //           }
//         //         }
//         //       }
//         //     }
//         //   }
//         // }
//       }
//     }

//     .contentLayout {
//       flex: 1;
//       background: transparent;
//       overflow: hidden;

//       .content {
//         height: 100%;
//         padding: 8px 12px 8px 12px;
//         background-color: #fff;
//         overflow-y: auto;
//         overflow-x: hidden;

//         &::-webkit-scrollbar {
//           width: 8px;
//         }

//         &::-webkit-scrollbar-track {
//           // background: rgba(255, 255, 255, 0.1);
//           border-radius: 4px;
//         }

//         &::-webkit-scrollbar-thumb {
//           // background: rgba(102, 126, 234, 0.3);
//           border-radius: 4px;

//           &:hover {
//             // background: rgba(102, 126, 234, 0.5);
//           }
//         }
//       }
//     }
//   }
// }


// 用户头像悬浮样式 - 强制覆盖 Ant Design 默认样式
:global(.ant-popover) {
  .ant-popover-title {
    width: 150px !important;
    min-width: 150px !important;
    max-width: 150px !important;
    text-align: center !important;
    text-align-last: center !important;
    text-align: center !important;
  }

  .ant-popover-inner-content {
    color: rgba(0, 0, 0, 0.88) !important;
    justify-content: center !important;
    align-items: center !important;
    display: flex !important;
    flex-direction: column !important;
    padding: 10px !important;
    text-align: center !important;
    text-align-last: center !important;
    text-align: center !important;
  }

  // 确保所有文本内容都居中
  .ant-popover-inner-content p {
    text-align: center !important;
    margin: 0 !important;
    padding: 2px 0 !important;
    width: 100% !important;
    text-align: center;
  }

  // 强制覆盖内容区域宽度和居中
  .ant-popover-content {
    min-width: 150px !important;
    max-width: 150px !important;
    text-align: center !important;
  }

  .ant-popover-inner {
    min-width: 150px !important;
    max-width: 150px !important;
    text-align: center !important;
  }
}

.pageExpandedContent {
  margin: 4px 14px 4px 12px;
  padding: 6px 10px 8px 10px;
  width: 10.5vw;
  background: transparent;
  display: flex;
  border: 1px solid #e5e5e5; // 新增外边框
  border-radius: 6px;

  .newChatBtn {
    // margin-left: auto; 
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 20px;
    width: 20px;
    border-radius: 6px;

  }

  .conversationsList {
    .conversationsTitle {
      display: flex;
      align-items: center;
      gap: 6px;
      width: 46vw;
      font-size: 13px;
      font-weight: 500;
      color: #666;
      margin-bottom: 8px;
      padding: 0 2px;

      :global {
        .ant-btn-primary {
          background: rgba(153, 153, 153, 0.5) !important;
          box-shadow: none !important; // 阴影

          &:hover {
            background: rgba(153, 153, 153, 0.8) !important;
          }
        }
      }

      .anticon {
        color: #999;
        font-size: 12px;
      }
    }

    .conversationsContainer {
      max-height: 200px;
      overflow-y: auto;

      // 自定义滚动条样式
      &::-webkit-scrollbar {
        width: 4px;
      }

      &::-webkit-scrollbar-track {
        background: #f1f1f1;
        border-radius: 2px;
      }

      &::-webkit-scrollbar-thumb {
        background: #c1c1c1;
        border-radius: 2px;
      }

      &::-webkit-scrollbar-thumb:hover {
        background: #a8a8a8;
      }
    }

    .conversationItem {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 8px 10px;
      margin-bottom: 6px;
      width: 10.5vw;
      border-radius: 6px;
      cursor: pointer;
      transition: all 0.2s ease;
      border: 1px solid transparent;

      &:hover {
        background: #f0f0f0;
           width: 9vw;

        .conversationActions {
          opacity: 1;
        }
      }

      &.active {
        background: #e6f7ff;
        border-color: #91d5ff;
         width: 9vw;

        .conversationTitle .titleText {
          color: #1890ff;
          font-weight: 500;
            //  width: 9vw;
        }
      }

      .conversationContent {
        flex: 1;
        min-width: 0;

        .conversationTitle {
          display: flex;
          align-items: center;
          gap: 6px;
          margin-bottom: 2px;

          .conversationIcon {
            color: #1890ff;
            font-size: 12px;
          }

          .titleText {
            font-size: 12px;
            color: #333;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            max-width: 100px;
          }
        }

        .conversationTime {
          font-size: 11px;
          color: #999;
        }
      }

      .conversationActions {
        opacity: 0;
        transition: opacity 0.2s ease;
        display: flex;
        gap: 2px;

        .ant-btn {
          padding: 2px;
          height: 20px;
          width: 20px;
          font-size: 10px;

          &:hover {
            background: rgba(0, 0, 0, 0.05);
          }
        }
      }
    }
  }
}

// 智能助理特殊样式（保持兼容性）
.assistantMenuItem {
  @extend .pageMenuItem;
}

.assistantExpandedContent {
  @extend .pageExpandedContent;
}

.assistantHeader {
  @extend .pageHeader;
}


:global {
  .userLink {
    color: #000;
    text-decoration: none;
    transition: color .2s;

    &:hover {
      color: #1677ff; // 悬停颜色
    }
  }
}