.list--unbulleted {
  list-style: none;
  padding-inline-start: 0;
}

.list--inline {
  list-style: none;
  padding-inline-start: 0;
  > li {
    display: inline-block;
    &:not(last-child) {
      margin-right: $spacing-3xs;
    }
  }
}
.list--inline-spaced {
  > li {
    &:not(last-child) {
      margin-right: $spacing-sm;
    }
  }
}

.list--buttons {
  list-style: none;
  padding-inline-start: 0;

  > li {
    display: inline-block;
    &:not(last-child) {
      margin-right: $spacing-2xs;
    }

    a, a:visited {
      padding: 0.25rem 0.55rem;
      background: $toolbar-button;
      color: #fff;
      @include typescale('sm', 'em');
      border-radius: 0.3rem;
      font-weight: 400;
      text-decoration: none;

      &.list--button-alt {
        background: $secondary;
      }

      &.list--button-light {
        background: $grey--light;
        color: $navy;
      }

      &.list--button-none {
        background: none;
        color: $navy;
        text-decoration: underline;
      }

      &.list--button-outline {
        background: none;
        color: $navy;
        box-shadow: inset 0 0 0 2px $primary;
      }

    }
  }

  &.list--buttons-light {
    > li {
      a, a:visited {
        background: $grey--light;
        color: $navy;
      }
    }
  }

  &.list--buttons-none {
    > li {
      a, a:visited {
        background: none;
        color: $navy;
        text-decoration: underline;
      }
    }
  }
}



.list--spaced {
  > li {
    padding-top: $spacing-xs;
    padding-bottom: $spacing-xs;
  }
}

.list--compact {
  > li {
    margin-bottom: 0;
  }
}

.list--spaced.list--inline {
  > li:not(last-child) {
    margin-right: $spacing-md;
  }
}

.list--icon-links {
  li {
    margin-bottom: 1em;
  }
  a {
    text-decoration: none;
  }
  .icon {
    margin-right: 0.5em;
  }
}