<?php
/**
 * The template for displaying comments.
 *
 * The area of the page that contains both current comments
 * and the comment form.
 *
 * @package Chic Lifestyle
 */

/*
 * If the current post is protected by a password and
 * the visitor has not yet entered the password we will
 * return early without loading the comments.
 */
if ( post_password_required() ) {
	return;
}
?>
	<div id="comments" class="comments-area mt-32">
		<?php // You can start editing here -- including this comment! ?>

		<?php if ( have_comments() ) : ?>
			
			<h2 class="mt-48 mb-16 fs-3">
				<?php
				$comment_count = get_comments_number();
				if ( '1' === $comment_count ) {
					printf(
						/* translators: 1: title. */
						esc_html__( 'One thought on &ldquo;%1$s&rdquo;', 'chic-lifestyle' ),
						'<span>' . wp_kses_post( get_the_title() ) . '</span>'
					);
				} else {
					printf( 
						/* translators: 1: comment count number, 2: title. */
						esc_html( _nx( '%1$s thought on &ldquo;%2$s&rdquo;', '%1$s thoughts on &ldquo;%2$s&rdquo;', $comment_count, 'comments title', 'chic-lifestyle' ) ),
						number_format_i18n( $comment_count ), // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
						'<span>' . wp_kses_post( get_the_title() ) . '</span>'
					);
				}
				?>
			</h2>

			<?php the_comments_navigation(); ?>

			<div class="comment-list p-0 m-0 mt-24">
				<?php
					wp_list_comments(
						array(
						'walker'     		=> new Chic_Lifestyle_Bootstrap_Comment_Walker(),
						'max_depth'         => '',
						'style'             => 'div',
						'callback'          => null,
						'end-callback'      => null,
						'type'              => 'all',
						'page'              => '',
						'per_page'          => '',
						'avatar_size'       => 32,
						'reverse_top_level' => null,
						'reverse_children'  => '',
						'format'            => 'html5',
						'short_ping'        => true,
						'echo'              => true
					  )
					);
				?>
			</div><!-- .comment-list -->

			<?php
				the_comments_navigation();

				// If comments are closed and there are comments, let's leave a little note, shall we?
				if ( ! comments_open() ) :
					?>
					<p class="no-comments"><?php esc_html_e( 'Comments are closed.', 'chic-lifestyle' ); ?></p>
					<?php
				endif;

			endif; // Check for have_comments().

			comment_form(
				array(
					'title_reply_before' => '<h2 class="mb-16">',
					'title_reply_after'  => '</h2>',
					'fields'	=> array(
						'author' => '<p class="comment-form-author">' .
							'<label for="author" class="form-label">' . __('Your Name', 'chic-lifestyle') . '</label> <span class="required text-danger">*</span>' .
							'<input id="author" name="author" type="text" value="" size="30" required="required" class="form-control p-16" />' .
							'</p>',
				'email'  => '<p class="comment-form-email">' .
							'<label for="email" class="form-label">' . __('Your Email', 'chic-lifestyle') . '</label> <span class="required text-danger">*</span>' .
							'<input id="email" name="email" type="email" value="" size="30" required="required" class="form-control p-16" />' .
							'</p>',
				'url'    => '<p class="comment-form-url">' .
							'<label for="url" class="form-label">' . __('Your Website', 'chic-lifestyle') . '</label>' .
							'<input id="url" name="url" type="url" value="" size="30" class="form-control p-16" />' .
							'</p>',
				'cookies' => '<p class="comment-form-cookies-consent" class="form-check">' .
							 '<input id="wp-comment-cookies-consent" name="wp-comment-cookies-consent" type="checkbox" value="yes" class="form-check-input" /> ' .
							 '<label for="wp-comment-cookies-consent" class="form-check-label">' . __('Save my name, email, and website in this browser for the next time I comment.', 'chic-lifestyle') . '</label>' .
							 '</p>',
					),
				'comment_field' => '<p class="comment-form-comment">' .
						   '<label for="comment" class="form-label">' . __('Your Comment', 'chic-lifestyle') . '</label> <span class="required text-danger">*</span>' .
						   '<textarea id="comment" name="comment" cols="45" rows="8" required="required" class="form-control p-16"></textarea>' .
						   '</p>',
			  'submit_field'	=> '<p class="form-submit d-flex justify-content-center">%1$s %2$s</p>',
			  'submit_button'  		 => '<input name="%1$s" type="submit" id="%2$s" class="submit btn btn-primary text-center" value="%4$s">',
				)
			);
			?>
	</div><!-- #comments -->