@import 'compass';

$link_color: #2683B8;
$gray: #f1f1f1;
$gray_darker: #ececec;
$gray_darkest: #dddddd;
$black: #333333;

.quicktabs-style-commons-tabs {

  ul.quicktabs-tabs {
    margin: 0;
    padding: 0;
    position: relative;
    top: 1px;

    .block-content & {
      padding: 0;
    }

    li {
      display: inline-block;
      padding: 0;
      margin: 0 5px 0 0;

      a {
        background-color: $gray_darkest;
        border: 1px solid $gray_darkest;
        @include border-radius(3px 3px 0 0);
        padding: 10px;
        display: block;
        font-size: 1.1em;
        color: $link_color;

        &:hover {
          text-decoration: none;
        }

        span {
          background: $gray_darkest;
          font-size: 1.1em;
          line-height: 1.1em;
          color: lighten($black, 10%);
          font-style: italic;
          display: inline-block;
          padding: 2px 6px;
          border: 1px solid darken($gray_darkest, 10%);
          @include border-radius(3px);
          margin-left: 2px;
        }
      }

      &.active a {
        background-color: $gray;
        color: $black;
        border-bottom-color: $gray;

        span {
          // color: #fff;
        }
      }
    }
  }

  .quicktabs-tabpage {
    border: 1px solid $gray_darkest;
    background-color: $gray;
    @include border-radius(0 3px 3px 3px);
    padding: 10px
  }

  table {
    margin-top: 0;
    border: none;
  }

  td {
    padding: 10px 7px;
  }

  tbody tr {
    border-top: none;
  }

  tr {
    background: none;

    &.odd {
      background: none;
    }

    &.even {
      background: $gray_darker;
    }

    &.even, &.odd {
      border-bottom: 1px dashed $gray_darkest;

      &.views-row-last {
        border-bottom: none;
      }

      & td.active {
        background: none;
      }
    }
  }
}
