// Styles for the Askbot sidebar

div.discussion-wrapper aside {
  @extend .sidebar;
  border-left: 1px solid #ccc;
  border-right: 0;
  width: flex-grid(3);
  border-radius: 0 3px 3px 0;

  &:after {
    left: -1px;
    right: auto;
  }

  &.main-sidebar {
    min-width:200px;
  }

  h1 {
    margin-bottom: 0;
  }

  h2 {
    color: #3C3C3C;
    font-size: 1em;
    font-style: normal;
    font-weight: bold;
    margin-bottom: 1em;

    &.first {
      margin-top: 0px;
    }
  }

  h3 {
    border-bottom: 0;
    box-shadow: none;
  }

  div.inputs {
    input[type="submit"] {
      width: 27%;
      float: right;
      text-align: center;
      padding: 4px 0;
      text-transform: capitalize;
    }

    input[type="text"] {
      width: 62%;
    }
  }

  div.box {
    display: block;
    padding: 18px 26px;
    border-top: 1px solid lighten($border-color, 10%);

    &:first-child {
      border-top: 0;
    }

    ul#related-tags {
      position: relative;
      left: -10px;

      li {
        border-bottom: 0;
        background: #ddd;
        padding: 6px 10px 6px 5px;

        a {
          padding: 0;
          line-height: 12px;

          &:hover {
            background: transparent;
          }
        }
      }
    }

    &.contributors {

      a {
        @include border-radius(3px);
        border: 1px solid #aaa;
        cursor: pointer;
        display: inline-block;
        margin-right: 6px;
        position: relative;

        &:before {
          @include border-radius(3px);
          @include box-shadow(inset 0 0 1px 1px rgba(255,255,255,.4));
          top: 1px; left: 1px; bottom: 1px; right: 1px;
          content: '';
          position: absolute;
        }

      }
    }

    &.tag-selector {
     ul {
       margin-bottom: 10px;
       display: block;
     }
    }
  }

  div.search-box {
    margin-top: lh(.5);

    input {
      @include box-sizing(border-box);
      display: inline;
    }

    input[type='submit'] {
      background: url(../images/askbot/search-icon.png) no-repeat center;
      border: 0;
      @include box-shadow(none);
      margin-left: 3px;
      opacity: 0.5;
      padding: 6px 0 0;
      position: absolute;
      text-indent: -9999px;
      width: 24px;

      &:hover {
        opacity: 0.9;
      }

      &:focus {
        opacity: 1;
      }
    }

    input#keywords {
      padding-left: 30px;
      padding-right: 30px;
      width: 100%;
    }

    input#clear {
      background: none;
      border: none;
      @include border-radius(0);
      @include box-shadow(none);
      color: #999;
      display: inline;
      font-size: 12px;
      font-weight: bold;
      height: 19px;
      line-height: 1em;
      margin: {
        left: -25px;
        top: 8px;
      }
      padding: 2px 5px;
      text-shadow: none;
    }
  }

  div#tagSelector {
    ul {
      margin: 0;
    }

    div.inputs {
      margin-bottom: lh();
    }

    div#displayTagFilterControl {
      p.choice {
        @include inline-block();
        margin-right: lh(.5);
        margin-top: 0;
      }
    }

    label {
      font-style: normal;
      font-weight: 400;
    }
  }

  // Question view specific

  div.follow-buttons {
    margin-top: 20px;
    display: block;

    a.button {
      @include box-sizing(border-box);
      display: block;
      text-align: center;
      width: 100%;
    }
  }


  div.question-stats {
    border-top: 0;

    ul {
      color: #777;
      list-style: none;

      li {
        padding: 7px 0 0;
        border: 0;

        &:last-child {
          @include box-shadow(none);
          border: 0;
        }
        strong {
          float: right;
          padding-right: 10px;
        }
      }
    }
  }

  div.user-info, div.user-stats {
    @extend div.question-stats;
    overflow: hidden;

    div {
      float: left;
      display: block;
    }

    div.karma {
      border: 1px solid $border-color;
      @include box-sizing(border-box);
      padding: lh(.4) 0;
      text-align: center;
      width: flex-grid(1, 3);
      float: right;

      p {
        text-align: center;

        strong {
          display: block;
          font-style: 20px;
        }
      }
    }

    div.meta {
      width: flex-grid(2,3);
      padding-right: flex-gutter(3)*0.5;
      @include box-sizing(border-box);

      h2 {
        border: 0;
        @include box-shadow(none);
        margin: 0 0 8px 0;
        padding: 0;
      }

      p {
        color: #777;
        font-size: 14px;
      }
    }
  }

  div.user-stats {
    overflow: visible;

    ul {
      h2 {
        margin:0 (-(lh())) 5px (-(lh()));
        padding: lh(.5) lh();
      }
    }
 }

  div.question-tips, div.markdown {
    ul,
    ol {
      margin: 0;
      padding: 0;

      li {
        border-bottom: 0;
        line-height: lh();
        margin-bottom: em(8);
      }
    }
  }

  div.view-profile {
    border-top: 0;
    padding-top: 0;

    a {
      @extend .gray-button;
      @include box-sizing(border-box);
      display: block;
      text-align: center;
      width: 100%;
      margin-top: lh(.5);

      &:first-child {
        margin-top: 0;
      }

      span {
        font-weight: bold;
      }
    }
  }
}
