// Base extends (Merge with main stylesheet later)
.light-button, a.light-button {
  @include box-shadow(inset 0 1px 0 #fff);
  @include linear-gradient(#fff, lighten(#888, 40%));
  @include border-radius(3px);
  border: 1px solid #ccc;
  padding: 4px 8px;
  color: #666;
  font: normal $body-font-size $body-font-family;
  text-decoration: none;
  cursor: pointer;
  -webkit-font-smoothing: antialiased;

  &:hover, &:focus {
    @include linear-gradient(#fff, lighten(#888, 37%));
    border: 1px solid #ccc;
    text-decoration: none;
  }

}
.action-link {
  a {
    color: $mit-red;

    &:hover {
      text-decoration: none;
      color: darken($mit-red, 20%);
    }
  }
}

// Layout
body.askbot {

  section.main-content {
    div.discussion-wrapper {
      @extend .table-wrapper;

      div.discussion-content {
        @include box-sizing(border-box);
        display: table-cell;
        min-width: 650px;
        padding: lh();
        vertical-align: top;
        width: flex-grid(9) + flex-gutter();

        a.tabula-rasa, .tabula-rasa{
          @extend .light-button;
          @include border-radius(5px);
          display: block;
          margin: 10px auto;
          padding: 20px;
          text-align: center;
          width: flex-grid(5);
          text-decoration: none;
          color: #888;
          font-weight: bold;

          &:first-child {
            margin-top: 70px;
          }

          &:last-child {
            margin-bottom: 70px;
          }

        }
      }
    }
  }

}

// Autocomplete
.acInput {
  width: 200px;
}
.acResults {
  background-color: #fff;
  border: 1px solid #ababab;
  overflow: hidden;
  padding: 0px;
  @include box-shadow(0 2px 2px #bbb);

  ul {
    list-style-position: outside;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
  }

  li {
    cursor: pointer;
    display: block;
    font: menu;
    margin: 0px;
    overflow: hidden;
    padding: 5px 10px;
    text-align: left;
    border-top: 1px solid #eee;
    width: 100%;
  }
}

.acLoading {
  background : url('../images/indicator.gif') right center no-repeat;
}

.acSelect {
  background-color: $mit-red;
  color: #fff;
}
