/*
 * Component: Products List
 * ------------------------
 */
.tasks-list,
.products-list {
  list-style: none;
  margin: 0;
  padding: 0;
  > .item {
    .border-radius(@box-border-radius);
    .box-shadow(@box-boxshadow);
    .clearfix();
    padding: 10px 0;
    background: #fff;
  }
  .task-img,
  .product-img {
    float: left;
    img {
      width: 50px;
      height: 50px;
    }
  }
  .task-info {
      font-size: 12px;

      @media only screen and (min-device-width : 0px) and (max-device-width : 229px) {
        font-size: 6px;
      }

      @media only screen and (min-device-width : 230px) and (max-device-width : 299px) {
        font-size: 9px;
      }

      @media only screen and (min-device-width : 300px) and (max-device-width : 360px) {
        font-size: 11px;
      }
  }
  .product-info {
    margin-left: 60px;
  }
  .task-title,
  .product-title {
    font-weight: 600;
  }
  .task-title > a > p {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .task-description,
  .product-description {
    display: block;
    color: #999;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .task-description {
    .done {
      color: @green;
    }
    .pending {
      color: @red;
    }
  }
}

.product-list-in-box {
  h4 {
    font-size: 14px;
    strong {
      font-weight: 600;
    }
  }
}

.task-list-in-box > .item,
.product-list-in-box > .item {
  .box-shadow(none);
  .border-radius(0);
  border-bottom: 1px solid @box-border-color;
  &:last-of-type {
    border-bottom-width: 0;
  }
}