#dataInfo{
  font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei",
    "微软雅黑", "Arial", "sans-serif", "Segoe UI Emoji", "Noto Color Emoji", "Apple Color Emoji",
    sans-serif !important;
    container-type: inline-size; /* 启用基于宽度的容器查询 */
    container-name: card; /* 可选：命名容器 */
    width: 100%;
}

/* 2. 媒体查询：当这个 card 容器小于 500px 宽度时 */
@container (max-width: 651px) {
  .incomeTable-item-content-item{
    min-width: 85px;
    text-align: center;
    line-height:20px;
    margin:5px 0px;
  }

  .incomeTable-title-item{
    font-size: 14px;
    color:var(--font4);
    min-width: 85px;
    text-align: center;
  }
}

/* 大于等于 500px 时 */
@container (min-width: 651px) {
  .incomeTable-item-content-item{
    min-width: 115px;
    text-align: center;
    line-height:20px;
    margin:5px 0px;
  }
  .incomeTable-title-item{
    font-size: 14px;
    color:var(--font4);
    min-width: 115px;
    text-align: center;
  }
}

#chartDom{
  height:220px;
}

.incomeTable-item-title {
  font-size: 14px;
  line-height: 25px;
  color:var(--font1-main);
  display: flex;
  align-items: center;
}

.incomeTable-item-content {
  display: flex;
  justify-content: flex-start;
  font-size: 12px;
  line-height: 25px;
}

.incomeTable-item-title.isFirstCol{
  padding: 0px 20px;
}

.incomeTable-item-title .incomeTable-item-selectd{
  width:2px;
  background-color:#007aff;
  margin:0px 10px 0px 0px;
  height:16px;
}



.incomeTable-item-content-item-last{
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.incomeTable-item-content-item-last .icon{
  width:24px;
  height:24px;
}

.incomeTable-content-number{
  font-size: 17px;
  color:var(--font1-main);
}

.incomeTable-content-unit{
  font-size: 13px;
  color:var(--font1-main);
}

.incomeTable-upDown-item{
  font-size: 15px;
  color:var(--data-up1)
}

.incomeTable-title{
  font-size: 14px;
  color:var(--font4);
}

.incomeTable-title-item-box{
  display: flex;
  justify-content: flex-start;
  line-height: 25px;
}

.incomeTable-legend-item-box{
  display: flex;
  align-items: center;
  justify-content: center;
  margin:0px 0px 36px 0px;
}

.incomeTable-legend-item{
  display: flex;
  align-items: center;
}

.incomeTable-tabs-item-box{
  width:fit-content;
  margin:10px 0px 0px 0px;
  color:var(--font1-main);
  display: flex;
  background-color: rgba(var(--remark-btn-rgb),0.1);
  justify-content: space-around;
  padding:4px;
  border-radius: 50px;
}
.incomeTable-tabs-item{
  padding:4px 12px;
  text-align: center;
}

.incomeTable-tabs-actived{
  background-color: var(--po-float);
  color:var(--font-hl);
  border-radius: 50px;
}
.incomeTable-tabs2-item-box{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin:0px 0px 20px 0px;
}


.incomeTable-tabs2-item{
  background-color: rgba(var(--remark-btn-rgb),0.1);
  color: var(--remark-btn);
  padding: 4px 12px;
  border-radius: 50px;
  margin:0px 10px 0px 0px;
}

.incomeTable-tabs2-actived{
  border:1px solid var(--font-hl);
  color: var(--font-hl);
  background: var(--po-float);
}

#income-detail-container {
  width: 100%;
  padding:10px;
  display: inline;
}

.income-detail-row {
  display: flex;
  border-bottom: 1px solid #eee;
  padding: 8px 0;
}

.income-detail-header > .income-detail-col{
  color: var(--font4);
  font-size: 14px !important;
}
.incomeTable-sub-title{
  color: var(--font4);
  font-size: 14px !important;
  padding: 0px 10px;
}

.income-detail-col {
  flex: 1;
  text-align: right;
  padding:0px 10px;
  font-size: 17px;
  color:var(--font1-main)
}

.income-detail-col:first-child{
  text-align: left;
}

.green {
  color: var(--data-down1);
}

.red {
  color: var(--data-up1);
}