import { expect, test } from './fixtures'

test('dark mode keeps lead workspace, dropdowns and modal surfaces readable', async ({ page }) => {
  await page.addInitScript(() => localStorage.setItem('theme', 'dark'))
  await page.setViewportSize({ width: 1440, height: 900 })

  await page.route('**/api/**', async (route) => {
    const url = new URL(route.request().url())
    if (!url.pathname.startsWith('/api/')) return route.continue()
    if (url.pathname === '/api/auth/me') return route.fulfill({ json: { data: {
      id: 1, name: 'مدیر تست', email: 'admin@example.test', roles: ['admin'],
      permissions: ['view_leads', 'create_calls', 'assign_leads'], is_active: true,
    } } })
    if (url.pathname === '/api/leads/1') return route.fulfill({ json: {
      id: 1, company: 'شرکت تست دارک', first_name: 'مینا', last_name: 'احمدی', phone: '09120000000',
      notes: [], contacts: [], contactRelations: [], callLogs: [], call_attempts: 2,
      assignee: { id: 2, name: 'کارشناس تست' },
    } })
    if (url.pathname === '/api/global-search') return route.fulfill({ json: { leads: [{ id: 1, company: 'شرکت تست دارک' }], deals: [], companies: [], contacts: [], calls: [] } })
    if (url.pathname === '/api/calls' || url.pathname === '/api/follow-ups') return route.fulfill({ json: { data: [], meta: { current_page: 1, last_page: 1, per_page: 50, total: 0 } } })
    if (url.pathname === '/api/call-results') return route.fulfill({ json: [{ id: 1, name: 'پاسخ نداد', color: '#64748b', is_positive: false, is_negative: true, is_final: false, requires_follow_up: false }] })
    if (url.pathname === '/api/timeline' || url.pathname === '/api/attachments') return route.fulfill({ json: { data: [] } })
    if (url.pathname === '/api/users/referral-targets') return route.fulfill({ json: [] })
    if (url.pathname === '/api/users') return route.fulfill({ json: { data: [] } })
    if (url.pathname === '/api/notifications/unread-count') return route.fulfill({ json: { data: 0 } })
    if (url.pathname === '/api/settings/public') return route.fulfill({ json: { data: {} } })
    return route.fulfill({ json: { data: [] } })
  })

  await page.goto('/leads/1')
  await expect(page.getByRole('heading', { name: 'شرکت تست دارک' })).toBeVisible()
  await expect(page.locator('html')).toHaveClass(/dark/)

  await page.getByRole('button', { name: /مدیر تست/ }).click()
  await expect(page.getByRole('dialog', { name: 'پروفایل من' })).toBeVisible()
  await expect(page.getByRole('tab', { name: 'حساب کاربری' })).toHaveAttribute('aria-selected', 'true')
  await page.getByRole('button', { name: 'بستن' }).click()

  await page.getByRole('textbox', { name: 'جست‌وجوی سراسری' }).fill('شرکت')
  const searchResult = page.getByRole('dialog', { name: 'نتایج جست‌وجو' }).getByRole('button').first()
  await expect(searchResult).toBeVisible()
  await searchResult.hover()
  expect(await searchResult.evaluate((element) => getComputedStyle(element).backgroundColor)).not.toBe('rgb(255, 255, 255)')

  await page.keyboard.press('Escape')
  await page.getByRole('button', { name: 'ثبت تماس' }).click()
  const dialog = page.getByRole('dialog', { name: 'ثبت تماس جدید' })
  await expect(dialog).toBeVisible()
  expect(await dialog.evaluate((element) => getComputedStyle(element).backgroundColor)).not.toContain('rgba')
  await expect(dialog.getByRole('combobox', { name: 'شماره تماس' })).toHaveCSS('color', 'rgb(248, 250, 252)')

  await page.getByRole('button', { name: 'بستن' }).click()
  await page.setViewportSize({ width: 375, height: 812 })
  await page.getByRole('tab', { name: /مخاطبین/ }).click()
  await expect(page.getByRole('heading', { name: 'مخاطبین مرتبط با لید' })).toBeVisible()
  expect(await page.evaluate(() => document.documentElement.scrollWidth <= document.documentElement.clientWidth)).toBe(true)
})