:root {
  /* 主题色 */
    --tbpc-primary-theme-color: #ff5000;
    --tbpc-primary-theme-alpha-color: #ff500015;
    --tbpc-secondary-theme-color: #ff5000;
    --tbpc-secondary-theme-alpha-color: #ff500015;
    --tbpc-price-color: #ff5000;
    --tbpc-price-alpha-color: #ff500015;
    --tbpc-border-theme-color: #ffd5c2;
    --tbpc-background-theme--color: #fff1eb;
    --tbpc-gold-theme-color: #b88449;

    /* 文字颜色 */
    --tbpc-primary-color: #1f1f1f;
    --tbpc-secondary-color: #7a7a7a;
    --tbpc-tertiary-color: #999;
    --tbpc-disable-color: #ccc;

    /* 边框/背景 */
    --tbpc-border-color: #d6d6d6;
    --tbpc-divider-color: #ebebeb;
    --tbpc-bg1-color: #f5f5f5;
    --tbpc-bg2-color: #f7f7f7;
    --tbpc-bg3-color: #fafafa;
    --tbpc-white-color: #fff;

    /* Alpha颜色 */
    --tbpc-primary-alpha-color: rgba(0, 0, 0, .88);
    --tbpc-secondary-alpha-color: rgba(0, 0, 0, .52);
    --tbpc-tertiary-alpha-color: rgba(0, 0, 0, .4);
    --tbpc-disable-alpha-color: rgba(108, 20, 20, .2);
    --tbpc-border-alpha-color: rgba(0, 0, 0, .16);
    --tbpc-divider-alpha-color: rgba(0, 0, 0, .08);
    --tbpc-bg1-alpha-color: rgba(0, 0, 0, .04);
    --tbpc-bg2-alpha-color: rgba(0, 0, 0, .03);
    --tbpc-bg3-alpha-color: rgba(0, 0, 0, .02);
}

@font-face {
  font-family: "iconfont";
  src:
    url("../iconfont/iconfont.woff2?t=1780390614881") format("woff2"),
    url("../iconfont/iconfont.woff?t=1780390614881") format("woff"),
    url("../iconfont/iconfont.ttf?t=1780390614881") format("truetype");
}

.iconfont {
  font-family: "iconfont" !important;
  font-size: 12px;
  font-style: normal;
  font-weight: bold;
  color: #353535;
  padding-right: 2px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.w {
  max-width: 1760px;
  min-width: 1200px;
  margin: 0 auto;
}

.flex-center {
  display: flex;
  justify-content:flex-start;
  align-items: center;
}

.flex-between {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* 商品列表 */
.container {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  width: 100%;
  min-width: 1100px;
}

.container .item {
  position: relative;
  flex: 0 0 16.66666667%;
}

.container .item .item-link {
  display: block;
  width: 100%;
  height: 100%;
}

.img-wrapper img {
  width: 100%;
  height: 100%;
  border-radius: var(--tbpc-radius-md);
  object-fit: cover;
}

.info-wrapper .info-wrapper-title-text {
  display: -webkit-box;
  overflow: hidden;
  font-size: 16px;
  font-weight: 500;
  color: var(--tbpc-primary-color);
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.tag-list {
  margin-top: 4px;
}

.tag-text {
  display: inline-block;
  font-size: 14px;
  color: var(--tbpc-price-color);
}

.price-wrapper {
  display: flex;
  align-items: center;
  height: 24px;
}

.price-unit,
.price-value {
  font-weight: 700;
  font-family: AlibabaSans102v1TaoBao-Bold, sans-serif;
  color: var(--tbpc-price-color);
}

.price-value {
  font-size: 20px;
  line-height: 22px;
}

.month-sale {
  margin-left: 8px;
  margin-bottom: -1px;
  font-size: 14px;
  line-height: 20px;
  color: var(--tbpc-secondary-color);
}

.hover-border {
  position: absolute;
  top: -4px;
  left: -4px;
  width: calc(100% + 8px);
  height: calc(100% + 8px);
  border: 1px solid transparent;
  border-radius: var(--tbpc-radius-md);
  box-sizing: border-box;
  transition: border-color var(--tbpc-transition-fast);
}

.container .item:hover .hover-border {
  border-color: var(--tbpc-primary-theme-color);
}



/* ===== 响应式 ===== */
@media screen and (max-width: 991px) {
  .container .item {
    flex: 0 0 calc(33.3333% - 10px);
  }

  .container {
    min-width: auto;
  }
}

@media screen and (min-width: 992px) and (max-width: 1199px) {
  .container .item {
    flex: 0 0 calc(25% - 10px);
  }

}

@media screen and (min-width: 1200px) and (max-width: 1499px) {
  .container .item {
    flex: 0 0 calc(20% - 10px);

  }

}

@media screen and (min-width: 1500px) {
  .container .item {
    flex: 0 0 calc(16.66666667% - 10px);
  }
}