/* Breslow Field — Custom Styles */

/* Prevent overscroll bounce on iOS */
html, body {
  overscroll-behavior: none;
  -webkit-overflow-scrolling: touch;
}

/* Safe area padding for notched phones */
.safe-top { padding-top: env(safe-area-inset-top); }
.safe-bottom { padding-bottom: env(safe-area-inset-bottom); }

/* Smooth page transitions */
.view-enter { animation: fadeIn 0.2s ease-out; }
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Pull-to-refresh indicator */
.pull-indicator {
  transition: transform 0.2s ease;
}

/* Voice button pulse */
.voice-active {
  animation: pulse 1.2s infinite;
}
@keyframes pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.5); }
  50% { box-shadow: 0 0 0 12px rgba(59, 130, 246, 0); }
}

/* Tap target minimum size */
.tap-target {
  min-height: 44px;
  min-width: 44px;
}

/* Status badge colors matching Monday.com */
.status-working { background-color: #fdab3d; color: #000; }
.status-done { background-color: #00c875; color: #fff; }
.status-stuck { background-color: #e2445c; color: #fff; }
.status-default { background-color: #c4c4c4; color: #000; }

/* Loading skeleton */
.skeleton {
  background: linear-gradient(90deg, #1e293b 25%, #334155 50%, #1e293b 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
  border-radius: 4px;
}
@keyframes shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* Bottom nav highlight */
.nav-active {
  color: #3b82f6;
}
.nav-inactive {
  color: #64748b;
}

/* Scrollbar hide for horizontal scroll */
.hide-scrollbar::-webkit-scrollbar { display: none; }
.hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }