.tab{
  width: 50%;
  text-align: center;
}
.main{
  flex-grow: 1;
  padding:16px;
}

.row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:8px;
}

.manage{
  color:var(--green);
  font-size:13px;
  cursor:pointer;
}

.balance{
  font-size:14px;
  color:var(--muted);
  margin:12px 0 4px;
}

.balance span{
  float:right;
  color:#fff;
}

.withdrawable{
  color:var(--green);
  float:right;
}

.rules{
  font-size:13px;
  color:var(--muted);
  margin:8px 0 16px;
  line-height:1.5;
}


.amount{
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:14px;
}

.min{
  color:var(--muted);
  font-size:13px;
}


button{
  width:100%;
  margin-top:18px;
  padding:16px;
  border:none;
  border-radius:6px;
  font-size:16px;
  font-weight:600;
  background:#3a3f4b;
  color:#9aa1b3;
  cursor:not-allowed;
}

button.active{
  background:var(--green);
  color:#0f141b;
  cursor:pointer;
}

.transactions{
  display: flex;
  flex-direction: column;
  gap: 15px;

  .transaction{
    display: flex;
    background:var(--card);
    border:1px solid var(--line);
    border-radius:6px;
    color: rgb(255, 255, 255);
    padding:14px;
    display:flex;
    align-items:center;
    gap:10px;
  
  
    .icon{
      height: 40px;
      width: 40px;
      display: flex;
      align-items: center;
      justify-content: center;
      background-color: #e2ffeb;
      border-radius: 50%;
      color: var(--green);
      font-weight: 600;
    }
  
    .trans-body{
      flex-grow: 1;
  
      .date{
        color: var(--muted);
        font-size: 14px;
      }
    }
  
    .trans-end{
      .amount{
        font-weight: 500;
        font-size: 16px;
        margin-bottom: 3px;
      }
      .trans-status{
        background-color: rgba(4, 113, 4, 0.403);
        color: rgb(2, 202, 49);
        padding: 0;
        border-radius: 3px;
        font-size: 13px;
        display: flex;
        align-items: center;
        justify-content: center;

        &.failed{
          background-color: rgba(113, 4, 4, 0.316);
          color: rgb(202, 2, 2);
        }
        &.pending{
          background-color: rgba(113, 88, 4, 0.403);
          color: rgb(202, 152, 2);
        }
      }
    }
  }
}
