/* 设置页面背景色 */
ion-content {
  --background: #f9f9f9; /* 设置内容背景色 */
}
ion-avatar {
    width: 50px; /* 或者你需要的任何尺寸 */
    height: 50px; /* 保持宽高一致，避免变形 */
  }
   
  ion-avatar img {
    width: 100%; /* 让图片填满avatar */
    height: auto; /* 保持图片比例 */
  }
  .header-image {
    width: 100%;
    height: auto; /* 保持图片比例 */
    border-radius: 50%; /* 可选：将图片设置为圆形 */
  }
    /* 设置搜索框的样式 */
    ion-searchbar {
      padding: 10px; /* 内边距 */
      border-radius: 4px; /* 圆角 */
      font-size: 16px; /* 字体大小 */
    }
    /* 设置卡片的样式 */
  ion-card {
    margin: 10px; /* 卡片之间的间距 */
    border-radius: 10px; /* 圆角效果 */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); /* 阴影效果 */
  }
  ion-card-title {
    font-weight:bold;
  }
  ion-card-header {
    --background: #ffffff; /* 使用CSS变量设置背景颜色为白色 */
    /* 或者，如果你不使用CSS变量，可以直接使用background-color属性 */
    position: relative; /* 设置相对定位 */
  }
  ion-toolbar {
    --background: #ffffff; /* 同样使用CSS变量，但通常不是必需的 */
  }
  /* 设置列表项的样式 */
  ion-item {
    margin: 5px 0; /* 列表项之间的间距 */
  }
  ion-button {
    font-size: 15px; /* 增大字体大小 */
    margin-top: 8px; /* 上间距，仅在需要时添加 */
    text-transform: none; /* 按钮文字不变形 */
    height: 35px;
}