/**
 * @file
 * Visual styles for tabs.
 */

div.tabs {
  margin-block: var(--space-4);
}
ul.tabs {
  margin: 0 0 var(--space-2);
  padding: 0;
  list-style: none;
}
.tabs > li {
  display: inline-block;
  margin-inline-end: var(--space-1);
}
.tabs a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: var(--space-2) var(--space-4);
  text-decoration: none;
}
.tabs a.is-active {
  background-color: var(--tabs-active-bg);
}
.tabs a:focus,
.tabs a:hover {
  background-color: var(--tabs-hover-bg);
}