Change font color

[templeowls21]

I'm trying to change the font color and background color of a bubble card based on the entity's state. If the light is on, I want the background to be white and font to be black. I've figured out the background based on state but not the font. Any suggestions? Here's what I have so far:

    type: custom:bubble-card
    card_type: button
    entity: light.kids_bedroom_lamp_left_switch
    name: Kids Lamp (L)
    styles: |
      .bubble-button-background {
        opacity: 1 !important;
        background-color: ${state === 'on' ? 'white' : 'var(--card-background-color)'} !important;
      }

[Clooos]

Hi! This should works:

    type: custom:bubble-card
    card_type: button
    entity: light.kids_bedroom_lamp_left_switch
    name: Kids Lamp (L)
    styles: |
      .bubble-button-background {
        opacity: 1 !important;
        background-color: ${state === 'on' ? 'white' : 'var(--card-background-color)'} !important;
      }

      * {
        color: ${state === 'on' ? 'black' : 'white'} !important;
      }

* targets all elements, that can be useful when you don't know what element to target.