$toc-margin-escape: 15px;

.nav-links {
  list-style: none;
  margin: 0px;

  .nav-link-item {
    float: left;
    margin-left: 20px;
    &:first-child {
      margin-left: 0px;
    }
  }
}

.toc {
  .toc-sections {
    background-color: lighten($color-black, 5%);
    margin-left: -$toc-margin-escape;
    margin-right: -$toc-margin-escape;
    margin-top: -$toc-margin-escape;
    padding: $toc-margin-escape;
  }

  .toc-heading {
    position: relative;
  }

  .toc-sections-expand {
    @extend .ui-plus_alt_16x16;
    @include transition-property(transition);
    @include transition-duration(1s);
    cursor: pointer;
    position: absolute;
    right: 12px;
    text-indent: -9999px;
    top: 11px;
    &:hover {
      @include rotate(180deg);
    }
    &.active {
      @include rotate(90deg);
    }
  }

  .toc-sections {
    display: none;
  }

  .toc-section {
    &:hover {
      background-color: $color-black;
      margin-left: -$toc-margin-escape;
      margin-right: -$toc-margin-escape;
      padding-left: $toc-margin-escape;
      padding-right: $toc-margin-escape;
    }

    a {
      font-size: ms(1);
    }
  }
}

@each $section in getting_started, stylesheets, markup,
design_patterns, anti_patterns, ruby_on_rails, boilerplates,
libraries, tools {
  body.guides_#{$section} {
    .toc-section.#{$section} {
      background-color: #000;
      margin-left: -$toc-margin-escape;
      margin-right: -$toc-margin-escape;
      padding-left: $toc-margin-escape;
      padding-right: $toc-margin-escape;
    }
  }
}
