<?php if ( ! defined( 'ABSPATH' ) ) { exit; } ?>
<div class="wrap">
	<div class="zacls-action-bar">
		<div class="zacls-action-left">
			<h1 class="zacls-page-title"><?php esc_html_e( 'Passkeys / WebAuthn', 'za-creative-login-shield' ); ?></h1>
		</div>
	</div>
	<p class="zacls-page-description"><?php esc_html_e( 'WebAuthn/Passkey support allows users to log in using Windows Hello, Face ID, Touch ID, or hardware security keys.', 'za-creative-login-shield' ); ?></p>

	<div class="zacls-section-card">
		<div class="zacls-section-card-header">
			<span class="dashicons dashicons-admin-settings"></span>
			<h3><?php esc_html_e( 'WebAuthn Settings', 'za-creative-login-shield' ); ?></h3>
		</div>
		<div class="zacls-section-card-body">
			<table class="form-table">
				<tr>
					<th><?php esc_html_e( 'Enable Passkeys', 'za-creative-login-shield' ); ?></th>
					<td>
						<label><input type="checkbox" id="zacls-webauthn-enabled" <?php checked( 'yes' === get_option( 'zacls_webauthn_enabled', 'no' ) ); ?>> <?php esc_html_e( 'Allow users to register and use passkeys for passwordless login', 'za-creative-login-shield' ); ?></label>
						<p class="description"><?php esc_html_e( 'When enabled, users can register passkeys from their profile page and use them to log in.', 'za-creative-login-shield' ); ?></p>
					</td>
				</tr>
			</table>
			<p><button type="button" class="zacls-btn zacls-btn-primary" id="zacls-save-webauthn"><?php esc_html_e( 'Save Settings', 'za-creative-login-shield' ); ?></button></p>
		</div>
	</div>

	<div class="zacls-section-card">
		<div class="zacls-section-card-header">
			<span class="dashicons dashicons-info"></span>
			<h3><?php esc_html_e( 'How It Works', 'za-creative-login-shield' ); ?></h3>
		</div>
		<div class="zacls-section-card-body">
			<ol>
				<li><?php esc_html_e( 'Users enable WebAuthn on their profile page under "Passkeys / WebAuthn".', 'za-creative-login-shield' ); ?></li>
				<li><?php esc_html_e( 'They click "Register New Passkey" and follow their browser\'s prompts (Windows Hello, Touch ID, Face ID, or security key).', 'za-creative-login-shield' ); ?></li>
				<li><?php esc_html_e( 'On subsequent logins, they can use the passkey instead of a password.', 'za-creative-login-shield' ); ?></li>
			</ol>
		</div>
	</div>

	<?php
	global $wpdb;
	$total_creds = (int) $wpdb->get_var( "SELECT COUNT(*) FROM {$wpdb->prefix}zacls_webauthn_credentials" ); // phpcs:ignore WordPress.DB.PreparedSQL.InterpolatedNotPrepared,WordPress.DB.DirectDatabaseQuery
	$total_users = (int) $wpdb->get_var( "SELECT COUNT(DISTINCT user_id) FROM {$wpdb->prefix}zacls_webauthn_credentials" ); // phpcs:ignore WordPress.DB.PreparedSQL.InterpolatedNotPrepared,WordPress.DB.DirectDatabaseQuery
	?>

	<div class="zacls-stats-grid">
		<div class="zacls-stat-card">
			<div class="stat-icon passkey"><span class="dashicons dashicons-lock"></span></div>
			<div class="stat-content">
				<span class="stat-value"><?php echo esc_html( $total_creds ); ?></span>
				<span class="stat-label"><?php esc_html_e( 'Registered Passkeys', 'za-creative-login-shield' ); ?></span>
			</div>
		</div>
		<div class="zacls-stat-card">
			<div class="stat-icon users"><span class="dashicons dashicons-admin-users"></span></div>
			<div class="stat-content">
				<span class="stat-value"><?php echo esc_html( $total_users ); ?></span>
				<span class="stat-label"><?php esc_html_e( 'Users with Passkeys', 'za-creative-login-shield' ); ?></span>
			</div>
		</div>
	</div>
</div>

<script>
jQuery(function($) {
	$('#zacls-save-webauthn').on('click', function() {
		$.post(zaclsData.ajaxUrl, {
			action: 'zacls_save_settings',
			nonce: zaclsData.nonce,
			settings: { zacls_webauthn_enabled: $('#zacls-webauthn-enabled').is(':checked') ? 'yes' : 'no' }
		}, function(response) {
			if (response.success) { alert(response.data.message); }
			else { alert(response.data.message || zaclsData.i18n.error); }
		});
	});
});
</script>
