Add a clickable calendar icon in the SfCalendar header without using pseudo-elements

I'm using Syncfusion Blazor SfCalendar in my project:

<SfCalendar TValue="DateTime?"            ID="add-appointment-date-picker"            Value="selectedDate"            Min="@DateTime.Today"            CssClass="appointment-input-box mt-2"            DayHeaderFormat="DayHeaderFormats.Abbreviated"            ValueChanged="@(async (args) => await DateSelected(args))" />

It renders HTML like this:

<div id="add-appointment-date-picker" tabindex="0"><div class="e-header e-month"><div class="e-day e-title" tabindex="0">August 2025</div><div class="e-icon-container"><button class="e-prev e-disabled"></button><button class="e-next"></button></div></div><div class="e-content e-month"></div><div class="e-footer-container"><button class="e-btn e-today">Today</button></div></div>

I want to add a calendar icon before the previous/next month buttons and attach a Blazor click event to it.

Currently, I’ve tried using CSS pseudo-elements:

#add-appointment-date-picker .e-header .e-icon-container::before {    content: "\f073"; /* Font Awesome calendar icon */    font-family: "Font Awesome 6 Free";    font-weight: 900;    font-size: 16px;    color: #405A97;    cursor: pointer;    margin-right: 8px;    display: inline-block;}

This works visually, but pseudo-elements cannot have Blazor click events, so I cannot handle the icon click in my component.

Is there a Blazor-native way to add a clickable calendar icon inside SfCalendar header, without resorting to JavaScript or pseudo-elements? Ideally, I’d like it to appear before the navigation buttons and trigger a Blazor method when clicked.

Seems like SfCalendar doesn't have any Templates to modify the Header template.