/* Global styles extracted from public/index.html */
body { font-family: 'Inter', sans-serif; }
/* Custom scrollbar for a better look */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #1f2937; }
::-webkit-scrollbar-thumb { background: #4b5563; border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: #6b7280; }
/* Simple spinner animation */
.spinner { border: 4px solid rgba(255,255,255,0.2); border-left-color: #2dd4bf; border-radius: 50%; width: 40px; height: 40px; animation: spin 1s linear infinite; }
.mini-spinner { width: 20px; height: 20px; }
@keyframes spin { to { transform: rotate(360deg); } }
/* Transition for view switching */
.view { transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out; }
.view-hidden { opacity: 0; transform: scale(0.98); pointer-events: none; position: absolute; width: 100%; }
/* Subtle red glow pulse for homepage search */
.glow-pulse { animation: glow-pulse 2.4s ease-in-out infinite; border-color: rgba(248,113,113,0.6) !important; }
@keyframes glow-pulse {
  0% { box-shadow: 0 0 0 0 rgba(239,68,68,0.0), 0 0 0 0 rgba(239,68,68,0.15); }
  50% { box-shadow: 0 0 0 2px rgba(239,68,68,0.15), 0 0 18px 4px rgba(239,68,68,0.28); }
  100% { box-shadow: 0 0 0 0 rgba(239,68,68,0.0), 0 0 0 0 rgba(239,68,68,0.15); }
}
/* Front page fade-in for brand + search */
@keyframes front-fade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
.front-fade { opacity: 0; animation: front-fade 700ms ease-out forwards; }
.front-fade-1 { animation-delay: 60ms; }
.front-fade-2 { animation-delay: 180ms; }
/* Smooth shift of the whole app when the mobile keyboard opens */
.keyboard-shift { transition: transform 0.25s ease; will-change: transform; }
/* 3-line text clamp utility for schedule descriptions */
.clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
/* Brand glow on first load */
.brand-glow { animation: brandGlow 1200ms ease-out 1; }
@keyframes brandGlow { 0% { text-shadow: 0 0 0 rgba(239,68,68,0); } 35% { text-shadow: 0 0 10px rgba(239,68,68,0.9), 0 0 18px rgba(239,68,68,0.6); } 100% { text-shadow: 0 0 0 rgba(239,68,68,0); } }