const escapeHtml = (value) => String(value ?? "")
    .replace(/&/g, "&amp;")
    .replace(/</g, "&lt;")
    .replace(/>/g, "&gt;")
    .replace(/"/g, "&quot;")
    .replace(/'/g, "&#39;");

const getDaysLeft = (renewalDate) => {
    const today = new Date();
    today.setHours(0, 0, 0, 0);
    const renewal = new Date(renewalDate);
    const diff = renewal - today;
    return Math.ceil(diff / (1000 * 60 * 60 * 24));
};

const getComputedStatus = (hosting) => {
    if (hosting.status === "suspended") return "suspended";
    if (hosting.status === "pending") return "pending";

    const daysLeft = getDaysLeft(hosting.renewal_date);
    if (daysLeft < 0) return "expired";
    if (daysLeft <= 30) return "expiring";
    return "active";
};

export const buildHostingRenewalMailHtml = (hosting, customMessageHtml = null) => {

    // agar CKEditor se full HTML aaya hai, wahi final email banegi
    if (customMessageHtml) {
        return customMessageHtml;
    }

    const daysLeft = getDaysLeft(hosting.renewal_date);
    const renewalText = daysLeft < 0
        ? "has expired"
        : `will renew in <strong style="color:#4f46e5;">${daysLeft} day${daysLeft === 1 ? "" : "s"}</strong>`;

    return `
        <div style="background:#f8fafc;padding:28px 14px;font-family:Segoe UI,Arial,sans-serif;color:#0f172a;">
            <div style="max-width:620px;margin:0 auto;background:#ffffff;border:1px solid #e2e8f0;border-radius:16px;overflow:hidden;">
                <div style="background:linear-gradient(135deg,#0d2540 0%,#150057 38%,#1a075b 72%,#8b3f49 100%);color:#ffffff;padding:30px;text-align:center;">
                    <table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="border-collapse:collapse;">
                        <tr>
                            <td align="center" style="padding:16px 0;">
                                <img src="cid:deytal-logo" alt="Deytal Technologies Pvt Ltd" width="330" style="display:block;width:330px;max-width:100%;height:auto;border:0;">
                            </td>
                        </tr>
                    </table>
                </div>
                <div style="padding:30px;">
                    <p style="font-size:15px;line-height:1.7;color:#475569;margin:0 0 22px;">
                        Hi ${escapeHtml(hosting.client_name)}, your hosting for
                        <strong style="color:#4f46e5;">${escapeHtml(hosting.domain_name)}</strong>
                        ${renewalText}. Please renew it before the renewal date to avoid service interruption.
                    </p>
                    <table style="width:100%;border-collapse:collapse;border:1px solid #e2e8f0;border-radius:10px;overflow:hidden;">
                        <tbody>
                            <tr>
                                <td style="padding:14px;border-bottom:1px solid #e2e8f0;font-weight:700;color:#334155;">Domain</td>
                                <td style="padding:14px;border-bottom:1px solid #e2e8f0;color:#4f46e5;font-weight:700;">${escapeHtml(hosting.domain_name)}</td>
                            </tr>
                            <tr>
                                <td style="padding:14px;border-bottom:1px solid #e2e8f0;font-weight:700;color:#334155;">Renewal Date</td>
                                <td style="padding:14px;border-bottom:1px solid #e2e8f0;color:#475569;">${escapeHtml(hosting.renewal_date)}</td>
                            </tr>
                            <tr>
                                <td style="padding:14px;border-bottom:1px solid #e2e8f0;font-weight:700;color:#334155;">Cost</td>
                                <td style="padding:14px;border-bottom:1px solid #e2e8f0;color:#475569;">INR ${Number(hosting.cost || 0).toFixed(2)}</td>
                            </tr>
                            <tr>
                                <td style="padding:14px;font-weight:700;color:#334155;">Status</td>
                                <td style="padding:14px;color:#475569;text-transform:capitalize;">${escapeHtml(getComputedStatus(hosting))}</td>
                            </tr>
                        </tbody>
                    </table>
                    <p style="font-size:13px;color:#64748b;margin:24px 0 0;">Need help? Contact support@deytal.io.</p>
                </div>
            </div>
        </div>
    `;
};
