<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Certificate - <?php echo htmlspecialchars($data['student_name']); ?></title>
    <style>
        @page {
            margin: 0;
            size: A4 landscape;
        }
        body {
            font-family: 'Helvetica', 'Arial', sans-serif;
            margin: 0;
            padding: 0;
            background-color: #fff;
            color: #333;
        }
        .cert-wrapper {
            width: 297mm;
            height: 210mm;
            position: relative;
            background-color: #fff;
            /* Academic background texture */
            background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23003366' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
        }
        
        .outer-border {
            position: absolute;
            top: 15mm;
            left: 15mm;
            right: 15mm;
            bottom: 15mm;
            border: 1.5pt solid #003366;
            box-sizing: border-box;
            padding: 5mm 5mm 20mm 5mm;
        }
        
        .inner-border {
            border: 0.8pt solid #C5A059;
            height: 100%;
            width: 100%;
            box-sizing: border-box;
            padding: 0;
            position: relative;
        }

        /* Creative Corner Accents */
        .corner-accent {
            position: absolute;
            width: 15mm;
            height: 15mm;
            z-index: 10;
        }
        .acc-tl { top: -2mm; left: -2mm; border-top: 1pt solid #C5A059; border-left: 1pt solid #C5A059; }
        .acc-tr { top: -2mm; right: -2mm; border-top: 1pt solid #C5A059; border-right: 1pt solid #C5A059; }
        .acc-bl { bottom: -2mm; left: -2mm; border-bottom: 1pt solid #C5A059; border-left: 1pt solid #C5A059; }
        .acc-br { bottom: -2mm; right: -2mm; border-bottom: 1pt solid #C5A059; border-right: 1pt solid #C5A059; }

        .content-table {
            width: 100%;
            height: 100%;
            border-collapse: collapse;
            table-layout: fixed;
        }

        .content-td {
            vertical-align: middle;
            text-align: center;
            padding: 10mm 20mm;
        }

        .header {
            margin-bottom: 6mm;
        }
        .inst-name {
            font-size: 16pt;
            font-weight: bold;
            color: #003366;
            text-transform: uppercase;
            letter-spacing: 6px;
        }

        .main-title {
            font-size: 48pt;
            font-weight: bold;
            color: #003366;
            margin: 0;
            letter-spacing: 12px;
            font-family: 'Times New Roman', serif;
        }
        .sub-title {
            font-size: 15pt;
            color: #C5A059;
            text-transform: uppercase;
            letter-spacing: 16px;
            font-weight: bold;
            margin-top: -3mm;
            margin-bottom: 12mm;
        }

        .text-light {
            font-size: 14pt;
            font-style: italic;
            color: #666;
            margin-bottom: 6mm;
        }

        .student-name {
            font-size: 38pt;
            font-weight: bold;
            color: #003366;
            border-bottom: 1.5pt solid #C5A059;
            display: inline-block;
            padding: 0 35mm 2mm 35mm;
            margin-bottom: 10mm;
            font-family: 'Times New Roman', serif;
            position: relative;
        }
        /* Stylish subtle line under student name */
        .student-name:after {
            content: '';
            position: absolute;
            bottom: -3.5pt;
            left: 25%;
            right: 25%;
            border-bottom: 0.5pt solid #003366;
        }

        .description {
            font-size: 14pt;
            line-height: 1.8;
            color: #444;
            max-width: 80%;
            margin: 0 auto 12mm auto;
        }
        .course-name {
            font-weight: bold;
            color: #003366;
            font-size: 18pt;
            text-transform: uppercase;
        }

        .footer-table {
            width: 100%;
            margin-top: 10mm;
        }
        .footer-td {
            width: 50%;
            text-align: center;
            vertical-align: bottom;
        }
        
        .line-box {
            border-top: 1pt solid #003366;
            margin: 0 25mm;
        }
        .line-text {
            font-size: 11pt;
            font-weight: bold;
            color: #003366;
            margin-bottom: 2mm;
        }
        .line-sub {
            font-size: 8pt;
            color: #888;
            margin-top: 1.5mm;
            text-transform: uppercase;
            font-weight: bold;
            letter-spacing: 1px;
        }
    </style>
</head>
<body>
    <div class="cert-wrapper">
        <div class="outer-border">
            <div class="inner-border">
                <!-- Creative Accent Elements -->
                <div class="corner-accent acc-tl"></div>
                <div class="corner-accent acc-tr"></div>
                <div class="corner-accent acc-bl"></div>
                <div class="corner-accent acc-br"></div>

                <table class="content-table">
                    <tr>
                        <td class="content-td">
                            <div class="header">
                                <div class="inst-name"><?php echo htmlspecialchars($settings['institute_name'] ?? 'Elite Training Center'); ?></div>
                            </div>

                            <h1 class="main-title">CERTIFICATE</h1>
                            <div class="sub-title">OF COMPLETION</div>

                            <div class="text-light">This is to certify that</div>

                            <div class="student-name"><?php echo htmlspecialchars($data['student_name']); ?></div>

                            <div class="description">
                                Has successfully completed the course in <br>
                                <span class="course-name"><?php echo htmlspecialchars($data['course_name']); ?></span> <br>
                                with a duration of <?php echo htmlspecialchars($data['duration']); ?>. <br>
                                We wish them all the best for their future.
                            </div>

                            <table class="footer-table">
                                <tr>
                                    <td class="footer-td">
                                        <div class="line-text"><?php echo date('d/m/Y', strtotime($data['completion_date'])); ?></div>
                                        <div class="line-box"></div>
                                        <div class="line-sub">DATE ISSUED</div>
                                    </td>
                                    <td class="footer-td">
                                        <div class="line-text">&nbsp;</div>
                                        <div class="line-box"></div>
                                        <div class="line-sub">SIGNATURE</div>
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
</body>
</html>
