Javafx checkbox styleclass changes box disappear

Checkbox will disappear if change style class only. I was changing my style class when I clicked checkbox. But only the letters of checkbox changed and the box disappeared. The Scene builder I'm using doesn't look like that, but it's like this when you import it into java project.

here my settingsUiController code.

@FXML
private Pane settings_bg;

@FXML
private CheckBox settings_darkThemeCheckBox;

public void changeDarkTheme(boolean darkTheme) {
    if(darkTheme == true) {
        //settings ui
        settings_bg.getStyleClass().clear();
        settings_bg.getStyleClass().add("dark_bg");

        settings_darkThemeCheckBox.getStyleClass().clear();
        settings_darkThemeCheckBox.getStyleClass().add("dark_checkBox");
    }
}

and here my css code.

.light_bg {
    -fx-background-color: #FFFFFF;
}

.light_checkBox {
    -fx-text-fill: #000000;
}

.light_checkBox .box {
    -fx-background-radius: 0;
    -fx-background-color: #C8C8C8;
}

.light_checkBox .box:hover {
    -fx-background-color: #B4B4B4;
}

.light_checkBox .box:pressed {
    -fx-background-color: #A0A0A0;
}

.dark_bg {
    -fx-background-color: #353535;
}

.dark_checkBox {
    -fx-text-fill: #FFFFFF;
}

.dark_checkBox .box {
    -fx-background-radius: 0;
    -fx-background-color: #252525;
}

.dark_checkBox .box:hover {
    -fx-background-color: #202020;
}

.dark_checkBox .box:pressed {
    -fx-background-color: #151515;
}

my fxml code

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.control.CheckBox?>
<?import javafx.scene.layout.Pane?>

<Pane fx:id="settings_bg" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" 
minWidth="-Infinity" prefHeight="400.0" prefWidth="427.0" styleClass="light_bg" 
stylesheets="@mainStyle.css" xmlns="http://javafx.com/javafx/8.0.171" 
xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.kerenic.javafxtest.settingsUiController">
   <children>
      <CheckBox fx:id="settings_darkThemeCheckBox" layoutX="168.0" layoutY="192.0" 
      mnemonicParsing="false" onAction="#checkBoxes" styleClass="light_checkBox" 
      stylesheets="@mainStyle.css" text="Dark Theme" />
   </children>
</Pane>

before image

after image