CSS no permiten pseudo-elementos :before
y :after
directamente en elementos de formulario como input
y textarea
.
Solución
Para lograr un efecto similar a :before
en input[type=checkbox]
, puedes usar un elemento label
asociado con el checkbox
y aplicar los estilos :before
al label
en su lugar:
<input type="checkbox" id="myCheckbox">
<label for="myCheckbox">Label Text</label>