@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

@tailwind base;
@tailwind components;
@tailwind utilities;

body {
  font-family: 'Inter', sans-serif;
  @apply bg-dark text-white antialiased;
}

.gradient-text {
  @apply bg-gradient-to-r from-green-400 to-blue-500 bg-clip-text text-transparent;
}

.card {
  @apply bg-dark-card border border-gray-700 rounded-xl p-6 transition-all hover:border-green-500;
}

.btn-primary {
  @apply px-6 py-3 rounded-lg bg-primary hover:bg-primary-hover transition-all text-white font-medium;
}

.btn-secondary {
  @apply px-6 py-3 rounded-lg bg-dark-lighter hover:bg-gray-800 transition-all text-white font-medium border border-gray-700;
}

.section {
  @apply py-12 md:py-20;
}

.hover-lift {
  @apply transition-transform duration-300;
}

.hover-lift:hover {
  transform: translateY(-5px);
}

.radial-gradient-bg {
  background: radial-gradient(circle at center, rgba(34, 197, 94, 0.15), transparent 50%);
}
/* Webkit Scrollbar Styling */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: #000; /* Optional: light background */
  border-radius: 8px;
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(to bottom, #167a16, #171787); /* Green to blue */
  border-radius: 8px;
}

::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(to bottom, #167a16, #171787);
}