<?php
/**
 * Admin Offer Popup View — Gmind Institute
 *
 * Dedicated page for managing the offer popup on the landing page.
 */
$basePath = defined('BASE_PATH') ? BASE_PATH : '/gmind';
$enabled  = ($settings['offer_popup_enabled'] ?? '0') === '1';
?>
<div class="admin-section">
    <!-- Status Banner -->
    <div class="admin-card" style="margin-bottom: 24px; border-left: 4px solid <?= $enabled ? '#27ae60' : '#e74c3c' ?>;">
        <div class="admin-card-body" style="display: flex; align-items: center; gap: 16px;">
            <div style="width: 48px; height: 48px; border-radius: 50%; background: <?= $enabled ? 'rgba(39,174,96,0.1)' : 'rgba(231,76,60,0.1)' ?>; display: flex; align-items: center; justify-content: center; flex-shrink: 0;">
                <?php if ($enabled): ?>
                <svg viewBox="0 0 24 24" fill="none" stroke="#27ae60" stroke-width="2" width="24" height="24"><path d="M22 11.08V12a10 10 0 11-5.93-9.14"/><polyline points="22 4 12 14.01 9 11.01"/></svg>
                <?php else: ?>
                <svg viewBox="0 0 24 24" fill="none" stroke="#e74c3c" stroke-width="2" width="24" height="24"><circle cx="12" cy="12" r="10"/><line x1="15" y1="9" x2="9" y2="15"/><line x1="9" y1="9" x2="15" y2="15"/></svg>
                <?php endif; ?>
            </div>
            <div>
                <h3 style="margin: 0 0 4px; font-size: 1.1rem; color: <?= $enabled ? '#27ae60' : '#e74c3c' ?>;">
                    Offer Popup is Currently: <?= $enabled ? 'ENABLED' : 'DISABLED' ?>
                </h3>
                <p style="margin: 0; color: #888; font-size: 0.9rem;">
                    <?= $enabled ? 'The popup will appear on the homepage for new visitors.' : 'Enable the popup below to show it on the homepage.' ?>
                </p>
            </div>
        </div>
    </div>

    <!-- Settings Form -->
    <form method="POST" action="<?= $basePath ?>/admin/offer-popup" class="admin-form" enctype="multipart/form-data" novalidate>
        <input type="hidden" name="csrf_token" value="<?= htmlspecialchars($csrfToken ?? '', ENT_QUOTES, 'UTF-8') ?>">

        <!-- Enable/Disable Toggle -->
        <div class="admin-card" style="margin-bottom: 24px;">
            <div class="admin-card-header">
                <h2 class="admin-card-title">Popup Status</h2>
            </div>
            <div class="admin-card-body">
                <div class="admin-form-group">
                    <label class="admin-form-label">Enable Offer Popup</label>
                    <label class="admin-toggle">
                        <input type="checkbox" name="offer_popup_enabled" value="1" <?= $enabled ? 'checked' : '' ?>>
                        <span class="admin-toggle-slider"></span>
                        <span class="admin-toggle-label"><?= $enabled ? 'Enabled — Popup is active on homepage' : 'Disabled — Popup is hidden' ?></span>
                    </label>
                </div>
            </div>
        </div>

        <!-- Popup Content -->
        <div class="admin-card" style="margin-bottom: 24px;">
            <div class="admin-card-header">
                <h2 class="admin-card-title">Popup Content</h2>
            </div>
            <div class="admin-card-body">
                <div class="admin-form-group">
                    <label for="offer_popup_title" class="admin-form-label">Popup Title</label>
                    <input type="text" id="offer_popup_title" name="offer_popup_title" class="admin-form-input"
                           placeholder="e.g. Special Offer! 50% Off"
                           value="<?= htmlspecialchars($settings['offer_popup_title'] ?? '', ENT_QUOTES, 'UTF-8') ?>">
                </div>

                <div class="admin-form-group">
                    <label for="offer_popup_description" class="admin-form-label">Popup Description</label>
                    <textarea id="offer_popup_description" name="offer_popup_description"
                              class="admin-form-textarea" rows="4"
                              placeholder="Describe the offer in detail..."><?= htmlspecialchars($settings['offer_popup_description'] ?? '', ENT_QUOTES, 'UTF-8') ?></textarea>
                </div>

                <div class="admin-form-group">
                    <label for="offer_popup_image" class="admin-form-label">Popup Image</label>
                    <?php if (!empty($settings['offer_popup_image'])): ?>
                    <div style="margin-bottom: 12px; padding: 8px; border: 1px solid #e0e0e0; border-radius: 8px; display: inline-block;">
                        <img src="<?= htmlspecialchars(upload_url($settings['offer_popup_image']), ENT_QUOTES, 'UTF-8') ?>"
                             alt="Current popup image"
                             style="max-width: 400px; max-height: 200px; border-radius: 4px; display: block;">
                        <p style="margin: 8px 0 0; font-size: 0.8rem; color: #888;">Current image — upload a new one to replace</p>
                    </div>
                    <?php endif; ?>
                    <input type="file" id="offer_popup_image" name="offer_popup_image"
                           class="admin-form-file" accept="image/*">
                    <p style="margin-top: 4px; font-size: 0.8rem; color: #888;">Recommended: 600x400px, JPG/PNG/WebP</p>
                </div>
            </div>
        </div>

        <!-- Popup Action Button -->
        <div class="admin-card" style="margin-bottom: 24px;">
            <div class="admin-card-header">
                <h2 class="admin-card-title">Action Button</h2>
            </div>
            <div class="admin-card-body">
                <div class="admin-form-row">
                    <div class="admin-form-group">
                        <label for="offer_popup_link_text" class="admin-form-label">Button Text</label>
                        <input type="text" id="offer_popup_link_text" name="offer_popup_link_text"
                               class="admin-form-input"
                               placeholder="e.g. Claim Offer, Enroll Now"
                               value="<?= htmlspecialchars($settings['offer_popup_link_text'] ?? 'Learn More', ENT_QUOTES, 'UTF-8') ?>">
                    </div>
                    <div class="admin-form-group">
                        <label for="offer_popup_link" class="admin-form-label">Button Link URL</label>
                        <input type="url" id="offer_popup_link" name="offer_popup_link"
                               class="admin-form-input"
                               placeholder="https://example.com/offer"
                               value="<?= htmlspecialchars($settings['offer_popup_link'] ?? '', ENT_QUOTES, 'UTF-8') ?>">
                    </div>
                </div>
            </div>
        </div>

        <!-- Preview -->
        <?php if ($enabled && (!empty($settings['offer_popup_title']) || !empty($settings['offer_popup_image']))): ?>
        <div class="admin-card" style="margin-bottom: 24px;">
            <div class="admin-card-header">
                <h2 class="admin-card-title">Preview</h2>
            </div>
            <div class="admin-card-body" style="display: flex; justify-content: center;">
                <div style="background: #fff; border-radius: 16px; max-width: 420px; width: 100%; box-shadow: 0 4px 24px rgba(0,0,0,0.12); overflow: hidden;">
                    <?php if (!empty($settings['offer_popup_image'])): ?>
                    <div style="max-height: 200px; overflow: hidden;">
                        <img src="<?= htmlspecialchars(upload_url($settings['offer_popup_image']), ENT_QUOTES, 'UTF-8') ?>"
                             alt="Preview" style="width: 100%; height: 100%; object-fit: cover; display: block;">
                    </div>
                    <?php endif; ?>
                    <div style="padding: 24px; text-align: center;">
                        <?php if (!empty($settings['offer_popup_title'])): ?>
                        <h3 style="font-family: 'Poppins', sans-serif; font-weight: 700; font-size: 1.3rem; color: #0d2b6e; margin: 0 0 12px;">
                            <?= htmlspecialchars($settings['offer_popup_title'], ENT_QUOTES, 'UTF-8') ?>
                        </h3>
                        <?php endif; ?>
                        <?php if (!empty($settings['offer_popup_description'])): ?>
                        <p style="font-size: 0.9rem; color: #555; line-height: 1.6; margin: 0 0 20px;">
                            <?= htmlspecialchars($settings['offer_popup_description'], ENT_QUOTES, 'UTF-8') ?>
                        </p>
                        <?php endif; ?>
                        <?php if (!empty($settings['offer_popup_link'])): ?>
                        <a href="#" onclick="return false;" style="display: inline-block; background: linear-gradient(135deg, #e84118 0%, #c73510 100%); color: #fff; padding: 12px 32px; border-radius: 8px; text-decoration: none; font-weight: 600;">
                            <?= htmlspecialchars($settings['offer_popup_link_text'] ?? 'Learn More', ENT_QUOTES, 'UTF-8') ?>
                        </a>
                        <?php endif; ?>
                    </div>
                </div>
            </div>
        </div>
        <?php endif; ?>

        <div class="admin-form-actions">
            <button type="submit" class="admin-btn admin-btn-primary">Save Offer Popup</button>
        </div>
    </form>
</div>
