смена фона у label при отмечании соответствующего чекбокса

.container{
  width:500px;
  height:500px;
  
  margin:0 auto;
  
  outline:1px solid #aaa;
  
  display:flex;
}

.label-container{
  display:flex;
  flex-direction:column;
  width:100px;
}
.label-container label{
  font-size:3em;
  font-weight:bold;
  text-align:center;
  background:black;
  color:white;
  line-height:3.47;
   transition: background-color 0.2s;
  border-bottom:1px solid red;
}
/*отмечаю чекбокс и label меняет цвет, фон и рамку снизу */
.img-container #btn-1:checked ~ .label-container label[for="btn-1"],
.img-container #btn-2:checked ~ .label-container label[for="btn-2"],
.img-container #btn-3:checked ~ .label-container label[for="btn-3"]{
  background-color:red;
  color:black;
  border-color:black;
}

.img-container{
  
}
.img-container input{
  width:30px;
  height:30px;
  display:inline-block;
}

<div class="container">
  <div class="label-container">
    <label for="btn-1">1</label>
    <label for="btn-2">2</label>
    <label for="btn-3">3</label>
  </div>
  <div class="img-container">
    <input type="radio" id="btn-1" name="toggle" checked>
    <input type="radio" id="btn-2" name="toggle" >
    <input type="radio" id="btn-3" name="toggle" >
  </div>
</div>