Temperature controls styling, hvac_modes and icons

[AndreasMouskos]

Hello I am trying to adjust the styling color of temperature controls, hvac mode icons and icons when you press the hvac mod to be white but I can't figure it out. Any chance you can help? Here is my code and a screenshot:

`type: custom:mushroom-climate-card entity: climate.midea_ac_153931628388094 hvac_modes:

• heat_cool
• heat
• cool
• fan_only
• dry show_temperature_control: true collapsible_controls: false name: Air Conditioner secondary_info: state card_mod: style: | ha-card { --card-primary-color: #ffffff; --card-background-color: rgba(0, 0, 0, 0.3) !important; / Semi-transparent background / --card-primary-color: #ffffff !important; / Default text color / --card-secondary-color: #ffffff !important; / Ensure state text color is white / --card-border-radius: 10px !important; / Rounded corners / --card-box-shadow: none !important; / Remove shadow / --card-secondary-font-color: #ffffff display: flex !important; / Enable flexbox / align-items: center !important; / Vertically center items / justify-content: center !important; / Horizontally center items / padding: 16px !important; / Add padding / } mushroom-shape-icon { {% if is_state(config.entity, 'heat_cool') %} --card-mod-icon: mdi:autorenew; animation: spin 3s ease-in-out infinite alternate; {% elif is_state(config.entity, 'heat') %} --card-mod-icon: mdi:fire; animation: heat 2s infinite; {% elif is_state(config.entity, 'cool') %} --card-mod-icon: mdi:snowflake; animation: cool 6s ease-in-out infinite; {% elif is_state(config.entity, 'dry') %} --card-mod-icon: mdi:water-percent; animation: dry 1.5s linear infinite; {% elif is_state(config.entity, 'fan_only') %} --card-mod-icon: mdi:fan; animation: spin 1s linear infinite; {% else %} --card-mod-icon: mdi:air-conditioner; {% endif %} display: flex; color: white !important; / Ensure icon color is white / } @keyframes cool { 0%, 100% { transform: rotate(25deg); } 25% { transform: rotate(-25deg); } 50% { transform: rotate(50deg); } 75% { transform: rotate(-50deg); } } @keyframes heat { 0%, 100% { --icon-color: rgba(var(--rgb-red), 1); } 10%, 90% { --icon-color: rgba(var(--rgb-red), 0.8); } 20%, 80% { --icon-color: rgba(var(--rgb-red), 0.6); } 30%, 70% { --icon-color: rgba(var(--rgb-red), 0.4); } 40%, 60% { --icon-color: rgba(var(--rgb-red), 0.2); } 50% { --icon-color: rgba(var(--rgb-red), 0); } } @keyframes dry { 0%, 100% { --icon-symbol-size: 21px; } 10%, 90% { --icon-symbol-size: 22px; } 20%, 80% { --icon-symbol-size: 23px; } 30%, 70% { --icon-symbol-size: 24px; } 40%, 60% { --icon-symbol-size: 25px; } 50% { --icon-symbol-size: 26px; } } `

[AndreasMouskos]

Figured out the temp controls and +- icons. Can't figure out how to make the temperature number white. Please help!