<?php
/**
 * Settings Page Template
 *
 * @package Scanshow
 */

if ( ! defined( 'ABSPATH' ) ) {
	exit;
}
?>
<div class="wrap">
	<div class="stw-admin-content" id="stw-settings-page">
		<div id="message-container"></div>

		<!-- Authentication Section (Shown when not logged in) -->
		<div id="auth-section">
			<div class="stw-auth-container">
				<div class="stw-auth-tabs">
					<button class="stw-auth-tab active" data-tab="login">
						<span class="dashicons dashicons-lock"></span> <?php esc_html_e( 'Login', '3d-scan-and-show' ); ?>
					</button>
					<button class="stw-auth-tab" data-tab="register">
						<span class="dashicons dashicons-admin-users"></span> <?php esc_html_e( 'Register', '3d-scan-and-show' ); ?>
					</button>
				</div>

				<!-- Login Form -->
				<form id="login-form" class="stw-auth-form stw-form active" style="display: block;">
					<h2><?php esc_html_e( 'Login to STW Platform', '3d-scan-and-show' ); ?></h2>

					<div class="stw-form-group">
						<label for="login-email"><?php esc_html_e( 'Email Address *', '3d-scan-and-show' ); ?></label>
						<input
							type="email"
							id="login-email"
							name="email"
							placeholder="<?php esc_attr_e( 'your@email.com', '3d-scan-and-show' ); ?>"
							required
						/>
					</div>

					<div class="stw-form-group">
						<label for="login-password"><?php esc_html_e( 'Password *', '3d-scan-and-show' ); ?></label>
						<input
							type="password"
							id="login-password"
							name="password"
							placeholder="<?php esc_attr_e( 'At least 8 characters', '3d-scan-and-show' ); ?>"
							minlength="8"
							required
						/>
					</div>

					<button type="submit" class="button button-primary" id="login-submit-btn" style="width: 100%; cursor: pointer;">
						<?php esc_html_e( 'Login', '3d-scan-and-show' ); ?>
					</button>

					<form id="login-form-element" style="display: none;"></form>
				</form>

				<!-- Register Form -->
				<form id="register-form" class="stw-auth-form stw-form" style="display: none;">
					<h2><?php esc_html_e( 'Create an Account', '3d-scan-and-show' ); ?></h2>

					<p style="text-align: center; color: #666; margin: 20px 0;">
						<?php esc_html_e( 'Register on the STW platform to get started with 3D models for your products.', '3d-scan-and-show' ); ?>
					</p>

					<button type="submit" class="button button-primary" id="register-submit-btn" style="width: 100%; cursor: pointer;">
						<span class="dashicons dashicons-external" style="margin-right: 5px;"></span>
						<?php esc_html_e( 'Open Registration Page', '3d-scan-and-show' ); ?>
					</button>
				</form>
			</div>
		</div>

		<!-- Settings Content (Hidden until logged in) -->
		<div id="settings-content" style="display: none;">
			<!-- User Information -->
			<div class="stw-settings-card">
				<h2><?php esc_html_e( 'Account Information', '3d-scan-and-show' ); ?></h2>
				<div class="stw-logged-in">
					<div>
						<strong><?php esc_html_e( 'Logged In As:', '3d-scan-and-show' ); ?></strong>
						<div id="logged-in-email" class="loading"><?php esc_html_e( 'Loading...', '3d-scan-and-show' ); ?></div>
					</div>
					<button class="button" id="go-to-dashboard-btn">
						<?php esc_html_e( 'Go to My STW Dashboard', '3d-scan-and-show' ); ?>
					</button>
				</div>
				<div id="user-details-container" class="stw-user-details">
					<!-- User details will be loaded here -->
				</div>
			</div>

			<!-- Plan Management -->
			<div class="stw-settings-card">
				<h2><?php esc_html_e( 'Plan Management', '3d-scan-and-show' ); ?></h2>
				<div class="stw-plan-header">
					<div>
						<div class="stw-plan-label"><?php esc_html_e( 'Current Plan:', '3d-scan-and-show' ); ?></div>
						<div id="plan-info">
							<p class="loading"><?php esc_html_e( 'Loading plan...', '3d-scan-and-show' ); ?></p>
						</div>
					</div>
					<button class="button button-primary" id="upgrade-plan-btn">
						<?php esc_html_e( 'Upgrade Plan', '3d-scan-and-show' ); ?>
					</button>
				</div>
				<div id="subscription-status" style="margin-top: 15px;">
					<p class="loading"><?php esc_html_e( 'Loading subscription status...', '3d-scan-and-show' ); ?></p>
				</div>
			</div>

			<!-- Quota Information -->
			<div class="stw-settings-card">
				<div class="stw-quota-header">
					<strong><?php esc_html_e( 'Credits:', '3d-scan-and-show' ); ?></strong>
					<button class="button button-primary" id="purchase-credits-btn">
						<?php esc_html_e( 'Purchase Top-up Credits', '3d-scan-and-show' ); ?>
					</button>
				</div>
				<div id="quota-details">
					<p class="loading"><?php esc_html_e( 'Loading quota...', '3d-scan-and-show' ); ?></p>
				</div>
			</div>

			<!-- Links Section -->
			<div class="stw-settings-card stw-links-card">
				<h3 style="margin-top: 0; margin-bottom: 15px;"><?php esc_html_e( 'Quick Links', '3d-scan-and-show' ); ?></h3>
				<div class="stw-quick-links">
					<button class="button" id="link-about">
						<span class="dashicons dashicons-info"></span> <?php esc_html_e( 'About', '3d-scan-and-show' ); ?>
					</button>
					<button class="button" id="link-privacy">
						<span class="dashicons dashicons-shield"></span> <?php esc_html_e( 'Privacy Policy', '3d-scan-and-show' ); ?>
					</button>
					<button class="button" id="link-contact">
						<span class="dashicons dashicons-email"></span> <?php esc_html_e( 'Contact Us', '3d-scan-and-show' ); ?>
					</button>
				</div>
			</div>
		</div>
	</div>
</div>

