Tab bar does not respect KeyboardAvoidingView on iOS (Liquid glass) - Renders on top of it

### Before submitting a new issue

- [x] I tested using the latest version of the library, as the bug might be already fixed.
- [x] I tested using a [supported version](https://github.com/reactwg/react-native-releases/blob/main/docs/support.md) of react native.
- [x] I checked for possible duplicate issues, with possible answers.

### Bug summary

When using KeyboardAvoidingView with react-native-bottom-tabs on iOS with the new "liquid glass" tab bar style, the keyboard-avoiding content is rendered underneath the tab bar. The KeyboardAvoidingView's padding/height calculation doesn't account for the translucent tab bar height, causing the bottom portion of the content to be obscured.

Current workaround:

const tabBarHeight = useBottomTabBarHeight();

```

{/* content */}

```

### Library version

1.1.0

### Environment info

```shell
System:
OS: macOS 15.7.1
CPU: (10) arm64 Apple M4
Memory: 144.44 MB / 16.00 GB
Shell:
version: "5.9"
path: /bin/zsh
Binaries:
Node:
version: 25.2.1
Yarn: Not Found
npm:
version: 11.6.2
Watchman:
version: 2025.10.27.00
path: /opt/homebrew/bin/watchman
Managers:
CocoaPods:
version: 1.16.2
path: /opt/homebrew/bin/pod
SDKs:
iOS SDK:
Platforms:
- DriverKit 25.2
- iOS 26.2
- macOS 26.2
- tvOS 26.2
- visionOS 26.2
- watchOS 26.2
Android SDK: Not Found
IDEs:
Android Studio: 2025.2 AI-252.25557.131.2521.14344949
Xcode:
version: 26.2/17C52
path: /usr/bin/xcodebuild
Languages:
Java:
version: 17.0.17
path: /usr/bin/javac
Ruby:
version: 2.6.10
path: /usr/bin/ruby
npmPackages:
"@react-native-community/cli":
installed: 20.1.2
wanted: latest
react:
installed: 19.1.0
wanted: 19.1.0
react-native:
installed: 0.81.5
wanted: 0.81.5
react-native-macos: Not Found
npmGlobalPackages:
"*react-native*": Not Found
Android:
hermesEnabled: true
newArchEnabled: true
iOS:
hermesEnabled: true
newArchEnabled: true
```

### Steps to reproduce

1. Set up a screen with bottom tabs using react-native-bottom-tabs
2. Wrap content in a KeyboardAvoidingView with behavior="padding"
3. Use a view inside it with 100% height or flex 1.
4. The tab bar renders on top of it.

### Reproducible sample code

```js
import React from 'react';
import {
KeyboardAvoidingView,
Platform,
TextInput,
View,
StyleSheet,
Text,
} from 'react-native';
import { createNativeBottomTabNavigator } from 'react-native-bottom-tabs';
import { NavigationContainer } from '@react-navigation/native';
import { useBottomTabBarHeight } from 'react-native-bottom-tabs';

const Tab = createNativeBottomTabNavigator();

function HomeScreen() {
const tabBarHeight = useBottomTabBarHeight();

return (


KeyboardAvoidingView + Bottom Tabs Bug




);
}

function SettingsScreen() {
return (

Settings

);
}

export default function App() {
return (


require('./assets/home-icon.png'),
}}
/>
require('./assets/settings-icon.png'),
}}
/>


);
}

const styles = StyleSheet.create({
container: {
backgroundColor: '#fff',
},
content: {
flex: 1,
padding: 20,
justifyContent: 'flex-end',
},
title: {
fontSize: 20,
fontWeight: 'bold',
marginBottom: 10,
},
spacer: {
flex: 1,
},
input: {
borderWidth: 1,
borderColor: '#ccc',
borderRadius: 8,
padding: 15,
fontSize: 16,
},
});
```

Reproduce the issue on iOS using the provided KeyboardAvoidingView, createNativeBottomTabNavigator, and liquid glass tab-bar setup. Compare the behavior with and without the tabBarHeight margin workaround, then trace the bottom-tabs layout and keyboard-avoidance interaction. Done means the content remains visible above the translucent tab bar without requiring that workaround.

Written by the indexing model from the issue text.