/*
 * WayzAway native WebView safe-area fix v2
 * Does not affect normal web browsers.
 */

html.wz-native-app {
  --wz-native-bottom-clearance: 88px;
}

html.wz-native-ios {
  --wz-native-bottom-clearance: 52px;
}

/*
 * Provide genuine scrollable space below the application.
 */
html.wz-native-app body {
  padding-bottom: var(--wz-native-bottom-clearance) !important;
  box-sizing: border-box !important;
}

html.wz-native-app .v-main {
  padding-bottom: var(--wz-native-bottom-clearance) !important;
  box-sizing: border-box !important;
}

/*
 * Spacer injected after the main Vue application content.
 */
html.wz-native-app #wz-native-bottom-spacer {
  display: block !important;
  width: 100% !important;
  height: var(--wz-native-bottom-clearance) !important;
  min-height: var(--wz-native-bottom-clearance) !important;
  flex: 0 0 var(--wz-native-bottom-clearance) !important;
  pointer-events: none !important;
}

/*
 * The previous fix padded the drawer contents.
 * This version raises the ACTUAL fixed drawer above
 * Android/iOS system controls.
 */
html.wz-native-app .v-navigation-drawer.wz-native-drawer {
  bottom: var(--wz-native-bottom-clearance) !important;
  height: auto !important;
  max-height: calc(100dvh - var(--wz-native-bottom-clearance)) !important;
}

html.wz-native-app .v-navigation-drawer.wz-native-drawer
.v-navigation-drawer__content {
  padding-bottom: 12px !important;
  box-sizing: border-box !important;
}

/*
 * Sign-out control gets a little internal breathing room.
 */
html.wz-native-app .wz-native-signout {
  margin-bottom: 12px !important;
}

/*
 * Normal/footer components can scroll completely above
 * the system navigation controls.
 */
html.wz-native-app footer,
html.wz-native-app .v-footer,
html.wz-native-app .wz-native-footer {
  margin-bottom: var(--wz-native-bottom-clearance) !important;
}

/*
 * iPhone home-indicator safe area.
 */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
  html.wz-native-ios {
    --wz-native-bottom-clearance:
      calc(52px + env(safe-area-inset-bottom));
  }
}

/* WAYZAWAY NATIVE FOOTER CENTRE START */

/*
 * Centre the footer navigation as a complete group
 * inside the native Android/iOS app only.
 */
html.wz-native-app footer,
html.wz-native-app .v-footer,
html.wz-native-app .wz-native-footer {
  text-align: center !important;
}

html.wz-native-app footer .v-row,
html.wz-native-app .v-footer .v-row,
html.wz-native-app .wz-native-footer .v-row {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  justify-content: center !important;
  align-items: center !important;
}

html.wz-native-app footer nav,
html.wz-native-app .v-footer nav,
html.wz-native-app .wz-native-footer nav {
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  justify-content: center !important;
}

/* Remove Vuetify row side-offsets that make the link group look left-biased. */
html.wz-native-app footer .v-row > *,
html.wz-native-app .v-footer .v-row > *,
html.wz-native-app .wz-native-footer .v-row > * {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* WAYZAWAY NATIVE FOOTER CENTRE END */
