.oc-nav-pinned-item.pf-c-nav__item {
  display: flex;

  .pf-c-nav__link {
    display: block;
    flex-grow: 1;
    overflow: hidden;
    padding-right: 0;
    position: relative;
    text-overflow: ellipsis;
    white-space: nowrap;

    &:hover, &:focus {
      .oc-nav-pinned-item__unpin-button {
        .oc-nav-pinned-item__icon {
          opacity: 1;
        }
      }
    }
  }

  .oc-nav-pinned-item__unpin-button {
    background-color: var(--pf-c-nav--m-dark__item--BackgroundColor);
    padding-bottom: 0;
    padding-top: 0;
    position: absolute;
    right: 0;

    .pf-m-current & {
      background-color: var(--pf-c-nav--m-dark__item--m-current--BackgroundColor);
    }

    .oc-nav-pinned-item__icon {
      opacity: 0;
    }

    &:hover, &:focus {
      .oc-nav-pinned-item__icon {
        opacity: 1;
      }
    }
  }
}
