@import (reference) "_vars.less";

.dictionary {
  border-collapse: collapse;
}

.list {
  list-style: none;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.list-collapsable-content {
  display: none;
  box-sizing: border-box;
  background-color: @grey80;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 10px;
  padding-right: 10px;

  .expanded & {
    display: flex;
  }

  & div {
    box-sizing: border-box;
  }
}

.list-collapsable-item {
  background-color: @grey100;
  display: block;
  cursor: pointer;
  margin-bottom: 10px;
  box-sizing: border-box;
}

.list-collapsable-title {
  font-size: 12px;
  line-height: 25px;
  box-sizing: border-box;
}

.list-enableDisable .disabled {
  opacity: 0.5;
}

.dependent-get {
  opacity: 0.8;
}

.seq.seq-dependent-get {
  margin-bottom: 0;
}

.hook-success {
  margin-left: -1px;
  border-left: 1px solid @base0B;
}

.hook-ensure {
  margin-left: -1px;
  border-left: 1px solid @base0E;
}

.hook-failure {
  margin-left: -1px;
  border-left: 1px solid @base08;
}

.hook-abort {
  margin-left: -1px;
  border-left: 1px solid @base0F;
}

.hook-error {
  margin-left: -1px;
  border-left: 1px solid @base09;
}

.aggregate {
  margin-left: -1px;
  border-left: 1px solid @grey10;
}

.parallel {
  margin-left: -1px;
  border-left: 1px solid @grey10;
}

.children {
  margin-left: 1em;
}

.children > .hook {
  margin-bottom: 0;
}

.pagination-handle {
  width: 25px;
  text-align: center;
  font-size: 16px;
  display: block;
  line-height: 25px;
}

.pagination-handle-flush {
  width: auto;
}

.inputs .resource-name,
.outputs .resource-name {
  font-weight: bold;
}

.jobs-builds-list .resource {
  background-color: @grey100;
}

.jobs-builds-list {
  * {
    box-sizing: border-box;
  }

  .build-duration {
    float: left;
    width: 15%;
    margin-right: 1em;
  }

  .inputs,
  .outputs {
    float: left;
    width: 40%;
  }

  .build-resources {
    border-collapse: collapse;
    width: 100%;
  }

  .build-resources .dictionary {
    float: right;
  }

  .build-duration .dict-value {
    width: 100%;
  }

  .resource-name {
    margin: 0;
    padding: 0 15px 0 0;
  }

  .resource-version {
    width: 100%;
    padding: 0;
    margin: 0;
  }

  @media (max-width: 1200px) {
    .inputs,
    .outputs,
    .build-duration {
      width: 100%;
    }

    .resource-version {
      padding-left: 0;
    }
  }
}
