.benefit-bar-chart {
  margin-bottom: 24px;
  .chart-title {
    font-size: 20px;
    font-weight: 600;
    span {
      color: var(--theme-primary);
    }
  }
  // .ant-tooltip-inner{
  //   min-width: 30px;
  //   min-height: 32px;
  //   padding: 6px 8px;
  //   color: #fff;
  //   text-align: left;
  //   text-decoration: none;
  //   word-wrap: break-word;
  //   background-color: rgba(0,0,0,.75);
  //   border-radius: 2px;
  //   -webkit-box-shadow: 0 3px 6px -4px rgb(0 0 0 / 12%), 0 6px 16px 0 rgb(0 0 0 / 8%), 0 9px 28px 8px rgb(0 0 0 / 5%);
  //   box-shadow: 0 3px 6px -4px rgb(0 0 0 / 12%), 0 6px 16px 0 rgb(0 0 0 / 8%), 0 9px 28px 8px rgb(0 0 0 / 5%);
  // }
  .label-row {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 0 24px;

    .chart-label {
      padding: 0 14px;
      margin-right: 28px;
      position: relative;

      &::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 4px;
        height: 100%;
        border-radius: 2px;
        background: var(--theme-primary);
      }
      .label-title {
        color: #ccc;
        font-size: 14px;
        line-height: 18px;
      }
      .label-content {
        font-size: 16px;
        line-height: 22px;
      }
    }

    .sum {
      &::before {
        background: var(--theme-primary);
        opacity: 0.3;
      }
    }
  }

  .progress-container {
    margin: 10px 24px;
    height: 40px;
    position: relative;

    & > div:nth-child(1) {
      opacity: 0.3;
    }
    & > div:nth-child(2) {
      position: absolute;
      top: 0;
      left: 0;
      transition: width 0.4s;
    }

    div {
      border-radius: 4px;
      background: var(--theme-primary);
      height: 100%;
      // width: 30%;
    }
  }
}