<?php
/**
 * Affiliate Registration Form Template
 *
 * Displays the registration form for new affiliates, with conditional logic for logged-in users.
 *
 * @since 2.15.0
 * @package wc-affiliate
 */

if ( is_user_logged_in() ) {
	// authenticate.
	$_status = wca_get_affiliate_status();
	if ( '' !== $_status ) {
		$template      = $_status;
		$template_path = 'views/front/authenticate';

		echo wp_kses_post( wca_get_template( $template, $template_path ) );

		return;
	}
}

$first_name = $last_name = $user_name = $email = $website_url = $disabled = '';
$btn_text   = __( 'Register', 'wc-affiliate' );
if ( is_user_logged_in() ) {
	$user_id     = get_current_user_id();
	$user        = get_userdata( $user_id );
	$first_name  = $user->first_name;
	$last_name   = $user->last_name;
	$user_name   = $user->user_login;
	$email       = $user->user_email;
	$website_url = $user->user_url;
	$btn_text    = __( 'Apply', 'wc-affiliate' );
	$disabled    = 'disabled';
}

$terms_url        = wca_get_option( 'basic', 'tracking.terms_conditions' );
$site_key         = wca_get_option( 'advanced', 'my_account.sitekey_recaptcha' );
$enable_recaptcha = wca_get_option( 'advanced', 'my_account.recaptcha_enabled' );

?>

<form id="wca-application-form" class="wca-form" action="" method="post">
	<input type="hidden" name="action" value="wca-register-user">
	<input type="hidden" name="_nonce" value="<?php echo esc_attr( wp_create_nonce() ); ?>">
	<!-- First Name & Last Name -->
	<div class="flex gap-8 mb-6">
		<div class="wca-application-form-panel-content w-full relative" style="grid-area: fname;">
			<div class="absolute top-10 left-3">
				<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
					<path d="M15.8334 17.5V15.8333C15.8334 14.9493 15.4822 14.1014 14.857 13.4763C14.2319 12.8512 13.3841 12.5 12.5 12.5H7.50002C6.61597 12.5 5.76812 12.8512 5.143 13.4763C4.51788 14.1014 4.16669 14.9493 4.16669 15.8333V17.5"
							stroke="#75717C" stroke-linecap="round" stroke-linejoin="round"/>
					<path d="M10 9.16667C11.841 9.16667 13.3334 7.67428 13.3334 5.83333C13.3334 3.99238 11.841 2.5 10 2.5C8.15907 2.5 6.66669 3.99238 6.66669 5.83333C6.66669 7.67428 8.15907 9.16667 10 9.16667Z"
							stroke="#75717C" stroke-linecap="round" stroke-linejoin="round"/>
				</svg>
			</div>
			<label for="first-name" class="wca-label font-['Inter'] text-base leading-normal text-[#2C3033] font-normal mb-2"><?php esc_html_e( 'First Name', 'wc-affiliate' ); ?></label>
			<input id="first-name"
					class="wca-input h-[48px] font-['Inter'] text-base text-normal border border-solid border-[#F3F3F3] rounded-lg focus:outline-none shadow-none hover:border-[#8523F5] pl-10 placeholder:text-[#75717C] placeholder:font-normal placeholder:text-base"
					type="text" name="first_name" value="<?php echo esc_attr( $first_name ); ?>" required="required" placeholder="<?php esc_attr_e( 'Enter your first name', 'wc-affiliate' ); ?>">
		</div>
		<div class="wca-application-form-panel-content w-full relative" style="grid-area: lname;">
			<div class="absolute top-10 left-3">
				<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
					<path d="M15.8334 17.5V15.8333C15.8334 14.9493 15.4822 14.1014 14.857 13.4763C14.2319 12.8512 13.3841 12.5 12.5 12.5H7.50002C6.61597 12.5 5.76812 12.8512 5.143 13.4763C4.51788 14.1014 4.16669 14.9493 4.16669 15.8333V17.5"
							stroke="#75717C" stroke-linecap="round" stroke-linejoin="round"/>
					<path d="M10 9.16667C11.841 9.16667 13.3334 7.67428 13.3334 5.83333C13.3334 3.99238 11.841 2.5 10 2.5C8.15907 2.5 6.66669 3.99238 6.66669 5.83333C6.66669 7.67428 8.15907 9.16667 10 9.16667Z"
							stroke="#75717C" stroke-linecap="round" stroke-linejoin="round"/>
				</svg>
			</div>
			<label for="last-name" class="wca-label font-['Inter'] text-base leading-normal text-[#2C3033] font-normal mb-2"><?php esc_html_e( 'Last Name', 'wc-affiliate' ); ?></label>
			<input id="last-name"
					class="wca-input h-[48px] font-['Inter'] text-base text-normal border border-solid border-[#F3F3F3] rounded-lg focus:outline-none shadow-none hover:border-[#8523F5] pl-10 placeholder:text-[#75717C] placeholder:font-normal placeholder:text-base"
					type="text" name="last_name" value="<?php echo esc_attr( $last_name ); ?>" required="required" placeholder="<?php esc_attr_e( 'Enter your last name', 'wc-affiliate' ); ?>">
		</div>
	</div>
	<!-- Username -->
	<div class="wca-application-form-panel-content mb-6 relative" style="grid-area: username;">
		<div class="absolute top-10 left-3">
			<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
				<path d="M15.8334 17.5V15.8333C15.8334 14.9493 15.4822 14.1014 14.857 13.4763C14.2319 12.8512 13.3841 12.5 12.5 12.5H7.50002C6.61597 12.5 5.76812 12.8512 5.143 13.4763C4.51788 14.1014 4.16669 14.9493 4.16669 15.8333V17.5"
						stroke="#75717C" stroke-linecap="round" stroke-linejoin="round"/>
				<path d="M10 9.16667C11.841 9.16667 13.3334 7.67428 13.3334 5.83333C13.3334 3.99238 11.841 2.5 10 2.5C8.15907 2.5 6.66669 3.99238 6.66669 5.83333C6.66669 7.67428 8.15907 9.16667 10 9.16667Z"
						stroke="#75717C" stroke-linecap="round" stroke-linejoin="round"/>
			</svg>
		</div>
		<label for="user-name" class="wca-label font-['Inter'] text-base leading-normal text-[#2C3033] font-normal mb-2"><?php esc_html_e( 'Username', 'wc-affiliate' ); ?></label>
		<input id="user-name"
				class="wca-input h-[48px] font-['Inter'] text-base text-normal border border-solid border-[#F3F3F3] rounded-lg focus:outline-none shadow-none focus:border-[#8523F5]! hover:border-[#8523F5] pl-10 placeholder:text-[#75717C] placeholder:font-normal placeholder:text-base"
				type="text" name="user_login" value="<?php echo esc_attr( $user_name ); ?>" required="required" <?php echo esc_attr( $disabled ); ?>
				placeholder="<?php esc_attr_e( 'Enter your username', 'wc-affiliate' ); ?>">
		<div id="wca-uname-error" class="wca-red wca-error"></div>
	</div>
	<!-- Email -->
	<div class="wca-application-form-panel-content mb-6 relative" style="grid-area: email;">
		<div class="absolute top-10 left-3">
			<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
				<path d="M1.66669 5L7.42754 8.26414C9.55135 9.46751 10.4487 9.46751 12.5725 8.26414L18.3334 5" stroke="#75717C" stroke-linejoin="round"/>
				<path d="M1.67983 11.23C1.7343 13.7846 1.76154 15.0619 2.70415 16.0081C3.64676 16.9543 4.95863 16.9873 7.58238 17.0532C9.19945 17.0938 10.8006 17.0938 12.4177 17.0532C15.0414 16.9873 16.3533 16.9543 17.2959 16.0081C18.2385 15.0619 18.2657 13.7846 18.3202 11.23C18.3377 10.4086 18.3377 9.59206 18.3202 8.77065C18.2657 6.21604 18.2385 4.93874 17.2959 3.99254C16.3533 3.04635 15.0414 3.01339 12.4177 2.94747C10.8006 2.90684 9.19944 2.90683 7.58237 2.94746C4.95863 3.01338 3.64676 3.04634 2.70415 3.99253C1.76154 4.93872 1.7343 6.21603 1.67982 8.77064C1.66231 9.59205 1.66231 10.4086 1.67983 11.23Z"
						stroke="#75717C" stroke-linejoin="round"/>
			</svg>
		</div>
		<label for="email" class="wca-label font-['Inter'] text-base leading-normal text-[#2C3033] font-normal mb-2"><?php esc_html_e( 'Email', 'wc-affiliate' ); ?></label>
		<input id="email"
				class="wca-input h-[48px] font-['Inter'] text-base text-normal border border-solid border-[#F3F3F3] rounded-lg focus:outline-none shadow-none focus:border-[#8523F5]! hover:border-[#8523F5] pl-10 placeholder:text-[#75717C] placeholder:font-normal placeholder:text-base"
				type="email" name="email" value="<?php echo esc_attr( $email ); ?>" required="required" <?php echo esc_attr( $disabled ); ?>
				placeholder="<?php esc_attr_e( 'Enter your email', 'wc-affiliate' ); ?>">
		<div id="wca-email-error" class="wca-red wca-error"></div>
	</div>
	<!-- Website URL -->
	<div class="wca-application-form-panel-content mb-6 relative" style="grid-area: website;">
		<div class="absolute top-10 left-3">
			<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
				<path d="M10 18.3337C14.6024 18.3337 18.3334 14.6027 18.3334 10.0003C18.3334 5.39795 14.6024 1.66699 10 1.66699C5.39765 1.66699 1.66669 5.39795 1.66669 10.0003C1.66669 14.6027 5.39765 18.3337 10 18.3337Z"
						stroke="#75717C" stroke-linecap="round" stroke-linejoin="round"/>
				<path d="M10 1.66699C7.86022 3.91379 6.66669 6.89761 6.66669 10.0003C6.66669 13.103 7.86022 16.0869 10 18.3337C12.1398 16.0869 13.3334 13.103 13.3334 10.0003C13.3334 6.89761 12.1398 3.91379 10 1.66699Z"
						stroke="#75717C" stroke-linecap="round" stroke-linejoin="round"/>
				<path d="M1.66669 10H18.3334" stroke="#75717C" stroke-linecap="round" stroke-linejoin="round"/>
			</svg>
		</div>
		<label for="website-url" class="wca-label font-['Inter'] text-base leading-normal text-[#2C3033] font-normal mb-2"><?php esc_html_e( 'Website URL', 'wc-affiliate' ); ?></label>
		<input id="website-url"
				class="wca-input font-['Inter'] h-[48px] text-base text-normal border border-solid border-[#F3F3F3] rounded-lg focus:outline-none shadow-none hover:border-[#8523F5] pl-10 placeholder:text-[#75717C] placeholder:font-normal placeholder:text-base"
				type="text" name="website_url" value="<?php echo esc_url( $website_url ); ?>" placeholder="<?php esc_attr_e( 'Enter your website URL', 'wc-affiliate' ); ?>">
	</div>
	<!-- Promotion Method -->
	<div class="wca-application-form-panel-content mb-6" style="grid-area: promotion;">
		<label for="promotion-method"
				class="wca-label font-['Inter'] text-base leading-normal text-[#2C3033] font-normal mb-2"><?php esc_html_e( 'How will you promote us?', 'wc-affiliate' ); ?></label>
		<textarea
				class="font-['Inter'] text-base text-normal border border-solid border-[#F3F3F3] rounded-lg focus:outline-none shadow-none hover:border-[#8523F5] placeholder:text-[#75717C] placeholder:font-normal placeholder:text-base"
				id="promotion-method" name="promotion_method" rows="5" cols="30" required="required"
				placeholder="<?php esc_attr_e( 'Tell us about your promotion strategy...', 'wc-affiliate' ); ?>"></textarea>
	</div>
	<?php if ( ! is_user_logged_in() ) : ?>
		<!-- Password Fields -->
		<div class="flex gap-8">
			<div class="wca-application-form-panel-content w-full mb-6 relative" style="grid-area: password;">
				<div class="absolute top-10 left-3">
					<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
						<path d="M12.0757 12.917H12.0832M7.9165 12.917H7.92398" stroke="#75717C" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
						<path d="M3.55667 15.704C3.74407 17.0958 4.89694 18.1863 6.29988 18.2508C7.48039 18.305 8.67958 18.3333 10.0002 18.3333C11.3207 18.3333 12.5199 18.305 13.7004 18.2508C15.1034 18.1863 16.2563 17.0958 16.4437 15.704C16.566 14.7956 16.6668 13.8647 16.6668 12.9167C16.6668 11.9686 16.566 11.0378 16.4437 10.1294C16.2563 8.73752 15.1034 7.64707 13.7004 7.58258C12.5199 7.52831 11.3207 7.5 10.0002 7.5C8.67958 7.5 7.48039 7.52831 6.29988 7.58258C4.89694 7.64707 3.74407 8.73752 3.55667 10.1294C3.43437 11.0378 3.3335 11.9686 3.3335 12.9167C3.3335 13.8647 3.43437 14.7956 3.55667 15.704Z"
								stroke="#75717C"/>
						<path d="M6.25 7.50033V5.41699C6.25 3.34592 7.92893 1.66699 10 1.66699C12.0711 1.66699 13.75 3.34592 13.75 5.41699V7.50033" stroke="#75717C" stroke-linecap="round"
								stroke-linejoin="round"/>
					</svg>
				</div>
				<label for="password" class="wca-label font-['Inter'] text-base leading-normal text-[#2C3033] font-normal mb-2"><?php esc_html_e( 'Password', 'wc-affiliate' ); ?></label>
				<input id="password"
						class="wca-input font-['Inter'] h-[48px] text-base text-normal border border-solid border-[#F3F3F3] rounded-lg focus:outline-none shadow-none hover:border-[#8523F5] pl-10 placeholder:text-[#75717C] placeholder:font-normal placeholder:text-base"
						type="password" name="user_password" value="" required="required" placeholder="<?php esc_attr_e( 'Enter your password', 'wc-affiliate' ); ?>">
			</div>
			<div class="wca-application-form-panel-content w-full mb-6 relative" style="grid-area: password2;">
				<div class="absolute top-10 left-3">
					<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
						<path d="M12.0757 12.917H12.0832M7.9165 12.917H7.92398" stroke="#75717C" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
						<path d="M3.55667 15.704C3.74407 17.0958 4.89694 18.1863 6.29988 18.2508C7.48039 18.305 8.67958 18.3333 10.0002 18.3333C11.3207 18.3333 12.5199 18.305 13.7004 18.2508C15.1034 18.1863 16.2563 17.0958 16.4437 15.704C16.566 14.7956 16.6668 13.8647 16.6668 12.9167C16.6668 11.9686 16.566 11.0378 16.4437 10.1294C16.2563 8.73752 15.1034 7.64707 13.7004 7.58258C12.5199 7.52831 11.3207 7.5 10.0002 7.5C8.67958 7.5 7.48039 7.52831 6.29988 7.58258C4.89694 7.64707 3.74407 8.73752 3.55667 10.1294C3.43437 11.0378 3.3335 11.9686 3.3335 12.9167C3.3335 13.8647 3.43437 14.7956 3.55667 15.704Z"
								stroke="#75717C"/>
						<path d="M6.25 7.50033V5.41699C6.25 3.34592 7.92893 1.66699 10 1.66699C12.0711 1.66699 13.75 3.34592 13.75 5.41699V7.50033" stroke="#75717C" stroke-linecap="round"
								stroke-linejoin="round"/>
					</svg>
				</div>
				<label for="password2" class="wca-label font-['Inter'] text-base leading-normal text-[#2C3033] font-normal mb-2"><?php esc_html_e( 'Confirm Password', 'wc-affiliate' ); ?></label>
				<input id="password2"
						class="wca-input font-['Inter'] h-[48px] text-base text-normal border border-solid border-[#F3F3F3] rounded-lg focus:outline-none shadow-none hover:border-[#8523F5] pl-10 placeholder:text-[#75717C] placeholder:font-normal placeholder:text-base"
						type="password" name="user_password2" value="" required="required" placeholder="<?php esc_attr_e( 'Enter your confirm password', 'wc-affiliate' ); ?>">
				<div id="wca-pass-error" class="wca-red wca-error"></div>
			</div>
		</div>
	<?php endif; ?>
	<?php if ( ! empty( $terms_url ) ) : ?>
		<div class="wca-application-form-panel-content mt-3" style="grid-area: terms;">
			<label for="terms-agree" class="wca-label font-['Inter'] text-base leading-normal text-[#2C3033] font-normal mb-2">
				<input id="terms-agree" required="required" type="checkbox" name="terms_agree">
				<?php esc_html_e( 'Agree to our', 'wc-affiliate' ); ?>
				<a href="<?php echo esc_url( $terms_url ); ?>" target="_blank" class="text-[#8523F5] underline">
					<?php esc_html_e( 'Terms of Use', 'wc-affiliate' ); ?>
				</a>
			</label>
		</div>
	<?php endif; ?>
	<?php if ( 'on' === $enable_recaptcha ) : ?>
		<div class="wca-application-recaptcha-panel" style="grid-area: recaptcha;">
			<div class="g-recaptcha" data-sitekey="<?php echo esc_attr( $site_key ); ?>"></div>
		</div>
	<?php endif; ?>
	<div class="wca-application-form-panel-button" style="grid-area: submit;">
		<input class="button wca-button w-full mt-10 h-14 bg-[#8523F5] font-['Inter'] text-white text-base font-normal rounded-xl hover:bg-[#7a1de0] transition-all duration-300" type="submit" value="<?php echo esc_attr( $btn_text ); ?>">
	</div>
</form>
