/* LinkMetrics - Main CSS */

/* Custom animations */
@keyframes pulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.05); }
  100% { transform: scale(1); }
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.animate-pulse {
  animation: pulse 2s infinite ease-in-out;
}

.animate-fade-in {
  animation: fadeIn 0.5s ease-out;
}

/* Custom scrollbar */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: #f1f5f9;
}

::-webkit-scrollbar-thumb {
  background: #94a3b8;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #64748b;
}

/* Custom styles that extend Tailwind */
.glass-effect {
  background: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.18);
}

.text-gradient {
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  background-image: linear-gradient(90deg, #3b82f6, #8b5cf6);
}

.bg-gradient-primary {
  background-image: linear-gradient(135deg, #3b82f6, #8b5cf6);
}

.bg-gradient-secondary {
  background-image: linear-gradient(135deg, #14b8a6, #0ea5e9);
}

/* Custom shadows */
.shadow-blue {
  box-shadow: 0 4px 14px 0 rgba(59, 130, 246, 0.3);
}

.shadow-purple {
  box-shadow: 0 4px 14px 0 rgba(139, 92, 246, 0.3);
}

/* Footer styles */
.footer-link {
  @apply text-gray-400 hover:text-white transition-colors duration-200;
}