JavaFX button hover underline animation like in css

Question

Can you give me tips to create this animation in JavaFX?

animation

Or underline may move from left to right

My current .css file

.button{
    -fx-background-color:  rgba(0,0,0,0.1);
    -fx-shape:  "M 400 200 L 400 250 L 500 250 L 500 200 L 400 200";
}

.button .text {
    -fx-fill: white;
}

.button:hover .text {
    -fx-fill: #FFFF55;
}

.button:hover {
    -fx-background-color:  rgba(0,0,0,0.1);

}