@import '../../style/variables.less';

.wm-list-item-small {
  background: @color-white;
  border-radius: @border-radius-6;
  padding: 12px 24px;
  display: flex;
  flex-direction: row;

  .img {
    width: 160px;
    height: 160px;
    margin-right: 24px;
  }

  .info-box {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;

    .info-head {
      .title-box {
        display: flex;
        flex-direction: row;

        .title {
          font-size: 24px;
          line-height: 32px;
          word-break: break-all;
        }
      }

      .type-box {
        display: flex;
        flex-direction: row;
        margin-top: 8px;

        .type-color {
          color: rgba(0, 0, 0, 0.4);
          font-size: @font-size-10;
        }

        .size {
          color: rgba(0, 0, 0, 0.4);
          font-size: @font-size-10;
          margin: 0 4px;
        }

        .weight {
          color: rgba(0, 0, 0, 0.4);
          font-size: @font-size-10;
        }
      }
    }

    .info-footer {
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: space-between;
      margin-top: 6px;

      .num-box {
        color: #000000;

        .icon {
          font-size: 20px;
        }

        .num {
          font-size: 24px;
        }
      }
    }
  }
}
