body {
  padding-top: env(safe-area-inset-top);
  padding-bottom: env(safe-area-inset-bottom);
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
}

@supports (-webkit-touch-callout: none) {
  html {
    height: -webkit-fill-available;
  }

  body {
    min-height: -webkit-fill-available;
    padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
  }

  .navbar-fixed-top {
    padding-top: env(safe-area-inset-top);
    top: env(safe-area-inset-top);
  }

  /* Create a solid background for the status bar area */
  .navbar-inner.primary {
    position: relative;
  }

  .navbar-inner.primary {
    padding-top: env(safe-area-inset-top);
    background-color: #000;
  }

  .navbar-inner.secondary .nav {
    margin-top: env(safe-area-inset-top);
  }
}