Bootstrap forms - Cannot make the label and input inline - html

Question

I am working on a personal project, and I need to make some changes to my current form but I cannot get it working so far.
I need the label and input to be inline. Here is a screenshot how the form should look like.
And here is my current code:
.personal_details {
max-width: 503px;
float: none;
margin: 0 auto;
padding: 40px;
border-radius: 5px;
}
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet"/>
<div class="personal_details">
<form class="personal_details">
<div class="form-group">
<label for="firstName">First name</label>
<input type="text" class="form-control" id="inputFirstName" />
</div>
<div class="form-group">
<label for="lastName">Last name</label>
<input type="text" class="form-control" id="inputLastName" />
</div>
<div class="form-group">
<label for="email">Email</label>
<input type="text" class="form-control" id="inputEmail" />
</div>
<div class="form-group">
<label for="phone_nummber">Account type</label>
<select class="form-control" name="profile_type">
<option value="Basic" selected>Freelancer</option>
<option value="Company">Employer</option>
</select>
</div>
<button class="btn btn-primary mt-4 px-5" type="submit">EDIT</button>
</form> <!-- Form ends here -->
</div>