/* ========== 页面背景 ========== */
#MainContent {
  --color-page-bg: #fff9f3;
  background-color: var(--color-page-bg);
}

/* ========== Tab Product Landing 整体组件 ========== */
#back-to-school-landing-2026-tab-product {

  /* 主题颜色 */
  --tab-product-theme-color: #ae7e5f;

  /* 倒计时颜色 */
  --tab-product-countdown-color: #ae7e5f;

  /* 原价文案颜色 */
  --color-compare-price: #8c8c8c;

  /* flag时间背景颜色 */
  --color-flag-discount-date: #9E5323;
  
  /* flag文案颜色，tab选中或鼠标滑过文案颜色 */
  --color-white: #FFFFFF;

  /* 1.Tab标签栏子组件 */
  .bfcm-tab-products__tab-list {
    .bfcm-tab-products__tab-item {
      color: var(--tab-product-theme-color) !important;
      border: 1px solid var(--tab-product-theme-color) !important;

      &.active,
      &:hover {
        color: var(--color-white) !important;
        background-color: var(--tab-product-theme-color) !important;
      }
    }
  }

  /* 2.商品角标标签子组件 */
  .custom-flag-html {
    position: absolute;
    left: 9px;
    top: 10px;

    .discount-date-range {
      color: var(--color-white);
      font-size: 8px;
      font-weight: 450;
      line-height: 1;
      display: inline-flex;
      justify-content: center;
      align-items: center;
      padding: 3px 12px;
      clip-path: polygon(6px 0%, 100% 0%, calc(100% - 6px) 100%, 0% 100%);
      z-index: 1;
      position: absolute;
      top: 2px;
      right: 4px;
      background: var(--color-flag-discount-date);
    }

    .discount-content {
      height: 22px;
      color: var(--color-white);
      font-size: 12px;
      font-weight: 300;
      line-height: 1;
      display: flex;
      justify-content: center;
      align-items: center;
      padding: 0 14px;
      margin-top: 14px;
      clip-path: polygon(8px 0%, 100% 0%, calc(100% - 8px) 100%, 0% 100%);
      background: var(--tab-product-theme-color);
    }
  }

  /* 3.商品卡片子组件 */
  .card-product-4__content {
    .card-product-4__title {
      color: var(--tab-product-theme-color) !important;
    }

    .card-product-4__price {
      color: var(--tab-product-theme-color) !important;
    }

    .card-product-4__compare-price {
      color: var(--color-compare-price) !important;
    }

    .platform-select-type {
      border: 1px solid var(--tab-product-theme-color) !important;
      .platform-select-text {
        color: var(--tab-product-theme-color) !important;
      }
    }

    /* 倒计时子模块 */
    .card-product-4__countdown-wrapper {
      svg {
        fill: var(--tab-product-countdown-color) !important;
      }
      #custom_ending_label-xms {
        color: var(--tab-product-countdown-color) !important;
      }
      .card-product-4__countdown {
        color: var(--tab-product-countdown-color) !important;
      }
    }
  }

  /* 4.查看更多按钮子组件 */
  .learn-more-container {
    .learn-more {
      border: 1px solid var(--tab-product-theme-color) !important;
      .learn-more-span {
        color: var(--tab-product-theme-color) !important;
      }
      svg path {
        stroke: var(--tab-product-theme-color) !important;
      }
    }
  }
}