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

@import "bootstrap-icons/font/bootstrap-icons.css";

:root {
  /* slate-950 forced as default to prevent white flash */
  --background: #020617;
  --foreground: #f1f5f9;
}

body {
  color: var(--foreground);
  background-color: var(--background);
  font-family: inherit; /* Use Next.js font if defined, or system default */
}

/* Custom Scrollbar Styling */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: #020617; /* slate-950 */
}

::-webkit-scrollbar-thumb {
  background: #1e293b; /* slate-800 */
  border-radius: 10px;
  border: 2px solid #020617; /* adds padding effect */
}

::-webkit-scrollbar-thumb:hover {
  background: #334155; /* slate-700 */
}

/* Support for Firefox (limited) */
* {
  scrollbar-width: thin;
  scrollbar-color: #1e293b #020617;
}