@tailwind base;
@tailwind components;
@tailwind utilities;
@layer base {
:root {
--background: 240 10% 3.9%;
--foreground: 0 0% 98%;
--card: 240 10% 4.9%;
--card-foreground: 0 0% 98%;
--popover: 240 10% 4.9%;
--popover-foreground: 0 0% 98%;
--primary: 217.2 91.2% 59.8%;
--primary-foreground: 222.2 47.4% 11.2%;
--secondary: 240 3.7% 15.9%;
--secondary-foreground: 0 0% 98%;
--muted: 240 3.7% 15.9%;
--muted-foreground: 240 5% 64.9%;
--accent: 240 3.7% 15.9%;
--accent-foreground: 0 0% 98%;
--destructive: 0 62.8% 30.6%;
--destructive-foreground: 0 0% 98%;
--border: 240 3.7% 15.9%;
--input: 240 3.7% 15.9%;
--ring: 217.2 91.2% 59.8%;
--radius: 0.75rem;
}
}
@layer base {
* {
@apply border-border selection:bg-primary/20 selection:text-primary-foreground;
}
body {
@apply bg-background text-foreground antialiased min-h-screen flex flex-col font-sans;
background-image: radial-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px);
background-size: 32px 32px;
}
}
/* Custom scrollbar */
::-webkit-scrollbar {
width: 8px;
height: 8px;
}
::-webkit-scrollbar-track {
background: hsl(var(--background));
}
::-webkit-scrollbar-thumb {
background: hsl(var(--muted));
border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
background: hsl(var(--muted-foreground) / 0.5);
}
/* Language Color Helpers */
.lang-typescript { color: #3178c6; }
.lang-javascript { color: #f7df1e; }
.lang-python { color: #3572A5; }
.lang-go { color: #00ADD8; }
.lang-rust { color: #dea584; }
.lang-java { color: #b07219; }
.lang-cpp, .lang-c\+\+ { color: #f34b7d; }
.lang-html { color: #e34c26; }
.lang-css { color: #563d7c; }
.lang-dot {
display: inline-block;
width: 8px;
height: 8px;
border-radius: 9999px;
}