<!DOCTYPE html>
<html lang="id">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Kelola Brosur PPDB | CMS Admin SMK Teratai Putih 3</title>
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap" rel="stylesheet">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
  <link rel="stylesheet" href="/css/admin.css">
</head>
<body>

  <div class="admin-wrapper">
    <%- include('partials/admin-sidebar') %>

    <div class="admin-content">
      <%- include('partials/admin-header', { title: 'Kelola Brosur PPDB Sekolah' }) %>

      <main class="admin-main">
        
        <% if (message) { %>
          <div class="alert-success" style="margin-bottom: 1.5rem;">
            <i class="fa-solid fa-circle-check"></i> <%= message %>
          </div>
        <% } %>

        <div class="grid-2col">
          
          <!-- BROSUR UPLOAD FORM -->
          <div class="card">
            <div class="card-header">
              <h3><i class="fa-solid fa-cloud-arrow-up text-primary"></i> Upload Brosur Baru (File PDF)</h3>
            </div>
            <div class="card-body">
              <form action="/admin/brosur/update" method="POST" enctype="multipart/form-data">
                
                <div class="form-group">
                  <label for="title">Judul / Nama Brosur</label>
                  <input type="text" id="title" name="title" class="form-control" value="<%= brosur.title || 'Brosur PPDB SMK Teratai Putih Global 3 Bekasi 2026/2027' %>" required>
                  <small class="form-hint">Judul ini akan muncul saat calon siswa mengklik tombol "Unduh Brosur PDF".</small>
                </div>

                <div class="form-group">
                  <label for="brosurFile">Pilih File PDF Brosur Baru</label>
                  <input type="file" id="brosurFile" name="brosurFile" accept=".pdf" class="form-control">
                  <small class="form-hint">Format file wajib <strong>.PDF</strong> (Maksimal 15 MB). Kosongkan jika hanya ingin mengedit judul brosur.</small>
                </div>

                <button type="submit" class="btn btn-primary btn-lg w-100">
                  <i class="fa-solid fa-floppy-disk"></i> Simpan & Perbarui Brosur Website
                </button>
              </form>
            </div>
          </div>

          <!-- ACTIVE BROCHURE PREVIEW -->
          <div class="card">
            <div class="card-header">
              <h3><i class="fa-solid fa-file-pdf text-red"></i> Status Brosur Aktif Saat Ini</h3>
            </div>
            <div class="card-body">
              <div class="brosur-preview-card">
                <div class="pdf-badge">
                  <i class="fa-solid fa-file-pdf"></i> PDF
                </div>
                <h4 style="margin-top: 1rem; color: var(--navy); font-size: 1.1rem;"><%= brosur.title %></h4>
                
                <table class="info-table" style="margin: 1.25rem 0;">
                  <tr>
                    <td><strong>Nama File</strong></td>
                    <td>: <code><%= brosur.filename || 'brosur.pdf' %></code></td>
                  </tr>
                  <tr>
                    <td><strong>Ukuran File</strong></td>
                    <td>: <%= brosur.fileSize || '2.4 MB' %></td>
                  </tr>
                  <tr>
                    <td><strong>Status</strong></td>
                    <td>: <span class="badge badge-success"><i class="fa-solid fa-circle-check"></i> Aktif di Website</span></td>
                  </tr>
                  <tr>
                    <td><strong>Terakhir Diperbarui</strong></td>
                    <td>: <%= brosur.lastUpdated || 'Baru Saja' %></td>
                  </tr>
                </table>

                <div style="display: flex; gap: 0.75rem; flex-wrap: wrap;">
                  <a href="/uploads/brosur.pdf" target="_blank" class="btn btn-outline-primary">
                    <i class="fa-solid fa-arrow-up-right-from-square"></i> Buka File Brosur
                  </a>
                  <a href="/download/brosur" class="btn btn-outline-secondary">
                    <i class="fa-solid fa-download"></i> Uji Coba Unduh
                  </a>
                </div>
              </div>
            </div>
          </div>

        </div>

      </main>
    </div>
  </div>

</body>
</html>
