<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
    <meta charset="<?php bloginfo( 'charset' ); ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
    <?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<?php wp_body_open(); ?>

<header id="masthead" class="site-header">
    <div class="container">
        <div class="header-main">
            <div class="site-branding">
                <?php
                if ( function_exists( 'the_custom_logo' ) && has_custom_logo() ) {
                    the_custom_logo();
                }
                ?>

                <?php
                if ( is_front_page() && is_home() ) :
                    ?>
                    <h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></h1>
                <?php else : ?>
                    <p class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></p>
                <?php endif; ?>
            </div>

            <!-- NAVIGATION START -->
            <nav id="site-navigation" class="main-navigation" role="navigation" aria-label="<?php esc_attr_e('Hauptmenü','minecraft-modern-theme'); ?>">
                <!-- Mobile Toggle Button -->
                <button class="menu-toggle" aria-controls="primary-menu" aria-expanded="false">
                    <i class="fas fa-bars"></i>
                </button>

                <?php
                wp_nav_menu( array(
                    'theme_location' => 'primary',
                    'container'      => false,
                    'menu_class'     => 'primary-menu',
                    'fallback_cb'    => false,
                ) );
                ?>
            </nav>
            <!-- NAVIGATION ENDE -->

            <div class="header-info">
                <div class="social-links">
                    <?php
                    $social_icons = array(
                        'discord'   => 'fab fa-discord',
                        'youtube'   => 'fab fa-youtube',
                        'twitter'   => 'fab fa-x-twitter',
                        'facebook'  => 'fab fa-facebook-f',
                        'instagram' => 'fab fa-instagram',
                        'tiktok'    => 'fab fa-tiktok',
                        'twitch'    => 'fab fa-twitch',
                        'steam'     => 'fab fa-steam',
                        'github'    => 'fab fa-github',
                        'linkedin'  => 'fab fa-linkedin-in',
                        'pinterest' => 'fab fa-pinterest-p',
                        'reddit'    => 'fab fa-reddit-alien',
                        'teamspeak' => 'fab fa-teamspeak',
                        'spotify'   => 'fab fa-spotify'
                    );

                    foreach ( $social_icons as $key => $class ) {
                        if ( get_theme_mod( 'social_' . $key ) ) {
                            echo '<a href="' . esc_url( get_theme_mod( 'social_' . $key ) ) . '" target="_blank" rel="noopener"><i class="' . esc_attr( $class ) . '"></i></a>';
                        }
                    }
                    ?>
                </div>
            </div>
        </div> <!-- .header-main -->
    </div>
</header>
