ul > li,
ol > li {
  margin-left: $spacing-unit;
}

dl > dt {
  font-weight: $font-weight-bold;
}

dd + dt {
  margin-top: $spacing-unit / 2;
}

%list-reset,
.list-reset {
  padding-left: 0;
  list-style: none;

  > li {
    margin-left: 0;
  }
}

%list-inline,
.list-inline {
  @extend %list-reset;

  margin-bottom: 0;
  margin-left: $spacing-unit / -4;
  letter-spacing: -4px;

  > li {
    display: inline-block;
    padding-right: $spacing-unit / 4;
    padding-left: $spacing-unit / 4;
    letter-spacing: 0;
  }
}

.list-divided {
  @extend %list-inline;

  > li {
    padding-right: $spacing-unit / 2;
    padding-left: $spacing-unit / 2;

    + li {
      border-left: 1px solid $color-ui;
    }
  }
}

%list-menu,
.list-menu {
  @extend %list-reset;

  margin-top: $spacing-unit / -4;

  > li > a {
    display: block;
    padding: ($spacing-unit / 4) ($spacing-unit / 2);
    text-decoration: none;
    border-radius: $ui-border-radius;

    &:hover {
      color: $list-menu-color;
      background: $list-menu-background;
    }

    @if $link-active {
      &:active {
        top: 0;
      }
    }
  }
}
