<?php
/**
 * Theme Customizer options.
 *
 * @package AthlonX
 * @since AthlonX 1.0.0
 * @version 1.0
 */

defined( 'ABSPATH' ) || exit;

define( 'ATHLONX_FONT2SVG_URL', 'https://danmarshall.github.io/google-font-to-svg-path/' );

/**
* Get and define theme Customizer modificaiton variables.
*/

  add_action('customize_preview_init', function() {

    $theme_version = wp_get_theme()->get( 'Version' );

    wp_enqueue_script( 
      'athlonx-options', 
      get_template_directory_uri() . '/assets/js/options.js', 
      array( 'jquery', 'customize-preview' ), $theme_version, true 
    );

  } );

/**
* Register and add Customizer Theme Options panel.
*/

  add_action( 'customize_register', function( $wp_customize ) { 

    call_user_func_array( 
      array( $wp_customize, 'add_panel' ), 
      array( 'athlonx_theme_options', array(
        'priority'           => 180,
        'capability'         => 'edit_theme_options',
        'title'              => __( 'Theme Options', 'athlonx' ),
        'desc'               => __( 'AthlonX theme options panel.', 'athlonx' ),
        'panel'              => '',
        'description_hidden' => true,
      ) )
    );

    $theme_options_panel_attrs['front_cta'] = array(
      'priority'           => 10,
      'capability'         => 'edit_theme_options',
      'title'              => __( 'CTA', 'athlonx' ),
      'desc'               => __( 'AthlonX theme call to action options panel.', 'athlonx' ),
      'panel'              => 'athlonx_theme_options',
      'description_hidden' => true,
    );

    $theme_options_panel_attrs['front_extra'] = array(
      'priority'           => 10,
      'capability'         => 'edit_theme_options',
      'title'              => __( 'Extra', 'athlonx' ),
      'desc'               => __( 'AthlonX theme front extra options panel.', 'athlonx' ),
      'panel'              => 'athlonx_theme_options',
      'description_hidden' => true,
    );

    $theme_options_panel_attrs['front_product'] = array(
      'priority'           => 10,
      'capability'         => 'edit_theme_options',
      'title'              => __( 'Featured Product', 'athlonx' ),
      'desc'               => __( 'AthlonX theme front featured product options panel.', 'athlonx' ),
      'panel'              => 'athlonx_theme_options',
      'description_hidden' => true,
    );

    $theme_options_panel_attrs['front_footer'] = array(
      'priority'           => 10,
      'capability'         => 'edit_theme_options',
      'title'              => __( 'Footer', 'athlonx' ),
      'desc'               => __( 'AthlonX theme front footer options panel.', 'athlonx' ),
      'panel'              => 'athlonx_theme_options',
      'description_hidden' => true,
    );

    $theme_options_panel_attrs['general'] = array(
      'priority'           => 10,
      'capability'         => 'edit_theme_options',
      'title'              => __( 'General', 'athlonx' ),
      'desc'               => __( 'AthlonX theme General options panel.', 'athlonx' ),
      'panel'              => 'athlonx_theme_options',
      'description_hidden' => true,
    );

    $theme_options_panel_attrs['front_header'] = array(
      'priority'           => 10,
      'capability'         => 'edit_theme_options',
      'title'              => __( 'Header', 'athlonx' ),
      'desc'               => __( 'AthlonX theme front header options panel.', 'athlonx' ),
      'panel'              => 'athlonx_theme_options',
      'description_hidden' => true,
    );

    $theme_options_panel_attrs['front_mosaic'] = array(
      'priority'           => 10,
      'capability'         => 'edit_theme_options',
      'title'              => __( 'Mosaic', 'athlonx' ),
      'desc'               => __( 'AthlonX theme front mosaic options panel.', 'athlonx' ),
      'panel'              => 'athlonx_theme_options',
      'description_hidden' => true,
    );

    $theme_options_panel_attrs['front_presentation'] = array(
      'priority'           => 10,
      'capability'         => 'edit_theme_options',
      'title'              => __( 'Presentation', 'athlonx' ),
      'desc'               => __( 'AthlonX theme front presentation options panel.', 'athlonx' ),
      'panel'              => 'athlonx_theme_options',
      'description_hidden' => true,
    );

    $theme_options_panel_attrs['front_product_variations'] = array(
      'priority'           => 10,
      'capability'         => 'edit_theme_options',
      'title'              => __( 'Product Variations', 'athlonx' ),
      'desc'               => __( 'AthlonX theme front (2) products with vatiations options panel.', 'athlonx' ),
      'panel'              => 'athlonx_theme_options',
      'description_hidden' => true,
    );

    $theme_options_panel_attrs['front_slideshow'] = array(
      'priority'           => 10,
      'capability'         => 'edit_theme_options',
      'title'              => __( 'Sldieshow', 'athlonx' ),
      'desc'               => __( 'AthlonX theme front slideshow options panel.', 'athlonx' ),
      'panel'              => 'athlonx_theme_options',
      'description_hidden' => true,
    );

    foreach ( $theme_options_panel_attrs as $uuid => $attrs ) {

      call_user_func_array( 
        array( $wp_customize, 'add_section' ), 
        array( 'athlonx_theme_' . $uuid . '_options', $attrs )
      );
    } 

  }, 10, 1 );

/**
* Register and add Customizer Theme Options (and other) secondary modification variables.
*/
  add_action( 'customize_register', function( $wp_customize ) {

    /**
    * 1. THEME OPTIONS > CTA
    */

      // Text before.
      $wp_customize_control['athlonx_front_cta_text_before'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_cta_text_before', 
        array(
          'section'     => 'athlonx_theme_front_cta_options',
          'label'       => __( 'Call to Action', 'athlonx' ),
          'description' => __( 'Add text and button content to your CTA area.<hr />Text Before Heading', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_cta_text_before', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Heading text.
      $wp_customize_control['athlonx_front_cta_heading'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_cta_heading', 
        array(
          'section'     => 'athlonx_theme_front_cta_options',
          'label'       => '',
          'description' => __( 'Heading Text', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_cta_heading', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Text after.
      $wp_customize_control['athlonx_front_cta_text_after'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_cta_text_after', 
        array(
          'section'     => 'athlonx_theme_front_cta_options',
          'label'       => '',
          'description' => __( 'Text After Heading', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_cta_text_after', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Button text.
      $wp_customize_control['athlonx_front_cta_button_text'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_cta_button_text', 
        array(
          'section'     => 'athlonx_theme_front_cta_options',
          'label'       => '',
          'description' => __( 'Button Text', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_cta_button_text', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Button link.
      $wp_customize_control['athlonx_front_cta_button_link'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_cta_button_link', 
        array(
          'section'     => 'athlonx_theme_front_cta_options',
          'label'       => '',
          'description' => __( 'Button Link', 'athlonx' ),
          'type'        => 'url',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_cta_button_link', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

    /**
    * 2. THEME OPTIONS > EXTRA
    */

      // Video placeholder image.
      $wp_customize_control['athlonx_front_video_placeholder_image'] = new \WP_Customize_Cropped_Image_Control( 
        $wp_customize, 
        'athlonx_front_video_placeholder_image', 
        array(
          'section'     => 'athlonx_theme_front_extra_options',
          'label'       => __( 'Video', 'athlonx' ),
          'description' => __( 'Select a static image and link for your video area.<hr />Static Video Image', 'athlonx' ),
          'type'        => 'cropped_image',
          'flex_width'  => false,
          'flex_height' => false,
          'width'       => 900,
          'height'      => 450,
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_video_placeholder_image', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Video link.
      $wp_customize_control['athlonx_front_video_link_id'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_video_link_id', 
        array(
          'section'     => 'athlonx_theme_front_extra_options',
          'label'       => '',
          'description' => __( 'YouTube Video ID (e.g. pVE92TNDwUk)', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_video_link_id', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Content cover background.
      $wp_customize_control['athlonx_front_content_cover_background'] = new \WP_Customize_Cropped_Image_Control( 
        $wp_customize, 
        'athlonx_front_content_cover_background', 
        array(
          'section'     => 'athlonx_theme_front_extra_options',
          'label'       => __( 'Content Cover', 'athlonx' ),
          'description' => __( 'Select a background and add text for your conten cover area.<hr />Background Image', 'athlonx' ),
          'type'        => 'cropped_image',
          'flex_width'  => false,
          'flex_height' => false,
          'width'       => 1800,
          'height'      => 600,
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_content_cover_background', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Content cover HTML.
      $wp_customize_control['athlonx_front_content_cover_html'] = new \WP_Customize_Code_Editor_Control( 
        $wp_customize, 
        'athlonx_front_content_cover_html', 
        array(
          'section'     => 'athlonx_theme_front_extra_options',
          'label'       => '',
          'description' => __( 'Content Text (HTML)', 'athlonx' ),
          'type'        => 'code_editor',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_content_cover_html', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

    /**
    * 3. THEME OPTIONS > FEATURED PRODUCTS
    */

      // Featured product name.
      $wp_customize_control['athlonx_front_featured_product_name'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_featured_product_name', 
        array(
          'section'     => 'athlonx_theme_front_product_options',
          'label'       => '',
          'description' => __( 'Text Above Image', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_featured_product_name', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Featured product image.
      $wp_customize_control['athlonx_front_featured_product_image'] = new \WP_Customize_Cropped_Image_Control( 
        $wp_customize, 
        'athlonx_front_featured_product_image', 
        array(
          'section'     => 'athlonx_theme_front_product_options',
          'label'       => __( 'Featured Product', 'athlonx' ),
          'description' => __( 'Select an image and link for your featured product area.<hr />Foreground Image', 'athlonx' ),
          'type'        => 'cropped_image',
          'flex_width'  => false,
          'flex_height' => false,
          'width'       => 1200,
          'height'      => 600,
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_featured_product_image', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

    /**
    * 4. THEME OPTIONS > FOOTER
    */

      // Footer image
      $wp_customize_control['athlonx_front_footer_image'] = new \WP_Customize_Cropped_Image_Control( 
        $wp_customize, 
        'athlonx_front_footer_image', 
        array(
          'section'     => 'athlonx_theme_front_footer_options',
          'label'       => __( 'Footer Image', 'athlonx' ),
          'description' => __( 'Select an image for your footer area.', 'athlonx' ),
          'type'        => 'cropped_image',
          'flex_width'  => false,
          'flex_height' => false,
          'width'       => 1200,
          'height'      => 600,
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_footer_image', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Social networking links
      $wp_customize_control['athlonx_front_social_facebook_link'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_social_facebook_link', 
        array(
          'section'     => 'athlonx_theme_front_footer_options',
          'label'       => __( 'Social Networking Links', 'athlonx' ),
          'description' => __( 'Add links to your social networking profiles.<hr />Facebook', 'athlonx' ),
          'type'        => 'url',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_social_facebook_link', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) ); // Facebook.

      $wp_customize_control['athlonx_front_social_twitter_link'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_social_twitter_link', 
        array(
          'section'     => 'athlonx_theme_front_footer_options',
          'label'       => '',
          'description' => __( 'Twitter', 'athlonx' ),
          'type'        => 'url',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_social_twitter_link', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) ); // Twitter.

      $wp_customize_control['athlonx_front_social_instagram_link'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_social_instagram_link', 
        array(
          'section'     => 'athlonx_theme_front_footer_options',
          'label'       => '',
          'description' => __( 'Instagram', 'athlonx' ),
          'type'        => 'url',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_social_instagram_link', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) ); // Instagram.

      $wp_customize_control['athlonx_front_social_youtube_link'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_social_youtube_link', 
        array(
          'section'     => 'athlonx_theme_front_footer_options',
          'label'       => '',
          'description' => __( 'YouTube', 'athlonx' ),
          'type'        => 'url',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_social_youtube_link', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) ); // Youtube.

    /**
    * 5. THEME OPTIONS > GENERAL
    */

      // Color palette.
      $wp_customize_control['athlonx_color_palette'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_color_palette', 
        array(
          'section'     => 'athlonx_theme_general_options',
          'label'       => __( 'Color Palette', 'athlonx' ),
          'description' => __( 'Select color palette.', 'athlonx' ),
          'type'        => 'select',
          'choices'     => array(
            'amber'     => 'Amber',
            'blue-grey' => 'Blue Grey (default)',
            'emerald'   => 'Emerald', 
            'indigo'    => 'Indigo', 
            'teal'      => 'Teal', 
          ),
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_color_palette', array(
            'default'           => 'blue-grey', 
            'transport'         => 'postMessage', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Font family.
      $wp_customize_control['athlonx_font_family'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_font_family', 
        array(
          'section'     => 'athlonx_theme_general_options',
          'label'       => __( 'Font Family', 'athlonx' ),
          'description' => __( 'Select primary font family.', 'athlonx' ),
          'type'        => 'select',
          'choices'     => array(
            'Inconsolata'      => 'Inconsolata',        
            'Lato'             => 'Lato', 
            'Montserrat'       => 'Montserrat (default)', 
            'Merriweather'     => 'Merriweather', 
            'PT Sans'          => 'PT Sans',
            'PT Serif'         => 'PT Serif',
            'Raleway'          => 'Raleway', 
            'Roboto'           => 'Roboto ',
            'Roboto Condensed' => 'Roboto Condensed',
            'Ubuntu'           => 'Ubuntu', 
          ),
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_font_family', array(
            'default'           => 'Montserrat', 
            'transport'         => 'postMessage', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Body container width.
      $wp_customize_control['athlonx_theme_options'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_container_width', 
        array(
          'section'     => 'athlonx_theme_general_options',
          'label'       => __( 'Container Width', 'athlonx' ),
          'description' => __( 'Select body container width.', 'athlonx' ),
          'type'        => 'select',
          'choices'     => array(
            '960'  => '960px',
            '1024' => '1024px', 
            '1200' => '1200px (default)', 
            // '1440' => '1440px', 
            // '1680' => '1680px', 
            // '2000' => '2000px', 
          ),
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_container_width', array(
            'default'           => '1200', 
            'transport'         => 'postMessage', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Blog sidebar.
      $wp_customize_control['athlonx_blog_sidebar'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_blog_sidebar', 
        array(
          'section'     => 'athlonx_theme_general_options',
          'label'       => __( 'Blog Sidebar', 'athlonx' ),
          'description' => __( 'Select blog sidebar visibility.', 'athlonx' ),
          'type'        => 'select',
          'choices'     => array(
            'hide' => 'hide (default)',
            'show' => 'show', 
          ),
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_blog_sidebar', array(
            'default'           => 'hide', 
            'transport'         => 'postMessage', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Blog cover title.
      $wp_customize_control['athlonx_header_title'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_header_title', 
        array(
          'section'     => 'athlonx_theme_general_options',
          'label'       => __( 'Blog Cover', 'athlonx' ),
          'description' => __( 'Add content for you blog index cover area.<hr />Header Title', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_header_title', array(
            'default'           => get_bloginfo( 'name' ), 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Blog cover text.
      $wp_customize_control['athlonx_header_text'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_header_text', 
        array(
          'section'     => 'athlonx_theme_general_options',
          'label'       => '',
          'description' => __( 'Header Text', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_header_text', array(
            'default'           => get_bloginfo( 'description' ), 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Blog cover button text.
      $wp_customize_control['athlonx_header_button_text'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_header_button_text', 
        array(
          'section'     => 'athlonx_theme_general_options',
          'label'       => '',
          'description' => __( 'Button Text', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_header_button_text', array(
            'default'           => 'Read more...', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Blog cover button link.
      $wp_customize_control['athlonx_header_button_link'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_header_button_link', 
        array(
          'section'     => 'athlonx_theme_general_options',
          'label'       => '',
          'description' => __( 'Button Link', 'athlonx' ),
          'type'        => 'url',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_header_button_link', array(
            'default'           => esc_url( home_url() ), 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

    /**
    * 6. THEME OPTIONS > HEADER
    */

      // Header background image.
      $wp_customize_control['athlonx_front_header_background'] = new \WP_Customize_Cropped_Image_Control( 
        $wp_customize, 
        'athlonx_front_header_background', 
        array(
          'section'     => 'athlonx_theme_front_header_options',
          'label'       => __( 'Header', 'athlonx' ),
          'description' => __( 'Select images for your header fore- and background parallax area.<hr />Background Image', 'athlonx' ),
          'type'        => 'cropped_image',
          'flex_width'  => false,
          'flex_height' => false,
          'width'       => 1600,
          'height'      => 1000,
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_header_background', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Header foreground image.
      $wp_customize_control['athlonx_front_header_foreground'] = new \WP_Customize_Cropped_Image_Control( 
        $wp_customize, 
        'athlonx_front_header_foreground', 
        array(
          'section'     => 'athlonx_theme_front_header_options',
          'label'       => '',
          'description' => __( 'Foreground Image (transparent)', 'athlonx' ),
          'type'        => 'cropped_image',
          'flex_width'  => false,
          'flex_height' => false,
          'width'       => 1600,
          'height'      => 1000,
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_header_foreground', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Header SVG logo.
      $wp_customize_control['athlonx_front_header_svg_logo'] = new \WP_Customize_Code_Editor_Control( 
        $wp_customize, 
        'athlonx_front_header_svg_logo', 
        array(
          'section'     => 'athlonx_theme_front_header_options',
          'label'       => __( 'Logo (SVG)', 'athlonx' ),
          'description' => __( 'Create SVG logo with the', 'athlonx') . '<a href="' . ATHLONX_FONT2SVG_URL . '" target="_blank">Font to SVG</a>' . __( 'Create SVG logo with the tool and add the generated code below.', 'athlonx' ),
          'type'        => 'code_editor',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_header_svg_logo', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

    /**
    * 7. THEME OPTIONS > MOSAIC
    */

      // Mosaic block #1.
      $wp_customize_control['athlonx_front_mosaic_block_image_1'] = new \WP_Customize_Cropped_Image_Control( 
        $wp_customize, 
        'athlonx_front_mosaic_block_image_1', 
        array(
          'section'     => 'athlonx_theme_front_mosaic_options',
          'label'       => __( 'Mosaic Block #1', 'athlonx' ),
          'description' => __( 'Add image and text for the mosaic block.', 'athlonx' ),
          'type'        => 'cropped_image',
          'flex_width'  => false,
          'flex_height' => false,
          'width'       => 640,
          'height'      => 640,
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_mosaic_block_image_1', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      $wp_customize_control['athlonx_front_mosaic_block_text_1'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_mosaic_block_text_1', 
        array(
          'section'     => 'athlonx_theme_front_mosaic_options',
          'label'       => '',
          'description' => __( 'Text Overlay', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_mosaic_block_text_1', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Mosaic block #2.
      $wp_customize_control['athlonx_front_mosaic_block_image_2'] = new \WP_Customize_Cropped_Image_Control( 
        $wp_customize, 
        'athlonx_front_mosaic_block_image_2', 
        array(
          'section'     => 'athlonx_theme_front_mosaic_options',
          'label'       => __( 'Mosaic Block #2', 'athlonx' ),
          'description' => __( 'Add image and text for the mosaic block.', 'athlonx' ),
          'type'        => 'cropped_image',
          'flex_width'  => false,
          'flex_height' => false,
          'width'       => 640,
          'height'      => 640,
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_mosaic_block_image_2', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      $wp_customize_control['athlonx_front_mosaic_block_text_2'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_mosaic_block_text_2', 
        array(
          'section'     => 'athlonx_theme_front_mosaic_options',
          'label'       => '',
          'description' => __( 'Text Overlay', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_mosaic_block_text_2', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Mosaic block #3.
      $wp_customize_control['athlonx_front_mosaic_block_image_3'] = new \WP_Customize_Cropped_Image_Control( 
        $wp_customize, 
        'athlonx_front_mosaic_block_image_3', 
        array(
          'section'     => 'athlonx_theme_front_mosaic_options',
          'label'       => __( 'Mosaic Block #3', 'athlonx' ),
          'description' => __( 'Add image and text for the mosaic block.<hr />Image', 'athlonx' ),
          'type'        => 'cropped_image',
          'flex_width'  => false,
          'flex_height' => false,
          'width'       => 640,
          'height'      => 640,
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_mosaic_block_image_3', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      $wp_customize_control['athlonx_front_mosaic_block_text_3'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_mosaic_block_text_3', 
        array(
          'section'     => 'athlonx_theme_front_mosaic_options',
          'label'       => '',
          'description' => __( 'Text Overlay', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_mosaic_block_text_3', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Mosaic block #4.
      $wp_customize_control['athlonx_front_mosaic_block_image_4'] = new \WP_Customize_Cropped_Image_Control( 
        $wp_customize, 
        'athlonx_front_mosaic_block_image_4', 
        array(
          'section'     => 'athlonx_theme_front_mosaic_options',
          'label'       => __( 'Mosaic Block #4', 'athlonx' ),
          'description' => __( 'Add image and text for the mosaic block.', 'athlonx' ),
          'type'        => 'cropped_image',
          'flex_width'  => false,
          'flex_height' => false,
          'width'       => 960,
          'height'      => 450,
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_mosaic_block_image_4', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      $wp_customize_control['athlonx_front_mosaic_block_text_4'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_mosaic_block_text_4', 
        array(
          'section'     => 'athlonx_theme_front_mosaic_options',
          'label'       => '',
          'description' => __( 'Text Overlay', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_mosaic_block_text_4', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Mosaic block #5.
      $wp_customize_control['athlonx_front_mosaic_block_image_5'] = new \WP_Customize_Cropped_Image_Control( 
        $wp_customize, 
        'athlonx_front_mosaic_block_image_5', 
        array(
          'section'     => 'athlonx_theme_front_mosaic_options',
          'label'       => __( 'Mosaic Block #5', 'athlonx' ),
          'description' => __( 'Add image and text for the mosaic block.', 'athlonx' ),
          'type'        => 'cropped_image',
          'flex_width'  => false,
          'flex_height' => false,
          'width'       => 320,
          'height'      => 320,
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_mosaic_block_image_5', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      $wp_customize_control['athlonx_front_mosaic_block_text_5'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_mosaic_block_text_5', 
        array(
          'section'     => 'athlonx_theme_front_mosaic_options',
          'label'       => '',
          'description' => __( 'Text Overlay', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_mosaic_block_text_5 ', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

    /**
    * 8. THEME OPTIONS > PRESENTATION
    */

      // Presentation heading.
      $wp_customize_control['athlonx_front_present_heading'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_present_heading', 
        array(
          'section'     => 'athlonx_theme_front_presentation_options',
          'label'       => __( 'Presentation Content', 'athlonx' ),
          'description' => __( 'Add content for your presentation area.<hr />Heading Text', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_present_heading', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Presentation text.
      $wp_customize_control['athlonx_front_present_text'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_present_text', 
        array(
          'section'     => 'athlonx_theme_front_presentation_options',
          'label'       => '',
          'description' => __( 'Content Text', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_present_text', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Presentation step #1.
      $wp_customize_control['athlonx_front_present_step_1'] = new \WP_Customize_Code_Editor_Control( 
        $wp_customize, 
        'athlonx_front_present_step_1', 
        array(
          'section'     => 'athlonx_theme_front_presentation_options',
          'label'       => __( 'Presentation steps', 'athlonx' ),
          'description' => __( 'Add short text and describe your app with up to 4 steps.<hr />Step #1', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_present_step_1', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Presentation step #2.
      $wp_customize_control['athlonx_front_present_step_2'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_present_step_2', 
        array(
          'section'     => 'athlonx_theme_front_presentation_options',
          'label'       => '',
          'description' => __( 'Step #2', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_present_step_2', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Presentation step #3.
      $wp_customize_control['athlonx_front_present_step_3'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_present_step_3', 
        array(
          'section'     => 'athlonx_theme_front_presentation_options',
          'label'       => '',
          'description' => __( 'Step #3', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_present_step_3', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Presentation step #4.
      $wp_customize_control['athlonx_front_present_step_4'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_present_step_4', 
        array(
          'section'     => 'athlonx_theme_front_presentation_options',
          'label'       => '',
          'description' => __( 'Step #4', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_present_step_4', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // App store link.
      $wp_customize_control['athlonx_front_present_app_store_link'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_present_app_store_link', 
        array(
          'section'     => 'athlonx_theme_front_presentation_options',
          'label'       => __( 'External Links', 'athlonx' ),
          'description' => __( 'Add external links for your app on App Store and Google Play.<hr />App Store', 'athlonx' ),
          'type'        => 'url',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_present_app_store_link', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Google play link.
      $wp_customize_control['athlonx_front_present_google_play_link'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_present_google_play_link', 
        array(
          'section'     => 'athlonx_theme_front_presentation_options',
          'label'       => '',
          'description' => __( 'Google Play', 'athlonx' ),
          'type'        => 'url',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_present_google_play_link', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Screenshot.
      $wp_customize_control['athlonx_front_present_screenshot_image'] = new \WP_Customize_Cropped_Image_Control( 
        $wp_customize, 
        'athlonx_front_present_screenshot_image', 
        array(
          'section'     => 'athlonx_theme_front_presentation_options',
          'label'       => __( 'Screenshot', 'athlonx' ),
          'description' => __( 'Select an image to place inside the cellphone frame area.', 'athlonx' ),
          'type'        => 'cropped_image',
          'flex_width'  => false,
          'flex_height' => false,
          'width'       => 1200,
          'height'      => 900,
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_present_screenshot_image', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

    /**
    * 9. THEME OPTIONS > PRODUCTS + VARIATIONS
    */

      // Product heading.
      $wp_customize_control['athlonx_front_product_variation_heading'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_product_variation_heading', 
        array(
          'section'     => 'athlonx_theme_front_product_variations_options',
          'label'       => __( 'Prodcut Variations', 'athlonx' ),
          'description' => __( 'Add and link to product to your Shop with up to 6 variations.<hr />Heading Text', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_product_variation_heading', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Product price
      $wp_customize_control['athlonx_front_product_variation_price'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_product_variation_price', 
        array(
          'section'     => 'athlonx_theme_front_product_variations_options',
          'label'       => '',
          'description' => __( 'Price', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_product_variation_price', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Action button text.
      $wp_customize_control['athlonx_front_product_variation_button_text'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_product_variation_button_text', 
        array(
          'section'     => 'athlonx_theme_front_product_variations_options',
          'label'       => '',
          'description' => __( 'Button Text', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_product_variation_button_text', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Action button link.
      $wp_customize_control['athlonx_front_product_variation_button_link'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_product_variation_button_link', 
        array(
          'section'     => 'athlonx_theme_front_product_variations_options',
          'label'       => '',
          'description' => __( 'Button Link', 'athlonx' ),
          'type'        => 'url',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_product_variation_button_link', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Product colors.
      $wp_customize_control['athlonx_front_product_variation_colors'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_product_variation_colors', 
        array(
          'section'     => 'athlonx_theme_front_product_variations_options',
          'label'       => '',
          'description' => __( 'RGB Colors (separated with commas)', 'athlonx' ),
          'type'        => 'text',
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_product_variation_colors', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Product variation image #1.
      $wp_customize_control['athlonx_front_product_variation_image_1'] = new \WP_Customize_Cropped_Image_Control( 
        $wp_customize, 
        'athlonx_front_product_variation_image_1', 
        array(
          'section'     => 'athlonx_theme_front_product_variations_options',
          'label'       => '',
          'description' => __( 'Product Images', 'athlonx' ),
          'type'        => 'cropped_image',
          'flex_width'  => false,
          'flex_height' => false,
          'width'       => 600,
          'height'      => 300,
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_product_variation_image_1', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Product variation image #2.
      $wp_customize_control['athlonx_front_product_variation_image_2'] = new \WP_Customize_Cropped_Image_Control( 
        $wp_customize, 
        'athlonx_front_product_variation_image_2', 
        array(
          'section'     => 'athlonx_theme_front_product_variations_options',
          'label'       => '',
          'description' => '',
          'type'        => 'cropped_image',
          'flex_width'  => false,
          'flex_height' => false,
          'width'       => 600,
          'height'      => 300,
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_product_variation_image_2', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Product variation image #3.
      $wp_customize_control['athlonx_front_product_variation_image_3'] = new \WP_Customize_Cropped_Image_Control( 
        $wp_customize, 
        'athlonx_front_product_variation_image_3', 
        array(
          'section'     => 'athlonx_theme_front_product_variations_options',
          'label'       => '',
          'description' => '',
          'type'        => 'cropped_image',
          'flex_width'  => false,
          'flex_height' => false,
          'width'       => 600,
          'height'      => 300,
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_product_variation_image_3', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Product variation image #4.
      $wp_customize_control['athlonx_front_product_variation_image_4'] = new \WP_Customize_Cropped_Image_Control( 
        $wp_customize, 
        'athlonx_front_product_variation_image_4', 
        array(
          'section'     => 'athlonx_theme_front_product_variations_options',
          'label'       => '',
          'description' => '',
          'type'        => 'cropped_image',
          'flex_width'  => false,
          'flex_height' => false,
          'width'       => 600,
          'height'      => 300,
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_product_variation_image_4', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Product variation image #5.
      $wp_customize_control['athlonx_front_product_variation_image_5'] = new \WP_Customize_Cropped_Image_Control( 
        $wp_customize, 
        'athlonx_front_product_variation_image_5', 
        array(
          'section'     => 'athlonx_theme_front_product_variations_options',
          'label'       => '',
          'description' => '',
          'type'        => 'cropped_image',
          'flex_width'  => false,
          'flex_height' => false,
          'width'       => 600,
          'height'      => 300,
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_product_variation_image_5', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Product variation image #6.
      $wp_customize_control['athlonx_front_product_variation_image_6'] = new \WP_Customize_Cropped_Image_Control( 
        $wp_customize, 
        'athlonx_front_product_variation_image_6', 
        array(
          'section'     => 'athlonx_theme_front_product_variations_options',
          'label'       => '',
          'description' => '',
          'type'        => 'cropped_image',
          'flex_width'  => false,
          'flex_height' => false,
          'width'       => 600,
          'height'      => 300,
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_product_variation_image_6', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

    /**
    * 10. THEME OPTIONS > SLIDESHOW
    */

      // Categories.
      $wp_customize_control['athlonx_front_slideshow_category'] = new \WP_Customize_Control( 
        $wp_customize, 
        'athlonx_front_slideshow_category', 
        array(
          'section'     => 'athlonx_theme_front_slideshow_options',
          'label'       => __( 'Content Category', 'athlonx' ),
          'description' => __( 'Select category which will be used to display content for slideshow area.', 'athlonx' ),
          'type'        => 'select',
          'choices'     => athlonx_get_post_categories(),
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_slideshow_category', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Slideshow image #1.
      $wp_customize_control['athlonx_front_slideshow_image_1'] = new \WP_Customize_Cropped_Image_Control( 
        $wp_customize, 
        'athlonx_front_slideshow_image_1', 
        array(
          'section'     => 'athlonx_theme_front_slideshow_options',
          'label'       => __( 'Slideshow Images', 'athlonx' ),
          'description' => __( 'Add up to 4 slideshow images to display content from the post category.', 'athlonx' ),
          'type'        => 'cropped_image',
          'flex_width'  => false,
          'flex_height' => false,
          'width'       => 900,
          'height'      => 600,
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_slideshow_image_1', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Slideshow image #2.
      $wp_customize_control['athlonx_front_slideshow_image_2'] = new \WP_Customize_Cropped_Image_Control( 
        $wp_customize, 
        'athlonx_front_slideshow_image_2', 
        array(
          'section'     => 'athlonx_theme_front_slideshow_options',
          'label'       => '',
          'description' => '',
          'type'        => 'cropped_image',
          'flex_width'  => false,
          'flex_height' => false,
          'width'       => 900,
          'height'      => 600,
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_slideshow_image_2', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Slideshow image #3.
      $wp_customize_control['athlonx_front_slideshow_image_3'] = new \WP_Customize_Cropped_Image_Control( 
        $wp_customize, 
        'athlonx_front_slideshow_image_3', 
        array(
          'section'     => 'athlonx_theme_front_slideshow_options',
          'label'       => '',
          'description' => '',
          'type'        => 'cropped_image',
          'flex_width'  => false,
          'flex_height' => false,
          'width'       => 900,
          'height'      => 600,
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_slideshow_image_3', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

      // Slideshow image #4.
      $wp_customize_control['athlonx_front_slideshow_image_4'] = new \WP_Customize_Cropped_Image_Control( 
        $wp_customize, 
        'athlonx_front_slideshow_image_4', 
        array(
          'section'     => 'athlonx_theme_front_slideshow_options',
          'label'       => '',
          'description' => '',
          'type'        => 'cropped_image',
          'flex_width'  => false,
          'flex_height' => false,
          'width'       => 900,
          'height'      => 600,
          'priority'    => 10,
          'setting'     => $wp_customize->add_setting( 'athlonx_front_slideshow_image_4', array(
            'default'           => '', 
            'transport'         => 'refresh', 
            'sanitize_callback' => 'sanitize_text_field',
          ) 
        ) 
      ) );

    foreach ( $wp_customize_control as $uuid => $wp_customize_control_options ) {

      $wp_customize->add_control( $wp_customize_control_options );  

      // $wp_customize->selective_refresh->add_partial( $uuid );
    } 
  }, 10, 1 );


/**
* Get and define theme Customizer modificaiton variables.
*/

  add_action( 'init', 'athlonx_theme_customize_options' );

  function athlonx_theme_customize_options() {

    $color_palette   = sanitize_text_field( get_theme_mod( 'athlonx_color_palette' ) );
    
    $font_family     = sanitize_text_field( get_theme_mod( 'athlonx_font_family' ) );
    
    $container_width = sanitize_text_field( get_theme_mod( 'athlonx_container_width' ) );

    if ( $color_palette ) {

      add_action( 'wp_enqueue_scripts', 'athlonx_color_palette_enqueue', 1 );
    }

    if ( $font_family ) {

      add_action( 'wp_enqueue_scripts', 'athlonx_font_family_enqueue', 1 );

      add_action( 'wp_enqueue_scripts', 'athlonx_font_family_inline_style', 10 );
    }

    if ( $container_width ) {

      add_action( 'wp_enqueue_scripts', 'athlonx_container_width_inline_style', 10 );
    }
  }

/**
* Switch between and apply available Color Palettes from the Customizer.
*/

  function athlonx_color_palette_enqueue() {

    $theme_version = wp_get_theme()->get( 'Version' );

    $color_palette = sanitize_text_field( get_theme_mod( 'athlonx_color_palette' ) );
    
    wp_dequeue_style( 'athlonx-style' );

    wp_enqueue_style( 
      'athlonx-style', 
      get_template_directory_uri() . '/assets/css/style-' . $color_palette . '.css', 
      array(), $theme_version, 'all' 
    ); 
  }

/**
* Switch between and apply available Google Fonts from the Customizer.
*/

  function athlonx_font_family_enqueue() {

    $font_family = sanitize_text_field( get_theme_mod( 'athlonx_font_family' ) );
    
    wp_dequeue_style( 'google-font-style' );

    wp_enqueue_style( 
      'google-font-style', 
      'https://fonts.googleapis.com/css?family=' . $font_family . ':300,400,700,900&display=swap', 
      array(), '', 'all' 
    );
  }

  function athlonx_font_family_inline_style() {

    $font_family = sanitize_text_field( get_theme_mod( 'athlonx_font_family' ) );
    
    wp_add_inline_style( 
      'athlonx-style', 
      'html { 
        font-family: ' . $font_family . ', Droid Sans, Helvetica Neue, Helvetica, Arial, -apple-system, BlinkMacSystemFont, sans-serif; 
      }' 
    );
  }

/**
* Switch between and apply available Container Widths in the Customizer.
*/

  function athlonx_container_width_inline_style() {

    $container_width = sanitize_text_field( get_theme_mod( 'athlonx_container_width' ) );

    wp_add_inline_style( 
      'athlonx-style', 
      '.container { 
          max-width: ' . $container_width . 'px; 
        }
        div.post .post-meta, 
        div.post .post-related, 
        .alignfull, 
        .post-comments { 
          margin-left: calc((' . $container_width . 'px - 4rem - 100vw) / 2); 
        }
        .alignwide { 
          margin-left: calc((' . $container_width . 'px - 4rem - 1440px) / 2); 
        }
        .footer-gallery .container .widgets {
          width: ' . ( $container_width - 64 ) . 'px;
        }
        @media (max-width: 1200px) {
          div.post .post-meta, 
          div.post .post-related, 
          .alignfull, 
          .alignwide,
          .post-comments {
            margin-left: -2rem;
          }
          .footer-gallery .container .widgets {
            width: calc(100% - 4rem);
          }
        }'
    );
  }

/**
* Get list with categories used to display posts for the slideshow content area.
*/

  function athlonx_get_post_categories() {

    $output     = array();

    $categories = get_categories();

    foreach( $categories as $category ) {

      $output[$category->slug] = $category->name;
    }

    return $output;
  }