Not possible to change icon size with card mod

[Aoshira]

Is there an existing issue for this?

• [X] I have searched the existing issues

Current Behavior

I want to change the icon size in event mode using card mod but it doesn't work. I add

    .event-icon {
    --mdc-icon-size: 25px !important;
    }

to the code but the icons don't change in size. When I use the element inspector and change the size there it works. When I remove the !important from the element view my added code also works. Therefore I assume that's the problem.

Expected behaviour

I expect the icons to change according to my additional code.

Steps To Reproduce

1. Have a card in event view and show the event icons
2. Add the code from above to the card code
3. Adjust the icon size however you want, it doesn't work

Mode

Event (default)

Card Version

10.0.0

Home Assistant Version

2024.5.5

Configuration

type: custom:atomic-calendar-revive
enableModeChange: true
entities:
  - entity: XX
    name: XX
    showMultiDay: true
    icon: mdi:face-man
  - entity: YY
    name: YY
    icon: mdi:airplane
  - entity: ZZ
    name: ZZ
    icon: mdi:cake
maxDaysToShow: 180
maxEventCount: 8
showDeclined: false
showDate: false
showLoader: true
showLocation: true
showMultiDay: false
defaultMode: Event
compactMode: false
cardHeight: 100%
showProgressBar: false
showCurrentEventLine: false
showMonth: false
showDescription: false
showEventIcon: true
showHiddenText: false
showCalendarName: false
showWeekNumber: false
showEventDate: true
showDatePerEvent: false
showTimeRemaining: false
showAllDayHours: true
hoursOnSameLine: false
calShowDescription: false
showLastCalendarWeek: false
disableCalEventLink: false
disableCalLocationLink: false
disableCalLink: false
dimFinishedEvents: true
eventDateFormat: ddd D.MMM
disableEventLink: false
showNoEventsForToday: false
showFullDayProgress: true
showRelativeTime: false
fullDayEventText: ''
titleLength: 22
card_mod:
  style: |
    .event-icon {
    --mdc-icon-size: 25px !important;
    }
    ha-card {
    border-width: 0px !important;
    background: none;
    padding: 3px !important;
    font-size: 19px !important;
    line-height: 150% !important;
    width: 350px
    }
    .event-date-day {
      min-width: 70px;
    }
    .event-left {
      min-width: 70px;
    }
    .event-left.current-day {
      min-width: 70px;
    }

Relevant log output

No response

Code of Conduct

• [X] I agree to follow this project's Code of Conduct

[github-actions[bot]]

Hello @Aoshira, thank you for your interest in our work! If this is a bug report, please provide your configuration and any screenshots that would assist troubleshooting, otherwise we can not help you.