/**
 * iOS Capacitor App Optimizations
 * Applied globally for consistent mobile experience
 */

/* Reset iOS webkit defaults */
* {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
}

/* Smooth scrolling on iOS */
html {
  -webkit-overflow-scrolling: touch;
  overflow-scrolling: touch;
}

/* Safe area insets for notched devices */
@supports (padding: env(safe-area-inset-top)) {
  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);
  }
}

/* Prevent overscroll bounce — web safe (no position:fixed or overflow:hidden on body) */
body {
  overscroll-behavior-y: none;
}

/* Fix input zoom on focus (iOS) */
input,
textarea,
select {
  font-size: 16px !important;
}

/* Optimize buttons for touch */
button,
a {
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1);
}

/* Capacitor-specific: ensure WebView fills screen */
ion-app,
ion-content {
  --ion-safe-area-top: env(safe-area-inset-top);
  --ion-safe-area-bottom: env(safe-area-inset-bottom);
  --ion-safe-area-left: env(safe-area-inset-left);
  --ion-safe-area-right: env(safe-area-inset-right);
}

/* iOS-specific enhancements */
@supports (-webkit-touch-callout: none) {
  /* Larger touch targets for iOS */
  button,
  .submit-button,
  .lightningBtn,
  .new-quest-btn,
  .last-mission-btn,
  .battle-log-btn {
    min-height: 44px;
    min-width: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 20px;
  }

  /* iOS-style rounded corners */
  .card,
  .prompt-card,
  .assignment-card,
  button,
  input,
  textarea {
    border-radius: 12px;
  }

  /* iOS system font */
  body {
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", sans-serif;
  }

  /* Smooth animations */
  * {
    transition: transform 0.2s ease, opacity 0.2s ease;
  }

  button:active,
  .submit-button:active {
    transform: scale(0.96);
    opacity: 0.8;
  }
}
