<?php
/**
 * The header for our theme.
 *
 * This is the template that displays all of the <head> section and everything up until <div id="content">
 *
 * @link https://developer.wordpress.org/themes/basics/template-files/#template-partials
 *
 * @package enjoystyle
 */

?><!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="HandheldFriendly" content="true">
<link rel="profile" href="https://gmpg.org/xfn/11">
<?php wp_head(); ?>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
</head>

<body <?php body_class(); ?>>

<?php
	//wp_body_open hook from WordPress 5.2
	if ( function_exists( 'wp_body_open' ) ) {
	    wp_body_open();
	} else { 
	    do_action( 'wp_body_open' ); 
	}
?>

<div id="page" class="site">

	<a class="skip-link screen-reader-text" href="#content"><?php esc_html_e( 'Skip to content', 'enjoystyle' ); ?></a>

	<?php if ( has_nav_menu( 'top' ) ) { ?>

	<div id="top-bar" class="clear">

		<div class="container">

			<nav id="top-nav" class="main-navigation">

				<?php 
					if ( has_nav_menu( 'top' ) ) {
						wp_nav_menu( array( 'theme_location' => 'top', 'menu_id' => 'top-menu', 'menu_class' => 'sf-menu' ) );
					}
				?>

			</nav><!-- #primary-nav -->	

			<div class="header-right">
				<?php if ( has_nav_menu ( 'social' ) ) : ?>
					<nav aria-label="<?php esc_attr_e( 'Expanded Social links', 'enjoystyle' ); ?>" role="navigation">
						<ul class="social-menu reset-list-style social-icons fill-children-current-color">

								<?php
									wp_nav_menu(
										array(
											'theme_location'  => 'social',
											'container'       => '',
											'container_class' => '',
											'items_wrap'      => '%3$s',
											'menu_id'         => '',
											'menu_class'      => '',
											'depth'           => 1,
											'link_before'     => '<span class="screen-reader-text">',
											'link_after'      => '</span>',
											'fallback_cb'     => '',
										)
									);
									?>
						</ul>
					</nav>
				<?php endif; ?>

			</div><!-- .header-right -->

		</div><!-- .container -->

	</div><!-- #top-bar -->

	<?php } ?>	

	<header id="masthead" class="site-header clear">

		<?php
			the_custom_header_markup();
		?>

		<div class="container">

			<div class="site-branding">

				<?php if ( has_custom_logo() ) { ?>

					<div id="logo">
						<?php the_custom_logo(); ?>
					</div><!-- #logo -->

				<?php } ?>

				<?php if (display_header_text()==true) { ?>

					<div class="site-title-desc">

						<div class="site-title">
							<h1><a href="<?php echo esc_url( home_url() ); ?>"><?php bloginfo('name'); ?></a></h1>
						</div><!-- .site-title -->	

						<div class="site-description">
							<?php bloginfo('description'); ?>
						</div><!-- .site-desc -->

					</div><!-- .site-title-desc -->

				<?php } ?>

			</div><!-- .site-branding -->		

			<div class="header-toggles">
				<button class="toggle nav-toggle mobile-nav-toggle" data-toggle-target=".menu-modal"  data-toggle-body-class="showing-menu-modal" aria-expanded="false" data-set-focus=".close-nav-toggle">
					<span class="toggle-inner">
						<span class="toggle-icon">
							<?php enjoystyle_the_theme_svg( 'ellipsis' ); ?>
						</span>
						<span class="toggle-text"><?php esc_html_e( 'Menu', 'enjoystyle' ); ?></span>
					</span>
				</button><!-- .nav-toggle -->
			</div><!-- .header-toggles -->
			
		</div><!-- .container -->

	</header><!-- #masthead -->

	<div class="primary-bar">

		<div class="container">

			<nav id="primary-nav" class="primary-navigation clear">
				<?php 
					if ( has_nav_menu( 'primary' ) ) {
						wp_nav_menu( array( 'theme_location' => 'primary', 'menu_id' => 'primary-menu', 'menu_class' => 'sf-menu', 'link_before' => '<span class="menu-text">','link_after'=>'</span>' ) );
					} else {
				?>
					<ul id="primary-menu" class="sf-menu">
						<li><a href="<?php echo esc_url( home_url() ); ?>"><?php esc_html_e('Home', 'enjoystyle'); ?></a></li>
					</ul><!-- .sf-menu -->
				<?php } ?>			
			</nav><!-- #primary-nav -->
						
		</div><!-- .container -->

	</div><!-- .primary-bar -->

	<div class="menu-modal cover-modal header-footer-group" data-modal-target-string=".menu-modal">

		<div class="menu-modal-inner modal-inner">

			<div class="menu-wrapper section-inner">

				<div class="menu-top">

					<button class="toggle close-nav-toggle fill-children-current-color" data-toggle-target=".menu-modal" data-toggle-body-class="showing-menu-modal" aria-expanded="false" data-set-focus=".menu-modal">
						<span class="toggle-text"><?php esc_html_e( 'Close Menu', 'enjoystyle' ); ?></span>
						<?php enjoystyle_the_theme_svg( 'cross' ); ?>
					</button><!-- .nav-toggle -->

					<?php

					$mobile_menu_location = '';

					// If the mobile menu location is not set, use the primary location as fallbacks, in that order.
					if ( has_nav_menu( 'mobile' ) ) {
						$mobile_menu_location = 'mobile';
					} elseif ( has_nav_menu( 'primary' ) ) {
						$mobile_menu_location = 'primary';
					}

					?>

					<nav class="mobile-menu" aria-label="<?php esc_attr_e( 'Mobile', 'enjoystyle' ); ?>" role="navigation">

						<ul class="modal-menu reset-list-style">

						<?php
						if ( $mobile_menu_location ) {

							wp_nav_menu(
								array(
									'container'      => '',
									'items_wrap'     => '%3$s',
									'show_toggles'   => true,
									'theme_location' => $mobile_menu_location,
								)
							);

						} else {

							wp_list_pages(
								array(
									'match_menu_classes' => true,
									'show_toggles'       => true,
									'title_li'           => false,
									'walker'             => new EnjoyStyle_Walker_Page(),
								)
							);

						}
						?>

						</ul>

					</nav>

				</div><!-- .menu-top -->

			</div><!-- .menu-wrapper -->

		</div><!-- .menu-modal-inner -->

	</div><!-- .menu-modal -->	

<div class="header-space"></div>

<?php 
	if ( is_home() ) { 
		get_template_part('template-parts/content', 'featured'); 
	} 
?>

<?php if ( is_home() && is_active_sidebar( 'home-image' ) && (!is_paged()) ) { ?>
	<div class="container">
		<div id="home-image-blocks" class="ht_grid_wrap clear">
			<?php dynamic_sidebar( 'home-image' ); ?>
		</div>
	</div>
<?php } ?>

<div id="content" class="site-content container <?php if( (!is_active_sidebar( 'home-sidebar' )) && (!is_active_sidebar( 'sidebar-1' )) ) { echo 'is_full_width'; } ?> clear">
