.goodsleft{ width: 300px; flex-shrink: 0; background: #ffffff; padding:15px;}
.goodsright{ flex: 1; margin-left: 20px; background: #ffffff;}

.goodscover{ width: 60px; height: 60px; flex-shrink: 0;}
.goodscover img{ width: 100%; height: 100%; object-fit: cover;}
.goodstitle{ display: flex; align-content: center; flex: 1; margin-left: 15px;}

.goodstitle h1{ font-size: 14px; font-weight: normal;}

.goodsinfo{ margin-top:15px;}
.goodsinfo p{ display: flex; align-items: center; height: 26px;}
.goodsinfo p em{ font-size: 12px; color: #999999; flex-shrink: 0; width:70px;}
.goodsinfo p i{ font-size: 12px; color: #333333; }

.righttop{background: #f5f5f5; height: 40px;}
.righttop a{ display: flex; align-items: center; padding: 0 23px; height: 40px; background: #fdfdfd; margin-right: 5px;}
.righttop a:hover{ background: #ffffff; color: #189d00;}
.righttop a.active{ background: #ffffff; color: #189d00; font-weight: bold;}
.rightcont{ padding: 20px; color:#333;}
.statsbox{ margin-top: 15px;}
.statsbox p{ display: flex; flex-direction: column; flex: 1;}
.statsbox p i{color:#999999; font-size: 12px;}
.statsbox p strong{font-size: 18px; margin-top:8px;}
.likelist{ margin-top:20px;}

/* Similar products list */
.likelist {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 25px;
}

.likeitem a {
  display: block;
  text-decoration: none;
  color: inherit;
}

.likecover {
  width: 100%;
  aspect-ratio: 1 / 1;
  background: #f7f8fa;
  border: 1px solid #eee;
  border-radius: 8px;
  overflow: hidden;
}

.likecover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.liketitle {
  margin-top: 8px;
  font-size: 14px;
  line-height: 1.4;
  color: #333;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: calc(1.4em * 2);
}

.likeitem a:hover .liketitle {
  color: #0066ff;
}

.likeitem a:hover .likecover {
  border-color: #0066ff;
}

/* Similar bloggers list */
.bloggerlikelist {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 25px;
  margin-top: 15px;
}

.bloggeritem a {
  display: block;
  text-decoration: none;
  color: inherit;
  text-align: center;
}

.bloggeravatar {
  width: 100%;
  max-width: 90px;
  margin: 0 auto;
  aspect-ratio: 1 / 1;
  background: #f7f8fa;
  border: 1px solid #eee;
  border-radius: 50%;
  overflow: hidden;
}

.bloggeravatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.bloggername {
  margin-top: 8px;
  font-size: 14px;
  line-height: 1.4;
  color: #333;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 600;
}

.bloggerfans {
  margin-top: 4px;
  font-size: 12px;
  color: #888;
}

.bloggeritem a:hover .bloggername {
  color: #0066ff;
}

.bloggeritem a:hover .bloggeravatar {
  border-color: #0066ff;
}



.videocover{ width: 60px; height: 80px; flex-shrink: 0;}
.videocover img{ width: 100%; height: 100%; object-fit: cover;}

/* Similar videos list - table-like grid */
.videolikelist { margin-top: 12px; }

.videolikehead,
.videolikeitem {
  display: grid;
  grid-template-columns: 110px 1fr 110px 110px;
  align-items: center;
  column-gap: 16px;
}

.videolikehead {
  padding: 10px 12px;
  background: #f7f8fa;
  border: 1px solid #eee;
  border-radius: 8px 8px 0 0;
  color: #666;
  font-size: 12px;
}

.videolikeitem {
  padding: 12px;
  border-left: 1px solid #eee;
  border-right: 1px solid #eee;
  border-bottom: 1px solid #eee;
}

.videolikeitem:last-child {
  border-radius: 0 0 8px 8px;
}

.videolikeitem:hover { background: #fafafa; }

.videolikeitem .col-caption {
  font-size: 14px;
  color: #333;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.videolikehead .col-like,
.videolikehead .col-share,
.videolikeitem .col-like,
.videolikeitem .col-share { text-align: right; }

.videolikeitem .col-like,
.videolikeitem .col-share { color: #111; font-weight: 600; }

.videolikeitem .col-cover img {
  width: 100px;
  height: 60px;
  object-fit: cover;
  border-radius: 6px;
  display: block;
}


.salewayChart{ width: 260px; flex-shrink: 0; height: 200px;}
.salewaylist{ flex: 1; margin-left: 20px; margin-top: 20px;}

.salewaybox{ display: flex; align-items: flex-start; justify-content: space-between;}

@media only screen and (max-width: 767px) {

  .salewaybox{ flex-direction: column;}
  .salewayChart{ width: 100%;}
  .salewaylist{ width: 100%; margin-left: 0;}

  .goodsleft{ width: 100%; margin-left: 0;}
  .goodsright{ width: 100%; margin-left: 0; margin-top: 15px;}
  .righttop{ width: 100%; overflow-x: auto; }
  .righttop a{ width: 103px; flex-shrink: 0;}
  .bloggerlikelist {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 25px;
    margin-top: 15px;
  }

}