// List (supports reordering + typeahead) ----------------- */

.input-list {
  input {
    padding-left : 2em;
    margin-top   : .1em;
  }

  ul {
    line-height : 1.5;
    list-style  : none;
    padding     : 0;
    margin      : 0 0 0 2em;

    li {
      @include position(relative);
      @include user-select(none);

      a {
        font-size : .75em;
        color     : $formagic-assertive-color;
      }
    }
  }

  .slip-reordering {
    color : $formagic-positive-color;
  }

  .icon-reorder {
    height : 25px;
    width  : 25px;
    left   : -1.75em;

    &:before {
      left : 0;
      top  : 9px;
    }

    &:after {
      left : 0;
      top  : 14px;
    }
  }

  .twitter-typeahead {
    width: 100%;

    &:after {
      @include position(absolute, -3px null null 12px);
      font-size : 22px;
      content   : '+';
      display   : block;
      height    : 24px;
      width     : 40px;
      color     : darken($formagic-border-color, 5%);
    }
  }

  .tt-suggestions {
    background : rgba(255,255,255, .95);
    padding    : .1em .5em;
    margin     : 0 0 0 1.55em;
  }

  .tt-suggestion  {
    opacity : .5;
    cursor  : pointer;

    p {
      line-height : 1.5;
      margin      : 0;
    }

    &.tt-cursor {
      opacity : 1;
    }
  }
}