<?php ob_start();
$total         = (int) ($stats['total'] ?? 0);
$missingThumbs = (int) ($stats['missing_thumbs'] ?? 0);
$missingWebp   = (int) ($stats['missing_webp']   ?? 0);
$allGood       = ($missingThumbs === 0 && $missingWebp === 0);
?>

<?php admin_content_header(__('admin.media_optimize.title'), 'folder-open', [
    ['url' => '/admin/media', 'label' => __('admin.media_optimize.back')],
]); ?>

<div class="form-card" style="margin-bottom:1.5rem;">
    <h4 style="margin-top:0;"><?= __('admin.media_optimize.status_title') ?></h4>
    <p style="color:var(--text-muted);margin-bottom:1.25rem;line-height:1.6;">
        <?= __('admin.media_optimize.status_text') ?>
    </p>

    <div style="display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1.5rem;">
        <!-- Total -->
        <div style="background:var(--bg-secondary,#f8f9fa);border-radius:6px;padding:1rem;text-align:center;">
            <div style="font-size:2rem;font-weight:700;color:var(--text-primary);"><?= $total ?></div>
            <div style="font-size:0.875rem;color:var(--text-muted);margin-top:0.25rem;"><?= __('admin.media_optimize.originals') ?></div>
        </div>

        <!-- Missing thumbs -->
        <div style="background:<?= $missingThumbs > 0 ? '#fff7e6' : '#f0fdf4' ?>;border-radius:6px;padding:1rem;text-align:center;border:1px solid <?= $missingThumbs > 0 ? '#ffd591' : '#bbf7d0' ?>;">
            <div style="font-size:2rem;font-weight:700;color:<?= $missingThumbs > 0 ? '#d46b08' : '#15803d' ?>;"><?= $missingThumbs ?></div>
            <div style="font-size:0.875rem;color:var(--text-muted);margin-top:0.25rem;"><?= __('admin.media_optimize.missing_thumbs') ?></div>
        </div>

        <!-- Missing WebP -->
        <div style="background:<?= $missingWebp > 0 ? '#fff7e6' : '#f0fdf4' ?>;border-radius:6px;padding:1rem;text-align:center;border:1px solid <?= $missingWebp > 0 ? '#ffd591' : '#bbf7d0' ?>;">
            <div style="font-size:2rem;font-weight:700;color:<?= $missingWebp > 0 ? '#d46b08' : '#15803d' ?>;"><?= $missingWebp ?></div>
            <div style="font-size:0.875rem;color:var(--text-muted);margin-top:0.25rem;"><?= __('admin.media_optimize.missing_webp') ?></div>
        </div>
    </div>

    <?php if ($allGood): ?>
    <div style="background:#f0fdf4;border:1px solid #bbf7d0;border-radius:6px;padding:0.875rem 1rem;color:#15803d;font-size:0.9rem;">
        ✓ <?= __('admin.media_optimize.all_optimized') ?>
    </div>
    <?php elseif ($total === 0): ?>
    <div style="background:#f8f9fa;border:1px solid #e0e0e0;border-radius:6px;padding:0.875rem 1rem;color:var(--text-muted);font-size:0.9rem;">
        <?= __('admin.media_optimize.no_images') ?>
    </div>
    <?php else: ?>

    <form method="POST" action="/admin/media/optimize" class="admin-form">
        <?= $csrf->field() ?>

        <div class="form-group" style="margin-bottom:1rem;">
            <label style="font-weight:600;margin-bottom:0.5rem;display:block;"><?= __('admin.media_optimize.generate_label') ?></label>
            <div style="display:flex;gap:1rem;flex-wrap:wrap;">
                <label class="checkbox-label">
                    <input type="radio" name="action" value="both" checked>
                    <span><?= __('admin.media_optimize.both') ?></span>
                </label>
                <label class="checkbox-label">
                    <input type="radio" name="action" value="thumbs">
                    <span><?= __('admin.media_optimize.thumbs_only') ?></span>
                </label>
                <label class="checkbox-label">
                    <input type="radio" name="action" value="webp">
                    <span><?= __('admin.media_optimize.webp_only') ?></span>
                </label>
            </div>
            <small class="form-hint" style="margin-top:0.5rem;display:block;">
                <?= __('admin.media_optimize.skip_note') ?>
            </small>
        </div>

        <button type="submit" class="btn btn-primary"
                onclick="this.disabled=true; this.textContent='<?= __('admin.common.loading') ?>'; this.form.submit();">
            <?= __('admin.media_optimize.run') ?>
        </button>
    </form>

    <?php endif; ?>
</div>

<div class="form-card">
    <h4 style="margin-top:0;"><?= __('admin.media_optimize.how_title') ?></h4>
    <ul style="color:var(--text-muted);line-height:1.8;margin:0;padding-left:1.25rem;font-size:0.9rem;">
        <li><?= __('admin.media_optimize.how_text_1') ?></li>
        <li><?= __('admin.media_optimize.how_text_2') ?></li>
        <li><?= __('admin.media_optimize.how_text_3') ?></li>
        <li><?= __('admin.media_optimize.how_text_4') ?></li>
        <li><?= __('admin.media_optimize.how_text_5') ?></li>
    </ul>
</div>

<?php $content = ob_get_clean(); include dirname(__DIR__) . '/layouts/admin.php'; ?>
