@import 'color.less'; 
.previewMission-unitTest {
  padding: 20px;
  .qDes {
    font-weight: bolder;
  }
  .qtype {
    border: 2px solid gray;
  }
  input[type="text"] {
    width: 100px;
    margin-right: 10px;
    padding: 0px 5px;
    border-radius: 5px 5px 0px 0px;
    color: @primary;
    font-size: 20px;
    border: none;
    border-bottom: 1px solid gray;
    &:focus {
      outline: none;
      border-bottom: 2px solid @primary;
    }
  }
  .checker {
    margin-top: -20px;
  }
  .unitTestBtn {
    display: block !important;
    margin: 0px;
    width: 90% !important;
   
    .unitTestbg {
      cursor: pointer;
      padding: 5px 10px;
      background-color: #fff;
      border-radius: 4px;
      border: 1px solid rgb(143, 143, 143);
    }

    input[type="checkbox"],
    input[type="radio"] {
      visibility: hidden;
      margin-left: -10px;

      &:checked {
        ~ .unitTestbg {
          background-color: rgb(36, 184, 128) !important;
          border: none;
          color: #fff;
          font-weight: bolder;
        }
      }
    }
  }
  .yesNoBtn {
    display: inline-block !important;
    width: 90px !important;
    height: 100px;
    margin: 10px;
    margin-bottom: 40px;

    .unitTestbg {
      text-align: center !important;
      position: relative;
      border-radius: 50%;

      font-weight: 900;
      font-size: 50px;
    }
  }
  .testbg {
    background-color: #fff;
    position: relative;
    height: auto !important;
    padding: 10px;
    z-index: 1;
    border-radius: 4px;
    border: 1px solid rgb(197, 197, 197);
  }
}
.pageCtl2 {
  z-index:1;
  button {
    text-align: center;
    background: #dcdcdc;
    height: 30px;
    width: auto;
    padding: 5px 10px;
    margin-right: 10px;
    color: rgb(106, 101, 101);
    border-radius: 4px;
    border: none;
    cursor: pointer;
    outline: none;
    font-weight: 900;
    
  }
  .hintClick {
    background-color: #64ae16 !important;
    color: white;
    border: none;
  }
}
.questionCtl{
  position: absolute;
  right: 30px;
  bottom: 20px;
}
.unitTest-result {
  .testResult-title{
    margin-top:20px;
  }
  padding: 20px;
  text-align: center;
  .ansSheet {
    margin: 40px auto;
    border-collapse: separate;
    border-spacing: 0px;
    font-weight: 500;
    
    th {
      border-top: 1px solid rgba(117, 117, 117, 0.726); 
      border-bottom: 1px solid rgba(117, 117, 117, 0.726); 
      border-left: 1px solid rgba(117, 117, 117, 0.726);
      font-weight: 500;
      font-size: 14px;
      padding: 2px 20px;
      height: 30px;
      &:first-child {
        border-top-left-radius: 4px;
      }
      &:last-child {
        border-top-right-radius: 4px;
        border-right: 1px solid rgba(117, 117, 117, 0.726);
      }
    }

    td {
      background-color: #fff;
      border-bottom: 1px solid rgba(117, 117, 117, 0.726); 
      border-left: 1px solid rgba(117, 117, 117, 0.726);
      font-weight: 500;
      padding: 6px 10px;
      text-align: center;
      &:first-child {
        border-bottom-left-radius: 4px;
      }
      &:last-child {
        border-bottom-right-radius: 4px;
        border-right: 1px solid rgba(117, 117, 117, 0.726);
      }
    }
  }
  .yourAnsResultIcon {
    height: 40px;
    width: 40px;
    margin-top: 5px;
  }
}
.previewNextItemArea{
  margin-top:20px;
  padding: 20px;
  text-align: center;
  button {
    text-align: center;
    background: #dcdcdc;
    height: 30px;
    width: auto;
    padding: 5px 10px;
    margin-right: 10px;
    color: rgb(106, 101, 101);
    border-radius: 4px;
    border: none;
    cursor: pointer;
    outline: none;
    font-weight: 900;
    
  }
  .list-item-icon{
    margin-top:10px;
    font-size: 48px;
  }
  .nextItemTitle{
    font-weight: bolder;
    padding:10px 0px 30px 0px;
    .typeMark{
      text-align: center;
      background-color: @titleMarkbgc;
      border-radius: 10px;
      padding:2px 10px;
    }
  }
}
