@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
  }
  
  body {
    background-color: #191B1F; /* dark-500 background */
    color: #ffffff;
  }
  
  /* This ensures Safari status bar in full-screen has proper contrast */
  html {
    background-color: #191B1F;
  }
}

/* Specific styles for when app is in standalone mode (added to home screen) */
@media all and (display-mode: standalone) {
  body {
    /* Ensure body takes up full height */
    min-height: 100vh;
    /* Prevent bouncing/scrolling in iOS */
    overflow: hidden;
    position: fixed;
    width: 100%;
    height: 100%;
  }
  
  /* Dark mode styles for standalone mode */
  @media (prefers-color-scheme: dark) {
    body {
      background-color: #191B1F; /* dark-500 background */
    }
  }
}