/* iOS PWA safe-area helpers (notch + home indicator)
   Loaded AFTER app.css to avoid overwriting your main stylesheet.
*/
@media (display-mode: standalone) {
  /* Top bar: avoid being hidden behind iPhone status bar / notch */
  .topbar{
    padding-top: env(safe-area-inset-top);
  }

  /* Bottom bar: keep buttons above the home indicator */
  .bottombar{
    padding-bottom: env(safe-area-inset-bottom);
  }

  /* Main content: leave room for bottom bar + home indicator */
  main{
    padding-bottom: calc(90px + env(safe-area-inset-bottom));
  }
}

/* Fallback for some iOS builds where display-mode is flaky */
@supports (-webkit-touch-callout: none) {
  .topbar{
    padding-top: env(safe-area-inset-top);
  }
  .bottombar{
    padding-bottom: env(safe-area-inset-bottom);
  }
  main{
    padding-bottom: calc(90px + env(safe-area-inset-bottom));
  }
}