@import "woople-theme/variables.css.less";
@import "woople-theme/colours.css.less";

.outline {
  border-bottom:solid 1px fade(@contentBorder, 35%);

  h2 {
    .outline-title();
  }

  .assessment {
    margin-top:@contentPadding / 2;
    position:relative;

    -webkit-perspective: 2000px;
    -moz-perspective: 2000px;

    h3 {
      .content-title();
      padding:@contentPadding / 2;
      padding-bottom:0;
    }

    h4 {
      .outline-title();
    }

    .assessment-attributes {
      padding:@contentPadding / 2;
    }

    .alert {
      margin:@contentPadding / 2;
    }

    .badge {
      .woople-badge();
    }

    .assessment-start {
      .btn {
        margin:@contentPadding / 2;
      }
    }

    .assessment-pad {
      .nav-tabs {
        margin-bottom: 0;

        li:first-child {
          margin-left: 10px;
        }

        a {
          outline: 0;
        }
      }

      .tab-content.completed {
        background-image:url(/assets/woople-theme/completed-triangle.png);
        background-position:top right;
        background-repeat:no-repeat;
      }

      .tab-content {
        background: white;
      }

      .assessment-history {
        a {
          color: @primary;
        }
      }
    }

    .outline {
      border:none;
    }
  }

  tr.completed {
    .action {
      display:none;
    }
  }

  .disabled td {
    .opacity(50);

    a:hover {
      text-decoration:none;
    }

    .action {
      display:none;
    }

  }

  tr.disabled {
   &:hover {
     td {
       background:none;
     }
   }

   td {
      background-color:transparent;
      text-shadow:none;
      color:@primaryTextColour;

      a {
        color:@primaryTextColour;
      }

      .action {
        display:none;
      }
    }
  }

  table {
    margin-bottom:0;

    th {
      color: @secondaryTextColour;
    }

    th, td {
      padding:@tableCellPadding;
      border-top:none;
      a {
        color:@primaryTextColour;
      }
    }

    .count {
      width:75px;
    }

    th {
      border-top:none;
    }

    tr > td:first-child, tr > th:first-child {
      padding-left:@contentPadding;
      width:@gridGutterWidth + @imageWidth - (@tableCellPadding * 2);
    }

    .action {
      display:block;
    }

    tr:hover {
      td {
        background-color:@highlightBackground;
      }
    }
  }
}

@media (max-width: 767px) {
  .outline {
    table {
      tr > td:first-child, tr > th:first-child {
        padding-left:@phoneMargin;
        text-indent:@phoneMargin * 1.5;

        > *:first-child {
          text-indent:0;
          margin-left:@phoneMargin;
        }

      }

    }

    h2 {
      .outline-title(@phoneLeftColumnOffset);
    }

    > p {
      padding-left:@phoneLeftColumnOffset;
      padding-right:@phoneMargin;
    }

    .assessment {
      .assessment-history {
        table tr > td:first-child, tr > th:first-child {
          text-indent:0;
        }
      }
    }
  }
}