Card-mod / Style - if nie działa

Cześć, Jestem Jacek, jestem tu nowy i z góry przepraszam , że po raz kolejny wracam do tematu kolorowania kart w zależności od stanu encji, ale siedzę już nad tym tydzień i mnie czarna rozpacz pochłania :sweat:

Do rzeczy:
Jest sobie klawisz sterujący bramą przesuwną - działa
Jest w tej bramie czujnik otwarcia na osobnej encji - działa

Potrzebuję tylko by klawisz sterujący otwieraniem zmienił kolor w zależności od stanu tej drugiej encji.
Obejrzałem filmik Artura, przeczytałem wszystkie wskazówki, nagooglałem się i:

cards:
  - type: custom:button-card
    entity: switch.gar_gate_gate_remote
    name: Brama przesuwna
    icon: mdi:gate
    card_mod:
      entity:
        - binary_sensor.gar_gate_gate_endstop
      style: |
        ha-card {
          background: {% if is_state('binary_sensor.gar_gate_gate_endstop', 'off' %}
                         green;
                      {% else %}
                         red;
                      {% endif %}
        }

W tym kodzie style działają, gdy wyrzucę ifa i po prostu wstawię green to się ładnie zazieleni, ale if za cholerę nic nie chce działać.
Co robię źle???
… błagam :wink:

type: custom:button-card
entity: input_boolean.switch_garaz
name: Brama przesuwna
icon: mdi:gate
card_mod:
  style: |
    ha-card {
      text-align: center;
    } {% if is_state('input_boolean.switch_garaz', 'on') %}
       ha-card {
       animation: borderPulse 2s ease-out infinite;
    }
      @keyframes borderPulse {
      50% {
      box-shadow: 0 0 20px red;
      }
    }
    {% endif %}

Spróbuj kombinacji z tym:

            style: |
              ha-card {
               --ha-card-background:

albo z tym:

         style: |
          :host {
           --ha-card-background:

Zrób to w ten sposób:

cards:
  - type: custom:button-card
    entity: switch.gar_gate_gate_remote
    name: Brama przesuwna
    icon: mdi:gate
    styles:
      card:
        - background: |
            [[[
              if (states['binary_sensor.gar_gate_gate_endstop'].state == 'off')
                return "green";
              return "red";
            ]]]

Panowie! :smiley: Bestia poskromiona :smiley: Siedziałem do 4 w nocy aż się uporałem , a dzisiaj musiałem odpocząć bo mam dosyć Yamla :wink:

Serdecznie dzięki za dobre chęci i pomoc, niestety wszystkie wasze podpowiedzi się nie sprawdziły, ale

  • Artur, fajne animacje, na pewno to będzie dobry punkt wyjściowy do dalszych upiększań. Dzięki :+1:
  • Maurycy, jak już mój kod zadziałał to działał tak samo z ha-card jak i :host :thinking: ale dzięki :+1:
  • MariuszT, twój też nie zadziałał, ale nie siedziałem już nad tym bo moje zadziałało, tak czy siak, dzięki! :+1:

a działający kod to:

type: custom:button-card
entity: switch.gar_gate_gate_remote
name: Brama przesuwna
icon: mdi:gate
card_mod:
  style: |
    ha-card {
      background-color: {{ 'red' if is_state('binary_sensor.gar_gate_gate_endstop', 'on') else 'green' }};
                            
    }

Nie pytajcie mnie dlaczego tak, jest to zlepek wielu wskazówek z Internetów, trochę dziwnie napisany ten warunek if , ale ważne że działa  :slight_smile: 

Pozdrawiam!!!