.uss-tabs {
  &__tablist {
    display: flex;
    list-style: none;
    flex-wrap: nowrap;
    margin: 0;
    margin-bottom: -2px;
    overflow: auto;

    border-bottom: 1px solid var(--border-subtle);
    max-height: 68px;
  }
  &__tab {
    @extend .uss-btn;
    color: var(--text-interactive-subtle);
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 600;
    font-size: 1rem;
    line-height: 28px;
    column-gap: 8px;
    border: 0;
    margin: 0;
    background-color: transparent;
    padding: 1rem;

    &:hover {
      color: var(--text-interactive-subtle-hover);
      border-bottom: 2px solid var(--border);
    }

    &:active {
      color: var(--text-interactive);
      border-bottom: 2px solid var(--border-interactive);
    }

    &.active {
      color: var(--text-interactive-active);
      border-bottom: 2px solid var(--border-interactive);
    }

    &[aria-selected='false'] {
      color: var(--text-interactive-subtle);
    }

    &[aria-selected='true'] {
      margin-top: 0;
      color: var(--text-interactive-active);
      border-bottom: 2px solid var(--border-interactive);
    }
    &:focus {
      outline-offset: -6px;
    }
  }

  &__tabpanel {
    padding: 20px;
    min-height: 10em;
    width: 100%;
    overflow: auto;

    &.is-hidden {
      display: none;
    }
  }
  &__tabpanel p {
    margin: 0;
  }
}