import { env } from "@/lib/env";

const BRAND_COLOR = "#7B7168";
const MUTED_COLOR = "#6e4f4f";
const BORDER_COLOR = "#e8dcc7";

export function escapeHtml(value: string) {
  return value
    .replace(/&/g, "&amp;")
    .replace(/</g, "&lt;")
    .replace(/>/g, "&gt;")
    .replace(/"/g, "&quot;")
    .replace(/'/g, "&#039;");
}

export function renderEmailLayout(options: { title: string; preheader?: string; bodyHtml: string }) {
  const siteUrl = env.siteUrl;

  return `<!DOCTYPE html>
<html lang="fr">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>${escapeHtml(options.title)}</title>
  </head>
  <body style="margin:0;padding:0;background:#fff8f5;font-family:Helvetica,Arial,sans-serif;color:#271919;">
    ${options.preheader ? `<div style="display:none;max-height:0;overflow:hidden;">${escapeHtml(options.preheader)}</div>` : ""}
    <table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="background:#fff8f5;padding:32px 16px;">
      <tr>
        <td align="center">
          <table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="max-width:560px;background:#ffffff;border-radius:20px;border:1px solid ${BORDER_COLOR};overflow:hidden;">
            <tr>
              <td style="background:${BRAND_COLOR};padding:20px 24px;">
                <a href="${siteUrl}" style="color:#ffffff;font-size:20px;font-weight:600;text-decoration:none;">Styl'Unique</a>
              </td>
            </tr>
            <tr>
              <td style="padding:28px 24px;">
                ${options.bodyHtml}
              </td>
            </tr>
            <tr>
              <td style="padding:18px 24px;border-top:1px solid ${BORDER_COLOR};color:${MUTED_COLOR};font-size:12px;">
                Styl'Unique &mdash; <a href="${siteUrl}" style="color:${MUTED_COLOR};">${siteUrl.replace(/^https?:\/\//, "")}</a>
              </td>
            </tr>
          </table>
        </td>
      </tr>
    </table>
  </body>
</html>`;
}
