html,
body,
docs-app {
  width: 100%;
  margin: 0;
  padding: 0;
  background-color: #1a1a1a;
  color: #ffffff;
  overflow: auto;
}

html {
  scroll-behavior: smooth;
}

#header-main {
  font-family: "Lato", sans-serif;
  font-size: 3rem;
}

/* Universal Styling: Suitable for Dark Theme */
::-webkit-scrollbar {
  width: 4px; /* Width of the vertical scrollbar */
}

/* Track */
::-webkit-scrollbar-track {
  background: #2a2a2a; /* Darker background for contrast */
  border-radius: 2px;
}

/* Handle/Thumb */
::-webkit-scrollbar-thumb {
  background: #555; /* Dark gray thumb */
  border-radius: 2px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #888; /* Slightly lighter gray when hovered */
}

/* For Firefox */
body {
  scrollbar-width: thin;
  scrollbar-color: #555 #2a2a2a; /* thumb and track color */
}