/**
 * Model A — shared mobile safe area (all GIS Explorer WEB apps).
 * Spec: GlobalConstants/Documents/Safe-Phones-Area/README.md
 *
 * Requires: viewport-fit=cover on <meta name="viewport">.
 * Native: StatusBar.setOverlaysWebView({ overlay: false }) in each Capacitor app.
 *
 * Load after fm.css, before app-specific CSS.
 */

:root {
  --SafeAreaInsetTop: env(safe-area-inset-top, 0px);
  --SafeAreaInsetRight: env(safe-area-inset-right, 0px);
  --SafeAreaInsetBottom: env(safe-area-inset-bottom, 0px);
  --SafeAreaInsetLeft: env(safe-area-inset-left, 0px);
  --AppTopBarHeight: 50px;
}

/* Scroll root — home indicator / gesture bar at bottom */
#root {
  box-sizing: border-box;
  min-height: 100dvh;
  padding-bottom: var(--SafeAreaInsetBottom);
}

/* Non-fixed regions */
.AppSafeAreaTop {
  padding-top: var(--SafeAreaInsetTop);
}

.AppSafeAreaBottom {
  padding-bottom: var(--SafeAreaInsetBottom);
}

.AppSafeAreaHorizontal {
  padding-left: var(--SafeAreaInsetLeft);
  padding-right: var(--SafeAreaInsetRight);
}

/* Fixed chrome */
.AppFixedTop {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1030;
  padding-top: var(--SafeAreaInsetTop);
  box-sizing: border-box;
}

.AppFixedBottom {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1030;
  padding-bottom: var(--SafeAreaInsetBottom);
  box-sizing: border-box;
}

/* Spacer below a fixed top bar (set --AppTopBarHeight on a parent wrapper) */
.AppTopBarSpacer {
  height: calc(var(--AppTopBarHeight) + var(--SafeAreaInsetTop));
  flex-shrink: 0;
}

/* Fixed alerts (offline banner, etc.) */
.AppFixedAlertTop {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 10000;
  box-sizing: border-box;
  padding: 10px 12px;
  padding-top: calc(10px + var(--SafeAreaInsetTop));
}