<?php
namespace SPAATG;

if ( ! defined( 'ABSPATH' ) ) {
 exit; // Exit if accessed directly.
}

use SPAATG\Helper\UiHelper as UiHelper;
?>

<section id="tab-help" class="<?php echo esc_attr( ( $this->display_part == 'help' ) ? 'active setting-tab' : 'setting-tab' ); ?>" data-part="help" >

  <div class='help-center-wrap step-highlight-4'>
    <div class='help-center-stack'>
      <div class='help-center help-center-row-top'>
        <div class='help-center-card'>
          <span class='main-icon'><?php echo wp_kses( UIHelper::getIcon( 'res/images/icon/help.svg' ), [ 'img' => [ 'src' => true, 'class' => true, 'height' => true, 'width' => true, 'alt' => true ] ] ); ?></span>
          <h4><?php esc_html_e( 'Knowledge base', 'shortpixel-ai-alt-text-generator' ); ?></h4>
          <p><?php esc_html_e('Most customer questions are answered in our Knowledge Base.', 'shortpixel-ai-alt-text-generator'); ?></p>

          <span class="shortpixel-button-container">
          <a href="https://shortpixel.com/knowledge-base/" target="_blank" class="button-setting">
             <?php esc_html_e('Knowledge Base', 'shortpixel-ai-alt-text-generator'); ?>
          </a>
          </span>
        </div>
        <div class='help-center-card'>
          <span class='main-icon'><?php echo wp_kses( UIHelper::getIcon( 'res/images/icon/envelope.svg' ), [ 'img' => [ 'src' => true, 'class' => true, 'height' => true, 'width' => true, 'alt' => true ] ] ); ?></span>
          <h4><?php esc_html_e( 'Contact us', 'shortpixel-ai-alt-text-generator' ); ?></h4>
          <p><?php esc_html_e('Contact us with any issues, bug reports, or questions.', 'shortpixel-ai-alt-text-generator'); ?></p>

          <span class="shortpixel-button-container">
          <a href="https://shortpixel.com/contact" target="_blank" class="button-setting">
             <?php esc_html_e('Contact Us', 'shortpixel-ai-alt-text-generator'); ?>
          </a>
          </span>
        </div>
      </div>
      <div class='help-center help-center-row-bottom'>
        <div class='help-center-card'>
          <span class='main-icon'><?php echo wp_kses( UIHelper::getIcon( 'res/images/icon/lightbulb.svg' ), [ 'img' => [ 'src' => true, 'class' => true, 'height' => true, 'width' => true, 'alt' => true ] ] ); ?></span>
          <h4><?php esc_html_e( 'Feature Request', 'shortpixel-ai-alt-text-generator' ); ?></h4>
          <p><?php esc_html_e('Is there a feature missing? Do you have suggestions for improving ShortPixel?', 'shortpixel-ai-alt-text-generator'); ?></p>

          <span class="shortpixel-button-container">
          <a href="https://ideas.shortpixel.com/" target="_blank" class="button-setting">
             <?php esc_html_e('Feature Request', 'shortpixel-ai-alt-text-generator'); ?>
          </a>
          </span>
        </div>
      </div>
    </div>
  </div>
</section>
