Fix canvas background to exact COOP gradient, remove module borders/gaps, add interactive Badge Editor SVG to PNG

src/lib/emailRenderer.ts

@@ -609,7 +609,15 @@ function renderExactProductCard(
       </tr>
       <tr height="1">
           <td style="padding: 0 8px 12px 8px; text-align: center;" valign="bottom">
-              <!-- Vyladená Cenovka Premium v8/v11 1:1 -->
+              <!-- Vyladená Cenovka Premium v8/v11 1:1 alebo vyrenderovaná PNG cenovka z editora -->
+              ${p.customBadgePngUrl ? `
+              <table role="presentation" cellspacing="0" cellpadding="0" border="0" align="center" style="margin: 0 auto;">
+                  <tr>
+                      <td align="center">
+                          <img src="${escapeHtml(p.customBadgePngUrl)}" width="110" alt="Cenovka" style="display: block; margin: 0 auto; max-width: 120px;">
+                      </td>
+                  </tr>
+              </table>` : `
               <table role="presentation" cellspacing="0" cellpadding="0" border="0" align="center" style="width: 95px; margin: 0 auto;">
                   <tr>
                       <td align="center">
@@ -640,7 +648,7 @@ function renderExactProductCard(
                           <img src="${SUPABASE_ASSETS_BASE}vlajka_srdce.png" width="40" alt="SK" style="display: block; margin-top: -26px; margin-right: -10px; padding: 4px; filter: drop-shadow(1px 0 0 #fefefe) drop-shadow(-1px 0 0 #fefefe) drop-shadow(0 1px 0 #fefefe) drop-shadow(0 -1px 0 #fefefe);">
                       </td>
                   </tr>` : ''}
-              </table>
+              </table>`}
               ${p.unitPrice ? `<div style="font-size: 9px; color: #666666; margin-top: 4px; font-weight: 500; font-family: Arial, sans-serif;">${escapeHtml(p.unitPrice)}</div>` : ''}
           </td>
       </tr>