/* WebView Rendering Fix for Android APK */

/* Ensure full viewport coverage */
html {
  height: 100%;
  width: 100%;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}

body {
  min-height: 100%;          /* avoid 100vh blank gap in Android WebView */
  width: 100%;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  -webkit-tap-highlight-color: transparent;
  background: #0a0a0a !important;
}

/* Fix for WebView rendering issues */
*, *::before, *::after {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
}

/* Prevent white flashes */
[data-theme="dark"] body,
[data-theme="dark"] html {
  background: #0a0a0a !important;
}

[data-theme="light"] body,
[data-theme="light"] html {
  background: #f0f2f8 !important;
}

/* Fix bottom navigation positioning in WebView */
.m-bottom-nav {
  position: fixed !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
}

/* Screens — use auto height, not 100vh, to prevent blank space */
.bk-screen {
  min-height: auto !important;
  background: var(--bg, #0a0a0a) !important;
  padding-bottom: 140px !important; /* space for fixed bottom bar */
}

/* Fix for scrolling content */
.bk-screen.active {
  display: flex !important;
  flex-direction: column !important;
}

/* Hidden screens must take NO space */
.bk-screen:not(.active) {
  display: none !important;
  min-height: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Prevent content from being hidden behind fixed elements */
main, .main-content, .content-wrap {
  padding-bottom: env(safe-area-inset-bottom, 0) !important;
}

/* ── Forgot password / login pages: remove 100vh blank gap ── */
body.auth-page {
  display: block !important;
  align-items: unset !important;
  justify-content: unset !important;
  min-height: auto !important;
  padding: 2rem 1rem !important;
}

/* ── General: kill white space caused by 100vh on short pages ── */
.cp-layout,
.m-content {
  min-height: auto !important;
  background: #0a0a0a;
}
[data-theme="light"] .cp-layout,
[data-theme="light"] .m-content {
  background: #f0f2f8;
}
