/* Custom animations and styles */

@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}

@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes pulse-glow {
  0%, 100% { box-shadow: 0 0 20px rgba(99, 102, 241, 0.15); }
  50% { box-shadow: 0 0 40px rgba(99, 102, 241, 0.3); }
}

/* Fade in on scroll */
.fade-in {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade-in.visible {
  opacity: 1;
  transform: translateY(0);
}

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

::-webkit-scrollbar-track {
  background: #0a0a0a;
}

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

::-webkit-scrollbar-thumb:hover {
  background: #444;
}

/* Selection */
::selection {
  background: rgba(99, 102, 241, 0.3);
  color: #fff;
}

/* Nav glass effect enhancement */
nav {
  -webkit-backdrop-filter: blur(20px);
}

/* Hero gradient animation */
@keyframes gradient-shift {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

h1 .text-transparent {
  background-size: 200% 200%;
  animation: gradient-shift 6s ease infinite;
}

/* Card hover glow */
.group:hover {
  box-shadow: 0 0 30px rgba(99, 102, 241, 0.08);
}

/* Search section glow */
@keyframes search-pulse {
  0%, 100% { opacity: 0.3; }
  50% { opacity: 0.6; }
}

.search-glow {
  animation: search-pulse 3s ease-in-out infinite;
}

#domain-search:focus ~ .search-glow,
#domain-search:not(:placeholder-shown) ~ .search-glow {
  opacity: 0.8;
}

/* Search results animations */
#search-results > div {
  animation: fadeInUp 0.3s ease;
}

/* Code preview in search results */
#search-results pre {
  scrollbar-width: thin;
  scrollbar-color: #333 #111;
}

#search-results pre::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

#search-results pre::-webkit-scrollbar-thumb {
  background: #333;
  border-radius: 3px;
}
