<?php

/**
 * Admin agent configuration page.
 *
 * @package Inqyra
 */
// If this file is called directly, abort.
if ( !defined( 'WPINC' ) ) {
    die;
}
// phpcs:disable WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound -- Template variables from parent scope.
$admin = new Inqyra_Admin('inqyra', INQYRA_VERSION);
$agent = $admin->get_current_agent();
$agents = $admin->get_all_agents();
// Default values for new agent
$defaults = [
    'id'                         => 0,
    'name'                       => '',
    'system_prompt'              => Inqyra_Default_Prompts::get( 'en' ),
    'language'                   => 'nl',
    'provider'                   => 'claude',
    'model'                      => 'claude-sonnet-4-20250514',
    'max_tokens'                 => 4096,
    'daily_token_limit'          => 1000000,
    'cost_limit_usd'             => 10.0,
    'hourly_request_limit'       => 500,
    'archive_after_days'         => 30,
    'delete_archived_after_days' => null,
    'primary_color'              => '#5B7FFF',
    'text_color'                 => '#ffffff',
    'widget_position'            => 'bottom-right',
    'greeting_message'           => __( 'Hello! How can I help you today?', 'inqyra' ),
    'button_text'                => '',
    'header_title'               => 'Chat',
    'header_subtitle'            => 'Powered by AI',
    'header_icon_id'             => 0,
    'show_icon_in_messages'      => 0,
    'send_button_icon_id'        => 0,
    'send_button_text'           => '',
    'input_placeholder'          => '',
    'hide_input_placeholder'     => 0,
    'powered_by_text'            => 'Powered by Inqyra',
    'crawl_parts'                => '["p","h1","h2","h3","h4","h5","h6","li","td","th","blockquote","figcaption","div","span","article","section"]',
    'crawl_post_types'           => '["post","page"]',
    'document_search_mode'       => 'linked',
    'document_score_weight'      => 0.7,
    'query_rewrite_enabled'      => 1,
    'auto_recrawl_enabled'       => 1,
    'widget_enabled'             => 1,
    'widget_display_mode'        => 'all',
    'widget_pages'               => '[]',
    'widget_mobile_enabled'      => 1,
    'conversation_persist'       => 0,
];
// Merge with agent data if exists
$data = ( $agent ? (array) $agent : $defaults );
$crawl_parts = ( json_decode( $data['crawl_parts'] ?? '[]', true ) ?: [] );
$crawl_post_types = ( json_decode( $data['crawl_post_types'] ?? '[]', true ) ?: [] );
// Available models per provider - fetched dynamically with pricing
$models = [];
$provider_types = [
    'claude',
    'openai',
    'gemini',
    'mistral',
    'deepseek'
];
foreach ( $provider_types as $provider_type ) {
    try {
        $provider = Inqyra_AI_Provider_Factory::create( $provider_type );
        $models[$provider_type] = $provider->get_models();
    } catch ( Exception $e ) {
        // Fallback to empty array if provider can't be created
        $models[$provider_type] = [];
    }
}
// Get all post types
$post_types = get_post_types( [
    'public' => true,
], 'objects' );
unset($post_types['attachment']);
// Get configured providers (those with API keys)
$configured_providers = Inqyra_AI_Provider_Factory::get_configured_providers();
$all_provider_labels = [
    'claude'   => 'Claude (Anthropic)',
    'openai'   => 'OpenAI',
    'gemini'   => 'Google Gemini',
    'mistral'  => 'Mistral',
    'deepseek' => 'DeepSeek',
];
?>
<div class="wrap inqyra-admin">
    <h1>
        <?php 
esc_html_e( 'Agent Configuration', 'inqyra' );
?>
        <?php 
// Multi-agent UI hidden for now - may be enabled as advanced feature later
// if (!empty($agents)):
?>
        <?php 
if ( false ) {
    ?>
            <select id="inqyra-agent-selector" class="inqyra-agent-selector">
                <?php 
    foreach ( $agents as $a ) {
        ?>
                    <option value="<?php 
        echo esc_attr( $a->id );
        ?>" <?php 
        selected( $a->id, $data['id'] );
        ?>>
                        <?php 
        echo esc_html( $a->name );
        ?>
                    </option>
                <?php 
    }
    ?>
            </select>
            <button type="button" id="inqyra-create-agent" class="page-title-action">
                <?php 
    esc_html_e( 'Create New Agent', 'inqyra' );
    ?>
            </button>
        <?php 
}
?>
    </h1>

    <?php 
if ( get_option( 'inqyra_upgrade_recrawl_needed' ) ) {
    ?>
        <div class="notice notice-info is-dismissible inqyra-upgrade-recrawl-notice" style="margin: 15px 0;">
            <p>
                <strong><?php 
    esc_html_e( 'Premium activated!', 'inqyra' );
    ?></strong>
                <?php 
    esc_html_e( 'Your content was previously crawled with the free version (pages only). Recrawl and re-embed your content to index posts, products, and custom post types.', 'inqyra' );
    ?>
            </p>
            <p>
                <a href="<?php 
    echo esc_url( admin_url( 'admin.php?page=inqyra-knowledge' ) );
    ?>" class="button button-primary">
                    <?php 
    esc_html_e( 'Go to Knowledge Base', 'inqyra' );
    ?>
                </a>
                <button type="button" class="button inqyra-dismiss-recrawl-notice" style="margin-left: 8px;">
                    <?php 
    esc_html_e( 'Dismiss', 'inqyra' );
    ?>
                </button>
            </p>
        </div>
    <?php 
}
?>

    <form id="inqyra-agent-form" class="inqyra-form" novalidate>
        <input type="hidden" name="agent_id" value="<?php 
echo esc_attr( $data['id'] );
?>">

        <!-- Tabs -->
        <nav class="nav-tab-wrapper inqyra-tabs">
            <a href="#tab-basic" class="nav-tab nav-tab-active"><?php 
esc_html_e( 'Basic', 'inqyra' );
?></a>
            <a href="#tab-ai" class="nav-tab"><?php 
esc_html_e( 'AI Provider', 'inqyra' );
?></a>
            <a href="#tab-limits" class="nav-tab"><?php 
esc_html_e( 'Limits', 'inqyra' );
?></a>
            <a href="#tab-widget" class="nav-tab"><?php 
esc_html_e( 'Widget', 'inqyra' );
?></a>
            <a href="#tab-crawling" class="nav-tab"><?php 
esc_html_e( 'Crawling', 'inqyra' );
?></a>
            <a href="#tab-search" class="nav-tab"><?php 
esc_html_e( 'Search', 'inqyra' );
?></a>
        </nav>

        <!-- Basic Tab -->
        <div id="tab-basic" class="inqyra-tab-content inqyra-tab-active">
            <table class="form-table">
                <tr>
                    <th scope="row">
                        <label for="name"><?php 
esc_html_e( 'Agent Name', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <input type="text"
                               id="name"
                               name="name"
                               value="<?php 
echo esc_attr( $data['name'] );
?>"
                               class="regular-text"
                               required>
                    </td>
                </tr>
                <tr>
                    <th scope="row">
                        <label for="system_prompt"><?php 
esc_html_e( 'System Prompt', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <textarea id="system_prompt"
                                  name="system_prompt"
                                  rows="8"
                                  class="large-text code"><?php 
echo esc_textarea( $data['system_prompt'] );
?></textarea>
                        <p class="description">
                            <?php 
esc_html_e( 'Instructions for the AI on how to behave and respond.', 'inqyra' );
?>
                        </p>
                    </td>
                </tr>
                <tr>
                    <th scope="row">
                        <label for="language"><?php 
esc_html_e( 'Language', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <select id="language" name="language">
                            <option value="nl" <?php 
selected( $data['language'], 'nl' );
?>><?php 
esc_html_e( 'Dutch', 'inqyra' );
?></option>
                            <option value="en" <?php 
selected( $data['language'], 'en' );
?>><?php 
esc_html_e( 'English', 'inqyra' );
?></option>
                            <option value="de" <?php 
selected( $data['language'], 'de' );
?>><?php 
esc_html_e( 'German', 'inqyra' );
?></option>
                            <option value="fr" <?php 
selected( $data['language'], 'fr' );
?>><?php 
esc_html_e( 'French', 'inqyra' );
?></option>
                            <option value="es" <?php 
selected( $data['language'], 'es' );
?>><?php 
esc_html_e( 'Spanish', 'inqyra' );
?></option>
                            <option value="it" <?php 
selected( $data['language'], 'it' );
?>><?php 
esc_html_e( 'Italian', 'inqyra' );
?></option>
                            <option value="pt" <?php 
selected( $data['language'], 'pt' );
?>><?php 
esc_html_e( 'Portuguese', 'inqyra' );
?></option>
                            <option value="pl" <?php 
selected( $data['language'], 'pl' );
?>><?php 
esc_html_e( 'Polish', 'inqyra' );
?></option>
                            <option value="sv" <?php 
selected( $data['language'], 'sv' );
?>><?php 
esc_html_e( 'Swedish', 'inqyra' );
?></option>
                            <option value="da" <?php 
selected( $data['language'], 'da' );
?>><?php 
esc_html_e( 'Danish', 'inqyra' );
?></option>
                            <option value="no" <?php 
selected( $data['language'], 'no' );
?>><?php 
esc_html_e( 'Norwegian', 'inqyra' );
?></option>
                            <option value="fi" <?php 
selected( $data['language'], 'fi' );
?>><?php 
esc_html_e( 'Finnish', 'inqyra' );
?></option>
                            <option value="ja" <?php 
selected( $data['language'], 'ja' );
?>><?php 
esc_html_e( 'Japanese', 'inqyra' );
?></option>
                            <option value="ko" <?php 
selected( $data['language'], 'ko' );
?>><?php 
esc_html_e( 'Korean', 'inqyra' );
?></option>
                            <option value="zh" <?php 
selected( $data['language'], 'zh' );
?>><?php 
esc_html_e( 'Chinese', 'inqyra' );
?></option>
                            <option value="ar" <?php 
selected( $data['language'], 'ar' );
?>><?php 
esc_html_e( 'Arabic', 'inqyra' );
?></option>
                            <option value="tr" <?php 
selected( $data['language'], 'tr' );
?>><?php 
esc_html_e( 'Turkish', 'inqyra' );
?></option>
                            <option value="ru" <?php 
selected( $data['language'], 'ru' );
?>><?php 
esc_html_e( 'Russian', 'inqyra' );
?></option>
                            <option value="uk" <?php 
selected( $data['language'], 'uk' );
?>><?php 
esc_html_e( 'Ukrainian', 'inqyra' );
?></option>
                            <option value="cs" <?php 
selected( $data['language'], 'cs' );
?>><?php 
esc_html_e( 'Czech', 'inqyra' );
?></option>
                            <option value="ro" <?php 
selected( $data['language'], 'ro' );
?>><?php 
esc_html_e( 'Romanian', 'inqyra' );
?></option>
                            <option value="hu" <?php 
selected( $data['language'], 'hu' );
?>><?php 
esc_html_e( 'Hungarian', 'inqyra' );
?></option>
                            <option value="el" <?php 
selected( $data['language'], 'el' );
?>><?php 
esc_html_e( 'Greek', 'inqyra' );
?></option>
                            <option value="he" <?php 
selected( $data['language'], 'he' );
?>><?php 
esc_html_e( 'Hebrew', 'inqyra' );
?></option>
                            <option value="th" <?php 
selected( $data['language'], 'th' );
?>><?php 
esc_html_e( 'Thai', 'inqyra' );
?></option>
                            <option value="vi" <?php 
selected( $data['language'], 'vi' );
?>><?php 
esc_html_e( 'Vietnamese', 'inqyra' );
?></option>
                            <option value="id" <?php 
selected( $data['language'], 'id' );
?>><?php 
esc_html_e( 'Indonesian', 'inqyra' );
?></option>
                            <option value="ms" <?php 
selected( $data['language'], 'ms' );
?>><?php 
esc_html_e( 'Malay', 'inqyra' );
?></option>
                            <option value="hi" <?php 
selected( $data['language'], 'hi' );
?>><?php 
esc_html_e( 'Hindi', 'inqyra' );
?></option>
                        </select>
                    </td>
                </tr>
            </table>
        </div>

        <!-- AI Provider Tab -->
        <div id="tab-ai" class="inqyra-tab-content">
            <table class="form-table">
                <tr>
                    <th scope="row">
                        <label for="provider"><?php 
esc_html_e( 'AI Provider', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <?php 
if ( empty( $configured_providers ) ) {
    ?>
                            <div class="notice notice-warning inline" style="margin: 0;">
                                <p><?php 
    printf( 
        /* translators: %1$s: opening link tag to settings page, %2$s: closing link tag */
        esc_html__( 'No API keys configured. %1$sConfigure API Keys%2$s first before selecting a provider.', 'inqyra' ),
        '<a href="' . esc_url( admin_url( 'admin.php?page=inqyra-settings' ) ) . '">',
        '</a>'
     );
    ?></p>
                            </div>
                        <?php 
}
?>
                        <select id="provider" name="provider">
                            <?php 
foreach ( $all_provider_labels as $pid => $plabel ) {
    ?>
                                <option value="<?php 
    echo esc_attr( $pid );
    ?>"
                                        <?php 
    selected( $data['provider'], $pid );
    ?>
                                        <?php 
    echo esc_attr( ( !in_array( $pid, $configured_providers ) ? 'disabled' : '' ) );
    ?>>
                                    <?php 
    echo esc_html( $plabel );
    ?>
                                    <?php 
    if ( !in_array( $pid, $configured_providers ) ) {
        ?>
                                        — <?php 
        esc_html_e( 'no API key', 'inqyra' );
        ?>
                                    <?php 
    }
    ?>
                                </option>
                            <?php 
}
?>
                        </select>
                    </td>
                </tr>
                <tr>
                    <th scope="row">
                        <label for="model"><?php 
esc_html_e( 'Model', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <?php 
foreach ( $models as $provider => $provider_models ) {
    ?>
                            <select id="model_<?php 
    echo esc_attr( $provider );
    ?>"
                                    name="model"
                                    class="inqyra-model-select"
                                    data-provider="<?php 
    echo esc_attr( $provider );
    ?>"
                                    <?php 
    if ( $data['provider'] !== $provider ) {
        echo esc_attr( 'style="display:none"' );
    }
    ?>>
                                <?php 
    foreach ( $provider_models as $model_id => $model_name ) {
        ?>
                                    <option value="<?php 
        echo esc_attr( $model_id );
        ?>" <?php 
        selected( $data['model'], $model_id );
        ?>>
                                        <?php 
        echo esc_html( $model_name );
        ?>
                                    </option>
                                <?php 
    }
    ?>
                            </select>
                        <?php 
}
?>
                        <p class="description" style="margin-top: 6px;">
                            <a href="#" id="inqyra-refresh-models" class="inqyra-refresh-models-link">
                                <span class="dashicons dashicons-update" style="font-size: 14px; width: 14px; height: 14px; vertical-align: middle;"></span>
                                <?php 
esc_html_e( 'Fetch latest models from API', 'inqyra' );
?>
                            </a>
                            <span id="inqyra-refresh-models-status" style="margin-left: 8px;"></span>
                        </p>
                    </td>
                </tr>
            </table>

            <h3><?php 
esc_html_e( 'Query Rewriting', 'inqyra' );
?></h3>
            <p class="description" style="margin-bottom: 15px;">
                <?php 
esc_html_e( 'Use a fast LLM to expand search queries with related terms for better results.', 'inqyra' );
?>
            </p>
            <table class="form-table">
                <tr>
                    <th scope="row">
                        <?php 
esc_html_e( 'Enable Query Rewriting', 'inqyra' );
?>
                    </th>
                    <td>
                        <label>
                            <input type="checkbox"
                                   id="query_rewrite_enabled"
                                   name="query_rewrite_enabled"
                                   value="1"
                                   <?php 
checked( (int) ($data['query_rewrite_enabled'] ?? 1), 1 );
?>>
                            <?php 
esc_html_e( 'Automatically expand queries with synonyms and related terms', 'inqyra' );
?>
                        </label>
                        <p class="description">
                            <?php 
esc_html_e( 'Example: "waar zijn jullie gevestigd" → "waar zijn jullie gevestigd adres locatie vestiging kantoor"', 'inqyra' );
?>
                        </p>
                    </td>
                </tr>
                <tr class="query-rewrite-settings" <?php 
if ( !(int) ($data['query_rewrite_enabled'] ?? 1) ) {
    echo esc_attr( 'style="display:none"' );
}
?>>
                    <th scope="row">
                        <label for="query_rewrite_provider"><?php 
esc_html_e( 'Rewrite Provider', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <select id="query_rewrite_provider" name="query_rewrite_provider">
                            <?php 
foreach ( $all_provider_labels as $pid => $plabel ) {
    ?>
                                <option value="<?php 
    echo esc_attr( $pid );
    ?>"
                                        <?php 
    selected( $data['query_rewrite_provider'] ?? 'claude', $pid );
    ?>
                                        <?php 
    echo esc_attr( ( !in_array( $pid, $configured_providers ) ? 'disabled' : '' ) );
    ?>>
                                    <?php 
    echo esc_html( $plabel );
    ?>
                                    <?php 
    if ( !in_array( $pid, $configured_providers ) ) {
        ?>
                                        — <?php 
        esc_html_e( 'no API key', 'inqyra' );
        ?>
                                    <?php 
    }
    ?>
                                </option>
                            <?php 
}
?>
                        </select>
                    </td>
                </tr>
                <tr class="query-rewrite-settings" <?php 
if ( !(int) ($data['query_rewrite_enabled'] ?? 1) ) {
    echo esc_attr( 'style="display:none"' );
}
?>>
                    <th scope="row">
                        <label for="query_rewrite_model"><?php 
esc_html_e( 'Rewrite Model', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <?php 
// Fast/cheap models for query rewriting
$rewrite_models = [
    'claude'   => [
        'claude-3-haiku-20240307'   => 'Claude 3 Haiku ($0.25/$1.25 per 1M) - Recommended',
        'claude-3-5-haiku-20241022' => 'Claude 3.5 Haiku ($0.80/$4.00 per 1M)',
    ],
    'openai'   => [
        'gpt-4o-mini' => 'GPT-4o Mini ($0.15/$0.60 per 1M) - Recommended',
    ],
    'gemini'   => [
        'gemini-2.0-flash-lite' => 'Gemini 2.0 Flash Lite ($0.075/$0.30 per 1M) - Recommended',
        'gemini-2.0-flash'      => 'Gemini 2.0 Flash ($0.10/$0.40 per 1M)',
    ],
    'mistral'  => [
        'ministral-8b-latest'  => 'Ministral 8B ($0.10/$0.10 per 1M) - Recommended',
        'mistral-small-latest' => 'Mistral Small ($0.20/$0.60 per 1M)',
    ],
    'deepseek' => [
        'deepseek-chat' => 'DeepSeek Chat ($0.28/$0.42 per 1M) - Recommended',
    ],
];
?>
                        <?php 
foreach ( $rewrite_models as $provider => $provider_models ) {
    ?>
                            <select id="query_rewrite_model_<?php 
    echo esc_attr( $provider );
    ?>"
                                    name="query_rewrite_model"
                                    class="inqyra-rewrite-model-select"
                                    data-provider="<?php 
    echo esc_attr( $provider );
    ?>"
                                    <?php 
    if ( ($data['query_rewrite_provider'] ?? 'claude') !== $provider ) {
        echo esc_attr( 'style="display:none"' );
    }
    ?>>
                                <?php 
    foreach ( $provider_models as $model_id => $model_name ) {
        ?>
                                    <option value="<?php 
        echo esc_attr( $model_id );
        ?>" <?php 
        selected( $data['query_rewrite_model'] ?? '', $model_id );
        ?>>
                                        <?php 
        echo esc_html( $model_name );
        ?>
                                    </option>
                                <?php 
    }
    ?>
                            </select>
                        <?php 
}
?>
                        <p class="description">
                            <?php 
esc_html_e( 'Use a fast, cheap model for query expansion.', 'inqyra' );
?>
                        </p>
                    </td>
                </tr>
            </table>
        </div>

        <!-- Limits Tab -->
        <div id="tab-limits" class="inqyra-tab-content">
            <table class="form-table">
                <tr>
                    <th scope="row">
                        <label for="max_tokens"><?php 
esc_html_e( 'Max Tokens per Response', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <input type="number"
                               id="max_tokens"
                               name="max_tokens"
                               value="<?php 
echo esc_attr( $data['max_tokens'] );
?>"
                               class="small-text"
                               min="100"
                               max="32000">
                        <p class="description">
                            <?php 
esc_html_e( 'Maximum tokens the AI may use for a single response. 1 token ≈ 0.75 words.', 'inqyra' );
?>
                        </p>
                    </td>
                </tr>
                <tr>
                    <th scope="row">
                        <label for="daily_token_limit"><?php 
esc_html_e( 'Daily Token Limit', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <input type="number"
                               id="daily_token_limit"
                               name="daily_token_limit"
                               value="<?php 
echo esc_attr( $data['daily_token_limit'] );
?>"
                               class="regular-text"
                               min="0">
                        <p class="description">
                            <?php 
esc_html_e( 'Maximum tokens to use per day. Set to 0 for unlimited.', 'inqyra' );
?>
                        </p>
                    </td>
                </tr>
                <tr>
                    <th scope="row">
                        <label for="cost_limit_usd"><?php 
esc_html_e( 'Daily Cost Limit (USD)', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <input type="number"
                               id="cost_limit_usd"
                               name="cost_limit_usd"
                               value="<?php 
echo esc_attr( $data['cost_limit_usd'] );
?>"
                               class="small-text"
                               min="0"
                               step="0.01">
                        <p class="description">
                            <?php 
esc_html_e( 'Maximum cost in USD per day. Set to 0 for unlimited.', 'inqyra' );
?>
                        </p>
                    </td>
                </tr>
                <tr>
                    <th scope="row">
                        <label for="hourly_request_limit"><?php 
esc_html_e( 'Hourly Request Limit', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <input type="number"
                               id="hourly_request_limit"
                               name="hourly_request_limit"
                               value="<?php 
echo esc_attr( $data['hourly_request_limit'] );
?>"
                               class="small-text"
                               min="0">
                        <p class="description">
                            <?php 
esc_html_e( 'Maximum requests per hour. Set to 0 for unlimited.', 'inqyra' );
?>
                        </p>
                    </td>
                </tr>
                <?php 
?>
            </table>
        </div>

        <!-- Widget Tab -->
        <div id="tab-widget" class="inqyra-tab-content">
            <?php 
// Get header icon URL if set
$header_icon_url = '';
$header_icon_id = ( isset( $data['header_icon_id'] ) ? (int) $data['header_icon_id'] : 0 );
if ( $header_icon_id ) {
    $header_icon_url = wp_get_attachment_image_url( $header_icon_id, 'thumbnail' );
}
?>

            <!-- Widget Visibility Section -->
            <h3 style="margin-top: 0;"><?php 
esc_html_e( 'Widget Visibility', 'inqyra' );
?></h3>
            <?php 
if ( empty( $data['widget_enabled'] ) ) {
    ?>
                <div class="notice notice-warning inline" style="margin: 0 0 15px 0; display: flex; align-items: center; justify-content: space-between;">
                    <p style="margin: 0;"><?php 
    esc_html_e( 'The widget is currently disabled and will not appear on your website.', 'inqyra' );
    ?></p>
                    <button type="button" id="inqyra-preview-widget" class="button">
                        <?php 
    esc_html_e( 'Preview Widget', 'inqyra' );
    ?>
                    </button>
                </div>
            <?php 
}
?>
            <table class="form-table">
                <tr>
                    <th scope="row">
                        <?php 
esc_html_e( 'Widget Status', 'inqyra' );
?>
                    </th>
                    <td>
                        <label>
                            <input type="checkbox"
                                   id="widget_enabled"
                                   name="widget_enabled"
                                   value="1"
                                   <?php 
checked( $data['widget_enabled'], 1 );
?>>
                            <?php 
esc_html_e( 'Show widget on the website', 'inqyra' );
?>
                        </label>
                    </td>
                </tr>
                <tr class="widget-visibility-settings" <?php 
if ( empty( $data['widget_enabled'] ) ) {
    echo esc_attr( 'style="opacity: 0.5;"' );
}
?>>
                    <th scope="row">
                        <?php 
esc_html_e( 'Mobile Devices', 'inqyra' );
?>
                    </th>
                    <td>
                        <label>
                            <input type="checkbox"
                                   id="widget_mobile_enabled"
                                   name="widget_mobile_enabled"
                                   value="1"
                                   <?php 
checked( $data['widget_mobile_enabled'], 1 );
?>
                                   <?php 
if ( empty( $data['widget_enabled'] ) ) {
    echo esc_attr( 'disabled' );
}
?>>
                            <?php 
esc_html_e( 'Show widget on mobile devices', 'inqyra' );
?>
                        </label>
                        <p class="description">
                            <?php 
esc_html_e( 'Screens smaller than 768px are considered mobile.', 'inqyra' );
?>
                        </p>
                    </td>
                </tr>
                <tr class="widget-visibility-settings" <?php 
if ( empty( $data['widget_enabled'] ) ) {
    echo esc_attr( 'style="opacity: 0.5;"' );
}
?>>
                    <th scope="row">
                        <?php 
esc_html_e( 'Conversation Persistence', 'inqyra' );
?>
                    </th>
                    <td>
                        <label>
                            <input type="checkbox"
                                   id="conversation_persist"
                                   name="conversation_persist"
                                   value="1"
                                   <?php 
checked( !empty( $data['conversation_persist'] ) );
?>
                                   <?php 
if ( empty( $data['widget_enabled'] ) ) {
    echo esc_attr( 'disabled' );
}
?>>
                            <?php 
esc_html_e( 'Remember conversation across page loads', 'inqyra' );
?>
                        </label>
                        <p class="description">
                            <?php 
esc_html_e( 'When enabled, the conversation is preserved when visitors navigate between pages or reload. The conversation resets when the browser is closed.', 'inqyra' );
?>
                        </p>
                    </td>
                </tr>
            </table>

            <hr style="margin: 25px 0;">

            <!-- Widget Appearance Section -->
            <div style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px;">
                <h3 style="margin: 0;"><?php 
esc_html_e( 'Widget Appearance', 'inqyra' );
?></h3>
                <button type="button" id="inqyra-preview-widget-btn" class="button button-secondary">
                    <span class="dashicons dashicons-visibility" style="margin-top: 3px;"></span>
                    <?php 
esc_html_e( 'Preview Widget', 'inqyra' );
?>
                </button>
            </div>
            <table class="form-table">
                <tr>
                    <th scope="row">
                        <label for="primary_color"><?php 
esc_html_e( 'Primary Color', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <input type="color"
                               id="primary_color"
                               name="primary_color"
                               value="<?php 
echo esc_attr( $data['primary_color'] );
?>"
                               style="vertical-align: middle;">
                        <input type="text"
                               id="primary_color_hex"
                               name="primary_color_hex"
                               value="<?php 
echo esc_attr( $data['primary_color'] );
?>"
                               placeholder="#5B7FFF"
                               pattern="^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$"
                               style="vertical-align: middle; margin-left: 8px; width: 70px;">
                        <p class="description">
                            <?php 
esc_html_e( 'Background color for header, buttons, and user messages.', 'inqyra' );
?>
                        </p>
                    </td>
                </tr>
                <tr>
                    <th scope="row">
                        <label for="text_color"><?php 
esc_html_e( 'Text Color', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <input type="color"
                               id="text_color"
                               name="text_color"
                               value="<?php 
echo esc_attr( $data['text_color'] ?? '#ffffff' );
?>"
                               style="vertical-align: middle;">
                        <input type="text"
                               id="text_color_hex"
                               name="text_color_hex"
                               value="<?php 
echo esc_attr( $data['text_color'] ?? '#ffffff' );
?>"
                               placeholder="#ffffff"
                               pattern="^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$"
                               style="vertical-align: middle; margin-left: 8px; width: 70px;">
                        <p class="description">
                            <?php 
esc_html_e( 'Text color for header, send button, and user messages.', 'inqyra' );
?>
                        </p>
                    </td>
                </tr>
                <tr>
                    <th scope="row">
                        <label for="header_icon"><?php 
esc_html_e( 'Header Icon', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <div class="inqyra-icon-upload">
                            <input type="hidden" id="header_icon_id" name="header_icon_id" value="<?php 
echo esc_attr( $header_icon_id );
?>">
                            <div id="header_icon_preview" class="inqyra-icon-preview" <?php 
echo esc_attr( ( $header_icon_url ? '' : 'style="display:none;"' ) );
?>>
                                <?php 
if ( $header_icon_url ) {
    ?>
                                    <img src="<?php 
    echo esc_url( $header_icon_url );
    ?>" alt="Header Icon">
                                <?php 
}
?>
                            </div>
                            <button type="button" id="header_icon_upload_btn" class="button">
                                <?php 
esc_html_e( 'Upload Icon', 'inqyra' );
?>
                            </button>
                            <button type="button" id="header_icon_remove_btn" class="button" <?php 
echo esc_attr( ( $header_icon_url ? '' : 'style="display:none;"' ) );
?>>
                                <?php 
esc_html_e( 'Remove', 'inqyra' );
?>
                            </button>
                            <p class="description">
                                <?php 
esc_html_e( 'Icon shown in the chat header. Recommended size: 40x40 pixels.', 'inqyra' );
?>
                            </p>
                        </div>
                    </td>
                </tr>
                <tr>
                    <th scope="row">
                        <label for="show_icon_in_messages"><?php 
esc_html_e( 'Message Icons', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <label>
                            <input type="checkbox"
                                   id="show_icon_in_messages"
                                   name="show_icon_in_messages"
                                   value="1"
                                   <?php 
checked( !empty( $data['show_icon_in_messages'] ) );
?>>
                            <?php 
esc_html_e( 'Show icon next to chat balloons', 'inqyra' );
?>
                        </label>
                        <p class="description">
                            <?php 
esc_html_e( 'When enabled, the header icon will also appear next to AI message bubbles.', 'inqyra' );
?>
                        </p>
                    </td>
                </tr>
                <tr>
                    <th scope="row">
                        <label for="widget_position"><?php 
esc_html_e( 'Widget Position', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <select id="widget_position" name="widget_position">
                            <option value="bottom-right" <?php 
selected( $data['widget_position'], 'bottom-right' );
?>><?php 
esc_html_e( 'Bottom Right', 'inqyra' );
?></option>
                            <option value="bottom-left" <?php 
selected( $data['widget_position'], 'bottom-left' );
?>><?php 
esc_html_e( 'Bottom Left', 'inqyra' );
?></option>
                            <option value="top-right" <?php 
selected( $data['widget_position'], 'top-right' );
?>><?php 
esc_html_e( 'Top Right', 'inqyra' );
?></option>
                            <option value="top-left" <?php 
selected( $data['widget_position'], 'top-left' );
?>><?php 
esc_html_e( 'Top Left', 'inqyra' );
?></option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <th scope="row">
                        <label for="greeting_message"><?php 
esc_html_e( 'Greeting Message', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <textarea id="greeting_message"
                                  name="greeting_message"
                                  rows="3"
                                  class="large-text"><?php 
echo esc_textarea( $data['greeting_message'] );
?></textarea>
                        <p class="description">
                            <?php 
esc_html_e( 'Message shown when the chat opens.', 'inqyra' );
?>
                        </p>
                    </td>
                </tr>
                <tr>
                    <th scope="row">
                        <label for="button_text"><?php 
esc_html_e( 'Button Text', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <input type="text"
                               id="button_text"
                               name="button_text"
                               value="<?php 
echo esc_attr( $data['button_text'] );
?>"
                               class="regular-text"
                               placeholder="<?php 
esc_attr_e( "Let's chat!", 'inqyra' );
?>">
                        <p class="description">
                            <?php 
esc_html_e( 'Text shown on the chat button. Leave empty for icon only.', 'inqyra' );
?>
                        </p>
                    </td>
                </tr>
                <tr>
                    <th scope="row">
                        <label for="header_title"><?php 
esc_html_e( 'Header Title', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <input type="text"
                               id="header_title"
                               name="header_title"
                               value="<?php 
echo esc_attr( $data['header_title'] );
?>"
                               class="regular-text">
                    </td>
                </tr>
                <tr>
                    <th scope="row">
                        <label for="header_subtitle"><?php 
esc_html_e( 'Header Subtitle', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <input type="text"
                               id="header_subtitle"
                               name="header_subtitle"
                               value="<?php 
echo esc_attr( $data['header_subtitle'] );
?>"
                               class="regular-text">
                    </td>
                </tr>
                <tr>
                    <th scope="row">
                        <label for="send_button"><?php 
esc_html_e( 'Send Button', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <?php 
// Get send button icon URL if set
$send_icon_url = '';
$send_icon_id = ( isset( $data['send_button_icon_id'] ) ? (int) $data['send_button_icon_id'] : 0 );
if ( $send_icon_id ) {
    $send_icon_url = wp_get_attachment_image_url( $send_icon_id, 'thumbnail' );
}
?>
                        <div class="inqyra-send-button-config">
                            <div style="margin-bottom: 12px;">
                                <label for="send_button_text" style="display: block; margin-bottom: 4px; font-weight: 500;">
                                    <?php 
esc_html_e( 'Button Text', 'inqyra' );
?>
                                </label>
                                <input type="text"
                                       id="send_button_text"
                                       name="send_button_text"
                                       value="<?php 
echo esc_attr( $data['send_button_text'] ?? '' );
?>"
                                       class="regular-text"
                                       placeholder="<?php 
esc_attr_e( 'Send', 'inqyra' );
?>">
                            </div>
                            <div>
                                <label style="display: block; margin-bottom: 4px; font-weight: 500;">
                                    <?php 
esc_html_e( 'Custom Icon', 'inqyra' );
?>
                                </label>
                                <div class="inqyra-icon-upload">
                                    <input type="hidden" id="send_button_icon_id" name="send_button_icon_id" value="<?php 
echo esc_attr( $send_icon_id );
?>">
                                    <div id="send_icon_preview" class="inqyra-icon-preview" <?php 
echo esc_attr( ( $send_icon_url ? '' : 'style="display:none;"' ) );
?>>
                                        <?php 
if ( $send_icon_url ) {
    ?>
                                            <img src="<?php 
    echo esc_url( $send_icon_url );
    ?>" alt="Send Icon">
                                        <?php 
}
?>
                                    </div>
                                    <button type="button" id="send_icon_upload_btn" class="button">
                                        <?php 
esc_html_e( 'Upload Icon', 'inqyra' );
?>
                                    </button>
                                    <button type="button" id="send_icon_remove_btn" class="button" <?php 
echo esc_attr( ( $send_icon_url ? '' : 'style="display:none;"' ) );
?>>
                                        <?php 
esc_html_e( 'Remove', 'inqyra' );
?>
                                    </button>
                                </div>
                            </div>
                            <p class="description" style="margin-top: 8px;">
                                <?php 
esc_html_e( 'Leave both empty for the default send icon. You can use icon only, text only, or both.', 'inqyra' );
?>
                            </p>
                        </div>
                    </td>
                </tr>
                <tr>
                    <th scope="row">
                        <label for="input_placeholder"><?php esc_html_e('Input Placeholder', 'inqyra'); ?></label>
                    </th>
                    <td>
                        <input type="text"
                               id="input_placeholder"
                               name="input_placeholder"
                               value="<?php echo esc_attr($data['input_placeholder'] ?? ''); ?>"
                               class="regular-text"
                               placeholder="<?php echo esc_attr(Inqyra_Public::get_placeholder_translations()[$data['language'] ?? 'en'] ?? 'Ask a question...'); ?>"
                               <?php echo !empty($data['hide_input_placeholder']) ? 'disabled' : ''; ?>>
                        <label style="display: block; margin-top: 6px;">
                            <input type="checkbox"
                                   id="hide_input_placeholder"
                                   name="hide_input_placeholder"
                                   value="1"
                                   <?php checked(!empty($data['hide_input_placeholder'])); ?>>
                            <?php esc_html_e('Hide placeholder text', 'inqyra'); ?>
                        </label>
                        <p class="description">
                            <?php esc_html_e('Leave empty to use the default for the selected language, or check the box to show no placeholder.', 'inqyra'); ?>
                        </p>
                    </td>
                </tr>
                <tr>
                    <th scope="row">
                        <label for="powered_by_text"><?php
esc_html_e( 'Powered By Text', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <input type="text"
                               id="powered_by_text"
                               name="powered_by_text"
                               value="<?php 
echo esc_attr( $data['powered_by_text'] ?? '' );
?>"
                               class="regular-text">
                        <p class="description">
                            <?php 
esc_html_e( 'Leave empty to hide the powered-by text.', 'inqyra' );
?>
                        </p>
                    </td>
                </tr>
            </table>
        </div>

        <!-- Crawling Tab -->
        <div id="tab-crawling" class="inqyra-tab-content">
            <table class="form-table">
                <?php 
?>
                <tr>
                    <th scope="row"><?php 
esc_html_e( 'HTML Tags to Extract', 'inqyra' );
?></th>
                    <td>
                        <?php 
$available_tags = [
    'p',
    'h1',
    'h2',
    'h3',
    'h4',
    'h5',
    'h6',
    'li',
    'td',
    'th',
    'blockquote',
    'figcaption',
    'div',
    'span',
    'article',
    'section'
];
$custom_tags = array_diff( $crawl_parts, $available_tags );
foreach ( $available_tags as $tag ) {
    ?>
                            <label style="display: inline-block; margin-right: 15px; margin-bottom: 5px;">
                                <input type="checkbox"
                                       name="crawl_parts[]"
                                       value="<?php 
    echo esc_attr( $tag );
    ?>"
                                       <?php 
    checked( in_array( $tag, $crawl_parts ) );
    ?>>
                                &lt;<?php 
    echo esc_html( $tag );
    ?>&gt;
                            </label>
                        <?php 
}
?>
                        <div id="inqyra-custom-tags">
                            <?php 
foreach ( $custom_tags as $tag ) {
    ?>
                                <label style="display: inline-block; margin-right: 15px; margin-bottom: 5px;" class="inqyra-custom-tag-label">
                                    <input type="checkbox"
                                           name="crawl_parts[]"
                                           value="<?php 
    echo esc_attr( $tag );
    ?>"
                                           checked>
                                    &lt;<?php 
    echo esc_html( $tag );
    ?>&gt;
                                    <button type="button" class="inqyra-remove-custom-tag" style="background: none; border: none; color: #a00; cursor: pointer; padding: 0 4px;" title="<?php 
    esc_attr_e( 'Remove', 'inqyra' );
    ?>">&times;</button>
                                </label>
                            <?php 
}
?>
                        </div>
                        <div style="margin-top: 8px;">
                            <input type="text" id="inqyra-custom-tag-input" placeholder="<?php 
esc_attr_e( 'e.g. nav, aside, main', 'inqyra' );
?>" style="width: 200px;">
                            <button type="button" id="inqyra-add-custom-tag" class="button button-small"><?php 
esc_html_e( 'Add Tag', 'inqyra' );
?></button>
                        </div>
                        <p class="description">
                            <?php 
esc_html_e( 'Select which HTML tags to extract content from. You can also add custom tags. If no content is found in selected tags, all text content will be extracted as a fallback.', 'inqyra' );
?>
                        </p>
                    </td>
                </tr>
                <tr>
                    <th scope="row"><?php 
esc_html_e( 'Auto Re-crawl', 'inqyra' );
?></th>
                    <td>
                        <label>
                            <input type="checkbox"
                                   id="auto_recrawl_enabled"
                                   name="auto_recrawl_enabled"
                                   value="1"
                                   <?php 
checked( $data['auto_recrawl_enabled'] ?? 0, 1 );
?>>
                            <?php 
esc_html_e( 'Automatically re-index when content changes', 'inqyra' );
?>
                        </label>
                        <p class="description">
                            <?php 
esc_html_e( 'When enabled, changed pages are automatically re-indexed when you publish or update posts/pages.', 'inqyra' );
?>
                        </p>
                    </td>
                </tr>
            </table>
        </div>

        <!-- Search Tab -->
        <div id="tab-search" class="inqyra-tab-content">
            <table class="form-table">
                <tr>
                    <th scope="row">
                        <label for="document_search_mode"><?php 
esc_html_e( 'Document Search Mode', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <select id="document_search_mode" name="document_search_mode">
                            <option value="linked" <?php 
selected( $data['document_search_mode'], 'linked' );
?>>
                                <?php 
esc_html_e( 'Linked - Search documents via website links', 'inqyra' );
?>
                            </option>
                            <option value="direct" <?php 
selected( $data['document_search_mode'], 'direct' );
?>>
                                <?php 
esc_html_e( 'Direct - Search documents directly', 'inqyra' );
?>
                            </option>
                            <option value="hybrid" <?php 
selected( $data['document_search_mode'], 'hybrid' );
?>>
                                <?php 
esc_html_e( 'Hybrid - Both linked and direct search', 'inqyra' );
?>
                            </option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <th scope="row">
                        <label for="document_score_weight"><?php 
esc_html_e( 'Document Score Weight', 'inqyra' );
?></label>
                    </th>
                    <td>
                        <input type="range"
                               id="document_score_weight"
                               name="document_score_weight"
                               value="<?php 
echo esc_attr( $data['document_score_weight'] );
?>"
                               min="0"
                               max="1"
                               step="0.05">
                        <span id="document_score_weight_value"><?php 
echo esc_html( $data['document_score_weight'] );
?></span>
                        <p class="description">
                            <?php 
esc_html_e( 'How much weight to give document results vs website results.', 'inqyra' );
?>
                        </p>
                    </td>
                </tr>
            </table>
        </div>

        <p class="submit">
            <button type="submit" class="button button-primary" id="inqyra-save-agent">
                <?php 
esc_html_e( 'Save Agent', 'inqyra' );
?>
            </button>
            <span class="spinner"></span>
            <span class="inqyra-save-status"></span>
        </p>
    </form>
</div>

<!-- Widget Preview Modal -->
<div id="inqyra-preview-modal" class="inqyra-preview-modal" style="display: none;">
    <div class="inqyra-preview-backdrop"></div>
    <div class="inqyra-preview-container">
        <div class="inqyra-preview-header">
            <h2><?php 
esc_html_e( 'Widget Preview', 'inqyra' );
?></h2>
            <button type="button" class="inqyra-preview-close">&times;</button>
        </div>
        <div class="inqyra-preview-body">
            <div class="inqyra-preview-device">
                <div id="inqyra-preview-widget-container"></div>
            </div>
            <p class="inqyra-preview-note">
                <?php 
esc_html_e( 'This is a visual preview. Chat functionality is disabled in preview mode.', 'inqyra' );
?>
            </p>
        </div>
    </div>
</div>

<?php // phpcs:enable WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound ?>
