/* PWA specific styles for iOS and iPadOS */
@supports (-webkit-touch-callout: none) {
  /* iOS and iPadOS specific styles */
  body {
    /* Prevent pull-to-refresh on the body */
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
  }
  
  /* Fix for input zoom on iOS */
  input, select, textarea {
    font-size: 16px !important;
  }
  
  /* Prevent text size adjustment */
  html {
    -webkit-text-size-adjust: 100%;
  }
}

/* Base styles for PWA */
:root {
  --safe-area-top: env(safe-area-inset-top, 0px);
  --safe-area-bottom: env(safe-area-inset-bottom, 0px);
  --safe-area-left: env(safe-area-inset-left, 0px);
  --safe-area-right: env(safe-area-inset-right, 0px);
}

/* Ensure the app fills the viewport */
html, body, #root {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

/* PWA specific styles */
.pwa-container {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  padding-top: env(safe-area-inset-top, 0px);
  padding-bottom: env(safe-area-inset-bottom, 0px);
  padding-left: env(safe-area-inset-left, 0px);
  padding-right: env(safe-area-inset-right, 0px);
  overflow: auto;
}

/* iOS specific styles */
@supports (-webkit-touch-callout: none) {
  /* Fix for Safari's 100vh issue */
  .pwa-container {
    height: -webkit-fill-available;
  }
  
  /* Fix for input zoom on iOS */
  input, select, textarea {
    font-size: 16px !important;
  }
  
  /* Prevent text size adjustment */
  html {
    -webkit-text-size-adjust: 100%;
  }
}

/* iPad specific styles */
@media (min-width: 768px) {
  .pwa-container {
    max-width: 1024px;
    margin: 0 auto;
  }
}

/* Dark mode support */
@media (prefers-color-scheme: dark) {
  :root {
    --bg-color: #121212;
    --bg-color-secondary: #1e1e1e;
    --text-color: #ffffff;
    --text-color-secondary: #b3b3b3;
    --border-color: #333333;
  }
}