/**
 * 场景选择器（批X408）——发布表单 + Dokan 编辑共用。0 硬编码色·全 token。
 *
 * @package BumianTheme
 */

.b-scene__family { margin: 10px 0 0; }
.b-scene__family-name {
	margin: 0 0 6px;
	font-size: 12px;
	color: var(--ink-3);
	letter-spacing: 1px;
}
.b-scene__zones,
.b-scene__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.b-scene__chip {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 14px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: var(--bg-0);
	color: var(--ink-1);
	font-size: 13px;
	line-height: 1.4;
	cursor: pointer;
	user-select: none;
}
.b-scene__chip:hover { border-color: var(--line-strong); }
/* 〔批X414〕纯胶囊：checkbox 视觉隐藏但覆满整片（点击/键盘/读屏全保留）·选中态走 .is-checked
   类（scene-picker.js 同步·不赖 :has 兼容面）。 */
.b-scene__chip input {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	opacity: 0;
	cursor: pointer;
}
.b-scene__chip.is-checked {
	border-color: var(--brand);
	background: var(--brand-50);
	color: var(--brand-700);
	font-weight: 600;
}
.b-scene__chip.is-checked::before { content: "✓"; font-weight: 700; }
/* 〔批X426〕焦点环只留键盘路（鼠标点选后残留白环=站长截图里的观感杂音）。standalone :has
   规则（🔴不与兜底类并组·:has 不识别的老浏览器仅少键盘环·选中态本身不受影响）。 */
.b-scene__chip:has(> input:focus-visible) { outline: 2px solid var(--brand); outline-offset: 1px; }
/* 〔批X424 站长指正〕一级/二级选中态分层（原来同款紫描边分不清易蒙）：
   专区（一级）选中=实心主色白字·标签（二级）选中=保持浅底描边——一眼分层。 */
.b-scene__zones .b-scene__chip.is-checked {
	border-color: var(--btn-primary-bg, var(--brand));
	background: var(--btn-primary-bg, var(--brand));
	color: #fff;
}
/* 〔批X426〕原 :focus-within 焦点环撤（鼠标点选也命中=选中后残留白环）·键盘环见上方 :has 规则。
   〔批X427·Codex#21〕不支持 :has 的老浏览器兜底：退回 :focus-within（宁多环不失焦点可见性）。 */
@supports not selector(a:has(b)) {
	.b-scene__chip:focus-within { outline: 2px solid var(--brand); outline-offset: 1px; }
}
.b-scene__tags {
	margin: 10px 0 0;
	padding: 10px 12px;
	border: 1px dashed var(--line);
	border-radius: 10px;
	background: var(--bg-2);
}
/* 🔴 作者样式的 display:flex 会顶掉 [hidden] 的 UA 默认 display:none（X413 真雷：发布页 32 面板
   191 勾选框全体常开）——显式补回。勾选专区才展开面板的行为由 scene-picker.js 切 hidden 属性驱动。 */
.b-scene__tags[hidden] { display: none; }
.b-scene__tags-legend {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 0 4px;
	font-size: 12px;
	color: var(--ink-3);
}
/* 〔批X426〕面板归属锚：题头实心小胶囊=选中专区 chip 同视觉（双专区两块面板一眼配对）。 */
.b-scene__tags-zonechip {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 2px 10px;
	border-radius: 999px;
	background: var(--btn-primary-bg, var(--brand));
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.5;
}
.b-scene__chip--tag { font-size: 12.5px; padding: 4px 10px; }
.b-scene__err {
	margin: 8px 0 0;
	font-size: 12.5px;
	color: var(--danger-strong);
}
/* 〔批X422〕配额用尽示意：未选 chip 压灰（仍可点·点击回弹+文案在 scene-picker.js）。 */
.b-scene.is-zone-capped .b-scene__zones .b-scene__chip:not(.is-checked),
.b-scene.is-tag-capped .b-scene__chip--tag:not(.is-checked) { opacity: 0.45; }

/* Dokan 卖家中心容器内的间距对齐 */
.bumian-scene-fields .b-scene { margin: 0; }

/* —— 折叠外壳（批X414·默认收起一行·编辑态自动展开）——
   〔批X425 站长指正〕「确定」嵌进摘要条右侧（顶部搜索框同款布局）：summary 变 flex·
   文字子节点吃省略号·收起时钮隐藏（收起态点条=展开·无收合语义）。 —— */
.b-scene__fold-summary {
	display: flex;
	align-items: center;
	gap: 10px;
	cursor: pointer;
	padding: 6px 6px 6px 12px;
	border: 1px dashed var(--line-strong);
	border-radius: 999px;
	color: var(--ink-2);
	font-size: 13.5px;
	user-select: none;
	list-style: none;
}
.b-scene__fold-text {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;          /* 〔批X424〕摘要列所选名字·超长单行省略号（2 专区+5 标签极限态） */
	text-overflow: ellipsis;
	white-space: nowrap;
}
.b-scene__done {
	flex: 0 0 auto;
	height: 32px;
	padding: 0 20px;
	border: 0;
	border-radius: 999px;
	background: var(--btn-primary-bg, var(--brand));
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
}
.b-scene__done:hover { background: var(--btn-primary-bg-h, var(--brand-700)); }
.b-scene__done:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.b-scene__fold:not([open]) .b-scene__done { display: none; }
/* 〔批X425〕正规「其它」：与专区同款胶囊·列表末尾独立一行（虚线分隔示意「都不合适再选这个」）。 */
.b-scene__zones--other {
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px dashed var(--line);
}
.b-scene__fold-summary::-webkit-details-marker { display: none; }
.b-scene__fold-summary::before { content: "＋ "; color: var(--brand); font-weight: 700; }
.b-scene__fold[open] > .b-scene__fold-summary { border-style: solid; color: var(--ink-1); }
.b-scene__fold[open] > .b-scene__fold-summary::before { content: "－ "; }

/* ============================================================
   〔批X468〕触屏最小触控目标 —— 场景选择器是发布页/提问页的**必填**控件，却是全站最小的一批热区。
   实测 390 宽 + (pointer: coarse)：专区胶囊 82×30（一屏 60 个密排）、「其它」56×30、「确定」66×32。
   本主题的既有规矩是 44（X466 已按这条统一过卖家中心），这批是 X408 加选择器时的漏网。
   🔴 手法与 X466 一致：**补足可点区域、视觉尺寸不变** —— 胶囊里的 checkbox 本就绝对定位覆满整片，
   把它上下各外扩 7px（30+14=44）即可，胶囊本身一个像素都不动。
   🔴 同时把行间距从 8px 提到 14px：不提的话上下两行的热区会互相重叠（8 < 14），
   变成「按准了却选中隔壁」——比原来的小热区更糟。列间距不动（胶囊宽度本来就够）。
   ============================================================ */
@media (pointer: coarse) {

	/* 行间距先撑开，热区抬到 44 后才不会压到上下行：胶囊视觉 30 + 行距 16 = 46 > 44（专区）；
	   标签视觉约 26 + 行距 20 = 46 > 44。列间距不动（胶囊宽度本来就够）。 */
	.b-scene__zones {
		row-gap: 16px;
	}
	.b-scene__tags {
		row-gap: 20px;
	}

	/* 胶囊热区：**定高 44 垂直居中**盖住胶囊（不靠「视觉高 + 外扩」推算——胶囊行高/字号一变就又不达标）。
	   🔴 必须解掉基础件那条 height:100%，否则定高被压掉、白扩一场。 */
	.b-scene__chip input {
		inset: auto 0;
		top: 50%;
		transform: translateY(-50%);
		height: 44px;
		width: 100%;
	}

	/* 「确定」= 收起选择器的主动作，按不准会反复展开收起。 */
	.b-scene__done {
		min-height: 44px;
		height: auto;
	}
}