/* Keep the centered admin column in the same place when a tab is shorter
   than the viewport and the scrollbar appears or disappears. */
html {
  scrollbar-gutter: stable;
}

#tabs-wrapper {
  border-bottom: 1px solid var(--color-base-200);
}

html.dark #tabs-wrapper {
  border-bottom-color: var(--color-base-800);
}

#tabs-items > a {
  margin-bottom: -1px;
  padding: 0.5rem 0.875rem;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--color-base-500);
}

#tabs-items > a:hover {
  background: transparent;
  color: var(--color-primary-600);
}

#tabs-items > a.active {
  background: transparent;
  box-shadow: inset 0 -2px 0 var(--color-primary-600);
  color: var(--color-primary-600);
}

html.dark #tabs-items > a.active,
html.dark #tabs-items > a:hover {
  color: var(--color-primary-500);
}

html.dark #tabs-items > a.active {
  box-shadow: inset 0 -2px 0 var(--color-primary-500);
}