Ion-footer + ion-toolbar CSS issues

Ionic Framework
1

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

<ion-header></ion-header>
<ion-content></ion-content>
<ion-footer>
    <ion-toolbar>
    </ion-toolbar>
</ion-footer>

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:

Untitled
Untitled1280×692 56.6 KB

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