.ias-nav {
  align-items: center;
  background-color: $nav-bg-color;
  color: $nav-text-color;
  display: flex;
  flex-flow: row nowrap;
  min-height: $nav-height;
  padding: 0 $nav-content-padding;

  > a,
  > button,
  > .ias-button {
    @include single-line;

    background-color: transparent;
    border: solid transparent;
    border-width: $nav-item-border-vertical-width $nav-item-border-horizontal-width;
    border-radius: 0;
    box-sizing: border-box;
    color: inherit;
    display: block;
    flex: none;
    line-height: $nav-height - (2 * $nav-item-border-vertical-width);
    height: $nav-height;
    padding: 0 $nav-item-padding;
    margin: 0;

    > * {
      vertical-align: middle;
    }

    &:focus,
    &:hover {
      background-color: $nav-item-bg-color-hover;
      border-color: $nav-item-border-color-hover;
      color: $nav-item-color-hover;
      text-decoration: none;
    }

    &[disabled],
    &.ias-disabled {
      background-color: transparent;
      border-color: transparent;
      color: $nav-item-color-disabled;
    }

    &.ias-active {
      border-bottom-color: $nav-item-border-bottom-color-active;
      border-left-color: $nav-item-border-side-color-active;
      border-right-color: $nav-item-border-side-color-active;
      color: $nav-item-color-active;
      font-weight: $nav-item-font-weight-active;
    }
  }

  > span {
    &:not(.ias-fill) {
      @include single-line;

      max-width: $nav-text-max-width;
      padding: 0 5px;
    }
  }
}

[dir="rtl"] {
  .ias-nav {
    > a,
    > button,
    > .ias-button {
      margin: 0;
    }
  }
}