.container{
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  & .title_con{
    color: var(--header);
    font-size: 1rem;
    display: flex;
    gap: 0.5rem;
    & .icon{
      width: 1.4rem;
      height: auto;
    }
  }
  & .sub_title_con{
    color: var(--text);
    font-size: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    & .icon{
      width: 1.4rem;
      height: auto;
    }
  }
  & .tips{
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6ddf39;
  }
}
.cash_main_con{
  width: 100%;
}
.cash_main{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 0.8rem;
  gap: 0.5rem;
  & .have_cash{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    & .cash_img{
      width: 4rem;
      height: auto;
    }
    & .cash_text{
      font-size: 2.2rem;
      font-family: "Roboto";
      color: var(--header);
    }
  }
  & .progress{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
    width: 100%;
    font-size: 1rem;
    font-weight: 600;
    color: var(--header);
    gap: 0.25rem;
    & .bar{
      width: 100%;
      height: 0.6rem;
      background: #6ddf39;
      border-radius: 1rem;
      position: relative;
      & .dot{
        display: flex;
        flex-direction: row;
        justify-content: flex-end;
        align-items: center;
        height: 100%;
        & .custor{
          background: #fff;
          border-radius: 50%;
          width: 100%;
          max-width: 0.6rem;
          aspect-ratio:1;
        }
      }
    }
  }
  & .need_cash{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    //font-size: 1rem;
    color: var(--header);
    & .need_txt{
      color: #6ddf39;
      font-family: "SWISSC-BT";
    }
  }
  & .btn_invite{
    background: rgb(109, 223, 57);
    color: rgb(255, 255, 255);
    padding: 0.6rem 2rem;
    width: 90%;
    border-radius: var(--border-radius);
    font-size: 1rem;
  }
}
.record_con{
  width: 100%;
}
.record{
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  position: relative;
  height: 8rem;
  & .swiper_list{
    //display: flex;
    //flex-direction: column;
    //gap: 1rem;
    width: 100%;
    & .swiper_item{
      display: flex;
      align-items: center;
      justify-content: space-between;
      color: var(--text);
      //font-size: 1rem;
      font-weight: 500;
      & .name{
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 8rem;
      }
      & .coins_con{
        display: flex;
        align-items: center;
        color: #6ddf39;
        gap: 0.5rem;
        & .unit{
          display: flex;
          align-items: center;
          justify-content: center;
          background-color: #6ddf39;
          width: 1.5rem;
          height: 1.5rem;
          border-radius: 50%;
          font-family: "Roboto";
          color: var(--header);
        }
      }
    }
  }
}
