/* ====================================================================
   VEVOR Black Friday 2026 · 专题页皮肤
   Industrial Black-Gold Promo（工业黑金促销）
   ==================================================================== */

/* ---------- 1. 页面背景：深炭黑 + 金色射线 ---------- */
body .active-body.specialWarp,
body .specialWarp {
  background:
    radial-gradient(1100px 460px at 50% -80px, rgba(255,106,0,.20), transparent 62%),
    radial-gradient(800px 380px at 108% 12%, rgba(255,106,0,.10), transparent 55%),
    #0c0c0d !important;
}

/* 顶部黑金装饰线 */
body .specialWarp::before {
  content: "";
  display: block;
  height: 4px;
  background: linear-gradient(90deg, #ff6a00, #ff6a00 45%, #ff6a00 90%);
}

/* ---------- 2. 楼层通用：深色卡片 ---------- */
body .specialWarp section[data-position] {
  background: #141416 !important;
  border: 1px solid #26262a;
  border-radius: 14px;
  margin-bottom: 18px;
  padding: 22px 20px;
  box-shadow: 0 6px 24px rgba(0,0,0,.45);
}

/* ---------- 3. 楼层标题（商品楼层的 h3） ---------- */
body .specialWarp .comer_horizontal h3,
body .specialWarp .comer_vertical h3,
body .specialWarp .special_commonNormal h3 {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  font-weight: 800 !important;
  font-size: 26px !important;
  letter-spacing: .5px;
  color: #fff !important;
  margin: 0 0 18px !important;
  padding-left: 16px;
  text-transform: uppercase;
}
body .specialWarp .comer_horizontal h3::before,
body .specialWarp .comer_vertical h3::before,
body .specialWarp .special_commonNormal h3::before {
  content: "";
  width: 6px;
  height: 28px;
  border-radius: 3px;
  background: linear-gradient(180deg, #ff6a00, #ff6a00);
  box-shadow: 0 0 12px rgba(255,106,0,.7);
}
body .specialWarp .comer_horizontal h3::after,
body .specialWarp .comer_vertical h3::after,
body .specialWarp .special_commonNormal h3::after {
  content: "";
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, rgba(255,106,0,.55), transparent);
  margin-left: 4px;
}

/* ---------- 4. 优惠券：黑金（覆盖模板 #ff5023 橙红） ---------- */
body .specialWarp .coupon_line_multiple {
  background: transparent !important;
}
body .specialWarp .coupon_item {
  border-radius: 12px !important;
  border: 1px solid rgba(255,106,0,.5) !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: hidden;
}
body .specialWarp .coupon_summary,
body .specialWarp .coupon_desc,
body .specialWarp .coupon_divider {
  background: linear-gradient(160deg, #1d1b14, #131313) !important;
}
body .specialWarp .coupon_item:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 28px rgba(255,106,0,.38) !important;
}
body .specialWarp .coupon_item:hover .coupon_summary,
body .specialWarp .coupon_item:hover .coupon_desc {
  border-color: #ff6a00;
}
body .specialWarp .coupon_main_sale .coupon-price,
body .specialWarp .coupon_item .coupon-price {
  color: #ff8a1e !important;
  font-weight: 800 !important;
}
body .specialWarp .coupon_line_multiple .coupon_item_layout3 .coupon_btn,
body .specialWarp .coupon_btn {
  background: linear-gradient(90deg, #ff6a00, #ff8a1e) !important;
  border-radius: 20px !important;
  color: #fff !important;
  font-weight: 700;
}
body .specialWarp .coupon_categoryTag {
  background: #2a2a2e !important;
  border-radius: 6px !important;
}
body .specialWarp .coupon_categoryTagText { color: #ccc !important; }

/* ---------- 5. 倒计时：金色荧光 ---------- */
body .specialWarp .countdown,
body .specialWarp .js-timer2 {
  color: #ff8a1e !important;
  font-weight: 800 !important;
  letter-spacing: 1px;
  text-shadow: 0 0 14px rgba(255,106,0,.6);
}

/* ---------- 6. 商品楼层 tab ---------- */
body .specialWarp .indexCommon_navList a,
body .specialWarp .indexCommon_nav a {
  color: #bbb !important;
}
body .specialWarp .indexCommon_nav a.active,
body .specialWarp .indexCommon_nav a:hover {
  color: #fff !important;
  background: linear-gradient(90deg, #ff6a00, #ff8a1e) !important;
  border-radius: 6px !important;
}

/* ---------- 7. 商品卡：白底（产品图自然）+ 橙价 + hover ---------- */
body .specialWarp .compItem {
  background: #ffffff !important;
  border: 1px solid #2a2a2e !important;
  border-radius: 10px !important;
  overflow: hidden;
  transition: transform .16s ease, box-shadow .16s ease;
}
body .specialWarp .compItem:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 26px rgba(0,0,0,.5) !important;
}
body .specialWarp .compItem .shopPrice,
body .specialWarp .compItem_shopPrice {
  color: #ff6a00 !important;
  font-weight: 800 !important;
}

/* ---------- 8. rich_text（用券提示）：深色虚线 ---------- */
body .specialWarp .special_rich_text,
body .specialWarp .special_rich_text .rich_text_content {
  background: linear-gradient(160deg, #1a1508, #131313) !important;
  border: 1px dashed rgba(255,106,0,.4) !important;
  border-radius: 10px !important;
  color: #ff8a1e !important;
  font-weight: 600;
}

/* ====================================================================
   M 端（wap）
   ==================================================================== */
@media screen and (max-width: 768px) {
  body .siteBody_special .siteBody_inner {
    background: #0c0c0d !important;
  }
  body .siteBody_special .promoModule > section.promoModule_item {
    background: #141416 !important;
    border-radius: 12px !important;
    margin-bottom: 12px !important;
    padding: 14px !important;
    border: 1px solid #26262a !important;
  }
  body .siteBody_special .promoModule h3,
  body .siteBody_special .promoModule .promoModule_title {
    color: #fff !important;
    font-weight: 800 !important;
    padding-left: 12px;
    position: relative;
  }
  body .siteBody_special .promoModule h3::before {
    content: "";
    position: absolute;
    left: 0; top: 3px;
    width: 5px; height: 20px;
    border-radius: 3px;
    background: linear-gradient(180deg, #ff6a00, #ff6a00);
  }
}
