Change appearance of a controlsFX PopOver in JavaFX

I want to customize the look of a control PopOver in JavaFX . I have a button that when pressed, the PopOver appears. Here is a functional example:

package pruebapopover;

import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.TextField;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;
import org.controlsfx.control.PopOver;

public class PruebaPopOver extends Application {

    @Override
    public void start(Stage primaryStage) {
        PopOver popover = new PopOver();     
        TextField campo = new TextField();      
        popover.setContentNode(campo);

        Button btn = new Button();
        btn.setText("Abrir PopOver");
        btn.setOnAction((ActionEvent event) -> {           
            popover.show(btn);

            ((Parent) popover.getSkin().getNode()).getStylesheets()
                .add(getClass().getResource("PopOver.css").toExternalForm());                   
        });         

        StackPane root = new StackPane();
        root.getChildren().add(btn);

        Scene scene = new Scene(root, 300, 250);            
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }

}

And the PopOver.css:

.popover {       
    -fx-background-color: rgba(255,0,0, 0.1);  /* rojo semitransparente */                                     
}
.popover > .content {
        -fx-padding: 10;                        
        -fx-background-color: transparent;                        
}

The result is:

But what I expected is this:

How do I eliminate the white background? Why does it not appear semitransparent? How do I paint the red arrow?