<?php
/**
 * Basic Forms - Frontend Form
 *
 * @package BasicForms
 * @since 1.0.0
 */

if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

$form_slug = sanitize_title( $form->post_title ?? '' );
$design = wp_parse_args( is_array( $design ) ? $design : [], \BasicForms\DesignDefaults::get() );
$layout_class = 'wpps-bf-layout-' . esc_attr( $design['layout'] );
$spacing_class = 'wpps-bf-spacing-' . esc_attr( $design['field_spacing'] );
$align_class = 'wpps-bf-align-' . esc_attr( $design['align'] );
$label_class = 'wpps-bf-label-' . esc_attr( $design['label_position'] );
$btn_style_class = 'wpps-bf-btn-' . esc_attr( $design['button_style'] );
$btn_size_class = 'wpps-bf-btn-size-' . esc_attr( $design['button_size'] );
$btn_full_class = ! empty( $design['button_full_width'] ) ? 'wpps-bf-btn-full' : '';
$btn_shadow_class = ! empty( $design['button_shadow'] ) && $design['button_shadow'] !== 'none' ? 'wpps-bf-btn-shadow-' . esc_attr( $design['button_shadow'] ) : '';
$max_w = ( $design['layout'] ?? '' ) === 'custom' ? ( (int) ( $design['max_width'] ?? 600 ) ) . 'px' : '';
$label_fs = ( $design['label_font_size_desktop'] ?? '' ) ?: ( ( $design['label_font_size'] ?? '' ) ?: '14' );
$field_fs = ( $design['field_font_size_desktop'] ?? '' ) ?: ( ( $design['input_font_size'] ?? '' ) ?: '14' );
$field_gap = ! empty( $design['field_gap'] ) ? ( (int) $design['field_gap'] ) . 'px' : '20px';
$input_radius = ! empty( $design['input_border_radius'] ) ? ( (int) $design['input_border_radius'] ) . 'px' : ( ( $design['border_radius'] ?? '4' ) . 'px' );
$btn_hover = $design['button_hover_color'] ?: '#135e96';
$btn_border_color = $design['button_border_color'] ?: ( $design['primary_color'] ?: '#2271b1' );
$btn_border_width = ( $design['button_border_width'] ?? '2' ) . 'px';
$inline_style = '--wpps-bf-primary:' . esc_attr( $design['primary_color'] ?: '#2271b1' ) . ';--wpps-bf-btn-hover:' . esc_attr( $btn_hover ) . ';--wpps-bf-btn-border-color:' . esc_attr( $btn_border_color ) . ';--wpps-bf-btn-border-width:' . esc_attr( $btn_border_width ) . ';--wpps-bf-field-gap:' . esc_attr( $field_gap ) . ';--wpps-bf-radius:' . esc_attr( ( $design['border_radius'] ?? '4' ) . 'px' ) . ';--wpps-bf-input-radius:' . esc_attr( $input_radius ) . ';--wpps-bf-input-border:' . esc_attr( ( $design['input_border_width'] ?? '1' ) . 'px solid ' . ( $design['input_border_color'] ?: '#c3c4c7' ) ) . ';--wpps-bf-input-bg:' . esc_attr( $design['input_bg'] ?: '#ffffff' ) . ';--wpps-bf-input-focus:' . esc_attr( $design['primary_color'] ?: '#2271b1' ) . ';--wpps-bf-field-color:' . esc_attr( $design['field_text_color'] ?: '#1d2327' ) . ';--wpps-bf-help-color:' . esc_attr( $design['help_text_color'] ?: '#646970' ) . ';--wpps-bf-help-fs:' . esc_attr( ( $design['help_text_font_size'] ?? '12' ) . 'px' ) . ';--wpps-bf-input-fs:' . esc_attr( $field_fs . 'px' ) . ';--wpps-bf-input-pad:' . esc_attr( ( $design['input_padding'] ?? '10' ) . 'px' ) . ';--wpps-bf-placeholder:' . esc_attr( $design['placeholder_color'] ?: '#646970' ) . ';--wpps-bf-label-fs:' . esc_attr( $label_fs . 'px' ) . ';--wpps-bf-label-fw:' . esc_attr( $design['label_font_weight'] ?? '600' ) . ';--wpps-bf-label-color:' . esc_attr( $design['label_color'] ?: '#1d2327' ) . ';--wpps-bf-btn-radius:' . esc_attr( ( $design['button_border_radius'] ?? '4' ) . 'px' ) . ';--wpps-bf-success-bg:' . esc_attr( $design['success_msg_bg'] ?? '#d1f2eb' ) . ';--wpps-bf-success-color:' . esc_attr( $design['success_msg_color'] ?? '#0d5e47' ) . ';--wpps-bf-success-border:' . esc_attr( $design['success_msg_border'] ?? '#48c9a9' ) . ';--wpps-bf-error-bg:' . esc_attr( $design['error_msg_bg'] ?? '#ffe6e6' ) . ';--wpps-bf-error-color:' . esc_attr( $design['error_msg_color'] ?? '#c41e3a' ) . ';--wpps-bf-error-border:' . esc_attr( $design['error_msg_border'] ?? '#ff6b6b' ) . ';';
if ( ! empty( $design['label_font_family'] ) ) {
	$inline_style .= '--wpps-bf-label-font:' . esc_attr( $design['label_font_family'] ) . ';';
}
if ( ! empty( $design['label_font_weight'] ) ) {
	$inline_style .= '--wpps-bf-label-fw:' . esc_attr( $design['label_font_weight'] ) . ';';
}
if ( ! empty( $design['label_text_transform'] ) ) {
	$inline_style .= '--wpps-bf-label-tt:' . esc_attr( $design['label_text_transform'] ) . ';';
}
if ( ! empty( $design['label_font_style'] ) ) {
	$inline_style .= '--wpps-bf-label-fsty:' . esc_attr( $design['label_font_style'] ) . ';';
}
if ( ! empty( $design['label_line_height_desktop'] ) ) {
	$inline_style .= '--wpps-bf-label-lh:' . esc_attr( $design['label_line_height_desktop'] ) . ';';
}
if ( ! empty( $design['label_letter_spacing_desktop'] ) ) {
	$inline_style .= '--wpps-bf-label-ls:' . esc_attr( $design['label_letter_spacing_desktop'] ) . 'px;';
}
if ( ! empty( $design['field_font_family'] ) ) {
	$inline_style .= '--wpps-bf-field-font:' . esc_attr( $design['field_font_family'] ) . ';';
}
if ( ! empty( $design['field_font_weight'] ) ) {
	$inline_style .= '--wpps-bf-field-fw:' . esc_attr( $design['field_font_weight'] ) . ';';
}
if ( ! empty( $design['field_text_transform'] ) ) {
	$inline_style .= '--wpps-bf-field-tt:' . esc_attr( $design['field_text_transform'] ) . ';';
}
if ( ! empty( $design['field_font_style'] ) ) {
	$inline_style .= '--wpps-bf-field-fsty:' . esc_attr( $design['field_font_style'] ) . ';';
}
if ( ! empty( $design['field_line_height_desktop'] ) ) {
	$inline_style .= '--wpps-bf-field-lh:' . esc_attr( $design['field_line_height_desktop'] ) . ';';
}
if ( ! empty( $design['field_letter_spacing_desktop'] ) ) {
	$inline_style .= '--wpps-bf-field-ls:' . esc_attr( $design['field_letter_spacing_desktop'] ) . 'px;';
}
if ( ! empty( $design['placeholder_font_family'] ) ) {
	$inline_style .= '--wpps-bf-placeholder-font:' . esc_attr( $design['placeholder_font_family'] ) . ';';
}
if ( ! empty( $design['placeholder_font_weight'] ) ) {
	$inline_style .= '--wpps-bf-placeholder-fw:' . esc_attr( $design['placeholder_font_weight'] ) . ';';
}
$placeholder_fs = ( $design['placeholder_font_size_desktop'] ?? '' ) ?: ( $design['placeholder_font_size'] ?? '' );
if ( $placeholder_fs !== '' ) {
	$inline_style .= '--wpps-bf-placeholder-fs:' . esc_attr( $placeholder_fs ) . 'px;';
}
if ( $design['bg_color'] ) {
	$inline_style .= '--wpps-bf-bg:' . esc_attr( $design['bg_color'] ) . ';';
}
if ( $design['padding'] ) {
	$inline_style .= '--wpps-bf-padding:' . esc_attr( $design['padding'] ) . 'px;';
}
$border_width = (int) ( $design['border_width'] ?? 0 );
if ( $border_width > 0 ) {
	$inline_style .= '--wpps-bf-border:' . esc_attr( $border_width . 'px solid ' . ( $design['border_color'] ?: '#c3c4c7' ) ) . ';';
} else {
	$inline_style .= '--wpps-bf-border:none;';
}
if ( $max_w ) {
	$inline_style .= 'max-width:' . esc_attr( $max_w ) . ';';
}
?>
<div class="wpps-bf-wrapper wpps-bf-<?php echo (int) $form_id; ?> <?php echo esc_attr( implode( ' ', array_filter( [ $layout_class, $spacing_class, $align_class, $label_class, $btn_style_class, $btn_size_class, $btn_full_class, $btn_shadow_class ] ) ) ); ?>" id="wpps-bf-<?php echo (int) $form_id; ?>" data-form-id="<?php echo (int) $form_id; ?>" data-design="<?php echo esc_attr( wp_json_encode( $design ) ); ?>" style="<?php echo esc_attr( $inline_style ); ?>">
	<form class="wpps-bf-form" data-form-id="<?php echo (int) $form_id; ?>" method="post" enctype="multipart/form-data" novalidate>
		<?php wp_nonce_field( 'submit_basic_form_' . $form_id, 'basic_form_nonce' ); ?>

		<?php
		if ( ! empty( $settings['enable_spam_protection'] ) ) {
			$honeypot_name = 'wpps_bf_' . wp_rand( 1000, 9999 ) . '_url';
			$timing_token  = wp_generate_password( 20, false, false );
			set_transient( 'wpps_bf_t_' . $timing_token, time(), HOUR_IN_SECONDS );
			?>
			<div class="wpps-bf-honeypot" aria-hidden="true" style="position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;">
				<label for="<?php echo esc_attr( $honeypot_name ); ?>"><?php esc_html_e( 'Leave this blank', 'wp-powersuite' ); ?></label>
				<input type="text" name="<?php echo esc_attr( $honeypot_name ); ?>" id="<?php echo esc_attr( $honeypot_name ); ?>" value="" tabindex="-1" autocomplete="off">
			</div>
			<input type="hidden" name="wpps_bf_honeypot_name" value="<?php echo esc_attr( $honeypot_name ); ?>">
			<input type="hidden" name="wpps_bf_timing_token" value="<?php echo esc_attr( $timing_token ); ?>">
			<?php
		}
		?>

		<?php foreach ( $fields as $field ) :
			$ft = $field['type'] ?? 'text';
			$width = $field['width'] ?? ( $design[ 'field_' . $ft . '_width' ] ?? '' );
			$width_class = $width ? ' wpps-bf-width-' . esc_attr( $width ) : '';
			$is_conditional = ! empty( $field['show_if'] ) && is_array( $field['show_if'] )
				&& \BasicForms\ConditionalFields::normalizeShowIf( $field['show_if'] ) !== null;
			$cond_style = $is_conditional ? ' style="display:none;"' : '';
			?>
			<div class="wpps-bf-field-wrap<?php echo esc_attr( $width_class ); ?>"<?php echo $cond_style; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- static literal. ?>>
				<?php echo \BasicForms\Module::renderField( $field, (int) $form_id ); ?>
			</div>
		<?php endforeach; ?>

		<?php do_action( 'wpps_basic_forms_before_submit', (int) $form_id, $settings ); ?>

		<div class="wpps-bf-field wpps-bf-submit-wrap">
			<button type="submit" class="wpps-bf-submit"><?php echo esc_html( $settings['submit_button_text'] ?? __( 'Submit', 'wp-powersuite' ) ); ?></button>
		</div>
		<div class="wpps-bf-message" role="alert" aria-live="polite" aria-atomic="true" style="display:none;"></div>
	</form>
</div>
