/* Custom styling overrides and dark mode glow tokens */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

:root {
  --color-bg: #0B0B1E;
  --color-surface: #16162D;
  --color-surface-light: #1E1E3F;
  --color-primary: #7C5CFC;
  --color-primary-hover: #6D4EE0;
  --color-secondary: #2D2D5F;
  --color-border: #26264D;
}

body {
  font-family: 'Inter', sans-serif;
  background-color: #0B0B1E;
  color: #FFFFFF;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

/* Custom Scrollbar for dark theme */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: #0E0E22;
}
::-webkit-scrollbar-thumb {
  background: #26264D;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #7C5CFC;
}

/* Animations */
@keyframes fadeIn {
  from { opacity: 0; transform: scale(0.98); }
  to { opacity: 1; transform: scale(1); }
}

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

/* Glow utility effects */
.glow-primary {
  box-shadow: 0 0 25px rgba(124, 92, 252, 0.35);
}

.glow-card {
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.7), 0 0 40px rgba(124, 92, 252, 0.15);
}