I have a MudBlazorButtonGroup and wish to disable buttons based on some logic. The disabling is working, however I wish to make the icon grayed out when it is disabled. Perhaps I need two icons for each, but I don’t know how to select the grayed out one when disabled is true.

                                <MudButtonGroup>
                                    <MudIconButton id="full" @ref="full" OnClick="@((e) => SetSelection(e, full, builderRow))" Icon="@("<svg width='24' height='24'><image href='/assets/images/Full.png' width='24' height='24'/></svg>")" Disabled="!builderRow.canChooseFull" />
                                        <MudIconButton id="firstHalf" @ref="firstHalf" OnClick="@((e) => SetSelection(e, firstHalf, builderRow))" Icon="@("<svg width='24' height='24'><image href='/assets/images/LeftHalf.png' width='24' height='24'/></svg>")" Disabled="!builderRow.canChooseFirstHalf" />
                                        <MudIconButton id="lastHalf" @ref="lastHalf" OnClick="@((e) => SetSelection(e, lastHalf, builderRow))" Icon="@("<svg width='24' height='24'><image href='/assets/images/RightHalf.png' width='24' height='24'/></svg>")" Disabled="!builderRow.canChooseLastHalf" />
                                        <MudIconButton id="firstQuarter" @ref="firstQuarter" OnClick="@((e) => SetSelection(e, firstQuarter, builderRow))" Icon="@("<svg width='24' height='24'><image href='/assets/images/FirstQuarter.png' width='24' height='24'/></svg>")" Disabled="!builderRow.canChooseFirstQuarter" />
                                        <MudIconButton id="secondQuarter" @ref="secondQuarter" OnClick="@((e) => SetSelection(e, secondQuarter, builderRow))" Icon="@("<svg width='24' height='24'><image href='/assets/images/SecondQuarter.png' width='24' height='24'/></svg>")" Disabled="!builderRow.canChooseSecondQuarter" />
                                        <MudIconButton id="thirdQuarter" @ref="thirdQuarter" OnClick="@((e) => SetSelection(e, thirdQuarter, builderRow))" Icon="@("<svg width='24' height='24'><image href='/assets/images/ThirdQuarter.png' width='24' height='24'/></svg>")" Disabled="!builderRow.canChooseThirdQuarter" />
                                        <MudIconButton id="fourthQuarter" @ref="fourthQuarter" OnClick="@((e) => SetSelection(e, fourthQuarter, builderRow))" Icon="@("<svg width='24' height='24'><image href='/assets/images/FourthQuarter.png' width='24' height='24'/></svg>")" Disabled="!builderRow.canChooseFourthQuarter" />
                                </MudButtonGroup>