[Feature]: Alarm Card - Add additional color style options for arming and pending

[djagerif]

Requirements

• [X] I have updated Mushroom to the latest available version
• [X] I did a search to see if there is a similar issue or if a pull request is open.

Is your feature request related to a problem?

No operational problem.

Describe the solution you'd like

I would be nice to change the icon colors for 'pending' and 'arming' in the same way as the three currently implemented options below.

--mush-rgb-state-alarm-disarmed: var(--rgb-green); --mush-rgb-state-alarm-armed: var(--rgb-red); --mush-rgb-state-alarm-triggered: var(--rgb-yellow);

I would like to suggest the names below.

--mush-rgb-state-alarm-arming: var(--rgb-orange); --mush-rgb-state-alarm-pending: var(--rgb-yellow);

Describe alternatives you've considered

Looking at the code I can use the following undocumented (well, I haven't seen it anywhere) variable but that will probably change all grey colors to EG. orange. For now it seems to work for the time being.

--mush-rgb-grey: var(--rgb-orange);

Using the native Lovelace card has the ability to change the color of all five states.

Additional context

No response

[Juffle74]

Yes please, this is so much needed. Thank you!

[duczz]

Works like this:

card_mod:
  style: |
    mushroom-button:nth-child(1) {
      {% if is_state('alarm_control_panel.eingang', 'armed_away') %}
        --bg-color: red !important;
      {% elif is_state('alarm_control_panel.eingang', 'arming') %}
        --bg-color: orange !important;
      {% else %}
        --bg-color: green !important;
      {% endif %}
      --icon-color: white !important;
    }
    mushroom-shape-icon {
      {% if is_state('alarm_control_panel.eingang', 'armed_away') %}
        --icon-color: white !important;
      --shape-color: red !important;
      {% elif is_state('alarm_control_panel.eingang', 'arming') %}
        --icon-color: white !important;
      --shape-color: orange !important;
      {% else %}
        --icon-color: white !important;
        --shape-color: green !important;
      {% endif %}
    }