<div class="xperio-page__setup-instructions">
	<h3><?php esc_html_e( 'Basic Theme Setup', 'xperio' ); ?></h3>

	<div class="setup-step">
		<h4><?php esc_html_e( 'Setup Header Layout', 'xperio' ); ?></h4>
		<ol>
			<li><?php esc_html_e( 'Go to', 'xperio' ); ?> <strong><?php esc_html_e( 'Appearance → Editor → Patterns → Header', 'xperio' ); ?></strong></li>
			<li><?php esc_html_e( 'Click on', 'xperio' ); ?> <strong><?php esc_html_e( 'Header (You need to edit/update) →', 'xperio' ); ?></strong> <?php esc_html_e( 'Add or Remove Required block/content as your requirement.', 'xperio' ); ?></li>
			<li><?php esc_html_e( 'Click on', 'xperio' ); ?> <strong><?php esc_html_e( 'Save', 'xperio' ); ?></strong> <?php esc_html_e( 'to update your layout.', 'xperio' ); ?></li>
		</ol>
	</div>

	<div class="setup-step">
		<h4><?php esc_html_e( 'Set Up Site Logo', 'xperio' ); ?></h4>
		<ol>
			<li><?php esc_html_e( 'Go to', 'xperio' ); ?> <strong><?php esc_html_e( 'Appearance → Editor', 'xperio' ); ?></strong>.</li>
			<li><?php esc_html_e( 'You will see the site logo if it has already been set, or an empty placeholder in the top-left corner of the homepage design.', 'xperio' ); ?></li>
			<li><?php esc_html_e( 'Click on the empty placeholder to upload or replace the site logo.', 'xperio' ); ?></li>
			<li><?php esc_html_e( 'Once the logo is set, you can also use it as the favicon. Simply enable the "Use as Site Icon" option available in the block’s settings sidebar panel.', 'xperio' ); ?></li>
		</ol>
	</div>

	<div class="setup-step">
		<h4><?php esc_html_e( 'Setup Footer Layout', 'xperio' ); ?></h4>
		<ol>
			<li><?php esc_html_e( 'Go to', 'xperio' ); ?> <strong><?php esc_html_e( 'Appearance → Editor → Patterns → Footer', 'xperio' ); ?></strong></li>
			<li><?php esc_html_e( 'Click on', 'xperio' ); ?> <strong><?php esc_html_e( 'Footer (You need to edit/update) →', 'xperio' ); ?></strong> <?php esc_html_e( 'Add or Remove Required block/content as your requirement.', 'xperio' ); ?></li>
			<li><?php esc_html_e( 'Click on', 'xperio' ); ?> <strong><?php esc_html_e( 'Save', 'xperio' ); ?></strong> <?php esc_html_e( 'to update your layout.', 'xperio' ); ?></li>
		</ol>
	</div>

	<div class="setup-step">
		<h4><?php esc_html_e( 'Setup Templates (Homepage/404/Search/Page/Single and more)', 'xperio' ); ?></h4>
		<ol>
			<li><?php esc_html_e( 'Go to', 'xperio' ); ?> <strong><?php esc_html_e( 'Appearance → Editor → Templates', 'xperio' ); ?></strong></li>
			<li><?php esc_html_e( 'Click on', 'xperio' ); ?> <strong><?php esc_html_e( 'Template (You need to edit/update) →', 'xperio' ); ?></strong> <?php esc_html_e( 'Add or Remove Required block/content as your requirement.', 'xperio' ); ?></li>
			<li><?php esc_html_e( 'Click on', 'xperio' ); ?> <strong><?php esc_html_e( 'Save', 'xperio' ); ?></strong> <?php esc_html_e( 'to update your layout.', 'xperio' ); ?></li>
		</ol>
	</div>

	<div class="setup-step">
		<h4><?php esc_html_e( 'Restore/Reset Default Content Layout of Template (Frontpage/Blog/Archive etc.)', 'xperio' ); ?></h4>
		<ol>
			<li><?php esc_html_e( 'Go to', 'xperio' ); ?> <strong><?php esc_html_e( 'Appearance → Editor → Templates', 'xperio' ); ?></strong></li>
			<li><?php esc_html_e( 'Click on the', 'xperio' ); ?> <strong><?php esc_html_e( '3 Dots', 'xperio' ); ?></strong> <?php esc_html_e( 'icon on the right side of the respective template.', 'xperio' ); ?></li>
			<li><?php esc_html_e( 'Click on', 'xperio' ); ?> <strong><?php esc_html_e( 'Reset', 'xperio' ); ?></strong>. <em><?php esc_html_e( 'Note: The Reset option appears only if there are any edits to the template.', 'xperio' ); ?></em></li>
		</ol>
	</div>

	<div class="setup-step">
		<h4><?php esc_html_e( 'Restore/Reset Default Content Layout of Template Parts (Header/Footer/Sidebar)', 'xperio' ); ?></h4>
		<ol>
			<li><?php esc_html_e( 'Go to', 'xperio' ); ?> <strong><?php esc_html_e( 'Appearance → Editor → Patterns', 'xperio' ); ?></strong></li>
			<li><?php esc_html_e( 'Click on', 'xperio' ); ?> <strong><?php esc_html_e( 'All Template Parts', 'xperio' ); ?></strong></li>
			<li><?php esc_html_e( 'Click on the', 'xperio' ); ?> <strong><?php esc_html_e( '3 Dots', 'xperio' ); ?></strong> <?php esc_html_e( 'icon on the right side of the respective template parts.', 'xperio' ); ?></li>
			<li><?php esc_html_e( 'Click on', 'xperio' ); ?> <strong><?php esc_html_e( 'Reset', 'xperio' ); ?></strong>. <em><?php esc_html_e( 'Note: The Reset option appears only if there are any edits to the template.', 'xperio' ); ?></em></li>
		</ol>
	</div>
	<div class="setup-step">
		<h4><?php esc_html_e( 'Importing Patterns', 'xperio' ); ?></h4>
		<em><?php esc_html_e( 'Note: To use this feature download the ', 'xperio' ); ?><strong class="xperio-setup-link"><?php esc_html_e( 'Recommended Plugin', 'xperio' ); ?></strong></em>
		<ol>
			<li><?php esc_html_e( 'Go to', 'xperio' ); ?> <strong><?php esc_html_e( 'Appearance → Editor → Your Preferred Page / Template', 'xperio' ); ?></strong></li>
			<li><?php esc_html_e( 'Click on', 'xperio' ); ?> <strong><?php esc_html_e( 'Design Kit Library ', 'xperio' ); ?></strong><?php esc_html_e( 'on editor navigation bar', 'xperio' ); ?>
			</li>
			<li><?php esc_html_e( 'On the Popup Menu, Select', 'xperio' ); ?> <strong><?php esc_html_e( 'Patterns', 'xperio' ); ?></strong> <?php esc_html_e( ' on the top navigation', 'xperio' ); ?>
			</li>
			<li><?php esc_html_e( 'Click', 'xperio' ); ?> <strong><?php esc_html_e( 'Import ', 'xperio' ); ?></strong><?php	esc_html_e( 'to import the pattern', 'xperio' ); ?>
			</li>
		</ol>
	</div>
</div>
<div class="xperio-page__setup-instructions xperio-page__pro-setup">
	<h3><?php esc_html_e( 'Pro Layout Setup', 'xperio' ); ?></h3>

	<div class="setup-step">
		<h4><?php esc_html_e( 'Importing Pro Templates', 'xperio' ); ?></h4>
		<em><?php esc_html_e( 'Note: To use this feature download the ', 'xperio' ); ?><strong class="xperio-setup-link"><?php esc_html_e( 'Recommended Plugin', 'xperio' ); ?></strong></em>
		<ol>
			<li><?php esc_html_e( 'Go to', 'xperio' ); ?> <strong><?php esc_html_e( 'Appearance → Editor → Your Preferred Page / Template', 'xperio' ); ?></strong></li>
			<li><?php esc_html_e( 'Click on', 'xperio' ); ?> <strong><?php esc_html_e( 'Design Kit Library ', 'xperio' ); ?></strong><?php esc_html_e( 'on editor navigation bar', 'xperio' ); ?>
				<img src=<?php echo esc_url( get_template_directory_uri() . '/inc/admin/images/admin-img.png' ); ?> alt="admin-img-1">
			</li>
			<li><?php esc_html_e( 'On the Popup Menu, Select', 'xperio' ); ?> <strong><?php esc_html_e( 'Homepage Templates', 'xperio' ); ?></strong> <?php esc_html_e( ' on the top navigation', 'xperio' ); ?>
				<img src=<?php echo esc_url( get_template_directory_uri() . '/inc/admin/images/admin-img-template.png' ); ?> alt="admin-img-2">
			</li>
			<li><?php esc_html_e( 'Click', 'xperio' ); ?> <strong><?php esc_html_e( 'Import ', 'xperio' ); ?></strong><?php	esc_html_e( 'to import the template', 'xperio' ); ?>
				<img src=<?php echo esc_url( get_template_directory_uri() . '/inc/admin/images/admin-img-import.png' ); ?> alt="admin-img-2">
			</li>
		</ol>
	</div>
</div>
<?php
