@narrow-os/document-templates 1.0.0

package/dist/index.js

@@ -0,0 +1,2482 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  A4_TEMPLATES: () => A4_TEMPLATES,
+  A4_TEMPLATE_IDS: () => A4_TEMPLATE_IDS,
+  DEFAULT_A4_ID: () => DEFAULT_A4_ID,
+  DEFAULT_COMPANY_INFO: () => DEFAULT_COMPANY_INFO,
+  DEFAULT_DOCUMENT_TYPE_SETTINGS: () => DEFAULT_DOCUMENT_TYPE_SETTINGS,
+  DEFAULT_RECEIPT_COMPANY_INFO: () => DEFAULT_RECEIPT_COMPANY_INFO,
+  DEFAULT_TAX_RATE: () => DEFAULT_TAX_RATE,
+  DEFAULT_THERMAL_ID: () => DEFAULT_THERMAL_ID,
+  DeliveryNoteGenerator: () => DeliveryNoteGenerator,
+  InvoiceReportGenerator: () => InvoiceReportGenerator,
+  QuotationReportGenerator: () => QuotationReportGenerator,
+  ReceiptGenerator: () => ReceiptGenerator,
+  THERMAL_TEMPLATES: () => THERMAL_TEMPLATES,
+  THERMAL_TEMPLATE_IDS: () => THERMAL_TEMPLATE_IDS,
+  escapeHtml: () => escapeHtml,
+  formatCompanyAddress: () => formatCompanyAddress,
+  formatCurrency: () => formatCurrency,
+  formatDate: () => formatDate,
+  generateBarcode: () => generateBarcode,
+  generateCode128Svg: () => generateCode128Svg,
+  generateDeliveryNoteHTML: () => generateDeliveryNoteHTML,
+  generateInvoiceHTML: () => generateInvoiceHTML,
+  generateQRCode: () => generateQRCode,
+  generateQuotationHTML: () => generateQuotationHTML,
+  getA4Template: () => getA4Template,
+  getClientDisplayName: () => getClientDisplayName,
+  getDocumentTypeSettings: () => getDocumentTypeSettings,
+  getThermalTemplate: () => getThermalTemplate,
+  hasVisibleText: () => hasVisibleText,
+  isA4TemplateId: () => isA4TemplateId,
+  isClassicTemplate: () => isClassicTemplate,
+  isThermalTemplateId: () => isThermalTemplateId,
+  receiptGenerator: () => receiptGenerator,
+  renderClassicHeader: () => renderClassicHeader,
+  renderContactBox: () => renderContactBox,
+  renderHeaderSection: () => renderHeaderSection
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/templates/a4.ts
+var A4_TEMPLATES = [
+  {
+    id: "classic",
+    name: "Classic",
+    description: "Original Bizflow layout \u2014 green header, gold accent, Arial.",
+    primary: "#065F46",
+    accent: "#C5A005",
+    brand: "#990000",
+    headerBg: "#D1FAE5",
+    headerText: "#065F46",
+    totalsBg: "#ffffff",
+    totalsBorder: "#065F46",
+    rowAltBg: "#f9fafb",
+    border: "#e0e0e0",
+    borderFaint: "#f0f0f0",
+    surface: "#fdfdfd",
+    text: "#000000",
+    textMuted: "#555555",
+    fontFamily: "Arial, sans-serif",
+    fontFamilyHeading: "Arial, sans-serif",
+    fontSize: "12px",
+    borderRadius: "4px",
+    dividerStyle: "solid",
+    headerLayout: "split",
+    titleAlign: "right"
+  },
+  {
+    id: "modern",
+    name: "Modern",
+    description: "Sidebar header layout, sans-serif, large logo left.",
+    primary: "#0F172A",
+    accent: "#6366F1",
+    brand: "#4F46E5",
+    headerBg: "#F8FAFC",
+    headerText: "#0F172A",
+    totalsBg: "#F1F5F9",
+    totalsBorder: "#6366F1",
+    rowAltBg: "#F8FAFC",
+    border: "#E2E8F0",
+    borderFaint: "#F1F5F9",
+    surface: "#FFFFFF",
+    text: "#0F172A",
+    textMuted: "#475569",
+    fontFamily: "'Inter', 'Segoe UI', sans-serif",
+    fontFamilyHeading: "'Inter', 'Segoe UI', sans-serif",
+    fontSize: "12px",
+    borderRadius: "10px",
+    dividerStyle: "solid",
+    headerLayout: "sidebar",
+    titleAlign: "left"
+  },
+  {
+    id: "minimal",
+    name: "Minimal",
+    description: "Lots of whitespace, thin underlines only, monochrome.",
+    primary: "#111111",
+    accent: "#666666",
+    brand: "#111111",
+    headerBg: "#ffffff",
+    headerText: "#111111",
+    totalsBg: "#ffffff",
+    totalsBorder: "#111111",
+    rowAltBg: "#ffffff",
+    border: "#ffffff",
+    borderFaint: "#e5e5e5",
+    surface: "#ffffff",
+    text: "#111111",
+    textMuted: "#666666",
+    fontFamily: "'Helvetica Neue', Helvetica, Arial, sans-serif",
+    fontFamilyHeading: "'Helvetica Neue', Helvetica, Arial, sans-serif",
+    fontSize: "12px",
+    borderRadius: "0px",
+    dividerStyle: "solid",
+    headerLayout: "split",
+    titleAlign: "right"
+  },
+  {
+    id: "corporate",
+    name: "Corporate",
+    description: "Two-column symmetrical, navy tabular data, formal.",
+    primary: "#1E3A8A",
+    accent: "#1E40AF",
+    brand: "#0F172A",
+    headerBg: "#DBEAFE",
+    headerText: "#1E3A8A",
+    totalsBg: "#EFF6FF",
+    totalsBorder: "#1E3A8A",
+    rowAltBg: "#F8FAFC",
+    border: "#CBD5E1",
+    borderFaint: "#E2E8F0",
+    surface: "#FFFFFF",
+    text: "#0F172A",
+    textMuted: "#334155",
+    fontFamily: "'Segoe UI', Tahoma, Geneva, sans-serif",
+    fontFamilyHeading: "'Segoe UI', Tahoma, Geneva, sans-serif",
+    fontSize: "12px",
+    borderRadius: "4px",
+    dividerStyle: "solid",
+    headerLayout: "split",
+    titleAlign: "right"
+  },
+  {
+    id: "bold",
+    name: "Bold",
+    description: "Full-width header band, uppercase, strong colors.",
+    primary: "#0F172A",
+    accent: "#F59E0B",
+    brand: "#0F172A",
+    headerBg: "#0F172A",
+    headerText: "#FFFFFF",
+    totalsBg: "#FEF3C7",
+    totalsBorder: "#F59E0B",
+    rowAltBg: "#FFFBEB",
+    border: "#0F172A",
+    borderFaint: "#FDE68A",
+    surface: "#FFFFFF",
+    text: "#0F172A",
+    textMuted: "#52525B",
+    fontFamily: "'Arial Black', Arial, sans-serif",
+    fontFamilyHeading: "'Arial Black', Arial, sans-serif",
+    fontSize: "13px",
+    borderRadius: "0px",
+    dividerStyle: "solid",
+    headerLayout: "banded",
+    titleAlign: "left"
+  },
+  {
+    id: "elegant",
+    name: "Elegant",
+    description: "Serif headings, centered logo, gold accents.",
+    primary: "#7C2D12",
+    accent: "#B45309",
+    brand: "#78350F",
+    headerBg: "#FEF3C7",
+    headerText: "#7C2D12",
+    totalsBg: "#FFFBEB",
+    totalsBorder: "#B45309",
+    rowAltBg: "#FFFBEB",
+    border: "#FCD34D",
+    borderFaint: "#FDE68A",
+    surface: "#FFFFFF",
+    text: "#1C1917",
+    textMuted: "#57534E",
+    fontFamily: "Georgia, 'Times New Roman', serif",
+    fontFamilyHeading: "Georgia, 'Times New Roman', serif",
+    fontSize: "12px",
+    borderRadius: "6px",
+    dividerStyle: "solid",
+    headerLayout: "stacked",
+    titleAlign: "center"
+  },
+  {
+    id: "tech",
+    name: "Tech",
+    description: "Cool grays, monospace numbers, card-style totals.",
+    primary: "#0EA5E9",
+    accent: "#06B6D4",
+    brand: "#0F172A",
+    headerBg: "#F0F9FF",
+    headerText: "#0C4A6E",
+    totalsBg: "#F0F9FF",
+    totalsBorder: "#0EA5E9",
+    rowAltBg: "#F8FAFC",
+    border: "#BAE6FD",
+    borderFaint: "#E0F2FE",
+    surface: "#FFFFFF",
+    text: "#0F172A",
+    textMuted: "#475569",
+    fontFamily: "'Segoe UI', 'Roboto', sans-serif",
+    fontFamilyHeading: "'JetBrains Mono', 'Courier New', monospace",
+    fontSize: "12px",
+    borderRadius: "8px",
+    dividerStyle: "dashed",
+    headerLayout: "split",
+    titleAlign: "right"
+  },
+  {
+    id: "vibrant",
+    name: "Vibrant",
+    description: "Gradient header, magenta/teal palette.",
+    primary: "#DB2777",
+    accent: "#0D9488",
+    brand: "#831843",
+    headerBg: "#FCE7F3",
+    headerText: "#831843",
+    totalsBg: "#CCFBF1",
+    totalsBorder: "#0D9488",
+    rowAltBg: "#FDF2F8",
+    border: "#F9A8D4",
+    borderFaint: "#FBCFE8",
+    surface: "#FFFFFF",
+    text: "#500724",
+    textMuted: "#9D174D",
+    fontFamily: "'Trebuchet MS', 'Lucida Sans Unicode', sans-serif",
+    fontFamilyHeading: "'Trebuchet MS', 'Lucida Sans Unicode', sans-serif",
+    fontSize: "12px",
+    borderRadius: "12px",
+    dividerStyle: "solid",
+    headerLayout: "banded",
+    titleAlign: "center"
+  },
+  {
+    id: "compact",
+    name: "Compact",
+    description: "High info density, smaller fonts, optimized multi-page.",
+    primary: "#0F766E",
+    accent: "#0EA5E9",
+    brand: "#134E4A",
+    headerBg: "#CCFBF1",
+    headerText: "#134E4A",
+    totalsBg: "#F0FDFA",
+    totalsBorder: "#0F766E",
+    rowAltBg: "#F0FDFA",
+    border: "#5EEAD4",
+    borderFaint: "#99F6E4",
+    surface: "#FFFFFF",
+    text: "#134E4A",
+    textMuted: "#475569",
+    fontFamily: "'Inter', 'Helvetica', sans-serif",
+    fontFamilyHeading: "'Inter', 'Helvetica', sans-serif",
+    fontSize: "10.5px",
+    borderRadius: "3px",
+    dividerStyle: "dotted",
+    headerLayout: "split",
+    titleAlign: "right"
+  },
+  {
+    id: "mono",
+    name: "Mono",
+    description: "Pure black/white, ASCII-rules, terminal-style.",
+    primary: "#000000",
+    accent: "#000000",
+    brand: "#000000",
+    headerBg: "#FFFFFF",
+    headerText: "#000000",
+    totalsBg: "#FFFFFF",
+    totalsBorder: "#000000",
+    rowAltBg: "#FFFFFF",
+    border: "#000000",
+    borderFaint: "#000000",
+    surface: "#FFFFFF",
+    text: "#000000",
+    textMuted: "#000000",
+    fontFamily: "'Courier New', Courier, monospace",
+    fontFamilyHeading: "'Courier New', Courier, monospace",
+    fontSize: "12px",
+    borderRadius: "0px",
+    dividerStyle: "solid",
+    headerLayout: "stacked",
+    titleAlign: "left"
+  }
+];
+
+// src/templates/thermal.ts
+var THERMAL_TEMPLATES = [
+  {
+    id: "classic",
+    name: "Classic",
+    description: "Original 80mm thermal \u2014 centered courier.",
+    fontFamily: "'Courier New', monospace",
+    fontSize: "16px",
+    fontWeightBase: 600,
+    dividerStyle: "solid",
+    headerLayout: "centered",
+    itemSpacing: "normal",
+    totalsStyle: "bordered",
+    inkColor: "#000000",
+    accentColor: "#000000",
+    backgroundColor: "#FFFFFF"
+  },
+  {
+    id: "compact",
+    name: "Compact",
+    description: "Tighter spacing, smaller font \u2014 fit more on one roll.",
+    fontFamily: "'Courier New', monospace",
+    fontSize: "13px",
+    fontWeightBase: 500,
+    dividerStyle: "dashed",
+    headerLayout: "centered",
+    itemSpacing: "tight",
+    totalsStyle: "plain",
+    inkColor: "#000000",
+    accentColor: "#000000",
+    backgroundColor: "#FFFFFF"
+  },
+  {
+    id: "wide",
+    name: "Wide",
+    description: "Larger font, generous spacing \u2014 premium feel.",
+    fontFamily: "'Courier New', monospace",
+    fontSize: "18px",
+    fontWeightBase: 700,
+    dividerStyle: "double",
+    headerLayout: "centered",
+    itemSpacing: "loose",
+    totalsStyle: "accent",
+    inkColor: "#000000",
+    accentColor: "#000000",
+    backgroundColor: "#FFFFFF"
+  },
+  {
+    id: "dense",
+    name: "Dense",
+    description: "Dense info packing, minimal padding.",
+    fontFamily: "'Courier New', monospace",
+    fontSize: "14px",
+    fontWeightBase: 600,
+    dividerStyle: "solid",
+    headerLayout: "left-aligned",
+    itemSpacing: "tight",
+    totalsStyle: "bordered",
+    inkColor: "#000000",
+    accentColor: "#000000",
+    backgroundColor: "#FFFFFF"
+  },
+  {
+    id: "sparse",
+    name: "Sparse",
+    description: "Airy layout, dot dividers, easy to scan.",
+    fontFamily: "'Courier New', monospace",
+    fontSize: "15px",
+    fontWeightBase: 500,
+    dividerStyle: "dotted",
+    headerLayout: "centered",
+    itemSpacing: "loose",
+    totalsStyle: "plain",
+    inkColor: "#000000",
+    accentColor: "#000000",
+    backgroundColor: "#FFFFFF"
+  },
+  {
+    id: "boxed",
+    name: "Boxed",
+    description: "Header inside a heavy box, uppercase banner.",
+    fontFamily: "'Courier New', monospace",
+    fontSize: "16px",
+    fontWeightBase: 800,
+    dividerStyle: "solid",
+    headerLayout: "boxed",
+    itemSpacing: "normal",
+    totalsStyle: "bordered",
+    inkColor: "#000000",
+    accentColor: "#000000",
+    backgroundColor: "#FFFFFF"
+  },
+  {
+    id: "lined",
+    name: "Lined",
+    description: "Dashed dividers between every section.",
+    fontFamily: "'Courier New', monospace",
+    fontSize: "16px",
+    fontWeightBase: 600,
+    dividerStyle: "dashed",
+    headerLayout: "centered",
+    itemSpacing: "normal",
+    totalsStyle: "accent",
+    inkColor: "#000000",
+    accentColor: "#000000",
+    backgroundColor: "#FFFFFF"
+  },
+  {
+    id: "split",
+    name: "Split",
+    description: "Left-aligned header, two-column totals.",
+    fontFamily: "'Courier New', monospace",
+    fontSize: "16px",
+    fontWeightBase: 600,
+    dividerStyle: "solid",
+    headerLayout: "left-aligned",
+    itemSpacing: "normal",
+    totalsStyle: "bordered",
+    inkColor: "#000000",
+    accentColor: "#000000",
+    backgroundColor: "#FFFFFF"
+  },
+  {
+    id: "monobold",
+    name: "Mono Bold",
+    description: "Heaviest font weights, strong strike-through totals.",
+    fontFamily: "'Courier New', monospace",
+    fontSize: "16px",
+    fontWeightBase: 900,
+    dividerStyle: "double",
+    headerLayout: "centered",
+    itemSpacing: "normal",
+    totalsStyle: "accent",
+    inkColor: "#000000",
+    accentColor: "#000000",
+    backgroundColor: "#FFFFFF"
+  },
+  {
+    id: "elegant",
+    name: "Elegant",
+    description: "Serif accents via mixed font, soft dots.",
+    fontFamily: "Georgia, 'Times New Roman', serif",
+    fontSize: "15px",
+    fontWeightBase: 500,
+    dividerStyle: "dotted",
+    headerLayout: "centered",
+    itemSpacing: "loose",
+    totalsStyle: "plain",
+    inkColor: "#1C1917",
+    accentColor: "#7C2D12",
+    backgroundColor: "#FFFFFF"
+  }
+];
+
+// src/templates/registry.ts
+var DEFAULT_A4_ID = "classic";
+var DEFAULT_THERMAL_ID = "classic";
+var A4_TEMPLATE_IDS = A4_TEMPLATES.map((t) => t.id);
+var THERMAL_TEMPLATE_IDS = THERMAL_TEMPLATES.map((t) => t.id);
+function isA4TemplateId(value) {
+  return typeof value === "string" && A4_TEMPLATE_IDS.includes(value);
+}
+function isThermalTemplateId(value) {
+  return typeof value === "string" && THERMAL_TEMPLATE_IDS.includes(value);
+}
+function getA4Template(id) {
+  if (id && isA4TemplateId(id)) {
+    const found = A4_TEMPLATES.find((t) => t.id === id);
+    if (found) return found;
+  }
+  return A4_TEMPLATES.find((t) => t.id === DEFAULT_A4_ID) ?? A4_TEMPLATES[0];
+}
+function getThermalTemplate(id) {
+  if (id && isThermalTemplateId(id)) {
+    const found = THERMAL_TEMPLATES.find((t) => t.id === id);
+    if (found) return found;
+  }
+  return THERMAL_TEMPLATES.find((t) => t.id === DEFAULT_THERMAL_ID) ?? THERMAL_TEMPLATES[0];
+}
+function isClassicTemplate(id) {
+  return !id || id === DEFAULT_A4_ID || id === DEFAULT_THERMAL_ID;
+}
+
+// src/templates/contact-box.ts
+function esc(value) {
+  if (value === null || value === void 0) return "";
+  return String(value).replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
+}
+function trimAll(s) {
+  return s.replace(/\s+/g, " ").trim();
+}
+function renderContactBox(input) {
+  const escape = esc;
+  const name = trimAll(input.name || "");
+  const fullName = input.fullName && trimAll(input.fullName) && trimAll(input.fullName) !== name ? trimAll(input.fullName || "") : "";
+  const taxNumber = trimAll(input.taxNumber || "");
+  const regNumber = trimAll(input.registrationNumber || "");
+  const address = trimAll(input.address || "");
+  const city = trimAll(input.city || "");
+  const postalCode = trimAll(input.postalCode || "");
+  const province = trimAll(input.province || "");
+  const phone = trimAll(input.phone || "");
+  const phone2 = trimAll(input.phone2 || "");
+  const email = trimAll(input.email || "");
+  const website = trimAll(input.website || "");
+  return `
+<div class="client-box-label">${escape(input.label)}</div>
+<div class="client-box">
+  <div class="client-name">${escape(name)}</div>
+  ${fullName ? `${escape(fullName)}<br>` : ""}
+  ${taxNumber ? `VAT/Tax No: ${escape(taxNumber)}<br>` : ""}
+  ${regNumber ? `Reg No: ${escape(regNumber)}<br>` : ""}
+  ${address ? `${escape(address)}<br>` : ""}
+  ${city || postalCode ? `${escape(city)} ${escape(postalCode)}<br>` : ""}
+  ${province ? `${escape(province)}<br>` : ""}
+  ${phone ? `${escape(phone)}<br>` : ""}
+  ${phone2 ? `${escape(phone2)}<br>` : ""}
+  ${email ? `${escape(email)}` : ""}
+  ${website ? `<br>Website: ${escape(website)}` : ""}
+</div>
+`;
+}
+
+// src/templates/sections.ts
+function barcodeQrBlock(ctx, extraClass = "") {
+  const hasCode = ctx.settings.showBarcode && ctx.barcodeDataUrl || ctx.settings.showQRCode && ctx.qrDataUrl;
+  if (!hasCode) return "";
+  const t = ctx.template;
+  switch (ctx.templateId) {
+    // ---- modern: side-by-side flex card ----
+    case "modern":
+      return `<div class="barcode-qr-modern ${extraClass}" style="display:flex;gap:14px;align-items:flex-start;margin-top:14px;padding:10px 12px;background:${t.surface};border:1px solid ${t.borderFaint};border-radius:${t.borderRadius};">
+  ${ctx.settings.showBarcode && ctx.barcodeDataUrl ? `<img src="${ctx.barcodeDataUrl}" style="height:46px;flex-shrink:0;" alt="Barcode"/>` : ""}
+  ${ctx.settings.showQRCode && ctx.qrDataUrl ? `<img src="${ctx.qrDataUrl}" style="width:82px;height:82px;flex-shrink:0;" alt="QR Code"/>` : ""}
+</div>`;
+    // ---- minimal: underline separator, compact ----
+    case "minimal":
+      return `<div class="barcode-qr-minimal ${extraClass}" style="margin-top:14px;padding-top:10px;border-top:1px solid ${t.borderFaint};">
+  ${ctx.settings.showBarcode && ctx.barcodeDataUrl ? `<img src="${ctx.barcodeDataUrl}" style="height:40px;display:block;margin-bottom:6px;" alt="Barcode"/>` : ""}
+  ${ctx.settings.showQRCode && ctx.qrDataUrl ? `<img src="${ctx.qrDataUrl}" style="width:70px;height:70px;" alt="QR Code"/>` : ""}
+</div>`;
+    // ---- corporate: boxed with headerBg ----
+    case "corporate":
+      return `<div class="barcode-qr-corporate ${extraClass}" style="margin-top:14px;padding:12px 14px;background:${t.headerBg};border:1.5px solid ${t.border};border-radius:${t.borderRadius};">
+  ${ctx.settings.showBarcode && ctx.barcodeDataUrl ? `<img src="${ctx.barcodeDataUrl}" style="height:46px;display:block;margin-bottom:8px;" alt="Barcode"/>` : ""}
+  ${ctx.settings.showQRCode && ctx.qrDataUrl ? `<img src="${ctx.qrDataUrl}" style="width:88px;height:88px;" alt="QR Code"/>` : ""}
+</div>`;
+    // ---- bold: thick accent border, large codes ----
+    case "bold":
+      return `<div class="barcode-qr-bold ${extraClass}" style="margin-top:14px;padding:14px;border:3px solid ${t.accent};border-radius:${t.borderRadius};background:${t.surface};">
+  ${ctx.settings.showBarcode && ctx.barcodeDataUrl ? `<img src="${ctx.barcodeDataUrl}" style="height:58px;display:block;margin-bottom:10px;" alt="Barcode"/>` : ""}
+  ${ctx.settings.showQRCode && ctx.qrDataUrl ? `<img src="${ctx.qrDataUrl}" style="width:105px;height:105px;" alt="QR Code"/>` : ""}
+</div>`;
+    // ---- elegant: italic 'Verification' label, side-by-side ----
+    case "elegant":
+      return `<div class="barcode-qr-elegant ${extraClass}" style="margin-top:16px;padding-top:10px;border-top:1px solid ${t.borderFaint};">
+  <div style="font-style:italic;font-size:9px;color:${t.textMuted};margin-bottom:6px;letter-spacing:0.5px;">Verification</div>
+  <div style="display:flex;gap:14px;align-items:flex-start;">
+    ${ctx.settings.showBarcode && ctx.barcodeDataUrl ? `<img src="${ctx.barcodeDataUrl}" style="height:44px;" alt="Barcode"/>` : ""}
+    ${ctx.settings.showQRCode && ctx.qrDataUrl ? `<img src="${ctx.qrDataUrl}" style="width:78px;height:78px;" alt="QR Code"/>` : ""}
+  </div>
+</div>`;
+    // ---- tech: dark card with inverted barcode ----
+    case "tech":
+      return `<div class="barcode-qr-tech ${extraClass}" style="margin-top:14px;padding:12px;background:#1a1a2e;border-radius:${t.borderRadius};display:inline-block;">
+  ${ctx.settings.showBarcode && ctx.barcodeDataUrl ? `<img src="${ctx.barcodeDataUrl}" style="height:44px;display:block;margin-bottom:6px;filter:invert(1) hue-rotate(180deg);" alt="Barcode"/>` : ""}
+  ${ctx.settings.showQRCode && ctx.qrDataUrl ? `<img src="${ctx.qrDataUrl}" style="width:85px;height:85px;border-radius:6px;" alt="QR Code"/>` : ""}
+</div>`;
+    // ---- vibrant: dashed colored border box ----
+    case "vibrant":
+      return `<div class="barcode-qr-vibrant ${extraClass}" style="margin-top:14px;padding:12px 14px;border:2.5px dashed ${t.accent};border-radius:${t.borderRadius};background:${t.headerBg}22;">
+  ${ctx.settings.showBarcode && ctx.barcodeDataUrl ? `<img src="${ctx.barcodeDataUrl}" style="height:50px;display:block;margin-bottom:6px;" alt="Barcode"/>` : ""}
+  ${ctx.settings.showQRCode && ctx.qrDataUrl ? `<img src="${ctx.qrDataUrl}" style="width:95px;height:95px;" alt="QR Code"/>` : ""}
+</div>`;
+    // ---- compact: tiny inline ----
+    case "compact":
+      return `<div class="barcode-qr-compact ${extraClass}" style="margin-top:10px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;">
+  ${ctx.settings.showBarcode && ctx.barcodeDataUrl ? `<img src="${ctx.barcodeDataUrl}" style="height:34px;" alt="Barcode"/>` : ""}
+  ${ctx.settings.showQRCode && ctx.qrDataUrl ? `<img src="${ctx.qrDataUrl}" style="width:56px;height:56px;" alt="QR Code"/>` : ""}
+</div>`;
+    // ---- mono: grayscale, strict double border ----
+    case "mono":
+      return `<div class="barcode-qr-mono ${extraClass}" style="margin-top:14px;padding:12px;border:2px solid #333;background:#fafafa;border-radius:0;">
+  ${ctx.settings.showBarcode && ctx.barcodeDataUrl ? `<img src="${ctx.barcodeDataUrl}" style="height:44px;display:block;margin-bottom:6px;filter:grayscale(100%);" alt="Barcode"/>` : ""}
+  ${ctx.settings.showQRCode && ctx.qrDataUrl ? `<img src="${ctx.qrDataUrl}" style="width:82px;height:82px;filter:grayscale(100%);" alt="QR Code"/>` : ""}
+</div>`;
+    // ---- classic: stacked vertically, standard ----
+    default:
+      return `<div class="barcode-qr-classic ${extraClass}" style="margin-top:10px;">
+  ${ctx.settings.showBarcode && ctx.barcodeDataUrl ? `<img src="${ctx.barcodeDataUrl}" style="max-width:200px;height:auto;display:block;margin-bottom:8px;" alt="Barcode"/>` : ""}
+  ${ctx.settings.showQRCode && ctx.qrDataUrl ? `<img src="${ctx.qrDataUrl}" style="max-width:120px;height:auto;" alt="QR Code"/>` : ""}
+</div>`;
+  }
+}
+var renderModernHeader = (ctx) => {
+  const t = ctx.template;
+  const contactLines = [
+    ctx.settings.showPhone && ctx.cPhone ? ctx.cPhone : "",
+    ctx.settings.showPhone && ctx.cPhone2 ? ctx.cPhone2 : "",
+    ctx.settings.showEmail && ctx.cEmail ? ctx.cEmail : "",
+    ctx.settings.showWebsite && ctx.cWeb ? ctx.cWeb : ""
+  ].filter(Boolean).join("<br>");
+  return `<div class="row invoice-${ctx.templateId}">
+  <!-- full-width header band with left accent stripe -->
+  <div style="display:flex;width:100%;">
+    <div style="width:6px;background:${t.accent};flex-shrink:0;border-radius:${t.borderRadius} 0 0 ${t.borderRadius};"></div>
+    <div style="flex:1;padding:18px 22px;background:${t.headerBg};">
+      <div style="display:flex;align-items:center;gap:16px;">
+        ${ctx.logo ? `<img src="${ctx.logo}" style="height:52px;max-width:120px;object-fit:contain;"/>` : `<div style="font-family:${t.fontFamilyHeading};font-size:18px;font-weight:700;color:${t.text};letter-spacing:-0.3px;">${ctx.cName}</div>`}
+        <div style="flex:1;"></div>
+        <div style="font-family:${t.fontFamilyHeading};font-size:34px;font-weight:800;color:${t.headerText || t.text};letter-spacing:-1px;text-transform:uppercase;">${ctx.docTitle}</div>
+      </div>
+      <div style="display:flex;gap:32px;margin-top:12px;font-size:10.5px;color:${t.textMuted};">
+        <div>
+          <div style="font-weight:600;color:${t.text};margin-bottom:2px;">${ctx.cName}</div>
+          ${ctx.cAddress ? `<div>${ctx.cAddress}</div>` : ""}
+          ${ctx.cCity || ctx.cCode ? `<div>${ctx.cCity} ${ctx.cCode}</div>` : ""}
+          ${ctx.cProv ? `<div>${ctx.cProv}</div>` : ""}
+          ${ctx.settings.showTaxNumber && ctx.cVat ? `<div style="margin-top:3px;">VAT No.: ${ctx.cVat}</div>` : ""}
+        </div>
+        <div>
+          ${contactLines ? `<div style="white-space:pre-line;">${contactLines}</div>` : ""}
+          ${barcodeQrBlock(ctx)}
+        </div>
+      </div>
+    </div>
+  </div>
+</div>`;
+};
+var renderMinimalHeader = (ctx) => {
+  const t = ctx.template;
+  return `<div class="row invoice-${ctx.templateId}">
+  <div style="text-align:center;padding:28px 0 10px;">
+    ${ctx.logo ? `<img src="${ctx.logo}" style="height:44px;margin:0 auto 10px;display:block;"/>` : ""}
+    ${!ctx.logo ? `<div style="font-family:${t.fontFamilyHeading};font-size:13px;font-weight:600;color:${t.text};letter-spacing:2px;text-transform:uppercase;margin-bottom:12px;">${ctx.cName}</div>` : ""}
+    <div style="font-family:${t.fontFamilyHeading};font-size:24px;letter-spacing:3px;color:${t.text};text-transform:uppercase;font-weight:300;">${ctx.docTitle}</div>
+    <div style="font-size:10px;color:${t.textMuted};margin-top:4px;">${ctx.docNumber}</div>
+  </div>
+  <div style="display:flex;justify-content:space-between;align-items:flex-start;border-top:1px solid ${t.borderFaint};border-bottom:1px solid ${t.borderFaint};padding:10px 0;margin-top:8px;">
+    <div style="font-size:9.5px;color:${t.textMuted};line-height:1.6;text-transform:uppercase;letter-spacing:0.4px;">
+      <div style="font-weight:700;color:${t.text};margin-bottom:2px;">From:</div>
+      <strong>${ctx.cName}</strong><br/>
+      ${ctx.cAddress ? `${ctx.cAddress}<br/>` : ""}
+      ${ctx.cCity} ${ctx.cCode}<br/>
+      ${ctx.cProv}
+      ${ctx.settings.showTaxNumber && ctx.cVat ? `<br/>VAT No.: ${ctx.cVat}` : ""}
+    </div>
+    <div style="text-align:right;font-size:9.5px;color:${t.textMuted};line-height:1.6;text-transform:uppercase;letter-spacing:0.4px;">
+      ${ctx.settings.showPhone && ctx.cPhone ? `<div>T: ${ctx.cPhone}</div>` : ""}
+      ${ctx.settings.showEmail && ctx.cEmail ? `<div>E: ${ctx.cEmail}</div>` : ""}
+      ${ctx.settings.showWebsite && ctx.cWeb ? `<div>W: ${ctx.cWeb}</div>` : ""}
+      ${barcodeQrBlock(ctx)}
+    </div>
+  </div>
+</div>`;
+};
+var renderCorporateHeader = (ctx) => {
+  const t = ctx.template;
+  const contactDetailBlock = [
+    ctx.settings.showPhone && ctx.cPhone ? `<div style="display:flex;gap:6px;align-items:baseline;"><span style="font-weight:600;">Tel:</span><span>${ctx.cPhone}</span></div>` : "",
+    ctx.settings.showPhone && ctx.cPhone2 ? `<div style="display:flex;gap:6px;align-items:baseline;"><span style="font-weight:600;">Tel:</span><span>${ctx.cPhone2}</span></div>` : "",
+    ctx.settings.showEmail && ctx.cEmail ? `<div style="display:flex;gap:6px;align-items:baseline;"><span style="font-weight:600;">Email:</span><span>${ctx.cEmail}</span></div>` : "",
+    ctx.settings.showWebsite && ctx.cWeb ? `<div style="display:flex;gap:6px;align-items:baseline;"><span style="font-weight:600;">Web:</span><span>${ctx.cWeb}</span></div>` : ""
+  ].filter(Boolean).join("");
+  return `<div class="row invoice-${ctx.templateId}">
+  <div style="border:2px solid ${t.border};border-radius:${t.borderRadius};overflow:hidden;">
+    <!-- top boxed header -->
+    <div style="background:${t.headerBg};padding:18px 22px;display:flex;align-items:center;gap:16px;border-bottom:2px solid ${t.border};">
+      ${ctx.logo ? `<img src="${ctx.logo}" style="height:56px;max-width:130px;object-fit:contain;"/>` : `<div style="font-family:${t.fontFamilyHeading};font-size:17px;font-weight:700;color:${t.text};">${ctx.cName}</div>`}
+      <div style="flex:1;"></div>
+      <div style="font-family:${t.fontFamilyHeading};font-size:30px;font-weight:700;color:${t.headerText || t.text};letter-spacing:0.5px;">${ctx.docTitle}</div>
+    </div>
+    <div style="display:flex;gap:0;padding:14px 22px;background:${t.surface};">
+      <div style="flex:1;padding-right:20px;border-right:1px solid ${t.borderFaint};">
+        <div style="font-size:9px;text-transform:uppercase;letter-spacing:0.8px;color:${t.textMuted};margin-bottom:4px;font-weight:600;">Registered Address</div>
+        <div style="font-size:11px;color:${t.text};line-height:1.6;">
+          <strong>${ctx.cName}</strong><br/>
+          ${ctx.cAddress}<br/>
+          ${ctx.cCity} ${ctx.cCode}<br/>
+          ${ctx.cProv}
+          ${ctx.settings.showTaxNumber && ctx.cVat ? `<br/><span style="font-weight:600;">VAT No.: ${ctx.cVat}</span>` : ""}
+        </div>
+      </div>
+      <div style="flex:1;padding-left:20px;">
+        <div style="font-size:9px;text-transform:uppercase;letter-spacing:0.8px;color:${t.textMuted};margin-bottom:6px;font-weight:600;">Contact</div>
+        <div style="font-size:11px;color:${t.text};line-height:1.8;">${contactDetailBlock}</div>
+        ${barcodeQrBlock(ctx)}
+      </div>
+    </div>
+  </div>
+</div>`;
+};
+var renderBoldHeader = (ctx) => {
+  const t = ctx.template;
+  return `<div class="row invoice-${ctx.templateId}">
+  <!-- huge banner header -->
+  <div style="background:linear-gradient(135deg, ${t.headerBg} 0%, ${t.surface} 100%);padding:22px 26px;border-bottom:4px solid ${t.accent};">
+    <div style="font-family:${t.fontFamilyHeading};font-size:38px;font-weight:900;color:${t.headerText || t.text};letter-spacing:-1px;line-height:1;">
+      ${ctx.cName.toUpperCase()}
+    </div>
+    ${ctx.cAddress || ctx.cCity ? `<div style="font-size:11px;color:${t.textMuted};margin-top:4px;">${ctx.cAddress} \xB7 ${ctx.cCity} ${ctx.cCode} \xB7 ${ctx.cProv}</div>` : ""}
+  </div>
+  <div style="display:flex;gap:0;padding:16px 0;align-items:center;">
+    <div style="flex:1;">
+      ${ctx.settings.showTaxNumber && ctx.cVat ? `<div style="font-size:10px;color:${t.textMuted};"><strong style="color:${t.text};">VAT No.:</strong> ${ctx.cVat}</div>` : ""}
+      ${ctx.settings.showPhone && ctx.cPhone ? `<div style="font-size:10px;color:${t.textMuted};margin-top:2px;"><strong style="color:${t.text};">T:</strong> ${ctx.cPhone}${ctx.cPhone2 ? ` / ${ctx.cPhone2}` : ""}</div>` : ""}
+      ${ctx.settings.showEmail && ctx.cEmail ? `<div style="font-size:10px;color:${t.textMuted};margin-top:2px;"><strong style="color:${t.text};">E:</strong> ${ctx.cEmail}</div>` : ""}
+      ${ctx.settings.showWebsite && ctx.cWeb ? `<div style="font-size:10px;color:${t.textMuted};margin-top:2px;"><strong style="color:${t.text};">W:</strong> ${ctx.cWeb}</div>` : ""}
+    </div>
+    <div style="font-family:${t.fontFamilyHeading};font-size:44px;font-weight:900;color:${t.headerText || t.text};background:${t.accent};color:#fff;padding:8px 28px;border-radius:4px;letter-spacing:1px;">${ctx.docTitle}</div>
+  </div>
+  <div style="border-top:3px solid ${t.accent};padding-top:10px;margin-top:2px;">
+    <div style="font-size:11px;color:${t.textMuted};">No: <strong style="color:${t.text};">${ctx.docNumber}</strong></div>
+  </div>
+</div>`;
+};
+var renderElegantHeader = (ctx) => {
+  const t = ctx.template;
+  return `<div class="row invoice-${ctx.templateId}">
+  <div style="text-align:center;padding:24px 0 8px;">
+    ${ctx.logo ? `<img src="${ctx.logo}" style="height:50px;margin:0 auto 10px;display:block;"/>` : ""}
+    ${!ctx.logo ? `<div style="font-family:${t.fontFamilyHeading};font-size:20px;font-style:italic;font-weight:500;color:${t.text};margin-bottom:4px;">${ctx.cName}</div>` : ""}
+    <div style="font-family:${t.fontFamilyHeading};font-size:28px;font-style:italic;color:${t.text};font-weight:400;letter-spacing:1px;">${ctx.docTitle}</div>
+  </div>
+  <div style="display:flex;justify-content:center;gap:40px;padding:12px 0;border-top:1px solid ${t.borderFaint};border-bottom:1px solid ${t.borderFaint};margin-top:6px;font-size:10.5px;color:${t.textMuted};">
+    <div style="text-align:center;line-height:1.7;">
+      <div style="font-family:${t.fontFamilyHeading};">${ctx.cName}<br/>${ctx.cAddress}<br/>${ctx.cCity} ${ctx.cCode}<br/>${ctx.cProv}</div>
+      ${ctx.settings.showTaxNumber && ctx.cVat ? `<div style="margin-top:3px;">VAT Reg. No. ${ctx.cVat}</div>` : ""}
+    </div>
+    <div style="text-align:center;line-height:1.7;">
+      ${ctx.settings.showPhone && ctx.cPhone ? `${ctx.cPhone}<br/>` : ""}
+      ${ctx.settings.showEmail && ctx.cEmail ? ctx.cEmail : ""}
+    </div>
+    <div style="text-align:center;">
+      ${ctx.cName ? `<div style="font-weight:600;color:${t.text};">${ctx.docNumber}</div>` : ""}
+    </div>
+  </div>
+  ${barcodeQrBlock(ctx, "margin:0 auto;display:table;")}
+</div>`;
+};
+var renderTechHeader = (ctx) => {
+  const t = ctx.template;
+  return `<div class="row invoice-${ctx.templateId}">
+  <div style="background:#1a1a2e;padding:14px 22px;display:flex;align-items:center;gap:16px;border-radius:${t.borderRadius} ${t.borderRadius} 0 0;">
+    <div style="flex:1;">
+      <div style="font-family:monospace;font-size:13px;font-weight:700;color:#e2e8f0;letter-spacing:0.5px;">${ctx.cName}</div>
+      <div style="font-family:monospace;font-size:9.5px;color:#94a3b8;margin-top:2px;">${ctx.cAddress} \xB7 ${ctx.cCity} ${ctx.cCode} \xB7 ${ctx.cProv}</div>
+    </div>
+    <div style="font-family:monospace;font-size:22px;font-weight:700;color:#fff;border-bottom:2px solid ${t.accent};letter-spacing:1px;">// ${ctx.docTitle}</div>
+  </div>
+  <div style="display:flex;border:1px solid ${t.borderFaint};border-top:none;border-radius:0 0 ${t.borderRadius} ${t.borderRadius};overflow:hidden;">
+    <div style="flex:1;padding:14px 18px;background:${t.surface};border-right:1px solid ${t.borderFaint};">
+      <div style="font-family:monospace;font-size:9px;color:${t.textMuted};text-transform:uppercase;letter-spacing:1px;margin-bottom:6px;">ORG_DETAILS</div>
+      ${ctx.settings.showTaxNumber && ctx.cVat ? `<div style="font-family:monospace;font-size:11px;color:${t.text};">VAT No.: <span style="color:${t.accent};">${ctx.cVat}</span></div>` : ""}
+      ${ctx.settings.showPhone && ctx.cPhone ? `<div style="font-family:monospace;font-size:11px;color:${t.text};">TEL: ${ctx.cPhone}</div>` : ""}
+      ${ctx.settings.showEmail && ctx.cEmail ? `<div style="font-family:monospace;font-size:11px;color:${t.text};">EMAIL: ${ctx.cEmail}</div>` : ""}
+      ${ctx.settings.showWebsite && ctx.cWeb ? `<div style="font-family:monospace;font-size:11px;color:${t.text};">WEB: ${ctx.cWeb}</div>` : ""}
+      ${barcodeQrBlock(ctx)}
+    </div>
+    <div style="width:160px;padding:14px 16px;background:${t.headerBg};">
+      <div style="font-family:monospace;font-size:9px;color:${t.textMuted};text-transform:uppercase;letter-spacing:1px;margin-bottom:6px;">REF</div>
+      <div style="font-family:monospace;font-size:13px;font-weight:700;color:${t.text};">${ctx.docNumber}</div>
+    </div>
+  </div>
+</div>`;
+};
+var renderVibrantHeader = (ctx) => {
+  const t = ctx.template;
+  return `<div class="row invoice-${ctx.templateId}">
+  <div style="background:linear-gradient(135deg,${t.primary} 0%,${t.accent} 100%);padding:20px 26px;border-radius:${t.borderRadius};">
+    <div style="display:flex;align-items:center;gap:16px;margin-bottom:14px;">
+      ${ctx.logo ? `<img src="${ctx.logo}" style="height:52px;max-width:110px;object-fit:contain;"/>` : ""}
+      ${!ctx.logo ? `<div style="font-family:${t.fontFamilyHeading};font-size:21px;font-weight:800;color:#fff;letter-spacing:-0.3px;text-shadow:0 1px 4px rgba(0,0,0,0.15);">${ctx.cName}</div>` : ""}
+      <div style="flex:1;"></div>
+      <div style="background:#fff;color:${t.primary};font-family:${t.fontFamilyHeading};font-size:28px;font-weight:900;padding:6px 26px;border-radius:50px;letter-spacing:1px;box-shadow:0 2px 8px rgba(0,0,0,0.1);">${ctx.docTitle}</div>
+    </div>
+    <div style="display:flex;gap:24px;color:#fff;font-size:10.5px;opacity:0.95;">
+      <div style="line-height:1.6;">
+        <strong>${ctx.cName}</strong><br/>
+        ${ctx.cAddress || ""}${ctx.cAddress ? "<br/>" : ""}
+        ${ctx.cCity} ${ctx.cCode}<br/>
+        ${ctx.cProv}
+        ${ctx.settings.showTaxNumber && ctx.cVat ? `<br/><strong>VAT No.:</strong> ${ctx.cVat}` : ""}
+      </div>
+      <div style="line-height:1.8;">
+        ${ctx.settings.showPhone && ctx.cPhone ? `<div>${ctx.cPhone}</div>` : ""}
+        ${ctx.settings.showEmail && ctx.cEmail ? `<div>${ctx.cEmail}</div>` : ""}
+        ${ctx.settings.showWebsite && ctx.cWeb ? `<div>${ctx.cWeb}</div>` : ""}
+      </div>
+      <div style="margin-left:auto;">${barcodeQrBlock(ctx)}</div>
+    </div>
+  </div>
+</div>`;
+};
+var renderCompactHeader = (ctx) => {
+  const t = ctx.template;
+  return `<div class="row invoice-${ctx.templateId}">
+  <div style="display:flex;gap:14px;align-items:flex-start;padding:10px 0;">
+    <div style="flex-shrink:0;">
+      ${ctx.logo ? `<img src="${ctx.logo}" style="height:38px;"/>` : ""}
+    </div>
+    <div style="flex:1;line-height:1.5;">
+      <div style="font-family:${t.fontFamilyHeading};font-size:14px;font-weight:700;color:${t.text};">${ctx.cName}</div>
+      <div style="font-size:9.5px;color:${t.textMuted};">${ctx.cAddress} \xB7 ${ctx.cCity} ${ctx.cCode} \xB7 ${ctx.cProv}</div>
+      <div style="font-size:9px;color:${t.textMuted};margin-top:2px;">
+        ${ctx.settings.showTaxNumber && ctx.cVat ? `VAT: ${ctx.cVat} \xB7 ` : ""}
+        ${ctx.settings.showPhone && ctx.cPhone ? `T: ${ctx.cPhone}` : ""}
+      </div>
+    </div>
+    <div style="font-family:${t.fontFamilyHeading};font-size:24px;font-weight:800;color:${t.text};white-space:nowrap;">${ctx.docTitle}</div>
+  </div>
+  ${barcodeQrBlock(ctx, "margin-top:6px;")}
+</div>`;
+};
+var renderMonoHeader = (ctx) => {
+  const t = ctx.template;
+  return `<div class="row invoice-${ctx.templateId}">
+  <div style="border:3px double ${t.text};padding:0;border-radius:0;">
+    <div style="display:flex;align-items:center;gap:14px;padding:14px 18px;">
+      <div style="flex:1;">
+        ${ctx.logo ? `<img src="${ctx.logo}" style="height:44px;filter:grayscale(100%);"/>` : ""}
+        ${!ctx.logo ? `<div style="font-family:monospace;font-size:14px;font-weight:700;color:${t.text};text-transform:uppercase;letter-spacing:1px;">${ctx.cName}</div>` : ""}
+        <div style="font-family:monospace;font-size:9px;color:${t.textMuted};margin-top:3px;text-transform:uppercase;letter-spacing:0.5px;">${ctx.cAddress} \xB7 ${ctx.cCity} ${ctx.cCode} \xB7 ${ctx.cProv}</div>
+      </div>
+      <div style="font-family:monospace;font-size:20px;font-weight:700;color:${t.text};letter-spacing:3px;border:2px solid ${t.text};padding:6px 18px;">${ctx.docTitle}</div>
+    </div>
+    <div style="border-top:2px solid ${t.text};display:flex;gap:0;font-family:monospace;font-size:9.5px;text-transform:uppercase;letter-spacing:0.5px;">
+      ${ctx.settings.showTaxNumber && ctx.cVat ? `<div style="flex:1;padding:8px 18px;border-right:1px solid ${t.text};">VAT No.: ${ctx.cVat}</div>` : `<div style="flex:1;"></div>`}
+      ${ctx.settings.showPhone && ctx.cPhone ? `<div style="flex:1;padding:8px 14px;border-right:1px solid ${t.text};">T: ${ctx.cPhone}</div>` : `<div style="flex:1;"></div>`}
+      ${ctx.settings.showEmail && ctx.cEmail ? `<div style="flex:1;padding:8px 14px;">E: ${ctx.cEmail}</div>` : `<div style="flex:1;"></div>`}
+    </div>
+  </div>
+  <div style="display:flex;justify-content:flex-end;margin-top:10px;">${barcodeQrBlock(ctx)}</div>
+</div>`;
+};
+function renderHeaderSection(ctx) {
+  switch (ctx.templateId) {
+    case "modern":
+      return renderModernHeader(ctx);
+    case "minimal":
+      return renderMinimalHeader(ctx);
+    case "corporate":
+      return renderCorporateHeader(ctx);
+    case "bold":
+      return renderBoldHeader(ctx);
+    case "elegant":
+      return renderElegantHeader(ctx);
+    case "tech":
+      return renderTechHeader(ctx);
+    case "vibrant":
+      return renderVibrantHeader(ctx);
+    case "compact":
+      return renderCompactHeader(ctx);
+    case "mono":
+      return renderMonoHeader(ctx);
+    case "classic":
+    default:
+      return renderClassicHeader(ctx);
+  }
+}
+function renderClassicHeader(ctx) {
+  const leftColExtra = (() => {
+    if (ctx.settings.showBarcode && ctx.barcodeDataUrl) {
+      return `<div style="margin-top: 10px;"><img src="${ctx.barcodeDataUrl}" alt="Barcode" style="max-width:200px;height:auto;" /></div>`;
+    }
+    if (ctx.settings.showQRCode && ctx.qrDataUrl) {
+      return `<div style="margin-top: 10px;"><img src="${ctx.qrDataUrl}" alt="QR Code" style="max-width:120px;height:auto;" /></div>`;
+    }
+    return "";
+  })();
+  return `<div class="row">
+  <div class="col-left">
+    ${ctx.logo ? `<img src="${ctx.logo}" class="logo-img" />` : ""}
+    ${!ctx.logo ? `<div class="company-header">${ctx.cName}</div>` : ""}
+    <div class="address-block">
+      <strong>${ctx.cName}</strong><br>
+      ${ctx.cAddress}<br>
+      ${ctx.cCity} ${ctx.cCode}<br>
+      ${ctx.cProv}
+    </div>
+    ${ctx.settings.showTaxNumber && ctx.cVat ? `<div class="reg-info">VAT No.: ${ctx.cVat}</div>` : ""}
+    <div class="contact-info">
+      ${ctx.settings.showPhone && ctx.cPhone ? `${ctx.cPhone}<br>` : ""}
+      ${ctx.settings.showPhone && ctx.cPhone2 ? `${ctx.cPhone2}<br>` : ""}
+      ${ctx.settings.showEmail && ctx.cEmail ? `${ctx.cEmail}<br>` : ""}
+      ${ctx.settings.showWebsite ? ctx.cWeb : ""}
+    </div>
+    ${leftColExtra}
+  </div>
+  <div class="col-right">
+    <div class="quote-title-main">${ctx.docTitle}</div>
+    <table class="details-table">
+      <tr><td class="label-cell">${ctx.docTitle.slice(0, -1)} No.:</td><td class="value-cell">${ctx.docNumber}</td></tr>
+      <tr><td class="label-cell">Date:</td><td class="value-cell"></td></tr>
+      <tr><td class="label-cell">Due date:</td><td class="value-cell"></td></tr>
+    </table>
+  </div>
+</div>`;
+}
+
+// src/utils/formatting.ts
+function escapeHtml(value) {
+  if (value === null || value === void 0) return "";
+  return String(value).replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
+}
+function hasVisibleText(str) {
+  if (!str) return false;
+  const stripped = str.replace(/<[^>]+>/g, "").trim();
+  return stripped.length > 0;
+}
+function getClientDisplayName(client) {
+  if (!client) return "";
+  if (client.company && client.company.trim()) return client.company.trim();
+  return client.name || "";
+}
+function formatCurrency(amount, currency = "ZAR") {
+  const num = typeof amount === "number" ? amount : parseFloat(String(amount || 0));
+  if (isNaN(num)) return currency === "ZAR" ? "R0.00" : "0.00";
+  const formatted = num.toLocaleString("en-ZA", {
+    minimumFractionDigits: 2,
+    maximumFractionDigits: 2
+  });
+  if (currency === "ZAR") return `R${formatted}`;
+  return `${currency} ${formatted}`;
+}
+function formatDate(date) {
+  if (!date) return "";
+  const d = typeof date === "string" ? new Date(date) : date;
+  if (isNaN(d.getTime())) return String(date);
+  return d.toLocaleDateString("en-ZA", {
+    year: "numeric",
+    month: "short",
+    day: "2-digit"
+  });
+}
+function formatCompanyAddress(companyInfo) {
+  if (!companyInfo) return "";
+  const parts = [
+    companyInfo.address || companyInfo.Address,
+    companyInfo.city,
+    companyInfo.province,
+    companyInfo.postCode
+  ].filter(Boolean);
+  return parts.join(", ");
+}
+
+// src/utils/barcode.ts
+var import_qrcode = __toESM(require("qrcode"));
+var CODE128_PATTERNS = [
+  "212222",
+  "222122",
+  "222221",
+  "121223",
+  "121322",
+  "131222",
+  "122213",
+  "122312",
+  "132212",
+  "221213",
+  "221312",
+  "231212",
+  "112232",
+  "122132",
+  "122231",
+  "113222",
+  "123122",
+  "123221",
+  "223211",
+  "221132",
+  "221231",
+  "213212",
+  "223112",
+  "312131",
+  "311222",
+  "321122",
+  "321221",
+  "312212",
+  "322112",
+  "322211",
+  "212123",
+  "212321",
+  "232121",
+  "111323",
+  "131123",
+  "131321",
+  "112313",
+  "132113",
+  "132311",
+  "211313",
+  "231113",
+  "231311",
+  "112133",
+  "112331",
+  "132131",
+  "113123",
+  "113321",
+  "133121",
+  "313121",
+  "211331",
+  "231131",
+  "213113",
+  "213311",
+  "213131",
+  "311123",
+  "311321",
+  "331121",
+  "312113",
+  "312311",
+  "332111",
+  "314111",
+  "221411",
+  "431111",
+  "111224",
+  "111422",
+  "121124",
+  "121421",
+  "141122",
+  "141221",
+  "112214",
+  "112412",
+  "122114",
+  "122411",
+  "142112",
+  "142211",
+  "241211",
+  "221114",
+  "413111",
+  "241112",
+  "134111",
+  "111242",
+  "121142",
+  "121241",
+  "114212",
+  "124112",
+  "124211",
+  "411212",
+  "421112",
+  "421211",
+  "212141",
+  "214121",
+  "412121",
+  "111143",
+  "111341",
+  "131141",
+  "114113",
+  "114311",
+  "411113",
+  "411311",
+  "113141",
+  "114131",
+  "311141",
+  "411131",
+  "211412",
+  "211214",
+  "211232",
+  "2331112"
+];
+var START_CODE_B = 104;
+var STOP_CODE = 106;
+function generateCode128Svg(text, height = 40) {
+  if (!text) text = "000000";
+  let checksum = START_CODE_B;
+  const codes = [START_CODE_B];
+  for (let i = 0; i < text.length; i++) {
+    const charCode = text.charCodeAt(i);
+    const codeVal = charCode >= 32 && charCode <= 126 ? charCode - 32 : 0;
+    codes.push(codeVal);
+    checksum += codeVal * (i + 1);
+  }
+  codes.push(checksum % 103);
+  codes.push(STOP_CODE);
+  let pattern = "";
+  for (const code of codes) {
+    pattern += CODE128_PATTERNS[code] || "212222";
+  }
+  const moduleWidth = 1.5;
+  let currentX = 10;
+  const rects = [];
+  for (let i = 0; i < pattern.length; i++) {
+    const width = parseInt(pattern[i], 10) * moduleWidth;
+    const isBar = i % 2 === 0;
+    if (isBar) {
+      rects.push(`<rect x="${currentX}" y="0" width="${width}" height="${height}" fill="#000000"/>`);
+    }
+    currentX += width;
+  }
+  const totalWidth = currentX + 10;
+  const svg = `<svg xmlns="http://www.w3.org/2000/svg" width="${totalWidth}" height="${height + 16}" viewBox="0 0 ${totalWidth} ${height + 16}">
+  <rect width="100%" height="100%" fill="#ffffff"/>
+  ${rects.join("")}
+  <text x="${totalWidth / 2}" y="${height + 12}" font-family="Arial, sans-serif" font-size="11" text-anchor="middle" fill="#000000">${escapeXml(text)}</text>
+</svg>`;
+  return svg;
+}
+function escapeXml(unsafe) {
+  return unsafe.replace(/[<>&'"]/g, (c) => {
+    switch (c) {
+      case "<":
+        return "&lt;";
+      case ">":
+        return "&gt;";
+      case "&":
+        return "&amp;";
+      case "'":
+        return "&apos;";
+      case '"':
+        return "&quot;";
+      default:
+        return c;
+    }
+  });
+}
+async function generateBarcode(value) {
+  const cleanVal = String(value || "").trim();
+  const svg = generateCode128Svg(cleanVal);
+  return `data:image/svg+xml;utf8,${encodeURIComponent(svg)}`;
+}
+async function generateQRCode(value) {
+  const cleanVal = String(value || "").trim();
+  const svg = await import_qrcode.default.toString(cleanVal, {
+    type: "svg",
+    width: 120,
+    margin: 2,
+    color: {
+      dark: "#000000",
+      light: "#ffffff"
+    }
+  });
+  return `data:image/svg+xml;utf8,${encodeURIComponent(svg)}`;
+}
+
+// src/utils/defaults.ts
+var DEFAULT_TAX_RATE = 0.15;
+var DEFAULT_DOCUMENT_TYPE_SETTINGS = {
+  showSignature: true,
+  showWatermark: true,
+  showBarcode: false,
+  showQRCode: false,
+  showPreparedBy: true,
+  showLastUpdatedBy: true,
+  showDescription: true,
+  showPaymentTerms: true,
+  showAdditionalNotes: true,
+  showTaxNumber: true,
+  showEmail: true,
+  showPhone: true,
+  showWebsite: true,
+  showBankDetails: true
+};
+function getDocumentTypeSettings(settings, docType) {
+  if (!settings || !settings[docType]) {
+    return { ...DEFAULT_DOCUMENT_TYPE_SETTINGS };
+  }
+  return { ...DEFAULT_DOCUMENT_TYPE_SETTINGS, ...settings[docType] };
+}
+var DEFAULT_COMPANY_INFO = {
+  companyName: "Your Company",
+  address: "123 Business St",
+  city: "Johannesburg",
+  province: "Gauteng",
+  postCode: "2000",
+  phone: "+27 11 000 0000",
+  email: "info@company.com",
+  taxId: "4000000000",
+  paymentTerms: "Due within 30 days of issue date.",
+  note: "Thank you for your business!"
+};
+var DEFAULT_RECEIPT_COMPANY_INFO = {
+  name: "Your Company",
+  address: "123 Business St, Johannesburg",
+  phone: "+27 11 000 0000",
+  email: "info@company.com",
+  taxNumber: "4000000000"
+};
+
+// src/generators/invoice-generator.ts
+var InvoiceReportGenerator = class {
+  static decimalToNumber(decimalValue) {
+    if (decimalValue === null || decimalValue === void 0) return 0;
+    if (typeof decimalValue === "number") return decimalValue;
+    if (typeof decimalValue === "string") return parseFloat(decimalValue) || 0;
+    if (typeof decimalValue === "object")
+      return parseFloat(decimalValue.toString()) || 0;
+    return 0;
+  }
+  static formatMoney(amount) {
+    return amount.toLocaleString("en-ZA", {
+      minimumFractionDigits: 2,
+      maximumFractionDigits: 2
+    });
+  }
+  static async generateInvoiceReportHTML(invoice, companyInfo, combineServices = true, templateId, docSettings) {
+    if (isClassicTemplate(templateId)) {
+      templateId = "classic";
+    }
+    const template = getA4Template(templateId);
+    const settings = docSettings ?? DEFAULT_DOCUMENT_TYPE_SETTINGS;
+    const clientInfo = invoice.client || {};
+    let barcodeDataUrl = null;
+    let qrDataUrl = null;
+    try {
+      if (settings.showBarcode && invoice.invoiceNumber)
+        barcodeDataUrl = await generateBarcode(invoice.invoiceNumber);
+    } catch {
+    }
+    try {
+      if (settings.showQRCode && invoice.invoiceNumber)
+        qrDataUrl = await generateQRCode(invoice.invoiceNumber);
+    } catch {
+    }
+    const classicMode = template.id === "classic";
+    const colorRed = classicMode ? "#990000" : template.brand;
+    const colorGold = classicMode ? "#C5A005" : template.accent;
+    const headerGreenBg = classicMode ? "#D1FAE5" : template.headerBg;
+    const headerGreenText = classicMode ? "#065F46" : template.headerText;
+    const issueDate = invoice.issueDate ? new Date(invoice.issueDate).toLocaleDateString("en-GB") : "";
+    const dueDate = invoice.dueDate ? new Date(invoice.dueDate).toLocaleDateString("en-GB") : "";
+    const cName = companyInfo?.companyName || "";
+    const cAddress = companyInfo?.address || companyInfo?.Address || "";
+    const cCity = companyInfo?.city || "";
+    const cCode = companyInfo?.postCode || "";
+    const cProv = companyInfo?.province || "";
+    const cVat = companyInfo?.taxId || "";
+    const cPhone = companyInfo?.phone || "";
+    const cPhone2 = companyInfo?.phone2 || "";
+    const cEmail = companyInfo?.email || "";
+    const cWeb = companyInfo?.website || "";
+    const logo = companyInfo?.logo || "";
+    const showWatermark = companyInfo?.showWatermark !== false;
+    const showSignature = companyInfo?.showSignature !== false;
+    const signature = companyInfo?.signature || "";
+    const individualItems = [];
+    const serviceItemsForCombining = [];
+    let subtotalNet = 0;
+    let totalVat = 0;
+    let totalDiscountMoney = 0;
+    (invoice.items || []).forEach((item) => {
+      const qty = this.decimalToNumber(item.quantity);
+      const unitPrice = this.decimalToNumber(item.unitPrice);
+      const taxRate = this.decimalToNumber(item.taxRate);
+      const linePrice = qty * unitPrice;
+      let discountVal = 0;
+      const discountInput = this.decimalToNumber(item.itemDiscountAmount);
+      if (item.itemDiscountType === "PERCENTAGE") {
+        discountVal = linePrice * (discountInput / 100);
+      } else if (item.itemDiscountType === "AMOUNT") {
+        discountVal = discountInput;
+      }
+      const net = linePrice - discountVal;
+      const vat = net * (taxRate / 100);
+      const total = net + vat;
+      subtotalNet += net;
+      totalVat += vat;
+      totalDiscountMoney += discountVal;
+      const itemData = {
+        description: item.description || "",
+        qty,
+        unitPrice,
+        linePrice,
+        discountInput: `${discountInput}`,
+        itemDiscountType: item.itemDiscountType,
+        vat,
+        total,
+        details: item.details || null
+      };
+      const isService = item.type?.toLowerCase() === "service" || !!item.serviceId;
+      const isProduct = !isService && (!!item.shopProductId || item.type?.toLowerCase() === "product");
+      if (isService) {
+        if (combineServices) {
+          serviceItemsForCombining.push(itemData);
+        } else {
+          individualItems.push({
+            ...itemData,
+            itemCode: "SVC",
+            itemType: "service"
+          });
+        }
+      } else if (isProduct) {
+        individualItems.push({
+          ...itemData,
+          itemCode: "PRD",
+          itemType: "product"
+        });
+      } else {
+        individualItems.push({
+          ...itemData,
+          itemCode: "CST",
+          itemType: "custom"
+        });
+      }
+    });
+    let combinedServiceData = null;
+    if (combineServices && serviceItemsForCombining.length > 0) {
+      let totalQuantity = 0;
+      let totalLinePrice = 0;
+      let totalDiscount = 0;
+      let totalNet = 0;
+      let totalVatServices = 0;
+      let totalAmountServices = 0;
+      serviceItemsForCombining.forEach((service) => {
+        totalQuantity += service.qty;
+        totalLinePrice += service.linePrice;
+        totalDiscount += service.discountInput !== "0.00" && service.discountInput !== "0" ? service.linePrice * parseFloat(service.discountInput) / 100 : 0;
+        totalNet += service.total - service.vat;
+        totalVatServices += service.vat;
+        totalAmountServices += service.total;
+      });
+      const averageUnitPrice = totalQuantity > 0 ? totalLinePrice / totalQuantity : 0;
+      const combinedDiscountPercent = totalLinePrice > 0 ? (totalDiscount / totalLinePrice * 100).toFixed(1) : "0.0";
+      combinedServiceData = {
+        description: `Services Package (${serviceItemsForCombining.length} services)`,
+        quantity: totalQuantity,
+        unitPrice: averageUnitPrice,
+        linePrice: totalLinePrice,
+        discountInput: serviceItemsForCombining.some(
+          (s) => s.discountInput !== "0.00" && s.discountInput !== "0"
+        ) ? combinedDiscountPercent : "0.00",
+        vat: totalVatServices,
+        total: totalAmountServices,
+        individualServices: serviceItemsForCombining,
+        displayType: "combined-service"
+      };
+    }
+    let globalDiscVal = 0;
+    const globalDiscInput = this.decimalToNumber(invoice.discountAmount);
+    if (invoice.discountType === "PERCENTAGE") {
+      globalDiscVal = subtotalNet * (globalDiscInput / 100);
+    } else if (invoice.discountType === "AMOUNT") {
+      globalDiscVal = globalDiscInput;
+    }
+    const finalSubtotalExVat = subtotalNet - globalDiscVal;
+    const vatRatio = subtotalNet > 0 ? finalSubtotalExVat / subtotalNet : 1;
+    const finalVat = totalVat * vatRatio;
+    const totalBeforeInterest = finalSubtotalExVat + finalVat;
+    const interestAmount = this.decimalToNumber(invoice.interestAmount);
+    const finalTotal = totalBeforeInterest + interestAmount;
+    const totalDiscountDisplay = totalDiscountMoney + globalDiscVal;
+    const getInstallmentMonths = (period) => {
+      if (!period) return 0;
+      if (typeof period === "number") return period;
+      switch (period) {
+        case "30days":
+          return 1;
+        case "1to3months":
+          return 3;
+        case "3to6months":
+          return 6;
+        case "6to9months":
+          return 9;
+        case "9to12months":
+          return 12;
+        default:
+          return 0;
+      }
+    };
+    const months = getInstallmentMonths(invoice.installmentPeriod);
+    const balanceAfterDeposit = finalTotal - this.decimalToNumber(invoice.depositAmount);
+    const estMonthlyPayment = months > 0 ? balanceAfterDeposit / months : 0;
+    const renderItemDetails = (details) => {
+      if (!details) return "";
+      return `
+        <div class="rich-text-content" style="font-size: 10px; color: #666; margin-top: 2px; margin-left: 3px;">
+          ${details}
+        </div>
+      `;
+    };
+    const renderIndividualService = (service) => {
+      return `
+        <li style="list-style-type: disc; margin-left: 8px; margin-bottom: 4px;">
+          ${service.description} \xD7 ${service.qty}
+        </li>
+      `;
+    };
+    const tableRows = [];
+    individualItems.forEach((item) => {
+      const detailsHtml = renderItemDetails(item.details);
+      const rowStyle = item.itemType === "custom" ? `background-color: ${template.rowAltBg};` : "";
+      tableRows.push(`
+        <tr style="${rowStyle}">
+          <td class="col-desc">
+            <strong>${item.description}</strong>
+            ${detailsHtml}
+          </td>
+          <td class="col-qty">${item.qty}</td>
+          <td class="col-unit-price">${this.formatMoney(item.unitPrice)}</td>
+          <td class="col-line-price">${this.formatMoney(item.linePrice)}</td>
+          <td class="col-disc">${item.discountInput === "0.00" || item.discountInput === "0" ? "-" : item.itemDiscountType === "PERCENTAGE" ? `${item.discountInput}%` : `R${item.discountInput}`}</td>
+          <td class="col-vat">${this.formatMoney(item.vat)}</td>
+          <td class="col-total">${this.formatMoney(item.total)}</td>
+        </tr>
+      `);
+    });
+    if (combineServices && combinedServiceData) {
+      const serviceListHtml = serviceItemsForCombining.map(renderIndividualService).join("");
+      tableRows.push(`
+        <tr style="background-color: ${template.rowAltBg};">
+          <td class="col-desc">
+            <strong>${combinedServiceData.description}</strong>
+            <div style="font-size: 10px; color: #666; margin-top: 2px;">
+              <ul style="margin: 2px 0 0 12px; padding: 0;">
+                ${serviceListHtml}
+              </ul>
+            </div>
+          </td>
+          <td class="col-qty">${combinedServiceData.quantity}</td>
+          <td class="col-unit-price">-</td>
+          <td class="col-line-price">${this.formatMoney(combinedServiceData.linePrice)}</td>
+          <td class="col-disc">${combinedServiceData.discountInput === "0.00" || combinedServiceData.discountInput === "0" ? "-" : `${combinedServiceData.discountInput}%`}</td>
+          <td class="col-vat">${this.formatMoney(combinedServiceData.vat)}</td>
+          <td class="col-total"><strong>${this.formatMoney(combinedServiceData.total)}</strong></td>
+        </tr>
+      `);
+    }
+    const totalPaid = (invoice.payments || []).filter((p) => !p.isDeleted).reduce((sum, p) => sum + this.decimalToNumber(p.amount), 0);
+    const balanceDue = finalTotal - totalPaid;
+    return `
+      <!DOCTYPE html>
+      <html>
+        <head>
+          <title>Invoice ${invoice.invoiceNumber}</title>
+          <style>
+            @import url('https://fonts.googleapis.com/css2?family=Arial:wght@400;700&display=swap');
+            body { font-family: ${template.fontFamily}; margin: 0; padding: 40px; font-size: ${template.fontSize}; color: ${template.text}; line-height: 1.3; }
+            .row { display: flex; width: 100%; gap: 20px; }
+            .col-left { width: 60%; }
+            .col-right { width: 40%; }
+            .logo-img { width: 180px; margin-bottom: 15px; }
+            .company-header { font-family: ${template.fontFamilyHeading}; font-size: 24px; font-weight: bold; color: ${classicMode ? "#d4af37" : template.accent}; margin-bottom: 5px; }
+            .company-header span { color: ${colorRed}; }
+            .address-block, .reg-info, .contact-info { margin-bottom: 8px; }
+            .quote-title-main { font-family: ${template.fontFamilyHeading}; font-size: 26px; color: ${colorRed}; font-weight: bold; text-align: ${template.titleAlign}; margin-bottom: 15px; }
+            
+            .details-table { width: 100%; border-collapse: collapse; margin-bottom: 15px; }
+            .details-table td { border: none; padding: 4px 8px; font-weight: bold; }
+            .label-cell { width: 40%; text-align: left; color: ${template.textMuted}; }
+            .value-cell { width: 60%; text-align: right; }
+
+            .client-box-label { font-weight: bold; margin-bottom: 2px; color: ${template.textMuted}; }
+            .client-box { border: 1px solid ${template.border}; border-radius: ${template.borderRadius}; padding: 10px; min-height: 80px; background-color: ${template.surface}; }
+            .client-name { font-weight: bold; font-size: 13px; margin-bottom: 4px; }
+
+            .items-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
+            .items-table thead { display: table-header-group; }
+            .items-table tr { page-break-inside: avoid; page-break-after: auto; }
+            .items-table th { border: none; padding: 8px 6px; background-color: ${headerGreenBg}; color: ${headerGreenText}; font-weight: bold; text-align: center; font-size: 11px; text-transform: uppercase; }
+            .items-table td { border: none; border-bottom: 1px solid ${template.borderFaint}; padding: 8px 6px; vertical-align: top; font-size: 11px; word-wrap: break-word; overflow-wrap: anywhere; }
+
+            .rich-text-content {
+              overflow-wrap: anywhere;
+              word-break: break-word;
+              color: ${template.text};
+              font-size: 10px;
+              line-height: 1.3;
+            }
+            .rich-text-content p { margin: 0 0 8px 0; padding: 0; }
+            .rich-text-content ul, .rich-text-content ol { margin: 0 0 8px 0; padding-left: 1.5em; }
+            .rich-text-content li { margin-bottom: 4px; }
+            .rich-text-content h1, .rich-text-content h2, .rich-text-content h3,
+            .rich-text-content h4, .rich-text-content h5, .rich-text-content h6 {
+              margin: 12px 0 6px 0;
+              color: ${template.text};
+              line-height: 1.2;
+            }
+            .rich-text-content h1 { font-size: 16px; }
+            .rich-text-content h2 { font-size: 14px; }
+            .rich-text-content h3 { font-size: 12px; }
+            .rich-text-content img { max-width: 100%; height: auto; display: block; margin: 8px 0; }
+            .rich-text-content table { width: 100%; border-collapse: collapse; margin: 8px 0; font-size: 10px; }
+            .rich-text-content td, .rich-text-content th { border: 1px solid ${template.border}; padding: 4px 6px; text-align: left; }
+            .rich-text-content th { background-color: ${template.rowAltBg}; font-weight: bold; }
+            .rich-text-content blockquote { margin: 8px 0; padding: 4px 12px; border-left: 3px solid ${template.border}; color: ${template.textMuted}; font-style: italic; }
+            
+            .col-code { width: 6%; text-align: center; }
+            .col-desc { width: 28%; text-align: left; }
+            .col-qty { width: 8%; text-align: center; }
+            .col-unit-price { width: 10%; text-align: right; }
+            .col-line-price { width: 10%; text-align: right; }
+            .col-disc { width: 8%; text-align: center; }
+            .col-vat { width: 10%; text-align: right; }
+            .col-total { width: 10%; text-align: right; }
+
+            .totals-wrapper { display: flex; justify-content: flex-end; margin-top: 20px; page-break-inside: avoid; }
+            .totals-table { width: 300px; border-collapse: collapse; background-color: ${template.totalsBg}; border-radius: ${template.borderRadius}; overflow: hidden; }
+            .totals-table td { border: none; padding: 6px 8px; font-weight: bold; font-size: 11px; }
+            .text-right { text-align: right; }
+
+            .terms-section { margin-top: 60px; page-break-inside: avoid; }
+            .footer-strip { margin-top: 40px; border-top: 1px solid ${template.borderFaint}; padding: 10px 5px; text-align: center; font-size: 11px; font-weight: bold; color: ${template.textMuted}; page-break-inside: avoid; }
+              
+            /* Watermark */
+            .watermark {
+              position: fixed;
+              top: 50%;
+              left: 50%;
+              transform: translate(-50%, -50%) rotate(-30deg);
+              width: 600px;
+              height: 600px;
+              opacity: 0.05;
+              z-index: -100;
+              display: flex;
+              align-items: center;
+              justify-content: center;
+              pointer-events: none;
+            }
+            .watermark img { max-width: 100%; max-height: 100%; object-fit: contain; }
+
+            @page { size: A4; margin: 1.5cm 1cm 2cm 1cm; }
+            @media print { 
+              body { -webkit-print-color-adjust: exact; } 
+            }
+          </style>
+        </head>
+        <body>
+          ${settings.showWatermark && logo && showWatermark ? `<div class="watermark"><img src="${logo}" /></div>` : ""}
+
+          <div class="row">
+            <div class="col-left">
+              ${logo ? `<img src="${logo}" class="logo-img" />` : ""}
+              ${!logo ? `<div class="company-header">${cName}</div>` : ""}
+              <div class="address-block">
+                <strong>${cName}</strong><br>
+                ${cAddress}<br>
+                ${cCity} ${cCode}<br>
+                ${cProv}
+              </div>
+              ${settings.showTaxNumber && cVat ? `<div class="reg-info">VAT No.: ${cVat}</div>` : ""}
+              <div class="contact-info">
+                ${settings.showPhone && cPhone ? `${cPhone}<br>` : ""}
+                ${settings.showPhone && cPhone2 ? `${cPhone2}<br>` : ""}
+                ${settings.showEmail && cEmail ? `${cEmail}<br>` : ""}
+                ${settings.showWebsite && cWeb ? `${cWeb}` : ""}
+              </div>
+              ${settings.showBarcode && barcodeDataUrl || settings.showQRCode && qrDataUrl ? `
+                  <div style="display: flex; gap: 12px; align-items: flex-start; margin-top: 10px;">
+                    ${settings.showBarcode && barcodeDataUrl ? `<img src="${barcodeDataUrl}" style="height: 42px; flex-shrink: 0;" />` : ""}
+                    ${settings.showQRCode && qrDataUrl ? `<img src="${qrDataUrl}" style="width: 75px; height: 75px; flex-shrink: 0;" />` : ""}
+                  </div>` : ""}
+            </div>
+            <div class="col-right">
+              <div class="quote-title-main">INVOICE</div>
+              <table class="details-table">
+                <tr><td class="label-cell">Invoice No.:</td><td class="value-cell">${invoice.invoiceNumber}</td></tr>
+                <tr><td class="label-cell">Date:</td><td class="value-cell">${issueDate}</td></tr>
+                <tr><td class="label-cell">Due Date:</td><td class="value-cell">${dueDate}</td></tr>
+                ${settings.showPreparedBy && (invoice.creator?.name || invoice.createdBy) ? `<tr><td class="label-cell">Prepared by:</td><td class="value-cell">${invoice.creator?.name || invoice.createdBy}</td></tr>` : ""}
+                ${settings.showLastUpdatedBy && invoice.lastUpdatedBy?.name ? `<tr><td class="label-cell">Last updated by:</td><td class="value-cell">${invoice.lastUpdatedBy.name}</td></tr>` : ""}
+              </table>
+              ${renderContactBox({
+      label: "BILL TO",
+      name: getClientDisplayName(invoice.client),
+      fullName: clientInfo.companyFullName || "",
+      taxNumber: clientInfo.vatNumber || clientInfo.taxNumber || "",
+      registrationNumber: clientInfo.registrationNumber || "",
+      address: clientInfo.address || "",
+      city: clientInfo.town ? clientInfo.town + (clientInfo.village ? " " + clientInfo.village : "") : clientInfo.village || "",
+      postalCode: clientInfo.postalCode || "",
+      province: clientInfo.province || "South Africa",
+      phone: clientInfo.phone || "",
+      email: clientInfo.email || "",
+      website: clientInfo.website || ""
+    })}
+            </div>
+          </div>
+
+          <!-- Salutation -->
+          ${invoice.salutation ? `<div style="margin-top: 20px; margin-bottom: 20px; font-size: 13px; white-space: pre-wrap; color: ${template.textMuted};">${invoice.salutation}</div>` : ""}
+
+          <table class="items-table">
+            <thead>
+              <tr>
+                <th class="col-desc">DESCRIPTION</th>
+                <th class="col-qty">QTY</th>
+                <th class="col-unit-price">UNIT PRICE (R)</th>
+                <th class="col-line-price">PRICE (R)</th>
+                <th class="col-disc">DISC</th>
+                <th class="col-vat">VAT (R)</th>
+                <th class="col-total">TOTAL (R)</th>
+              </tr>
+            </thead>
+            <tbody>
+              ${tableRows.join("")}
+            </tbody>
+          </table>
+
+          <div class="totals-wrapper">
+            <table class="totals-table">
+              ${totalDiscountDisplay > 0 ? `<tr><td class="label-cell" style="color: ${colorRed}">TOTAL DISCOUNT ${invoice.discountType === "PERCENTAGE" ? `(${this.decimalToNumber(invoice.discountAmount)}%)` : ""}:</td><td class="text-right" style="color: ${colorRed}">-R${this.formatMoney(totalDiscountDisplay)}</td></tr>` : ""}
+              <tr><td class="label-cell">SUBTOTAL (NET):</td><td class="text-right">R${this.formatMoney(finalSubtotalExVat)}</td></tr>
+              <tr><td class="label-cell" style="color: #7c3aed;">VAT 15%:</td><td class="text-right" style="color: #7c3aed;">R${this.formatMoney(finalVat)}</td></tr>
+              ${interestAmount > 0 ? `<tr><td class="label-cell" style="color: #ea580c">INTEREST (${this.decimalToNumber(invoice.interestRate)}%):</td><td class="text-right" style="color: #ea580c">+ R${this.formatMoney(interestAmount)}</td></tr>` : ""}
+              <tr style="border-top: 2px solid ${template.totalsBorder}; color: ${template.totalsBorder};">
+                <td class="label-cell" style="font-size: 11px;">GRAND TOTAL:</td>
+                <td class="text-right" style="font-size: 11px;">R${this.formatMoney(finalTotal)}</td>
+              </tr>
+              ${totalPaid > 0 ? `
+              <tr><td class="label-cell" style="color: ${colorGold}">PAID:</td><td class="text-right" style="color: ${colorGold}">R${this.formatMoney(totalPaid)}</td></tr>
+              <tr><td class="label-cell" style="color: ${colorRed}">BALANCE DUE:</td><td class="text-right" style="color: ${colorRed}">R${this.formatMoney(balanceDue)}</td></tr>` : `
+              <tr><td class="label-cell" style="color: ${colorRed}">BALANCE DUE:</td><td class="text-right" style="color: ${colorRed}">R${this.formatMoney(balanceDue)}</td></tr>`}
+              ${estMonthlyPayment > 0 ? `
+                <tr style="background-color: #fff7ed;">
+                  <td class="label-cell" style="color: #c2410c; font-size: 11px;">EST. MONTHLY PMT (${months} ${months === 1 ? "MONTH" : "MONTHS"}):</td>
+                  <td class="text-right" style="color: #c2410c; font-size: 11px;">R${this.formatMoney(estMonthlyPayment)}</td>
+                </tr>` : ""}
+            </table>
+          </div>
+
+          ${settings.showDescription && hasVisibleText(invoice.description) || settings.showPaymentTerms && hasVisibleText(invoice.paymentTerms) || settings.showAdditionalNotes && hasVisibleText(invoice.notes) ? `
+          <div class="terms-section" style="margin-top: 30px; border-top: 1px ${template.dividerStyle} ${template.borderFaint}; padding-top: 20px;">
+            ${settings.showDescription && hasVisibleText(invoice.description) ? `
+              <div style="margin-bottom: 15px;">
+                <div style="font-weight: 800; font-size: 11px; text-transform: uppercase; color: ${template.text}; margin-bottom: 4px; border-bottom: 1px ${template.dividerStyle} ${template.border}; width: fit-content; padding-right: 10px;">Description</div>
+                <div class="rich-text-content">${invoice.description}</div>
+              </div>` : ""}
+            ${settings.showPaymentTerms && hasVisibleText(invoice.paymentTerms) ? `
+              <div style="margin-bottom: 15px;">
+                <div style="font-weight: 800; font-size: 11px; text-transform: uppercase; color: ${template.text}; margin-bottom: 4px; border-bottom: 1px ${template.dividerStyle} ${template.border}; width: fit-content; padding-right: 10px;">Payment Terms</div>
+                <div class="rich-text-content">${invoice.paymentTerms}</div>
+              </div>` : ""}
+            ${settings.showAdditionalNotes && hasVisibleText(invoice.notes) ? `
+              <div style="margin-bottom: 15px;">
+                <div style="font-weight: 800; font-size: 11px; text-transform: uppercase; color: ${template.text}; margin-bottom: 4px; border-bottom: 1px ${template.dividerStyle} ${template.border}; width: fit-content; padding-right: 10px;">Additional Notes</div>
+                <div class="rich-text-content">${invoice.notes}</div>
+              </div>` : ""}
+          </div>` : ""}
+
+          ${settings.showBankDetails ? `
+          <div class="footer-strip">
+            Account holder: ${companyInfo?.companyName || ""} &nbsp;&nbsp;
+            ${companyInfo?.bankName ? `Bank: ${companyInfo.bankName} Account No.: ${companyInfo.bankAccount || ""} &nbsp;&nbsp;` : ""}
+            ${companyInfo?.bankName2 ? `Bank: ${companyInfo.bankName2} Account No.: ${companyInfo.bankAccount2 || ""}` : ""}
+          </div>` : ""}
+
+          ${settings.showSignature && signature && showSignature ? `
+            <div style="margin-top: 50px; page-break-inside: avoid; width: fit-content; margin-left: auto;">
+              <div style="text-align: center;">
+                <div style="font-weight: bold; font-size: 11px; margin-bottom: 5px; color: ${template.textMuted}; text-transform: uppercase;">AUTHORIZED SIGNATURE</div>
+                <img src="${signature}" style="max-height: 70px; max-width: 200px; display: block; margin: 0 auto;" />
+                <div style="border-top: 1px solid ${template.text}; width: 220px; margin-top: 5px; margin-bottom: 3px;"></div>
+                <div style="font-size: 12px; font-weight: bold;">FOR ${(companyInfo?.companyName || "Company").toUpperCase()}</div>
+              </div>
+            </div>` : ""}
+        </body>
+      </html>
+    `;
+  }
+};
+async function generateInvoiceHTML(invoice, options) {
+  return InvoiceReportGenerator.generateInvoiceReportHTML(
+    invoice,
+    options?.companyInfo,
+    options?.combineServices ?? true,
+    options?.templateId,
+    options?.docSettings
+  );
+}
+
+// src/generators/quotation-generator.ts
+var QuotationReportGenerator = class {
+  static decimalToNumber(decimalValue) {
+    if (decimalValue === null || decimalValue === void 0) return 0;
+    if (typeof decimalValue === "number") return decimalValue;
+    if (typeof decimalValue === "string") return parseFloat(decimalValue) || 0;
+    if (decimalValue && typeof decimalValue === "object") {
+      return parseFloat(decimalValue.toString()) || 0;
+    }
+    return 0;
+  }
+  static formatMoney(amount) {
+    return amount.toLocaleString("en-ZA", {
+      minimumFractionDigits: 2,
+      maximumFractionDigits: 2
+    });
+  }
+  static async generateQuotationReportHTML(quotation, companyInfo, optionsOrCombineServices = true, legacyTemplateId, docSettings) {
+    let combineServices = true;
+    let hideItemPrices = false;
+    let templateId;
+    if (typeof optionsOrCombineServices === "boolean") {
+      combineServices = optionsOrCombineServices;
+      templateId = legacyTemplateId;
+    } else {
+      combineServices = optionsOrCombineServices.combineServices ?? true;
+      hideItemPrices = optionsOrCombineServices.hideItemPrices ?? false;
+      templateId = optionsOrCombineServices.templateId ?? legacyTemplateId;
+      docSettings = optionsOrCombineServices.docSettings ?? docSettings;
+    }
+    if (isClassicTemplate(templateId)) {
+      templateId = "classic";
+    }
+    const template = getA4Template(templateId);
+    const settings = docSettings ?? DEFAULT_DOCUMENT_TYPE_SETTINGS;
+    let barcodeDataUrl = null;
+    let qrDataUrl = null;
+    try {
+      if (settings.showBarcode && quotation.quotationNumber)
+        barcodeDataUrl = await generateBarcode(quotation.quotationNumber);
+    } catch {
+    }
+    try {
+      if (settings.showQRCode && quotation.quotationNumber)
+        qrDataUrl = await generateQRCode(quotation.quotationNumber);
+    } catch {
+    }
+    const classicMode = template.id === "classic";
+    const colorRed = classicMode ? "#A00000" : template.brand;
+    const colorGold = classicMode ? "#C5A005" : template.accent;
+    const headerGreenBg = classicMode ? "#D1FAE5" : template.headerBg;
+    const headerGreenText = classicMode ? "#065F46" : template.headerText;
+    const issueDate = quotation.issueDate || quotation.date || quotation.createdAt ? new Date(quotation.issueDate || quotation.date || quotation.createdAt).toLocaleDateString("en-GB") : "";
+    const validUntil = quotation.validUntil || quotation.dueDate ? new Date(quotation.validUntil || quotation.dueDate).toLocaleDateString("en-GB") : "";
+    const cName = companyInfo?.companyName || "";
+    const cAddress = companyInfo?.address || companyInfo?.Address || "";
+    const cCity = companyInfo?.city || "";
+    const cCode = companyInfo?.postCode || "";
+    const cProv = companyInfo?.province || "";
+    const cVat = companyInfo?.taxId || "";
+    const cPhone = companyInfo?.phone || "";
+    const cPhone2 = companyInfo?.phone2 || "";
+    const cEmail = companyInfo?.email || "";
+    const cWeb = companyInfo?.website || "";
+    const logo = companyInfo?.logo || "";
+    const showWatermark = companyInfo?.showWatermark !== false;
+    const showSignature = companyInfo?.showSignature !== false;
+    const signature = companyInfo?.signature || "";
+    const individualItems = [];
+    const serviceItemsForCombining = [];
+    let subtotalNet = 0;
+    let totalVat = 0;
+    (quotation.items || []).forEach((item) => {
+      const qty = this.decimalToNumber(item.quantity);
+      const unitPrice = this.decimalToNumber(item.unitPrice);
+      const taxRate = this.decimalToNumber(item.taxRate ?? 15);
+      const linePrice = qty * unitPrice;
+      const net = linePrice;
+      const vat = net * (taxRate / 100);
+      const total = net + vat;
+      subtotalNet += net;
+      totalVat += vat;
+      const itemData = {
+        description: item.description || "",
+        qty,
+        unitPrice,
+        linePrice,
+        discountInput: "0.00",
+        vat,
+        total,
+        details: item.details || null
+      };
+      const isService = item.type?.toLowerCase() === "service" || !!item.serviceId;
+      const isProduct = !isService && (!!item.shopProductId || item.type?.toLowerCase() === "product");
+      if (isService) {
+        if (combineServices) {
+          serviceItemsForCombining.push(itemData);
+        } else {
+          individualItems.push({
+            ...itemData,
+            itemCode: "SVC",
+            itemType: "service"
+          });
+        }
+      } else if (isProduct) {
+        individualItems.push({
+          ...itemData,
+          itemCode: "PRD",
+          itemType: "product"
+        });
+      } else {
+        individualItems.push({
+          ...itemData,
+          itemCode: "CST",
+          itemType: "custom"
+        });
+      }
+    });
+    let combinedServiceData = null;
+    if (combineServices && serviceItemsForCombining.length > 0) {
+      let totalQuantity = 0;
+      let totalLinePrice = 0;
+      let totalVatServices = 0;
+      let totalAmountServices = 0;
+      serviceItemsForCombining.forEach((service) => {
+        totalQuantity += service.qty;
+        totalLinePrice += service.linePrice;
+        totalVatServices += service.vat;
+        totalAmountServices += service.total;
+      });
+      const averageUnitPrice = totalQuantity > 0 ? totalLinePrice / totalQuantity : 0;
+      combinedServiceData = {
+        description: `Services Package (${serviceItemsForCombining.length} services)`,
+        quantity: totalQuantity,
+        unitPrice: averageUnitPrice,
+        linePrice: totalLinePrice,
+        vat: totalVatServices,
+        total: totalAmountServices,
+        individualServices: serviceItemsForCombining
+      };
+    }
+    let globalDiscVal = 0;
+    const globalDiscInput = this.decimalToNumber(quotation.discountAmount);
+    if (quotation.discountType === "PERCENTAGE") {
+      globalDiscVal = subtotalNet * (globalDiscInput / 100);
+    } else if (quotation.discountType === "AMOUNT") {
+      globalDiscVal = globalDiscInput;
+    }
+    const finalSubtotalExVat = subtotalNet - globalDiscVal;
+    const vatRatio = subtotalNet > 0 ? finalSubtotalExVat / subtotalNet : 1;
+    const finalVat = totalVat * vatRatio;
+    const totalBeforeInterest = finalSubtotalExVat + finalVat;
+    const interestAmount = this.decimalToNumber(quotation.interestAmount);
+    const finalTotal = totalBeforeInterest + interestAmount;
+    const renderItemDetails = (details) => {
+      if (!details) return "";
+      return `
+        <div class="rich-text-content" style="font-size: 10px; color: #666; margin-top: 2px; margin-left: 3px;">
+          ${details}
+        </div>
+      `;
+    };
+    const tableRows = [];
+    individualItems.forEach((item) => {
+      const detailsHtml = renderItemDetails(item.details);
+      const rowStyle = item.itemType === "custom" ? `background-color: ${template.rowAltBg};` : "";
+      tableRows.push(`
+        <tr style="${rowStyle}">
+          <td class="col-desc">
+            <strong>${item.description}</strong>
+            ${detailsHtml}
+          </td>
+          <td class="col-qty">${item.qty}</td>
+          ${hideItemPrices ? "" : `<td class="col-unit-price">${this.formatMoney(item.unitPrice)}</td>`}
+          ${hideItemPrices ? "" : `<td class="col-line-price">${this.formatMoney(item.linePrice)}</td>`}
+          <td class="col-vat">${this.formatMoney(item.vat)}</td>
+          <td class="col-total">${this.formatMoney(item.total)}</td>
+        </tr>
+      `);
+    });
+    if (combineServices && combinedServiceData) {
+      tableRows.push(`
+        <tr style="background-color: ${template.rowAltBg};">
+          <td class="col-desc">
+            <strong>${combinedServiceData.description}</strong>
+          </td>
+          <td class="col-qty">${combinedServiceData.quantity}</td>
+          ${hideItemPrices ? "" : `<td class="col-unit-price">-</td>`}
+          ${hideItemPrices ? "" : `<td class="col-line-price">${this.formatMoney(combinedServiceData.linePrice)}</td>`}
+          <td class="col-vat">${this.formatMoney(combinedServiceData.vat)}</td>
+          <td class="col-total"><strong>${this.formatMoney(combinedServiceData.total)}</strong></td>
+        </tr>
+      `);
+    }
+    const clientInfo = quotation.client || {};
+    return `
+      <!DOCTYPE html>
+      <html>
+        <head>
+          <title>Quotation ${quotation.quotationNumber}</title>
+          <style>
+            @import url('https://fonts.googleapis.com/css2?family=Arial:wght@400;700&display=swap');
+            body { font-family: ${template.fontFamily}; margin: 0; padding: 40px; font-size: ${template.fontSize}; color: ${template.text}; line-height: 1.3; }
+            .row { display: flex; width: 100%; gap: 20px; }
+            .col-left { width: 60%; }
+            .col-right { width: 40%; }
+            .logo-img { width: 180px; margin-bottom: 15px; }
+            .company-header { font-family: ${template.fontFamilyHeading}; font-size: 24px; font-weight: bold; color: ${classicMode ? "#d4af37" : template.accent}; margin-bottom: 5px; }
+            .quote-title-main { font-family: ${template.fontFamilyHeading}; font-size: 26px; color: ${colorRed}; font-weight: bold; text-align: ${template.titleAlign}; margin-bottom: 15px; }
+            
+            .details-table { width: 100%; border-collapse: collapse; margin-bottom: 15px; }
+            .details-table td { border: none; padding: 4px 8px; font-weight: bold; }
+            .label-cell { width: 40%; text-align: left; color: ${template.textMuted}; }
+            .value-cell { width: 60%; text-align: right; }
+
+            .client-box-label { font-weight: bold; margin-bottom: 2px; color: ${template.textMuted}; }
+            .client-box { border: 1px solid ${template.border}; border-radius: ${template.borderRadius}; padding: 10px; min-height: 80px; background-color: ${template.surface}; }
+            .client-name { font-weight: bold; font-size: 13px; margin-bottom: 4px; }
+
+            .items-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
+            .items-table thead { display: table-header-group; }
+            .items-table tr { page-break-inside: avoid; page-break-after: auto; }
+            .items-table th { border: none; padding: 8px 6px; background-color: ${headerGreenBg}; color: ${headerGreenText}; font-weight: bold; text-align: center; font-size: 11px; text-transform: uppercase; }
+            .items-table td { border: none; border-bottom: 1px solid ${template.borderFaint}; padding: 8px 6px; vertical-align: top; font-size: 11px; word-wrap: break-word; overflow-wrap: anywhere; }
+
+            .rich-text-content { overflow-wrap: anywhere; word-break: break-word; color: ${template.text}; font-size: 10px; line-height: 1.3; }
+            .col-desc { width: ${hideItemPrices ? "50%" : "35%"}; text-align: left; }
+            .col-qty { width: 10%; text-align: center; }
+            .col-unit-price { width: 15%; text-align: right; }
+            .col-line-price { width: 15%; text-align: right; }
+            .col-vat { width: 12%; text-align: right; }
+            .col-total { width: 13%; text-align: right; }
+
+            .totals-wrapper { display: flex; justify-content: flex-end; margin-top: 20px; page-break-inside: avoid; }
+            .totals-table { width: 300px; border-collapse: collapse; background-color: ${template.totalsBg}; border-radius: ${template.borderRadius}; overflow: hidden; }
+            .totals-table td { border: none; padding: 6px 8px; font-weight: bold; font-size: 11px; }
+            .text-right { text-align: right; }
+
+            .terms-section { margin-top: 60px; page-break-inside: avoid; }
+            .footer-strip { margin-top: 40px; border-top: 1px solid ${template.borderFaint}; padding: 10px 5px; text-align: center; font-size: 11px; font-weight: bold; color: ${template.textMuted}; page-break-inside: avoid; }
+              
+            /* Watermark */
+            .watermark {
+              position: fixed;
+              top: 50%;
+              left: 50%;
+              transform: translate(-50%, -50%) rotate(-30deg);
+              width: 600px;
+              height: 600px;
+              opacity: 0.05;
+              z-index: -100;
+              display: flex;
+              align-items: center;
+              justify-content: center;
+              pointer-events: none;
+            }
+            .watermark img { max-width: 100%; max-height: 100%; object-fit: contain; }
+
+            @page { size: A4; margin: 1.5cm 1cm 2cm 1cm; }
+            @media print { body { -webkit-print-color-adjust: exact; } }
+          </style>
+        </head>
+        <body>
+          ${settings.showWatermark && logo && showWatermark ? `<div class="watermark"><img src="${logo}" /></div>` : ""}
+
+          <div class="row">
+            <div class="col-left">
+              ${logo ? `<img src="${logo}" class="logo-img" />` : ""}
+              ${!logo ? `<div class="company-header">${cName}</div>` : ""}
+              <div class="address-block">
+                <strong>${cName}</strong><br>
+                ${cAddress}<br>
+                ${cCity} ${cCode}<br>
+                ${cProv}
+              </div>
+              ${settings.showTaxNumber && cVat ? `<div class="reg-info">VAT No.: ${cVat}</div>` : ""}
+              <div class="contact-info">
+                ${settings.showPhone && cPhone ? `${cPhone}<br>` : ""}
+                ${settings.showPhone && cPhone2 ? `${cPhone2}<br>` : ""}
+                ${settings.showEmail && cEmail ? `${cEmail}<br>` : ""}
+                ${settings.showWebsite && cWeb ? `${cWeb}` : ""}
+              </div>
+              ${settings.showBarcode && barcodeDataUrl || settings.showQRCode && qrDataUrl ? `
+                  <div style="display: flex; gap: 12px; align-items: flex-start; margin-top: 10px;">
+                    ${settings.showBarcode && barcodeDataUrl ? `<img src="${barcodeDataUrl}" style="height: 42px; flex-shrink: 0;" />` : ""}
+                    ${settings.showQRCode && qrDataUrl ? `<img src="${qrDataUrl}" style="width: 75px; height: 75px; flex-shrink: 0;" />` : ""}
+                  </div>` : ""}
+            </div>
+            <div class="col-right">
+              <div class="quote-title-main">QUOTATION</div>
+              <table class="details-table">
+                <tr><td class="label-cell">Quote No.:</td><td class="value-cell">${quotation.quotationNumber}</td></tr>
+                <tr><td class="label-cell">Date:</td><td class="value-cell">${issueDate}</td></tr>
+                <tr><td class="label-cell">Valid Until:</td><td class="value-cell">${validUntil}</td></tr>
+                ${settings.showPreparedBy && quotation.creator?.name ? `<tr><td class="label-cell">Prepared by:</td><td class="value-cell">${quotation.creator.name}</td></tr>` : ""}
+              </table>
+              ${renderContactBox({
+      label: "FOR",
+      name: getClientDisplayName(quotation.client),
+      fullName: clientInfo.companyFullName || "",
+      taxNumber: clientInfo.vatNumber || clientInfo.taxNumber || "",
+      registrationNumber: clientInfo.registrationNumber || "",
+      address: clientInfo.address || "",
+      city: clientInfo.town ? clientInfo.town + (clientInfo.village ? " " + clientInfo.village : "") : clientInfo.village || "",
+      postalCode: clientInfo.postalCode || "",
+      province: clientInfo.province || "South Africa",
+      phone: clientInfo.phone || "",
+      email: clientInfo.email || "",
+      website: clientInfo.website || ""
+    })}
+            </div>
+          </div>
+
+          <table class="items-table" style="margin-top: 20px;">
+            <thead>
+              <tr>
+                <th class="col-desc">DESCRIPTION</th>
+                <th class="col-qty">QTY</th>
+                ${hideItemPrices ? "" : `<th class="col-unit-price">UNIT PRICE (R)</th>`}
+                ${hideItemPrices ? "" : `<th class="col-line-price">PRICE (R)</th>`}
+                <th class="col-vat">VAT (R)</th>
+                <th class="col-total">TOTAL (R)</th>
+              </tr>
+            </thead>
+            <tbody>
+              ${tableRows.join("")}
+            </tbody>
+          </table>
+
+          <div class="totals-wrapper">
+            <table class="totals-table">
+              <tr><td class="label-cell">SUBTOTAL (NET):</td><td class="text-right">R${this.formatMoney(finalSubtotalExVat)}</td></tr>
+              <tr><td class="label-cell" style="color: #7c3aed;">VAT 15%:</td><td class="text-right" style="color: #7c3aed;">R${this.formatMoney(finalVat)}</td></tr>
+              <tr style="border-top: 2px solid ${template.totalsBorder}; color: ${template.totalsBorder};">
+                <td class="label-cell" style="font-size: 11px;">GRAND TOTAL:</td>
+                <td class="text-right" style="font-size: 11px;">R${this.formatMoney(finalTotal)}</td>
+              </tr>
+              ${quotation.depositRequired ? `
+              <tr>
+                <td class="label-cell" style="color: ${colorRed}">DEPOSIT REQUIRED:</td>
+                <td class="text-right" style="color: ${colorRed}">R${this.formatMoney(this.decimalToNumber(quotation.depositAmount))}</td>
+              </tr>` : ""}
+            </table>
+          </div>
+
+          ${settings.showPaymentTerms && hasVisibleText(quotation.terms) || settings.showAdditionalNotes && hasVisibleText(quotation.notes) ? `
+          <div class="terms-section" style="margin-top: 30px; border-top: 1px ${template.dividerStyle} ${template.borderFaint}; padding-top: 20px;">
+            ${settings.showPaymentTerms && hasVisibleText(quotation.terms) ? `
+              <div style="margin-bottom: 15px;">
+                <div style="font-weight: 800; font-size: 11px; text-transform: uppercase; color: ${template.text}; margin-bottom: 4px; border-bottom: 1px ${template.dividerStyle} ${template.border}; width: fit-content; padding-right: 10px;">Terms & Conditions</div>
+                <div class="rich-text-content">${quotation.terms}</div>
+              </div>` : ""}
+            ${settings.showAdditionalNotes && hasVisibleText(quotation.notes) ? `
+              <div style="margin-bottom: 15px;">
+                <div style="font-weight: 800; font-size: 11px; text-transform: uppercase; color: ${template.text}; margin-bottom: 4px; border-bottom: 1px ${template.dividerStyle} ${template.border}; width: fit-content; padding-right: 10px;">Notes</div>
+                <div class="rich-text-content">${quotation.notes}</div>
+              </div>` : ""}
+          </div>` : ""}
+
+          ${settings.showBankDetails ? `
+          <div class="footer-strip">
+            Account holder: ${companyInfo?.companyName || ""} &nbsp;&nbsp;
+            ${companyInfo?.bankName ? `Bank: ${companyInfo.bankName} Account No.: ${companyInfo.bankAccount || ""} &nbsp;&nbsp;` : ""}
+            ${companyInfo?.bankName2 ? `Bank: ${companyInfo.bankName2} Account No.: ${companyInfo.bankAccount2 || ""}` : ""}
+          </div>` : ""}
+
+          ${settings.showSignature && signature && showSignature ? `
+            <div style="margin-top: 50px; page-break-inside: avoid; width: fit-content; margin-left: auto;">
+              <div style="text-align: center;">
+                <div style="font-weight: bold; font-size: 11px; margin-bottom: 5px; color: ${template.textMuted}; text-transform: uppercase;">AUTHORIZED SIGNATURE</div>
+                <img src="${signature}" style="max-height: 70px; max-width: 200px; display: block; margin: 0 auto;" />
+                <div style="border-top: 1px solid ${template.text}; width: 220px; margin-top: 5px; margin-bottom: 3px;"></div>
+                <div style="font-size: 12px; font-weight: bold;">FOR ${(companyInfo?.companyName || "Company").toUpperCase()}</div>
+              </div>
+            </div>` : ""}
+        </body>
+      </html>
+    `;
+  }
+};
+async function generateQuotationHTML(quotation, options) {
+  return QuotationReportGenerator.generateQuotationReportHTML(
+    quotation,
+    options?.companyInfo,
+    options ?? true,
+    options?.templateId,
+    options?.docSettings
+  );
+}
+
+// src/generators/receipt-generator.ts
+var ReceiptGenerator = class {
+  companyInfo = DEFAULT_RECEIPT_COMPANY_INFO;
+  DEFAULT_TAX_RATE = DEFAULT_TAX_RATE;
+  constructor(companyInfo) {
+    if (companyInfo) {
+      this.companyInfo = { ...DEFAULT_RECEIPT_COMPANY_INFO, ...companyInfo };
+    }
+  }
+  setCompanyInfo(companyInfo) {
+    if (!companyInfo) return;
+    if ("companyName" in companyInfo) {
+      this.companyInfo = {
+        name: companyInfo.companyName || "Your Company",
+        address: [companyInfo.address || companyInfo.Address, companyInfo.city, companyInfo.province, companyInfo.postCode].filter(Boolean).join(", "),
+        phone: companyInfo.phone || "(123) 456-7890",
+        email: companyInfo.email || "info@company.com",
+        taxNumber: companyInfo.taxId,
+        logo: companyInfo.logo,
+        terminalLogo: companyInfo.terminalLogo,
+        signature: companyInfo.signature,
+        showWatermark: companyInfo.showWatermark !== false,
+        showSignature: companyInfo.showSignature !== false
+      };
+    } else {
+      this.companyInfo = { ...this.companyInfo, ...companyInfo };
+    }
+  }
+  setTerminalLogo(logoUrl) {
+    this.companyInfo.terminalLogo = logoUrl;
+  }
+  formatNumber(value, decimals = 2) {
+    const num = typeof value === "string" ? parseFloat(value) : Number(value);
+    return isNaN(num) ? "0.00" : num.toFixed(decimals);
+  }
+  formatDate(dateString) {
+    try {
+      const date = new Date(dateString);
+      if (isNaN(date.getTime())) return (/* @__PURE__ */ new Date()).toLocaleString();
+      return date.toLocaleString();
+    } catch {
+      return (/* @__PURE__ */ new Date()).toLocaleString();
+    }
+  }
+  getItemName(item) {
+    return item.product?.name || "Product";
+  }
+  getItemSKU(item) {
+    return item.product?.sku || "N/A";
+  }
+  async generateReceiptHTML(saleData, size = "thermal", forPrint = false) {
+    const processedSaleData = {
+      ...saleData,
+      company: {
+        ...this.companyInfo,
+        ...saleData.company || {}
+      }
+    };
+    if (size === "A4") {
+      return this.generateA4ReceiptHTML(processedSaleData, forPrint);
+    } else {
+      return this.generateThermalReceiptHTML(processedSaleData, forPrint);
+    }
+  }
+  generateA4ReceiptHTML(saleData, forPrint = false) {
+    const company = saleData.company || this.companyInfo;
+    const subtotal = this.formatNumber(saleData.subtotal);
+    const discount = this.formatNumber(saleData.discount);
+    const tax = this.formatNumber(saleData.tax);
+    const total = this.formatNumber(saleData.total);
+    const amountReceived = saleData.amountReceived ? this.formatNumber(saleData.amountReceived) : null;
+    const change = saleData.change ? this.formatNumber(saleData.change) : null;
+    const itemsRows = saleData.items.map(
+      (item) => `
+        <tr>
+          <td style="padding: 10px; border-bottom: 1px solid #e2e8f0;">
+            <div style="font-weight: 600; color: #1e293b;">${this.getItemName(item)}</div>
+            <div style="font-size: 11px; color: #64748b;">SKU: ${this.getItemSKU(item)}</div>
+          </td>
+          <td style="padding: 10px; border-bottom: 1px solid #e2e8f0; text-align: center;">${item.quantity}</td>
+          <td style="padding: 10px; border-bottom: 1px solid #e2e8f0; text-align: right;">R${this.formatNumber(item.price)}</td>
+          <td style="padding: 10px; border-bottom: 1px solid #e2e8f0; text-align: right; font-weight: 600;">R${this.formatNumber(item.total)}</td>
+        </tr>`
+    ).join("");
+    return `
+      <!DOCTYPE html>
+      <html>
+        <head>
+          <meta charset="utf-8">
+          <title>Receipt #${saleData.saleNumber}</title>
+          <style>
+            body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; margin: 0; padding: 40px; color: #0f172a; font-size: 13px; line-height: 1.4; }
+            .container { max-width: 800px; margin: 0 auto; }
+            .header { display: flex; justify-content: space-between; border-bottom: 2px solid #0f172a; padding-bottom: 20px; margin-bottom: 24px; }
+            .title { font-size: 28px; font-weight: 800; color: #0f172a; margin: 0; }
+            .badge { display: inline-block; padding: 4px 10px; border-radius: 9999px; background: #dcfce7; color: #166534; font-size: 11px; font-weight: 700; margin-top: 6px; }
+            table { width: 100%; border-collapse: collapse; margin-top: 16px; }
+            th { background: #f8fafc; padding: 10px; text-align: left; font-size: 11px; text-transform: uppercase; color: #475569; border-bottom: 1px solid #cbd5e1; }
+            .totals { width: 320px; margin-left: auto; margin-top: 24px; }
+            .total-row { display: flex; justify-content: space-between; padding: 6px 0; }
+            .grand-total { font-size: 16px; font-weight: 800; border-top: 2px solid #0f172a; padding-top: 8px; margin-top: 4px; }
+            @media print { body { padding: 0; } }
+          </style>
+          ${forPrint ? `<script>window.onload = function() { window.print(); }</script>` : ""}
+        </head>
+        <body>
+          <div class="container">
+            <div class="header">
+              <div>
+                <h1 class="title">${company.name}</h1>
+                <div style="color: #475569; margin-top: 6px;">${company.address}</div>
+                <div style="color: #475569;">Tel: ${company.phone} \xB7 Email: ${company.email}</div>
+                ${company.taxNumber ? `<div style="color: #475569;">VAT No: ${company.taxNumber}</div>` : ""}
+              </div>
+              <div style="text-align: right;">
+                <div style="font-size: 22px; font-weight: 700;">TAX RECEIPT</div>
+                <div style="color: #64748b; font-size: 12px; margin-top: 4px;">Receipt #${saleData.saleNumber}</div>
+                <div style="color: #64748b; font-size: 12px;">Date: ${this.formatDate(saleData.date)}</div>
+                <div class="badge">PAID</div>
+              </div>
+            </div>
+
+            ${saleData.customerName ? `
+            <div style="background: #f8fafc; padding: 12px 16px; border-radius: 8px; margin-bottom: 20px;">
+              <div style="font-size: 11px; font-weight: 700; color: #64748b; text-transform: uppercase;">Customer</div>
+              <div style="font-weight: 600; margin-top: 2px;">${saleData.customerName}</div>
+              ${saleData.customerPhone ? `<div style="font-size: 12px; color: #475569;">${saleData.customerPhone}</div>` : ""}
+              ${saleData.customerEmail ? `<div style="font-size: 12px; color: #475569;">${saleData.customerEmail}</div>` : ""}
+            </div>` : ""}
+
+            <table>
+              <thead>
+                <tr>
+                  <th>Item</th>
+                  <th style="text-align: center;">Qty</th>
+                  <th style="text-align: right;">Unit Price</th>
+                  <th style="text-align: right;">Total</th>
+                </tr>
+              </thead>
+              <tbody>
+                ${itemsRows}
+              </tbody>
+            </table>
+
+            <div class="totals">
+              <div class="total-row"><span>Subtotal (Net)</span><span>R${subtotal}</span></div>
+              ${saleData.discount > 0 ? `<div class="total-row" style="color: #dc2626;"><span>Discount</span><span>-R${discount}</span></div>` : ""}
+              <div class="total-row"><span>VAT (15%)</span><span>R${tax}</span></div>
+              <div class="total-row grand-total"><span>Total</span><span>R${total}</span></div>
+              <div class="total-row" style="color: #64748b; font-size: 11px; margin-top: 8px;">
+                <span>Payment Method</span><span>${saleData.paymentMethod.toUpperCase()}</span>
+              </div>
+              ${amountReceived ? `<div class="total-row" style="color: #64748b; font-size: 11px;"><span>Amount Tendered</span><span>R${amountReceived}</span></div>` : ""}
+              ${change ? `<div class="total-row" style="color: #64748b; font-size: 11px;"><span>Change</span><span>R${change}</span></div>` : ""}
+            </div>
+
+            <div style="text-align: center; margin-top: 60px; padding-top: 20px; border-top: 1px solid #e2e8f0; color: #64748b; font-size: 12px;">
+              Thank you for your business!
+            </div>
+          </div>
+        </body>
+      </html>
+    `;
+  }
+  generateThermalReceiptHTML(saleData, forPrint = false) {
+    const company = saleData.company || this.companyInfo;
+    const subtotal = this.formatNumber(saleData.subtotal);
+    const discount = this.formatNumber(saleData.discount);
+    const tax = this.formatNumber(saleData.tax);
+    const total = this.formatNumber(saleData.total);
+    const itemsRows = saleData.items.map(
+      (item) => `
+        <div style="display: flex; justify-content: space-between; margin-bottom: 4px; font-size: 12px;">
+          <div style="flex: 1; padding-right: 8px;">
+            <div>${this.getItemName(item)}</div>
+            <div style="font-size: 10px; color: #555;">${item.quantity} x R${this.formatNumber(item.price)}</div>
+          </div>
+          <div style="font-weight: 700;">R${this.formatNumber(item.total)}</div>
+        </div>`
+    ).join("");
+    return `
+      <!DOCTYPE html>
+      <html>
+        <head>
+          <meta charset="utf-8">
+          <title>Receipt #${saleData.saleNumber}</title>
+          <style>
+            @page { size: 80mm auto; margin: 0; }
+            body { font-family: 'Courier New', monospace; width: 72mm; margin: 0 auto; padding: 4mm 2mm; color: #000; font-size: 12px; line-height: 1.3; }
+            .center { text-align: center; }
+            .divider { border-top: 1px dashed #000; margin: 8px 0; }
+            .double-divider { border-top: 2px solid #000; margin: 8px 0; }
+            .row { display: flex; justify-content: space-between; margin: 3px 0; }
+            .bold { font-weight: 700; }
+            @media print { body { width: 72mm; margin: 0; } }
+          </style>
+          ${forPrint ? `<script>window.onload = function() { window.print(); }</script>` : ""}
+        </head>
+        <body>
+          <div class="center">
+            <div style="font-size: 15px; font-weight: 900; text-transform: uppercase;">${company.name}</div>
+            <div style="font-size: 11px;">${company.address}</div>
+            <div style="font-size: 11px;">Tel: ${company.phone}</div>
+            ${company.taxNumber ? `<div style="font-size: 11px;">VAT No: ${company.taxNumber}</div>` : ""}
+          </div>
+
+          <div class="divider"></div>
+
+          <div class="row"><span>Receipt #:</span><span class="bold">${saleData.saleNumber}</span></div>
+          <div class="row"><span>Date:</span><span>${this.formatDate(saleData.date)}</span></div>
+          ${saleData.customerName ? `<div class="row"><span>Customer:</span><span>${saleData.customerName}</span></div>` : ""}
+
+          <div class="double-divider"></div>
+
+          ${itemsRows}
+
+          <div class="double-divider"></div>
+
+          <div class="row"><span>Subtotal:</span><span>R${subtotal}</span></div>
+          ${saleData.discount > 0 ? `<div class="row"><span>Discount:</span><span>-R${discount}</span></div>` : ""}
+          <div class="row"><span>VAT (15%):</span><span>R${tax}</span></div>
+          <div class="row bold" style="font-size: 14px; margin-top: 4px;"><span>TOTAL:</span><span>R${total}</span></div>
+          
+          <div class="divider"></div>
+          <div class="row"><span>Payment:</span><span>${saleData.paymentMethod.toUpperCase()}</span></div>
+
+          <div class="divider"></div>
+          <div class="center" style="font-size: 11px; margin-top: 8px;">
+            Thank you for your business!<br>
+            Please keep receipt for returns.
+          </div>
+        </body>
+      </html>
+    `;
+  }
+};
+var receiptGenerator = new ReceiptGenerator();
+
+// src/generators/delivery-note-generator.ts
+var DeliveryNoteGenerator = class {
+  static async generateDeliveryNoteHTML(deliveryNote, companyInfo, templateId, docSettings) {
+    if (isClassicTemplate(templateId)) {
+      templateId = "classic";
+    }
+    const template = getA4Template(templateId);
+    const settings = docSettings ?? DEFAULT_DOCUMENT_TYPE_SETTINGS;
+    const barcodeDataUrl = settings.showBarcode && deliveryNote.deliveryNoteNumber ? await generateBarcode(deliveryNote.deliveryNoteNumber) : null;
+    const qrDataUrl = settings.showQRCode && deliveryNote.deliveryNoteNumber ? await generateQRCode(deliveryNote.deliveryNoteNumber) : null;
+    const companyName = companyInfo?.companyName || "Your Company";
+    const companyAddress = companyInfo?.address || companyInfo?.Address || "";
+    const companyCity = companyInfo?.city || "";
+    const companyProvince = companyInfo?.province || "";
+    const companyPostCode = companyInfo?.postCode || "";
+    const companyPhone = companyInfo?.phone || "";
+    const companyEmail = companyInfo?.email || "";
+    const logo = companyInfo?.logo || "";
+    const client = deliveryNote.client || {};
+    const itemsRows = (deliveryNote.items || []).map(
+      (item) => `
+        <tr>
+          <td style="padding: 10px; border-bottom: 1px solid ${template.borderFaint};">
+            <strong>${item.description}</strong>
+            ${item.details ? `<div style="font-size: 10px; color: ${template.textMuted}; margin-top: 2px;">${item.details}</div>` : ""}
+          </td>
+          <td style="padding: 10px; border-bottom: 1px solid ${template.borderFaint}; text-align: center;">${item.quantity}</td>
+          ${item.unitPrice !== void 0 ? `<td style="padding: 10px; border-bottom: 1px solid ${template.borderFaint}; text-align: right;">${formatCurrency(item.unitPrice)}</td>` : ""}
+          ${item.amount !== void 0 ? `<td style="padding: 10px; border-bottom: 1px solid ${template.borderFaint}; text-align: right; font-weight: 600;">${formatCurrency(item.amount)}</td>` : ""}
+        </tr>`
+    ).join("");
+    return `
+      <!DOCTYPE html>
+      <html>
+        <head>
+          <meta charset="utf-8">
+          <title>Delivery Note #${deliveryNote.deliveryNoteNumber}</title>
+          <style>
+            body { font-family: ${template.fontFamily}; margin: 0; padding: 40px; color: ${template.text}; font-size: ${template.fontSize}; line-height: 1.4; }
+            .header { display: flex; justify-content: space-between; border-bottom: 2px solid ${template.primary}; padding-bottom: 20px; margin-bottom: 24px; }
+            .title { font-size: 26px; font-weight: 800; color: ${template.primary}; margin: 0; }
+            table { width: 100%; border-collapse: collapse; margin-top: 20px; }
+            th { background: ${template.headerBg}; color: ${template.headerText || template.primary}; padding: 10px; text-align: left; font-size: 11px; text-transform: uppercase; border-bottom: 1px solid ${template.border}; }
+            .grid { display: flex; gap: 24px; margin-bottom: 24px; }
+            .card { flex: 1; border: 1px solid ${template.border}; border-radius: ${template.borderRadius}; padding: 16px; background: ${template.surface}; }
+            .card-title { font-size: 11px; font-weight: 700; color: ${template.textMuted}; text-transform: uppercase; margin-bottom: 8px; border-bottom: 1px solid ${template.borderFaint}; padding-bottom: 4px; }
+            @page { size: A4; margin: 1.5cm 1cm 2cm 1cm; }
+            @media print { body { padding: 0; } }
+          </style>
+        </head>
+        <body>
+          <div class="header">
+            <div>
+              ${logo ? `<img src="${logo}" style="height: 50px; margin-bottom: 10px; display: block;" />` : ""}
+              <div style="font-size: 18px; font-weight: 700;">${companyName}</div>
+              <div style="color: ${template.textMuted}; font-size: 11px;">
+                ${companyAddress ? `${companyAddress}<br>` : ""}
+                ${companyCity} ${companyProvince} ${companyPostCode}<br>
+                ${companyPhone ? `Tel: ${companyPhone} \xB7 ` : ""}${companyEmail}
+              </div>
+            </div>
+            <div style="text-align: right;">
+              <h1 class="title">DELIVERY NOTE</h1>
+              <div style="font-size: 12px; margin-top: 6px;">Note #: <strong>${deliveryNote.deliveryNoteNumber}</strong></div>
+              <div style="font-size: 12px; color: ${template.textMuted};">Date: ${new Date(deliveryNote.date).toLocaleDateString("en-GB")}</div>
+              ${deliveryNote.referenceNumber ? `<div style="font-size: 11px; color: ${template.textMuted};">Ref: ${deliveryNote.referenceNumber}</div>` : ""}
+              ${barcodeDataUrl || qrDataUrl ? `
+                <div style="display: flex; gap: 10px; justify-content: flex-end; margin-top: 10px;">
+                  ${barcodeDataUrl ? `<img src="${barcodeDataUrl}" style="height: 38px;" />` : ""}
+                  ${qrDataUrl ? `<img src="${qrDataUrl}" style="width: 60px; height: 60px;" />` : ""}
+                </div>` : ""}
+            </div>
+          </div>
+
+          <div class="grid">
+            <div class="card">
+              <div class="card-title">Delivered To</div>
+              <div style="font-weight: 700; font-size: 13px;">${getClientDisplayName(client)}</div>
+              ${client.address ? `<div style="font-size: 11px; margin-top: 4px;">${client.address}</div>` : ""}
+              ${client.city || client.town ? `<div style="font-size: 11px;">${client.city || client.town} ${client.postalCode || ""}</div>` : ""}
+              ${client.phone ? `<div style="font-size: 11px; margin-top: 4px;">Tel: ${client.phone}</div>` : ""}
+              ${client.email ? `<div style="font-size: 11px;">Email: ${client.email}</div>` : ""}
+            </div>
+            <div class="card">
+              <div class="card-title">Delivery Details</div>
+              <div style="font-size: 11px; line-height: 1.6;">
+                <div><strong>Status:</strong> ${deliveryNote.status || "DISPATCHED"}</div>
+                ${deliveryNote.referenceNumber ? `<div><strong>Reference:</strong> ${deliveryNote.referenceNumber}</div>` : ""}
+                ${deliveryNote.creator?.name ? `<div><strong>Prepared By:</strong> ${deliveryNote.creator.name}</div>` : ""}
+              </div>
+            </div>
+          </div>
+
+          <table>
+            <thead>
+              <tr>
+                <th>Description</th>
+                <th style="text-align: center; width: 12%;">Qty</th>
+                ${deliveryNote.items?.some((it) => it.unitPrice !== void 0) ? `<th style="text-align: right; width: 18%;">Unit Price</th>` : ""}
+                ${deliveryNote.items?.some((it) => it.amount !== void 0) ? `<th style="text-align: right; width: 18%;">Amount</th>` : ""}
+              </tr>
+            </thead>
+            <tbody>
+              ${itemsRows}
+            </tbody>
+          </table>
+
+          ${deliveryNote.notes ? `
+          <div style="margin-top: 30px; border-top: 1px solid ${template.borderFaint}; padding-top: 12px; font-size: 11px;">
+            <strong>Notes / Instructions:</strong>
+            <p style="margin-top: 4px; color: ${template.textMuted};">${deliveryNote.notes}</p>
+          </div>` : ""}
+
+          <div style="margin-top: 50px; display: flex; justify-content: space-between; page-break-inside: avoid;">
+            <div style="width: 220px; text-align: center; border-top: 1px solid #000; padding-top: 6px; font-size: 11px;">
+              Received in Good Order (Signature)
+            </div>
+            <div style="width: 220px; text-align: center; border-top: 1px solid #000; padding-top: 6px; font-size: 11px;">
+              Date & Print Name
+            </div>
+          </div>
+        </body>
+      </html>
+    `;
+  }
+};
+async function generateDeliveryNoteHTML(deliveryNote, options) {
+  return DeliveryNoteGenerator.generateDeliveryNoteHTML(
+    deliveryNote,
+    options?.companyInfo,
+    options?.templateId,
+    options?.docSettings
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  A4_TEMPLATES,
+  A4_TEMPLATE_IDS,
+  DEFAULT_A4_ID,
+  DEFAULT_COMPANY_INFO,
+  DEFAULT_DOCUMENT_TYPE_SETTINGS,
+  DEFAULT_RECEIPT_COMPANY_INFO,
+  DEFAULT_TAX_RATE,
+  DEFAULT_THERMAL_ID,
+  DeliveryNoteGenerator,
+  InvoiceReportGenerator,
+  QuotationReportGenerator,
+  ReceiptGenerator,
+  THERMAL_TEMPLATES,
+  THERMAL_TEMPLATE_IDS,
+  escapeHtml,
+  formatCompanyAddress,
+  formatCurrency,
+  formatDate,
+  generateBarcode,
+  generateCode128Svg,
+  generateDeliveryNoteHTML,
+  generateInvoiceHTML,
+  generateQRCode,
+  generateQuotationHTML,
+  getA4Template,
+  getClientDisplayName,
+  getDocumentTypeSettings,
+  getThermalTemplate,
+  hasVisibleText,
+  isA4TemplateId,
+  isClassicTemplate,
+  isThermalTemplateId,
+  receiptGenerator,
+  renderClassicHeader,
+  renderContactBox,
+  renderHeaderSection
+});