.view-tabs-links {
  align-self: stretch;
}

.view-tabs-links__nav-item {
  font-size: 16px;
  display: flex;
}

.view-tabs-links__nav-item:focus {
  outline: none;
}

.view-tabs-links__nav-item a {
  color: var(--text-primary-nav);
  position: relative;
  padding: 0.375rem 0.75rem;
  display: flex;
  align-items: center;
}

.view-tabs-links__nav-item a::after {
  background-color: var(--color-primary);
  content: '';
  position: absolute;
  bottom: -1px;
  left: 50%;
  width: 2.5em;
  height: 2px;
  border-radius: 0 1px 1px 0;
  transform: translateX(-50%) scale(0);
  transform-origin: 50% 100%;
  transition: 0.14s transform cubic-bezier(0.12, 0.32, 0.54, 1);
}

.view-tabs-links__nav-item a.active,
.view-tabs-links__nav-item a:hover {
  color: var(--color-primary-active);
  text-decoration: none;
}

.view-tabs-links__nav-item a.active::after {
  transform: translateX(-50%) scale(1);
  transition-timing-function: cubic-bezier(0.12, 0.32, 0.54, 1.5);
}
