<?php include __DIR__ . '/layout/header.php'; ?>

<style>
.settings-tabs {
    display: flex;
    border-bottom: 1px solid var(--admin-border);
    margin-bottom: 24px;
    gap: 8px;
    padding: 0 16px;
}
.settings-tab {
    padding: 12px 20px;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    color: var(--admin-text-2);
    font-weight: 600;
    font-size: 14px;
    transition: all 0.2s ease;
    margin-bottom: -1px;
}
.settings-tab:hover {
    color: var(--admin-text-1);
    background: var(--admin-surface-hover);
    border-radius: var(--r-sm) var(--r-sm) 0 0;
}
.settings-tab.active {
    border-bottom-color: var(--admin-primary);
    color: var(--admin-primary);
}
.settings-pane {
    display: none;
    animation: fadeIn 0.3s ease;
    padding: 0 16px 16px 16px;
}
.settings-pane.active {
    display: block;
}
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(5px); }
    to { opacity: 1; transform: translateY(0); }
}
</style>

<div class="admin-card" style="width: 100%; padding: 0; padding-top: 24px;">
    <div style="padding: 0 24px 16px 24px;">
        <h2 class="admin-card-title">Tema ve İçerik Yönetimi</h2>
    </div>

    <div class="settings-tabs">
        <div class="settings-tab active" data-target="pane-hero"><i class="fa fa-image" style="margin-right: 6px;"></i> Ana Sayfa & Banner</div>
        <div class="settings-tab" data-target="pane-json"><i class="fa fa-code" style="margin-right: 6px;"></i> Gelişmiş İçerikler (JSON)</div>
    </div>

    <form action="<?php echo $baseUrl; ?>/admin/theme/update" method="POST">
        
        <!-- PANE: HERO & BANNER -->
        <div id="pane-hero" class="settings-pane active">
            <!-- Header Top Bar -->
            <div class="admin-form-group">
                <label for="header_top_bar">Header Üst Bant Yazısı</label>
                <p style="font-size: 13px; color: var(--admin-text-3); margin-bottom: 8px;">Sitenin en üstünde görünen duyuru veya slogan (örn: 500 TL Üzeri Ücretsiz Kargo).</p>
                <input type="text" id="header_top_bar" name="header_top_bar" class="admin-input" value="<?php echo htmlspecialchars(isset($settings['header_top_bar']) ? $settings['header_top_bar'] : ''); ?>">
            </div>

            <!-- Hero Sliders -->
            <div class="admin-form-group" style="margin-top: 24px;">
                <label for="hero_sliders">Ana Sayfa Slider Görselleri</label>
                <p style="font-size: 13px; color: var(--admin-text-3); margin-bottom: 8px;">Her satıra bir görsel bağlantısı (URL veya klasör yolu) ekleyin.</p>
                <textarea id="hero_sliders" name="hero_sliders" rows="8" class="admin-textarea"><?php 
                    $sliders = isset($settings['hero_sliders']) ? $settings['hero_sliders'] : [];
                    echo htmlspecialchars(implode("\n", $sliders)); 
                ?></textarea>
            </div>
        </div>

        <!-- PANE: JSON DATA -->
        <div id="pane-json" class="settings-pane">
            <div style="background: rgba(59, 130, 246, 0.05); padding: 16px; border-radius: var(--r-md); border: 1px solid rgba(59, 130, 246, 0.2); margin-bottom: 24px;">
                <strong style="color: var(--admin-info); font-size: 14px;"><i class="fa fa-info-circle"></i> JSON Düzenleyici</strong>
                <p style="margin-top: 8px; font-size: 13px; color: var(--admin-text-2);">Bu alanlar gelişmiş içerik yönetimi içindir. Lütfen geçerli bir JSON formatı kullandığınızdan emin olun, aksi halde sitede görüntüleme hataları oluşabilir.</p>
            </div>

            <div class="form-grid">
                <div class="form-column">
                    <!-- Features Bar -->
                    <div class="admin-form-group">
                        <label for="features_bar">Özellik Çubuğu (Hızlı Kargo vb.)</label>
                        <textarea id="features_bar" name="features_bar" rows="12" class="admin-textarea" style="font-family: monospace; font-size: 13px;"><?php 
                            echo htmlspecialchars(json_encode(isset($settings['features_bar']) ? $settings['features_bar'] : [], JSON_PRETTY_PRINT | JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES)); 
                        ?></textarea>
                    </div>

                    <!-- Social Links -->
                    <div class="admin-form-group">
                        <label for="social_links">Sosyal Medya Linkleri</label>
                        <textarea id="social_links" name="social_links" rows="8" class="admin-textarea" style="font-family: monospace; font-size: 13px;"><?php 
                            echo htmlspecialchars(json_encode(isset($settings['social_links']) ? $settings['social_links'] : [], JSON_PRETTY_PRINT | JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES)); 
                        ?></textarea>
                    </div>
                </div>

                <div class="form-column">
                    <!-- Footer Partners -->
                    <div class="admin-form-group">
                        <label for="footer_partners">Çözüm Ortakları (Footer)</label>
                        <textarea id="footer_partners" name="footer_partners" rows="12" class="admin-textarea" style="font-family: monospace; font-size: 13px;"><?php 
                            echo htmlspecialchars(json_encode(isset($settings['footer_partners']) ? $settings['footer_partners'] : [], JSON_PRETTY_PRINT | JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES)); 
                        ?></textarea>
                    </div>

                    <!-- Footer Quick Links -->
                    <div class="admin-form-group">
                        <label for="footer_quick_links">Footer Hızlı Menü</label>
                        <textarea id="footer_quick_links" name="footer_quick_links" rows="8" class="admin-textarea" style="font-family: monospace; font-size: 13px;"><?php 
                            echo htmlspecialchars(json_encode(isset($settings['footer_quick_links']) ? $settings['footer_quick_links'] : [], JSON_PRETTY_PRINT | JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES)); 
                        ?></textarea>
                    </div>
                </div>
            </div>
        </div>

        <hr style="border: 0; border-top: 1px solid var(--admin-border); margin: 0 16px 20px 16px;">

        <div style="display: flex; justify-content: flex-end; padding: 0 16px 24px 16px;">
            <button type="submit" class="admin-btn admin-btn-primary">
                <i class="fa fa-save" style="margin-right:8px;"></i> Tema Ayarlarını Kaydet
            </button>
        </div>

    </form>
</div>

<script>
document.addEventListener('DOMContentLoaded', () => {
    const tabs = document.querySelectorAll('.settings-tab');
    const panes = document.querySelectorAll('.settings-pane');
    
    // Load active tab from localStorage
    const activeTabTarget = localStorage.getItem('admin_theme_active_tab');
    if (activeTabTarget) {
        tabs.forEach(t => t.classList.remove('active'));
        panes.forEach(p => p.classList.remove('active'));
        
        const tab = document.querySelector(`.settings-tab[data-target="${activeTabTarget}"]`);
        const pane = document.getElementById(activeTabTarget);
        if (tab && pane) {
            tab.classList.add('active');
            pane.classList.add('active');
        } else {
            tabs[0].classList.add('active');
            panes[0].classList.add('active');
        }
    }

    tabs.forEach(tab => {
        tab.addEventListener('click', () => {
            tabs.forEach(t => t.classList.remove('active'));
            panes.forEach(p => p.classList.remove('active'));
            
            tab.classList.add('active');
            document.getElementById(tab.dataset.target).classList.add('active');
            
            localStorage.setItem('admin_theme_active_tab', tab.dataset.target);
        });
    });
});
</script>

<?php include __DIR__ . '/layout/footer.php'; ?>
