import { expect, test } from '@playwright/test';
import { expectNoHorizontalOverflow } from './smoke-helpers';

test('mobile navigation opens with vendored foundation behavior', async ({
  page,
  isMobile,
}) => {
  test.skip(!isMobile, 'mobile navigation is covered by the mobile project');

  await page.goto('/');
  await page.getByLabel('Toggle navigation').click();

  const mobilePanel = page.locator('#navbar-collapse-with-animation');

  await expect(
    mobilePanel.getByRole('link', { name: 'Platform', exact: true }),
  ).toBeVisible();
  await expect(
    mobilePanel.getByRole('link', { name: 'Request walkthrough' }),
  ).toBeVisible();
  await expectNoHorizontalOverflow(page);
});

test('theme toggle keeps page content visible', async ({ page }) => {
  await page.goto('/');

  await page.locator('button[aria-label="Dark Theme Toggle"]:visible').click();
  await expect(page.getByRole('heading', { name: /Evidence-first governance/ }))
    .toBeVisible();

  await page.locator('button[aria-label="Light Theme Toggle"]:visible').click();
  await expect(page.getByRole('heading', { name: /Evidence-first governance/ }))
    .toBeVisible();
});