<?php
/**
 * Template Name: Контакты
 * Description: Страница контактной информации с адресами магазинов
 *
 * @package Matreshka
 */

get_header();

// --- Получаем контактные данные из настроек футера ---
$phone_1   = function_exists('get_field') ? get_field('footer_phone_1', 'option') : '';
if ( empty( $phone_1 ) ) { $phone_1 = get_option('matreshka_footer_phone_1'); }

$phone_2   = function_exists('get_field') ? get_field('footer_phone_2', 'option') : '';
if ( empty( $phone_2 ) ) { $phone_2 = get_option('matreshka_footer_phone_2'); }

$email     = function_exists('get_field') ? get_field('footer_email', 'option') : '';
if ( empty( $email ) ) { $email = get_option('matreshka_footer_email'); }

$hours     = function_exists('get_field') ? get_field('footer_hours', 'option') : '';
if ( empty( $hours ) ) { $hours = get_option('matreshka_footer_hours'); }

$vk        = function_exists('get_field') ? get_field('footer_vk', 'option') : '';
if ( empty( $vk ) ) { $vk = get_option('matreshka_footer_vk'); }

$instagram = function_exists('get_field') ? get_field('footer_instagram', 'option') : '';
if ( empty( $instagram ) ) { $instagram = get_option('matreshka_footer_instagram'); }

$telegram  = function_exists('get_field') ? get_field('footer_telegram', 'option') : '';
if ( empty( $telegram ) ) { $telegram = get_option('matreshka_footer_telegram'); }

// --- Адреса магазинов (метабокс) ---
$stores = get_post_meta( get_the_ID(), '_matreshka_stores', true );
if ( ! is_array( $stores ) ) {
    $stores = array();
}
?>

<main id="primary" class="site-main mt-5">
    <?php while ( have_posts() ) : the_post(); ?>

    <!-- Hero-баннер -->
    <section class="contacts-hero">
        <div class="container">
            <div class="contacts-hero-inner">
                <div class="contacts-hero-content">
                    <h1 class="montserrat-bold"><?php the_title(); ?></h1>
                    <p class="montserrat-regular contacts-hero-subtitle">
                        Мы всегда рады помочь вам! Свяжитесь с нами любым удобным способом.
                    </p>
                </div>
                <div class="contacts-hero-image">
                    <img src="/wp-content/themes/matreshka/assets/img/hotline.jpg" alt="Горячая линия">
                </div>
            </div>
        </div>
    </section>

    <!-- Контактна інформація -->
    <section class="contacts-info-section">
        <div class="container">
            <h2 class="montserrat-bold contacts-section-title">Контактная информация</h2>
            <div class="contacts-info-grid">

                <!-- Телефони -->
                <div class="contacts-info-card">
                    <div class="contacts-info-card-icon">
                        <img src="<?php echo esc_url( get_template_directory_uri() . '/assets/icons/Phone.svg' ); ?>" alt="Телефон">
                    </div>
                    <h3 class="montserrat-semibold">Телефоны</h3>
                    <?php if ( ! empty( $phone_1 ) ) : ?>
                        <a href="tel:<?php echo esc_attr( preg_replace('/\s+|\(|\)|-/', '', $phone_1) ); ?>" class="montserrat-medium contacts-phone-link">
                            <?php echo esc_html( $phone_1 ); ?>
                        </a>
                    <?php endif; ?>
                    <?php if ( ! empty( $phone_2 ) ) : ?>
                        <a href="tel:<?php echo esc_attr( preg_replace('/\s+|\(|\)|-/', '', $phone_2) ); ?>" class="montserrat-medium contacts-phone-link">
                            <?php echo esc_html( $phone_2 ); ?>
                        </a>
                    <?php endif; ?>
                </div>

                <!-- Email -->
                <div class="contacts-info-card">
                    <div class="contacts-info-card-icon">
                        <img src="<?php echo esc_url( get_template_directory_uri() . '/assets/icons/email.svg' ); ?>" alt="Email">
                    </div>
                    <h3 class="montserrat-semibold">Электронная почта</h3>
                    <?php if ( ! empty( $email ) ) : ?>
                        <a href="mailto:<?php echo esc_attr( $email ); ?>" class="montserrat-medium contacts-email-link">
                            <?php echo esc_html( $email ); ?>
                        </a>
                    <?php endif; ?>
                </div>

                <!-- Графік роботи -->
                <div class="contacts-info-card">
                    <div class="contacts-info-card-icon">
                        <img src="<?php echo esc_url( get_template_directory_uri() . '/assets/icons/timelapse.svg' ); ?>" alt="График работы">
                    </div>
                    <h3 class="montserrat-semibold">График работы</h3>
                    <?php if ( ! empty( $hours ) ) : ?>
                        <p class="montserrat-regular contacts-hours">
                            <?php echo nl2br( esc_html( $hours ) ); ?>
                        </p>
                    <?php endif; ?>
                </div>

                <!-- Соцмережі -->
                <div class="contacts-info-card">
                    <div class="contacts-info-card-icon">
                        <img src="<?php echo esc_url( get_template_directory_uri() . '/assets/icons/chat_info.svg' ); ?>" alt="Социальные сети">
                    </div>
                    <h3 class="montserrat-semibold">Мы в соцсетях</h3>
                    <div class="contacts-social-links">
                        <?php if ( ! empty( $vk ) ) : ?>
                            <a href="<?php echo esc_url( $vk ); ?>" target="_blank" rel="noopener" class="contacts-social-btn">
                                <img src="<?php echo esc_url( get_template_directory_uri() . '/assets/icons/vk.svg' ); ?>" alt="VK">
                                <span class="montserrat-medium">VKontakte</span>
                            </a>
                        <?php endif; ?>
                        <?php if ( ! empty( $instagram ) ) : ?>
                            <a href="<?php echo esc_url( $instagram ); ?>" target="_blank" rel="noopener" class="contacts-social-btn">
                                <img src="<?php echo esc_url( get_template_directory_uri() . '/assets/icons/instagram.svg' ); ?>" alt="Instagram">
                                <span class="montserrat-medium">Instagram</span>
                            </a>
                        <?php endif; ?>
                        <?php if ( ! empty( $telegram ) ) : ?>
                            <a href="<?php echo esc_url( $telegram ); ?>" target="_blank" rel="noopener" class="contacts-social-btn">
                                <img src="<?php echo esc_url( get_template_directory_uri() . '/assets/icons/telegram.svg' ); ?>" alt="Telegram">
                                <span class="montserrat-medium">Telegram</span>
                            </a>
                        <?php endif; ?>
                    </div>
                </div>

            </div>
        </div>
    </section>

    <!-- Магазини мережі -->
    <?php if ( ! empty( $stores ) ) : ?>
    <section class="contacts-stores-section">
        <div class="container">
            <h2 class="montserrat-bold contacts-section-title">Наши магазины</h2>
            <div class="contacts-stores-grid">
                <?php foreach ( $stores as $index => $store ) : ?>
                    <div class="contacts-store-card">
                        <div class="contacts-store-card-number">
                            <span class="montserrat-bold"><?php echo esc_html( $index + 1 ); ?></span>
                        </div>
                        <div class="contacts-store-card-body">
                            <?php if ( ! empty( $store['name'] ) ) : ?>
                                <h3 class="montserrat-semibold"><?php echo esc_html( $store['name'] ); ?></h3>
                            <?php endif; ?>
                            <?php if ( ! empty( $store['address'] ) ) : ?>
                                <div class="contacts-store-detail">
                                    <img src="<?php echo esc_url( get_template_directory_uri() . '/assets/icons/point.svg' ); ?>" alt="Адрес">
                                    <span class="montserrat-regular"><?php echo esc_html( $store['address'] ); ?></span>
                                </div>
                            <?php endif; ?>
                            <?php if ( ! empty( $store['phone'] ) ) : ?>
                                <div class="contacts-store-detail">
                                    <img src="<?php echo esc_url( get_template_directory_uri() . '/assets/icons/Phone.svg' ); ?>" alt="Телефон">
                                    <a href="tel:<?php echo esc_attr( preg_replace('/\s+|\(|\)|-/', '', $store['phone']) ); ?>" class="montserrat-regular">
                                        <?php echo esc_html( $store['phone'] ); ?>
                                    </a>
                                </div>
                            <?php endif; ?>
                            <?php if ( ! empty( $store['hours'] ) ) : ?>
                                <div class="contacts-store-detail">
                                    <img src="<?php echo esc_url( get_template_directory_uri() . '/assets/icons/timelapse.svg' ); ?>" alt="Часы работы">
                                    <span class="montserrat-regular"><?php echo nl2br( esc_html( $store['hours'] ) ); ?></span>
                                </div>
                            <?php endif; ?>
                        </div>
                    </div>
                <?php endforeach; ?>
            </div>
        </div>
    </section>
    <?php endif; ?>

    <?php endwhile; ?>
</main>

<?php get_footer(); ?>