<?php
/**
 * Template part for displaying header
 *
 * @package    Wira
 * @since      1.0.0
 */

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

$wira_btn_enabled = get_theme_mod( 'wira_enable_navbar_btn', true );
$wira_btn_text    = get_theme_mod( 'wira_navbar_button_text', 'Get a Quotation' );
$wira_btn_link    = get_theme_mod( 'wira_navbar_button_link', '#' );

?>

<!-- Topbar If Enabled -->
<?php
if ( get_theme_mod( 'wira_enable_topbar', true ) ) :
	get_template_part( 'template-parts/header/header', 'topbar' );
endif;
?>

<!-- Main Navbar -->
<nav class="
<?php
/*
 * Classes to add sticky & overlay navbar
 */
$classes = 'theme-header theme-bg-white navbar navbar-expand-lg';

/*
 * Sticky header
 */
if ( get_theme_mod( 'wira_enable_sticky_header', true ) ) {
	$classes .= ' theme-add-sticky-header';
}

/*
 * Navbar overlay (transparent header over hero)
 */
if ( get_theme_mod( 'wira_enable_navbar_overlay', false ) ) {
	$classes .= ' theme-navbar-overlay';
}

/*
 * Navbar background change
 */
if ( get_theme_mod( 'wira_enable_navbar_bg_change', false ) ) {
	$classes .= ' theme-navbar-bg-change';
}

echo esc_attr( $classes );
?>

	">

	<!-- Navbar Container -->
	<div class="container theme-section">

		<!-- Brand Logo -->
		<div class="theme-brand-logo">
			<?php
			if ( has_custom_logo() ) {
				the_custom_logo();
			} else {
				echo '<a href="' . esc_url( home_url( '/' ) ) . '" class="custom-logo-link" rel="home">';
				echo '<img src="' . esc_url( WIRA_URI . '/assets/img/wira-logo.png' ) . '" alt="' . esc_attr( get_bloginfo( 'name' ) ) . '" rel="home" width="512" height="85" decoding="async"class="custom-logo">';
				echo '</a>';
			}
			?>
		</div><!-- Brand Logo /End -->
		
		<!-- Mobile Menu Button -->
		<button class="theme-mobile-menu-btn d-lg-none d-block" type="button" aria-controls="theme-mobile-menu" aria-expanded="false">
			<i class="fas fa-bars"></i>
		</button> <!-- Mobile Menu Button -/End -->
		
		<!-- Main Menu Navigation -->
		<div class="theme-nav justify-content-end collapse navbar-collapse" id="theme-main-navbar">
			<?php
			wp_nav_menu(
				array(
					'theme_location' => 'main-menu',
					'menu_class'     => 'navbar-nav mb-2 mb-lg-0',
					'container'      => false,
					'fallback_cb'    => function () {
						$fallback = new \Wira\Menu_Fallback();
						$fallback->render();
					},
					'items_wrap'     => '<ul class="%2$s">%3$s</ul>',
					'depth'          => 3,
					'walker'         => new Bootstrap_Navwalker(),
				)
			);
			?>
		</div> <!-- Main Menu Navigation /End -->
		
		<!-- Navbar Button -->
		<?php if ( $wira_btn_enabled ) : ?>
			<a href="<?php echo esc_url( $wira_btn_link ); ?>" class="theme-navbar-btn theme-btn theme-btn-arrow-end ms-5 d-none d-lg-flex">
				<div class="text-btn-wrapper"><span><?php echo esc_html( $wira_btn_text ); ?></span><span><?php echo esc_html( $wira_btn_text ); ?></span></div>
			</a> <!-- Navbar Button /End -->
		<?php endif; ?>
	</div>
</nav> <!-- Main Navbar /End -->

<!-- Mobile Menu Panel -->
<div id="theme-mobile-menu" class="theme-mobile-menu" role="dialog" aria-modal="true" aria-label="<?php echo esc_attr__( 'Mobile menu', 'wira' ); ?>" aria-hidden="true" hidden>

	<!-- Mobile Menu Header -->
	<div class="row mx-0 p-3">
		<div class="d-flex align-items-center col-7 p-0">
			<div class="theme-mobile-brand">
				<?php
				if ( has_custom_logo() ) {
					the_custom_logo();
				} else {
					echo '<a href="' . esc_url( home_url( '/' ) ) . '" class="custom-logo-link" rel="home">';
					echo '<img src="' . esc_url( WIRA_URI . '/assets/img/wira-logo.png' ) . '" alt="' . esc_attr( get_bloginfo( 'name' ) ) . '" rel="home" width="512" height="85" decoding="async"class="custom-logo">';
					echo '</a>';
				}
				?>
			</div>
		</div>
		<div class="d-flex justify-content-end col-5 p-0">

			<!-- Mobile Menu Close -->
			<button class="theme-mobile-menu-close d-lg-none d-block" type="button" aria-label="<?php echo esc_attr__( 'Close menu', 'wira' ); ?>"><i class="fas fa-times"></i></button>
		</div>
	</div><!-- Mobile Menu Header /End -->

	<!-- Mobile Menu Dynamic From Main Menu -->
	<div class="theme-mobile-nav theme-nav p-0"><!-- Navigation Menu --></div>
</div> <!-- Mobile Menu Panel /End -->

<!-- Mobile Menu Panel Overlay -->
<div class="theme-mobile-menu-overlay" aria-hidden="true" hidden></div>
