Center remaining bootstrap columns

Question

I have a layout which will sometimes had the odd 1, 2 or 3 columns at the end like so:

I'm looking to write something that says if their are any remaining columns that don't complete a row then display in the middle, like so:

I understand this might be tricky as if there are 3 remaining items, it will have to change the column structure perhaps.

The items are brought in dynamically so it wouldn't help to apply the code once tot he layout...

This would also be useful if one of the containers only contained say, 2 items, which id like to display centred rather than left

I can't seem to find a nice way of doing this, I can't see anything on the bootstrap site.

Here's the code I'm playing with - I was hoping Bootstrap would have a class that I can add to the item that does this, but I cant seem to see anything

Is it even possible? Thanks for looking :)

body {
  padding: 50px;
}
.item {
  width: 100%;
  height:50px;
  display:block;
  background-color: dodgerblue;
  margin-bottom:20px;
  color:#fff;
  text-align:center;
  padding-top:12px;
}

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet"/>



<div class="container">
  <div class="row">
    <div class="col-3"><div class="item"></div></div>
    <div class="col-3"><div class="item"></div></div>
    <div class="col-3"><div class="item"></div></div>
    <div class="col-3"><div class="item"></div></div>
    <div class="col-3"><div class="item"></div></div>
    <div class="col-3"><div class="item"></div></div>
    <div class="col-3"><div class="item"></div></div>
    <div class="col-3"><div class="item"></div></div>
    <div class="col-3"><div class="item">CENTER</div></div>
    <div class="col-3"><div class="item">CENTER</div></div>
  </div
</div