.search-container.data-v-4cedc0c6 { width: 100%; height: 100vh; background-color: #f8f8f8; } /* 头部 */ .search-header.data-v-4cedc0c6 { position: fixed; top: 0; left: 0; right: 0; background: #ffffff; z-index: 100; box-shadow: 0 2rpx 10rpx rgba(0,0,0,0.02); } .status-bar.data-v-4cedc0c6 { width: 100%; } .header-main.data-v-4cedc0c6 { height: 88rpx; display: flex; align-items: center; padding: 0 24rpx; } .back-btn.data-v-4cedc0c6 { width: 64rpx; height: 64rpx; border-radius: 50%; background-color: #f5f5f5; display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: background-color 0.2s; } .back-btn-hover.data-v-4cedc0c6 { background-color: #e8e8e8; } .back-arrow.data-v-4cedc0c6 { font-size: 44rpx; color: #333; line-height: 1; font-weight: 500; margin-top: -4rpx; margin-left: -2rpx; } .search-input-wrap.data-v-4cedc0c6 { flex: 1; height: 72rpx; background-color: #ffffff; border: 2rpx solid #ff4d6d; border-radius: 36rpx; display: flex; align-items: center; padding: 0 24rpx; margin: 0 20rpx; } .search-icon.data-v-4cedc0c6 { font-size: 28rpx; color: #ff4d6d; margin-right: 12rpx; } .search-input.data-v-4cedc0c6 { flex: 1; height: 100%; font-size: 26rpx; color: #333; } .search-btn-red.data-v-4cedc0c6 { width: 120rpx; height: 64rpx; background: linear-gradient(to right, #ff715a, #ff416c); color: #ffffff; font-size: 28rpx; font-weight: bold; border-radius: 32rpx; display: flex; align-items: center; justify-content: center; } /* 平台Tab */ .platform-tabs.data-v-4cedc0c6 { height: 80rpx; display: flex; position: relative; border-bottom: 1rpx solid #f2f2f2; } .tab-item.data-v-4cedc0c6 { flex: 1; display: flex; align-items: center; justify-content: center; font-size: 28rpx; color: #666; transition: all 0.3s; } .tab-item.active.data-v-4cedc0c6 { color: #ff416c; font-weight: bold; font-size: 30rpx; } .active-line.data-v-4cedc0c6 { position: absolute; bottom: 8rpx; width: 40rpx; height: 4rpx; background-color: #ff416c; border-radius: 4rpx; -webkit-transform: translateX(-50%); transform: translateX(-50%); transition: left 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); } /* 内容区 */ .search-body.data-v-4cedc0c6 { height: 100%; box-sizing: border-box; } .section.data-v-4cedc0c6 { padding: 30rpx 24rpx 10rpx; background-color: #ffffff; } .history-section.data-v-4cedc0c6 { padding-top: 20rpx; } .section-title.data-v-4cedc0c6 { font-size: 26rpx; color: #999; margin-bottom: 20rpx; } .tag-list.data-v-4cedc0c6 { display: flex; flex-wrap: wrap; } .tag-item.data-v-4cedc0c6 { padding: 10rpx 30rpx; background-color: #f1f1f1; border-radius: 30rpx; font-size: 24rpx; color: #333; margin-right: 20rpx; margin-bottom: 20rpx; } /* 双栏卡片 */ .dual-columns.data-v-4cedc0c6 { display: flex; padding: 20rpx; justify-content: space-between; } .column-card.data-v-4cedc0c6 { width: 48.5%; background: linear-gradient(180deg, #fff4eb 0%, #ffffff 40%); border: 2rpx solid #ffe1cc; border-radius: 16rpx; padding: 20rpx; box-sizing: border-box; } .topic-card.data-v-4cedc0c6 { background: linear-gradient(180deg, #fff1ee 0%, #ffffff 40%); border-color: #ffd8d0; } .card-header.data-v-4cedc0c6 { display: flex; align-items: center; margin-bottom: 24rpx; } .card-icon.data-v-4cedc0c6 { font-size: 30rpx; margin-right: 8rpx; } .card-title.data-v-4cedc0c6 { font-size: 28rpx; font-weight: bold; color: #d16d3f; white-space: nowrap; } .topic-card .card-title.data-v-4cedc0c6 { color: #e66b5b; } .card-sub.data-v-4cedc0c6 { font-size: 20rpx; color: #d1a38f; margin-left: 8rpx; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* 轻松省钱三部曲 */ .steps-tip.data-v-4cedc0c6 { margin: 16rpx 20rpx 0; padding: 16rpx 20rpx; background: linear-gradient(135deg, #fff7f0, #fff0f3); border-radius: 12rpx; border: 2rpx solid #ffe1d6; } .steps-title.data-v-4cedc0c6 { display: block; font-size: 24rpx; font-weight: bold; color: #ff6b3d; margin-bottom: 10rpx; } .steps-row.data-v-4cedc0c6 { display: flex; align-items: center; flex-wrap: wrap; } .step-item.data-v-4cedc0c6 { font-size: 22rpx; color: #888; } .step-num.data-v-4cedc0c6 { color: #ff6b3d; font-weight: bold; margin-right: 4rpx; } .step-arrow.data-v-4cedc0c6 { font-size: 18rpx; color: #ffb199; margin: 0 8rpx; } /* 全网热搜列表 */ .rank-item.data-v-4cedc0c6 { display: flex; align-items: center; margin-bottom: 30rpx; } .rank-num.data-v-4cedc0c6 { width: 40rpx; display: flex; justify-content: center; margin-right: 10rpx; } .rank-icon-img.data-v-4cedc0c6 { width: 32rpx; height: 32rpx; } .num-txt.data-v-4cedc0c6 { font-size: 26rpx; font-style: italic; font-weight: bold; color: #ff9d00; } .rank-img.data-v-4cedc0c6 { width: 80rpx; height: 80rpx; border-radius: 8rpx; margin-right: 16rpx; background-color: #f5f5f5; } .rank-name.data-v-4cedc0c6 { font-size: 26rpx; color: #333; font-weight: bold; flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* 热点话题列表 */ .topic-item.data-v-4cedc0c6 { display: flex; align-items: center; margin-bottom: 36rpx; } .topic-num.data-v-4cedc0c6 { width: 36rpx; height: 36rpx; font-size: 24rpx; font-weight: bold; margin-right: 16rpx; display: flex; align-items: center; justify-content: center; } .topic-num.num-1.data-v-4cedc0c6 { color: #ffb800; font-size: 32rpx; } .topic-num.num-2.data-v-4cedc0c6 { color: #c0c0c0; font-size: 32rpx; } .topic-num.num-3.data-v-4cedc0c6 { color: #d1a38f; font-size: 32rpx; } .topic-num.num-4.data-v-4cedc0c6 { color: #ff9d00; } .topic-num.num-5.data-v-4cedc0c6 { color: #ff9d00; } .topic-title.data-v-4cedc0c6 { font-size: 26rpx; color: #333; font-weight: bold; flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .copyright.data-v-4cedc0c6 { text-align: center; padding: 40rpx 0; font-size: 24rpx; color: #ccc; } .footer-placeholder.data-v-4cedc0c6 { height: 60rpx; } /* 历史搜索标题行 */ .history-section .section-title.data-v-4cedc0c6 { display: flex; justify-content: space-between; align-items: center; } .clear-history.data-v-4cedc0c6 { font-size: 24rpx; color: #bbb; padding: 6rpx 12rpx; } /* 排序栏 */ .filter-bar.data-v-4cedc0c6 { display: flex; background: #ffffff; height: 80rpx; align-items: center; border-bottom: 1rpx solid #f1f1f1; } .filter-bar .filter-item.data-v-4cedc0c6 { flex: 1; text-align: center; font-size: 26rpx; color: #666; display: flex; align-items: center; justify-content: center; } .filter-bar .filter-item.active.data-v-4cedc0c6 { color: #ff416c; font-weight: bold; } .price-arrows.data-v-4cedc0c6 { display: flex; flex-direction: column; margin-left: 6rpx; line-height: 1; } .price-arrows text.data-v-4cedc0c6 { font-size: 16rpx; color: #ccc; } .price-arrows text.hl.data-v-4cedc0c6 { color: #ff416c; } /* 高级筛选 */ .sub-filter-row.data-v-4cedc0c6 { display: flex; background: #ffffff; padding: 10rpx 20rpx 20rpx; align-items: center; } .sub-filter-item.data-v-4cedc0c6 { padding: 6rpx 20rpx; background: #f5f6f8; color: #333; font-size: 24rpx; border-radius: 8rpx; margin-right: 16rpx; transition: all 0.2s; } .sub-filter-item.active.data-v-4cedc0c6 { background: linear-gradient(to right, #ff758c, #ff416c); color: #ffffff; font-weight: 500; } /* 商品列表 */ .goods-list.data-v-4cedc0c6 { background: #ffffff; } .goods-item.data-v-4cedc0c6 { display: flex; padding: 24rpx; border-bottom: 1rpx solid #f8f8f8; background: #ffffff; } .g-img-left.data-v-4cedc0c6 { flex-shrink: 0; width: 240rpx; height: 240rpx; border-radius: 12rpx; overflow: hidden; background: #f0f0f0; } .goods-img.data-v-4cedc0c6 { width: 100%; height: 100%; } .goods-info.data-v-4cedc0c6 { flex: 1; margin-left: 20rpx; display: flex; flex-direction: column; justify-content: space-between; padding: 4rpx 0; min-width: 0; } .goods-title-row.data-v-4cedc0c6 { display: flex; align-items: center; line-height: 1.4; } .shop-type-tag.data-v-4cedc0c6 { font-size: 18rpx; padding: 0 8rpx; border-radius: 4rpx; margin-right: 8rpx; color: #fff; flex-shrink: 0; line-height: 28rpx; } .tag-tmall.data-v-4cedc0c6 { background: #ff0036; } .tag-taobao.data-v-4cedc0c6 { background: #ff7800; } .g-title-text.data-v-4cedc0c6 { font-size: 26rpx; color: #333; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; } .labels-row.data-v-4cedc0c6 { display: flex; flex-wrap: wrap; margin-top: 12rpx; } .label-tag.data-v-4cedc0c6 { font-size: 20rpx; color: #ff416c; background: #fff5f7; border: 1rpx solid #ffd6de; padding: 2rpx 12rpx; border-radius: 20rpx; margin-right: 12rpx; margin-bottom: 8rpx; } .goods-price-section.data-v-4cedc0c6 { margin-top: auto; padding-bottom: 8rpx; } .price-main.data-v-4cedc0c6 { display: flex; align-items: baseline; } .price-tip.data-v-4cedc0c6 { font-size: 22rpx; color: #ff416c; margin-right: 4rpx; } .price-symbol.data-v-4cedc0c6 { font-size: 24rpx; color: #ff416c; font-weight: bold; } .price-integer.data-v-4cedc0c6 { font-size: 40rpx; color: #ff416c; font-weight: bold; margin-right: 12rpx; } .coupon-box.data-v-4cedc0c6 { display: flex; align-items: center; background: #ff416c; border-radius: 4rpx; overflow: hidden; height: 32rpx; } .coupon-icon.data-v-4cedc0c6 { font-size: 20rpx; color: #ffffff; background: rgba(255, 255, 255, 0.2); padding: 0 6rpx; height: 100%; display: flex; align-items: center; } .coupon-txt.data-v-4cedc0c6 { font-size: 20rpx; color: #ffffff; padding: 0 8rpx; } .price-coupon.data-v-4cedc0c6 { display: flex; align-items: baseline; margin-top: 4rpx; } .coupon-tip.data-v-4cedc0c6 { font-size: 22rpx; color: #ff8a00; } .coupon-val.data-v-4cedc0c6 { font-size: 28rpx; color: #ff8a00; font-weight: bold; } .goods-bottom-info.data-v-4cedc0c6 { display: flex; align-items: center; font-size: 22rpx; color: #999; margin-top: 8rpx; } .split-line.data-v-4cedc0c6 { margin: 0 10rpx; color: #eee; } .loading-status.data-v-4cedc0c6 { text-align: center; padding: 40rpx 0; font-size: 24rpx; color: #999; }