<div class="wpwrap">
	<?php require_once RTRS_PATH . 'views/setting-sections/settings-header.php'; ?>
		<div id="rtrs-get-help-wrapper">
		<div class="rtrs-setting-container">
			
			<div id="support" class="rt-document-box">
				<div class="rt-box-icon"><i class="dashicons dashicons-media-document"></i></div>
				<div class="rt-box-content">
					<h3 class="main-title"> <?php esc_html_e( 'Thank you for installing Review Schema', 'rtrs' ); ?>  </h3>
					<iframe width="800" height="450"  src="https://www.youtube.com/embed/P1dYzMcerNs" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
				</div>
			</div>
			
			<div class="rtrs-pro-box rt-document-box">
				<div class="rt-box-icon"><i class="dashicons dashicons-megaphone"></i></div>
				<div class="rt-box-content">
					<h3 class="rt-box-title">Pro Features of the Review Schema plugin</h3>
					<div class="rtrs-feature-list">
						
						<ul>
							<li><h4>Features Of Review</h4> </li>
							<li> <i class="dashicons dashicons-saved"></i> Unlimited Rating Criteria </li>
							<li> <i class="dashicons dashicons-saved"></i> Video Review </li>
							<li> <i class="dashicons dashicons-saved"></i> Support Additional Layouts </li>
							<li> <i class="dashicons dashicons-saved"></i> Ajax Pagination Type </li>
							<li> <i class="dashicons dashicons-saved"></i> Unlimited Pros Cons </li>
							<li> <i class="dashicons dashicons-saved"></i> Social Share </li>
							<li> <i class="dashicons dashicons-saved"></i> Review Like Dislike </li>
							<li> <i class="dashicons dashicons-saved"></i> Anonymous Review </li>
							<li> <i class="dashicons dashicons-saved"></i> Purchase Badge For WC/EDD </li>
							<li> <i class="dashicons dashicons-saved"></i> Advanced Layout Styling </li>
						</ul>

						<ul>
							<li><h4>Features Of Schema</h4> </li>
							<li> <i class="dashicons dashicons-saved"></i> Product Schema ( WooCommerce ) </li>
							<li> <i class="dashicons dashicons-saved"></i> Course Schema</li>
							<li> <i class="dashicons dashicons-saved"></i> Job Posting Schema</li>
							<li> <i class="dashicons dashicons-saved"></i> Recipe Schema</li>
							<li> <i class="dashicons dashicons-saved"></i> Software App Schema</li>
							<li> <i class="dashicons dashicons-saved"></i> Image License Schema</li>
							<li> <i class="dashicons dashicons-saved"></i> Special Announcement Schema</li>
						</ul>
						
					</div>
				</div>
			</div>
			
			<div class="rtrs-call-to-action" style="background-image: url('/images/admin/banner.png')">
				<a  href="https://www.radiustheme.com/downloads/wordpress-review-structure-data-schema-plugin/?utm_source=WordPress&utm_medium=reviewschema&utm_campaign=pro_click" target="_blank" class="rt-update-pro-btn">
					Update Pro To Get More Features
				</a>
				
			</div>
			
			<div class="doc-section" style="margin-bottom: 20px;">
				<div class="rt-document-box">
					<div class="rt-box-icon"><i class="dashicons dashicons-media-document"></i></div>
					<div class="rt-box-content">
						<h3 class="rt-box-title">Documentation</h3>
							<p>Get started by spending some time with the documentation we included step by step process with screenshots with video.</p>
							<a href="https://www.radiustheme.com/docs/review-schema/review-schema" target="_blank" class="rt-admin-btn">Documentation</a>
					</div>
				</div>
				<div class="rt-document-box">
					<div class="rt-box-icon"><i class="dashicons dashicons-sos"></i></div>
					<div class="rt-box-content">
						<h3 class="rt-box-title">Need Help?</h3>
						<p>Stuck with something? Please create a
						<a href="https://www.radiustheme.com/ticket-support/">ticket here</a> or post on <a href="https://www.facebook.com/groups/234799147426640/">facebook group</a>. For emergency case join our <a href="https://www.radiustheme.com/">live chat</a>.</p>
						<a href="https://www.radiustheme.com/ticket-support/" target="_blank" class="rt-admin-btn">Get Support</a>
					</div>
				</div>
				<div class="rt-document-box">
					<div class="rt-box-icon"><i class="dashicons dashicons-smiley"></i></div>
					<div class="rt-box-content">
						<h3 class="rt-box-title">Happy Our Work?</h3>
						<p>If you happy with <strong>Team</strong> plugin, please add a rating. It would be glad to us.</p>
						<a href="https://wordpress.org/support/plugin/review-schema/reviews/" class="rt-admin-btn" target="_blank">Post Review</a>
					</div>
				</div>
			</div> 

		</div>
	</div>
	<style>
				
		/* Get help page  */
		div#rtrs-get-help-wrapper .rtrs-setting-container 
		{
			width: 60%;
			margin: 40px auto;
		}
		div#rtrs-get-help-wrapper .rtrs-setting-container h3 
		{
			margin-top: 0;
			line-height: 1.3;
		}

		div#support
		{
			background-color: #ffffff;
			box-shadow: 0 1px 18px 0 rgb(0 0 0 / 8%);
			border-radius: 4px;
			padding: 30px 20px;
			margin-bottom: 20px;
		}
		.doc-section .rt-document-box{
			max-width: calc( 33.33% - 10px );
			box-sizing: border-box;
		}
		.doc-section .rt-document-box + .rt-document-box {
			margin-top: 0;
		}
		.doc-section {
			display: flex;
			gap: 20px;
		}
		div#support .main-title{
			font-size: 25px;
		}

		div#support iframe {
			margin-bottom: 20px;
			max-width: 100%;
		}

		.rtrs-call-to-action {
			background: #5d3dfd;
			height: 150px;
			color: #ffffff;
			margin: 20px 0;
			background-position: center center;
			background-size: cover;
			background-repeat: no-repeat;
			padding: 15px 40px;
			box-sizing: border-box;
			line-height: 1.4;
			display: flex;
			align-items: center;
			justify-content: center;
		}

		.rtrs-call-to-action a {
			color: inherit;
			display: flex;
			flex-wrap: wrap;
			width: 100%;
			height: 100%;
			flex: 1;
			justify-content: center;
			align-items: center;
			font-size: 28px;
			font-weight: 700;
			text-decoration: none;
			box-shadow: none;
		}

		.rtrs-call-to-action a:hover{
			text-decoration: underline;
		}
		.rtrs-call-to-action a:focus{

		}
		.rt-box-content p {
			font-size: 15px;
		}

		.rtrs-pro-box.rt-document-box p {
			font-size: 17px;
			line-height: 1.6;
		}

		.rt-document-box .rt-box-icon {
			height: 30px;
			width: 30px;
			background-color: #ecf1ff;
			border-radius: 50%;
			display: flex;
			align-items: center;
			justify-content: center;
			align-content: center;
			margin-right: 10px;
		}

		.rtrs-testimonials {
			display: flex;
			flex-wrap: wrap;
			gap: 30px;
			margin-top: 20px;
		}
		.rtrs-testimonials .rtrs-testimonial {
			flex: 0 0 calc( 50% - 30px );
		}
		.rtrs-testimonial .client-info {
			display: flex;
			flex-wrap: wrap;
			font-size: 14px;
			align-items: center;
		}
		.rtrs-testimonial .client-info img {
			width: 60px;
			height: 60px;
			object-fit: cover;
			border-radius: 50%;
			margin-right: 10px;
		}
		.rtrs-testimonial .client-info .rtrs-star {
			color: #4C6FFF;
		}
		.rtrs-testimonial .client-info .client-name {
			display: block;
			color: #000;
			font-size: 16px;
			font-weight: 600;
			margin: 8px 0 5px;
		}

		.rtrs-feature-list {
			margin-top: 20px;
			display: flex;
			flex-wrap: wrap;
			gap: 0 30px;
			justify-content: space-between;
			max-width: 600px;
		}
		.rtrs-feature-list ul h4 {
			margin: 0;
		}
		.rtrs-feature-list li {
			line-height: 1.7;
		}

		.rtrs-feature-list ul{
			margin: 0;
		}

		.rtrs-feature-list ul li {
			margin: 5px 10px 5px 0;
			font-size: 15px;
		}
		.rtrs-feature-list ul li i {
			color: #4C6FFF;
		}

		@media (max-width: 1400px){
			div#rtrs-get-help-wrapper .rtrs-setting-container{
				width: 80%;
			}
		}
		@media (max-width: 1199px){
			div#rtrs-get-help-wrapper .rtrs-setting-container{
				width: 90%;
			}
		}
		@media (max-width: 991px){
			.rtrs-testimonials .rtrs-testimonial {
				flex: 0 0 100%;
			}
			.doc-section {
				flex-wrap: wrap;
			}
			.doc-section .rt-document-box {
				max-width: 100%;
				width: 100%;
			}

		}
	</style>
</div>
