"""
Generate per-page OG preview images for divito-lending.com.

Reads og-preview.html as the design template, then for each page creates a
customized HTML with a different tag/headline/subtitle, renders to 1200x630
PNG via headless Chrome, and converts to JPG.

Output: og-<slug>.png + og-<slug>.jpg in the site root.
"""

import subprocess
import shutil
from pathlib import Path

SITE_DIR = Path("/Users/dannydivito/Downloads/divito-lending-website")
CHROME = "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome"

# Per-page content. Headlines use {em} to highlight one word in blue.
PAGES = {
    "index": {
        "tag": "Florida Mortgage Experts",
        "headline": "Get the {em}Best{/em} Mortgage<br>Without the Stress.",
        "subtitle": "We shop 50+ top lenders to find you the lowest rate — with real human advisors guiding you every step of the way.",
    },
    "mortgage-calculator": {
        "tag": "Free Mortgage Calculator",
        "headline": "Calculate Your<br>{em}Monthly Payment.{/em}",
        "subtitle": "Estimate your payment, total interest, and a full amortization schedule in seconds. Free, instant, no signup.",
    },
    "contact": {
        "tag": "Talk to a Licensed Advisor",
        "headline": "Let's Talk About<br>{em}Your Mortgage.{/em}",
        "subtitle": "Real advisors, real answers. We're available 7 days a week to help you navigate your options and get the best rate.",
    },
    "home-loan-products": {
        "tag": "All Loan Types",
        "headline": "Find the Right<br>{em}Home Loan{/em} for You.",
        "subtitle": "Conventional, FHA, VA, Jumbo, Reverse, Commercial — we shop them all to find your best fit and lowest rate.",
    },
    "first-time-buyer": {
        "tag": "First-Time Home Buyer",
        "headline": "Your First Home<br>{em}Starts Here.{/em}",
        "subtitle": "Low down payment options, free pre-approval, and real advisors who guide you through every step of buying your first home.",
    },
    "refinancing-guide": {
        "tag": "Complete Refinancing Guide",
        "headline": "Lower Your Rate.<br>{em}Lower Your Payment.{/em}",
        "subtitle": "6 refinance types explained — when it makes sense, what it costs, and how fast you can close. Florida's refinance experts.",
    },
    "resource-center": {
        "tag": "Mortgage Resource Center",
        "headline": "Everything You Need<br>to {em}Make the Right Move.{/em}",
        "subtitle": "Free guides, calculators, and educational articles from licensed Florida mortgage professionals.",
    },
    "article": {
        "tag": "Mortgage Insights & Guides",
        "headline": "Expert Mortgage Advice<br>{em}Made Simple.{/em}",
        "subtitle": "In-depth articles from licensed Florida mortgage professionals — practical guidance for buyers, owners, and investors.",
    },
}


def build_html(content):
    """Build the OG HTML for one page. Mirrors og-preview.html structure."""
    headline = (
        content["headline"]
        .replace("{em}", '<em>')
        .replace("{/em}", '</em>')
    )
    return f"""<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
*{{margin:0;padding:0;box-sizing:border-box;}}
body{{
  width:1200px;height:630px;overflow:hidden;
  font-family:'Helvetica Neue','Inter','Arial',sans-serif;
  background:#0A1628;
  position:relative;
  color:#fff;
  -webkit-font-smoothing:antialiased;
}}
.bg-pattern{{position:absolute;inset:0;background-image:radial-gradient(circle at 18% 30%,rgba(37,99,235,0.22) 0%,transparent 45%),radial-gradient(circle at 92% 95%,rgba(96,165,250,0.18) 0%,transparent 50%),linear-gradient(135deg,#0A1628 0%,#12274D 60%,#1B5DC4 140%);}}
.grid-dots{{position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,0.05) 1px,transparent 1px);background-size:28px 28px;opacity:0.6;}}
.accent-line{{position:absolute;top:0;left:0;width:100%;height:4px;background:linear-gradient(90deg,#2563EB 0%,#60A5FA 50%,#2563EB 100%);}}
.container{{position:relative;z-index:2;display:flex;flex-direction:column;height:100%;padding:60px 70px;}}
.logo-row{{display:flex;align-items:center;justify-content:space-between;margin-bottom:60px;}}
.logo{{display:flex;align-items:center;gap:14px;}}
.logo-mark{{width:56px;height:56px;border-radius:14px;background:linear-gradient(135deg,#2563EB,#1B5DC4);display:flex;align-items:center;justify-content:center;font-family:Georgia,serif;font-size:30px;font-weight:700;color:#fff;box-shadow:0 8px 24px rgba(37,99,235,0.4);}}
.logo-text{{font-size:30px;font-weight:800;color:#fff;letter-spacing:-0.5px;}}
.logo-text em{{font-style:normal;color:#60A5FA;}}
.badge{{display:inline-flex;align-items:center;gap:10px;padding:10px 18px;border-radius:100px;background:rgba(37,99,235,0.18);border:1px solid rgba(37,99,235,0.4);font-size:14px;font-weight:700;color:#93C5FD;letter-spacing:1.5px;text-transform:uppercase;}}
.badge::before{{content:'';width:8px;height:8px;border-radius:50%;background:#4ADE80;box-shadow:0 0 12px #4ADE80;}}
.main{{flex:1;display:flex;align-items:center;}}
.headline-col{{flex:1;}}
.tag{{font-size:14px;font-weight:800;color:#60A5FA;letter-spacing:3px;text-transform:uppercase;margin-bottom:24px;display:flex;align-items:center;gap:14px;}}
.tag::before{{content:'';width:32px;height:2px;background:#60A5FA;border-radius:2px;}}
h1{{font-size:72px;font-weight:900;line-height:1.06;letter-spacing:-2.5px;margin-bottom:28px;color:#fff;}}
h1 em{{font-style:normal;color:#60A5FA;}}
.subtitle{{font-size:21px;line-height:1.5;color:rgba(255,255,255,0.7);max-width:680px;font-weight:400;}}
.stats{{display:flex;gap:48px;margin-top:36px;}}
.stat{{text-align:center;}}
.stat .num{{font-size:38px;font-weight:900;color:#60A5FA;line-height:1;letter-spacing:-1px;}}
.stat .lbl{{font-size:12px;font-weight:700;letter-spacing:1.5px;color:rgba(255,255,255,0.5);text-transform:uppercase;margin-top:6px;}}
.footer-row{{display:flex;align-items:center;justify-content:space-between;padding-top:32px;border-top:1px solid rgba(255,255,255,0.08);margin-top:auto;}}
.url{{display:inline-flex;align-items:center;gap:10px;font-size:18px;font-weight:700;color:#fff;letter-spacing:0.5px;}}
.url-arrow{{width:32px;height:32px;border-radius:50%;background:#2563EB;display:flex;align-items:center;justify-content:center;font-size:16px;}}
.nmls{{font-size:12px;color:rgba(255,255,255,0.4);letter-spacing:1.5px;text-transform:uppercase;font-weight:600;}}
.house{{position:absolute;right:60px;top:50%;transform:translateY(-30%);width:340px;height:340px;opacity:0.5;z-index:1;pointer-events:none;}}
</style>
</head>
<body>
<div class="bg-pattern"></div>
<div class="grid-dots"></div>
<div class="accent-line"></div>
<svg class="house" viewBox="0 0 340 340" fill="none">
  <defs>
    <linearGradient id="houseGrad" x1="0" y1="0" x2="1" y2="1">
      <stop offset="0%" stop-color="#60A5FA" stop-opacity="0.9"/>
      <stop offset="100%" stop-color="#2563EB" stop-opacity="0.5"/>
    </linearGradient>
  </defs>
  <path d="M 170 40 L 60 140 L 280 140 Z" stroke="url(#houseGrad)" stroke-width="3" fill="none"/>
  <rect x="80" y="140" width="180" height="160" stroke="url(#houseGrad)" stroke-width="3" fill="none"/>
  <rect x="148" y="220" width="44" height="80" stroke="url(#houseGrad)" stroke-width="3" fill="none"/>
  <rect x="100" y="170" width="36" height="36" stroke="url(#houseGrad)" stroke-width="3" fill="none"/>
  <rect x="204" y="170" width="36" height="36" stroke="url(#houseGrad)" stroke-width="3" fill="none"/>
  <line x1="118" y1="170" x2="118" y2="206" stroke="url(#houseGrad)" stroke-width="2"/>
  <line x1="100" y1="188" x2="136" y2="188" stroke="url(#houseGrad)" stroke-width="2"/>
  <line x1="222" y1="170" x2="222" y2="206" stroke="url(#houseGrad)" stroke-width="2"/>
  <line x1="204" y1="188" x2="240" y2="188" stroke="url(#houseGrad)" stroke-width="2"/>
  <rect x="230" y="60" width="22" height="50" stroke="url(#houseGrad)" stroke-width="3" fill="none"/>
  <line x1="30" y1="300" x2="310" y2="300" stroke="url(#houseGrad)" stroke-width="3"/>
  <circle cx="290" cy="180" r="14" stroke="#60A5FA" stroke-width="2.5" stroke-opacity="0.7" fill="none"/>
  <line x1="304" y1="180" x2="320" y2="180" stroke="#60A5FA" stroke-width="2.5" stroke-opacity="0.7"/>
  <line x1="316" y1="180" x2="316" y2="186" stroke="#60A5FA" stroke-width="2.5" stroke-opacity="0.7"/>
</svg>
<div class="container">
  <div class="logo-row">
    <div class="logo">
      <div class="logo-mark">D</div>
      <div class="logo-text">Divito <em>Lending</em></div>
    </div>
    <div class="badge">Licensed Florida Mortgage Broker</div>
  </div>
  <div class="main">
    <div class="headline-col">
      <div class="tag">{content['tag']}</div>
      <h1>{headline}</h1>
      <div class="subtitle">{content['subtitle']}</div>
      <div class="stats">
        <div class="stat"><div class="num">50+</div><div class="lbl">Lender Network</div></div>
        <div class="stat"><div class="num">24<span style="font-size:22px;">hr</span></div><div class="lbl">Pre-Approval</div></div>
        <div class="stat"><div class="num">$0</div><div class="lbl">Application Fee</div></div>
        <div class="stat"><div class="num">7</div><div class="lbl">Days a Week</div></div>
      </div>
    </div>
  </div>
  <div class="footer-row">
    <div class="url"><span>divito-lending.com</span><span class="url-arrow">→</span></div>
    <div class="nmls">NMLS #1731159 · Equal Housing Lender</div>
  </div>
</div>
</body>
</html>
"""


def render(slug, content):
    """Generate HTML, render to PNG, convert to JPG."""
    html = build_html(content)
    html_path = SITE_DIR / f"og-{slug}.html"
    png_path = SITE_DIR / f"og-{slug}.png"
    jpg_path = SITE_DIR / f"og-{slug}.jpg"

    html_path.write_text(html)

    subprocess.run(
        [
            CHROME,
            "--headless",
            "--disable-gpu",
            "--hide-scrollbars",
            "--window-size=1200,630",
            f"--screenshot={png_path}",
            f"file://{html_path}",
        ],
        capture_output=True,
        cwd=str(SITE_DIR),
    )

    # Convert PNG → JPG with sips
    subprocess.run(
        [
            "sips",
            "-s", "format", "jpeg",
            "-s", "formatOptions", "85",
            str(png_path),
            "--out", str(jpg_path),
        ],
        capture_output=True,
    )

    png_size = png_path.stat().st_size if png_path.exists() else 0
    jpg_size = jpg_path.stat().st_size if jpg_path.exists() else 0
    print(f"  {slug:25s} PNG: {png_size:>7,} bytes  JPG: {jpg_size:>7,} bytes")


if __name__ == "__main__":
    print(f"Generating {len(PAGES)} OG images...")
    for slug, content in PAGES.items():
        render(slug, content)
    print("Done.")
