<?php
 
 /**
 * =============================================================================
 * @package         Blue Raven (Free Version)
 * @Plugin URI      https://enterrahost.com/plugins/blue-raven
 * 
 * @Author          EnterraHost
 * @Author URI      https://enterrahost.com
 * @License         GPL-2.0-or-later
 *  
 * @Copyright       (c) 2025 EnterraHost
 * @Contents        Generates the Form Edit Block
 *
 * =============================================================================
 * 
 * || INDEX:
 * ||   - EMAILS FORM LIST
 * || 
 * =============================================================================
 */

if ( ! defined( 'ABSPATH' ) ) exit; 

/*
============================================================
    EDIT FORM
============================================================
*/

$bot_data = json_decode($form_row['bot_prevention'] ?? '{}', true);

$provider   = $bot_data['provider'] ?? 'none';
$site_key   = $bot_data['site_key'] ?? '';
$secret_key = $bot_data['secret_key'] ?? '';

$messages = json_decode($form_row['messages'] ?? '{}', true);

$success_message = $messages['success'] ?? '';
$error_message   = $messages['error'] ?? '';
$bot_message     = $messages['bot'] ?? '';
$missing_message = $messages['missing'] ?? '';

$form_data = json_decode($form_row['form'] ?? '[]', true);
$form_data = is_array($form_data) ? $form_data : [];
$form = BlueRaven_buildHTML($form_data);
?>

<div>
    <h3><?php esc_html_e('Editing : ', 'blue-raven'); ?> <span id="editing-name"><?php echo ' ' . esc_html($form_row['title']); ?></span></h3><input type="hidden" id='edit-id' value="<?php echo esc_attr( $form_row['id'] ); ?>">
</div>
<h4><?php esc_html_e( 'Main Elements', 'blue-raven' ); ?></h4>
<div>
    <button class="enterra-button enterra-secondary-button-color spacing-right-small block-edit" data-type="title" id="br-mf-t-b"> <?php esc_html_e( 'Title', 'blue-raven' ); ?> </button>
    <button class="enterra-button enterra-secondary-button-color spacing-right-small block-edit" data-type="form" id="br-mf-f-b"> <?php esc_html_e( 'Form', 'blue-raven' ); ?> </button>
    <button class="enterra-button enterra-secondary-button-color spacing-right-small block-edit" data-type="message" id="br-mf-m-b"> <?php esc_html_e( 'Message', 'blue-raven' ); ?> </button>
    <button class="enterra-button enterra-secondary-button-color spacing-right-small block-edit" data-type="submit" id="br-mf-s-b"> <?php esc_html_e( 'Submit Button', 'blue-raven' ); ?> </button> 
    <button class="enterra-button enterra-secondary-button-color spacing-right-small block-edit" data-type="admin" id="br-mf-a-b">  <?php esc_html_e( 'Form Admin', 'blue-raven' ); ?> </button>
</div>

<h4><?php esc_html_e( 'Builder Blocks', 'blue-raven' ); ?></h4>
<div class="flex-right" style='margin-bottom:1.5rem;'>
    <button class="enterra-button enterra-secondary-button-color spacing-right-small block-edit" data-type="label" id="br-mf-lb-b">  <?php esc_html_e( 'Label', 'blue-raven' ); ?> </button>
    <button class="enterra-button enterra-secondary-button-color spacing-right-small block-edit" data-type="input" id="br-mf-ip-b"> <?php esc_html_e( 'Input', 'blue-raven' ); ?> </button>
    <button class="enterra-button enterra-secondary-button-color spacing-right-small block-edit" data-type="text" id="br-mf-ta-b"><?php esc_html_e( 'Text Area', 'blue-raven' ); ?> </button>
    <button class="enterra-button enterra-secondary-button-color block-edit" data-type="dropdown" id="br-mf-dd-b"> <?php esc_html_e( 'Dropdowns', 'blue-raven' ); ?></button>
</div>
<section id='mail-canvas' style='background-color: white; min-height: 5rem; color: black; padding: 2rem;'><?php 
// Output trusted HTML saved from admin input.
// This HTML is sanitized on save with wp_kses to allow only safe tags and attributes.
// Raw output is safe and necessary to preserve complex form markup.
// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Input sanitized on save
echo $form;
?></section>
<div style='min-height: 10rem;'>
    <div id='form-tool-box' class='border-bottom-white' style='display: none;'>
        <p class='enterra-highlight indent-one' style='margin: 1rem; 0rem'>
            <?php esc_html_e('Styling is applied by the theme. any Extra CSS can be done in Custom CSS.', 'blue-raven'); ?>
            <?php esc_html_e("'Names' for your blocks are needed to pull the values into your email ", 'blue-raven'); ?>
        </p>
        <div class='flex-sb'>
            <h4 id="tool-box-title"><?php esc_html_e('Tool Box for the Selected Block.', 'blue-raven'); ?></h4>
            <input type="text" name="element-ID" id="element-ID" placeholder="<?php esc_attr_e('Block ID', 'blue-raven'); ?>" class="br-input" style="width:20rem; height: 1.5rem; margin-top: 1rem;" value="">
        </div>
        <div class='flex-sb tool-box-body'>
            <div style='width: 20rem; padding-right: 1rem; border-right: white solid 4px;' id='tool-box-select-parent'>
                <div style="padding-right:1rem;" id="tool-box-select">
                    <div style='display:block;' id='tool-box-select-opening-buttons'>
                        <p class="enterra-button enterra-secondary-button-color" style="display:none; margin:0.5rem 0;" id="tool-box-botton-text"><?php esc_html_e( 'Text', 'blue-raven' ); ?></p>
                        <p class="enterra-button enterra-secondary-button-color" style="display:none; margin:0.5rem 0;" id="tool-box-botton-block"><?php esc_html_e( 'Block', 'blue-raven' ); ?></p><p class="enterra-button enterra-secondary-button-color" style="display:none; margin:0.5rem 0;" id="tool-box-botton-spacing"><?php esc_html_e( 'Spacing', 'blue-raven' ); ?></p>
                        <p class="enterra-button enterra-secondary-button-color" style="display:none; margin:0.5rem 0;" id="tool-box-botton-dropdown"><?php esc_html_e( 'Dropdown', 'blue-raven' ); ?></p>
                        <p class="enterra-button enterra-secondary-button-color" style="display:none; margin:0.5rem 0;" id="tool-box-botton-adv"><?php esc_html_e( 'Advanced', 'blue-raven' ); ?> </p>
                        <p class="enterra-button enterra-secondary-button-color" style="display:none; margin:0.5rem 0;" id="tool-box-botton-messages"><?php esc_html_e( 'Messages', 'blue-raven' ); ?></p>
                        <p class="enterra-button enterra-secondary-button-color" style="display:none; margin:0.5rem 0;" id="tool-box-botton-bot"><?php esc_html_e( 'Bot Prevention', 'blue-raven' ); ?></p>
                        <p class="enterra-button enterra-secondary-button-color" style="display:none; margin:0.5rem 0;" id="tool-box-botton-send"><?php esc_html_e( 'Sending', 'blue-raven' ); ?></p>
                    </div>
                    <div style='display:block;'>
                        <div class="flex-sb" id="tool-box-botton-extras" style="display: none; margin:0.5rem 0;">
                            <span class="enterra-button enterra-secondary-button-color" style="display:block;" id="remove-block">❌</span>
                            <span class="enterra-button enterra-secondary-button-color" style="display:block;" id="copy-block">📋</span>
                        </div>
                        <div class="flex-right">
                            <button class="enterra-button" id="post-create-mail-block" style="margin:0.5rem 0; width: 10rem;">
                                <?php esc_html_e( 'Done', 'blue-raven' ); ?>
                            </button>
                        </div>
                    </div>
                </div>
            </div>
            <div style='width: 70%; margin: 0rem 0rem 0rem 2rem;' id='text-edit-block-parent'>
                <!-- Text / Font / Decoration -->
                <div id="text-edit-block" style='display: none; margin-bottom: 2rem;'>
                    <div class='edit-setting-block' data-setting-type='text' style='margin-bottom: 1rem;'>
                        <label for="element-text" class="text-center">
                            <p class="no-margin-padding spacing-right-small text-center"><?php esc_html_e('Text or Placeholder', 'blue-raven'); ?></p>
                        </label>
                        <input type="text" name="element-text" id="element-text" placeholder="<?php esc_attr_e('The Text in your element', 'blue-raven'); ?>" class="br-input" style="width:100%;" value="">
                    </div>
                    <div class='edit-setting-block' data-setting-type='name' style='margin-bottom: 1rem;'>
                        <label for="element-text" class="text-center">
                            <p class="no-margin-padding spacing-right-small text-center"><?php esc_html_e('Name (*Required for From Submission*)', 'blue-raven'); ?></p>
                        </label>
                        <input type="text" name="element-name" id="element-name" placeholder="<?php esc_attr_e('The [Name] in your element ( for form submission and labels )', 'blue-raven'); ?>" class="br-input" style="width:100%;" value="">
                    </div>
                    <div class='edit-setting-block' data-setting-type='font-family' style='margin-bottom: 1rem;'>
                        <label for="element-text" class="text-center">
                            <p class="no-margin-padding spacing-right-small text-center"><?php esc_html_e('Font', 'blue-raven'); ?></p>
                        </label>
                        <select id="element-font-family" name="element-font-family" class="br-dropdown" style="width: 100%; padding: 0.5rem; margin-right: 1rem">
                            <option value="" selected><?php esc_html_e('Default', 'blue-raven'); ?></option>
                            <?php
								global $wp_styles;
								$fonts = [
									'Arial','Verdana','Georgia','Times New Roman','Courier New','Tahoma','Trebuchet MS','Franklin Gothic Medium',
									'Gill Sans','Helvetica','Perpetua','Rockwell','Symbol','MS Serif','MS Sans Serif','Candara','Consolas',
									'Lucida Console','Lucida Sans Unicode','Palatino Linotype','Segoe UI','Century Gothic','Comic Sans MS',
									'Impact','Geneva','Book Antiqua','Arial Black'
								];
								foreach ($fonts as $font) {
									echo '<option value="' . esc_attr($font) . '">' . esc_html($font) . '</option>';
								}
							?>
                        </select>
                    </div>
                    <div class='edit-setting-block' data-setting-type='font-shape' style='margin-bottom: 1rem; display:flex;'>
                        <label class="br-checkbox spacing-right" style="width: 50%;">
                            <input type="checkbox" name="underline" style="display: none;" id="font-shape-underline">
                            <span class="br-check-mark"></span>
                            <span><?php esc_html_e('Underline', 'blue-raven'); ?></span>
                        </label>
                        <label class="br-checkbox spacing-right" style="width: 50%;">
                            <input type="checkbox" name="bold" style="display: none;" id="font-shape-bold">
                            <span class="br-check-mark"></span>
                            <span><?php esc_html_e('Bold', 'blue-raven'); ?></span>
                        </label>
                        <label class="br-checkbox spacing-right" style="width: 50%;">
                            <input type="checkbox" name="italic" style="display: none;" id="font-shape-italic">
                            <span class="br-check-mark"></span>
                            <span><?php esc_html_e('Italic', 'blue-raven'); ?></span>
                        </label>
                    </div>
                    <div class='edit-setting-block' data-setting-type='font-size' style='margin-bottom: 1rem;'>
                        <label for="element-text" class="text-center">
                            <p class="no-margin-padding spacing-right-small text-center"><?php esc_html_e('Font Size (px)', 'blue-raven'); ?></p>
                        </label>
                        <input type="text" name="element-font-size" id="element-font-size" placeholder="<?php esc_attr_e('12px', 'blue-raven'); ?>" class="br-input" style="width:100%;" value="">
                    </div>
                    <div class='edit-setting-block' data-setting-type='text-color' style='margin-bottom: 1rem;'>
                        <label for="element-text" class="text-center">
                            <p class="no-margin-padding spacing-right-small text-center"><?php esc_html_e('Color (HEX)', 'blue-raven'); ?></p>
                        </label>
                        <input type="text" name="element-font-color" id="element-font-color" placeholder="<?php esc_attr_e('#ffffff', 'blue-raven'); ?>" class="br-input" style="width:100%;" value="">
                    </div>
                    
                    <p class="no-margin-padding spacing-right-small"><?php esc_html_e('Align text in Block', 'blue-raven'); ?></p>

                    <div class='edit-setting-block' data-setting-type='text-align' style='margin-bottom: 1rem;margin-top: 0.5rem; display:flex;'>
                        <label class="br-checkbox spacing-right" style="width: 50%;">
                            <input type="radio" name="text-align" style="display: none;" id="text-align-left">
                            <span class="br-check-mark"></span>
                            <span><?php esc_html_e('Left', 'blue-raven'); ?></span>
                        </label>
                        <label class="br-checkbox spacing-right" style="width: 50%;">
                            <input type="radio" name="text-align" style="display: none;" id="text-align-center">
                            <span class="br-check-mark"></span>
                            <span><?php esc_html_e('Center', 'blue-raven'); ?></span>
                        </label>
                        <label class="br-checkbox spacing-right" style="width: 50%;">
                            <input type="radio" name="text-align" style="display: none;" id="text-align-right">
                            <span class="br-check-mark"></span>
                            <span><?php esc_html_e('Right', 'blue-raven'); ?></span>
                        </label>
                    </div>
                    <div class='edit-setting-block' data-setting-type='text-align-vertical' style='margin-bottom: 1rem; display:flex;'>
                        <label class="br-checkbox spacing-right" style="width: 50%;">
                            <input type="checkbox" name="text-align-vertical" style="display: none;" id="text-align-vertical">
                            <span class="br-check-mark"></span>
                            <span><?php esc_html_e('Vertical Center', 'blue-raven'); ?></span>
                        </label>
                    </div>
                </div>
            
                <!-- Background, Border, Height -->
                 
                <div id="block-edit-block" style='display: none; margin-bottom: 2rem;'>
                    
                    <div class='edit-setting-block' data-setting-type='justify-self' style='margin-bottom: 1rem;margin-top: 0.5rem;'>
                        <h4>Block </h4>
                        
                        <div id='edit-display-block'>
                            <p class="no-margin-padding spacing-right-small" style='margin-bottom: 0.5rem;'><?php esc_html_e('Will this block sit next to other blocks (inline), or will it stretch across the whole line by itself (block-level)?', 'blue-raven'); ?></p>

                            <div class='edit-display-block' data-setting-type='font-display-block' style='margin-bottom: 1rem; display:flex;'>
                                <label class="br-checkbox spacing-right" style="width: 50%;">
                                    <input type="radio" name="display-type" value="inline-block" style="display: none;" id="display-inline">
                                    <span class="br-check-mark"></span>
                                    <span><?php esc_html_e('Inline Block', 'blue-raven'); ?></span>
                                </label>
                                <label class="br-checkbox spacing-right" style="width: 50%;">
                                    <input type="radio" name="display-type" value="block" style="display: none;" id="display-block">
                                    <span class="br-check-mark"></span>
                                    <span><?php esc_html_e('Full Block', 'blue-raven'); ?></span>
                                </label>
                            </div>
                        </div>
                        
                        <div id='block-justify'>
                            <p class="no-margin-padding spacing-right-small"><?php esc_html_e('Button Position', 'blue-raven'); ?></p>
                            
                            <div class='flex-sb'>
                                <label class="br-checkbox spacing-right" style="width: 50%;">
                                    <input type="radio" name="justify" style="display: none;" id="justify-self-left">
                                    <span class="br-check-mark"></span>
                                    <span><?php esc_html_e('Position Left', 'blue-raven'); ?></span>
                                </label>
                                <label class="br-checkbox spacing-right" style="width: 50%;">
                                    <input type="radio" name="justify" style="display: none;" id="justify-self-center">
                                    <span class="br-check-mark"></span>
                                    <span><?php esc_html_e('Position Center', 'blue-raven'); ?></span>
                                </label>
                                <label class="br-checkbox spacing-right" style="width: 50%;">
                                    <input type="radio" name="justify" style="display: none;" id="justify-self-right">
                                    <span class="br-check-mark"></span>
                                    <span><?php esc_html_e('Position Right', 'blue-raven'); ?></span>
                                </label>
                            </div>
                        </div>
                    </div>
                    
                    <div class='edit-setting-block' data-setting-type='background-color' style='margin-bottom: 1rem;'>
                        <label for="element-text" class="text-center">
                            <p class="no-margin-padding spacing-right-small text-center"><?php esc_html_e('Background Color (HEX)', 'blue-raven'); ?></p>
                        </label>
                        <input type="text" name="element-background-color" id="element-background-color" placeholder="<?php esc_attr_e('#ffffff', 'blue-raven'); ?>" class="br-input" style="width:100%;" value="">
                    </div>
                    
                    <fieldset>
                        <h4><?php esc_html_e('Border', 'blue-raven'); ?></h4>
                            <div class='edit-setting-block' data-setting-type='border-width' style='margin-bottom: 1rem;'>
                            <label for="element-border-width" class="text-center">
                                <p class="no-margin-padding spacing-right-small text-center"><?php esc_html_e('Width', 'blue-raven'); ?></p>
                            </label>
                            <input type="text" name="element-border-width" id="element-border-width" placeholder="<?php esc_attr_e('0px | 0rem | 0em', 'blue-raven'); ?>" class="br-input" style="width:100%;" value="">
                        </div>
                        <div class='edit-setting-block' data-setting-type='border-color' style='margin-bottom: 1rem;'>
                            <label for="element-border-color" class="text-center">
                                <p class="no-margin-padding spacing-right-small text-center"><?php esc_html_e('Color (HEX)', 'blue-raven'); ?></p>
                            </label>
                            <input type="text" name="element-border-color" id="element-border-color" placeholder="<?php esc_attr_e('#ffffff', 'blue-raven'); ?>" class="br-input" style="width:100%;" value="">
                        </div>
                        <div class='edit-setting-block' data-setting-type='border-radius' style='margin-bottom: 1rem;'>
                            <label for="element-border-radius" class="text-center">
                                <p class="no-margin-padding spacing-right-small text-center"><?php esc_html_e('Radius (px)', 'blue-raven'); ?></p>
                            </label>
                            <input type="text" name="element-border-radius" id="element-border-radius" placeholder="<?php esc_attr_e('0px', 'blue-raven'); ?>" class="br-input" style="width:100%;" value="">
                        </div>
                    </fieldset>
                    
                    <fieldset>
                        <h4><?php esc_html_e('Height', 'blue-raven'); ?></h4>
                        <div class='edit-setting-block' data-setting-type='height-min' style='margin-bottom: 1rem;'>
                            <label for="element-height-min" class="text-center">
                                <p class="no-margin-padding spacing-right-small text-center"><?php esc_html_e('Min Height (px)', 'blue-raven'); ?></p>
                            </label>
                            <input type="text" name="element-height-min" id="element-height-min" placeholder="<?php esc_attr_e('0px | 0rem | 0% | 0em', 'blue-raven'); ?>" class="br-input" style="width:100%;" value="">
                        </div>
                        <div class='edit-setting-block' data-setting-type='height-max' style='margin-bottom: 1rem;'>
                            <label for="element-height-max" class="text-center">
                                <p class="no-margin-padding spacing-right-small text-center"><?php esc_html_e('Max Height (px)', 'blue-raven'); ?></p>
                            </label>
                            <input type="text" name="element-height-max" id="element-height-max" placeholder="<?php esc_attr_e('0px | 0rem | 0% | 0em', 'blue-raven'); ?>" class="br-input" style="width:100%;" value="">
                        </div>
                    </fieldset>
                    
                    <fieldset>
                        <h4><?php esc_html_e('Width', 'blue-raven'); ?></h4>
                        <div class='edit-setting-block' data-setting-type='width-min' style='margin-bottom: 1rem;'>
                            <label for="element-width-min" class="text-center">
                                <p class="no-margin-padding spacing-right-small text-center"><?php esc_html_e('Min Width (px)', 'blue-raven'); ?></p>
                            </label>
                            <input type="text" name="element-width-min" id="element-width-min" placeholder="<?php esc_attr_e('0px | 0rem | 0% | 0em', 'blue-raven'); ?>" class="br-input" style="width:100%;" value="">
                        </div>
                        <div class='edit-setting-block' data-setting-type='width-max' style='margin-bottom: 1rem;'>
                            <label for="element-width-max" class="text-center">
                                <p class="no-margin-padding spacing-right-small text-center"><?php esc_html_e('Max width (px)', 'blue-raven'); ?></p>
                            </label>
                            <input type="text" name="element-width-max" id="element-width-max" placeholder="<?php esc_attr_e('0px | 0rem | 0% | 0em', 'blue-raven'); ?>" class="br-input" style="width:100%;" value="">
                        </div>
                    </fieldset>
                    
                </div>
            
                <!-- Spacing -->
                <div id="spacing-edit-block" style='display: none; margin-bottom: 2rem;'>
                    <?php
                        function BlueRaven_render_edit_setting_block($type = 'padding') {
                            $directions = ['top', 'right', 'bottom', 'left'];
                            ?><h4><?php echo esc_html(ucfirst($type)); ?></h4><?php
                            foreach ($directions as $dir) {
                                $setting_key = "{$type}-{$dir}";
                                $input_id = "element-{$setting_key}";
                                $label_text = ucfirst($dir);
                                ?>
                                <div class='edit-setting-block' data-setting-type='<?php echo esc_attr($setting_key); ?>' style='margin-bottom: 1rem;'>
                                    <label for="<?php echo esc_attr($input_id); ?>" class="text-center">
                                        <p class="no-margin-padding spacing-right-small text-center"> <?php echo esc_html($label_text); ?> </p>
                                    </label>
                                    <input type="text" name="<?php echo esc_attr($input_id); ?>" id="<?php echo esc_attr($input_id); ?>" placeholder="<?php esc_attr_e('0px | 0rem | 0% | 0em | auto', 'blue-raven'); ?>" class="br-input" style="width:100%;" value="" >
                                </div>
                                <?php 
                            }
                        }
                        
                        BlueRaven_render_edit_setting_block('padding');
                        BlueRaven_render_edit_setting_block('margin');
                    ?>
                </div>
            
                <!-- Dropdown Items -->
                <div id="drop-down-edit-block" style='display: none; margin-bottom: 2rem;'>
                    <div class='flex-sb' style='margin: 0rem 0rem 1rem 0rem; width: 50%;'>
                        <div class='edit-setting-block' data-setting-type='height-min' style='margin-bottom: 1rem;'>
                            <label for="element-dropdown-item[]" class="text-center">
                                <p class="no-margin-padding spacing-right-small text-center"><?php esc_html_e('Add Dropdown Item', 'blue-raven'); ?></p>
                            </label>
                        </div>
                        <button class='enterra-button' id='element-dropdown-item-add'><?php esc_html_e('Add More', 'blue-raven'); ?></button>
                    </div>
                    <div id='drop-down-edit-block-inner'></div>
                </div>
            
                <!-- Advanced Settings -->
                <div id="advacned-edit-block" style='display: none; margin-bottom: 2rem;'>
                    <div class='edit-setting-block' data-setting-type='hide' style='margin-bottom: 1rem;' id='hide-element-check'>
                        <label class="br-checkbox spacing-right" style="width: 50%;">
                            <input type="checkbox" name="hide-element" style="display: none;" id="edit-adv-hide">
                            <span class="br-check-mark"></span>
                            <span><?php esc_html_e('Hide Element', 'blue-raven'); ?></span>
                        </label>
                    </div>

                    <div class='edit-setting-block' data-setting-type='required' style='margin-bottom: 1rem;' id='required-element-check'>
                        <label class="br-checkbox spacing-right" style="width: 50%;">
                            <input type="checkbox" name="required" style="display: none;" id="edit-adv-required">
                            <span class="br-check-mark"></span>
                            <span><?php esc_html_e('Required', 'blue-raven'); ?></span>
                        </label>
                    </div>
                    
                    <div class='edit-setting-block' data-setting-type='input-type' style='margin-bottom: 1rem;' id='input-element-type'>
                        <label for="element-text" class="text-center">
                            <p class="no-margin-padding spacing-right-small text-center"><?php esc_html_e('Input Type', 'blue-raven'); ?></p>
                        </label>
                        <select id="element-input-type" name="element-input-type" class="br-dropdown" style="width: 100%; padding: 0.5rem; margin-right: 1rem">
                            <?php
								$input_types = ['text', 'tel', 'email', 'number', 'url', 'date', 'hidden'];
								foreach ($input_types as $type) {
									echo '<option value="' . esc_attr($type) . '">' . esc_html($type) . '</option>';
								}
							?>
                        </select>
                    </div>
                    
                    <div class='edit-setting-block' data-setting-type='div-split' style='margin-bottom: 1rem;' id='hide-on-input'>
                        <label for="element-text" class="text-center">
                            <p class="no-margin-padding spacing-right-small text-center"><?php esc_html_e('Split Form', 'blue-raven'); ?></p>
                        </label>
                        <select id="element-div-split" name="element-div-split" class="br-dropdown" style="width: 100%; padding: 0.5rem; margin-right: 1rem">
                            <option value="no-split"><?php esc_html_e('No split', 'blue-raven'); ?></option>
                            <option value="33-66"><?php esc_html_e('33 / 66', 'blue-raven'); ?></option>
                            <option value="40-60"><?php esc_html_e('40 / 60', 'blue-raven'); ?></option>
                            <option value="50-50"><?php esc_html_e('50 / 50', 'blue-raven'); ?></option>
                            <option value="60-40"><?php esc_html_e('60 / 40', 'blue-raven'); ?></option>
                            <option value="66-33"><?php esc_html_e('66 / 33', 'blue-raven'); ?></option>
                        </select>
                    </div>
                </div>
                
                <!-- Messages -->
                
                <div id="message-edit-block" style='display: none; margin-bottom: 2rem;'>
                    <div class='success-message-block' data-setting-type='text' style='margin-bottom: 1rem;'>
                        <label for="success-message">
                            <p class="no-margin-padding spacing-right-small text-center"><?php esc_html_e('Success Message', 'blue-raven'); ?></p>
                        </label>
                        <input type="text" name="success-message" id="success-message" placeholder="<?php esc_attr_e('Thank you for contacting us, We will get back to you as sooon as possable.', 'blue-raven'); ?>" class="br-input" style="width:100%;" value="<?php echo esc_attr($success_message); ?>"> </div>
                    <div class='error-message-block' data-setting-type='text' style='margin-bottom: 1rem;'>
                        <label for="error-message">
                            <p class="no-margin-padding spacing-right-small text-center"><?php esc_html_e('Error Message', 'blue-raven'); ?></p>
                        </label>
                        <input type="text" name="error-message" id="error-message" placeholder="<?php esc_attr_e('Unfortunately your message failed to send, Please give us a call.', 'blue-raven'); ?>" class="br-input" style="width:100%;" value="<?php echo esc_attr($error_message); ?>"></div>
                    <div class='bot-message-block' data-setting-type='text' style='margin-bottom: 1rem;'>
                        <label for="bot-message">
                            <p class="no-margin-padding spacing-right-small text-center"><?php esc_html_e('Bot Prevention Message', 'blue-raven'); ?></p>
                        </label>
                        <input type="text" name="bot-message" id="bot-message" placeholder="<?php esc_attr_e('Unfortunately your message didn’t pass our bot prevention measures.', 'blue-raven'); ?>" class="br-input" style="width:100%;" value="<?php echo esc_attr($bot_message); ?>"></div>
                    <div class='missing-message-block' data-setting-type='text' style='margin-bottom: 1rem;'>
                        <label for="missing-message">
                            <p class="no-margin-padding spacing-right-small text-center"><?php esc_html_e('Missing Required feilds Message', 'blue-raven'); ?></p>
                        </label>
                        <input type="text" name="missing-message" id="missing-message" placeholder="<?php esc_attr_e('Unfortunately your message is missing some required fields.', 'blue-raven'); ?>" class="br-input" style="width:100%;" value="<?php echo esc_attr($missing_message); ?>">
                    </div>
                </div>   
                 
                <!-- Bot Prevention -->
                
                <div id="captcha-settings-block" style='display: none; margin-bottom: 2rem;'>
                    <div class='bot-provider-block' data-setting-type='select' style='margin-bottom: 1rem;'>
                        <label for="bot-provider">
                            <p class="no-margin-padding spacing-right-small text-center"><?php esc_html_e('Provider', 'blue-raven'); ?></p>
                        </label>
                        <select name="bot-provider" id="bot-provider" class="br-input" style="width:100%;">
                            <option value="none" <?php selected($provider, 'none'); ?>><?php esc_html_e('None', 'blue-raven'); ?></option>
                            <option value="recaptcha" <?php selected($provider, 'recaptcha'); ?>><?php esc_html_e('Google reCAPTCHA v2/v3', 'blue-raven'); ?></option>
                            <option value="hcaptcha" <?php selected($provider, 'hcaptcha'); ?>><?php esc_html_e('hCaptcha', 'blue-raven'); ?></option>
                            <option value="turnstile" <?php selected($provider, 'turnstile'); ?>><?php esc_html_e('Cloudflare Turnstile', 'blue-raven'); ?></option>
                        </select>
                    </div>
                
                    <div class='bot-sitekey-block' data-setting-type='text' style='margin-bottom: 1rem;'>
                        <label for="bot-sitekey">
                            <p class="no-margin-padding spacing-right-small text-center"><?php esc_html_e('Site Key', 'blue-raven'); ?></p>
                        </label>
                        <input type="text" name="bot-sitekey" id="bot-sitekey" placeholder="<?php esc_attr_e('Enter your site key here', 'blue-raven'); ?>" class="br-input" style="width:100%;" value="<?php echo esc_attr($site_key); ?>">
                    </div>
                
                    <div class='bot-secret-block' data-setting-type='text' style='margin-bottom: 1rem;'>
                        <label for="bot-secret">
                            <p class="no-margin-padding spacing-right-small text-center"><?php esc_html_e('Secret Key', 'blue-raven'); ?></p>
                        </label>
                        <input type="text" name="bot-secret" id="bot-secret" placeholder="<?php esc_attr_e('Enter your secret key here', 'blue-raven'); ?>" class="br-input" style="width:100%;" value="<?php echo esc_attr($secret_key); ?>">
                    </div>
                
                    <div class='bot-extra-note' data-setting-type='info' style='margin-top: 1rem;'>
                        <p class="text-center small" style="color: gray;">
                            <?php esc_html_e('Note: Each provider may require different integration steps and scripts on the frontend.', 'blue-raven'); ?>
                        </p>
                    </div>
                </div>  
                
                <!-- Mail Settings -->
                
                <div id="mail-settings-block" style='display: none; margin-bottom: 2rem;'>
                    <div class='mail-to-block' data-setting-type='email' style='margin-bottom: 1rem;'>
                        <label for="mail-to">
                            <p class="no-margin-padding spacing-right-small text-center">
                                <?php esc_html_e('To Email Address', 'blue-raven'); ?>
                            </p>
                        </label>
                        <input type="email" name="mail-to" id="mail-to" placeholder="<?php esc_attr_e('e.g. contact@yourdomain.com', 'blue-raven'); ?>" class="br-input" style="width:100%;" value="<?php echo esc_attr($form_row['email_to']); ?>">
                    </div>
                
                    <div class='mail-from-block' data-setting-type='email' style='margin-bottom: 1rem;'>
                        <label for="mail-from">
                            <p class="no-margin-padding spacing-right-small text-center">
                                <?php esc_html_e('From Email Address', 'blue-raven'); ?>
                            </p>
                        </label>
                        <input type="text" name="mail-from" id="mail-from" placeholder="<?php esc_attr_e('e.g. [email] Or no-reply@yourdomain.com', 'blue-raven'); ?>" class="br-input" style="width:100%;" value="<?php echo esc_attr($form_row['email_from']); ?>">
                    </div>
                
                    <div class='mail-reply-block' data-setting-type='text' style='margin-bottom: 1rem;'>
                        <label for="mail-reply-to">
                            <p class="no-margin-padding spacing-right-small text-center">
                                <?php esc_html_e('Reply-To Email Field (optional)', 'blue-raven'); ?>
                            </p>
                        </label>
                        <input type="text" name="mail-reply-to" id="mail-reply-to" placeholder="<?php esc_attr_e('e.g. [email] Or Custom Address', 'blue-raven'); ?>" class="br-input" style="width:100%;" value="<?php echo esc_attr($form_row['reply_to']); ?>">
                    </div>
                
                     <div class='mail-subject-block' data-setting-type='text' style='margin-bottom: 1rem;'>
                        <label for="mail-subject">
                            <p class="no-margin-padding spacing-right-small text-center">
                                <?php esc_html_e('Email Subject', 'blue-raven'); ?>
                            </p>
                        </label>
                        <input type="text" name="mail-subject" id="mail-subject" placeholder="<?php esc_attr_e('e.g. New message from [name]', 'blue-raven'); ?>" class="br-input" style="width:100%;" value="<?php echo esc_attr($form_row['subject']); ?>">
                    </div>
                
                    <div class='mail-body-block' data-setting-type='textarea' style='margin-bottom: 1rem;'>
                        <label for="mail-body">
                            <p class="no-margin-padding spacing-right-small text-center">
                                <?php esc_html_e('Email Body Template', 'blue-raven'); ?>
                            </p>
                        </label>
                        <textarea name="mail-body" id="mail-body" rows="6" class="br-input" style="width:100%;" placeholder="<?php esc_attr_e('e.g. You have a new message from [name] ([email]): [message]', 'blue-raven'); ?>"><?php echo esc_html($form_row['template']); ?></textarea>
                    </div>
                    
                    <div class='mail-names-block' style='margin-bottom: 1rem;'>
                        <label for="mail-body">
                            <p class="no-margin-padding spacing-right-small text-center">
                                <?php esc_html_e('Your Form Placeholder Names', 'blue-raven'); ?>
                            </p>
                        </label>
                        <div id='placeholder-name-space'></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class='flex-right' style='margin-top: 2rem;'>
    <button class='enterra-button' id='post-save-mail-block'><?php esc_html_e('Save', 'blue-raven'); ?></button>
</div>