.container {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  //border: 1px solid #ccc;
  gap: 8px;

  .providerItem{
    width: 100%;
    background: #f5f5f5; /* 背景颜色 */
    border-radius: 8px; /* 圆角 */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* 添加阴影 */
    display: flex;
    flex-direction: column;
    //border: 1px solid yellow;

    .providerBox {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      width: 100%;
      padding: 12px;


      //border: 1px solid red;
      .providerLeft {
        display: flex;
        flex-direction: column;

        .modelTypeTag {
          padding: 2px;
          font-size: 8px; /* 假设 4xs 对应的字体大小 */
          font-weight: 500; /* medium 字重 */
          text-transform: uppercase; /* 大写 */
          border: 1px solid #fff;
          border-radius: 2px;
        }
      }

      .providerRight {
        .actionBox{
          width: 112px;
          display: flex;
          flex-direction: column;
          background-color:rgb(255 255 255 / 0.18);
          border-width: 0.5px;
          border-radius: 0.5rem;
          margin-left: 0.25rem;
          margin-bottom: 0.25rem;
          padding: 0.25rem;
          .statusBox{
            display: flex;
            flex-direction: row;
            justify-content: space-between;
            align-items: center;
            color: #676f83;
            padding-top: 0.25rem;
            padding-left: 0.5rem;
            padding-right: 7px;
            font-size: 12px;
            font-weight: 500;
            text-transform: uppercase;
            line-height: 16px;
            margin-bottom: 0.25rem;
          }

        }


      }
    }

    .modelsBox {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      align-items: center;
      font-size: 12px;
      font-weight: 500;
      line-height: 16px;
      padding:4px;
      //border-top: 1px solid #ccc;
      //border: 1px solid green;
      .btnShowModels{
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        white-space: nowrap;
        padding: 2px 8px;
        background-color: #e0e0e0; /* 默认背景 */
        color: #333;
        font-size: 12px;
        width: auto;
        //border: 1px solid red;
        border-radius: 8px;
        cursor: pointer;
        transition: background-color 0.2s ease, color 0.2s ease;
      }
      .btnShowModels:hover {
        background-color: #bebfc1 !important; /* hover 背景色 */
      }
      .btnShowModels.active {
        background-color: white; /* 点击后背景色 */
      }
    }

  }

}

.btnFun {
  border: 1px solid #ccc;
  width: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 20px;
  text-align: center;
  background-color: white;
  font-size: 10px; /* 调整字体大小 */
}

.btnFunActive {
  width: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 20px;
  text-align: center;
  background: none;
  border: none;
  font-size: 10px; /* 调整字体大小 */
}
