@import "@fontsource-variable/schibsted-grotesk";
@import "./styles/tokens.css";

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

:root {
  color-scheme: light dark;
}

html,
body,
#root {
  height: 100%;
}

body {
  margin: 0;
  font-family: var(--sp-font);
  background: var(--sp-bg);
  /* The same text colour AppShell sets: dialogs are portalled onto <body>,
     outside it, and inherited the browser's black there — unreadable on the
     dark theme's dialog background. */
  @apply text-slate-900 dark:text-slate-100;
}

/* Custom scrollbar */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-thumb {
  background: rgba(148, 163, 184, 0.4);
  border-radius: 4px;
}