feat(header): add 叠加组件 with after_html per background item

「顶部多功能组件 → 背景内容」的每个背景项目新增「叠加组件」手风琴，
其中提供「组件下方额外内容」(after_html) 输入框，支持 HTML。

- 后台 schema：slider_item_fields 增加 overlay accordion（sanitize_type html），
  默认值与 PageConfigMetaBox / DisplayPageGroups 的默认项目同步带上空 overlay
- 保存：页面独立配置（page_config 元数据）按项目写入 overlay.after_html，
  沿用 wp_kses_post() 过滤
- 前端：after_html 作为 .slide-overlay-after 覆盖层输出在所属幻灯片内
  （幻灯片是 overflow:hidden 的定位层，放到幻灯片外会被裁掉），
  默认贴底居中、仅其中的链接与表单接收点击
- main.min.css 由 tools/build-public-assets.mjs 重新生成

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

tests/widget-system/header-multifunction-render.test.cjs

@@ -29,6 +29,8 @@ test('header multifunction renders reference slide, search, and card contracts o
   assert.match(desktop, /header-slider-search-more text-center before/);
   assert.match(desktop, /<div class="search-input">search-box<\/div>/);
   assert.match(desktop, /<div class="icon-cover-card flex ac jio-panel">Card one<\/div>/);
+  // 叠加组件（每项 after_html）跟随所属幻灯片输出，不能落到幻灯片之外。
+  assert.match(desktop, /<div class="slide-overlay-after"><div class="overlay-cta"><a href="https:\/\/example\.test\/cta">立即查看<\/a><\/div><\/div><\/div>/);
 
   assert.doesNotMatch(mobile, /background\.mp4/);
   assert.match(mobile, /data-src="https:\/\/example\.test\/mobile-only\.jpg"/);
@@ -56,8 +58,38 @@ test('header multifunction renders reference slide, search, and card contracts o
   assert.doesNotMatch(single, /swiper-pagination|swiper-button-prev/);
 });
 
-test('header card background setting is editable, saved, and defaults off', () => {
+test('each background item exposes an overlay group with after_html', () => {
   const schema = fs.readFileSync(path.join(root, 'src/Admin/Schema/SchemaPageDisplay.php'), 'utf8');
+  const metaBox = fs.readFileSync(path.join(root, 'src/Admin/PageConfigMetaBox.php'), 'utf8');
+  const helper = fs.readFileSync(path.join(root, 'inc/helpers/homepage/header-components.php'), 'utf8');
+  const css = fs.readFileSync(path.join(root, 'assets/css/main.css'), 'utf8');
+
+  // 后台：「背景内容」每个项目里都有「叠加组件」手风琴，含 HTML 输入框。
+  const itemFields = schema.slice(
+    schema.indexOf('private static function slider_item_fields'),
+    schema.indexOf('private static function slider_option_fields'),
+  );
+  assert.match(itemFields, /field\('overlay', '叠加组件', 'accordion'/);
+  assert.match(itemFields, /field\('after_html', '组件下方额外内容', 'textarea', '', \['sanitize_type' => 'html'/);
+  // 默认值里带上空 overlay，新加的项目不必手动展开即可保存。
+  assert.match(schema, /'overlay' => \['after_html' => ''\]/);
+
+  // 页面独立配置（page_config 元数据）同样落盘 after_html。
+  assert.match(metaBox, /\$overlay = is_array\(\$slide\['overlay'\] \?\? null\) \? \$slide\['overlay'\] : \[\]/);
+  assert.match(metaBox, /'after_html' => wp_kses_post\(\(string\) \(\$overlay\['after_html'\] \?\? ''\)\)/);
+  assert.match(metaBox, /'overlay' => \['after_html' => ''\]/);
+
+  // 前端：内容挂在所属幻灯片内，并作为覆盖层渲染。
+  assert.match(helper, /\$overlay_html = '<div class="slide-overlay-after">'/);
+  assert.match(helper, /\$slides_html \.= \$overlay_html;/);
+  assert.match(css, /\.slide-overlay-after \{[^}]*position: absolute/);
+  assert.match(css, /\.slide-overlay-after \{[^}]*z-index: 3/);
+  // 覆盖层不能挡住背景上的其它交互，只有其中的可交互元素接收点击。
+  assert.match(css, /\.slide-overlay-after \{[^}]*pointer-events: none/);
+  assert.match(css, /\.slide-overlay-after a,[\s\S]*?pointer-events: auto/);
+});
+
+test('header card background setting is editable, saved, and defaults off', () => {  const schema = fs.readFileSync(path.join(root, 'src/Admin/Schema/SchemaPageDisplay.php'), 'utf8');
   const settings = fs.readFileSync(path.join(root, 'src/Settings/DisplayPageGroups.php'), 'utf8');
   const metaBox = fs.readFileSync(path.join(root, 'src/Admin/PageConfigMetaBox.php'), 'utf8');