/* 查看所有产品页：左侧测量筛选 + 右侧产品列表
 * 五档：Phone≤767 | Small 768–1024 | Mid 1025–1439 | Large 1440–1679 | XLarge≥1680（下方定稿）
 */

.hh-list-section {
	background: #fff;
	/* PC 上间距仅作用于右侧 .hh-list-main（见 style.css） */
	padding: 0 0 40px 0;
	min-height: calc(100vh - 180px);
	box-sizing: border-box;
	font-family: "HarmonyOS Sans SC Light";
	font-weight: normal;
	font-synthesis: none;
}

/* 左侧筛选 + 右侧结果整体，左贴右留空 */
.hh-list-inner {
	width: 100%;
	max-width: 1520px;
	margin: 0;
	padding-left: 0;
	box-sizing: border-box;
	display: flex;
	align-items: flex-start;
}

.hh-list-sidebar {
	flex-shrink: 0;
	width: 25%;
	min-width: 220px;
	background: #f0f2f5;
	border-right: 1px solid #e0e4e8;
	padding: 0 0 32px 0;
}

.hh-filter-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	font-size: 18px;
	color: #132A3E;
	padding: 20px 20px 12px 20px;
	border-bottom: 1px solid #e0e4e8;
}

/* ≥768：筛选条 / 遮罩 / 完成按钮隐藏 */
.hh-list-filter-bar,
.hh-list-filter-mask,
.hh-list-filter-close {
	display: none;
}

.hh-type-block,
.hh-series-block,
.hh-measure-block {
	border: none;
	border-radius: 0;
	overflow: hidden;
	background: transparent;
}

.hh-measure-title {
	font-size: 18px;
	color: #132A3E;
	margin: 0;
	padding: 20px 20px 14px 20px;
	border-bottom: 1px solid #e0e4e8;
}

.hh-measure-list {
	padding: 12px 0 0 0;
	display: flex;
	flex-direction: column;
}

/* 选择框 + 文字，文字字号与标题一致 */
.hh-measure-item {
	display: flex;
	align-items: center;
	gap: 14px;
	font-size: 17px;
	color: #333;
	cursor: pointer;
	padding: 8px 20px;
}

.hh-measure-item:hover {
	color: #0d1f2d;
	background: #e8eaed;
}

.hh-measure-cb {
	width: 20px;
	height: 20px;
	margin: 0;
	cursor: pointer;
	flex-shrink: 0;
}

.hh-list-main {
	flex: 1;
	min-width: 0;
	width: 75%;
	padding: 0 48px 0 40px;
	box-sizing: border-box;
}

@media screen and (min-width: 768px) {
	body:has(.header-v1.theme-header) .hh-list-main {
		padding-top: 48px;
	}
}

/* 右侧标题：产品 | X 个结果 */
.hh-list-header {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 24px;
	font-size: 17px;
	color: #333;
}

.hh-list-header-title {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	font-size: 22px;
	font-family: "HarmonyOS Sans SC Regular";
	font-weight: normal;
	font-synthesis: none;
	color: #132A3E;
}

.hh-list-header-icon {
	display: inline-block;
	width: 22px;
	height: 22px;
	background: #132A3E;
	opacity: 0.85;
	border-radius: 2px;
}

.hh-list-header-sep {
	width: 1px;
	height: 18px;
	background: #ccc;
}

.hh-list-header-count {
	color: #666;
	font-size: 17px;
}

/* 右侧卡片列表：一行一条，左图右文 */
.hh-list-grid {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.hh-product-card {
	display: flex;
	align-items: stretch;
	gap: 0;
	width: 100%;
	max-width: 850px;
	min-height: 175px;
	background: #fff;
	border-bottom: 1px solid #e8eaed; /* 只有下边框 */
	box-sizing: border-box;
	padding-bottom: 24px;
	margin-bottom: 24px;
}

.hh-product-img {
	position: relative;
	flex-shrink: 0;
	width: 235px;
	height: 175px;
	overflow: hidden;
}

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

.hh-product-img a {
	display: block;
	width: 100%;
	height: 100%;
}

/* 右侧文字区 */
.hh-product-body {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 20px 24px;
	min-width: 0;
}

/* 产品标签行：类型 + 系列 */
.hh-product-tags {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 0 0 8px 0;
}

/* 产品类型/系列标签：主图旁胶囊，底色品牌蓝、白字居中 */
.hh-product-type {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	align-self: flex-start;
	min-width: 40px;
	min-height: 30px;
	padding: 0 14px;
	margin: 0;
	font-size: 14px;
	color: #ffffff;
	border-radius: 15px;
	border: none;
	background: #00A1E9;
	text-align: center;
	box-sizing: border-box;
	line-height: 1.2;
}

/* 型号标签：深蓝底白字，与类型/系列标签区分、突出辨识（需在 hh-product-type 之后定义） */
.hh-product-model {
	background: #132A3E;
	color: #FFFFFF;
	letter-spacing: 1px;
}

.hh-product-name {
	font-size: 26px;
	font-family: "HarmonyOS Sans SC Regular";
	font-weight: normal;
	font-synthesis: none;
	color: #132A3E;
	margin: 0 0 8px 0;
	line-height: 1.35;
}

.hh-product-name a {
	color: inherit;
	text-decoration: none;
}

/* 只有标题 hover 变蓝 */
.hh-product-name a:hover {
	color: #00a1e9;
	text-decoration: none;
}

.hh-product-desc {
	font-size: 18px;
	line-height: 1.6;
	color: #444;
	margin: 0;
}

.hh-product-spec-summary {
	margin-top: 10px;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.hh-spec-item {
	display: inline-block;
	font-size: 13px;
	color: #666;
	background: #f0f2f5;
	border-radius: 4px;
	padding: 2px 8px;
	line-height: 1.6;
}

.hh-list-empty {
	color: #666;
	font-size: 16px;
	padding: 24px 0;
	text-align: center;
}

/*
 * ========== 产品列表五档 ==========
 * Phone ≤767 | Small 768–1024 | Mid 1025–1439 | Large 1440–1679 | XLarge ≥1680（定稿，见上方）
 * ≥768：左筛右列表 + 卡片左图右文；≤767：暂保留单列（结构未改）
 * 文案：max(14px, 定稿 × --kyd-text-scale)
 */

/* —— 文案缩放：≤1679（≥1680 用定稿字号） —— */
@media screen and (max-width: 1679px) {
	.hh-filter-header,
	.hh-measure-title {
		font-size: max(var(--kyd-text-sm-min, 14px), calc(18px * var(--kyd-text-scale, 1)));
	}
	.hh-measure-item {
		font-size: max(var(--kyd-text-sm-min, 14px), calc(17px * var(--kyd-text-scale, 1)));
	}
	.hh-list-header {
		font-size: max(var(--kyd-text-sm-min, 14px), calc(17px * var(--kyd-text-scale, 1)));
	}
	.hh-list-header-title {
		font-size: max(var(--kyd-text-sm-min, 14px), calc(22px * var(--kyd-text-scale, 1)));
	}
	.hh-list-header-count {
		font-size: max(var(--kyd-text-sm-min, 14px), calc(17px * var(--kyd-text-scale, 1)));
	}
	.hh-product-type {
		font-size: max(var(--kyd-text-sm-min, 14px), calc(14px * var(--kyd-text-scale, 1)));
	}
	.hh-product-name {
		font-size: max(var(--kyd-text-sm-min, 14px), calc(26px * var(--kyd-text-scale, 1)));
	}
	.hh-product-desc {
		font-size: max(var(--kyd-text-sm-min, 14px), calc(18px * var(--kyd-text-scale, 1)));
	}
	.hh-spec-item {
		font-size: max(var(--kyd-text-sm-min, 14px), calc(13px * var(--kyd-text-scale, 1)));
	}
	.hh-list-empty {
		font-size: max(var(--kyd-text-sm-min, 14px), calc(16px * var(--kyd-text-scale, 1)));
	}
}

/* —— Large 1440～1679：略收间距/图区 —— */
@media screen and (min-width: 1440px) and (max-width: 1679px) {
	.hh-list-sidebar {
		min-width: 200px;
		width: 23%;
	}
	.hh-list-main {
		padding: 0 36px 0 32px;
	}
	.hh-product-card {
		max-width: 780px;
		min-height: 160px;
		padding-bottom: 20px;
		margin-bottom: 20px;
	}
	.hh-product-img {
		width: 210px;
		height: 156px;
	}
	.hh-product-body {
		padding: 16px 20px;
	}
}

/* —— Mid 1025～1439：再收，仍左右栏 —— */
@media screen and (min-width: 1025px) and (max-width: 1439px) {
	.hh-list-inner {
		max-width: 100%;
	}
	.hh-list-sidebar {
		width: 22%;
		min-width: 190px;
		max-width: 260px;
	}
	.hh-filter-header,
	.hh-measure-title {
		padding: 16px 16px 12px 16px;
	}
	.hh-measure-item {
		gap: 12px;
		padding: 7px 16px;
	}
	.hh-list-main {
		padding: 0 28px 0 24px;
	}
	.hh-list-header {
		margin-bottom: 18px;
		gap: 10px;
	}
	.hh-list-grid {
		gap: 18px;
	}
	.hh-product-card {
		max-width: none;
		min-height: 150px;
		padding-bottom: 18px;
		margin-bottom: 18px;
	}
	.hh-product-img {
		width: 180px;
		height: 134px;
	}
	.hh-product-body {
		padding: 14px 16px;
	}
	.hh-product-type {
		min-height: 26px;
		padding: 0 12px;
	}
}

/* —— Small 768～1024：左右栏，空间尽量压缩 —— */
@media screen and (min-width: 768px) and (max-width: 1024px) {
	.hh-list-inner {
		flex-direction: row;
		align-items: flex-start;
		max-width: 100%;
	}
	.hh-list-sidebar {
		width: 200px;
		min-width: 180px;
		max-width: 220px;
		flex-shrink: 0;
		border-right: 1px solid #e0e4e8;
		border-bottom: none;
		padding: 0 0 24px 0;
	}
	.hh-filter-header,
	.hh-measure-title {
		padding: 14px 12px 10px 12px;
	}
	.hh-measure-item {
		gap: 10px;
		padding: 6px 12px;
	}
	.hh-measure-cb {
		width: 16px;
		height: 16px;
	}
	.hh-list-main {
		width: auto;
		flex: 1;
		min-width: 0;
		padding: 16px 16px 0 16px;
	}
	.hh-list-header {
		margin-bottom: 16px;
		gap: 8px;
	}
	.hh-list-grid {
		gap: 16px;
	}
	.hh-product-card {
		flex-direction: row;
		align-items: stretch;
		max-width: none;
		min-height: 140px;
		padding-bottom: 16px;
		margin-bottom: 16px;
	}
	.hh-product-img {
		width: 160px;
		height: 120px;
	}
	.hh-product-body {
		padding: 12px 14px;
	}
	.hh-product-type {
		min-height: 24px;
		padding: 0 10px;
	}
	.hh-product-name {
		margin: 0 0 6px 0;
	}
	.hh-product-spec-summary {
		margin-top: 6px;
		gap: 4px;
	}
	.hh-spec-item {
		padding: 1px 6px;
	}
}

/* —— Phone ≤767：筛选收进顶栏 + 左侧抽屉 —— */
@media screen and (max-width: 767px) {
	.hh-list-section {
		padding: 0 0 32px 0;
	}
	.hh-list-inner {
		flex-direction: column;
		max-width: 100%;
	}

	.hh-list-filter-bar {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		position: sticky;
		top: var(--touch-bar-h, 52px);
		z-index: 40;
		padding: 10px 16px;
		background: #fff;
		border-bottom: 1px solid #e0e4e8;
		box-sizing: border-box;
	}
	.hh-list-filter-open {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		margin: 0;
		padding: 8px 14px;
		border: 1px solid #00A1E9;
		border-radius: 20px;
		background: #fff;
		color: #132A3E;
		font-family: "HarmonyOS Sans SC Light", sans-serif;
		font-size: 14px;
		line-height: 1.2;
		cursor: pointer;
		-webkit-appearance: none;
		appearance: none;
	}
	.hh-list-filter-open:active {
		background: rgba(0, 161, 233, 0.12);
	}
	.hh-list-filter-badge {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 18px;
		height: 18px;
		padding: 0 5px;
		border-radius: 9px;
		background: #00A1E9;
		color: #fff;
		font-size: 12px;
		line-height: 1;
		box-sizing: border-box;
	}
	.hh-list-filter-badge[hidden] {
		display: none !important;
	}
	.hh-list-filter-bar-count {
		flex-shrink: 0;
		font-size: 13px;
		color: #666;
	}

	.hh-list-filter-mask {
		display: block;
		position: fixed;
		inset: 0;
		z-index: 120;
		background: rgba(19, 42, 62, 0.45);
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transition: opacity 0.28s ease, visibility 0.28s ease;
	}
	.hh-list-section.is-filter-open .hh-list-filter-mask {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
	}
	.hh-list-filter-mask[hidden] {
		display: none;
	}
	.hh-list-section.is-filter-open .hh-list-filter-mask[hidden] {
		display: block;
	}

	.hh-list-sidebar {
		position: fixed;
		top: 0;
		left: 0;
		bottom: 0;
		z-index: 130;
		width: min(86vw, 320px);
		min-width: 0;
		max-width: none;
		padding: 0 0 24px 0;
		border-right: none;
		border-bottom: none;
		box-shadow: 4px 0 24px rgba(19, 42, 62, 0.18);
		transform: translateX(-105%);
		transition: transform 0.28s ease;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}
	.hh-list-section.is-filter-open .hh-list-sidebar {
		transform: translateX(0);
	}

	.hh-list-filter-close {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		margin: 0;
		padding: 6px 14px;
		border: none;
		border-radius: 16px;
		background: #00A1E9;
		color: #fff;
		font-family: "HarmonyOS Sans SC Light", sans-serif;
		font-size: 13px;
		line-height: 1.2;
		cursor: pointer;
		-webkit-appearance: none;
		appearance: none;
		flex-shrink: 0;
	}

	.hh-list-main {
		width: 100%;
		padding: 12px 12px 0 12px;
	}
	.hh-list-header {
		margin-bottom: 12px;
		gap: 8px;
	}
	.hh-list-grid {
		gap: 0;
	}

	/* 方案 2：左小图 + 右文，提高列表密度 */
	.hh-product-card {
		flex-direction: row;
		align-items: stretch;
		max-width: none;
		min-height: 0;
		gap: 0;
		padding-bottom: 12px;
		margin-bottom: 12px;
	}
	.hh-product-img {
		width: 104px;
		height: 104px;
		align-self: center;
		flex-shrink: 0;
		border-radius: 4px;
		overflow: hidden;
	}
	.hh-product-body {
		padding: 2px 0 2px 12px;
		justify-content: flex-start;
	}
	.hh-product-tags {
		gap: 6px;
		margin: 0 0 4px 0;
	}
	.hh-product-type {
		min-width: 0;
		min-height: 22px;
		padding: 0 8px;
		font-size: 11px;
		border-radius: 11px;
	}
	.hh-product-name {
		margin: 0 0 4px 0;
		line-height: 1.3;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		overflow: hidden;
	}
	.hh-product-desc {
		line-height: 1.45;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		overflow: hidden;
	}
	.hh-product-spec-summary {
		margin-top: 4px;
		gap: 4px;
		max-height: 1.6em;
		overflow: hidden;
	}
	.hh-spec-item {
		padding: 0 6px;
		font-size: 11px;
	}
}

body.hh-filter-open {
	overflow: hidden;
}