fix: Use background-blue.jpeg for AIcertifikatGablas (signatures baked in)

Same approach as ScrumMaster - signatures are already in the background image,
no need to overlay separate PNG files which had quality issues.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

src/services/ai-kurzy/certificate.service.js

@@ -27,7 +27,7 @@ export const CERTIFICATE_TEMPLATES = {
     name: 'AI Certifikát (Gablas)',
     file: 'AIcertifikatGablas.html',
     description: 'AI kurz - lektor Gablas + Gablasová',
-    background: 'background.jpeg',
+    background: 'background-blue.jpeg',
   },
   AIcertifikatPatrik: {
     name: 'AI Certifikát (Patrik)',

src/templates/certificates/AIcertifikatGablas.html

@@ -5,7 +5,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Osvedčenie - {{participantName}}</title>
   <style>
-    @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700&family=Open+Sans:wght@300;400;500;600&display=swap');
+    @import url('https://fonts.googleapis.com/css2?family=Bahnschrift:wght@400;600;700&family=Open+Sans:wght@300;400;500;600;700&display=swap');
 
     * { margin: 0; padding: 0; box-sizing: border-box; }
     @page { size: A4 landscape; margin: 0; }
@@ -22,141 +22,73 @@
       background-repeat: no-repeat;
     }
 
-    .content {
+    /* Main content - centered in the white area */
+    .main-content {
       position: absolute;
-      top: 28mm;
+      top: 50%;
-      left: 0;
+      left: 50%;
-      right: 0;
+      transform: translate(-50%, -50%);
       text-align: center;
-    }
+      margin-top: -15mm;
-
-    .main-title {
-      font-family: 'Playfair Display', Georgia, serif;
-      font-size: 52pt;
-      font-weight: 700;
-      letter-spacing: 14px;
-      color: #1a1a1a;
-      text-transform: uppercase;
-      margin-bottom: 2mm;
-    }
-
-    .subtitle {
-      font-family: 'Open Sans', Arial, sans-serif;
-      font-size: 18pt;
-      font-weight: 400;
-      color: #333;
-      letter-spacing: 1px;
-      margin-bottom: 18mm;
-    }
-
-    .course-section { margin-top: 5mm; }
-
-    .course-title {
-      font-family: 'Playfair Display', Georgia, serif;
-      font-size: 32pt;
-      font-weight: 600;
-      color: #1a1a1a;
-      margin-bottom: 3mm;
-    }
-
-    .course-modules {
-      font-family: 'Open Sans', Arial, sans-serif;
-      font-size: 13pt;
-      font-weight: 500;
-      color: #333;
-      line-height: 1.5;
-      margin-bottom: 2mm;
-    }
-
-    .course-dates {
-      font-family: 'Open Sans', Arial, sans-serif;
-      font-size: 12pt;
-      font-weight: 400;
-      color: #444;
     }
 
     .participant-name {
-      font-family: 'Playfair Display', Georgia, serif;
+      font-size: 28pt;
-      font-size: 36pt;
+      font-weight: 700;
+      color: #1a1a1a;
+      margin-bottom: 8mm;
+    }
+
+    .course-title {
+      font-family: 'Bahnschrift', 'Open Sans', Arial, sans-serif;
+      font-size: 24pt;
+      font-weight: 700;
+      color: #1a1a1a;
+      margin-bottom: 4mm;
+    }
+
+    .course-dates {
+      font-size: 14pt;
       font-weight: 600;
       color: #1a1a1a;
-      margin-top: 14mm;
+      margin-bottom: 2mm;
     }
 
-    .footer-section {
+    .course-hours {
+      font-size: 14pt;
+      font-weight: 600;
+      color: #1a1a1a;
+    }
+
+    /* Issue date - above "Dátum" at bottom left */
+    .issue-date {
       position: absolute;
-      bottom: 28mm;
+      bottom: 42mm;
-      left: 25mm;
+      left: 28mm;
-      right: 25mm;
+      font-size: 12pt;
-      display: flex;
-      justify-content: space-between;
-      align-items: flex-end;
-    }
-
-    .date-location {
-      font-family: 'Open Sans', Arial, sans-serif;
-      font-size: 11pt;
       color: #333;
     }
 
-    .signatures { display: flex; gap: 25mm; }
-    .signature { text-align: center; min-width: 55mm; }
-    .signature-image { height: 18mm; margin-bottom: 1mm; object-fit: contain; }
-    .signature-line { width: 55mm; height: 0.4mm; background: #333; margin: 0 auto 2mm auto; }
-    .signature-name { font-family: 'Open Sans', Arial, sans-serif; font-size: 10pt; font-weight: 600; color: #1a1a1a; }
-    .signature-title { font-family: 'Open Sans', Arial, sans-serif; font-size: 9pt; font-weight: 400; color: #555; }
-
     .certificate-id {
       position: absolute;
-      bottom: 20mm;
+      bottom: 10mm;
-      right: 25mm;
+      right: 18mm;
-      font-family: 'Open Sans', Arial, sans-serif;
       font-size: 7pt;
-      color: #999;
+      color: #666;
-      letter-spacing: 0.5px;
     }
   </style>
 </head>
 <body>
   <div class="certificate">
-    <div class="content">
+    <div class="main-content">
-      <h1 class="main-title">O S V E D Č E N I E</h1>
+      <h3 class="participant-name">{{participantName}}</h3>
-      <p class="subtitle">o absolvovaní kurzu</p>
-
-      <div class="course-section">
       <h2 class="course-title">{{courseTitle}}</h2>
-        {{#if courseModules}}
-        <p class="course-modules">{{courseModules}}</p>
-        {{/if}}
       {{#if dateRange}}
       <p class="course-dates">{{dateRange}}</p>
       {{/if}}
     </div>
 
-      <h3 class="participant-name">{{participantName}}</h3>
+    <div class="issue-date">{{issueDate}}</div>
-    </div>
-
-    <div class="footer-section">
-      <div class="date-location">
-        V Bratislave {{issueDate}}
-      </div>
-
-      <div class="signatures">
-        <div class="signature">
-          <img src="{{signatureGablas}}" alt="Podpis" class="signature-image" />
-          <div class="signature-line"></div>
-          <p class="signature-name">Ing. Branislav Gablas, PhD.</p>
-          <p class="signature-title">lektor</p>
-        </div>
-        <div class="signature">
-          <img src="{{signatureGablasova}}" alt="Podpis" class="signature-image" />
-          <div class="signature-line"></div>
-          <p class="signature-name">Ing. Jana Gablasová</p>
-          <p class="signature-title">konateľ</p>
-        </div>
-      </div>
-    </div>
-
     <div class="certificate-id">ID: {{certificateId}}</div>
   </div>
 </body>