/* ============================================================
   mobile-app.css — Capacitor Wrapper Overrides
   Pineapple Media, LLC | Agent #3 | 2026-04-14T17:14:50.699Z
   Shared across KeyMax PM + RealTime Budget
   ============================================================ */

/* ---- TASK 0: Safe-Area Shims ---- */
:root {
  --sat: env(safe-area-inset-top, 0px);
  --sab: env(safe-area-inset-bottom, 0px);
  --sal: env(safe-area-inset-left, 0px);
  --sar: env(safe-area-inset-right, 0px);
}

/* Push body content below the notch / Dynamic Island */
body {
  padding-top: var(--sat);
  padding-bottom: var(--sab);
  padding-left: var(--sal);
  padding-right: var(--sar);
}

/* ---- TASK 0: Disable Web-Only UX ---- */

/* Kill rubber-band / bounce scrolling */
html, body {
  overscroll-behavior: none;
  -webkit-overflow-scrolling: touch;
}

/* Disable pull-to-refresh in native wrapper */
body {
  overflow-y: auto;
  overscroll-behavior-y: none;
}

/* Disable text selection magnifying glass + callouts */
body.capacitor-app {
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: transparent;
}
/* Re-enable selection on input fields so users can still paste */
body.capacitor-app input,
body.capacitor-app textarea,
body.capacitor-app select,
body.capacitor-app [contenteditable="true"] {
  -webkit-user-select: text;
  user-select: text;
}

/* ---- TASK 1: Input Zoom Prevention (iOS 16px minimum) ---- */
input, select, textarea {
  font-size: 16px !important;
}
input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="email"],
input[type="password"],
input[type="url"] {
  font-size: 16px !important;
}

/* ---- TASK 1: 44x44 Minimum Tap Targets (Apple HIG) ---- */
button, 
a.btn, 
.btn, 
input[type="submit"], 
input[type="button"],
input[type="reset"],
.tab,
.nav-link,
.menu-item,
.dropdown-toggle,
.action-btn,
.close-btn,
[role="button"] {
  min-height: 44px;
  min-width: 44px;
}

/* Ensure icon-only buttons still meet the tap target */
.icon-btn, .btn-icon, .btn-sm {
  min-height: 44px;
  min-width: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* ---- TASK 0 + TASK 1: Header Safe-Area Push ---- */
header,
.header-row,
.topbar,
.manager-header,
.tenant-header,
nav.main-nav,
.navbar {
  padding-top: calc(8px + var(--sat));
}

/* ---- TASK 0: Home Bar Buffer (iOS Home Indicator) ---- */
/* Bottom nav / tab bars get 20px+ extra below content */
.bottom-nav,
.tab-bar,
.footer-nav,
.fixed-bottom,
.nav-bottom,
footer.fixed,
.action-bar-bottom {
  padding-bottom: calc(20px + var(--sab));
}

/* ---- KeyMax PM Specific (8 fixes) ---- */

/* KM-1: Status bar contrast — light text on #1a3f8a */
/* Handled by Capacitor StatusBar plugin config */

/* KM-2: Fixed bottom elements clear home indicator */
.tenant-nav-bottom,
.manager-nav-bottom,
.fab-button,
.pay-button-fixed {
  bottom: calc(12px + var(--sab));
}

/* KM-3: External links (handled by Capacitor Browser plugin at runtime) */

/* KM-4: Splash screen (handled by Capacitor splash config) */

/* KM-5: Pull-to-refresh disabled globally above */

/* KM-6: Rubber-band scroll disabled globally above */

/* KM-7: Manager sidebar overlay needs safe area */
.sidebar-overlay,
.slide-menu {
  top: var(--sat);
  height: calc(100vh - var(--sat));
}

/* KM-8: Modal dialogs respect safe areas */
.modal,
.modal-overlay,
.popup,
.dialog {
  padding-top: var(--sat);
  padding-bottom: var(--sab);
}
.modal-content {
  max-height: calc(100vh - var(--sat) - var(--sab) - 40px);
  overflow-y: auto;
}

/* ---- RealTime Budget Specific (6 fixes) ---- */

/* RTB-1: manifest.json (separate file — see manifest.json) */

/* RTB-2: Ad slots repositioned for safe areas */
.ad-slot {
  margin-left: calc(16px + var(--sal));
  margin-right: calc(16px + var(--sar));
}
.ad-bottom {
  bottom: calc(56px + var(--sab));
}

/* RTB-3: Simulate button clears home indicator */
#sim-btn {
  bottom: calc(12px + var(--sab));
}

/* RTB-4: Max-width adapts to native frame */
body.capacitor-app {
  max-width: 100vw;
}

/* RTB-5: localStorage handled at runtime (no CSS needed) */

/* RTB-6: Offline fallback (separate offline.html file) */

/* ---- Capacitor-specific utility classes ---- */
.safe-top { padding-top: var(--sat); }
.safe-bottom { padding-bottom: var(--sab); }
.safe-left { padding-left: var(--sal); }
.safe-right { padding-right: var(--sar); }
.safe-all {
  padding: var(--sat) var(--sar) var(--sab) var(--sal);
}

/* Hide web-only elements in native app */
body.capacitor-app .web-only,
body.capacitor-app .install-pwa-banner,
body.capacitor-app .browser-notice,
body.capacitor-app .add-to-homescreen {
  display: none !important;
}

/* Show native-only elements in app */
.native-only { display: none; }
body.capacitor-app .native-only { display: block; }

/* ---- Smooth transitions for app feel ---- */
* {
  -webkit-tap-highlight-color: transparent;
}
a, button, .btn, [role="button"] {
  transition: opacity 0.15s ease, transform 0.1s ease;
}
a:active, button:active, .btn:active, [role="button"]:active {
  opacity: 0.7;
  transform: scale(0.97);
}