.list {
  border: 1px solid #d8d8d8;
  margin-bottom: 20px;
  position: relative;

  .list_head {
    border-bottom: 1px solid #ccc;
    padding: 0 5px;
    height: 32px;
    line-height: 30px;
    font-size: @normalFont;
    color: @grey;
    background-color: whitesmoke;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 1.0);

    img.avatar {
      vertical-align: top;
      margin: 4px 0 0 0;
    }
    
    .actions {
      float: right;

      & > a {
        margin: 0 0 0 5px;
        padding: 0 5px 0 0;
        border-right: 1px solid #ccc;
      }
    }

    &.diff-range {
      padding-top: 5px;
      display: none;
      &.displayed {
        display: block;
      }
      background-color: #ECECEC;
      select {
        width: 350px;
      }
    }
  
    &.scroll {
      position: absolute;
      top: 0;
      width: @webWidth - 12px;
      border-color: #ccc;
      border-style: solid;
      border-width: 0 1px 1px 0;

      &.fixed {
        position: fixed;
        top: 0;
        z-index: 1;
        .box-shadow (0, 2px, 5px, 10%);
      }
    }

    span.title {
      color: @grey;
      font-weight: bold;

      &+span {
        padding-right: 20px;
      }
    }

    ul.dropdown-status {
      margin: 2px 0 0 5px;

      .dropdown-toggle {
        line-height: 30px;
      }

      .ricon {
        color: #fff;
        margin: 0;
      }
    }

    .ricon {
      font-size: 30px;
      color: #aaa;
      margin-right: 5px;
      &.toggle-diff-range {
        font-size: 20px;
      }
    }

    .status {
      margin-right: 5px;
      
      & > a {
        display: inline-block;
        width: 23px;
        height: 23px;
        text-align: left;
        text-indent: -9999px;
        margin-top: 4px;

        &.status-valid { background: url('../images/accept.gif') 0 0 no-repeat; }

        &.status-invalid { background: url('../images/cancel.gif') 0 0 no-repeat; }
      }
    }
  }

  .list_body {

    &.scrollable {
      max-height: 228px;
      overflow-y: scroll;
    }

    table {
      width: 100%;
      color: @blue;

      h3 {
        display: inline-block;
        font-family: @technicalFontFamily;
        color: @grey;
        a {
          color: @blue;
        }
      }

      tr {
        vertical-align: middle;
        border-bottom: 1px solid #EBEBEB;
        line-height: 24px;

        &.no-border { border: none; }
        &:nth-child(odd) { background-color: white; }
        &:hover { background-color: @lightHover; }

        &.path_directory {
          color: @grey;
          background-color: #EBEBEB;

          &:hover {
            background-color: #EBEBEB;
          }
        }
        
        &.done {
          opacity: 0.4;
        }

        td {
          padding: 3px 5px;
          &.padding-left { padding-left: 10px; }
          &.padding-right { padding-right: 10px; }

          &.state {
            background-color: #f5f5f5;
            line-height: 24px;
            padding-left: 0;
            padding-right: 0;
            width: 22px;
            font-size: 20px;
            text-align: center;
            &.state_A,
            &.state_M,
            &.state_D {
              color: #aaa;
            }
          }

          &.status {
            width: 25px;
            line-height: 24px;
            padding: 0 10px;
            text-align: center;

            & > a {
              display: inline-block;
              width: 23px;
              height: 23px;
              text-align: left;
              text-indent: -9999px;

              &.status-valid { background: url('../images/accept.gif') 0 0 no-repeat; }
              &.status-invalid { background: url('../images/cancel.gif') 0 0 no-repeat; }
              &.status-blacklist { background: url('../images/stop.gif') 0 0 no-repeat; }
            }

            &.minified {
              width: 75px;
            }
          }


          & span.commit_desc {
            color: @grey;
            text-align: left;
            font-size: @normalFont;
            font-weight: normal;
          }

          &.repository_infos {
            color: #777;
            text-align: center;
            font-size: @smallFont;
            width: 26px;
            background-color: #f5f5f5;
            border-right: 1px solid #ccc;
          }

          &.file_infos {
            color: #777;
            text-align: center;
            font-size: @smallFont;
            background-color: #f5f5f5;
            width: 48px;

            span {
              display: inline-block;
              line-height: 12px;
              width: 34px;
              font-weight: bold;
              background-color: white;
              border: 1px solid #ccc;
              .box-shadow (0, 0, 1px, 0.2);
              padding: 2px 5px;
              .radius (3px);

              &.added { color: #73ab00; }
              &.modified { color: #4183C4; }
              &.deleted { color: #c20000; }
            }
          }

          &.branch_infos {
            color: #777;
            text-align: right;
            font-size: @smallFont;
            background-color: #f5f5f5;
            width: 200px;
            padding-right: 10px;

            span {
              display: inline-block;
              text-align: center;
              line-height: 12px;
              width: 34px;
              font-weight: bold;
              background-color: white;
              border: 1px solid #ccc;
              .box-shadow (0, 0, 1px, 0.2);
              padding: 2px 5px;
              .radius (3px);

              &.added { color: #73ab00; }
              &.modified { color: #4183C4; }
              &.deleted { color: #c20000; }
            }
          }

          &.branch_ago {
            color: @lightGrey;
            font-size: @smallFont;
            text-align: right;
            padding-right: 8px;
          }

          &.view_infos {
            text-align: right;

            .ricon {
              color: @grey;
            }
            .ricon0 {
              color: #CCC;
            }
          }

          &.file_name {
            .ricon {
              color: #4a3;
              font-size: 21px;
              margin-right: 3px;
            }
          }

          &.branch_name {
            white-space: nowrap;

            .new {
              background-color: #4183c4;
              color: #fff;
              padding: 3px 7px;
              .radius(15px);
            }
          }
        }
      }
    }
  }

  .list_footer {
    background-color: whitesmoke;
    color: @grey;
    font-size: @normalFont;
    height: 32px;
    line-height: 30px;
    padding: 0 5px;
    text-align: center;

    a {
      color: @blue;
    }
  }

  #log {
    td {
      color: @grey;
      &.code {
        cursor: help;
      }
      &.date {
        color: @lightGrey;
        width: 130px;
      }
    }

    tr {
      &.error {
        .command,
        .date {
          background-color: #fcd;
        }
        .code {
          color: @red + #222;
          font-weight: bold;
        }
      }
    }
  }

  #file_list {
    h3 {
      font-weight: normal;
      font-size: 12px;
    }
  }

  &.notifier {
    .status_info {
      line-height: 25px;
      background-color: whiteSmoke;
      border-right: 1px solid #EEE;

      a { font-weight: bold; }

      .date {
        font-size: @smallFont;
        color: @lightGrey;
        white-space:nowrap;
      }
    }

    .status_content {
      line-height: 25px;

      .message {
        color: @grey;
      }

      .path {
        font-family: @technicalFontFamily;
        font-size: @smallFont;
        color: @grey;
        a { color: @blue; }
      }
    }
  }

  .dropdown-status {
    font-size: 30px;

    a { text-decoration: none }
    li.dropdown {
      width: 30px;
      text-align: center;

      .dropdown-toggle {
        &.ricon.invalidate { color: #ff686e }
        &.ricon.validate { color: #90d48b }
        &.ricon.todo { color: #aaa; }
      }

      &.open {
        color: white;
        background-color: @grey;
        .radius-top (3px);

        .dropdown-toggle {
          &.ricon {color: white;}
        }
      }

      .ricon {
        font-size: 30px;
        line-height: 30px;

        &.todo {
          font-size: 20px;
        }
      }

      &.open {
        color: white;
        background-color: @grey;
        .radius-top (3px);

        .dropdown-toggle { color: white }
      }

      .dropdown-toggle { color: @grey }

      ul.dropdown-menu {
        color: white;
        background-color: @grey;
        .radius-bottom(3px);
        .box-shadow(2px, 5px, 10px, 0.4);

        li { cursor: pointer }
      }
    }
  }
}
