.ds-tab-item {
  align-items: center;
  cursor: pointer;
  display: inline-flex;
  margin: 0 2rem 0 0;
}

.ds-tab-item__link {
  background: none;
  border-color: transparent;
  border-style: solid;
  border-width: 0 0 0.1875rem;
  color: var(--ds-color-london-5);
  font-family: var(--ds-type-system-sans-lining);
  font-size: var(--ds-type-scale-1);
  font-weight: 400;
  line-height: var(--ds-type-leading-lower);
  margin: 0;
  padding: 0.5rem 0 0.25rem;
  text-decoration: none;
  transition: background var(--ds-interactions-transition), border-color var(--ds-interactions-transition);
  &:hover {
    border-bottom-color: var(--ds-color-london-85);
  }
  &:focus {
    background: var(--ds-color-london-95);
    outline: solid transparent;
  }
  &:active {
    background: none;
    border-bottom-color: var(--ds-color-hong-kong-55);
  }
}

.ds-tab-item__link--selected {
  border-bottom-color: var(--ds-color-economist-red);
  font-weight: 700;
  &:hover {
    border-bottom-color: var(--ds-color-economist-red);
  }
  &:focus {
    background: var(--ds-color-london-95);
    outline: solid transparent;
  }
  &:active {
    background: none;
    border-bottom-color: var(--ds-color-hong-kong-55);
  }
}

@media (--ds-viewport-max-medium) {
  .ds-tab-item {
    .ds-tab-list--adjacent & {
      margin-bottom: 0.5rem;
    }
    &:first-child {
      .ds-tab-list--adjacent & {
        margin-top: 0.5rem;
      }
    }
  }
  .ds-tab-item__link--adjacent {
    border-width: 0 0 0 0.1875rem;
    padding-bottom: 0.4375rem;
    padding-left: 0.5rem;
    &.ds-tab-item__link--selected {
      border-left-color: var(--ds-color-economist-red);
      &:hover {
        border-left-color: var(--ds-color-economist-red);
      }
      &:active {
        border-left-color: transparent;
      }
    }
    &:hover {
      border-left-color: var(--ds-color-london-85);
    }
    &:active {
      border-left-color: var(--ds-color-hong-kong-55);
    }
  }
}

@media (--ds-viewport-min-medium) {
  .ds-tab-item {
    margin-right: 2.5rem;
  }
  .ds-tab-item__link {
    font-size: var(--ds-type-scale-2);
    line-height: var(--ds-type-leading-upper);
    padding: 0.75rem 0 0.375rem;
  }
}

@media (--ds-viewport-min-large) {
  .ds-tab-item__link:not(.ds-tab-item__link--minor) {
    border-width: 0 0 0.25rem;
    font-size: var(--ds-type-scale-3);
    line-height: var(--ds-type-leading-upper);
    padding: 1rem 0 0.5rem;
  }
}