import { expect, test } from '@playwright/test';

for (const scenario of [
  { locale: 'en', dir: 'ltr' },
  { locale: 'fr', dir: 'ltr' },
  { locale: 'ar', dir: 'rtl' },
] as const) {
  test(`${scenario.locale} homepage assembles the approved section sequence`, async ({ page }) => {
    await page.goto(`/${scenario.locale}/system`);

    await expect(page.locator('html')).toHaveAttribute('dir', scenario.dir);
    await expect(page.locator('main h1')).toHaveCount(1);
    await expect(page.locator('#product')).toBeVisible();
    await expect(page.locator('#workflow')).toBeVisible();
    await expect(page.locator('#modules')).toBeVisible();
    await expect(page.locator('#pricing')).toBeVisible();
    await expect(page.locator('#faq')).toBeVisible();
    await expect(page.locator('main > section')).toHaveCount(12);
  });

  test(`${scenario.locale} unresolved actions remain non-navigable`, async ({ page }) => {
    await page.goto(`/${scenario.locale}/system`);

    const disabledActions = page.locator('main [aria-disabled="true"]');
    await expect(disabledActions).toHaveCount(2);
    await expect(disabledActions.first()).not.toHaveAttribute('href');
  });
}

test('Arabic preview preserves left-to-right vehicle identifiers', async ({ page }) => {
  await page.goto('/ar/system');
  const identifiers = page.locator('[role="table"] bdi');
  await expect(identifiers).toHaveCount(2);
  await expect(identifiers.first()).toHaveAttribute('dir', 'ltr');
});

test('homepage navigation targets resolve to real sections', async ({ page }) => {
  await page.goto('/en/system');
  for (const hash of ['product', 'workflow', 'modules', 'pricing', 'faq']) {
    await expect(page.locator(`#${hash}`)).toHaveCount(1);
    await expect(page.locator(`header a[href="/en/system#${hash}"]`)).toHaveCount(2);
  }
});

test('FAQ uses native disclosure behavior', async ({ page }) => {
  await page.goto('/en/system');
  const firstItem = page.locator('#faq details').first();
  await expect(firstItem).toHaveAttribute('open', '');
  await firstItem.locator('summary').click();
  await expect(firstItem).not.toHaveAttribute('open', '');
});

test('pricing recommends a plan from the selected fleet band', async ({ page }) => {
  await page.goto('/en/system');

  await expect(page.locator('#pricing [data-plan="launch"]')).toHaveAttribute(
    'data-recommended',
    'true',
  );
  await page.getByLabel('26–75 vehicles').check();
  await expect(page.locator('#pricing [data-plan="growth"]')).toHaveAttribute(
    'data-recommended',
    'true',
  );
  await page.getByLabel('Annual', { exact: true }).check();
  await expect(page.getByLabel('Annual', { exact: true })).toBeChecked();
});