// Tokens + datos + helpers — Ultimo Verso · Àltima

const UV_FONTS = {
  // Display: Hanken Grotesk — grotesca geométrica de 'a' de doble piso (estética GRDNT)
  display: '"Hanken Grotesk", "Inter", system-ui, sans-serif',
  // Body: Inter para máxima legibilidad en formularios
  body: '"Inter", system-ui, -apple-system, sans-serif',
};

// Gris oscuro de marca para el logotipo (logo siempre liso, sin recuadro)
const EV_INK = "#1b1922";

// Gradiente granulado cálido-serio (arena → oro → terracota → petróleo apagado)
// Anclado en el petróleo y la arena de EternaVoz. Se usa en momentos hero.
const EV_MESH_BG =
  "radial-gradient(60% 58% at 26% 16%, #4fd1c5 0%, transparent 60%)," +
  "radial-gradient(56% 52% at 80% 20%, #1fa8c9 0%, transparent 60%)," +
  "radial-gradient(64% 60% at 74% 72%, #1f8fb8 0%, transparent 62%)," +
  "radial-gradient(70% 66% at 22% 86%, #56c7a0 0%, transparent 64%)," +
  "radial-gradient(38% 38% at 54% 60%, #e6fbf4 0%, transparent 56%)," +
  "linear-gradient(150deg, #7fe3d0 0%, #2bb0b8 52%, #1f7fa8 100%)";

// Paleta EternaVoz — petróleo #1d5b70 + crema cálida + oro/arena
const UV_THEMES = {
  // Tema claro institucional — el principal de EternaVoz
  altima: {
    bg: "#f4f1ea",          // near-white cálido (GRDNT)
    surface: "rgba(255,255,255,.55)",   // tarjeta de vidrio
    surface2: "rgba(255,255,255,.42)",  // banda secundaria translúcida
    ink: "#1b1922",          // casi negro (texto + logo + CTA)
    inkSoft: "rgba(27,25,34,.60)",
    inkFaint: "rgba(27,25,34,.14)",
    line: "rgba(27,25,34,.10)",
    accent: "#149aa8",       // TEAL AZUL-VERDOSO (interactivo)
    accentDeep: "#0f7d8a",
    accentSoft: "rgba(20,154,168,.12)",
    accentInk: "#ffffff",
    warm: "#149aa8",         // acento
    clay: "#2bb0b8",         // cian-teal (acento editorial del gradiente)
    mesh: EV_MESH_BG,        // gradiente granulado hero
  },
  // Tema oscuro — manteniendo la identidad para escenas íntimas (player, componiendo)
  altimaDark: {
    bg: "#10242c",
    surface: "#163039",
    surface2: "#1d3c47",
    ink: "#eef4f2",
    inkSoft: "rgba(238,244,242,.62)",
    inkFaint: "rgba(238,244,242,.16)",
    line: "rgba(238,244,242,.10)",
    accent: "#7bb3c6",       // petróleo aclarado para fondo oscuro
    accentDeep: "#355e70",
    accentSoft: "rgba(123,179,198,.14)",
    accentInk: "#10242c",
    warm: "#d3b186",
  },
};

const UV_STEPS = [
  { id: "quien",     label: "Su nombre",   eyebrow: "Para empezar" },
  { id: "relacion",  label: "Tu vínculo",  eyebrow: "Vuestro lazo" },
  { id: "caracter",  label: "Cómo era",    eyebrow: "Su carácter" },
  { id: "hobbies",   label: "Lo que amaba",eyebrow: "Sus pasiones" },
  { id: "recuerdos", label: "Un recuerdo", eyebrow: "Un momento" },
  { id: "frases",    label: "Sus palabras",eyebrow: "Su voz" },
  { id: "lugares",   label: "Lugares",     eyebrow: "Dónde se sentía" },
  { id: "gente",     label: "Personas",    eyebrow: "Los suyos" },
  { id: "musica",    label: "La música",   eyebrow: "Cómo sonará" },
  { id: "ocasion",   label: "La ocasión",  eyebrow: "Dónde se escuchará" },
  { id: "contacto",  label: "Tus datos",   eyebrow: "Para enviártela" },
];

const UV_EMPTY = {
  nombre: "", apodo: "", nacido: "", fallecido: "",
  relacion: "", significado: "",
  personalidad: [], hobbies: [],
  recuerdo: "",
  frases: ["", ""],
  lugares: [], personas: ["", "", ""],
  valores: [], profesion: "",
  genero: "", artista: "", idioma: "Español",
  tempo: "", instrumento: "", emocion: "",
  ocasion: "", duracion: "2:30",
  cliente: { nombre: "", email: "", telefono: "", lugar: "" },
};

const UV_SAMPLE = {
  nombre: "María Dolores Herrera",
  apodo: "Lola",
  nacido: "1947",
  fallecido: "2025",
  relacion: "Abuela",
  significado: "Era el centro de nuestra casa.",
  personalidad: ["cariñosa","paciente","de risa fácil","testaruda"],
  hobbies: ["el huerto","coser","parchís","pasodobles"],
  recuerdo: "Cada domingo juntaba a toda la familia a comer guiso, y siempre había sitio para uno más en la mesa.",
  frases: ["«Anda, mi niño»", "«Esto se arregla con un café»"],
  lugares: ["Cazorla","la cocina"],
  personas: ["Manolo, su marido", "sus 4 hijos", "7 nietos"],
  valores: ["la familia","la alegría diaria"],
  profesion: "Maestra",
  genero: "Copla",
  artista: "Rocío Jurado",
  idioma: "Español",
  tempo: "Lento",
  instrumento: "Guitarra española",
  emocion: "Melancólico con esperanza",
  ocasion: "Misa de despedida",
  duracion: "2:30",
  cliente: { nombre: "Carmen Herrera", email: "carmen@ejemplo.com", telefono: "600 123 456", lugar: "Cazorla, Jaén" },
};

// Letra BORRADOR para la previsualización / respaldo (si Claude no corre).
// NO es la letra final: es un esqueleto coherente que inserta las palabras
// del cliente en posiciones seguras (manteniendo rima asonante y sentido).
// La letra definitiva y única la escribe Claude al componer (api/_lib/claude.js).
function UV_generateLyrics(p, genero) {
  const cap = (s) => s ? s.charAt(0).toUpperCase() + s.slice(1) : s;
  const clean = (s) => (s || "").toString().trim();

  const nombre   = clean(p.apodo) || clean(p.nombre?.split(" ")[0]) || "mi amor";
  const lugar    = clean(p.lugares?.[0]);
  const hobby    = clean(p.hobbies?.[0]).toLowerCase().replace(/^(el|la|los|las) /, "");
  const frase    = clean(p.frases?.find?.(f => clean(f))).replace(/^[«"]|[»"]$/g, "");
  const relacion = clean(p.relacion).toLowerCase();

  const tones = {
    "Copla":     { titulo: "Donde siempre hay un sitio en la mesa" },
    "Bolero":    { titulo: "La luz que dejaste encendida" },
    "Balada":    { titulo: "Lo que guardamos de ti" },
    "Flamenco":  { titulo: "Por si vuelves a cantarme" },
    "Clásica":   { titulo: "Adagio para una casa que espera" },
    "Pop":       { titulo: "Sigues aquí" },
    "Rock suave":{ titulo: "Tu sitio en la mesa" },
  };
  const titulo = tones[genero]?.titulo || "Donde siempre hay un sitio en la mesa";

  // — Estrofa 1: el recuerdo cotidiano (inserta el lugar con naturalidad) —
  const e1 = [
    "Vuelve el domingo y te espero en la mesa,",
    lugar ? `aún suena tu paso en ${lugar}, como siempre,`
          : "aún suena tu paso en la casa, como siempre,",
    "se enciende la tarde, la misma promesa:",
    "que nadie se marcha del todo si quiere.",
  ];

  // — Estribillo: el corazón (nombre + relación + frase real, si la hay) —
  const estr = [
    relacion ? `${cap(relacion)} ${nombre}, te llevo conmigo,`
             : `${cap(nombre)}, mi ${nombre}, te llevo conmigo,`,
    "en cada mañana, en cada latido.",
    frase ? `Y si digo «${frase}», vuelves a mi lado,`
          : "Y aunque no te vea, te siento a mi lado,",
    "y el mundo me cabe en lo que me has dado.",
  ];

  // — Estrofa 2: sus cosas (inserta la afición sin forzarla) —
  const e2 = [
    hobby ? `Te asomas en ${hobby}, en la copla, en la radio,`
          : "Te asomas en todo, en la copla, en la radio,",
    "en la taza de siempre, en el sol de la siesta;",
    "me dejaste tu calma, tu modo despacio,",
    "y el gesto de hacer de la vida una fiesta.",
  ];

  // — Puente: el giro emocional —
  const puente = [
    "Y si un día la pena me puede,",
    "me asomo a tus cosas y vuelvo a tenerte.",
  ];

  // — Final: la imagen que queda —
  const fin = [
    "No te has ido del todo, te quedas en casa:",
    "en el café, en la puerta, en la mesa.",
    `mientras siga tu nombre, ${nombre}, encendido,`,
    "tu silla a la mesa jamás estará quieta.",
  ];

  return {
    titulo,
    estrofas: [
      { tipo: "Estrofa",    texto: e1 },
      { tipo: "Estribillo", texto: estr },
      { tipo: "Estrofa",    texto: e2 },
      { tipo: "Estribillo", texto: estr },
      { tipo: "Puente",     texto: puente },
      { tipo: "Final",      texto: fin },
    ],
  };
}

// QR determinista
function UvQR({ size = 140, fg = "#355e70", bg = "#fff", seed = 7 }) {
  const cells = 25, s = size / cells;
  const mod = (x, y) => {
    const n = (x * 73856093) ^ (y * 19349663) ^ (seed * 83492791);
    return (n >>> 0) % 7;
  };
  const rects = [];
  for (let y = 0; y < cells; y++) for (let x = 0; x < cells; x++) {
    const corner = (x < 7 && y < 7) || (x >= cells - 7 && y < 7) || (x < 7 && y >= cells - 7);
    if (corner) continue;
    if (mod(x, y) < 3)
      rects.push(<rect key={x+"-"+y} x={x*s} y={y*s} width={s} height={s} fill={fg} />);
  }
  const corner = (cx, cy) => (
    <g key={`c-${cx}-${cy}`}>
      <rect x={cx*s} y={cy*s} width={7*s} height={7*s} fill={fg} />
      <rect x={(cx+1)*s} y={(cy+1)*s} width={5*s} height={5*s} fill={bg} />
      <rect x={(cx+2)*s} y={(cy+2)*s} width={3*s} height={3*s} fill={fg} />
    </g>
  );
  return (
    <svg width={size} height={size} viewBox={`0 0 ${size} ${size}`} style={{ display: "block" }}>
      <rect width={size} height={size} fill={bg} />
      {rects}{corner(0,0)}{corner(cells-7,0)}{corner(0,cells-7)}
    </svg>
  );
}

// Isotipo oficial EternaVoz — arte vectorizado de marca (onda de voz → cinta en bucle)
// Se renderiza desde el PNG de marca recoloreado; el contexto elige la variante.
const EV_MARK_RATIO = 521 / 401; // dimensiones reales del arte extraído
const EV_MARK_SRC = {
  teal:  "brand/ev-mark-teal.png",
  tan:   "brand/ev-mark-tan.png",
  white: "brand/ev-mark-white.png",
  ink:   "brand/ev-mark-ink.png",
  bluegreen: "brand/ev-mark-bluegreen.png",
};
function evMarkVariant(color = "", variant) {
  if (variant) return variant;
  const c = String(color).toLowerCase().replace(/\s/g, "");
  if (c.includes("fff") || c === "white" || c.includes("255,255,255")) return "white";
  if (c.includes("d3b186") || c.includes("c4a368") || c.includes("cfae73")) return "tan";
  // Gris oscuro / tinta → isotipo en tinta (logo liso, sin recuadro)
  if (c.includes("1c2f36") || c.includes("16313c") || c.includes("1b1922") || c.includes("28,47,54") || c.includes("27,25,34") || c.includes("22,49,60")) return "ink";
  return "teal";
}
function EternaVozMark({ color = "#355e70", size = 26, style, variant }) {
  const v = evMarkVariant(color, variant);
  return (
    <img src={EV_MARK_SRC[v]} alt="" aria-hidden="true"
         width={size * EV_MARK_RATIO} height={size}
         style={{ display: "block", flex: "none", width: size * EV_MARK_RATIO, height: size, ...style }} />
  );
}

// Logotipo EternaVoz (isotipo + wordmark). Mantiene el nombre AltimaLogo como
// alias para no romper las llamadas existentes en la app.
function EternaVozLogo({ color = "#355e70", size = 22, withTagline = false, tagColor, markOnly = false }) {
  return (
    <div style={{ display: "inline-flex", flexDirection: "column", alignItems: "flex-start", lineHeight: 1 }}>
      <div style={{ display: "inline-flex", alignItems: "center", gap: size * 0.36 }}>
        <EternaVozMark variant="bluegreen" size={size * 1.12} />
        {!markOnly && (
          <span style={{
            fontFamily: UV_FONTS.display, fontWeight: 600,
            fontSize: size, color, letterSpacing: ".005em",
            lineHeight: 1, whiteSpace: "nowrap",
          }}>Eterna<span style={{ color: "#149aa8" }}>Voz</span></span>
        )}
      </div>
      {withTagline && (
        <div style={{
          fontFamily: UV_FONTS.body, fontSize: Math.max(8, size * 0.32),
          color: tagColor || "#d3b186", fontWeight: 600,
          marginTop: size * 0.34, letterSpacing: ".2em", textTransform: "uppercase",
        }}>Su memoria, ahora eterna.</div>
      )}
    </div>
  );
}
const AltimaLogo = EternaVozLogo;

// Precio del producto (configurable). El backend usa STRIPE_PRICE_ID o este importe.
const UV_PRICE = { amount: 2900, currency: "eur", display: "29 €", displayFull: "29,00 €" };

Object.assign(window, { UV_FONTS, EV_INK, EV_MESH_BG, UV_THEMES, UV_STEPS, UV_PRICE, UV_EMPTY, UV_SAMPLE, UV_generateLyrics, UvQR, AltimaLogo, EternaVozLogo, EternaVozMark });