<?php
/**
 * Template Name: À propos Luxury
 *
 * Template pour la page À propos avec design luxury
 *
 * @package ChaletMontagne
 * @since 1.0.0
 */

get_header();
?>

<main id="primary" class="site-main luxury-about" tabindex="-1">

    <?php while (have_posts()) : the_post(); ?>

        <!-- Page Hero -->
        <section class="luxury-page-hero">
            <?php if (has_post_thumbnail()) : ?>
                <div class="luxury-page-hero-background" style="background-image: url(<?php echo esc_url(get_the_post_thumbnail_url(null, 'full')); ?>);"></div>
                <div class="luxury-page-hero-overlay"></div>
            <?php endif; ?>
            <div class="luxury-container">
                <div class="luxury-page-hero-content">
                    <?php if (function_exists('chaletmontagne_breadcrumbs') && get_theme_mod('chaletmontagne_show_breadcrumbs', true)) : ?>
                        <div class="luxury-breadcrumbs">
                            <?php chaletmontagne_breadcrumbs(); ?>
                        </div>
                    <?php endif; ?>
                    <h1 class="luxury-page-title"><?php the_title(); ?></h1>
                </div>
            </div>
        </section>

        <!-- Contenu principal -->
        <section class="luxury-section">
            <div class="luxury-container luxury-container-narrow">
                <div class="entry-content luxury-about-content">
                    <?php the_content(); ?>
                </div>
            </div>
        </section>

        <!-- Notre Histoire (si customizer rempli) -->
        <?php
        $station_name = get_theme_mod('chaletmontagne_station_name');
        if ($station_name) :
        ?>
        <section class="luxury-section luxury-story">
            <div class="luxury-container">
                <div class="luxury-story-grid">
                    <div class="luxury-story-content">
                        <div class="luxury-section-subtitle"><?php esc_html_e('Notre Histoire', 'chalet-montagne'); ?></div>
                        <h2 class="luxury-section-title"><?php esc_html_e('Passion et Excellence', 'chalet-montagne'); ?></h2>
                        <p>
                            <?php
                            printf(
                                esc_html__('Depuis plusieurs années, nous accueillons nos hôtes à %s avec un seul objectif : créer des souvenirs inoubliables dans un cadre d\'exception.', 'chalet-montagne'),
                                esc_html($station_name)
                            );
                            ?>
                        </p>
                        <p>
                            <?php esc_html_e('Notre équipe passionnée met tout en œuvre pour vous offrir un service personnalisé et des prestations haut de gamme.', 'chalet-montagne'); ?>
                        </p>
                    </div>
                    <div class="luxury-story-stats">
                        <?php
                        // Statistiques (peuvent être personnalisées via ACF ou custom fields)
                        $stats = array(
                            array(
                                'number' => '10+',
                                'label'  => __('Années d\'expérience', 'chalet-montagne'),
                            ),
                            array(
                                'number' => '500+',
                                'label'  => __('Clients satisfaits', 'chalet-montagne'),
                            ),
                            array(
                                'number' => '100%',
                                'label'  => __('Dévotion au service', 'chalet-montagne'),
                            ),
                        );

                        foreach ($stats as $stat) :
                        ?>
                            <div class="luxury-stat">
                                <div class="luxury-stat-number"><?php echo esc_html($stat['number']); ?></div>
                                <div class="luxury-stat-label"><?php echo esc_html($stat['label']); ?></div>
                            </div>
                        <?php endforeach; ?>
                    </div>
                </div>
            </div>
        </section>
        <?php endif; ?>

        <!-- Nos Valeurs -->
        <section class="luxury-section luxury-values">
            <div class="luxury-container">
                <div class="luxury-section-header">
                    <div class="luxury-section-subtitle"><?php esc_html_e('Nos Valeurs', 'chalet-montagne'); ?></div>
                    <h2 class="luxury-section-title"><?php esc_html_e('Ce Qui Nous Guide', 'chalet-montagne'); ?></h2>
                </div>

                <div class="luxury-cards luxury-cards-4">
                    <?php
                    $values = array(
                        array(
                            'icon'  => '🏔️',
                            'title' => __('Authenticité', 'chalet-montagne'),
                            'text'  => __('Nous privilégions les matériaux nobles et le charme authentique de la montagne.', 'chalet-montagne'),
                        ),
                        array(
                            'icon'  => '✨',
                            'title' => __('Excellence', 'chalet-montagne'),
                            'text'  => __('Chaque détail est soigné pour vous offrir une expérience inoubliable.', 'chalet-montagne'),
                        ),
                        array(
                            'icon'  => '🤝',
                            'title' => __('Proximité', 'chalet-montagne'),
                            'text'  => __('Une équipe à votre écoute, disponible et réactive à vos besoins.', 'chalet-montagne'),
                        ),
                        array(
                            'icon'  => '🌿',
                            'title' => __('Respect', 'chalet-montagne'),
                            'text'  => __('Nous préservons l\'environnement et soutenons l\'économie locale.', 'chalet-montagne'),
                        ),
                    );

                    foreach ($values as $value) :
                    ?>
                        <div class="luxury-card luxury-card-centered">
                            <div class="luxury-card-icon luxury-card-icon-large">
                                <?php echo $value['icon']; ?>
                            </div>
                            <div class="luxury-card-content">
                                <h3 class="luxury-card-title"><?php echo esc_html($value['title']); ?></h3>
                                <p class="luxury-card-text"><?php echo esc_html($value['text']); ?></p>
                            </div>
                        </div>
                    <?php endforeach; ?>
                </div>
            </div>
        </section>

        <!-- Contact Info -->
        <?php
        $phone = get_theme_mod('chaletmontagne_phone');
        $email = get_theme_mod('chaletmontagne_email');
        $address = get_theme_mod('chaletmontagne_address');

        if ($phone || $email || $address) :
        ?>
        <section class="luxury-section luxury-contact-info">
            <div class="luxury-container">
                <div class="luxury-section-header">
                    <div class="luxury-section-subtitle"><?php esc_html_e('Contact', 'chalet-montagne'); ?></div>
                    <h2 class="luxury-section-title"><?php esc_html_e('Restons en Contact', 'chalet-montagne'); ?></h2>
                </div>

                <div class="luxury-contact-grid">
                    <?php if ($phone) : ?>
                        <div class="luxury-contact-item">
                            <div class="luxury-contact-icon">📞</div>
                            <h3 class="luxury-contact-title"><?php esc_html_e('Téléphone', 'chalet-montagne'); ?></h3>
                            <a href="tel:<?php echo esc_attr(str_replace(' ', '', $phone)); ?>" class="luxury-contact-link">
                                <?php echo esc_html($phone); ?>
                            </a>
                        </div>
                    <?php endif; ?>

                    <?php if ($email) : ?>
                        <div class="luxury-contact-item">
                            <div class="luxury-contact-icon">✉️</div>
                            <h3 class="luxury-contact-title"><?php esc_html_e('Email', 'chalet-montagne'); ?></h3>
                            <a href="mailto:<?php echo esc_attr($email); ?>" class="luxury-contact-link">
                                <?php echo esc_html($email); ?>
                            </a>
                        </div>
                    <?php endif; ?>

                    <?php if ($address) : ?>
                        <div class="luxury-contact-item">
                            <div class="luxury-contact-icon">📍</div>
                            <h3 class="luxury-contact-title"><?php esc_html_e('Adresse', 'chalet-montagne'); ?></h3>
                            <p class="luxury-contact-text"><?php echo esc_html($address); ?></p>
                        </div>
                    <?php endif; ?>
                </div>
            </div>
        </section>
        <?php endif; ?>

    <?php endwhile; ?>

</main>

<?php
get_footer();
