/* 产品详情页样式 —— 修改颜色 / 间距只需改这些变量 */
.pdt-product {
	--pdt-primary: #5ea744;
	--pdt-primary-light: #e4f1df;
	--pdt-text: #222;
	--pdt-muted: #444;
	--pdt-border: #ddd;
	--pdt-row-odd: #f0f0f0;
	--pdt-row-even: #f9f9f9;
	--pdt-max-width: 1280px;
	--pdt-font-size: 16px;      /* 正文 */
	--pdt-title-size: 18px;     /* 产品名 */
	--pdt-heading-size: 18px;   /* Introduction / PRODUCT DETAIL */
	--pdt-zoom: 2;              /* 鼠标悬停放大倍数 */

	color: var(--pdt-text);
	font-size: var(--pdt-font-size);
	padding: 48px 0 64px;
}

/* 去掉主题（Astra）给 #primary 的上边距，让面包屑紧贴页头 */
body #primary.pdt-product {
	margin-top: 0;
	padding-top: 48px;
}

/* ---------- 面包屑（尺寸与 Rank Math 页头里那条一致：高 44px、全屏宽、左边距 80px） ---------- */
.pdt-breadcrumb-bar {
	--pdt-breadcrumb-indent: 80px;

	box-sizing: border-box;
	min-height: 44px;
	width: 100vw;
	margin: -48px calc(50% - 50vw) 48px;
	padding: 9px var(--pdt-breadcrumb-indent) 8.6px;
	background: rgba(224, 224, 224, 0.39);
}

/* 宽度改为全屏，不再受内容区限制 */
.pdt-breadcrumb-bar > .pdt-container {
	max-width: none;
	padding: 0;
}

.pdt-breadcrumb {
	font-size: var(--pdt-font-size);
	line-height: 26.4px;
	color: rgb(51, 65, 85);
}

/* 链接颜色跟 Rank Math 一致：使用 Astra 全局链接色，悬停色同主题 */
.pdt-breadcrumb a {
	color: var(--ast-global-color-0, #046bd2);
	text-decoration: none;
}

.pdt-breadcrumb a:hover,
.pdt-breadcrumb a:focus {
	color: var(--ast-global-color-1, #045cb4);
	text-decoration: none;
}

.pdt-breadcrumb-sep {
	margin: 0 5px;
}

/* 短代码输出：布局交给 Elementor，去掉外边距 */
.pdt-product.pdt-sc {
	padding: 0;
}

.pdt-sc .pdt-btn {
	margin-top: 0;
}

.pdt-sc .pdt-tabs {
	margin-top: 0;
}

.pdt-container {
	max-width: var(--pdt-max-width);
	margin: 0 auto;
	padding: 0 20px;
}

/* ---------- 顶部：图集 + 摘要 ---------- */
.pdt-top {
	display: grid;
	grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
	gap: 40px;
	align-items: start;
}

/* 框的高度跟随图片比例，不留白 */
.pdt-gallery-main {
	border: 1px solid var(--pdt-border);
	overflow: hidden;
	background: #fff;
}

.pdt-gallery-main img {
	width: 100%;
	height: auto;
	display: block;
	transition: transform 0.2s ease-out;
}

/* 悬停放大（仅鼠标设备，JS 设置 transform-origin 跟随鼠标） */
@media (hover: hover) and (pointer: fine) {
	.pdt-gallery-main {
		cursor: zoom-in;
	}

	.pdt-gallery-main.is-zooming img {
		transform: scale(var(--pdt-zoom));
		transition: none;
	}
}

.pdt-gallery-empty {
	aspect-ratio: 1 / 1;
	background: #f3f3f3;
}

.pdt-thumbs {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 32px;
}

.pdt-thumbs-track {
	display: flex;
	gap: 14px;
	list-style: none;
	margin: 0;
	padding: 0;
	overflow-x: auto;
	scroll-behavior: smooth;
	scrollbar-width: none;
	flex: 1;
}

.pdt-thumbs-track::-webkit-scrollbar {
	display: none;
}

.pdt-thumb {
	flex: 0 0 calc((100% - 28px) / 3);
	aspect-ratio: 1 / 1;
	border: 1px solid #bbb;
	cursor: pointer;
	overflow: hidden;
	background: #fff;
}

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

.pdt-thumb.is-active {
	border: 2px solid var(--pdt-primary);
}

.pdt-thumbs-nav {
	background: none;
	border: 0;
	font-size: 40px;
	line-height: 1;
	color: #888;
	cursor: pointer;
	padding: 0 4px;
}

.pdt-thumbs-nav:hover {
	color: var(--pdt-primary);
}

.pdt-product .pdt-title {
	font-size: var(--pdt-title-size);
	font-weight: 700;
	line-height: 1.4;
	margin: 0 0 20px;
}

.pdt-short-desc p {
	font-size: var(--pdt-font-size);
	color: var(--pdt-muted);
	line-height: 1.8;
	margin: 0 0 14px;
}

.pdt-btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-top: 36px;
	padding: 14px 22px;
	background: var(--pdt-primary);
	color: #fff !important;
	font-weight: 700;
	font-size: var(--pdt-font-size);
	text-decoration: none !important;
	transition: opacity 0.2s;
}

.pdt-btn:hover {
	opacity: 0.88;
}

/* ---------- 选项卡 ---------- */
.pdt-tabs {
	margin-top: 64px;
}

.pdt-tab-nav {
	display: flex;
	background: var(--pdt-primary);
}

.pdt-tab-btn {
	padding: 16px 44px;
	border: 0;
	border-right: 1px solid rgba(255, 255, 255, 0.4);
	background: transparent;
	color: #fff;
	font-family: Georgia, "Times New Roman", serif;
	font-weight: 700;
	font-size: var(--pdt-heading-size);
	letter-spacing: 0.5px;
	cursor: pointer;
}

.pdt-tab-btn.is-active {
	background: var(--pdt-primary-light);
	color: var(--pdt-primary);
}

.pdt-tab-panel {
	background: #fff;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
	padding: 32px 40px 40px;
	margin-top: 28px;
}

.pdt-tab-panel[hidden] {
	display: none;
}

.pdt-product .pdt-section-title {
	color: var(--pdt-primary);
	font-size: var(--pdt-heading-size);
	font-weight: 700;
	margin: 0 0 16px;
}

.pdt-divider {
	position: relative;
	height: 2px;
	background: var(--pdt-primary);
	margin-bottom: 28px;
}

.pdt-divider::before,
.pdt-divider span {
	content: "";
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background: var(--pdt-primary);
}

.pdt-divider::before {
	left: 0;
	width: 12px;
	height: 12px;
	border-radius: 50%;
}

.pdt-divider span {
	left: 20px;
	width: 22px;
	height: 6px;
	border-radius: 3px;
}

/* ---------- 参数表 ---------- */
.pdt-specs {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--pdt-font-size);
	margin: 0 0 32px;
}

.pdt-specs th,
.pdt-specs td {
	border: 1px solid var(--pdt-border);
	padding: 18px 20px;
	text-align: left;
	font-weight: 400;
	vertical-align: middle;
}

.pdt-specs tr:nth-child(odd) {
	background: var(--pdt-row-odd);
}

.pdt-specs tr:nth-child(even) {
	background: var(--pdt-row-even);
}

.pdt-specs th {
	width: 18%;
}

.pdt-content {
	font-size: var(--pdt-font-size);
}

.pdt-content img {
	max-width: 100%;
	height: auto;
}

.pdt-tag-list {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.pdt-tag-list a {
	display: inline-block;
	padding: 6px 14px;
	border: 1px solid var(--pdt-primary);
	color: var(--pdt-primary);
	text-decoration: none;
}

.pdt-tag-list a:hover {
	background: var(--pdt-primary);
	color: #fff;
}

/* ---------- 响应式 ---------- */
@media (max-width: 767px) {
	.pdt-breadcrumb-bar {
		--pdt-breadcrumb-indent: 20px;
	}
}

@media (max-width: 900px) {
	.pdt-top {
		grid-template-columns: 1fr;
		gap: 28px;
	}

	.pdt-tab-btn {
		padding: 14px 18px;
	}

	.pdt-tab-panel {
		padding: 20px 16px;
	}

	/* 手机上参数表改为每行一组 */
	.pdt-specs,
	.pdt-specs tbody,
	.pdt-specs tr {
		display: block;
	}

	.pdt-specs tr {
		display: grid;
		grid-template-columns: 40% 60%;
	}

	.pdt-specs th,
	.pdt-specs td {
		width: auto;
		padding: 12px;
	}

	.pdt-specs .pdt-empty {
		display: none;
	}
}