/* Hotwire Native specific styles */
body.hotwire-native .d-none-hotwire-native,
body.hotwire-native .breadcrumbs {
  display: none !important;
}

body.hotwire-native {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: none;
  padding-block-start: env(safe-area-inset-top);
  padding-block-end: calc(max(env(safe-area-inset-bottom), 2.5rem) * 1.1);
}

body.hotwire-native * {
  -webkit-tap-highlight-color: transparent;
}

/* Onboarding has no tab bar or nav bar — just enough top space for status bar */
body.hotwire-native.onboarding {
  padding-block-start: env(safe-area-inset-top);
  padding-block-end: 0;
}

/* Auth pages (login/signup/password reset) have no tab bar or nav bar either,
   and their own centered-card layout already adds vertical breathing room —
   stacking the full safe-area padding on top pushed the card down too far.
   The card stays vertically centered, same as on web. */
body.hotwire-native.auth {
  padding-block-start: env(safe-area-inset-top);
  padding-block-end: 0;
}

/* Sticky elements respect safe areas */
body.hotwire-native .sticky-top {
  top: env(safe-area-inset-top) !important;
}

body.hotwire-native .sticky-bottom {
  bottom: env(safe-area-inset-bottom) !important;
}

/* Remove min-h-screen on native — pages don't need full viewport height */
body.hotwire-native .min-h-screen {
  min-height: unset !important;
}

/* bg-canvas sets min-height: 100vh on <body> itself for web — on native
   this forces the WebView content taller than its actual content, which
   throws off the native tab bar's height calculation. */
body.hotwire-native.bg-canvas {
  min-height: unset !important;
}

/* Chat: exactly the visible height between the status bar and the native tab
   bar (the body padding above), so only the messages scroll and the input
   stays pinned right above the tab bar. The web height subtracts the web nav,
   which native hides; the body already pads the bottom safe area. */
body.hotwire-native .chat-screen {
  height: calc(100dvh - env(safe-area-inset-top) - calc(max(env(safe-area-inset-bottom), 2.5rem) * 1.1));
  padding-block-end: 0.5rem;
}

body.hotwire-native .chat-screen .chat-input {
  padding-block-end: 0;
}

/* Prevent iOS auto-zoom on input focus (requires font-size >= 16px) */
body.hotwire-native input,
body.hotwire-native textarea,
body.hotwire-native select {
  font-size: max(16px, 1em);
}