/* PWA Safe Area Support for iOS devices with home indicator/notch */

/* Apply safe area padding to root elements in standalone PWA mode */
@supports (padding: env(safe-area-inset-bottom)) {
  html, body {
    /* Use padding for safe areas */
    padding-top: env(safe-area-inset-top);
    padding-right: env(safe-area-inset-right);
    padding-bottom: env(safe-area-inset-bottom);
    padding-left: env(safe-area-inset-left);
  }

  /* Ensure root container respects safe areas */
  #root {
    min-height: 100vh;
    min-height: -webkit-fill-available;
  }
}

/* Specific styles for standalone PWA mode (home screen installed) */
@media all and (display-mode: standalone) {
  body {
    /* Extra bottom padding for home indicator */
    padding-bottom: env(safe-area-inset-bottom, 20px);
  }

  /* Fix for fixed-positioned footers */
  .fixed-bottom,
  [style*="position: fixed"][style*="bottom"] {
    padding-bottom: env(safe-area-inset-bottom, 20px);
  }
}

/* iOS Safari specific fixes */
@supports (-webkit-touch-callout: none) {
  body {
    /* Prevent rubber-band scrolling issues */
    -webkit-overflow-scrolling: touch;
  }
}