Own Button-Card and questions

Configuration
1

Moin, I need a little help. I create a little button to see if my garage door is open or not. For this I need a red flashing button.
I have build one buttom-card with this code:

Code:

type: custom:button-card
entity: switch.sonoff_mini_garage_status
icon: mdi:home
color: auto
color_type: card
name: Garage
show_state: false
state:
  - value: 'off'
    name: GARAGE OFFEN
    color: red
    icon: mdi:alert
    styles:
      card:
        - animation: blink 2s ease infinite
  - value: 'on'
    name: GESCHLOSSEN
    color: rgb(30, 32, 33)
    icon: mdi:garage
tap_action:
  action: none
double_tap_action:
  action: call-service
  service: switch.turn_on
  target:
    entity_id: switch.sonoff_mini_garage_auf_zu
hold_action:
  action: none
styles:
  card:
    - height: 120px
    - font-size: 15px
    - font-weight: bold
    - color: |
        [[[
          if (entity.state == 'off') return 'blue';

It is working nice. But I use one tablet with dark mode and one with without.
And this is my problem. The button is cool on the dark mode tablet.
But it is bad at the other one. Is someone here who knows what I have to change that the button is working like all other “normal” buttons?
Only if the status is “off” I need the button red and flashing :slight_smile:

2

Here is one working with a small modification: it’s pulsing when open, but after 22:00 the color changes to red (using an input boolean):

type: custom:button-card
size: 30px
styles:
  card:
    - height: 70px
    - background: transparent
    - box-shadow: none
    - border: 0px
  icon:
    - color: var(--paper-item-icon-color)
  label:
    - font-size: 85%
label: garázs
show_label: true
show_name: false
entity: binary_sensor.garage_door
tap_action:
  action: call-service
  service: script.garage_open_close
triggers_update:
  - binary_sensor.garage_door
  - input_boolean.garage_alerted
extra_styles: |
  [[[ return `
         @keyframes pulse {
           20% {
             background-color: "#e5e5ea";
           }
           60% {
             background-color: ${variables.color};
           }
         }`
  ]]]
variables:
    color: |
      [[[
        return (states['input_boolean.garage_alerted'].state == "on" ? 'firebrick' : 'var(--paper-item-icon-active-color)');
      ]]]
state:
  - operator: default
    color: transparent
  - value: 'on'
    styles:
      card:
        - animation: pulse 2s infinite
  - value: 'off'
    styles:
      card:
        - background: transparent