<?php
/**
 * Plugin Name:       WP Rules 
 * Description:       Erstellt einen anpassbaren Regelbereich mit Tabs, Shortcode [meine_regeln] sowie Styling- und Import/Export-Funktionen.
 * Version:           1.0
 * Author:            M_Viper
 * Plugin URI:        https://git.viper.ipv64.net/M_Viper/wp-regel-plugin/releases
 * Author URI:        https://m-viper.de
 * Tags:              rules, tabs, shortcode, settings, admin, frontend, styling, import-export, responsive, accessibility
 * Requires at least: 6.7.2
 * Tested up to:      6.7.2
 * Requires PHP:      7.4
 * License:           GPL2
 * License URI:       https://www.gnu.org/licenses/gpl-2.0.html
 * Text Domain:       wp-rules
 * Support:           https://t.me/M_Viper04
 */


// Sicherheit: Verhindert direkten Zugriff auf die Datei
if (!defined('ABSPATH')) {
    exit;
}

// 1. Backend-Menüpunkt hinzufügen
function mrp_add_admin_menu() {
    add_options_page(
        'Regeln-Plugin Einstellungen',
        'Regeln-Plugin',
        'manage_options',
        'mein-regel-plugin',
        'mrp_options_page_html'
    );
}
add_action('admin_menu', 'mrp_add_admin_menu');

// 2. Einstellungen registrieren
function mrp_settings_init() {
    register_setting('mrp_plugin_page', 'mrp_settings');

    // Sektion für den Willkommens-Tab
    add_settings_section('mrp_welcome_section', 'Standard-Tab (Willkommen)', 'mrp_welcome_section_callback', 'mrp_plugin_page');
    add_settings_field('mrp_welcome_tab_editor', 'Inhalt des Willkommens-Tabs', 'mrp_welcome_tab_render', 'mrp_plugin_page', 'mrp_welcome_section');
    add_settings_field('mrp_welcome_tab_bg_color', 'Hintergrundfarbe des Willkommens-Tabs  ', 'mrp_welcome_tab_bg_color_render', 'mrp_plugin_page', 'mrp_welcome_section');
    add_settings_field('mrp_show_welcome_tab', 'Anzeige', 'mrp_show_welcome_tab_render', 'mrp_plugin_page', 'mrp_welcome_section');

    // Sektion für die Regeln (Inhalt)
    add_settings_section('mrp_rules_section', 'Regeln und Tabs verwalten', 'mrp_rules_section_callback', 'mrp_plugin_page');
    add_settings_field('mrp_repeater_field', '', 'mrp_repeater_field_render', 'mrp_plugin_page', 'mrp_rules_section');

    // Sektion für das Styling (Frontend)
    add_settings_section('mrp_style_section', 'Stil-Einstellungen (Frontend)', 'mrp_style_section_callback', 'mrp_plugin_page');
    add_settings_field('mrp_tab_title_font_size', 'Tab-Titel: Schriftgröße', 'mrp_tab_title_font_size_render', 'mrp_plugin_page', 'mrp_style_section');
    add_settings_field('mrp_tab_title_font_color', 'Tab-Titel: Schriftfarbe', 'mrp_tab_title_font_color_render', 'mrp_plugin_page', 'mrp_style_section');
    add_settings_field('mrp_rule_title_font_size', 'Regel-Titel: Schriftgröße', 'mrp_rule_title_font_size_render', 'mrp_plugin_page', 'mrp_style_section');
    add_settings_field('mrp_rule_title_font_color', 'Regel-Titel: Schriftfarbe', 'mrp_rule_title_font_color_render', 'mrp_plugin_page', 'mrp_style_section');
    add_settings_field('mrp_rule_content_font_size', 'Regel-Text: Schriftgröße', 'mrp_rule_content_font_size_render', 'mrp_plugin_page', 'mrp_style_section');
    add_settings_field('mrp_rule_content_font_color', 'Regel-Text: Schriftfarbe', 'mrp_rule_content_font_color_render', 'mrp_plugin_page', 'mrp_style_section');
    
    // NEU: Sektion für erweiterte Funktionen
    add_settings_section('mrp_advanced_section', 'Erweiterte Funktionen', 'mrp_advanced_section_callback', 'mrp_plugin_page');
    add_settings_field('mrp_enable_animations', 'Animationen', 'mrp_enable_animations_render', 'mrp_plugin_page', 'mrp_advanced_section');
    add_settings_field('mrp_enable_drag_drop', 'Sortierung', 'mrp_enable_drag_drop_render', 'mrp_plugin_page', 'mrp_advanced_section');
}
add_action('admin_init', 'mrp_settings_init');

// 3. Callbacks für die Sektionsbeschreibungen
function mrp_welcome_section_callback() { echo 'Bearbeiten Sie hier den Inhalt des standardmäßigen Willkommens-Tabs. Sie können diesen Tab auch vollständig ausblenden.'; }
function mrp_rules_section_callback() { echo 'Erstellen und verwalten Sie hier Ihre Tabs und die dazugehörigen Regeln.'; }
function mrp_style_section_callback() { echo 'Passen Sie das Erscheinungsbild der Regeln im Frontend an. Änderungen werden sofort angewendet.'; }
function mrp_advanced_section_callback() { echo 'Aktivieren oder deaktivieren Sie hier erweiterte Funktionen des Plugins.'; }

// NEU: Render-Funktionen für erweiterte Funktionen
function mrp_enable_animations_render() {
    $options = get_option('mrp_settings');
    $enabled = isset($options['enable_animations']) ? $options['enable_animations'] : '1';
    echo '<label><input type="checkbox" name="mrp_settings[enable_animations]" value="1" ' . checked(1, $enabled, false) . ' /> Sanfte Animationen für das Auf- und Zuklappen der Regeln aktivieren.</label>';
}
function mrp_enable_drag_drop_render() {
    $options = get_option('mrp_settings');
    $enabled = isset($options['enable_drag_drop']) ? $options['enable_drag_drop'] : '1';
    echo '<label><input type="checkbox" name="mrp_settings[enable_drag_drop]" value="1" ' . checked(1, $enabled, false) . ' /> Drag-and-Drop zum Sortieren von Tabs und Regeln im Backend aktivieren.</label>';
}

// Render-Funktion für die Checkbox des Willkommens-Tabs
function mrp_show_welcome_tab_render() {
    $options = get_option('mrp_settings');
    if ($options === false || !is_array($options)) {
        $is_checked = true;
    } else {
        $is_checked = isset($options['show_welcome_tab']);
    }
    echo '<label><input type="checkbox" name="mrp_settings[show_welcome_tab]" value="1" ' . checked($is_checked, true, false) . ' /> Willkommens-Tab im Frontend anzeigen</label>';
}

// Render-Funktion für den Willkommens-Tab
function mrp_welcome_tab_render() {
    $options = get_option('mrp_settings');
    $welcome_content = isset($options['welcome_tab_content']) ? $options['welcome_tab_content'] : '';
    
    echo '<br>'; // Abstand zur Checkbox
    
    $editor_id = 'mrp_welcome_tab_editor';
    $settings = array(
        'textarea_name' => 'mrp_settings[welcome_tab_content]',
        'media_buttons' => true,
        'textarea_rows' => 15,
        'teeny'         => true,
    );
    wp_editor($welcome_content, $editor_id, $settings);
}

// NEU: Render-Funktion für die Hintergrundfarbe des Willkommens-Tabs
function mrp_welcome_tab_bg_color_render() {
    $options = get_option('mrp_settings');
    $bg_color = isset($options['welcome_tab_bg_color']) ? $options['welcome_tab_bg_color'] : '#f0f0f0';
    echo "<input type='color' name='mrp_settings[welcome_tab_bg_color]' value='" . esc_attr($bg_color) . "'>";
    echo "<p class='description'>Wählen Sie eine Hintergrundfarbe. Diese wird automatisch mit 50% Transparenz im Frontend angezeigt.</p>";
}

// 4. Render-Funktionen für die Styling-Felder
function mrp_tab_title_font_size_render() {
    $options = get_option('mrp_settings'); $font_size = isset($options['tab_title_font_size']) ? $options['tab_title_font_size'] : '15';
    echo "<input type='number' name='mrp_settings[tab_title_font_size]' value='" . esc_attr($font_size) . "' min='10' max='30' style='width: 70px;'> px";
}
function mrp_tab_title_font_color_render() {
    $options = get_option('mrp_settings'); $font_color = isset($options['tab_title_font_color']) ? $options['tab_title_font_color'] : '#2c3e50';
    echo "<input type='color' name='mrp_settings[tab_title_font_color]' value='" . esc_attr($font_color) . "'>";
}
function mrp_rule_title_font_size_render() {
    $options = get_option('mrp_settings'); $font_size = isset($options['rule_title_font_size']) ? $options['rule_title_font_size'] : '16';
    echo "<input type='number' name='mrp_settings[rule_title_font_size]' value='" . esc_attr($font_size) . "' min='10' max='30' style='width: 70px;'> px";
}
function mrp_rule_title_font_color_render() {
    $options = get_option('mrp_settings'); $font_color = isset($options['rule_title_font_color']) ? $options['rule_title_font_color'] : '#2c3e50';
    echo "<input type='color' name='mrp_settings[rule_title_font_color]' value='" . esc_attr($font_color) . "'>";
}
function mrp_rule_content_font_size_render() {
    $options = get_option('mrp_settings'); $font_size = isset($options['rule_content_font_size']) ? $options['rule_content_font_size'] : '15';
    echo "<input type='number' name='mrp_settings[rule_content_font_size]' value='" . esc_attr($font_size) . "' min='10' max='30' style='width: 70px;'> px";
}
function mrp_rule_content_font_color_render() {
    $options = get_option('mrp_settings'); $font_color = isset($options['rule_content_font_color']) ? $options['rule_content_font_color'] : '#6c757d';
    echo "<input type='color' name='mrp_settings[rule_content_font_color]' value='" . esc_attr($font_color) . "'>";
}

// NEU: Hilfsfunktion zur Umwandlung von Hex zu RGBA
if (!function_exists('hex_to_rgba')) {
    function hex_to_rgba($hex, $alpha) {
        $hex = str_replace("#", "", $hex);
        if (strlen($hex) == 3) {
            $r = hexdec(substr($hex, 0, 1).substr($hex, 0, 1));
            $g = hexdec(substr($hex, 1, 1).substr($hex, 1, 1));
            $b = hexdec(substr($hex, 2, 1).substr($hex, 2, 1));
        } else {
            $r = hexdec(substr($hex, 0, 2));
            $g = hexdec(substr($hex, 2, 2));
            $b = hexdec(substr($hex, 4, 2));
        }
        return "rgba({$r}, {$g}, {$b}, {$alpha})";
    }
}

// 5. HTML für die Einstellungsseite
function mrp_options_page_html() {
    if (!current_user_can('manage_options')) return;
    
    // Lade Einstellungen für die Live-Vorschau
    $options = get_option('mrp_settings');

    // Lade jQuery UI Sortable, falls Drag-and-Drop aktiv ist
    $enable_drag_drop = isset($options['enable_drag_drop']) ? $options['enable_drag_drop'] : '1';
    if ($enable_drag_drop === '1') {
        wp_enqueue_script('jquery-ui-sortable');
    }
    
    ?>
    <div class="wrap">
        <h1><?php echo esc_html(get_admin_page_title()); ?></h1>

        <form action="options.php" method="post" id="mrp-settings-form">
            <?php settings_fields('mrp_plugin_page'); ?>
            
            <!-- NEU: Container für nebeneinander liegende Boxen -->
            <div class="mrp-two-column-container">
                <div class="mrp-column">
                    <div class="postbox">
                        <h2 class="hndle" style="padding: 8px 12px; font-size: 14px;"><?php _e('Erweiterte Funktionen'); ?></h2>
                        <div class="inside">
                            <table class="form-table" role="presentation">
                                <tbody><?php do_settings_fields('mrp_plugin_page', 'mrp_advanced_section'); ?></tbody>
                            </table>
                        </div>
                    </div>
                </div>
                
                <div class="mrp-column">
                    <div class="postbox">
                        <h2 class="hndle" style="padding: 8px 12px; font-size: 14px;"><?php _e('Stil-Einstellungen (Frontend)'); ?></h2>
                        <div class="inside">
                            <div class="mrp-style-settings">
                                <div class="mrp-style-row">
                                    <div class="mrp-style-field">
                                        <label><?php _e('Tab-Titel: Schriftgröße'); ?></label>
                                        <?php mrp_tab_title_font_size_render(); ?>
                                    </div>
                                    <div class="mrp-style-field">
                                        <label><?php _e('Tab-Titel: Schriftfarbe'); ?></label>
                                        <?php mrp_tab_title_font_color_render(); ?>
                                    </div>
                                </div>
                                
                                <div class="mrp-style-row">
                                    <div class="mrp-style-field">
                                        <label><?php _e('Regel-Titel: Schriftgröße'); ?></label>
                                        <?php mrp_rule_title_font_size_render(); ?>
                                    </div>
                                    <div class="mrp-style-field">
                                        <label><?php _e('Regel-Titel: Schriftfarbe'); ?></label>
                                        <?php mrp_rule_title_font_color_render(); ?>
                                    </div>
                                </div>
                                
                                <div class="mrp-style-row">
                                    <div class="mrp-style-field">
                                        <label><?php _e('Regel-Text: Schriftgröße'); ?></label>
                                        <?php mrp_rule_content_font_size_render(); ?>
                                    </div>
                                    <div class="mrp-style-field">
                                        <label><?php _e('Regel-Text: Schriftfarbe'); ?></label>
                                        <?php mrp_rule_content_font_color_render(); ?>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="postbox">
                <h2 class="hndle" style="padding: 8px 12px; font-size: 14px;"><?php _e('Standard-Tab (Willkommen)'); ?></h2>
                <div class="inside">
                    <?php do_settings_fields('mrp_plugin_page', 'mrp_welcome_section'); ?>
                </div>
            </div>

            <div class="postbox">
                 <h2 class="hndle" style="padding: 8px 12px; font-size: 14px;"><?php _e('Regeln und Tabs verwalten'); ?></h2>
                 <div class="inside">
                    <div id="mrp-repeater-wrapper">
                        <div id="tabs-container">
                            <?php $tabs = isset($options['tabs']) ? $options['tabs'] : array(); ?>
                            <?php if (!empty($tabs)) : ?>
                                <?php foreach ($tabs as $tab_index => $tab) : ?>
                                    <div class="backend-tab-card" data-index="<?php echo $tab_index; ?>">
                                        <div class="backend-tab-header">
                                            <h3><span class="dashicons dashicons-menu drag-handle"></span> <span class="dashicons dashicons-category"></span> <?php echo esc_html($tab['title'] ?: 'Unbenannter Tab'); ?></h3>
                                            <div class="header-actions">
                                                <button type="button" class="button toggle-collapse">Umschalten</button>
                                                <button type="button" class="button button-link-delete remove-tab">Löschen</button>
                                            </div>
                                        </div>
                                        <div class="backend-tab-content">
                                            <p><label>Tab-Titel (z.B. Minecraft)</label><input type="text" name="mrp_settings[tabs][<?php echo $tab_index; ?>][title]" value="<?php echo esc_attr($tab['title']); ?>" class="regular-text"></p>
                                            <h4>Regeln für diesen Tab</h4>
                                            <div class="rules-container">
                                                <?php if (!empty($tab['rules'])) : ?>
                                                    <?php foreach ($tab['rules'] as $rule_index => $rule) : ?>
                                                        <div class="backend-rule-card" data-rule-index="<?php echo $rule_index; ?>">
                                                            <div class="backend-rule-header">
                                                                <span class="dashicons dashicons-menu drag-handle"></span>
                                                                <strong><?php echo esc_html($rule['rule_title'] ?: 'Unbenannte Regel'); ?></strong>
                                                                <button type="button" class="button button-link-delete remove-rule">Regel entfernen</button>
                                                            </div>
                                                            <div class="backend-rule-content">
                                                                <p><label>Regel-Titel</label><input type="text" name="mrp_settings[tabs][<?php echo $tab_index; ?>][rules][<?php echo $rule_index; ?>][rule_title]" value="<?php echo esc_attr($rule['rule_title']); ?>" class="regular-text"></p>
                                                                <p><label>Regel-Text</label><textarea name="mrp_settings[tabs][<?php echo $tab_index; ?>][rules][<?php echo $rule_index; ?>][rule_content]" rows="4" class="large-text"><?php echo esc_textarea($rule['rule_content']); ?></textarea></p>
                                                            </div>
                                                        </div>
                                                    <?php endforeach; ?>
                                                <?php endif; ?>
                                            </div>
                                            <button type="button" class="button add-rule">+ Neue Regel hinzufügen</button>
                                        </div>
                                    </div>
                                <?php endforeach; ?>
                            <?php endif; ?>
                        </div>
                        <p style="margin-top: 20px;"><button type="button" id="add-tab" class="button button-primary button-hero">+ Neuen Tab hinzufügen</button></p>
                    </div>
                 </div>
            </div>

            <div class="postbox">
                <h2 class="hndle" style="padding: 8px 12px; font-size: 14px;"><?php _e('Import/Export'); ?></h2>
                <div class="inside">
                    <p>Hier können Sie Ihre Einstellungen und Regeln exportieren, um sie zu sichern oder auf einer anderen Seite zu importieren.</p>
                    <p>
                        <button type="button" id="mrp-export-button" class="button button-secondary">Einstellungen exportieren</button>
                    </p>
                    <p>
                        <label for="mrp-import-file">Einstellungen importieren:</label>
                        <input type="file" id="mrp-import-file" name="mrp-import-file" accept=".json">
                        <button type="button" id="mrp-import-button" class="button button-secondary">Importieren</button>
                    </p>
                </div>
            </div>

            <?php submit_button('Alle Änderungen speichern', 'primary large', 'submit', true); ?>
        </form>
    </div>

    <!-- NEU: Inline-CSS für Backend -->
    <style>
        /* CSS für den Backend-Repeater */
        #mrp-repeater-wrapper{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif}.backend-tab-card{background:#fff;border:1px solid #c3c4c7;border-radius:8px;margin-bottom:20px;box-shadow:0 1px 1px rgba(0,0,0,.04)}.backend-tab-header{display:flex;justify-content:space-between;align-items:center;padding:12px 15px;background:#f8f9f9;border-bottom:1px solid #c3c4c7;border-radius:8px 8px 0 0;cursor:pointer}.backend-tab-header h3{margin:0;font-size:1.2em;display:flex;align-items:center}.backend-tab-header h3 .dashicons{margin-right:10px;color:#50575e}.backend-tab-content{padding:20px;display:none}.backend-tab-card.collapsed .backend-tab-content{display:none}.backend-tab-card:not(.collapsed) .backend-tab-content{display:block}.backend-rule-card{background:#fcfcfc;border:1px dashed #dcdcde;border-radius:5px;margin-bottom:15px}.backend-rule-header{display:flex;justify-content:space-between;align-items:center;padding:10px 15px;background:#f6f7f7;border-bottom:1px dashed #dcdcde;cursor:pointer}.backend-rule-content{padding:15px;display:none}.backend-rule-card.collapsed .backend-rule-content{display:none}.backend-rule-card:not(.collapsed) .backend-rule-content{display:block}.header-actions{display:flex;gap:10px}#mrp-repeater-wrapper p label{display:block;font-weight:600;margin-bottom:5px;color:#1e1e1e}#mrp-repeater-wrapper .button-primary{background-color:#0065cc;border-color:#0065cc}#mrp-repeater-wrapper .button-primary:hover{background-color:#0053a6;border-color:#0053a6}#mrp-repeater-wrapper .button-hero{font-size:14px;height:46px;line-height:44px;padding:0 36px}
        
        /* NEU: CSS für Drag-and-Drop */
        .drag-handle { cursor: move; color: #8c8f94; margin-right: 10px; }
        .ui-sortable-helper { background-color: #f9f9f9; opacity: 0.8; }
        .rules-container.ui-sortable { min-height: 50px; border: 1px dashed transparent; }
        .rules-container.ui-sortable-placeholder { border: 1px dashed #ccc; background: #f0f0f0; border-radius: 5px; margin: 0 0 15px 0; }
        
        /* NEU: CSS für nebeneinander liegende Boxen */
        .mrp-two-column-container {
            display: flex;
            gap: 20px;
            margin-top: 20px;
        }
        
        .mrp-column {
            flex: 1;
        }
        
        /* NEU: CSS für kompakte Stil-Einstellungen */
        .mrp-style-settings {
            display: flex;
            flex-direction: column;
            gap: 15px;
        }
        
        .mrp-style-row {
            display: flex;
            gap: 20px;
        }
        
        .mrp-style-field {
            flex: 1;
        }
        
        .mrp-style-field label {
            display: block;
            font-weight: 600;
            margin-bottom: 5px;
        }
        
        /* Responsives Design für kleinere Bildschirme */
        @media screen and (max-width: 1024px) {
            .mrp-two-column-container {
                flex-direction: column;
            }
        }
        
        @media screen and (max-width: 768px) {
            .mrp-style-row {
                flex-direction: column;
                gap: 10px;
            }
        }
    </style>

    <!-- NEU: Inline-JavaScript für alle neuen Funktionen -->
    <script>
        jQuery(document).ready(function($) {
            var tabCount = $('.backend-tab-card').length;
            var $tabsContainer = $('#tabs-container');
            var $form = $('#mrp-settings-form');
            var enableDragDrop = $('input[name="mrp_settings[enable_drag_drop]"]').is(':checked');

            // === FUNKTIONEN FÜR TABS UND REGELN ===
            $tabsContainer.find('.backend-tab-card').addClass('collapsed');
            
            $('#add-tab').click(function() {
                var template = $('#tab-template').html().replace(/INDEX/g, tabCount);
                $tabsContainer.append(template);
                if (enableDragDrop) {
                    initializeSortable();
                }
                tabCount++;
            });

            $(document).on('click', '.add-rule', function(e) {
                e.stopPropagation();
                var $tabCard = $(this).closest('.backend-tab-card');
                var tabIndex = $tabCard.data('index');
                var ruleCount = $tabCard.find('.backend-rule-card').length;
                var template = $('#rule-template').html().replace(/TAB_INDEX/g, tabIndex).replace(/RULE_INDEX/g, ruleCount);
                $tabCard.find('.rules-container').append(template);
                if (enableDragDrop) {
                    initializeSortable();
                }
            });

            $(document).on('click', '.backend-tab-header, .toggle-collapse', function(e) {
                e.stopPropagation();
                $(this).closest('.backend-tab-card').toggleClass('collapsed');
            });
            
            $(document).on('click', '.backend-rule-header', function(e) {
                e.stopPropagation();
                $(this).closest('.backend-rule-card').toggleClass('collapsed');
            });

            $(document).on('click', '.remove-tab', function(e) {
                e.stopPropagation();
                if (confirm('Möchten Sie diesen Tab und alle seine Regeln wirklich entfernen?')) {
                    $(this).closest('.backend-tab-card').remove();
                }
            });

            $(document).on('click', '.remove-rule', function(e) {
                e.stopPropagation();
                $(this).closest('.backend-rule-card').remove();
            });

            // === FUNKTIONEN FÜR DRAG-AND-DROP ===
            function initializeSortable() {
                if (!enableDragDrop) return;
                
                $tabsContainer.sortable({
                    handle: '.backend-tab-header .drag-handle',
                    placeholder: 'ui-sortable-placeholder',
                    stop: function(event, ui) {
                        reindexTabs();
                    }
                });

                $('.rules-container').sortable({
                    handle: '.backend-rule-header .drag-handle',
                    placeholder: 'ui-sortable-placeholder',
                    stop: function(event, ui) {
                        reindexRules($(this));
                    }
                });
            }
            if (enableDragDrop) {
                initializeSortable();
            }

            function reindexTabs() {
                $tabsContainer.find('.backend-tab-card').each(function(i) {
                    var $card = $(this);
                    var newIndex = i;
                    $card.attr('data-index', newIndex);
                    
                    $card.find('input, textarea').each(function() {
                        var name = $(this).attr('name');
                        var newName = name.replace(/tabs\[\d+\]/, 'tabs[' + newIndex + ']');
                        $(this).attr('name', newName);
                    });
                });
            }

            function reindexRules($rulesContainer) {
                $rulesContainer.find('.backend-rule-card').each(function(i) {
                    var $card = $(this);
                    var newIndex = i;
                    var $tabCard = $rulesContainer.closest('.backend-tab-card');
                    var tabIndex = $tabCard.data('index');
                    
                    $card.find('input, textarea').each(function() {
                        var name = $(this).attr('name');
                        var newName = name.replace(/rules\[\d+\]/, 'rules[' + newIndex + ']');
                        $(this).attr('name', newName);
                    });
                });
            }

            // === FUNKTIONEN FÜR IMPORT/EXPORT ===
            $('#mrp-export-button').on('click', function() {
                var nonce = $('#mrp-settings-form input[name="_wpnonce"]').val();
                $.post(ajaxurl, { 
                    action: 'mrp_export_settings',
                    _wpnonce: nonce
                }, function(response) {
                    if (response.success) {
                        var dataStr = "data:text/json;charset=utf-8," + encodeURIComponent(JSON.stringify(response.data, null, 2));
                        var downloadAnchorNode = document.createElement('a');
                        downloadAnchorNode.setAttribute("href", dataStr);
                        downloadAnchorNode.setAttribute("download", "regeln-plugin-export.json");
                        document.body.appendChild(downloadAnchorNode);
                        downloadAnchorNode.click();
                        downloadAnchorNode.remove();
                    } else {
                        alert('Export fehlgeschlagen: ' + response.data);
                    }
                });
            });

            $('#mrp-import-button').on('click', function() {
                var fileInput = document.getElementById('mrp-import-file');
                if (!fileInput.files.length) {
                    alert('Bitte wählen Sie eine Datei zum Importieren aus.');
                    return;
                }
                var file = fileInput.files[0];
                var reader = new FileReader();
                reader.onload = function(e) {
                    try {
                        var importedData = JSON.parse(e.target.result);
                        var nonce = $('#mrp-settings-form input[name="_wpnonce"]').val();
                        $.post(ajaxurl, {
                            action: 'mrp_import_settings',
                            _wpnonce: nonce,
                            data: JSON.stringify(importedData)
                        }, function(response) {
                            if (response.success) {
                                alert('Einstellungen erfolgreich importiert! Die Seite wird neu geladen.');
                                location.reload();
                            } else {
                                alert('Import fehlgeschlagen: ' + response.data);
                            }
                        });
                    } catch (error) {
                        alert('Fehler beim Lesen der JSON-Datei. Stellen Sie sicher, dass es sich um eine gültige Export-Datei handelt.');
                    }
                };
                reader.readAsText(file);
            });
        });
    </script>

    <!-- Templates für neue Tabs/Regeln -->
    <template id="tab-template"><div class="backend-tab-card" data-index="INDEX"><div class="backend-tab-header"><h3><span class="dashicons dashicons-menu drag-handle"></span> <span class="dashicons dashicons-category"></span> Neuer Tab</h3><div class="header-actions"><button type="button" class="button toggle-collapse">Umschalten</button><button type="button" class="button button-link-delete remove-tab">Löschen</button></div></div><div class="backend-tab-content"><p><label>Tab-Titel (z.B. Minecraft)</label><input type="text" name="mrp_settings[tabs][INDEX][title]" value="" class="regular-text"></p><h4>Regeln für diesen Tab</h4><div class="rules-container"></div><button type="button" class="button add-rule">+ Neue Regel hinzufügen</button></div></div></template>
    <template id="rule-template"><div class="backend-rule-card" data-rule-index="RULE_INDEX"><div class="backend-rule-header"><span class="dashicons dashicons-menu drag-handle"></span><strong>Neue Regel</strong><button type="button" class="button button-link-delete remove-rule">Regel entfernen</button></div><div class="backend-rule-content"><p><label>Regel-Titel</label><input type="text" name="mrp_settings[tabs][TAB_INDEX][rules][RULE_INDEX][rule_title]" value="" class="regular-text"></p><p><label>Regel-Text</label><textarea name="mrp_settings[tabs][TAB_INDEX][rules][RULE_INDEX][rule_content]" rows="4" class="large-text"></textarea></p></div></div></template>
    <?php
}
function mrp_repeater_field_render() {}

// NEU: AJAX-Handler für Import/Export
add_action('wp_ajax_mrp_export_settings', 'mrp_ajax_export_settings');
add_action('wp_ajax_mrp_import_settings', 'mrp_ajax_import_settings');

function mrp_ajax_export_settings() {
    check_ajax_referer('mrp_plugin_page-options', '_wpnonce');
    if (!current_user_can('manage_options')) wp_die();
    
    $settings = get_option('mrp_settings');
    wp_send_json_success($settings);
}

function mrp_ajax_import_settings() {
    check_ajax_referer('mrp_plugin_page-options', '_wpnonce');
    if (!current_user_can('manage_options')) wp_die();

    $imported_data = json_decode(stripslashes($_POST['data']), true);
    if (is_array($imported_data)) {
        update_option('mrp_settings', $imported_data);
        wp_send_json_success();
    } else {
        wp_send_json_error('Ungültiges JSON-Format.');
    }
}


// 6. Shortcode für die Frontend-Anzeige
function mrp_display_rules_shortcode($atts) {
    $options = get_option('mrp_settings');
    $tabs = isset($options['tabs']) ? $options['tabs'] : array();
    
    // Korrekte Logik für den Checkbox-Status
    if ($options === false || !is_array($options)) {
        $show_welcome_tab = true;
    } else {
        $show_welcome_tab = isset($options['show_welcome_tab']);
    }
    
    $enable_animations = isset($options['enable_animations']) ? $options['enable_animations'] : '1';

    if (empty($tabs) && !$show_welcome_tab) {
        return '<p style="text-align:center; padding: 40px; color: #666;">Keine Regeln wurden im Backend konfiguriert.</p>';
    }

    // Frontend-Script und Style registrieren
    wp_enqueue_style('mrp-frontend-style', plugin_dir_url(__FILE__) . 'style.css', array(), '8.0');
    wp_enqueue_script('mrp-frontend-script', plugin_dir_url(__FILE__) . 'script.js', array('jquery'), '8.0', true);
    
    // Daten an das Frontend-Script übergeben
    wp_localize_script('mrp-frontend-script', 'mrp_frontend_vars', [
        'enable_animations' => $enable_animations,
    ]);

    // Beginne die Ausgabepufferung
    ob_start();
    ?>
    <style id="mrp-custom-inline-styles">
        /* Dynamische Stile für die Tab-Titel */
        .regel-plugin-container .regel-tab-button {
            <?php if (!empty($options['tab_title_font_size'])): ?>font-size: <?php echo intval($options['tab_title_font_size']); ?>px !important;<?php endif; ?>
            <?php if (!empty($options['tab_title_font_color'])): ?>color: <?php echo esc_attr($options['tab_title_font_color']); ?> !important;<?php endif; ?>
        }
        /* Dynamische Stile für die Regel-Titel - NEU: Greift direkt auf den Text im Span zu */
        .regel-plugin-container .regel-title-text {
            <?php if (!empty($options['rule_title_font_size'])): ?>font-size: <?php echo intval($options['rule_title_font_size']); ?>px !important;<?php endif; ?>
            <?php if (!empty($options['rule_title_font_color'])): ?>color: <?php echo esc_attr($options['rule_title_font_color']); ?> !important;<?php endif; ?>
        }
        /* Dynamische Stile für den Regel-Text */
        .regel-plugin-container .regel-item .regel-content .regel-content-inner, .regel-plugin-container .regel-item .regel-content .regel-content-inner p {
            <?php if (!empty($options['rule_content_font_size'])): ?>font-size: <?php echo intval($options['rule_content_font_size']); ?>px !important;<?php endif; ?>
            <?php if (!empty($options['rule_content_font_color'])): ?>color: <?php echo esc_attr($options['rule_content_font_color']); ?> !important;<?php endif; ?>
        }
        .regel-plugin-container .regel-item:nth-child(even) { background-color: #f5f5f5 !important; border-radius: 5px; }
        <?php if ($show_welcome_tab): ?>
        #tab-welcome { background-color: <?php echo esc_attr(hex_to_rgba($options['welcome_tab_bg_color'] ?? '#f0f0f0', 0.4)); ?> !important; padding: 15px; border-radius: 5px; }
        <?php endif; ?>
    </style>
    <div class="regel-plugin-container">
        <div class="regel-tabs-nav">
            <?php
            // HTML für die Tab-Buttons sauber in PHP zusammenbauen
            $nav_buttons_html = '';
            $is_first_tab = true;

            // Willkommens-Tab hinzufügen
            if ($show_welcome_tab) {
                $nav_buttons_html .= '<button class="regel-tab-button active" data-tab="tab-welcome">Willkommen</button>';
                $is_first_tab = false;
            }

            // Benutzerdefinierte Tabs hinzufügen
            if (!empty($tabs)) {
                foreach ($tabs as $index => $tab) {
                    $active_class = $is_first_tab ? 'active' : '';
                    $nav_buttons_html .= '<button class="regel-tab-button ' . $active_class . '" data-tab="tab-' . $index . '">' . esc_html($tab['title']) . '</button>';
                    $is_first_tab = false;
                }
            }
            
            // Alle Buttons auf einmal ausgeben
            echo $nav_buttons_html;
            ?>
        </div>
        <div class="regel-tabs-content">
            <?php $first_panel = true;
            if ($show_welcome_tab) { $welcome_content = $options['welcome_tab_content'] ?? ''; ?>
                <div id="tab-welcome" class="regel-tab-panel active"><div class="regel-content-inner"><?php echo wpautop(wp_kses_post($welcome_content)); ?></div></div>
                <?php $first_panel = false;
            }
            foreach ($tabs as $index => $tab): ?>
                <div id="tab-<?php echo $index; ?>" class="regel-tab-panel <?php echo $first_panel ? 'active' : ''; ?>">
                    <?php if (!empty($tab['rules'])): foreach ($tab['rules'] as $rule): ?>
                        <div class="regel-item">
                            <button class="regel-toggle">
                                <span class="regel-icon icon-plus">+</span>
                                <span class="regel-icon icon-minus">−</span>
                                <span class="regel-title-text"><?php echo esc_html($rule['rule_title']); ?></span>
                            </button>
                            <div class="regel-content">
                                <div class="regel-content-inner"><?php echo wpautop(wp_kses_post($rule['rule_content'])); ?></div>
                            </div>
                        </div>
                    <?php endforeach; else: ?>
                        <p style="text-align:center; padding: 20px; color: #888;">Für diesen Tab wurden noch keine Regeln erstellt.</p>
                    <?php endif; ?>
                </div>
                <?php $first_panel = false; endforeach; ?>
        </div>
    </div>
    <?php
    return ob_get_clean();
}
add_shortcode('meine_regeln', 'mrp_display_rules_shortcode');

add_action('wp_enqueue_scripts', function() {
    $frontend_css = "
        .regel-plugin-container{width:100%;margin:20px 0;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen-Sans,Ubuntu,Cantarell,'Helvetica Neue',sans-serif}.regel-plugin-container .regel-tabs-nav{border-bottom:1px solid #ddd;display:flex;margin-bottom:20px}.regel-plugin-container .regel-tab-button{background:none;border:none;padding:10px 20px;cursor:pointer;border-bottom:2px solid transparent;transition:all 0.2s ease-in-out;font-weight:500}.regel-plugin-container .regel-tab-button:hover{border-bottom-color:#ccc}.regel-plugin-container .regel-tab-button.active{border-bottom-color:#0073aa}.regel-plugin-container .regel-tabs-content{background:#fff;padding:20px;border-radius:5px;border:1px solid #ddd}.regel-plugin-container .regel-tab-panel{display:none}.regel-plugin-container .regel-tab-panel.active{display:block}.regel-plugin-container .regel-item{border-bottom:1px solid #eee;padding:15px 0}.regel-plugin-container .regel-item:last-child{border-bottom:none}.regel-plugin-container .regel-toggle{width:100%;text-align:left;background:none;border:none;padding:0;cursor:pointer;font-weight:600;display:flex;align-items:center;justify-content:space-between}.regel-plugin-container .regel-toggle .regel-icon{font-size:20px;margin-right:10px;transition:transform 0.2s ease-in-out}.regel-plugin-container .regel-toggle .icon-minus{display:none}.regel-plugin-container .regel-toggle.active .icon-plus{display:none}.regel-plugin-container .regel-toggle.active .icon-minus{display:inline-block}.regel-plugin-container .regel-content{margin-top:10px;padding-left:30px;display:none;overflow:hidden}.regel-plugin-container .regel-content.active{display:block}
    ";
    wp_add_inline_style('mrp-frontend-style', $frontend_css);

    // JS
    $frontend_js = "
        jQuery(document).ready(function($) {
            var enableAnimations = mrp_frontend_vars.enable_animations === '1';
            $('.regel-plugin-container').on('click', '.regel-tab-button', function() {
                var targetTab = $(this).data('tab');
                $('.regel-tab-button').removeClass('active');
                $('.regel-tab-panel').removeClass('active');
                $(this).addClass('active');
                $('#' + targetTab).addClass('active');
            });
            $('.regel-plugin-container').on('click', '.regel-toggle', function() {
                var $content = $(this).next('.regel-content');
                var $toggle = $(this);
                if (enableAnimations) {
                    $content.slideToggle(300);
                } else {
                    $content.toggle();
                }
                $toggle.toggleClass('active');
            });
        });
    ";
    wp_add_inline_script('mrp-frontend-script', $frontend_js);
});