<?php
/**
 * Admin home page settings template for Ask Any plugin
 *
 * This template displays the home page settings management interface with:
 * - Home page enable/disable toggle
 * - Documentation settings
 * - FAQ management
 * - Custom links management
 * - Agent display settings
 *
 * @package Askany
 * @since 1.0.0
 */

// Exit if accessed directly
if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

// Check pro status
$plugin = \Askany\Plugin::get_instance();
$is_pro = $plugin->is_pro_active();
?>
<div class="wrap">
	<h1><?php esc_html_e( 'Home Page Settings', 'askany' ); ?></h1>
	
	<div class="askany-admin-container">
		<!-- Home Page General Settings -->
		<div class="askany-admin-section">
			<h2><?php esc_html_e( 'General Settings', 'askany' ); ?></h2>
			<form id="askany-home-general-form" method="post">
				<?php wp_nonce_field( 'askany_save_home_settings', 'askany_home_nonce' ); ?>
				
				<table class="form-table">
					<tr>
						<th scope="row">
							<label for="home_page_enabled"><?php esc_html_e( 'Enable Home Page', 'askany' ); ?></label>
						</th>
						<td>
							<label class="askany-switch">
								<input type="checkbox" id="home_page_enabled" name="home_page_enabled" value="1" 
									<?php checked( ! empty( $settings['home_page_enabled'] ) ); ?> />
								<span class="askany-slider"></span>
							</label>
							<p class="description">
								<?php esc_html_e( 'Enable the home page with welcome message, agents, and quick actions.', 'askany' ); ?>
							</p>
						</td>
					</tr>
					
					<tr>
						<th scope="row">
							<label for="home_logo"><?php esc_html_e( 'Home Page Logo', 'askany' ); ?></label>
						</th>
						<td>
							<div class="askany-media-upload">
								<input type="hidden" id="home_logo" name="home_logo" value="<?php echo esc_attr( $settings['home_logo'] ?? '' ); ?>" />
								<div class="askany-media-preview">
									<?php if ( ! empty( $settings['home_logo'] ) ) : ?>
										<img src="<?php echo esc_url( $settings['home_logo'] ); ?>" alt="<?php esc_attr_e( 'Home Logo', 'askany' ); ?>" style="max-width: 200px; max-height: 100px;" />
									<?php endif; ?>
								</div>
								<button type="button" class="button askany-media-upload-btn" data-target="home_logo">
									<?php esc_html_e( 'Choose Logo', 'askany' ); ?>
								</button>
								<button type="button" class="button askany-media-remove-btn" data-target="home_logo" style="<?php echo empty( $settings['home_logo'] ) ? 'display: none;' : ''; ?>">
									<?php esc_html_e( 'Remove', 'askany' ); ?>
								</button>
							</div>
							<p class="description">
								<?php esc_html_e( 'Upload a logo to display at the top of the home page.', 'askany' ); ?>
							</p>
						</td>
					</tr>
					
					<tr>
						<th scope="row">
							<label for="home_welcome_message"><?php esc_html_e( 'Welcome Message', 'askany' ); ?></label>
						</th>
						<td>
							<input type="text" id="home_welcome_message" name="home_welcome_message" 
								value="<?php echo esc_attr( $settings['home_welcome_message'] ?? __( 'How may we help you today?', 'askany' ) ); ?>" 
								class="regular-text" />
							<p class="description">
								<?php esc_html_e( 'The welcome message displayed below the greeting.', 'askany' ); ?>
							</p>
						</td>
					</tr>
					
					<tr>
						<th scope="row">
							<label for="show_agents"><?php esc_html_e( 'Show Agents', 'askany' ); ?></label>
						</th>
						<td>
							<label class="askany-switch">
								<input type="checkbox" id="show_agents" name="show_agents" value="1" 
									<?php checked( ! empty( $settings['show_agents'] ) ); ?> />
								<span class="askany-slider"></span>
							</label>
							<p class="description">
								<?php esc_html_e( 'Display agent avatars on the home page.', 'askany' ); ?>
							</p>
						</td>
					</tr>
				</table>
				
				<p class="submit">
					<button type="submit" class="button button-primary">
						<?php esc_html_e( 'Save General Settings', 'askany' ); ?>
					</button>
				</p>
			</form>
		</div>

		<!-- Documentation Settings -->
		<div class="askany-admin-section">
			<h2><?php esc_html_e( 'Documentation Settings', 'askany' ); ?></h2>
			<form id="askany-home-documentation-form" method="post">
				<?php wp_nonce_field( 'askany_save_home_settings', 'askany_home_nonce' ); ?>
				
				<table class="form-table">
					<tr>
						<th scope="row">
							<label for="show_documentation"><?php esc_html_e( 'Show Documentation Link', 'askany' ); ?></label>
						</th>
						<td>
							<label class="askany-switch">
								<input type="checkbox" id="show_documentation" name="show_documentation" value="1" 
									<?php checked( ! empty( $settings['show_documentation'] ) ); ?> />
								<span class="askany-slider"></span>
							</label>
							<p class="description">
								<?php esc_html_e( 'Display a link to your documentation on the home page.', 'askany' ); ?>
							</p>
						</td>
					</tr>
					
					<tr>
						<th scope="row">
							<label for="documentation_url"><?php esc_html_e( 'Documentation URL', 'askany' ); ?></label>
						</th>
						<td>
							<input type="url" id="documentation_url" name="documentation_url" 
								value="<?php echo esc_attr( $settings['documentation_url'] ?? '' ); ?>" 
								class="regular-text" />
							<p class="description">
								<?php esc_html_e( 'The URL to your documentation page.', 'askany' ); ?>
							</p>
						</td>
					</tr>
					
					<tr>
						<th scope="row">
							<label for="documentation_description"><?php esc_html_e( 'Documentation Description', 'askany' ); ?></label>
						</th>
						<td>
							<input type="text" id="documentation_description" name="documentation_description" 
								value="<?php echo esc_attr( $settings['documentation_description'] ?? __( 'Find detailed guides and tutorials', 'askany' ) ); ?>" 
								class="regular-text" />
							<p class="description">
								<?php esc_html_e( 'A brief description of your documentation.', 'askany' ); ?>
							</p>
						</td>
					</tr>
				</table>
				
				<p class="submit">
					<button type="submit" class="button button-primary">
						<?php esc_html_e( 'Save Documentation Settings', 'askany' ); ?>
					</button>
				</p>
			</form>
		</div>


		<!-- FAQ Management -->
		<div class="askany-admin-section">
			<h2>
				<?php esc_html_e( 'FAQ Management', 'askany' ); ?>
				<?php
				$plugin = \Askany\Plugin::get_instance();
				$is_pro = $plugin->is_pro_active();
				$faq_count = count( $faqs );
				$free_faq_limit = 1;
				
				if ( ! $is_pro ) {
					echo '<span class="askany-limit-badge">';
					echo esc_html( sprintf( __( '%d / %d FAQ', 'askany' ), $faq_count, $free_faq_limit ) );
					echo '</span>';
				}
				?>
			</h2>
			
			<div class="askany-section-header">
				<label class="askany-switch">
					<input type="checkbox" id="show_faq" name="show_faq" value="1" 
						<?php checked( ! empty( $settings['show_faq'] ) ); ?> />
					<span class="askany-slider"></span>
				</label>
				<span><?php esc_html_e( 'Show FAQ Section', 'askany' ); ?></span>
				
				<?php
				$is_faq_limit_reached = ! $is_pro && $faq_count >= $free_faq_limit;
				$button_class = $is_faq_limit_reached ? 'button button-secondary askany-add-faq-btn-locked' : 'button button-secondary askany-add-faq-btn';
				?>
				<button type="button" class="<?php echo esc_attr( $button_class ); ?>" style="margin-left: auto;">
					<?php esc_html_e( 'Add New FAQ', 'askany' ); ?>
					<?php if ( $is_faq_limit_reached ) : ?>
						<span class="askany-pro-badge small inline" style="margin-left: 6px;">
							<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 24 24" fill="currentColor">
								<polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon>
							</svg>
							<?php esc_html_e( 'PRO', 'askany' ); ?>
						</span>
					<?php endif; ?>
				</button>
			</div>
			
			<div class="askany-faq-list <?php echo $is_faq_limit_reached ? 'askany-pro-locked' : ''; ?>">
				<?php if ( ! empty( $faqs ) ) : ?>
					<?php 
					$item_index = 0;
					foreach ( $faqs as $faq ) { 
						$item_index++;
						$is_locked = ! $is_pro && $item_index > $free_faq_limit;
					?>
					<div class="askany-faq-item <?php echo $is_locked ? 'askany-locked-item' : ''; ?>" data-faq-id="<?php echo esc_attr( $faq->id ); ?>">
						<?php if ( $is_locked ) : ?>
							<div class="askany-pro-overlay">
								<div class="askany-pro-lock-icon">
									<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
										<rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect>
										<path d="M7 11V7a5 5 0 0 1 10 0v4"></path>
									</svg>
								</div>
							</div>
						<?php endif; ?>
						<div class="askany-faq-header">
							<div class="askany-faq-controls">
								<label class="askany-switch">
									<input type="checkbox" class="faq-active-toggle" 
										<?php checked( $faq->is_active ); ?> 
										<?php echo $is_locked ? 'disabled' : ''; ?> />
									<span class="askany-slider"></span>
								</label>
								<span class="askany-faq-question"><?php echo esc_html( $faq->question ); ?></span>
							</div>
							<div class="askany-faq-actions">
								<button type="button" class="button button-small askany-edit-faq-btn" <?php echo $is_locked ? 'disabled' : ''; ?>>
									<?php esc_html_e( 'Edit', 'askany' ); ?>
								</button>
								<button type="button" class="button button-small askany-delete-faq-btn" <?php echo $is_locked ? 'disabled' : ''; ?>>
									<?php esc_html_e( 'Delete', 'askany' ); ?>
								</button>
							</div>
						</div>
						<div class="askany-faq-content askany-markdown-content" style="display: none;">
							<?php echo wp_kses_post( $faq->answer ); ?>
						</div>
					</div>
					<?php } ?>
				<?php else : ?>
					<p class="askany-no-items"><?php esc_html_e( 'No FAQs found. Add your first FAQ to get started.', 'askany' ); ?></p>
				<?php endif; ?>
			</div>
		</div>

		<!-- Custom Links Management -->
		<div class="askany-admin-section">
			<h2>
				<?php esc_html_e( 'Custom Links Management', 'askany' ); ?>
				<?php
				$link_count = count( $custom_links );
				$free_link_limit = 1;
				
				if ( ! $is_pro ) {
					echo '<span class="askany-limit-badge">';
					echo esc_html( sprintf( __( '%d / %d Link', 'askany' ), $link_count, $free_link_limit ) );
					echo '</span>';
				}
				?>
			</h2>
			
			<div class="askany-section-header">
				<label class="askany-switch">
					<input type="checkbox" id="show_custom_links" name="show_custom_links" value="1" 
						<?php checked( ! empty( $settings['show_custom_links'] ) ); ?> />
					<span class="askany-slider"></span>
				</label>
				<span><?php esc_html_e( 'Show Custom Links', 'askany' ); ?></span>
				
				<?php
				$is_link_limit_reached = ! $is_pro && $link_count >= $free_link_limit;
				$button_class = $is_link_limit_reached ? 'button button-secondary askany-add-link-btn-locked' : 'button button-secondary askany-add-link-btn';
				?>
				<button type="button" class="<?php echo esc_attr( $button_class ); ?>" style="margin-left: auto;">
					<?php esc_html_e( 'Add New Link', 'askany' ); ?>
					<?php if ( $is_link_limit_reached ) : ?>
						<span class="askany-pro-badge small inline" style="margin-left: 6px;">
							<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 24 24" fill="currentColor">
								<polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon>
							</svg>
							<?php esc_html_e( 'PRO', 'askany' ); ?>
						</span>
					<?php endif; ?>
				</button>
			</div>
			
			<div class="askany-links-list <?php echo $is_link_limit_reached ? 'askany-pro-locked' : ''; ?>">
				<?php if ( ! empty( $custom_links ) ) : ?>
					<?php 
					$item_index = 0;
					foreach ( $custom_links as $link ) { 
						$item_index++;
						$is_locked = ! $is_pro && $item_index > $free_link_limit;
					?>
					<div class="askany-link-item <?php echo $is_locked ? 'askany-locked-item' : ''; ?>" data-link-id="<?php echo esc_attr( $link->id ); ?>">
						<?php if ( $is_locked ) : ?>
							<div class="askany-pro-overlay">
								<div class="askany-pro-lock-icon">
									<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
										<rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect>
										<path d="M7 11V7a5 5 0 0 1 10 0v4"></path>
									</svg>
								</div>
							</div>
						<?php endif; ?>
						<div class="askany-link-header">
							<div class="askany-link-controls">
								<label class="askany-switch">
									<input type="checkbox" class="link-active-toggle" 
										<?php checked( $link->is_active ); ?> 
										<?php echo $is_locked ? 'disabled' : ''; ?> />
									<span class="askany-slider"></span>
								</label>
								<div class="askany-link-info">
									<span class="askany-link-title"><?php echo esc_html( $link->title ); ?></span>
									<span class="askany-link-url"><?php echo esc_html( $link->url ); ?></span>
								</div>
							</div>
							<div class="askany-link-actions">
								<button type="button" class="button button-small askany-edit-link-btn" <?php echo $is_locked ? 'disabled' : ''; ?>>
									<?php esc_html_e( 'Edit', 'askany' ); ?>
								</button>
								<button type="button" class="button button-small askany-delete-link-btn" <?php echo $is_locked ? 'disabled' : ''; ?>>
									<?php esc_html_e( 'Delete', 'askany' ); ?>
								</button>
							</div>
						</div>
						<div class="askany-link-description">
							<?php echo esc_html( $link->description ); ?>
						</div>
					</div>
					<?php } ?>
				<?php else : ?>
					<p class="askany-no-items"><?php esc_html_e( 'No custom links found. Add your first link to get started.', 'askany' ); ?></p>
				<?php endif; ?>
			</div>
		</div>

		<!-- Get Started Page Settings -->
		<div class="askany-admin-section <?php echo ! $is_pro ? 'askany-pro-locked' : ''; ?>">
			<h2>
				<?php esc_html_e( 'Get Started Page', 'askany' ); ?>
				<?php if ( ! $is_pro ) : ?>
					<span class="askany-pro-tag" title="<?php esc_attr_e( 'This feature requires Pro version', 'askany' ); ?>">PRO</span>
				<?php endif; ?>
			</h2>
			
			<form id="askany-home-getstarted-form" method="post" <?php echo ! $is_pro ? 'class="askany-pro-locked-form"' : ''; ?>>
				<?php wp_nonce_field( 'askany_save_home_settings', 'askany_home_nonce' ); ?>
				
				<table class="form-table">
					<tr>
						<th scope="row">
							<label for="get_started_enabled"><?php esc_html_e( 'Enable Get Started Page', 'askany' ); ?></label>
						</th>
						<td>
							<label class="askany-switch">
								<input type="checkbox" id="get_started_enabled" name="get_started_enabled" value="1" 
									<?php checked( ! empty( $settings['get_started_enabled'] ) ); ?> />
								<span class="askany-slider"></span>
			</label>
							<p class="description">
								<?php esc_html_e( 'Show a get started page before the chat where users provide their name and email.', 'askany' ); ?>
							</p>
						</td>
					</tr>
					
					<tr>
						<th scope="row">
							<label for="get_started_title"><?php esc_html_e( 'Page Title', 'askany' ); ?></label>
						</th>
						<td>
							<input type="text" id="get_started_title" name="get_started_title" 
								value="<?php echo esc_attr( $settings['get_started_title'] ?? __( 'Welcome! Let\'s Get Started', 'askany' ) ); ?>" 
								class="regular-text" />
							<p class="description">
								<?php esc_html_e( 'The title displayed on the get started page.', 'askany' ); ?>
							</p>
						</td>
					</tr>
					
					<tr>
						<th scope="row">
							<label for="get_started_description"><?php esc_html_e( 'Page Description', 'askany' ); ?></label>
						</th>
						<td>
							<textarea id="get_started_description" name="get_started_description" 
								rows="3" class="large-text"><?php echo esc_textarea( $settings['get_started_description'] ?? __( 'Please provide your name and email to start chatting with us.', 'askany' ) ); ?></textarea>
							<p class="description">
								<?php esc_html_e( 'A brief description shown on the get started page.', 'askany' ); ?>
							</p>
						</td>
					</tr>
					
					<tr>
						<th scope="row">
							<label for="get_started_name_label"><?php esc_html_e( 'Name Field Label', 'askany' ); ?></label>
						</th>
						<td>
							<input type="text" id="get_started_name_label" name="get_started_name_label" 
								value="<?php echo esc_attr( $settings['get_started_name_label'] ?? __( 'Your Name', 'askany' ) ); ?>" 
								class="regular-text" />
						</td>
					</tr>
					
					<tr>
						<th scope="row">
							<label for="get_started_email_label"><?php esc_html_e( 'Email Field Label', 'askany' ); ?></label>
						</th>
						<td>
							<input type="text" id="get_started_email_label" name="get_started_email_label" 
								value="<?php echo esc_attr( $settings['get_started_email_label'] ?? __( 'Your Email', 'askany' ) ); ?>" 
								class="regular-text" />
						</td>
					</tr>
					
					<tr>
						<th scope="row">
							<label for="get_started_button_text"><?php esc_html_e( 'Button Text', 'askany' ); ?></label>
						</th>
						<td>
							<input type="text" id="get_started_button_text" name="get_started_button_text" 
								value="<?php echo esc_attr( $settings['get_started_button_text'] ?? __( 'Start Chat', 'askany' ) ); ?>" 
								class="regular-text" />
						</td>
					</tr>
					
					<tr>
						<th scope="row">
							<label for="get_started_name_required"><?php esc_html_e( 'Name Required', 'askany' ); ?></label>
						</th>
						<td>
							<label class="askany-switch">
								<input type="checkbox" id="get_started_name_required" name="get_started_name_required" value="1" 
									<?php checked( ! empty( $settings['get_started_name_required'] ) ); ?> />
								<span class="askany-slider"></span>
							</label>
							<p class="description">
								<?php esc_html_e( 'Make the name field required.', 'askany' ); ?>
							</p>
						</td>
					</tr>
					
					<tr>
						<th scope="row">
							<label for="get_started_email_required"><?php esc_html_e( 'Email Required', 'askany' ); ?></label>
						</th>
						<td>
							<label class="askany-switch">
								<input type="checkbox" id="get_started_email_required" name="get_started_email_required" value="1" 
									<?php checked( ! empty( $settings['get_started_email_required'] ) ); ?> />
								<span class="askany-slider"></span>
							</label>
							<p class="description">
								<?php esc_html_e( 'Make the email field required.', 'askany' ); ?>
							</p>
						</td>
					</tr>
				</table>
				
				<p class="submit">
					<button type="submit" class="button button-primary">
						<?php esc_html_e( 'Save Get Started Settings', 'askany' ); ?>
					</button>
				</p>
			</form>
			
			<?php if ( ! $is_pro ) : ?>
				<div class="askany-pro-overlay">
					<div class="askany-pro-notice-small">
						<div class="askany-pro-notice-icon">
							<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
								<rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect>
								<path d="M7 11V7a5 5 0 0 1 10 0v4"></path>
							</svg>
						</div>
						<div class="askany-pro-notice-content">
							<h4><?php esc_html_e( 'Get Started Page is a Pro Feature', 'askany' ); ?></h4>
							<p><?php esc_html_e( 'Collect user information before chat and personalize their experience.', 'askany' ); ?></p>
							<button type="button" class="button button-primary askany-open-pro-modal-getstarted askany-open-pro-modal">
								<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="currentColor" style="margin-right: 6px;">
									<polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon>
								</svg>
								<?php esc_html_e( 'Upgrade to Pro', 'askany' ); ?>
							</button>
						</div>
					</div>
				</div>
			<?php endif; ?>
		</div>

		<!-- News Section Settings -->
		<div class="askany-admin-section <?php echo ! $is_pro ? 'askany-pro-locked' : ''; ?>">
			<h2>
				<?php esc_html_e( 'News Section', 'askany' ); ?>
				<?php if ( ! $is_pro ) : ?>
					<span class="askany-pro-badge"><?php esc_html_e( 'PRO', 'askany' ); ?></span>
				<?php endif; ?>
			</h2>
			<form id="askany-home-news-form" method="post" <?php echo ! $is_pro ? 'class="askany-pro-locked-form"' : ''; ?>>
				<?php wp_nonce_field( 'askany_save_home_settings', 'askany_home_nonce' ); ?>
				
				<table class="form-table">
					<tr>
						<th scope="row">
							<label for="news_enabled"><?php esc_html_e( 'Enable News Section', 'askany' ); ?></label>
						</th>
						<td>
							<label class="askany-switch">
								<input type="checkbox" id="news_enabled" name="news_enabled" value="1" 
									<?php checked( ! empty( $settings['news_enabled'] ) ); ?> />
								<span class="askany-slider"></span>
							</label>
							<p class="description">
								<?php esc_html_e( 'Display a News tab in the chat widget showing recent blog posts.', 'askany' ); ?>
							</p>
						</td>
					</tr>
					
					<tr>
						<th scope="row">
							<label for="news_label"><?php esc_html_e( 'Tab Label', 'askany' ); ?></label>
						</th>
						<td>
							<input type="text" id="news_label" name="news_label" 
								value="<?php echo esc_attr( $settings['news_label'] ?? __( 'News', 'askany' ) ); ?>" 
								class="regular-text" />
							<p class="description">
								<?php esc_html_e( 'The label displayed on the News tab.', 'askany' ); ?>
							</p>
						</td>
					</tr>
					
					<tr>
						<th scope="row">
							<label><?php esc_html_e( 'Display Mode', 'askany' ); ?></label>
						</th>
						<td>
							<fieldset>
								<label>
									<input type="radio" name="news_mode" value="latest" 
										<?php checked( ( $settings['news_mode'] ?? 'latest' ) === 'latest' ); ?> />
									<?php esc_html_e( 'Show Latest Posts', 'askany' ); ?>
								</label>
								<br>
								<label>
									<input type="radio" name="news_mode" value="selected" 
										<?php checked( ( $settings['news_mode'] ?? 'latest' ) === 'selected' ); ?> />
									<?php esc_html_e( 'Select Specific Posts', 'askany' ); ?>
								</label>
							</fieldset>
							<p class="description">
								<?php esc_html_e( 'Choose whether to show latest posts or manually select posts to display.', 'askany' ); ?>
							</p>
						</td>
					</tr>
					
					<tr class="news-latest-options">
						<th scope="row">
							<label for="news_timeframe"><?php esc_html_e( 'Timeframe', 'askany' ); ?></label>
						</th>
						<td>
							<select id="news_timeframe" name="news_timeframe" class="regular-text">
								<option value="7" <?php selected( $settings['news_timeframe'] ?? 7, 7 ); ?>>
									<?php esc_html_e( 'Last 7 days', 'askany' ); ?>
								</option>
								<option value="14" <?php selected( $settings['news_timeframe'] ?? 7, 14 ); ?>>
									<?php esc_html_e( 'Last 14 days', 'askany' ); ?>
								</option>
								<option value="30" <?php selected( $settings['news_timeframe'] ?? 7, 30 ); ?>>
									<?php esc_html_e( 'Last 30 days', 'askany' ); ?>
								</option>
								<option value="60" <?php selected( $settings['news_timeframe'] ?? 7, 60 ); ?>>
									<?php esc_html_e( 'Last 60 days', 'askany' ); ?>
								</option>
								<option value="90" <?php selected( $settings['news_timeframe'] ?? 7, 90 ); ?>>
									<?php esc_html_e( 'Last 90 days', 'askany' ); ?>
								</option>
							</select>
							<p class="description">
								<?php esc_html_e( 'Show posts published within this timeframe.', 'askany' ); ?>
							</p>
						</td>
					</tr>
					
					<tr class="news-selected-options" style="display: none;">
						<th scope="row">
							<label><?php esc_html_e( 'Select Posts', 'askany' ); ?></label>
						</th>
						<td>
							<div class="askany-post-selector">
								<div class="askany-post-search">
									<input type="text" id="news-post-search" placeholder="<?php esc_attr_e( 'Search posts...', 'askany' ); ?>" class="regular-text" />
								</div>
								<div class="askany-post-list" id="news-post-list">
									<?php
									$news_handler = \Askany\Plugin::get_instance()->get_news_handler();
									$all_posts = $news_handler->get_all_posts_for_selection( 100 );
									$selected_posts = $settings['news_selected_posts'] ?? array();
									
									foreach ( $all_posts as $post ) :
									?>
									<label class="askany-post-item">
										<input type="checkbox" name="news_selected_posts[]" 
											value="<?php echo esc_attr( $post['id'] ); ?>"
											<?php checked( in_array( $post['id'], $selected_posts ) ); ?> />
										<span class="post-title"><?php echo esc_html( $post['title'] ); ?></span>
										<span class="post-date"><?php echo esc_html( $post['date'] ); ?></span>
									</label>
									<?php endforeach; ?>
								</div>
							</div>
							<p class="description">
								<?php esc_html_e( 'Select which posts to display in the News section.', 'askany' ); ?>
							</p>
						</td>
					</tr>
					
					<tr>
						<th scope="row">
							<label for="news_count"><?php esc_html_e( 'Number of Posts', 'askany' ); ?></label>
						</th>
						<td>
							<input type="number" id="news_count" name="news_count" 
								value="<?php echo esc_attr( $settings['news_count'] ?? 5 ); ?>" 
								min="1" max="20" class="small-text" />
							<p class="description">
								<?php esc_html_e( 'Maximum number of posts to display (1-20).', 'askany' ); ?>
							</p>
						</td>
					</tr>
					
					<tr>
						<th scope="row">
							<label for="news_excerpt_length"><?php esc_html_e( 'Excerpt Length', 'askany' ); ?></label>
						</th>
						<td>
							<input type="number" id="news_excerpt_length" name="news_excerpt_length" 
								value="<?php echo esc_attr( $settings['news_excerpt_length'] ?? 150 ); ?>" 
								min="50" max="500" class="small-text" />
							<p class="description">
								<?php esc_html_e( 'Number of characters to show in post preview (50-500).', 'askany' ); ?>
							</p>
						</td>
					</tr>
				</table>
				
				<p class="submit">
					<button type="submit" class="button button-primary">
						<?php esc_html_e( 'Save News Settings', 'askany' ); ?>
					</button>
				</p>
			</form>
			
			<?php if ( ! $is_pro ) : ?>
				<div class="askany-pro-overlay">
					<div class="askany-pro-notice-small">
						<div class="askany-pro-notice-icon">
							<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
								<rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect>
								<path d="M7 11V7a5 5 0 0 1 10 0v4"></path>
							</svg>
						</div>
						<div class="askany-pro-notice-content">
							<h4><?php esc_html_e( 'News Section is a Pro Feature', 'askany' ); ?></h4>
							<p><?php esc_html_e( 'Display your latest blog posts in the chat widget to keep users informed and engaged.', 'askany' ); ?></p>
							<button type="button" class="button button-primary askany-open-pro-modal-getstarted askany-open-pro-modal">
								<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="currentColor" style="margin-right: 6px;">
									<polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon>
								</svg>
								<?php esc_html_e( 'Upgrade to Pro', 'askany' ); ?>
							</button>
						</div>
					</div>
				</div>
			<?php endif; ?>
		</div>

		
		<!-- Report Issue Settings -->
		<div class="askany-admin-section <?php echo ! $is_pro ? 'askany-pro-locked' : ''; ?>">
			<h2>
				<?php esc_html_e( 'Report Issue', 'askany' ); ?>
				<?php if ( ! $is_pro ) : ?>
					<span class="askany-pro-badge"><?php esc_html_e( 'PRO', 'askany' ); ?></span>
				<?php endif; ?>
			</h2>
			<form id="askany-home-report-issue-form" method="post" <?php echo ! $is_pro ? 'class="askany-pro-locked-form"' : ''; ?>>
				<?php wp_nonce_field( 'askany_save_home_settings', 'askany_home_nonce' ); ?>
				
				<table class="form-table">
					<tr>
						<th scope="row">
							<label for="report_issue_enabled"><?php esc_html_e( 'Enable Report Issue', 'askany' ); ?></label>
						</th>
						<td>
							<label class="askany-switch">
								<input type="checkbox" id="report_issue_enabled" name="report_issue_enabled" value="1" 
									<?php checked( ! empty( $settings['report_issue_enabled'] ) ); ?> />
								<span class="askany-slider"></span>
							</label>
							<p class="description">
								<?php esc_html_e( 'Allow users to report bugs and issues through the chat.', 'askany' ); ?>
							</p>
						</td>
					</tr>
					
					<tr>
						<th scope="row">
							<label for="report_issue_title"><?php esc_html_e( 'Title', 'askany' ); ?></label>
						</th>
						<td>
							<input type="text" id="report_issue_title" name="report_issue_title" 
								value="<?php echo esc_attr( $settings['report_issue_title'] ?? __( 'Report an issue?', 'askany' ) ); ?>" 
								class="regular-text" />
							<p class="description">
								<?php esc_html_e( 'The title displayed on the home page.', 'askany' ); ?>
							</p>
						</td>
					</tr>
					
					<tr>
						<th scope="row">
							<label for="report_issue_description"><?php esc_html_e( 'Description', 'askany' ); ?></label>
						</th>
						<td>
							<input type="text" id="report_issue_description" name="report_issue_description" 
								value="<?php echo esc_attr( $settings['report_issue_description'] ?? __( 'Found a bug? Let us know.', 'askany' ) ); ?>" 
								class="regular-text" />
							<p class="description">
								<?php esc_html_e( 'A brief description shown below the title.', 'askany' ); ?>
							</p>
						</td>
					</tr>
					
					<tr>
						<th scope="row">
							<label for="report_issue_message"><?php esc_html_e( 'AI Initial Message', 'askany' ); ?></label>
						</th>
						<td>
							<textarea id="report_issue_message" name="report_issue_message" 
								rows="3" class="large-text"><?php echo esc_textarea( $settings['report_issue_message'] ?? __( 'Hey 👋 Found a bug? Please describe the issue below. Also, please share your name and email so we can follow up with you.', 'askany' ) ); ?></textarea>
							<p class="description">
								<?php esc_html_e( 'The message AI will send when user clicks to report an issue.', 'askany' ); ?>
							</p>
						</td>
					</tr>
				</table>
				
				<p class="submit">
					<button type="submit" class="button button-primary">
						<?php esc_html_e( 'Save Report Issue Settings', 'askany' ); ?>
					</button>
				</p>

				<!-- How It Works Note - Report Issue -->
				<div style="background: #f0f6fc; border-left: 4px solid #2271b1; border-radius: 4px; padding: 16px 20px; margin: 16px 0 20px;">
					<p style="margin: 0 0 10px; font-weight: 600; font-size: 13px; color: #1d2327; display: flex; align-items: center; gap: 7px;">
						<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="#2271b1" stroke-width="2.5" style="flex-shrink:0;"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12"/><line x1="12" y1="16" x2="12.01" y2="16"/></svg>
						<?php esc_html_e( 'How Report Issue Works', 'askany' ); ?>
					</p>
					<ul style="margin: 0; padding-left: 18px; font-size: 12.5px; color: #50575e; line-height: 1.8;">
						<li>
							<strong style="color:#1d2327;"><?php esc_html_e( 'Home link enabled:', 'askany' ); ?></strong>
							<?php esc_html_e( 'Users click the "Report an Issue" card on the chat home screen and the report form appears automatically.', 'askany' ); ?>
						</li>
						<li>
							<strong style="color:#1d2327;"><?php esc_html_e( 'Home link disabled:', 'askany' ); ?></strong>
							<?php esc_html_e( 'Users open the chat and type something like', 'askany' ); ?>
							<em>"<?php esc_html_e( 'I have a bug to report', 'askany' ); ?>"</em> —
							<?php esc_html_e( 'the AI will detect the intent and guide them through the report form step by step.', 'askany' ); ?>
						</li>
						<li>
							<?php esc_html_e( 'Once submitted, a unique', 'askany' ); ?>
							<strong style="color:#1d2327;"><?php esc_html_e( 'Report ID', 'askany' ); ?></strong>
							<?php esc_html_e( 'is generated and shared with the user so they can track the status of their report later.', 'askany' ); ?>
						</li>
					</ul>
				</div>
			</form>
			
			<?php if ( ! $is_pro ) : ?>
				<div class="askany-pro-overlay">
					<div class="askany-pro-notice-small">
						<div class="askany-pro-notice-icon">
							<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
								<rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect>
								<path d="M7 11V7a5 5 0 0 1 10 0v4"></path>
							</svg>
						</div>
						<div class="askany-pro-notice-content">
							<h4><?php esc_html_e( 'Report Issue is a Pro Feature', 'askany' ); ?></h4>
							<p><?php esc_html_e( 'Allow users to report bugs and issues directly through the chat widget.', 'askany' ); ?></p>
							<button type="button" class="button button-primary askany-open-pro-modal">
								<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="currentColor" style="margin-right: 6px;">
									<polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon>
								</svg>
								<?php esc_html_e( 'Upgrade to Pro', 'askany' ); ?>
							</button>
						</div>
					</div>
				</div>
			<?php endif; ?>
		</div>

		<!-- Feature Request Settings -->
		<div class="askany-admin-section <?php echo ! $is_pro ? 'askany-pro-locked' : ''; ?>">
			<h2>
				<?php esc_html_e( 'Feature Request', 'askany' ); ?>
				<?php if ( ! $is_pro ) : ?>
					<span class="askany-pro-badge"><?php esc_html_e( 'PRO', 'askany' ); ?></span>
				<?php endif; ?>
			</h2>
			<form id="askany-home-feature-request-form" method="post" <?php echo ! $is_pro ? 'class="askany-pro-locked-form"' : ''; ?>>
				<?php wp_nonce_field( 'askany_save_home_settings', 'askany_home_nonce' ); ?>
				
				<table class="form-table">
					<tr>
						<th scope="row">
							<label for="feature_request_enabled"><?php esc_html_e( 'Enable Feature Request', 'askany' ); ?></label>
						</th>
						<td>
							<label class="askany-switch">
								<input type="checkbox" id="feature_request_enabled" name="feature_request_enabled" value="1" 
									<?php checked( ! empty( $settings['feature_request_enabled'] ) ); ?> />
								<span class="askany-slider"></span>
							</label>
							<p class="description">
								<?php esc_html_e( 'Allow users to request new features through the chat.', 'askany' ); ?>
							</p>
						</td>
					</tr>
					
					<tr>
						<th scope="row">
							<label for="feature_request_title"><?php esc_html_e( 'Title', 'askany' ); ?></label>
						</th>
						<td>
							<input type="text" id="feature_request_title" name="feature_request_title" 
								value="<?php echo esc_attr( $settings['feature_request_title'] ?? __( 'Request a feature', 'askany' ) ); ?>" 
								class="regular-text" />
							<p class="description">
								<?php esc_html_e( 'The title displayed on the home page.', 'askany' ); ?>
							</p>
						</td>
					</tr>
					
					<tr>
						<th scope="row">
							<label for="feature_request_description"><?php esc_html_e( 'Description', 'askany' ); ?></label>
						</th>
						<td>
							<input type="text" id="feature_request_description" name="feature_request_description" 
								value="<?php echo esc_attr( $settings['feature_request_description'] ?? __( 'What would you like to see next?', 'askany' ) ); ?>" 
								class="regular-text" />
							<p class="description">
								<?php esc_html_e( 'A brief description shown below the title.', 'askany' ); ?>
							</p>
						</td>
					</tr>
					
					<tr>
						<th scope="row">
							<label for="feature_request_message"><?php esc_html_e( 'AI Initial Message', 'askany' ); ?></label>
						</th>
						<td>
							<textarea id="feature_request_message" name="feature_request_message" 
								rows="3" class="large-text"><?php echo esc_textarea( $settings['feature_request_message'] ?? __( 'What feature would you like to see next? Share your name, email and feature details so we can consider it for future updates.', 'askany' ) ); ?></textarea>
							<p class="description">
								<?php esc_html_e( 'The message AI will send when user clicks to request a feature.', 'askany' ); ?>
							</p>
						</td>
					</tr>
				</table>
				<p class="submit">
					<button type="submit" class="button button-primary">
						<?php esc_html_e( 'Save Feature Request Settings', 'askany' ); ?>
					</button>
				</p>

				<!-- How It Works Note - Feature Request -->
				<div style="background: #f0f6fc; border-left: 4px solid #2271b1; border-radius: 4px; padding: 16px 20px; margin: 16px 0 20px;">
					<p style="margin: 0 0 10px; font-weight: 600; font-size: 13px; color: #1d2327; display: flex; align-items: center; gap: 7px;">
						<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="#2271b1" stroke-width="2.5" style="flex-shrink:0;"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12"/><line x1="12" y1="16" x2="12.01" y2="16"/></svg>
						<?php esc_html_e( 'How Feature Request Works', 'askany' ); ?>
					</p>
					<ul style="margin: 0; padding-left: 18px; font-size: 12.5px; color: #50575e; line-height: 1.8;">
						<li>
							<strong style="color:#1d2327;"><?php esc_html_e( 'Home link enabled:', 'askany' ); ?></strong>
							<?php esc_html_e( 'Users click the "Request a Feature" card on the chat home screen and the feature form appears automatically.', 'askany' ); ?>
						</li>
						<li>
							<strong style="color:#1d2327;"><?php esc_html_e( 'Home link disabled:', 'askany' ); ?></strong>
							<?php esc_html_e( 'Users open the chat and type something like', 'askany' ); ?>
							<em>"<?php esc_html_e( 'I have a feature idea to share', 'askany' ); ?>"</em> —
							<?php esc_html_e( 'the AI will detect the intent and walk them through the request form.', 'askany' ); ?>
						</li>
						<li>
							<?php esc_html_e( 'Once submitted, a unique', 'askany' ); ?>
							<strong style="color:#1d2327;"><?php esc_html_e( 'Request ID', 'askany' ); ?></strong>
							<?php esc_html_e( 'is generated and shared with the user so they can reference or track their request later.', 'askany' ); ?>
						</li>
					</ul>
				</div>
			</form>
			
			<?php if ( ! $is_pro ) : ?>
				<div class="askany-pro-overlay">
					<div class="askany-pro-notice-small">
						<div class="askany-pro-notice-icon">
							<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
								<rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect>
								<path d="M7 11V7a5 5 0 0 1 10 0v4"></path>
							</svg>
						</div>
						<div class="askany-pro-notice-content">
							<h4><?php esc_html_e( 'Feature Request is a Pro Feature', 'askany' ); ?></h4>
							<p><?php esc_html_e( 'Allow users to request new features directly through the chat widget.', 'askany' ); ?></p>
							<button type="button" class="button button-primary askany-open-pro-modal">
								<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="currentColor" style="margin-right: 6px;">
									<polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon>
								</svg>
								<?php esc_html_e( 'Upgrade to Pro', 'askany' ); ?>
							</button>
						</div>
					</div>
				</div>
			<?php endif; ?>
		</div>

		
	</div>
</div>

<!-- FAQ Modal -->
<div id="askany-faq-modal" class="askany-modal" style="display: none;">
	<div class="askany-modal-content">
		<div class="askany-modal-header">
			<h3 id="askany-faq-modal-title"><?php esc_html_e( 'Add FAQ', 'askany' ); ?></h3>
			<button type="button" class="askany-modal-close">&times;</button>
		</div>
		<div class="askany-modal-body">
			<form id="askany-faq-form">
				<input type="hidden" id="faq-id" name="faq_id" value="" />
				
				<div class="askany-form-group">
					<label for="faq-question"><?php esc_html_e( 'Question', 'askany' ); ?></label>
					<input type="text" id="faq-question" name="question" required class="regular-text" />
				</div>
				
				<div class="askany-form-group">
					<label for="faq-answer"><?php esc_html_e( 'Answer', 'askany' ); ?></label>
					<textarea id="faq-answer" name="answer" required rows="10" class="large-text"></textarea>
					<p class="description"><?php esc_html_e( 'Enter the answer with markdown formatting support (bold, italic, lists, links, etc.).', 'askany' ); ?></p>
				</div>
				
				<div class="askany-form-group">
					<label for="faq-order"><?php esc_html_e( 'Display Order', 'askany' ); ?></label>
					<input type="number" id="faq-order" name="display_order" value="0" min="0" class="small-text" />
				</div>
			</form>
		</div>
		<div class="askany-modal-footer">
			<button type="button" class="button button-secondary askany-modal-cancel">
				<?php esc_html_e( 'Cancel', 'askany' ); ?>
			</button>
			<button type="button" class="button button-primary askany-save-faq-btn">
				<?php esc_html_e( 'Save FAQ', 'askany' ); ?>
			</button>
		</div>
	</div>
</div>

<!-- Custom Link Modal -->
<div id="askany-link-modal" class="askany-modal" style="display: none;">
	<div class="askany-modal-content">
		<div class="askany-modal-header">
			<h3 id="askany-link-modal-title"><?php esc_html_e( 'Add Custom Link', 'askany' ); ?></h3>
			<button type="button" class="askany-modal-close">&times;</button>
		</div>
		<div class="askany-modal-body">
			<form id="askany-link-form">
				<input type="hidden" id="link-id" name="link_id" value="" />
				
				<div class="askany-form-group">
					<label for="link-title"><?php esc_html_e( 'Title', 'askany' ); ?></label>
					<input type="text" id="link-title" name="title" required class="regular-text" />
				</div>
				
				<div class="askany-form-group">
					<label for="link-description"><?php esc_html_e( 'Description', 'askany' ); ?></label>
					<input type="text" id="link-description" name="description" class="regular-text" />
				</div>
				
				<div class="askany-form-group">
					<label for="link-url"><?php esc_html_e( 'URL', 'askany' ); ?></label>
					<input type="url" id="link-url" name="url" required class="regular-text" />
				</div>
				
				<div class="askany-form-group">
					<label for="link-order"><?php esc_html_e( 'Display Order', 'askany' ); ?></label>
					<input type="number" id="link-order" name="display_order" value="0" min="0" class="small-text" />
				</div>
			</form>
		</div>
		<div class="askany-modal-footer">
			<button type="button" class="button button-secondary askany-modal-cancel">
				<?php esc_html_e( 'Cancel', 'askany' ); ?>
			</button>
			<button type="button" class="button button-primary askany-save-link-btn">
				<?php esc_html_e( 'Save Link', 'askany' ); ?>
			</button>
		</div>
	</div>
</div>


<script>
jQuery(document).ready(function($) {
	// Initialize Markdown Editor for FAQ Answer field
	var faqAnswerEditor = null;
	
	function initFaqMarkdownEditor() {
		if (faqAnswerEditor) {
			faqAnswerEditor.destroy();
		}
		faqAnswerEditor = new AskanyMarkdownEditor('faq-answer', {
			showPreview: true,
			showTabs: true,
			height: '250px',
			placeholder: 'Write your FAQ answer here... Markdown supported!\n\nExamples:\n**Bold text**\n*Italic text*\n- List item\n[Link](url)'
		});
	}
	
	// Initialize editor when FAQ modal opens
	$(document).on('click', '.askany-add-faq-btn, .askany-edit-faq-btn', function() {
		setTimeout(function() {
			if (typeof AskanyMarkdownEditor !== 'undefined') {
				initFaqMarkdownEditor();
			}
		}, 100);
	});
	
	// Render markdown in FAQ content display
	$('.askany-faq-item').each(function() {
		var $content = $(this).find('.askany-faq-content');
		var rawContent = $content.text().trim();
		
		if (rawContent && typeof AskanyMarkdown !== 'undefined' && AskanyMarkdown.parse) {
			$content.html(AskanyMarkdown.parse(rawContent));
		}
	});
	
	// Toggle FAQ content visibility
	$(document).on('click', '.askany-faq-question', function() {
		var $item = $(this).closest('.askany-faq-item');
		var $content = $item.find('.askany-faq-content');
		$content.slideToggle(200);
	});
});
</script>

<style>
/* FAQ content markdown styling */
.askany-faq-content.askany-markdown-content {
	padding: 15px;
	background: #f9f9f9;
	border-top: 1px solid #ddd;
	margin-top: 10px;
}

.askany-faq-content.askany-markdown-content h1,
.askany-faq-content.askany-markdown-content h2,
.askany-faq-content.askany-markdown-content h3,
.askany-faq-content.askany-markdown-content h4,
.askany-faq-content.askany-markdown-content h5,
.askany-faq-content.askany-markdown-content h6 {
	margin-top: 12px;
	margin-bottom: 8px;
	font-weight: 600;
}

.askany-faq-content.askany-markdown-content p {
	margin: 8px 0;
	line-height: 1.6;
}

.askany-faq-content.askany-markdown-content strong {
	font-weight: 600;
}

.askany-faq-content.askany-markdown-content code {
	padding: 2px 4px;
	background: #f0f0f0;
	border-radius: 3px;
	font-family: monospace;
	font-size: 13px;
}

.askany-faq-content.askany-markdown-content pre {
	background: #f5f5f5;
	padding: 10px;
	border-radius: 4px;
	overflow-x: auto;
	margin: 8px 0;
}

.askany-faq-content.askany-markdown-content ul,
.askany-faq-content.askany-markdown-content ol {
	margin: 8px 0;
	padding-left: 25px;
}

.askany-faq-content.askany-markdown-content blockquote {
	margin: 8px 0;
	padding: 8px 12px;
	background: #fff;
	border-left: 3px solid #2271b1;
}

.askany-faq-content.askany-markdown-content a {
	color: #2271b1;
	text-decoration: none;
}

.askany-faq-content.askany-markdown-content a:hover {
	text-decoration: underline;
}

.askany-faq-question {
	cursor: pointer;
	user-select: none;
}

.askany-faq-question:hover {
	color: #2271b1;
}
</style>
