/* ============================================================
   Robotia Cotizador · PDF CONJUNTO (cliente y costos)
   ============================================================ */
function PrintDocConjunto({ joint, mode }) {
  const Eg = window.RBEngine;
  const Jx = window.RBJoint;
  const cc = Jx.combinarCostos(joint);
  const cv = Jx.combinarVenta(joint);
  const C = cc.combinado;
  const esCliente = mode === "venta";

  const row = (label, val, opt) => (
    <tr style={opt && opt.bold ? { fontWeight: 600 } : null}>
      <td style={{ padding: "9px 0", borderTop: "1px solid #e3e3e3", color: opt && opt.bold ? "#111" : "#444" }}>{label}</td>
      <td style={{ padding: "9px 0", borderTop: "1px solid #e3e3e3", textAlign: "right", fontVariantNumeric: "tabular-nums", color: "#111" }}>{val}</td>
    </tr>
  );

  const total = esCliente ? cv.pvTotal : C.totalFinal;

  return (
    <div id="print-doc" style={{ display: "none", fontFamily: "var(--font-display)", color: "#111", background: "#fff" }}>
      <section style={{ padding: "4mm 2mm" }}>
        <div style={{ display: "flex", justifyContent: "space-between", alignItems: "flex-start", borderBottom: "2px solid #A100FF", paddingBottom: 16 }}>
          <img src="assets/logo-robotia-black.png" alt="Robotia" style={{ height: 22 }} />
          <div style={{ textAlign: "right", fontSize: 11, color: "#666" }}>
            <div style={{ textTransform: "uppercase", letterSpacing: "0.16em", fontSize: 10, color: "#A100FF", fontWeight: 600 }}>{esCliente ? "Propuesta conjunta" : "Cotización conjunta · interna"}</div>
            <div style={{ marginTop: 4 }}>{new Date(joint.fecha).toLocaleDateString("es-CL")}</div>
          </div>
        </div>

        <div style={{ marginTop: 26 }}>
          <div style={{ fontSize: 11, textTransform: "uppercase", letterSpacing: "0.16em", color: "#888" }}>{esCliente ? "Preparada para" : "Cliente"}</div>
          <div style={{ fontSize: 28, fontWeight: 300, letterSpacing: "-0.02em", marginTop: 4 }}>{joint.cliente.nombre || "Cliente"}</div>
          <div style={{ fontSize: 13, color: "#555", marginTop: 4 }}>{[joint.cliente.contacto, joint.cliente.sector].filter(Boolean).join(" · ")}</div>
        </div>

        <div style={{ marginTop: 26, border: "1px solid #ddd", borderTop: "3px solid #A100FF", padding: "22px 24px", background: "#faf7ff" }}>
          <div style={{ fontSize: 11, textTransform: "uppercase", letterSpacing: "0.16em", color: "#888" }}>Servicio conjunto — Streaming + Imagen</div>
          <div style={{ fontSize: 52, fontWeight: 300, letterSpacing: "-0.03em", fontVariantNumeric: "tabular-nums", marginTop: 6 }}>
            {Eg.fmtMiles(total)} <span style={{ fontSize: 18, color: "#888" }}>M$ / año</span>
          </div>
          <div style={{ fontSize: 13, color: "#555", marginTop: 6 }}>{cc.nPuntosTotal} puntos de monitoreo · año {joint.anioCotizacion}</div>
        </div>

        <table style={{ width: "100%", borderCollapse: "collapse", marginTop: 26, fontSize: 14 }}>
          <tbody>
            {esCliente ? (
              <React.Fragment>
                {row("Servicio Streaming · " + joint.sub.streaming.inputs.nPuntos + " puntos", Eg.fmtMS(cv.ventaS.pvTotal))}
                {row("Servicio Imagen · " + joint.sub.imagen.inputs.nPuntos + " puntos", Eg.fmtMS(cv.ventaI.pvTotal))}
              </React.Fragment>
            ) : (
              <React.Fragment>
                {row("(1) Recurrente puro", Eg.fmtMS(C.recurrente * cc.factor))}
                {row("(2) Calibraciones", Eg.fmtMS(C.calibraciones * cc.factor))}
                {row("(3) Proyectos puntuales", Eg.fmtMS(C.proyectos * cc.factor))}
                {C.ahorroSinergiaFinal > 0 ? row("(–) Sinergia plataforma compartida (nivel " + cc.nivel + ")", "−" + Eg.fmtMS(C.ahorroSinergiaFinal)) : null}
              </React.Fragment>
            )}
          </tbody>
          <tfoot>
            <tr>
              <td style={{ padding: "14px 0", borderTop: "2px solid #A100FF", fontWeight: 600, fontSize: 16 }}>Total anual</td>
              <td style={{ padding: "14px 0", borderTop: "2px solid #A100FF", textAlign: "right", fontWeight: 600, fontSize: 16, fontVariantNumeric: "tabular-nums" }}>{Eg.fmtMS(total)}</td>
            </tr>
          </tfoot>
        </table>

        <div style={{ marginTop: 26, fontSize: 13, color: "#555", lineHeight: 1.6 }}>
          <b style={{ color: "#111" }}>Propuesta conjunta.</b> Combina monitoreo Streaming (activos críticos en tiempo real) e Imagen (monitoreo por lotes), bajo una sola plataforma Sentinel y un solo equipo.
        </div>

        <div style={{ marginTop: 28, display: "flex", justifyContent: "space-between", alignItems: "center", borderTop: "1px solid #ddd", paddingTop: 12, fontSize: 11, color: "#999" }}>
          <span>Robotia · El mundo de la minería potenciado por la visión artificial_</span>
          <img src="assets/logo-robotia-black.png" alt="Robotia" style={{ height: 14, opacity: 0.7 }} />
        </div>
      </section>
    </div>
  );
}
window.PrintDocConjunto = PrintDocConjunto;