html - Trying to change color of custom checkbox label when checked, CSS only

I can change the color of the checkbox, but I cannot seem to get the
color of the text label to change. I want to do this with CSS. Here is my
code.

data-hide="false" data-console="true" data-babel="false">
class="snippet-code">

.container {
 display: block;

            position: relative;
 padding-left: 35px;
 margin-bottom:
            12px;

 cursor: pointer;
 font-size: 22px;

            -webkit-user-select: none;
 -moz-user-select: none;

            -ms-user-select: none;
 user-select:
            none;
}

.container input {
 position:
            absolute;

 opacity: 0;
 cursor:
            pointer;
}

.checkmark {
 position:
            absolute;
 top: 0;
 left: 0;
 height: 25px;

            width: 25px;

 background-color:
            #eee;
}

.container:hover input~.checkmark {

            background-color: #ccc;
}

.container+label
            input:checked~.checkmark {
 background-color: #2196F3;
 color:
            blue;

}

.checkmark:after {
 content:
            "";
 position: absolute;
 display:
            none;
}

.container input:checked~.checkmark:after
            {
 display: block;

}

.container
            .checkmark:after {
 left: 9px;
 top: 5px;
 width:
            5px;
 height: 10px;
 border: solid white;
 border-width: 0
            3px 3px 0;
 -webkit-transform: rotate(45deg);


            -ms-transform: rotate(45deg);
 transform:
            rotate(45deg);
}

class="snippet-code-html lang-html prettyprint-override"> class="container">One
checked="checked">



Two
type="checkbox">
class="checkmark">



Three
type="checkbox">



Four
type="checkbox">




I
tried adding the label selector with the checkbox like mentioned on many other websites,
but it does not work..

I appreciate your help so
much, I had spent many hours on this and I would be so relieved to have a solution.
Thanks in advance!!