<div class="tab-pane fade" id="homepage" role="tabpanel">
    <div class="card">
        <div class="card-header">
            <h5 class="card-title mb-0">Homepage</h5>
            <p class="text-muted small mb-0 mt-1">Choose a template, customize content with the rich text editor, then save. This page is shown at <code>/</code> for visitors.</p>
        </div>
        <div class="card-body">
            <?php if (isset($component)) { $__componentOriginalc5b05be77d49b527672263c41bb5efdb = $component; } ?>
<?php if (isset($attributes)) { $__attributesOriginalc5b05be77d49b527672263c41bb5efdb = $attributes; } ?>
<?php $component = Illuminate\View\AnonymousComponent::resolve(['view' => 'eliteadmin::components.wizard-stepper','data' => ['steps' => ['Choose Template', 'Add Content', 'Review & Save'],'current' => 1,'class' => 'homepage-settings-stepper mb-4']] + (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag ? $attributes->all() : [])); ?>
<?php $component->withName('eliteadmin::wizard-stepper'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php if (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag): ?>
<?php $attributes = $attributes->except(\Illuminate\View\AnonymousComponent::ignoredParameterNames()); ?>
<?php endif; ?>
<?php $component->withAttributes(['steps' => \Illuminate\View\Compilers\BladeCompiler::sanitizeComponentAttribute(['Choose Template', 'Add Content', 'Review & Save']),'current' => 1,'class' => 'homepage-settings-stepper mb-4']); ?>
<?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__attributesOriginalc5b05be77d49b527672263c41bb5efdb)): ?>
<?php $attributes = $__attributesOriginalc5b05be77d49b527672263c41bb5efdb; ?>
<?php unset($__attributesOriginalc5b05be77d49b527672263c41bb5efdb); ?>
<?php endif; ?>
<?php if (isset($__componentOriginalc5b05be77d49b527672263c41bb5efdb)): ?>
<?php $component = $__componentOriginalc5b05be77d49b527672263c41bb5efdb; ?>
<?php unset($__componentOriginalc5b05be77d49b527672263c41bb5efdb); ?>
<?php endif; ?>

            <?php
                $selectedTemplate = old('homepage_template', $settings['homepage_template'] ?? config('homepage.default_template', 'showcase'));
                if (! array_key_exists($selectedTemplate, $homepageTemplates)) {
                    $selectedTemplate = config('homepage.default_template', 'showcase');
                }
                $heroImageUrl = old('homepage_hero_image_url', $settings['homepage_hero_image_url'] ?? null);
            ?>

            <div class="homepage-settings-step" data-homepage-step="1">
                <h6 class="mb-3">Step 1 — Choose a template</h6>
                <p class="text-muted small mb-3">Click a layout to select it. The selected card will show a blue border.</p>
                <div class="row g-3">
                    <?php $__currentLoopData = $homepageTemplates; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $key => $template): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                        <div class="col-md-4">
                            <input
                                type="radio"
                                class="btn-check"
                                name="homepage_template"
                                value="<?php echo e($key); ?>"
                                id="homepage_template_<?php echo e($key); ?>"
                                autocomplete="off"
                                <?php if($selectedTemplate === $key): echo 'checked'; endif; ?>
                            >
                            <label class="homepage-template-option card h-100 border-2 mb-0" for="homepage_template_<?php echo e($key); ?>">
                                <div class="card-body">
                                    <div class="homepage-template-preview homepage-template-preview-<?php echo e($key); ?> rounded mb-3"></div>
                                    <h6 class="mb-1"><?php echo e($template['label']); ?></h6>
                                    <p class="text-muted small mb-0"><?php echo e($template['description']); ?></p>
                                </div>
                            </label>
                        </div>
                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                </div>
                <?php $__errorArgs = ['homepage_template'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?><div class="text-danger small mt-2"><?php echo e($message); ?></div><?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                <div class="d-flex justify-content-end mt-4">
                    <button type="button" class="btn btn-primary" data-homepage-next>Next: Add Content</button>
                </div>
            </div>

            <div class="homepage-settings-step d-none" data-homepage-step="2">
                <h6 class="mb-3">Step 2 — Add content</h6>
                <div class="row g-3">
                    <div class="col-md-6">
                        <label for="homepage_headline" class="form-label">Headline</label>
                        <input type="text" name="homepage_headline" id="homepage_headline"
                               class="form-control <?php $__errorArgs = ['homepage_headline'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?> is-invalid <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>"
                               value="<?php echo e(old('homepage_headline', $settings['homepage_headline'] ?? '')); ?>"
                               placeholder="Welcome to your platform">
                        <?php $__errorArgs = ['homepage_headline'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?><div class="invalid-feedback"><?php echo e($message); ?></div><?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                    </div>
                    <div class="col-md-6">
                        <label for="homepage_subtitle" class="form-label">Subtitle</label>
                        <input type="text" name="homepage_subtitle" id="homepage_subtitle"
                               class="form-control <?php $__errorArgs = ['homepage_subtitle'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?> is-invalid <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>"
                               value="<?php echo e(old('homepage_subtitle', $settings['homepage_subtitle'] ?? '')); ?>"
                               placeholder="Manage your platform with confidence">
                        <?php $__errorArgs = ['homepage_subtitle'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?><div class="invalid-feedback"><?php echo e($message); ?></div><?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                    </div>
                    <div class="col-12">
                        <label for="homepage_hero_image" class="form-label">Hero image</label>
                        <p class="text-muted small mb-2">Optional banner shown on Showcase and Classic layouts. Recommended 1600×900 or larger (JPG, PNG, WebP, max 4 MB).</p>
                        <div class="homepage-hero-upload">
                            <?php if($heroImageUrl): ?>
                                <div class="d-flex flex-wrap align-items-start gap-3 mb-3">
                                    <img src="<?php echo e($heroImageUrl); ?>" alt="Current hero image" class="homepage-hero-preview" id="homepage_hero_preview">
                                    <div>
                                        <div class="form-check">
                                            <input class="form-check-input" type="checkbox" name="remove_homepage_hero_image" id="remove_homepage_hero_image" value="1">
                                            <label class="form-check-label" for="remove_homepage_hero_image">Remove current image on save</label>
                                        </div>
                                    </div>
                                </div>
                            <?php else: ?>
                                <img src="" alt="" class="homepage-hero-preview d-none mb-3" id="homepage_hero_preview">
                            <?php endif; ?>
                            <input type="file" name="homepage_hero_image" id="homepage_hero_image"
                                   class="form-control <?php $__errorArgs = ['homepage_hero_image'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?> is-invalid <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>"
                                   accept="image/jpeg,image/png,image/webp">
                            <?php $__errorArgs = ['homepage_hero_image'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?><div class="invalid-feedback d-block"><?php echo e($message); ?></div><?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                        </div>
                    </div>
                    <div class="col-12">
                        <?php if (isset($component)) { $__componentOriginal7c1bd5e998a105bb5b98950e273f0456 = $component; } ?>
<?php if (isset($attributes)) { $__attributesOriginal7c1bd5e998a105bb5b98950e273f0456 = $attributes; } ?>
<?php $component = Illuminate\View\AnonymousComponent::resolve(['view' => 'eliteadmin::components.rich-editor','data' => ['name' => 'homepage_description','id' => 'homepage_description','label' => 'Description','value' => old('homepage_description', $settings['homepage_description'] ?? ''),'placeholder' => 'Describe your platform — use formatting, lists, and links.','height' => '240px','toolbar' => 'standard']] + (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag ? $attributes->all() : [])); ?>
<?php $component->withName('eliteadmin::rich-editor'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php if (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag): ?>
<?php $attributes = $attributes->except(\Illuminate\View\AnonymousComponent::ignoredParameterNames()); ?>
<?php endif; ?>
<?php $component->withAttributes(['name' => 'homepage_description','id' => 'homepage_description','label' => 'Description','value' => \Illuminate\View\Compilers\BladeCompiler::sanitizeComponentAttribute(old('homepage_description', $settings['homepage_description'] ?? '')),'placeholder' => 'Describe your platform — use formatting, lists, and links.','height' => '240px','toolbar' => 'standard']); ?>
<?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__attributesOriginal7c1bd5e998a105bb5b98950e273f0456)): ?>
<?php $attributes = $__attributesOriginal7c1bd5e998a105bb5b98950e273f0456; ?>
<?php unset($__attributesOriginal7c1bd5e998a105bb5b98950e273f0456); ?>
<?php endif; ?>
<?php if (isset($__componentOriginal7c1bd5e998a105bb5b98950e273f0456)): ?>
<?php $component = $__componentOriginal7c1bd5e998a105bb5b98950e273f0456; ?>
<?php unset($__componentOriginal7c1bd5e998a105bb5b98950e273f0456); ?>
<?php endif; ?>
                    </div>
                    <div class="col-md-6">
                        <label for="homepage_button_text" class="form-label">Login Button Text</label>
                        <input type="text" name="homepage_button_text" id="homepage_button_text"
                               class="form-control <?php $__errorArgs = ['homepage_button_text'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?> is-invalid <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>"
                               value="<?php echo e(old('homepage_button_text', $settings['homepage_button_text'] ?? 'Admin Login')); ?>">
                        <?php $__errorArgs = ['homepage_button_text'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?><div class="invalid-feedback"><?php echo e($message); ?></div><?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                    </div>
                    <div class="col-md-6">
                        <label class="form-label d-block">&nbsp;</label>
                        <a href="<?php echo e(url('/')); ?>" target="_blank" class="btn btn-outline-secondary">
                            <i class="bi bi-box-arrow-up-right me-1"></i> Preview homepage
                        </a>
                    </div>
                    <div class="col-12">
                        <label class="form-label">Feature highlights</label>
                        <p class="text-muted small">Three short points shown on the homepage (optional).</p>
                    </div>
                    <div class="col-md-4">
                        <label for="homepage_feature_1" class="form-label">Feature 1</label>
                        <input type="text" name="homepage_feature_1" id="homepage_feature_1" class="form-control"
                               value="<?php echo e(old('homepage_feature_1', $settings['homepage_feature_1'] ?? '')); ?>"
                               placeholder="Real-time analytics dashboard">
                    </div>
                    <div class="col-md-4">
                        <label for="homepage_feature_2" class="form-label">Feature 2</label>
                        <input type="text" name="homepage_feature_2" id="homepage_feature_2" class="form-control"
                               value="<?php echo e(old('homepage_feature_2', $settings['homepage_feature_2'] ?? '')); ?>"
                               placeholder="Team collaboration tools">
                    </div>
                    <div class="col-md-4">
                        <label for="homepage_feature_3" class="form-label">Feature 3</label>
                        <input type="text" name="homepage_feature_3" id="homepage_feature_3" class="form-control"
                               value="<?php echo e(old('homepage_feature_3', $settings['homepage_feature_3'] ?? '')); ?>"
                               placeholder="Advanced reporting & exports">
                    </div>
                </div>
                <div class="d-flex justify-content-between mt-4">
                    <button type="button" class="btn btn-outline-secondary" data-homepage-back>Back</button>
                    <button type="button" class="btn btn-primary" data-homepage-next>Next: Review</button>
                </div>
            </div>

            <div class="homepage-settings-step d-none" data-homepage-step="3">
                <h6 class="mb-3">Step 3 — Review &amp; save</h6>
                <div class="border rounded p-4 bg-light">
                    <dl class="row mb-0">
                        <dt class="col-sm-3">Template</dt>
                        <dd class="col-sm-9" data-homepage-review="template">—</dd>
                        <dt class="col-sm-3">Headline</dt>
                        <dd class="col-sm-9" data-homepage-review="headline">—</dd>
                        <dt class="col-sm-3">Subtitle</dt>
                        <dd class="col-sm-9" data-homepage-review="subtitle">—</dd>
                        <dt class="col-sm-3">Description</dt>
                        <dd class="col-sm-9 homepage-review-description" data-homepage-review="description">—</dd>
                        <dt class="col-sm-3">Login button</dt>
                        <dd class="col-sm-9" data-homepage-review="button_text">—</dd>
                        <dt class="col-sm-3">Features</dt>
                        <dd class="col-sm-9" data-homepage-review="features">—</dd>
                        <dt class="col-sm-3">Hero image</dt>
                        <dd class="col-sm-9" data-homepage-review="hero_image">—</dd>
                    </dl>
                </div>
                <div class="d-flex justify-content-between mt-4">
                    <button type="button" class="btn btn-outline-secondary" data-homepage-back>Back</button>
                    <button type="submit" name="homepage_settings_save" value="1" class="btn btn-primary">Save Settings</button>
                </div>
            </div>
        </div>
    </div>
</div>

<?php $__env->startPush('styles'); ?>
<link href="<?php echo e(asset('assets/css/homepage.css')); ?>" rel="stylesheet">
<style>
    .homepage-template-option {
        cursor: pointer;
        transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
    }

    .homepage-template-option:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
    }

    .btn-check:checked + .homepage-template-option {
        border-color: var(--bs-primary) !important;
        box-shadow: 0 0 0 0.2rem rgba(65, 84, 241, 0.15);
    }

    .homepage-settings-stepper .wizard-step {
        cursor: pointer;
    }
</style>
<?php $__env->stopPush(); ?>

<?php $__env->startPush('scripts'); ?>
<script src="<?php echo e(asset('assets/js/rich-editor.js')); ?>"></script>
<script>
    document.addEventListener('DOMContentLoaded', function () {
        const root = document.getElementById('homepage');
        if (!root) return;

        const steps = root.querySelectorAll('[data-homepage-step]');
        const stepper = document.querySelector('.homepage-settings-stepper');
        let currentStep = 1;

        const templateLabels = <?php echo json_encode(collect($homepageTemplates)->mapWithKeys(fn ($t, $k) => [$k => $t['label']]), 512) ?>;

        function showStep(step) {
            currentStep = step;
            steps.forEach(function (el) {
                el.classList.toggle('d-none', parseInt(el.dataset.homepageStep, 10) !== step);
            });

            if (stepper) {
                stepper.querySelectorAll('.wizard-step').forEach(function (el, index) {
                    const stepNumber = index + 1;
                    el.classList.toggle('active', stepNumber === step);
                    el.classList.toggle('completed', stepNumber < step);
                });
                const progressText = stepper.previousElementSibling;
                if (progressText) {
                    progressText.innerHTML = 'Step <strong>' + step + '</strong> of <strong>3</strong>';
                }
            }

            if (step === 2) {
                window.initRichEditors(root);
            }

            if (step === 3) {
                if (typeof window.syncRichEditors === 'function') {
                    window.syncRichEditors(root);
                }
                updateReview();
            }
        }

        function selectedTemplate() {
            const checked = root.querySelector('input[name="homepage_template"]:checked');
            return checked ? checked.value : '';
        }

        function descriptionValue() {
            const hidden = root.querySelector('#homepage_description-input');
            if (hidden && hidden.value.trim() !== '') {
                return hidden.value;
            }

            const editor = root.querySelector('#homepage_description .ql-editor');
            return editor ? editor.innerHTML : '';
        }

        function updateReview() {
            const template = selectedTemplate();
            root.querySelector('[data-homepage-review="template"]').textContent = templateLabels[template] || '—';
            root.querySelector('[data-homepage-review="headline"]').textContent =
                root.querySelector('#homepage_headline')?.value || '—';
            root.querySelector('[data-homepage-review="subtitle"]').textContent =
                root.querySelector('#homepage_subtitle')?.value || '—';

            const descriptionEl = root.querySelector('[data-homepage-review="description"]');
            const descriptionHtml = descriptionValue();
            if (descriptionEl) {
                descriptionEl.innerHTML = descriptionHtml.trim() !== '' ? descriptionHtml : '—';
            }

            root.querySelector('[data-homepage-review="button_text"]').textContent =
                root.querySelector('#homepage_button_text')?.value || '—';

            const features = [
                root.querySelector('#homepage_feature_1')?.value,
                root.querySelector('#homepage_feature_2')?.value,
                root.querySelector('#homepage_feature_3')?.value,
            ].filter(function (value) { return value && value.trim() !== ''; });

            root.querySelector('[data-homepage-review="features"]').textContent =
                features.length ? features.join(' · ') : '—';

            const heroReview = root.querySelector('[data-homepage-review="hero_image"]');
            const heroInput = root.querySelector('#homepage_hero_image');
            const removeHero = root.querySelector('#remove_homepage_hero_image');
            const heroPreview = root.querySelector('#homepage_hero_preview');
            let heroText = '—';

            if (removeHero && removeHero.checked) {
                heroText = 'Will be removed on save';
            } else if (heroInput && heroInput.files && heroInput.files.length > 0) {
                heroText = heroInput.files[0].name + ' (new upload)';
            } else if (heroPreview && heroPreview.src && !heroPreview.classList.contains('d-none')) {
                heroText = 'Current image kept';
            }

            if (heroReview) {
                heroReview.textContent = heroText;
            }
        }

        root.querySelectorAll('[data-homepage-next]').forEach(function (button) {
            button.addEventListener('click', function () {
                if (currentStep === 1 && !selectedTemplate()) {
                    alert('Please select a homepage template.');
                    return;
                }

                if (currentStep === 2 && typeof window.syncRichEditors === 'function') {
                    window.syncRichEditors(root);
                }

                showStep(Math.min(currentStep + 1, 3));
            });
        });

        root.querySelectorAll('[data-homepage-back]').forEach(function (button) {
            button.addEventListener('click', function () {
                showStep(Math.max(currentStep - 1, 1));
            });
        });

        if (stepper) {
            stepper.querySelectorAll('.wizard-step[data-step]').forEach(function (el) {
                el.addEventListener('click', function () {
                    const step = parseInt(el.dataset.step, 10);
                    if (!Number.isNaN(step)) {
                        if (step >= 2 && !selectedTemplate()) {
                            alert('Please select a homepage template first.');
                            return;
                        }
                        if (step === 3 && typeof window.syncRichEditors === 'function') {
                            window.syncRichEditors(root);
                        }
                        showStep(step);
                    }
                });
            });
        }

        root.querySelectorAll('input[name="homepage_template"]').forEach(function (input) {
            input.addEventListener('change', function () {
                root.querySelectorAll('.homepage-template-option').forEach(function (card) {
                    card.classList.remove('is-selected');
                });
                if (input.checked) {
                    input.nextElementSibling?.classList.add('is-selected');
                }
            });
        });

        const checkedTemplate = root.querySelector('input[name="homepage_template"]:checked');
        if (checkedTemplate) {
            checkedTemplate.nextElementSibling?.classList.add('is-selected');
        } else {
            const firstTemplate = root.querySelector('input[name="homepage_template"]');
            if (firstTemplate) {
                firstTemplate.checked = true;
                firstTemplate.nextElementSibling?.classList.add('is-selected');
            }
        }

        <?php if($errors->hasAny(['homepage_template', 'homepage_headline', 'homepage_subtitle', 'homepage_description', 'homepage_button_text', 'homepage_hero_image'])): ?>
            showStep(<?php echo e($errors->has('homepage_template') ? 1 : 2); ?>);
        <?php endif; ?>

        const heroInput = root.querySelector('#homepage_hero_image');
        const heroPreview = root.querySelector('#homepage_hero_preview');

        if (heroInput && heroPreview) {
            heroInput.addEventListener('change', function () {
                const file = heroInput.files && heroInput.files[0];
                if (!file) {
                    return;
                }

                const reader = new FileReader();
                reader.onload = function (event) {
                    heroPreview.src = event.target.result;
                    heroPreview.classList.remove('d-none');
                };
                reader.readAsDataURL(file);
            });
        }
    });
</script>
<?php $__env->stopPush(); ?>
<?php /**PATH D:\RABI\rabi\module-laravel-platform\apps\admin\resources\views/settings/partials/homepage.blade.php ENDPATH**/ ?>