@tailwind base;
@tailwind components;
@tailwind utilities;
:root {
--foreground-rgb: 31, 41, 55;
--background-start-rgb: 255, 255, 255;
--background-end-rgb: 255, 255, 255;
}
@media (prefers-color-scheme: dark) {
:root {
--foreground-rgb: 249, 250, 251;
--background-start-rgb: 15, 23, 42;
--background-end-rgb: 15, 23, 42;
}
}
body {
color: rgb(var(--foreground-rgb));
background: linear-gradient(
to bottom,
transparent,
rgb(var(--background-end-rgb))
)
rgb(var(--background-start-rgb));
margin: 0;
padding: 0;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
#root {
width: 100%;
height: 100%;
}
::-webkit-scrollbar {
width: 8px;
height: 8px;
}
::-webkit-scrollbar-track {
background: transparent;
}
::-webkit-scrollbar-thumb {
background: rgba(156, 163, 175, 0.5);
border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
background: rgba(107, 114, 128, 0.7);
}
.dark ::-webkit-scrollbar-thumb {
background: rgba(75, 85, 99, 0.5);
}
.dark ::-webkit-scrollbar-thumb:hover {
background: rgba(107, 114, 128, 0.7);
}
input[type="range"] {
-webkit-appearance: none;
appearance: none;
}
input[type="range"]::-webkit-slider-thumb {
-webkit-appearance: none;
appearance: none;
width: 16px;
height: 16px;
background: #3b82f6;
cursor: pointer;
border-radius: 50%;
}
input[type="range"]::-moz-range-thumb {
width: 16px;
height: 16px;
background: #3b82f6;
cursor: pointer;
border-radius: 50%;
border: none;
}
.dark input[type="range"]::-webkit-slider-thumb {
background: #60a5fa;
}
.dark input[type="range"]::-moz-range-thumb {
background: #60a5fa;
}