48 lines
1.0 KiB
CSS
48 lines
1.0 KiB
CSS
@import "tailwindcss";
|
|
|
|
@theme {
|
|
--font-sans: var(--font-inter), ui-sans-serif, system-ui, -apple-system, sans-serif;
|
|
--font-display: var(--font-outfit), ui-sans-serif, system-ui, -apple-system, sans-serif;
|
|
|
|
/* Premium dark mode palette accents */
|
|
--color-brand-purple: #8b5cf6;
|
|
--color-brand-blue: #3b82f6;
|
|
--color-brand-pink: #ec4899;
|
|
}
|
|
|
|
/* Enable class-based dark mode selector in Tailwind v4 */
|
|
@variant dark (&:where(.dark, .dark *));
|
|
|
|
@layer base {
|
|
html {
|
|
scroll-behavior: smooth;
|
|
}
|
|
|
|
body {
|
|
@apply bg-slate-50 text-slate-900 transition-colors duration-300;
|
|
}
|
|
|
|
body.dark {
|
|
@apply bg-slate-950 text-slate-50;
|
|
}
|
|
|
|
/* Sleek selection highlighting */
|
|
::selection {
|
|
@apply bg-purple-500/30 text-purple-200;
|
|
}
|
|
|
|
/* Scrollbar customization for a premium, non-default OS look */
|
|
::-webkit-scrollbar {
|
|
width: 8px;
|
|
height: 8px;
|
|
}
|
|
|
|
::-webkit-scrollbar-track {
|
|
@apply bg-transparent;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb {
|
|
@apply bg-slate-300 dark:bg-slate-800 rounded-full hover:bg-slate-400 dark:hover:bg-slate-700 transition-colors;
|
|
}
|
|
}
|