title: JavaFX - Set different hover colors on toggle button based on toggle state
body: <p>I have a toggle button in my program that starts/stops a script. I would like for this button to be green and say "START" when the button is not selected, and red and say "STOP" when it is selected. More importantly, I would like the unselected hover color to be a slightly darker version of the original green, and the selected hover color to be a slightly darker version of the red color. My current CSS for this button looks like this:</p>
  
  <pre><code>#startStopButton {
      -fx-border-color:#d4d4d4;
      -fx-background-color:#85eca5;
      -fx-background-image: url("startButton.png");
      -fx-background-size: 50px;
      -fx-background-repeat: no-repeat;  
      -fx-background-position: 80% 50%;
      -fx-alignment: CENTER_LEFT; 
      -fx-effect: dropshadow(three-pass-box, #e7e7e7, 15, 0, 0, 0);
  }
  
  #startStopButton:hover {
      -fx-background-color:#80dc9c;
  }
  
  
  #startStopButton:selected{
      -fx-background-color: #ff6060;
      -fx-text:"STOP";
  }
  #startStopButton:selected:focused{
      -fx-background-color: #ff6060;
      -fx-text:"STOP";
  }
  </code></pre>
  
  <p>Currently, this will work fine, except for when the button turns red. In this case, there is no hover effect. Within my FXML controller, there is a function that is activated every time this button is clicked:</p>
  
  <pre><code>private void startStopClick()
  {
      if(startStopButton.isSelected())
      {
      startStopButton.setText("      STOP");
     // startStopButton.setStyle()
      }
      else {
          startStopButton.setText("     START");
      }
  }
  </code></pre>
  
  <p>Is there any way to 1) set the button text within CSS so that I can leave that out of my controller?
  2) Get the current toggle button state in CSS, so that I can have multiple hover effects. For example, something like this:</p>
  
  <pre><code>#startStopButton:unselected{
      -fx-background-color: #ff6060;
      -fx-text:"STOP";
  }
  </code></pre>
  
  <p>If there is no way to do this in CSS, can I set the hover styles in the Java code in the FXML controller?</p>