import { expect, test } from "vitest"

test("CTA button snapshot", async () => {
  const html = `
    <main
      style="
        font-family: 'Inter', sans-serif;
        padding: 48px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(135deg, #111827, #1f2937);
        min-height: 320px;
      "
    >
      <button
        data-testid="cta"
        style="
          font-size: 18px;
          padding: 14px 28px;
          border-radius: 9999px;
          border: none;
          color: white;
          background: #2563eb;
          box-shadow: 0 10px 20px rgba(37, 99, 235, 0.35);
          cursor: pointer;
        "
      >
        Abrir chamado
      </button>
    </main>
  `

  document.body.innerHTML = html

  const ctaButton = document.querySelector("[data-testid='cta']")
  expect(ctaButton).toBeTruthy()

  await expect(document.body).toMatchScreenshot("cta-button")
})