<?php get_header(); ?>

<?php
// =====================================================
// HERO SLIDER ODER HERO SECTION
// =====================================================
if ( get_theme_mod('slider_enabled', false) ) :
?>
    <section class="hero-slider swiper-container">
        <div class="swiper-wrapper">
            <?php
            for ( $i = 1; $i <= 5; $i++ ) :
                $image_url = get_theme_mod( 'slider_image_' . $i );
                if ( $image_url ) :
                    $title    = get_theme_mod( 'slider_title_' . $i );
                    $subtitle = get_theme_mod( 'slider_subtitle_' . $i );
            ?>
                <div class="swiper-slide" style="background-image: url('<?php echo esc_url( $image_url ); ?>');">
                    <div class="slider-content">
                        <?php if ( $title ) : ?>
                            <h2 class="slider-title"><?php echo esc_html( $title ); ?></h2>
                        <?php endif; ?>

                        <?php if ( $subtitle ) : ?>
                            <p class="slider-subtitle"><?php echo esc_html( $subtitle ); ?></p>
                        <?php endif; ?>
                    </div>
                </div>
            <?php
                endif;
            endfor;
            ?>
        </div>

        <?php if ( ! get_theme_mod( 'slider_hide_pagination', false ) ) : ?>
            <div class="swiper-pagination"></div>
        <?php endif; ?>

        <?php if ( ! get_theme_mod( 'slider_hide_arrows', false ) ) : ?>
            <div class="swiper-button-prev"></div>
            <div class="swiper-button-next"></div>
        <?php endif; ?>
    </section>

    <!-- ================================================= -->
    <!-- ANNOUNCEMENT ANKER (unter Slider, ohne Scroll-Bug) -->
    <!-- ================================================= -->
    <div id="mm-announcement-anchor"></div>

<?php else : ?>

    <?php
    $hero_bg       = get_theme_mod( 'hero_bg_image' );
    $hero_title    = get_theme_mod( 'hero_title', 'Willkommen auf unserem Server' );
    $hero_subtitle = get_theme_mod( 'hero_subtitle', 'Trete einer Community voller Abenteuer bei.' );
    $btn1_text     = get_theme_mod( 'hero_button_1_text', 'Zum Forum' );
    $btn1_url      = get_theme_mod( 'hero_button_1_url', '#' );
    $btn2_text     = get_theme_mod( 'hero_button_2_text', 'Zum Teamspeak' );
    $btn2_url      = get_theme_mod( 'hero_button_2_url', '#' );
    ?>

    <section class="hero-section"
        style="<?php
            echo $hero_bg
                ? "background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url('" . esc_url( $hero_bg ) . "')"
                : '';
        ?>">
        <div class="container">
            <h1 class="hero-title"><?php echo esc_html( $hero_title ); ?></h1>
            <p class="hero-subtitle"><?php echo esc_html( $hero_subtitle ); ?></p>

            <div class="hero-buttons">
                <a href="<?php echo esc_url( $btn1_url ); ?>" class="hero-button-1">
                    <?php echo esc_html( $btn1_text ); ?>
                </a>
                <a href="<?php echo esc_url( $btn2_url ); ?>" class="hero-button-2">
                    <?php echo esc_html( $btn2_text ); ?>
                </a>
            </div>
        </div>
    </section>

    <!-- ================================================= -->
    <!-- ANNOUNCEMENT ANKER (unter Hero, ohne Scroll-Bug) -->
    <!-- ================================================= -->
    <div id="mm-announcement-anchor"></div>

<?php endif; ?>

<!-- ===================================================== -->
<!-- MAIN CONTENT MIT SIDEBAR -->
<!-- ===================================================== -->
<main id="primary" class="site-main">
    <div class="container">
        
        <?php
        // Hole Sidebar-Einstellungen
        $sidebar_enabled = get_theme_mod( 'homepage_sidebar_enabled', false );
        $sidebar_position = get_theme_mod( 'homepage_sidebar_position', 'right' );
        
        // Prüfe ob mindestens ein Sidebar-Bereich aktiv ist
        $has_sidebar_content = (
            is_active_sidebar( 'homepage-sidebar-top' ) ||
            is_active_sidebar( 'homepage-sidebar-middle-1' ) ||
            is_active_sidebar( 'homepage-sidebar-middle-2' ) ||
            is_active_sidebar( 'homepage-sidebar-bottom' ) ||
            is_active_sidebar( 'homepage-sidebar-extra' )
        );
        
        // Setze CSS-Klassen basierend auf Sidebar-Status
        $content_class = 'content-area';
        if ( $sidebar_enabled && $has_sidebar_content ) {
            $content_class = 'content-area with-sidebar sidebar-' . esc_attr( $sidebar_position );
        }
        ?>

        <div class="<?php echo esc_attr( $content_class ); ?>">
            
            <?php if ( $sidebar_enabled && $sidebar_position === 'left' && $has_sidebar_content ) : ?>
                <!-- SIDEBAR LINKS -->
                <aside class="homepage-sidebar sidebar-left">
                    <?php if ( is_active_sidebar( 'homepage-sidebar-top' ) ) : ?>
                        <div class="sidebar-section sidebar-top">
                            <?php dynamic_sidebar( 'homepage-sidebar-top' ); ?>
                        </div>
                    <?php endif; ?>
                    
                    <?php if ( is_active_sidebar( 'homepage-sidebar-middle-1' ) ) : ?>
                        <div class="sidebar-section sidebar-middle-1">
                            <?php dynamic_sidebar( 'homepage-sidebar-middle-1' ); ?>
                        </div>
                    <?php endif; ?>
                    
                    <?php if ( is_active_sidebar( 'homepage-sidebar-middle-2' ) ) : ?>
                        <div class="sidebar-section sidebar-middle-2">
                            <?php dynamic_sidebar( 'homepage-sidebar-middle-2' ); ?>
                        </div>
                    <?php endif; ?>
                    
                    <?php if ( is_active_sidebar( 'homepage-sidebar-bottom' ) ) : ?>
                        <div class="sidebar-section sidebar-bottom">
                            <?php dynamic_sidebar( 'homepage-sidebar-bottom' ); ?>
                        </div>
                    <?php endif; ?>
                    
                    <?php if ( is_active_sidebar( 'homepage-sidebar-extra' ) ) : ?>
                        <div class="sidebar-section sidebar-extra">
                            <?php dynamic_sidebar( 'homepage-sidebar-extra' ); ?>
                        </div>
                    <?php endif; ?>
                </aside>
            <?php endif; ?>

            <!-- HAUPTINHALT -->
            <div class="main-content">
                <?php if ( have_posts() ) : ?>
                    <?php while ( have_posts() ) : the_post(); ?>

                        <article id="post-<?php the_ID(); ?>" <?php post_class( 'post' ); ?>>

                            <?php if ( has_post_thumbnail() ) : ?>
                                <div class="post-thumbnail">
                                    <a href="<?php the_permalink(); ?>">
                                        <?php the_post_thumbnail( 'medium_large' ); ?>
                                    </a>
                                </div>
                            <?php endif; ?>

                            <div class="post-content">
                                <h2 class="post-title">
                                    <a href="<?php the_permalink(); ?>">
                                        <?php the_title(); ?>
                                    </a>
                                </h2>

                                <div class="post-full-content">
                                    <?php the_content(); ?>
                                </div>
                            </div>

                        </article>

                    <?php endwhile; ?>
                <?php else : ?>

                    <p><?php esc_html_e( 'Keine Beiträge gefunden.', 'minecraft-modern-theme' ); ?></p>

                <?php endif; ?>
            </div>

            <?php if ( $sidebar_enabled && $sidebar_position === 'right' && $has_sidebar_content ) : ?>
                <!-- SIDEBAR RECHTS -->
                <aside class="homepage-sidebar sidebar-right">
                    <?php if ( is_active_sidebar( 'homepage-sidebar-top' ) ) : ?>
                        <div class="sidebar-section sidebar-top">
                            <?php dynamic_sidebar( 'homepage-sidebar-top' ); ?>
                        </div>
                    <?php endif; ?>
                    
                    <?php if ( is_active_sidebar( 'homepage-sidebar-middle-1' ) ) : ?>
                        <div class="sidebar-section sidebar-middle-1">
                            <?php dynamic_sidebar( 'homepage-sidebar-middle-1' ); ?>
                        </div>
                    <?php endif; ?>
                    
                    <?php if ( is_active_sidebar( 'homepage-sidebar-middle-2' ) ) : ?>
                        <div class="sidebar-section sidebar-middle-2">
                            <?php dynamic_sidebar( 'homepage-sidebar-middle-2' ); ?>
                        </div>
                    <?php endif; ?>
                    
                    <?php if ( is_active_sidebar( 'homepage-sidebar-bottom' ) ) : ?>
                        <div class="sidebar-section sidebar-bottom">
                            <?php dynamic_sidebar( 'homepage-sidebar-bottom' ); ?>
                        </div>
                    <?php endif; ?>
                    
                    <?php if ( is_active_sidebar( 'homepage-sidebar-extra' ) ) : ?>
                        <div class="sidebar-section sidebar-extra">
                            <?php dynamic_sidebar( 'homepage-sidebar-extra' ); ?>
                        </div>
                    <?php endif; ?>
                </aside>
            <?php endif; ?>

        </div>
    </div>
</main>

<!-- ===================================================== -->
<!-- ZUSÄTZLICHES CSS FÜR SIDEBAR LAYOUT -->
<!-- ===================================================== -->
<style>
/* Content ohne Sidebar - volle Breite */
.content-area .main-content {
    width: 100%;
	margin-bottom: 40px;
}

/* Container mit Sidebar-Layout */
.content-area.with-sidebar {
    display: grid;
    gap: 30px;
    align-items: start;
}

/* Sidebar rechts (Standard) */
.content-area.with-sidebar.sidebar-right {
    grid-template-columns: 1fr 300px;
}

.content-area.with-sidebar.sidebar-right .main-content {
    order: 1;
}

.content-area.with-sidebar.sidebar-right .homepage-sidebar {
    order: 2;
}

/* Sidebar links */
.content-area.with-sidebar.sidebar-left {
    grid-template-columns: 300px 1fr;
}

.content-area.with-sidebar.sidebar-left .homepage-sidebar {
    order: 1;
}

.content-area.with-sidebar.sidebar-left .main-content {
    order: 2;
}

/* Sidebar Styling */
.homepage-sidebar {
    background: var(--card-background, #1e2029);
    border-radius: 8px;
    padding: 20px;
    position: sticky;
    top: 100px; /* Sticky Sidebar */
    max-height: none;
    overflow-y: visible;
}

/* Sidebar Sections - Bereiche innerhalb der Sidebar */
.homepage-sidebar .sidebar-section {
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.homepage-sidebar .sidebar-section:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

/* Spezielle Styling für bestimmte Bereiche */
.homepage-sidebar .sidebar-top {
    border-bottom: 2px solid var(--primary-accent, #00d4ff);
}

.homepage-sidebar .sidebar-bottom {
    padding-top: 20px;
    border-top: 2px solid var(--primary-accent, #00d4ff);
    border-bottom: none;
}

.homepage-sidebar .widget {
    margin-bottom: 20px;
}

.homepage-sidebar .widget:last-child {
    margin-bottom: 0;
}

.homepage-sidebar .widget-title {
    font-size: 1.2rem;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--primary-accent, #00d4ff);
    color: var(--primary-accent, #00d4ff);
}

.homepage-sidebar ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.homepage-sidebar ul li {
    padding: 8px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.homepage-sidebar ul li:last-child {
    border-bottom: none;
}

.homepage-sidebar a {
    color: inherit;
    text-decoration: none;
    transition: color 0.2s ease;
}

.homepage-sidebar a:hover {
    color: var(--primary-accent, #00d4ff);
}

/* Mobile: Sidebar unter Content */
@media (max-width: 768px) {
    .content-area.with-sidebar.sidebar-right,
    .content-area.with-sidebar.sidebar-left {
        grid-template-columns: 1fr;
    }

    .content-area.with-sidebar .homepage-sidebar {
        order: 3 !important; /* Immer unten auf mobilen Geräten */
        position: relative;
        top: 0;
        max-height: none;
    }

    .content-area.with-sidebar .main-content {
        order: 1 !important;
    }
}

/* Dark Mode Anpassungen */
body.dark-mode .homepage-sidebar {
    background: #1e1e1e;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

body.dark-mode .homepage-sidebar ul li {
    border-bottom-color: rgba(255, 255, 255, 0.1);
}

/* Light Mode Anpassungen */
body.light-mode .homepage-sidebar {
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

body.light-mode .homepage-sidebar .sidebar-section {
    border-bottom-color: rgba(0, 0, 0, 0.1);
}

body.light-mode .homepage-sidebar ul li {
    border-bottom-color: rgba(0, 0, 0, 0.1);
}

body.light-mode .homepage-sidebar .widget-title {
    color: var(--primary-accent, #00d4ff);
}

/* Scrollbar Styling für Sidebar */
.homepage-sidebar::-webkit-scrollbar {
    width: 6px;
}

.homepage-sidebar::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.1);
    border-radius: 3px;
}

.homepage-sidebar::-webkit-scrollbar-thumb {
    background: var(--primary-accent, #00d4ff);
    border-radius: 3px;
}

.homepage-sidebar::-webkit-scrollbar-thumb:hover {
    background: var(--primary-accent-hover, #00b8e6);
}
</style>

<?php get_footer(); ?>