Ion-footer + ion-toolbar CSS issues

I am seeing that when I use the following structure in a template:


That I am seeing a weird layout bug in iOS, where it adds an unwanted padding to the bottom of the <ion-footer>. Upon inspection to the CSS through Safari and the emulator, this is what I am seeing:

ion-footer ion-toolbar:last-of-type {
    padding-bottom: var(--ion-safe-area-bottom, 0);

Which creates this outcome:

The footer is the section with the Single Restriction and Multiple Restrictions icons that has the extra padding at the bottom of it.