bug: Ion footer has no padding if app has ion tab bar hidden

### Prerequisites

- [x] I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/docs/CONTRIBUTING.md#creating-an-issue).
- [x] I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct).
- [x] I have searched for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already report this problem, without success.

### Ionic Framework Version

v8.x

### Current Behavior

```
render() {
const { translucent, collapse } = this;
const mode = getIonMode(this);
const tabs = this.el.closest('ion-tabs');
const tabBar = tabs?.querySelector(':scope > ion-tab-bar');

return (

{mode === 'ios' && translucent &&

}


);
}
```

ion-footer doesn't have the "footer-toolbar-padding" if app contains a tab-bar

### Expected Behavior

As there are some workaround online to hide the tab bar when navigating to child routes I think there should be a check of whether the tab-bar is displayed (by checking if display none is applied).
That way there is no harm to a case where the tab bar is always shown but benefit when a user wants to manually hide it in some pages
Btw there could be serval ways to hide or show the tab bar but that's not the main thing I wanted to show

### Steps to Reproduce

https://stackblitz.com/edit/sb1-wnpdveiy?file=src%2Fpages%2FTabsPage.tsx

You won't be able to see the problem not on real device unless you inspect the classes in DOM

### Code Reproduction URL

https://stackblitz.com/edit/sb1-wnpdveiy?file=src%2Fpages%2FTabsPage.tsx

### Ionic Info

"@ionic/react": "^8.4.3",
"@ionic/react-router": "^8.4.3",
"ionicons": "^7.2.2",
"lucide-react": "^0.344.0",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"react-router": "^5.3.4",
"react-router-dom": "^5.3.4"

### Additional Information

_No response_