<?php
/**
 * Theme Get Started / Upsell Page
 *
 * @package BOUTIQUE_DESIGNER_SHOP
 */

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

/**
 * Add theme page to admin menu
 */
add_action( 'admin_menu', 'boutique_designer_shop_add_theme_page' );
function boutique_designer_shop_add_theme_page() {
	add_theme_page(
		__( 'Boutique Designer Shop Pro', 'boutique-designer-shop' ),
		'Boutique Designer Shop 🚀',
		'manage_options',
		'boutique-designer-shop-pro',
		'boutique_designer_shop_pro_page_callback'
	);
}

/**
 * Render theme Get Started page
 */
function boutique_designer_shop_pro_page_callback() {
	$theme_name_clean = strtolower( preg_replace( '#[^a-zA-Z]#', '', wp_get_theme()->get( 'Name' ) ) );
	$wizard_page_slug = apply_filters( $theme_name_clean . '_theme_setup_wizard_boutique_designer_shop_page_slug', $theme_name_clean . '-wizard' );
	$demo_url         = admin_url( 'themes.php?page=' . $wizard_page_slug );
	?>
	<div class="wrap ot-pro-wrap">
		<h1><?php esc_html_e( 'Get Started with Boutique Designer Shop 🚀', 'boutique-designer-shop' ); ?></h1>

		<div class="ot-pro-hero">
			<div class="hero-content">
				<div class="hero-left">
					<h2><?php esc_html_e( 'Build Your Professional Website Today', 'boutique-designer-shop' ); ?></h2>
					<p class="subtitle"><?php esc_html_e( 'Get access to premium features, advanced layouts, demo import, and priority support', 'boutique-designer-shop' ); ?></p>
					<div class="button-group">
						<a class="button button-hero theme-install" href="<?php echo esc_url( $demo_url ); ?>">
							<span class="dashicons dashicons-download"></span>
							<?php esc_html_e( 'Demo Import', 'boutique-designer-shop' ); ?>
						</a>
						<a href="<?php echo esc_url( BOUTIQUE_DESIGNER_SHOP_LIVE_DEMO ); ?>" target="_blank" class="button button-hero button-demo">
							<span class="dashicons dashicons-visibility"></span>
							<?php esc_html_e( 'Live Demo', 'boutique-designer-shop' ); ?>
						</a>
						<a href="<?php echo esc_url( BOUTIQUE_DESIGNER_SHOP_BUY_PRO ); ?>" target="_blank" class="button button-primary button-hero button-pro">
							<span class="dashicons dashicons-star-filled"></span>
							<?php esc_html_e( 'Get Pro Theme', 'boutique-designer-shop' ); ?>
						</a>
						<a href="<?php echo esc_url( BOUTIQUE_DESIGNER_SHOP_FREE_DOC ); ?>" target="_blank" class="button button-hero button-docs">
							<span class="dashicons dashicons-book"></span>
							<?php esc_html_e( 'Documentation', 'boutique-designer-shop' ); ?>
						</a>
						<a href="<?php echo esc_url( BOUTIQUE_DESIGNER_SHOP_BUNDLE_LINK ); ?>" target="_blank" class="button button-hero button-bundle">
							<span class="dashicons dashicons-cart"></span>
							<?php esc_html_e( 'WordPress Theme Bundle', 'boutique-designer-shop' ); ?>
						</a>
					</div>
				</div>
				<div class="hero-right">
					<img src="<?php echo esc_url( get_template_directory_uri() ); ?>/screenshot.png" alt="<?php esc_attr_e( 'Boutique Designer Shop Theme Screenshot', 'boutique-designer-shop' ); ?>" class="theme-screenshot">
				</div>
			</div>
		</div>

		<div class="ot-pro-features">
			<h2><?php esc_html_e( 'Why Upgrade to Pro?', 'boutique-designer-shop' ); ?></h2>

			<div class="feature-grid">
				<div class="feature-box">
					<span class="dashicons dashicons-layout"></span>
					<h3><?php esc_html_e( 'Different Styling Options', 'boutique-designer-shop' ); ?></h3>
					<p><?php esc_html_e( 'Choose from multiple color schemes and styling options to match your brand identity.', 'boutique-designer-shop' ); ?></p>
				</div>

				<div class="feature-box">
					<span class="dashicons dashicons-admin-customizer"></span>
					<h3><?php esc_html_e( 'Section Reordering Option', 'boutique-designer-shop' ); ?></h3>
					<p><?php esc_html_e( 'Rearrange homepage sections in any order to best showcase your services.', 'boutique-designer-shop' ); ?></p>
				</div>

				<div class="feature-box">
					<span class="dashicons dashicons-editor-table"></span>
					<h3><?php esc_html_e( 'Footer Builder', 'boutique-designer-shop' ); ?></h3>
					<p><?php esc_html_e( 'Create custom footers with advanced widgets and flexible column layouts.', 'boutique-designer-shop' ); ?></p>
				</div>

				<div class="feature-box">
					<span class="dashicons dashicons-art"></span>
					<h3><?php esc_html_e( 'Typography Controls', 'boutique-designer-shop' ); ?></h3>
					<p><?php esc_html_e( 'Full control over fonts, sizes, and text styling across all sections of your site.', 'boutique-designer-shop' ); ?></p>
				</div>

				<div class="feature-box">
					<span class="dashicons dashicons-cart"></span>
					<h3><?php esc_html_e( 'WooCommerce Styling', 'boutique-designer-shop' ); ?></h3>
					<p><?php esc_html_e( 'Advanced WooCommerce integration with custom product and service page layouts.', 'boutique-designer-shop' ); ?></p>
				</div>

				<div class="feature-box">
					<span class="dashicons dashicons-admin-tools"></span>
					<h3><?php esc_html_e( 'Advanced Options', 'boutique-designer-shop' ); ?></h3>
					<p><?php esc_html_e( 'Access advanced theme settings to achieve greater customization and control.', 'boutique-designer-shop' ); ?></p>
				</div>

				<div class="feature-box">
					<span class="dashicons dashicons-performance"></span>
					<h3><?php esc_html_e( 'Performance Optimized', 'boutique-designer-shop' ); ?></h3>
					<p><?php esc_html_e( '3X faster loading with optimized code, minified assets, and clean markup.', 'boutique-designer-shop' ); ?></p>
				</div>

				<div class="feature-box">
					<span class="dashicons dashicons-sos"></span>
					<h3><?php esc_html_e( 'Priority Support', 'boutique-designer-shop' ); ?></h3>
					<p><?php esc_html_e( 'Get expert help within 24 hours through our dedicated priority support system.', 'boutique-designer-shop' ); ?></p>
				</div>

				<div class="feature-box">
					<span class="dashicons dashicons-admin-appearance"></span>
					<h3><?php esc_html_e( 'Unlimited Color Schemes', 'boutique-designer-shop' ); ?></h3>
					<p><?php esc_html_e( 'Customize every color to match your brand identity with unlimited color options.', 'boutique-designer-shop' ); ?></p>
				</div>

				<div class="feature-box">
					<span class="dashicons dashicons-download"></span>
					<h3><?php esc_html_e( 'One-Click Demo Import', 'boutique-designer-shop' ); ?></h3>
					<p><?php esc_html_e( 'Import the complete demo content with one click and get your site ready instantly.', 'boutique-designer-shop' ); ?></p>
				</div>
			</div>
		</div>

		<div class="ot-pro-comparison">
			<h2><?php esc_html_e( 'Free vs Pro Comparison', 'boutique-designer-shop' ); ?></h2>

			<table class="comparison-table">
				<thead>
					<tr>
						<th><?php esc_html_e( 'Feature', 'boutique-designer-shop' ); ?></th>
						<th><?php esc_html_e( 'Free', 'boutique-designer-shop' ); ?></th>
						<th class="pro-col"><?php esc_html_e( 'Pro', 'boutique-designer-shop' ); ?></th>
					</tr>
				</thead>
				<tbody>
					<tr>
						<td><?php esc_html_e( 'WordPress Customizer Support', 'boutique-designer-shop' ); ?></td>
						<td>&#9989;</td>
						<td class="pro-col">&#9989;</td>
					</tr>
					<tr>
						<td><?php esc_html_e( 'Demo Importer', 'boutique-designer-shop' ); ?></td>
						<td>&#9989;</td>
						<td class="pro-col">&#9989;</td>
					</tr>
					<tr>
						<td><?php esc_html_e( 'Responsive Design', 'boutique-designer-shop' ); ?></td>
						<td>&#9989;</td>
						<td class="pro-col">&#9989;</td>
					</tr>
					<tr>
						<td><?php esc_html_e( 'Color Options', 'boutique-designer-shop' ); ?></td>
						<td><?php esc_html_e( 'Limited', 'boutique-designer-shop' ); ?></td>
						<td class="pro-col"><?php esc_html_e( 'Unlimited', 'boutique-designer-shop' ); ?></td>
					</tr>
					<tr>
						<td><?php esc_html_e( 'Typography Controls (Heading &amp; Body Font)', 'boutique-designer-shop' ); ?></td>
						<td><?php esc_html_e( 'Basic', 'boutique-designer-shop' ); ?></td>
						<td class="pro-col"><?php esc_html_e( 'Advanced', 'boutique-designer-shop' ); ?></td>
					</tr>
					<tr>
						<td><?php esc_html_e( 'Sticky Header', 'boutique-designer-shop' ); ?></td>
						<td>&#9989;</td>
						<td class="pro-col">&#9989;</td>
					</tr>
					<tr>
						<td><?php esc_html_e( 'Preloader / Loader', 'boutique-designer-shop' ); ?></td>
						<td>&#9989;</td>
						<td class="pro-col">&#9989;</td>
					</tr>
					<tr>
						<td><?php esc_html_e( 'Scroll-to-Top Button', 'boutique-designer-shop' ); ?></td>
						<td>&#9989;</td>
						<td class="pro-col">&#9989;</td>
					</tr>
					<tr>
						<td><?php esc_html_e( 'Homepage Slider Section', 'boutique-designer-shop' ); ?></td>
						<td>&#9989;</td>
						<td class="pro-col">&#9989;</td>
					</tr>
					<tr>
						<td><?php esc_html_e( 'Social Media Links', 'boutique-designer-shop' ); ?></td>
						<td>&#9989;</td>
						<td class="pro-col">&#9989;</td>
					</tr>
					<tr>
						<td><?php esc_html_e( 'WooCommerce Support', 'boutique-designer-shop' ); ?></td>
						<td><?php esc_html_e( 'Basic', 'boutique-designer-shop' ); ?></td>
						<td class="pro-col"><?php esc_html_e( 'Advanced Styling', 'boutique-designer-shop' ); ?></td>
					</tr>
					<tr>
						<td><?php esc_html_e( 'Section Reordering', 'boutique-designer-shop' ); ?></td>
						<td>&#10060;</td>
						<td class="pro-col">&#9989;</td>
					</tr>
					<tr>
						<td><?php esc_html_e( 'Boxed / Full-Width Layout', 'boutique-designer-shop' ); ?></td>
						<td>&#9989;</td>
						<td class="pro-col">&#9989;</td>
					</tr>
					<tr>
						<td><?php esc_html_e( 'Left / Right Sidebar', 'boutique-designer-shop' ); ?></td>
						<td>&#9989;</td>
						<td class="pro-col">&#9989;</td>
					</tr>
					<tr>
						<td><?php esc_html_e( 'Priority Support', 'boutique-designer-shop' ); ?></td>
						<td>&#10060;</td>
						<td class="pro-col">&#9989;</td>
					</tr>
				</tbody>
			</table>
		</div>

		<div class="ot-pro-testimonials">
			<h2><?php esc_html_e( 'What Our Users Say', 'boutique-designer-shop' ); ?></h2>

			<div class="testimonial-grid">
				<div class="testimonial-box">
					<div class="stars">&#11088;&#11088;&#11088;&#11088;&#11088;</div>
					<p><?php esc_html_e( '"I was looking for a clean and professional theme for my business and this theme delivered exactly that. Setup was quick and the layout looks very modern."', 'boutique-designer-shop' ); ?></p>
					<span class="author"><?php esc_html_e( '- John D.', 'boutique-designer-shop' ); ?></span>
				</div>

				<div class="testimonial-box">
					<div class="stars">&#11088;&#11088;&#11088;&#11088;</div>
					<p><?php esc_html_e( '"The theme design is professional and easy to customize. The documentation helped me set up my Boutique Designer Shop website without any issues."', 'boutique-designer-shop' ); ?></p>
					<span class="author"><?php esc_html_e( '- Sarah M.', 'boutique-designer-shop' ); ?></span>
				</div>

				<div class="testimonial-box">
					<div class="stars">&#11088;&#11088;&#11088;&#11088;&#11088;</div>
					<p><?php esc_html_e( '"Very flexible and beginner-friendly. I was able to adjust colors, sections, and layouts directly from the Customizer. Highly recommended."', 'boutique-designer-shop' ); ?></p>
					<span class="author"><?php esc_html_e( '- Michael R.', 'boutique-designer-shop' ); ?></span>
				</div>

				<div class="testimonial-box">
					<div class="stars">&#11088;&#11088;&#11088;&#11088;</div>
					<p><?php esc_html_e( '"The mobile responsive design works perfectly. Most of my clients visit from their phones, and the site looks clean and professional."', 'boutique-designer-shop' ); ?></p>
					<span class="author"><?php esc_html_e( '- Emily T.', 'boutique-designer-shop' ); ?></span>
				</div>

				<div class="testimonial-box">
					<div class="stars">&#11088;&#11088;&#11088;&#11088;&#11088;</div>
					<p><?php esc_html_e( '"Great theme for professionals. The service sections and homepage layout helped me present my services clearly to potential clients."', 'boutique-designer-shop' ); ?></p>
					<span class="author"><?php esc_html_e( '- David L.', 'boutique-designer-shop' ); ?></span>
				</div>

				<div class="testimonial-box">
					<div class="stars">&#11088;&#11088;&#11088;&#11088;</div>
					<p><?php esc_html_e( '"Customer support is very helpful and responsive. They guided me during setup and solved my issue quickly."', 'boutique-designer-shop' ); ?></p>
					<span class="author"><?php esc_html_e( '- Jennifer K.', 'boutique-designer-shop' ); ?></span>
				</div>

				<div class="testimonial-box">
					<div class="stars">&#11088;&#11088;&#11088;&#11088;&#11088;</div>
					<p><?php esc_html_e( '"Fast loading and SEO friendly. After launching my website with this theme, I started receiving more inquiries from clients."', 'boutique-designer-shop' ); ?></p>
					<span class="author"><?php esc_html_e( '- Robert H.', 'boutique-designer-shop' ); ?></span>
				</div>

				<div class="testimonial-box">
					<div class="stars">&#11088;&#11088;&#11088;&#11088;</div>
					<p><?php esc_html_e( '"A very good theme with useful features for Boutique Designer Shop businesses. Easy to install and the demo import was a real time-saver."', 'boutique-designer-shop' ); ?></p>
					<span class="author"><?php esc_html_e( '- Lisa P.', 'boutique-designer-shop' ); ?></span>
				</div>
			</div>
		</div>

		<div class="ot-pro-cta">
			<h2><?php esc_html_e( 'Ready to Upgrade?', 'boutique-designer-shop' ); ?></h2>
			<p><?php esc_html_e( 'Join hundreds of satisfied customers who upgraded to Pro', 'boutique-designer-shop' ); ?></p>
			<a href="<?php echo esc_url( BOUTIQUE_DESIGNER_SHOP_BUY_PRO ); ?>" target="_blank" class="button button-primary button-hero">
				<?php esc_html_e( 'Get Boutique Designer Shop Pro Now', 'boutique-designer-shop' ); ?> &rarr;
			</a>
		</div>

		<div class="ot-pro-footer">
			<p>
				<?php
				printf(
					/* translators: %s: Support URL */
					__( 'Need help? Contact our <a href="%s" target="_blank">support</a> team anytime.', 'boutique-designer-shop' ),
					esc_url( BOUTIQUE_DESIGNER_SHOP_SUPPORT )
				);
				?>
			</p>
		</div>
	</div>
	<?php
}
