/**
 * 全站菜单统一 — 对齐主站 www.superlabsuisse.com (gt_one)
 * v0.6.57 (2026-09-23): 从 expert.css 拆出 (原仅专家页生效, 现前台全站加载)
 *   内容: 菜单样式 (14.4px/400/padding 8x50/词距100) · 悬停全展开 · 毛玻璃=导航自身下延 ·
 *         撑开动效 · 透明渐入 · 收起 1.3s / 展开 0.45s
 *   加载: class-gt-expert-profile.php enqueue_menu_unify (priority 99, 主题样式之后)
 *   v0.6.58: 玻璃态过渡 (0.55s) + 展开保持 body.gt-menu-open (配 menu-unify.js: 离开整块 header 才收起)
 *   注意: 勿动 site-header 的 position (主题 fixed 吸顶)
 */
/* ===== 4. 2026-09-23 (用户需求): 菜单样式与主站 www.superlabsuisse.com 统一 =====
   主站规格 (gt_one 实测 computed): 主/子菜单项 14.4px / font-weight 400 / padding 8px 32px
   merge 原样 (storefront): 16px / 500 / padding 8px — 调成主站规格 */

/* 4.1 主菜单项: 字号字重对齐主站 + 水平内边距 (主菜单项间距; 桌面结构 = #menu-main-menu) */
body #site-navigation #menu-main-menu > li.menu-item > a {
	font-size: 14.4px;
	font-weight: 400;
	/* 2026-09-24 (用户): 词间距减到 60px = 左右 padding 各 30px (原 100px/50px) */
	padding: 8px 30px;
	line-height: 1.35;
}

/* 4.1b 2026-09-24 (用户): 主菜单项下拉箭头改为绝对定位 (右侧 padding 区内, 不占文字流)
   — 箭头原随文字流占 ~22px, 使带子菜单的项与下一项间距比其项大 (实测 82 vs 60);
   挪到右 padding(30px)区后 (箭头 20px 恰好放下), 全部词间距恒 = 60px */
body #site-navigation #menu-main-menu > li.menu-item.menu-item-has-children > a {
	position: relative;
}
body #site-navigation #menu-main-menu > li.menu-item.menu-item-has-children > a::after {
	position: absolute;
	right: 5px;
	top: 50%;
	margin-top: -0.5em;
	margin-left: 0;
}

/* 4.2 子菜单项: 同主站规格 + 文字与主菜单左对齐 (同 padding-left 32px; 清除主题 ul 缩进) */
body #site-navigation #menu-main-menu > li.menu-item > ul.sub-menu .menu-item a {
	font-size: 14.4px;
	font-weight: 400;
	/* 左 30px 与主菜单项 a 的 padding-left 一致 → 子菜单项文字与主菜单项文字左对齐 */
	padding: 8px 30px;
	line-height: 1.35;
	text-decoration: none;
}
body #site-navigation #menu-main-menu > li.menu-item > ul.sub-menu {
	margin-left: 0;
}

/* 4.3 子菜单项间距 (主站 9px) + hover 下划线 (主站形式) */
body #site-navigation #menu-main-menu > li.menu-item > ul.sub-menu > .menu-item:not(:last-child) {
	margin-bottom: 9px;
}
body #site-navigation #menu-main-menu > li.menu-item > ul.sub-menu > .menu-item a:hover {
	text-decoration: underline;
}

/* ===== 5. 2026-09-23 (用户确认): 子菜单悬停展开 — 对齐主站 gt_one "整条菜单 hover → 全部子菜单同时展开" 行为 =====
   桌面端: 主题原为"单项 hover 展开"(li:hover ul.sub-menu max-height 0→50vh);
   主站为"移入菜单条 → 所有子菜单一起平滑展开"; 此处覆盖为主题同款 + 0.9s 过渡 */
@media all and (min-width: 768px) {
	body .site-header .main-navigation ul.menu ul.sub-menu {
		transition: max-height 0.9s ease;
	}
	body .site-header .main-navigation ul.menu:hover ul.sub-menu,
	body.gt-menu-open .site-header .main-navigation ul.menu ul.sub-menu {
		max-height: 50vh;
	}
	/* 毛玻璃随整条菜单 hover 生效 (主题已有 :has 规则, 这里补 menu:hover 场景) */
	body .site-header:has(.main-navigation ul.menu:hover) {
		-webkit-backdrop-filter: blur(40px);
		backdrop-filter: blur(40px);
	}
}

/* ===== 6. 2026-09-23 (用户需求): 主菜单项"展开撑开/离开收回"动效 (对齐主站 gt_one) =====
   主站机制: 菜单容器 padding 35% →(hover) 23%, 0.7s ease → 菜单项间距视觉变大;
   merge 等效: hover 菜单条时主菜单项横向间距放大 (margin 过渡), 离开自动收回 */
@media all and (min-width: 768px) {
	/* 收起态: 主菜单整体居中 + 项间靠拢
	   (覆盖 storefront .woocommerce-active .site-header .main-navigation 的 width:73.9%/float) */
	body .site-header .main-navigation {
		width: 100% !important;
		float: none !important;
	}
	body .site-header .main-navigation #menu-main-menu {
		display: flex;
		justify-content: center;
		width: 100% !important;
		float: none !important;
		/* 抵消 nav 盒子起点 (logo 区之后) 的偏移, 使菜单项真正视口居中 (CDP 实测 29px) */
		margin-left: -29px;
	}
	body .site-header .main-navigation #menu-main-menu > li.menu-item {
		/* 收起态: 项间 0px + li/a 缩到内容宽 (词间距恒定 = a 左右 padding 之和 = 100px) */
		margin-left: 0;
		margin-right: 0;
		width: fit-content !important;
		/* 2026-09-24: 覆盖主题 .main-navigation ul li 的 max-width:15% 与 min-width:130px —
		   (a) max-width:15%: 窄视口 (1440 容器 1001 × 15% = 150px < 内容) 压窄项, 词间距被挤小;
		   (b) min-width:130px: 内容窄的项 (如 Fittings 48+60=108) 被撑到 130, 多出 22px 空隙;
		   两条去掉后: 项宽=内容+padding, 词间距恒 = padding 和 (60px) */
		max-width: none !important;
		min-width: 0 !important;
		transition: margin 0.7s ease;
	}
	body .site-header .main-navigation #menu-main-menu > li.menu-item > a {
		width: fit-content !important;
	}
	/* 2026-09-23 (根因修复): 子菜单项宽也放开 — storefront 的 ul ul li a{width:200px}
	   会通过隐藏子菜单的 scrollWidth 撑宽父 li (200px), 以致主菜单项宽被锁死、词间距不匀 */
	body .site-header .main-navigation #menu-main-menu ul.sub-menu li {
		width: auto !important;
		min-width: 0 !important;
		max-width: none !important;
	}
	body .site-header .main-navigation #menu-main-menu ul.sub-menu li a {
		width: auto !important;
	}
	/* 展开态: 从居中位置同时向两侧撑开 */
	body .site-header .main-navigation #menu-main-menu:hover > li.menu-item,
	body.gt-menu-open .site-header .main-navigation #menu-main-menu > li.menu-item {
		margin-left: 26px;
		margin-right: 26px;
	}
}

/* ===== 7. 2026-09-23 (用户需求): 子菜单项 hover 背景色去掉 (保留下划线) ===== */
body .site-header .main-navigation ul.menu ul.sub-menu li a:hover,
body .site-header .main-navigation ul.menu ul.sub-menu li:hover > a,
body .site-header .main-navigation ul.menu ul.sub-menu li.focus,
body .site-header .main-navigation ul.menu ul.sub-menu .menu-item a:hover {
	background-color: transparent !important;
}

/* ===== 8. 2026-09-23 (用户需求): 菜单项不换行 (小屏不拆词, 对齐主站 white-space:nowrap) ===== */
body .site-header .main-navigation #menu-main-menu > li.menu-item > a,
body .site-header .main-navigation #menu-main-menu > li.menu-item > ul.sub-menu .menu-item > a {
	white-space: nowrap;
}

/* ===== 9. 2026-09-23 (用户需求): 子菜单展开时透明度渐入 =====
   收起 opacity 0 → hover 展开 opacity 1 (延迟 0.2s 让 max-height 先滑开, 再浮现内容) */
@media all and (min-width: 768px) {
	body .site-header .main-navigation #menu-main-menu > li.menu-item > ul.sub-menu {
		opacity: 0;
		transition: max-height 0.9s ease, opacity 0.55s ease 0.2s;
	}
	body .site-header .main-navigation #menu-main-menu:hover > li.menu-item > ul.sub-menu,
	body.gt-menu-open .site-header .main-navigation #menu-main-menu > li.menu-item > ul.sub-menu {
		opacity: 1;
	}
}

/* ===== 10. 2026-09-23 (根因修复二): 子菜单浮层化 =====
   子菜单 "Molecular Biology"(114px) 等比主词宽的 intrinsic 宽(178px) 会撑大父 li,
   使主菜单词间距不匀 (首项 109 vs 100)。改绝对定位浮层: 不参与父宽计算, 词间距恒定 100px */
@media all and (min-width: 768px) {
	body .site-header .main-navigation #menu-main-menu > li.menu-item {
		position: relative; /* 浮层锚点 */
	}
	body .site-header .main-navigation #menu-main-menu > li.menu-item > ul.sub-menu {
		position: absolute !important;
		top: 100%;
		left: 0;
		width: max-content !important;
		min-width: 100%;
		z-index: 9999;
		/* 子菜单自身无任何背景 (用户 2026-09-23) — 统一毛玻璃由 §13 导航自身下延承载 */
		background-color: transparent;
	}
}

/* ===== 13. 2026-09-23 (用户): 统一毛玻璃 — 用导航自身向下延伸承载 =====
   展开时 header (fixed, 自带毛玻璃背景) padding-bottom 增高 → 同一块玻璃自然覆盖下拉区,
   无第二块玻璃 (此前 body::before 方案割裂 + 图层挡子菜单, 已弃用) */
@media all and (min-width: 768px) {
	body .site-header {
		/* 收起: padding 1.3s 慢; 玻璃态 (blur/背景) 0.55s 平滑 — "毛玻璃 ⇄ 全透明"动画 */
		transition: padding-bottom 1.3s ease, background-color 0.55s ease,
			-webkit-backdrop-filter 0.55s ease, backdrop-filter 0.55s ease;
	}
	/* 透明头部 (首页/shop 无 .blue): 常态显式 blur(0px) → blur 过渡可插值 (none 不可插值) */
	body .site-header:not(.blue) {
		-webkit-backdrop-filter: blur(0px);
		backdrop-filter: blur(0px);
	}
	body.gt-menu-open .site-header,
	body .site-header:has(.main-navigation ul.menu:hover) {
		padding-bottom: 350px;
		transition: padding-bottom 0.45s ease, background-color 0.55s ease,
			-webkit-backdrop-filter 0.55s ease, backdrop-filter 0.55s ease; /* 展开: padding 原速 */
	}
	/* 展开保持期玻璃态: 鼠标移出菜单条到下延区/子菜单时 :hover 失效, 由 gt-menu-open 接管 */
	body.gt-menu-open .site-header {
		-webkit-backdrop-filter: blur(40px);
		backdrop-filter: blur(40px);
	}
}

/* ===== 16. 2026-09-23 (用户): 移动端 header 布局收口 + 弹出菜单文字色 =====
   需求: logo 最左 / [搜索+会员图标] 其右 / 汉堡最右; 弹出菜单文字始终品牌蓝 */
@media all and (max-width: 900px) {
	/* ① logo: 主题为"绝对居中"(left:50%+translateX(-50%)) → 改为左对齐 */
	body .site-header .storefront-primary-navigation .logo_pc {
		left: 0;
		transform: none;
	}
	/* ② 汉堡按钮: 从最左(flex 首 item) → 最右 (order 推末尾; 图标组自然在其左) */
	body .site-header .storefront-primary-navigation .phone_site_button {
		order: 99;
		margin-left: 12px;
	}
	/* ③ 弹出菜单 (handheld; 背景 #EEE 浅灰) 文字始终品牌蓝 — 原有白字在浅灰上不可读 */
	body .site-header .handheld-navigation ul.menu li a,
	body .site-header #menu-handheld-menu li a {
		color: #001A71 !important;
	}
	/* ④ logo 显示修复 (用户 2026-09-23 "手机版看不到 logo"):
	   主题 mobile 段 .custom-logo-link img{width:200px;padding:20px} × 全局 box-sizing:border-box
	   × 基础段 max-height:23px → 内容区被 padding(40px) 挤到 0 高, 图片内容不绘制
	   (元素与背景区仍在——"红底可见白笔画无")。归零 padding + 自然高度 → 内容恢复 */
	body .site-header .site-logo-anchor img,
	body .site-header .site-logo-link img,
	body .site-header .custom-logo-link img {
		padding: 0 !important;
		width: 160px !important; /* 用户 2026-09-24 指定 200→160 */
		height: auto !important;
		max-height: none !important;
		min-height: 0 !important;
	}
}

/* ===== 17. 2026-09-23 (用户): 汉堡图标颜色 + 图标组贴近汉堡 ===== */
/* ① 汉堡三条线: 透明头(首页未滚动) → 白色 (原 #000 在深色首图上看不见); blue 头(毛玻璃白底) → 品牌蓝 */
body .site-header .phone_site_button span {
	background-color: #fff !important;
}
body .site-header.blue .phone_site_button span {
	background-color: #001A71 !important;
}
/* ② 移动端 [搜索/会员] 图标组贴近汉堡 (主题 col-full 为 space-between, 图标组被留在中段与汉堡距 ~80px) */
@media all and (max-width: 900px) {
	body .site-header .storefront-primary-navigation .right-top-menu-navigation.right-top-menu-navigation-phone {
		margin-left: auto;
	}
}

/* ===== 18 (v2). 2026-09-24 (用户定稿): #masthead padding + 弹层菜单目标形态 ===== */
@media all and (max-width: 900px) {
	/* ① #masthead: 去掉上下 padding (用户 2026-09-23 指定) */
	body #masthead {
		padding-top: 0;
		padding-bottom: 0;
	}
	/* ② 弹出菜单 (handheld): 用户 2026-09-24 退回毛玻璃版 —
	   fixed 全宽 + 无 transform (iOS backdrop 兼容) + 通透玻璃 0.55+saturate(1.8);
	   padding-top 12vw 为用户定稿值;
	   滚动后仍正常依赖 §19 (弹层打开期间关闭 header backdrop) */
	body #site-navigation .menu {
		position: fixed;
		top: 0;
		left: 0;
		transform: none;
		width: 100vw;
		padding-top: 12vw;
		min-height: 100vh;
		background-color: rgba(255, 255, 255, 0.55);
		-webkit-backdrop-filter: blur(24px) saturate(1.8);
		backdrop-filter: blur(24px) saturate(1.8);
	}
}

/* ===== 19 (v2.1 修复). 2026-09-24: 弹层打开期间临时关闭 header backdrop — 仅手机 =====
   header 的 backdrop-filter 使其成为 backdrop root, 会拦截后代弹层的模糊采样
   (滚动后复现); 弹层打开时 header 被盖住, 关掉视觉无损, 关闭即恢复.
   ⚠ v2.1: 原全局规则会在桌面 hover 菜单时同样触发 (gt-menu-open 桌面也加) →
   压掉 §14 的桌面毛玻璃 blur(40) → 桌面"菜单展开后毛玻璃缺失"; 限定 ≤900 后两全. */
@media all and (max-width: 900px) {
	body.gt-menu-open .site-header {
		-webkit-backdrop-filter: none !important;
		backdrop-filter: none !important;
	}
}

/* ===== 20 (v2.1 修复). 2026-09-24 (用户): 弹层打开时 logo 与汉堡始终品牌蓝 — 仅手机 =====
   弹层为浅色玻璃, 透明头状态的白 logo/白汉堡在其上不可读 → 弹层打开期间(gt-menu-open)
   切换为品牌蓝; 关闭即恢复.
   ⚠ v2.1: 原全局规则会在桌面 hover 菜单时把 logo 强制变蓝 →
   "桌面版菜单展开后 logo 不强制变色" → 限定 ≤900 后桌面不受影响. */
@media all and (max-width: 900px) {
	body.gt-menu-open .site-header .site-logo-anchor img,
	body.gt-menu-open .site-header .site-logo-link img,
	body.gt-menu-open .site-header .custom-logo-link img {
		filter: brightness(0) invert(11%) sepia(100%) saturate(7500%) hue-rotate(220deg) brightness(0.44) !important;
	}
	body.gt-menu-open .site-header .phone_site_button span {
		background-color: #001A71 !important;
	}
}

/* ===== 21. 2026-09-24 (用户): 手机版产品短描述字号 ===== */
@media all and (max-width: 900px) {
	body .product-short-description {
		font-size: 0.7em;
	}
}

/* ===== 22. 2026-09-24 (用户): 手机版弹层子菜单展开/收起 =====
   原过渡 = storefront .handheld-navigation .sub-menu 的 "all 0.9s" — 过长,
   且弹层有 backdrop-filter(每帧重采样), 0.9s 长动画期间明显卡顿 →
   改为明确的过渡: max-height 0.5s + opacity 0.4s (0.9s 太慢卡顿 → 0.35s 又嫌快 → 0.5s; 展开/收起同 tick 启动同时完成) */
@media all and (max-width: 900px) {
	body #menu-handheld-menu > li.menu-item > ul.sub-menu {
		transition: max-height 0.5s ease, opacity 0.4s ease !important;
	}
	/* 展开态高度 = 真实内容高 (JS 写入 --gt-subh; 见 menu-unify.js)
	   原 100vh 的隐形段让"展开"与"收起"的可见部分在时间轴错位 → 观感"先开后关";
	   真实高度后: 开/关同距离同曲线, 完全同步 */
	body #menu-handheld-menu > li.menu-item.show > ul.sub-menu {
		max-height: var(--gt-subh, 100vh) !important;
	}
}

/* ===== 23. 2026-09-24 (用户): 手机版弹层子菜单避免显示滚动条 =====
   子菜单展开态 overflow:auto (主题 woocommerce 规则) 内容超高或动画期间会显示滚动条 →
   隐藏滚动条样式, 保留滚动能力 (仍可滚, 只是无可见条) */
@media all and (max-width: 900px) {
	body #menu-handheld-menu,
	body #menu-handheld-menu ul.sub-menu {
		scrollbar-width: none; /* Firefox */
		-ms-overflow-style: none; /* 旧 Edge/IE */
	}
	body #menu-handheld-menu::-webkit-scrollbar,
	body #menu-handheld-menu ul.sub-menu::-webkit-scrollbar {
		display: none; /* Chrome / Safari / iOS */
		width: 0;
		height: 0;
	}
}

/* ===== 24. 2026-09-24 (用户): 手机版弹层展开箭头右对齐 =====
   箭头 a::after 原为流式(跟随文字后) → 绝对定位贴行右端、垂直居中;
   竖直用 margin(-半高) 而非 transform — 避免与主题 .show 的 transform: scaleY(-1) 冲突 */
@media all and (max-width: 900px) {
	body #menu-handheld-menu > li.menu-item > a {
		position: relative;
	}
	body #menu-handheld-menu > li.menu-item > a::after {
		/* 尺寸与图形位按桌面段设定 (用户给定: 1em + background-position: right) */
		width: 1em;
		height: 1em;
		background-position: right;
		/* 右对齐定位 */
		position: absolute;
		right: 0;
		top: 50%;
		margin-top: -0.5em; /* 1em 的半高 */
	}
}
