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

:root {
  --glass-border: rgba(255, 255, 255, 0.1);
  --glass-bg: rgba(20, 20, 20, 0.6);
}

body {
  background-color: #000;
  color: #fff;
  font-family: 'Inter', sans-serif;
  overflow-x: hidden;
}

.vision-gradient {
  background: 
    radial-gradient(circle at 10% 20%, rgba(88, 28, 135, 0.4) 0%, transparent 40%),
    radial-gradient(circle at 90% 80%, rgba(59, 130, 246, 0.3) 0%, transparent 40%),
    radial-gradient(circle at 50% 50%, rgba(0, 0, 0, 1) 0%, rgba(10, 10, 10, 1) 100%);
  background-attachment: fixed;
}

.glass-panel {
  background: var(--glass-bg);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

.custom-scrollbar::-webkit-scrollbar {
  width: 6px;
}
.custom-scrollbar::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.05); 
}
.custom-scrollbar::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.2); 
  border-radius: 10px;
}
.custom-scrollbar::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.3); 
}