CSS Change parent style when check checkbox

I've checked lots of questions and now I'm here.

So, I want to customize my checkbox like that. My target is to change parent class when checkbox is checked. Parent class is .sf-level-0 .

Thats my unsucessful try:

.sf-input-checkbox[type="checkbox"]:checked + li.sf-level-0 {
    background: red;
}

And thats my HTML of the checkbox.

<ul>
    <li class="sf-level-0 sf-item-30 sf-option-active" data-sf-count="2" data-sf-depth="0">
        <input class="sf-input-checkbox" type="checkbox" value="action" name="_sft_category[]">
        <label class="sf-label-checkbox">Action</label>
    </li>
    <li class="sf-level-0 sf-item-31" data-sf-count="2" data-sf-depth="0">
        <input class="sf-input-checkbox" type="checkbox" value="crime" name="_sft_category[]">
        <label class="sf-label-checkbox">Crime</label>
    </li>
    <li class="sf-level-0 sf-item-77 sf-option-active" data-sf-count="1" data-sf-depth="0">
        <input class="sf-input-checkbox" type="checkbox" value="drama" name="_sft_category[]">
        <label class="sf-label-checkbox">Drama</label>
    </li>
    <li class="sf-level-0 sf-item-29" data-sf-count="1" data-sf-depth="0">
        <input class="sf-input-checkbox" type="checkbox" value="thriller" name="_sft_category[]>
        <label class="sf-label-checkbox">Thriller</label>
    </li>
</ul>