<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <title>Sertifikat</title>
    <style>
        @page {
            size: 1200px 800px;
            margin: 0px;
        }
        body {
            margin: 0;
            padding: 0;
            width: 1200px;
            height: 800px;
            font-family: 'Roboto', sans-serif;
            position: relative;
        }
        @font-face {
            font-family: 'Roboto';
            font-style: normal;
            font-weight: 400;
            src: url("<?php echo e(public_path('fonts/Roboto-Regular.ttf')); ?>") format('truetype');
        }
        @font-face {
            font-family: 'Roboto';
            font-style: normal;
            font-weight: 700;
            src: url("<?php echo e(public_path('fonts/Roboto-Bold.ttf')); ?>") format('truetype');
        }
        
        .bg-image {
            position: absolute;
            top: 0;
            left: 0;
            width: 1200px;
            height: 800px;
            z-index: -1;
        }
        
        .content {
            position: absolute;
            top: 0;
            left: 0;
            width: 1200px;
            height: 800px;
            z-index: 1;
        }

        .nomor {
            position: absolute;
            top: 280px;
            left: 0;
            width: 100%;
            text-align: center;
            font-size: 26px;
            font-weight: 700;
            color: #000000;
        }

        .diberikan-kepada {
            position: absolute;
            top: 320px;
            left: 0;
            width: 100%;
            text-align: center;
            font-size: 22px;
            font-weight: 400;
            color: #555555; /* Abu-abu seperti di gambar */
        }

        .nama {
            position: absolute;
            top: 380px;
            left: 0;
            width: 100%;
            text-align: center;
            font-size: 72px; /* Ukuran besar */
            font-weight: 700;
            color: #000000;
        }

        .deskripsi-1 {
            position: absolute;
            top: 500px;
            left: 0;
            width: 100%;
            text-align: center;
            font-size: 22px;
            font-weight: 400;
            color: #333333;
        }

        .deskripsi-2 {
            position: absolute;
            top: 535px;
            left: 0;
            width: 100%;
            text-align: center;
            font-size: 22px;
            font-weight: 400;
            color: #333333;
        }

        /* Footer diposisikan di tengah bawah */
        .footer {
            position: absolute;
            top: 600px;
            left: 400px; /* (1200 - 400) / 2 = 400 untuk menengahkan box 400px */
            width: 400px;
            height: 100px;
            text-align: left;
        }

        .qr-code {
            position: absolute;
            top: 0;
            left: 0;
            width: 90px;
            height: 90px;
        }

        .ttd-text {
            position: absolute;
            left: 110px;
            top: 5px;
            font-size: 16px;
            font-weight: 400;
            color: #000000;
        }
        
        .ttd-jabatan {
            position: absolute;
            left: 110px;
            top: 25px;
            font-size: 16px;
            font-weight: 400;
            color: #000000;
        }

        .ttd-nama {
            position: absolute;
            left: 110px;
            top: 65px;
            font-size: 18px;
            font-weight: 700;
            color: #000000;
        }
    </style>
</head>
<body>
    <?php if(isset($bg_image) && $bg_image): ?>
        <img src="<?php echo e($bg_image); ?>" class="bg-image" />
    <?php endif; ?>
    
    <div class="content">
        <div class="nomor">No. <?php echo e($peserta->nomor_sertifikat ?? ''); ?></div>
        <div class="diberikan-kepada">diberikan kepada</div>
        <div class="nama"><?php echo e($peserta->nama); ?></div>
        <div class="deskripsi-1">Atas partisipasinya sebagai <strong>Peserta</strong> kelas <?php echo e($batch->judul); ?></div>
        <div class="deskripsi-2">pada <?php echo e($batch->tanggal); ?></div>
        
        <div class="footer">
            <img src="<?php echo e($qrCodeBase64); ?>" class="qr-code" />
            <div class="ttd-text">Ditandatangani secara elektronik oleh</div>
            <div class="ttd-jabatan">Pimpinan Akademi Leader</div>
            <div class="ttd-nama">Angga Feri Setyawan, M.Pd.</div>
        </div>
    </div>
</body>
</html>
<?php /**PATH C:\laragon\www\sertifikat-generator\resources\views/template_pdf.blade.php ENDPATH**/ ?>