const test = require('node:test');
const assert = require('node:assert/strict');
const fs = require('node:fs');
const path = require('node:path');

const root = path.resolve(__dirname, '..', '..');
const read = (file) => fs.readFileSync(path.join(root, file), 'utf8');

test('article TOC widget uses the shared reference tree styles, not posts-navs page CSS', () => {
  const routeCss = read('assets/css/routes/posts-navs.css');
  const mainCss = read('assets/css/main.css');

  assert.doesNotMatch(routeCss, /\.posts-nav-box|\.posts-nav-lists|\.aksrt-section-nav/);
  for (const selector of [
    '.posts-nav-lists .bl',
    '.posts-nav-lists li.n-H1 a',
    '.posts-nav-lists li.n-H3 a',
    '.posts-nav-lists li.active::before',
  ]) assert.ok(mainCss.includes(selector), `main.css retains reference tree rule ${selector}`);
  assert.match(mainCss, /\.posts-nav-box\s*\{[^}]*font-family:\s*inherit;[^}]*font-size:\s*14px;[^}]*line-height:\s*1\.42857143;/s);
  const panel = mainCss.match(/\.posts-nav-box \.zib-widget\s*\{([^}]*)\}/)?.[1] || '';
  for (const declaration of [
    /background-color:\s*var\(--main-bg-color\)/,
    /padding:\s*15px/,
    /border-radius:\s*var\(--main-radius\)/,
    /box-shadow:\s*0 0 10px var\(--main-shadow\)/,
    /margin-bottom:\s*20px/,
  ]) assert.match(panel, declaration);
});

test('mobile TOC panel and its collapse control remain styled and accessible', () => {
  const mainCss = read('assets/css/main.css');

  assert.match(mainCss, /\.mobile-navbar \.posts-nav-box \.zib-widget\s*\{[^}]*background:\s*var\(--muted-border-color\);[^}]*box-shadow:\s*none;/s);
  assert.match(mainCss, /\.posts-nav-lists \.nav-toggle-collapse\s*\{[^}]*border:\s*0;[^}]*background:\s*transparent;/s);
  assert.match(mainCss, /\.posts-nav-box \.posts-nav-lists :where\(a, \.nav-toggle-collapse\):focus-visible/);
  assert.match(mainCss, /@media \(prefers-reduced-motion: reduce\)[\s\S]*?\.posts-nav-lists \.nav-toggle-collapse \{\s*transition:\s*none;/);
  assert.doesNotMatch(mainCss, /\.mobile-navbar \.posts-nav-box \.aksrt-panel/);
  assert.doesNotMatch(read('assets/widgets/frontend.css'), /\.posts-nav-box|\.posts-nav-lists/);
});