Pseudo-element before on checkbox

[Benjdeul]

• Version used: 1.0.0
• Browser Name and version: Chrome
• Operating System and version (desktop or mobile): Desktop W10
• Link to your project (if appropriate): not accessible

Hi,

I have an issue with the checkboxes when they have the class "filled-in". I can't use the pseudo-element before on them when they are unchecked. I want to make a custom indeterminate style because i can't use the materialize one with checkboxes that have the class "filled-in".
My HTML :

<label>
    <input id="indeterminate-f" type="checkbox" class="filled-in" />
    <span></span>
</label>
<script type="text/javascript">
    jQuery("#indeterminate-f").prop("indeterminate", true);
</script>

My CSS :
input[type="checkbox"].filled-in+span::before { content: "-"; }

But the pseudo-element ::before does not appear in the HTML in the devtools

I want to know if it's a known isssue, or normal or i do it wrong.

Thanks