Fix PageWithHeader header leaking into safe area (#5792)

* fix header leaking out of safe area

* make fix native-only

src/view/com/pager/Pager.tsx

@@ -7,7 +7,7 @@ import PagerView, {
 } from 'react-native-pager-view'
 
 import {LogEvents} from '#/lib/statsig/events'
-import {s} from 'lib/styles'
+import {atoms as a, native} from '#/alf'
 
 export type PageSelectedEvent = PagerViewOnPageSelectedEvent
 const AnimatedPagerView = Animated.createAnimatedComponent(PagerView)
@@ -133,14 +133,14 @@ export const Pager = forwardRef<PagerRef, React.PropsWithChildren<Props>>(
     )
 
     return (
-      <View testID={testID} style={s.flex1}>
+      <View testID={testID} style={[a.flex_1, native(a.overflow_hidden)]}>
         {renderTabBar({
           selectedPage,
           onSelect: onTabBarSelect,
         })}
         <AnimatedPagerView
           ref={pagerView}
-          style={s.flex1}
+          style={[a.flex_1]}
           initialPage={initialPage}
           onPageScrollStateChanged={handlePageScrollStateChanged}
           onPageSelected={onPageSelectedInner}