// Lists
//
// Default list markup
//
// Markup:
// <ul>
//  <li>Default list</li>
// </ul>
// <ul>
//  <li>List</li>
//  <ul>
//    <li>Nested List</li>
//  </ul>
// </ul>
// <ul class="list-unstyled">
//  <li>Unstyled list</li>
// </ul>
// <ul class="list-bullet">
// 	<li>Bulleted list</li>
// </ul>
// <ol class="list-decimal">
// 	<li>Decimal list</li>
// </ol>
// <ul class="list-nested">
//  <li>List</li>
//  <ul>
//    <li>Nested List</li>
//  </ul>
// </ul>
//
// Styleguide elements.lists

ol,
ul {
  padding-left: $base-padding;
  margin-bottom: $base-padding;
}

ul {
  list-style-type: disc;

  ul {
    list-style-type: square;
    margin-bottom: 0;

    ul {
      list-style-type: circle;
      margin-bottom: 0;
    }
  }
}

li {
  padding-bottom: $base-padding-lite;
}

.list-unstyled {
  list-style-type: none;
  padding-left: 0;
}

%list-indented {
  margin-bottom: 1em;
  margin-left: 0;
  margin-right: 0;
  padding-left: $base-padding;
}

.list-square {
  @extend %list-indented;

  list-style-type: square;

  li {
    padding-bottom: $base-padding-lite;
  }
}

.list-bullet {
  @extend %list-indented;

  list-style-type: disc;

  li {
    padding-bottom: $base-padding-lite;
  }
}

.list-columns {
  ul {
    column-count: 2;
    list-style: none;

    @include respond-to(medium-up) {
      column-count: 3;
    }
  }

}

.list-decimal {
  @extend %list-indented;

  list-style-type: decimal;

  li {
    padding-bottom: $base-padding-lite;
  }
}

ul {
  font-weight: $weight-light;
}

.list-nested {
  @extend .list-bullet;

  ul {
    @extend .list-square;
  }
}

.list-sections {
  li {
    padding-bottom: $base-padding;
  }
}
