JavaFX CSSでフラットツールバーみたいなマウスポインターが置いていない状態では平面的なデザインを再現するには？

Question

###前提・実現したいこと
JavaFX CSSでフラットツールバーみたいなマウスポインターが置いていない状態では平面的なデザインを再現するには？

###発生している問題・エラーメッセージ

JavaFX CSSでポインターをWindowsのツールバーのようなボタンの上に置くとそのボタンだけが立体表示される
フラットツールバーを作りたいのですが、マウスポインターを置くと立体的な表示するところまではできました。↓

.button:hover {
    -fx-effect: dropshadow( three-pass-box , rgba(0,0,0,0.6) , 5, 0.0 , 0 , 1 );
}

しかし、ポインターをボタンの上に置いてない状態、いわゆる平面的なデザインがうまくいきません。

-fx-background-color:transparent = rgba(0,0,0,0);

↑の方法でやると、平面的なデザインと言いますか、何もない状態になるのです。
しかし、ボタン上にマウスポインターを置くと立体表示（ボタンが表示）されないのです。

平面的なデザインでマウスポインターを置くと立体的な表示するにはどのように書けばいいのでしょうか？

よろしくお願いします。

###補足情報(言語/FW/ツール等のバージョンなど)

言語：JAVAFX ツール：Scene Builder

Answer 1

JavaFXは選択されているテーマ(java8のデフォルトはmodena)に応じてデフォルトのスタイルシートが適用されるのですがスタイルシートはjfxrt.jarのcom.sun.javafx.scene.control.skin.<テーマ名>のパッケージ内に置かれているようです。このスタイルシートは例えばEclipseのパッケージエクスプローラーなどから参照することができます。また、Scene Builder上でViewメニューのShow CSS Analizerを選ぶと、画面下の方に選択中のノードのスタイルが一覧で表示されるのですが、こちらの一覧にはスタイル毎にデフォルトのスタイルシートの値が有効なのか自分で指定したスタイルシートが有効なのか、またその値は何かなどが確認できます。

これらをみるとわかってくるのですが、デフォルトのボタンの各部分の色や形は主としてこのデフォルトのスタイルシートで設定されていることがわかります。

ボタンの-fx-background-colorも背景やボーダーなどの色がデフォルトスタイルシートで設定されています。しかしこれを自分のcssでtransparentに書き換えてしまうと全ての色が透明になってしまうためボタン名以外は見えなくなります。

そんなわけでシーンビルダーでボタンに設定されているデフォルトのスタイルがどうなっているかを確認しつつ、望みのスタイルになるように調整していくといった方法で進めるとやりやすいように感じました。