"""Gera comparativo lado-a-lado (antes vs depois) do v3_rachaduras."""
import base64
import mimetypes
from pathlib import Path
from playwright.sync_api import sync_playwright

ORIG = Path("/opt/mia/workspace/clientes/borrello/campanhas/quiz_fengshui_criativos/v3_rachaduras.png")
NOVO = Path("/opt/mia/workspace/clientes/borrello/campanhas/quiz_fengshui_criativos/corrigidos/v3_rachaduras_corrigido.png")
DEST = Path("/opt/mia/workspace/clientes/borrello/campanhas/quiz_fengshui_criativos/corrigidos/_COMPARACAO_rachaduras.png")


def img_to_data_uri(path: Path) -> str:
    mime, _ = mimetypes.guess_type(str(path))
    if not mime:
        mime = "image/png"
    b64 = base64.b64encode(path.read_bytes()).decode("ascii")
    return f"data:{mime};base64,{b64}"


HTML = f"""<!DOCTYPE html>
<html><head><meta charset="UTF-8">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@600;800&display=swap" rel="stylesheet">
<style>
  * {{ box-sizing: border-box; margin: 0; padding: 0; }}
  body {{
    width: 1920px;
    height: 1080px;
    background: #111;
    font-family: 'Inter', sans-serif;
    color: #fff;
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 40px;
    gap: 30px;
  }}
  .card {{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
  }}
  .label {{
    font-size: 32px;
    font-weight: 800;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    padding: 12px 26px;
    border-radius: 6px;
  }}
  .label.old {{ background: #a63a3a; }}
  .label.new {{ background: #2d7a2b; }}
  .sub {{
    font-size: 15px;
    opacity: 0.7;
    font-weight: 600;
    letter-spacing: 0.6px;
  }}
  img {{
    width: 900px;
    height: 900px;
    object-fit: contain;
    border-radius: 6px;
    box-shadow: 0 20px 50px rgba(0,0,0,0.5);
  }}
</style></head>
<body>
  <div class="card">
    <div class="label old">Antes (17px)</div>
    <img src="{img_to_data_uri(ORIG)}">
    <div class="sub">v3_rachaduras.png — original</div>
  </div>
  <div class="card">
    <div class="label new">Depois (21px, +23%)</div>
    <img src="{img_to_data_uri(NOVO)}">
    <div class="sub">v3_rachaduras_corrigido.png — publico 60+</div>
  </div>
</body></html>
"""


def main():
    with sync_playwright() as p:
        browser = p.chromium.launch()
        page = browser.new_page(viewport={"width": 1920, "height": 1080})
        page.set_content(HTML, wait_until="networkidle")
        page.wait_for_timeout(600)
        page.screenshot(path=str(DEST), clip={"x": 0, "y": 0, "width": 1920, "height": 1080})
        browser.close()
    print(f"[OK] {DEST}")


if __name__ == "__main__":
    main()
