/* ── iOS PWA NATIVE FEEL ──────────────────────────── */

/* Disable callout on interactive elements */
a, button, .sidebar-item, .nav-item, .btn-primary, .btn-secondary {
  -webkit-touch-callout: none;
}

/* Disable text selection on UI (not on content/inputs) */
#sidebar, .topbar, .sidebar-item, .nav-item, button, .btn-primary, .btn-secondary,
.sidebar-ws-header, .ws-icon, .ws-name {
  -webkit-user-select: none;
  user-select: none;
}

/* Allow selection in inputs and content areas */
input, textarea, [contenteditable], .page-body, .notion-text, .editable {
  -webkit-user-select: auto;
  user-select: auto;
}

/* Disable pull-to-refresh / overscroll */
html, body {
  overscroll-behavior: none;
  overscroll-behavior-y: none;
  -webkit-overflow-scrolling: touch;
}

/* Smooth scrolling everywhere */
* {
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
}

/* Bottom safe area for iPhone notch/bar */
#app {
  padding-bottom: env(safe-area-inset-bottom);
}

/* Top safe area for status bar in standalone mode */
@media all and (display-mode: standalone) {
  body {
    padding-top: env(safe-area-inset-top);
  }
  #sidebar {
    padding-top: env(safe-area-inset-top);
  }
  .topbar {
    padding-top: env(safe-area-inset-top);
  }
}

/* Smooth transitions for navigation feel */
.page-body, #main, .sidebar-item {
  transition: opacity 150ms ease, transform 150ms ease;
}

/* Active states for touch feedback */
.sidebar-item:active,
.btn-primary:active,
.btn-secondary:active,
button:active {
  opacity: 0.7;
  transform: scale(0.98);
  transition: opacity 50ms, transform 50ms;
}

/* Tap highlight */
a, button, .sidebar-item, [onclick] {
  -webkit-tap-highlight-color: rgba(45, 90, 86, 0.15);
}

/* Fix iOS input zoom - ensure font size >= 16px on inputs */
@media screen and (max-width: 768px) {
  input, textarea, select {
    font-size: 16px !important;
  }
}

/* Status bar area coloring in standalone */
@media all and (display-mode: standalone) {
  html {
    background: var(--sidebar-bg, #F7F6F3);
  }
}

/* Hide browser UI elements in standalone */
@media all and (display-mode: standalone) {
  .install-prompt, .browser-notice {
    display: none !important;
  }
}