#!/usr/bin/env python3
"""
Thumb YouTube v3_A — Borrello vídeo "Câncer, depressão e divórcio na mesma casa"
Diferença do v2_A: adiciona uma BOLA DE ENERGIA DOURADA flutuando sobre a
palma da mão esquerda dele (canto inferior-direito da thumb), como se ele
estivesse sustentando com telecinesia.

Tudo o mais preservado: foto, textos, selo, fundo.
"""
import base64, os, pathlib, io
from PIL import Image, ImageDraw, ImageFilter
from playwright.sync_api import sync_playwright

BASE = pathlib.Path("/opt/mia/workspace/clientes/francisco_borrello/youtube_video3")
FOTOS = pathlib.Path("/tmp/borrello_optimized")

def img_to_b64(path):
    with open(path, "rb") as f:
        return "data:image/png;base64," + base64.b64encode(f.read()).decode()

def pil_to_b64(im: Image.Image) -> str:
    buf = io.BytesIO()
    im.save(buf, format="PNG")
    return "data:image/png;base64," + base64.b64encode(buf.getvalue()).decode()

def html_para_png(html, destino, largura=1280, altura=720):
    with sync_playwright() as p:
        browser = p.chromium.launch()
        page = browser.new_page(viewport={"width": largura, "height": altura})
        page.set_content(html, wait_until="networkidle")
        page.screenshot(path=str(destino), clip={"x": 0, "y": 0, "width": largura, "height": altura})
        browser.close()
    return destino

# ---------------------------------------------------------------------------
# ESFERA DE ENERGIA
# ---------------------------------------------------------------------------
def gerar_esfera_energia(
    diametro_core: int = 120,
    halo_extra: int = 60,
) -> Image.Image:
    """
    Retorna PNG RGBA com esfera dourada + glow.
    - core: branco quente ao centro, gradient p/ amarelo ouro -> laranja queimado
    - halo: blur gaussiano amarelo-âmbar semi-transparente estendendo além
    """
    lado = diametro_core + halo_extra * 2
    cx = cy = lado // 2

    # 1) camada do HALO (glow externo grande, depois blur)
    halo_layer = Image.new("RGBA", (lado, lado), (0, 0, 0, 0))
    hd = ImageDraw.Draw(halo_layer)
    # anéis de opacidade crescente indo pro centro
    passos = 40
    raio_halo = diametro_core // 2 + halo_extra
    for i in range(passos, 0, -1):
        r = int(raio_halo * (i / passos))
        # alpha aumenta indo pro centro do halo
        a = int(140 * (1 - i / passos) ** 2)
        hd.ellipse(
            [cx - r, cy - r, cx + r, cy + r],
            fill=(255, 190, 60, a),
        )
    halo_layer = halo_layer.filter(ImageFilter.GaussianBlur(radius=22))

    # 2) camada CORE (esfera sólida com gradient radial)
    core_layer = Image.new("RGBA", (lado, lado), (0, 0, 0, 0))
    cd = ImageDraw.Draw(core_layer)
    raio_core = diametro_core // 2
    passos_core = 90
    for i in range(passos_core, 0, -1):
        t = i / passos_core           # 1.0 borda, 0.0 centro
        r = int(raio_core * t)
        # curva de cor: centro branco -> amarelo -> laranja queimado -> transparente na borda
        if t > 0.85:
            # borda externa: laranja queimado sumindo
            k = (t - 0.85) / 0.15
            R = int(255 * (1 - k) + 180 * k)
            G = int(120 * (1 - k) + 60 * k)
            B = int(20  * (1 - k) + 10 * k)
            A = int(220 * (1 - k))
        elif t > 0.55:
            # miolo: amarelo ouro -> laranja
            k = (t - 0.55) / 0.30
            R = 255
            G = int(210 * (1 - k) + 120 * k)
            B = int(90  * (1 - k) + 20 * k)
            A = 245
        elif t > 0.20:
            # centro-quente: branco -> amarelo
            k = (t - 0.20) / 0.35
            R = 255
            G = int(255 * (1 - k) + 210 * k)
            B = int(240 * (1 - k) + 90 * k)
            A = 250
        else:
            # ponto mais brilhante: branco puro
            R, G, B, A = 255, 255, 245, 255
        cd.ellipse(
            [cx - r, cy - r, cx + r, cy + r],
            fill=(R, G, B, A),
        )
    # leve blur pra suavizar step do gradient
    core_layer = core_layer.filter(ImageFilter.GaussianBlur(radius=1.5))

    # 3) highlight especular (pequena mancha branca no topo-esquerdo do core)
    spec_layer = Image.new("RGBA", (lado, lado), (0, 0, 0, 0))
    sd = ImageDraw.Draw(spec_layer)
    sr = raio_core // 4
    scx = cx - raio_core // 3
    scy = cy - raio_core // 3
    for i in range(15, 0, -1):
        t = i / 15
        r = int(sr * t)
        a = int(200 * (1 - t))
        sd.ellipse([scx - r, scy - r, scx + r, scy + r], fill=(255, 255, 255, a))
    spec_layer = spec_layer.filter(ImageFilter.GaussianBlur(radius=3))

    # compose halo + core + specular
    out = Image.new("RGBA", (lado, lado), (0, 0, 0, 0))
    out = Image.alpha_composite(out, halo_layer)
    out = Image.alpha_composite(out, core_layer)
    out = Image.alpha_composite(out, spec_layer)
    return out


# ---------------------------------------------------------------------------
# CSS BASE — copiado do v2, sem mudanças
# ---------------------------------------------------------------------------
BASE_CSS = """
@import url('https://fonts.googleapis.com/css2?family=Anton&family=Bebas+Neue&family=Montserrat:wght@800;900&display=swap');
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { width: 1280px; height: 720px; overflow: hidden; }
body {
  font-family: 'Anton', 'Bebas Neue', sans-serif;
  color: #fff;
  position: relative;
  background: #0a0a0a;
}
.wrap {
  position: relative;
  width: 1280px;
  height: 720px;
  overflow: hidden;
}
.bg {
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse at 20% 40%, rgba(180,20,20,0.55) 0%, transparent 55%),
    radial-gradient(ellipse at 90% 90%, rgba(90,10,10,0.75) 0%, transparent 60%),
    linear-gradient(135deg, #1a0505 0%, #050505 55%, #1a0505 100%);
}
.bg::after {
  content:'';
  position: absolute; inset: 0;
  background-image:
    repeating-linear-gradient(45deg, rgba(255,255,255,0.015) 0 2px, transparent 2px 6px);
  mix-blend-mode: overlay;
}
.vignette {
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at center, transparent 45%, rgba(0,0,0,0.75) 100%);
  pointer-events: none;
}
.foto {
  position: absolute;
  filter: drop-shadow(0 0 40px rgba(0,0,0,0.85)) contrast(1.08) saturate(0.9);
  z-index: 3;
}
.txt {
  position: absolute;
  z-index: 4;
  font-family: 'Anton', sans-serif;
  line-height: 0.92;
  text-transform: uppercase;
  letter-spacing: -1px;
  text-shadow:
    0 4px 0 #000,
    0 6px 20px rgba(0,0,0,0.9),
    0 0 40px rgba(0,0,0,0.9);
}
.selo {
  position: absolute;
  top: 32px;
  right: 32px;
  z-index: 5;
  background: #ffcc00;
  color: #111;
  font-family: 'Montserrat', sans-serif;
  font-weight: 900;
  font-size: 22px;
  letter-spacing: 4px;
  padding: 10px 18px;
  border-radius: 4px;
  box-shadow: 0 6px 0 rgba(0,0,0,0.5);
  transform: rotate(-3deg);
}
"""

# ---------------------------------------------------------------------------
# Posicionamento da esfera (calibrado pela análise do thumb_v2_A)
# Palma da mão esquerda dele ~ centro (1120, 530) no canvas 1280x720.
# A esfera fica ~15px acima da palma.
# ---------------------------------------------------------------------------
ESFERA_CORE_D  = 120           # diâmetro do núcleo brilhante
ESFERA_HALO    = 65            # extensão do halo em cada direção
ESFERA_LADO    = ESFERA_CORE_D + ESFERA_HALO * 2   # 250
# Centro da esfera desejado no canvas 1280x720:
ESFERA_CX      = 1112
ESFERA_CY      = 500           # ~15px acima da palma (que fica ~530)
# Canto sup-esq do PNG (por causa do halo, PNG é maior que a esfera visível):
ESFERA_LEFT    = ESFERA_CX - ESFERA_LADO // 2
ESFERA_TOP     = ESFERA_CY - ESFERA_LADO // 2

# Iluminação suave dos dedos por baixo da esfera (bloom amarelo por trás)
# — só um glow adicional atrás dos dedos, mesmo centro, mais opaco e maior.
FINGER_GLOW_LADO = 320
FINGER_GLOW_LEFT = ESFERA_CX - FINGER_GLOW_LADO // 2
FINGER_GLOW_TOP  = ESFERA_CY - FINGER_GLOW_LADO // 2 + 30   # levemente pra baixo, pra iluminar dedos


def render_A_v3():
    foto = img_to_b64(FOTOS / "_MG_9299.png")
    esfera = gerar_esfera_energia(ESFERA_CORE_D, ESFERA_HALO)
    esfera_b64 = pil_to_b64(esfera)

    # Glow adicional atrás dos dedos (bloom amarelo mais espalhado)
    finger_glow = Image.new("RGBA", (FINGER_GLOW_LADO, FINGER_GLOW_LADO), (0, 0, 0, 0))
    fg_draw = ImageDraw.Draw(finger_glow)
    fg_cx = FINGER_GLOW_LADO // 2
    for i in range(50, 0, -1):
        t = i / 50
        r = int((FINGER_GLOW_LADO // 2) * t)
        a = int(90 * (1 - t) ** 2)
        fg_draw.ellipse([fg_cx - r, fg_cx - r, fg_cx + r, fg_cx + r],
                        fill=(255, 180, 50, a))
    finger_glow = finger_glow.filter(ImageFilter.GaussianBlur(radius=40))
    finger_glow_b64 = pil_to_b64(finger_glow)

    html = f"""<!doctype html><html><head><meta charset='utf-8'>
    <style>{BASE_CSS}
    .foto-A {{
      right: -40px;
      bottom: 20px;
      height: 650px;
      width: auto;
    }}
    .overlay-dark-A {{
      position: absolute; inset: 0;
      background: linear-gradient(90deg, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0.3) 45%, transparent 65%);
      z-index: 2;
    }}
    .txt-A {{
      left: 44px; top: 60px;
      max-width: 720px;
      font-size: 108px;
      color: #fff;
    }}
    .word1-A {{ color: #ff2a2a; display:block; }}
    .word2-A {{ color: #ffcc00; display:block; }}
    .word3-A {{ color: #ff2a2a; display:block; }}
    .sub-A {{
      position: absolute; left: 44px; top: 480px;
      font-family: 'Montserrat', sans-serif;
      font-weight: 900;
      font-size: 38px;
      color: #fff;
      background: #d40000;
      padding: 12px 26px;
      letter-spacing: 3px;
      z-index: 4;
      box-shadow: 0 8px 0 rgba(0,0,0,0.7);
      transform: rotate(-1.5deg);
    }}
    .sub2-A {{
      position: absolute; left: 46px; top: 590px;
      font-family: 'Montserrat', sans-serif;
      font-weight: 900;
      font-size: 30px;
      color: #ffcc00;
      letter-spacing: 4px;
      z-index: 4;
      text-shadow: 0 3px 0 #000, 0 0 20px rgba(0,0,0,0.9);
      max-width: 640px;
    }}
    .sub2-A .alert {{
      display: inline-block;
      margin-right: 8px;
      color: #ffcc00;
    }}
    /* Glow amarelo por baixo da esfera pra iluminar os dedos.
       z-index 3.5 = acima da foto (3), atrás da esfera (4). */
    .finger-glow {{
      position: absolute;
      left: {FINGER_GLOW_LEFT}px;
      top:  {FINGER_GLOW_TOP}px;
      width: {FINGER_GLOW_LADO}px;
      height:{FINGER_GLOW_LADO}px;
      z-index: 3;
      mix-blend-mode: screen;
      pointer-events: none;
    }}
    /* Esfera principal. z-index 4 = na frente da foto e do glow. */
    .esfera {{
      position: absolute;
      left: {ESFERA_LEFT}px;
      top:  {ESFERA_TOP}px;
      width: {ESFERA_LADO}px;
      height:{ESFERA_LADO}px;
      z-index: 4;
      pointer-events: none;
    }}
    </style></head><body>
    <div class='wrap'>
      <div class='bg'></div>
      <img class='foto foto-A' src='{foto}'/>
      <img class='finger-glow' src='{finger_glow_b64}'/>
      <img class='esfera' src='{esfera_b64}'/>
      <div class='overlay-dark-A'></div>
      <div class='vignette'></div>
      <div class='txt txt-A'>
        <span class='word1-A'>CÂNCER,</span>
        <span class='word2-A'>DEPRESSÃO,</span>
        <span class='word3-A'>DIVÓRCIO</span>
      </div>
      <div class='sub-A'>NA MESMA CASA</div>
      <div class='sub2-A'><span class='alert'>&#9888;</span>NÃO É COINCIDÊNCIA</div>
      <div class='selo'>ALERTA</div>
    </div>
    </body></html>"""
    return html_para_png(html, BASE / "thumb_v3_A.png")


if __name__ == "__main__":
    os.makedirs(BASE, exist_ok=True)
    a = render_A_v3(); print("v3_A ok:", a)
