/* Pages rendered inside the Hotwire Native iOS app. body.ios-native-app = any app binary (RideMentor-iOS UA token). body.native-chrome = binaries that draw their own native tab bar. The top-inset rules mirror what app builds <= 1.0.x inject via WKUserScript. */ body.ios-native-app [class*='border-b'] > .max-w-7xl { padding-top: calc(0.75rem + env(safe-area-inset-top)) !important; } body.ios-native-app .provider-approval-banner > .max-w-7xl { padding-top: calc(0.75rem + env(safe-area-inset-top)) !important; } @media (min-width: 640px) { body.ios-native-app .fixed.bottom-4 { top: calc(5rem + env(safe-area-inset-top)) !important; bottom: auto !important; } } body.native-chrome main.app-content { padding-bottom: calc(env(safe-area-inset-bottom) + 4.5rem); } /* The photo lightbox is teleported to while open (gallery_controller), so it leaves .app-content and its tab-bar inset, spanning the full screen. Under native chrome the iOS tab bar floats over the bottom edge and the status bar over the top, hiding the overlay's thumbnail ribbon and close control — re-apply the safe-area insets to the lifted overlay so both clear the native chrome. */ body.native-chrome .gallery-overlay { padding-top: env(safe-area-inset-top); padding-bottom: calc(env(safe-area-inset-bottom) + 4.5rem); } /* iOS sizes native date/time controls to their own intrinsic width, ignoring width:100% and spilling past their container; strip the native appearance so they honour the box model. */ body.ios-native-app input[type="date"], body.ios-native-app input[type="time"], body.ios-native-app input[type="datetime-local"], body.ios-native-app input[type="month"] { -webkit-appearance: none; appearance: none; min-width: 0; max-width: 100%; }