<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Certificate of Internship - {{ $student->full_name }}</title>
    <style>
        @page {
            size: A4 landscape;
            margin: 0;
        }
        body {
            font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
            margin: 0;
            padding: 0;
            background-color: #ffffff;
            color: #1e293b;
            -webkit-print-color-adjust: exact;
        }
        .certificate-container {
            width: 297mm;
            height: 210mm;
            box-sizing: border-box;
            padding: 12mm;
            position: relative;
            background: #ffffff;
        }
        .outer-border {
            width: 100%;
            height: 100%;
            border: 4px solid #065f46;
            box-sizing: border-box;
            padding: 5mm;
            position: relative;
        }
        .inner-border {
            width: 100%;
            height: 100%;
            border: 1px solid #10b981;
            box-sizing: border-box;
            padding: 8mm 12mm;
            position: relative;
            text-align: center;
        }
        
        /* Corner Accents */
        .corner-tl { position: absolute; top: 0; left: 0; width: 25px; height: 25px; border-top: 4px solid #065f46; border-left: 4px solid #065f46; }
        .corner-tr { position: absolute; top: 0; right: 0; width: 25px; height: 25px; border-top: 4px solid #065f46; border-right: 4px solid #065f46; }
        .corner-bl { position: absolute; bottom: 0; left: 0; width: 25px; height: 25px; border-bottom: 4px solid #065f46; border-left: 4px solid #065f46; }
        .corner-br { position: absolute; bottom: 0; right: 0; width: 25px; height: 25px; border-bottom: 4px solid #065f46; border-right: 4px solid #065f46; }

        /* Header Layout */
        .header-table {
            width: 100%;
            border-collapse: collapse;
            margin-bottom: 5px;
        }
        .logo-box {
            width: 70px;
            text-align: left;
            vertical-align: middle;
        }
        .college-logo-box {
            width: 70px;
            text-align: right;
            vertical-align: middle;
        }
        .header-title-box {
            text-align: center;
            vertical-align: middle;
        }
        .ngo-name {
            font-size: 26px;
            font-weight: 800;
            color: #065f46;
            letter-spacing: 1px;
            text-transform: uppercase;
            margin: 0;
        }
        .ngo-tagline {
            font-size: 11px;
            font-weight: 600;
            color: #059669;
            margin-top: 2px;
            letter-spacing: 0.5px;
        }

        /* Certificate Title */
        .cert-title-container {
            margin: 15px 0 10px 0;
        }
        .cert-title {
            font-size: 32px;
            font-weight: 800;
            color: #0f172a;
            text-transform: uppercase;
            letter-spacing: 3px;
            margin: 0;
        }
        .cert-subtitle {
            font-size: 12px;
            color: #64748b;
            text-transform: uppercase;
            letter-spacing: 2px;
            margin-top: 4px;
        }

        /* Certificate Body Text */
        .body-text {
            font-size: 13px;
            color: #334155;
            line-height: 1.6;
            margin: 15px 40px;
        }
        .student-name {
            font-size: 28px;
            font-weight: 800;
            color: #065f46;
            border-bottom: 2px solid #10b981;
            display: inline-block;
            padding: 0 25px 4px 25px;
            margin: 10px 0;
            letter-spacing: 0.5px;
        }
        .highlight-text {
            font-weight: 700;
            color: #0f172a;
        }

        /* Footer & Signatures Section */
        .footer-table {
            width: 100%;
            margin-top: 25px;
            border-collapse: collapse;
        }
        .qr-cell {
            width: 120px;
            text-align: left;
            vertical-align: bottom;
        }
        .seal-cell {
            text-align: center;
            vertical-align: bottom;
        }
        .sig-cell {
            width: 180px;
            text-align: right;
            vertical-align: bottom;
        }

        .sig-line {
            width: 140px;
            border-top: 1px solid #475569;
            margin-left: auto;
            margin-bottom: 4px;
        }
        .sig-title {
            font-size: 11px;
            font-weight: 700;
            color: #0f172a;
        }
        .sig-org {
            font-size: 9px;
            color: #64748b;
        }

        .cert-meta-bar {
            font-size: 10px;
            color: #64748b;
            border-top: 1px border #e2e8f0;
            padding-top: 6px;
            margin-top: 15px;
            display: flex;
            justify-content: space-between;
        }
    </style>
</head>
<body>
    <div class="certificate-container">
        <div class="outer-border">
            <div class="inner-border">
                
                <div class="corner-tl"></div>
                <div class="corner-tr"></div>
                <div class="corner-bl"></div>
                <div class="corner-br"></div>

                <!-- Header Table -->
                <table class="header-table">
                    <tr>
                        <td class="logo-box">
                            <div style="width: 55px; height: 55px; background: #065f46; color: #ffffff; font-weight: 800; font-size: 20px; border-radius: 12px; line-height: 55px; text-align: center;">
                                HWS
                            </div>
                        </td>
                        <td class="header-title-box">
                            <div class="ngo-name">Humanity Welfare Society</div>
                            <div class="ngo-tagline">Regd. Non-Governmental Organization • Empowering Society Through Education & Service</div>
                        </td>
                        <td class="college-logo-box">
                            @if(isset($college) && $college->logo_path && file_exists(storage_path('app/public/' . $college->logo_path)))
                                <img src="{{ storage_path('app/public/' . $college->logo_path) }}" style="max-width: 60px; max-height: 60px; object-fit: contain;">
                            @else
                                <div style="width: 55px; height: 55px; border: 1px dashed #94a3b8; border-radius: 8px; font-size: 8px; color: #94a3b8; line-height: 55px; text-align: center;">
                                    {{ $college->name ?? 'INSTITUTE' }}
                                </div>
                            @endif
                        </td>
                    </tr>
                </table>

                <!-- Title Container -->
                <div class="cert-title-container">
                    <div class="cert-title">Certificate of Internship</div>
                    <div class="cert-subtitle">PROUDLY PRESENTED TO</div>
                </div>

                <!-- Student Name -->
                <div class="student-name">{{ $student->full_name }}</div>

                <!-- Body Text -->
                <div class="body-text">
                    This is to certify that student of <span class="highlight-text">{{ $college->name ?? 'Recognized Institution' }}</span> 
                    has successfully completed a <span class="highlight-text">{{ $certificate->duration }}</span> internship in 
                    <span class="highlight-text">{{ $course->title ?? 'Social Service & Development' }}</span> 
                    with <span class="highlight-text">Humanity Welfare Society</span> from 
                    <span class="highlight-text">{{ date('d M Y', strtotime($certificate->start_date)) }}</span> to 
                    <span class="highlight-text">{{ date('d M Y', strtotime($certificate->end_date)) }}</span>.
                    During this internship period, candidate demonstrated commendable dedication, hard work, and technical proficiency.
                </div>

                <!-- Footer Signatures & QR Code Table -->
                <table class="footer-table">
                    <tr>
                        <td class="qr-cell">
                            @if(isset($qrCode))
                                <img src="{{ $qrCode }}" style="width: 85px; height: 85px;">
                            @endif
                            <div style="font-size: 8px; color: #64748b; margin-top: 2px;">Scan to Verify</div>
                        </td>

                        <td class="seal-cell">
                            <div style="display: inline-block; width: 65px; height: 65px; border: 2px double #065f46; border-radius: 50%; color: #065f46; font-size: 8px; font-weight: 800; padding: 6px; text-align: center;">
                                OFFICIAL<br>STAMP & SEAL<br>HWS
                            </div>
                        </td>

                        <td class="sig-cell">
                            <div class="sig-line"></div>
                            <div class="sig-title">{{ $certificate->signatory_title ?? 'President & Secretary' }}</div>
                            <div class="sig-org">Humanity Welfare Society</div>
                        </td>
                    </tr>
                </table>

                <!-- Certificate Metadata Footer Bar -->
                <div class="cert-meta-bar">
                    <span>Certificate ID: <strong>{{ $certificate->certificate_uuid }}</strong></span>
                    <span>Issue Date: <strong>{{ date('d F Y', strtotime($certificate->issue_date)) }}</strong></span>
                </div>

            </div>
        </div>
    </div>
</body>
</html>
