<?php

$pageTitle =
    'Liên hệ - PET SPA';


$successMessage =
    $_SESSION['flash_success']
    ?? null;

$errorMessage =
    $_SESSION['flash_error']
    ?? null;


unset(
    $_SESSION['flash_success'],
    $_SESSION['flash_error']
);


require BASE_PATH
    . '/app/views/layouts/header.php';

require BASE_PATH
    . '/app/views/layouts/navbar.php';


require_once BASE_PATH
    . '/app/helpers/MapEmbed.php';


$shop =
    $GLOBALS['shop_settings']
    ?? [];

$socialLinks =
    $GLOBALS['social_links']
    ?? [];


$shopName =
    trim(
        (string) (
            $shop['shop_name']
            ?? 'PET SPA'
        )
    );


if ($shopName === '') {
    $shopName = 'PET SPA';
}


/*
|--------------------------------------------------------------------------
| TÊN + ICON MẠNG XÃ HỘI
|--------------------------------------------------------------------------
*/

$socialNames = [
    'facebook'  => 'Facebook',
    'zalo'      => 'Zalo',
    'tiktok'    => 'TikTok',
    'instagram' => 'Instagram',
    'youtube'   => 'YouTube'
];


$socialIcons = [
    'facebook'  => 'bi-facebook',
    'zalo'      => 'bi-chat-dots',
    'tiktok'    => 'bi-tiktok',
    'instagram' => 'bi-instagram',
    'youtube'   => 'bi-youtube'
];

?>


<main>

<section class="section">

<div class="container">


    <div class="row justify-content-center">

        <div class="col-xl-8 col-lg-10">


            <!-- =====================================================
                 HEADER
            ====================================================== -->

            <div class="text-center mb-5">

                <h1 class="fw-bold">

                    Liên hệ
                    <?= htmlspecialchars(
                        $shopName
                    ) ?>

                </h1>


                <p class="text-muted">

                    Bạn cần hỗ trợ về dịch vụ hoặc lịch hẹn?

                    Hãy gửi lời nhắn cho chúng tôi.

                </p>

            </div>



            <!-- =====================================================
                 THÔNG TIN LIÊN HỆ
            ====================================================== -->

            <div class="row g-3 mb-4 text-center">


                <?php if (
                    !empty(
                        $shop['phone']
                    )
                ): ?>

                    <div class="col-md-4">

                        <a
                            class="text-decoration-none"
                            href="tel:<?= htmlspecialchars(
                                preg_replace(
                                    '/[^0-9+]/',
                                    '',
                                    (string) $shop[
                                        'phone'
                                    ]
                                )
                            ) ?>"
                        >

                            <i
                                class="
                                    bi
                                    bi-telephone
                                    me-1
                                "
                            ></i>

                            <?= htmlspecialchars(
                                $shop['phone']
                            ) ?>

                        </a>

                    </div>

                <?php endif; ?>



                <?php if (
                    !empty(
                        $shop['email']
                    )
                ): ?>

                    <div class="col-md-4">

                        <a
                            class="text-decoration-none"
                            href="mailto:<?= htmlspecialchars(
                                $shop['email']
                            ) ?>"
                        >

                            <i
                                class="
                                    bi
                                    bi-envelope
                                    me-1
                                "
                            ></i>

                            <?= htmlspecialchars(
                                $shop['email']
                            ) ?>

                        </a>

                    </div>

                <?php endif; ?>



                <?php if (
                    !empty(
                        $shop['address']
                    )
                ): ?>

                    <div class="col-md-4">

                        <span>

                            <i
                                class="
                                    bi
                                    bi-geo-alt
                                    me-1
                                "
                            ></i>

                            <?= htmlspecialchars(
                                $shop['address']
                            ) ?>

                        </span>

                    </div>

                <?php endif; ?>


            </div>



            <!-- =====================================================
                 THÔNG BÁO
            ====================================================== -->

            <?php if ($successMessage): ?>

                <div
                    class="
                        alert
                        alert-success
                        alert-dismissible
                        fade
                        show
                    "
                >

                    <i
                        class="
                            bi
                            bi-check-circle-fill
                            me-2
                        "
                    ></i>

                    <?= htmlspecialchars(
                        $successMessage
                    ) ?>


                    <button
                        type="button"
                        class="btn-close"
                        data-bs-dismiss="alert"
                    ></button>

                </div>

            <?php endif; ?>



            <?php if ($errorMessage): ?>

                <div
                    class="
                        alert
                        alert-danger
                        alert-dismissible
                        fade
                        show
                    "
                >

                    <?= htmlspecialchars(
                        $errorMessage
                    ) ?>


                    <button
                        type="button"
                        class="btn-close"
                        data-bs-dismiss="alert"
                    ></button>

                </div>

            <?php endif; ?>



            <!-- =====================================================
                 FORM LIÊN HỆ
            ====================================================== -->

            <div class="contact-card">

                <form
                    method="POST"
                    action="<?= BASE_URL ?>/?url=contact/submit"
                >

                    <input
                        type="hidden"
                        name="_token"
                        value="<?= htmlspecialchars(
                            $_SESSION[
                                'csrf_token'
                            ]
                            ?? ''
                        ) ?>"
                    >


                    <div class="row g-3">


                        <!-- HỌ TÊN -->

                        <div class="col-md-6">

                            <label class="form-label">
                                Họ và tên *
                            </label>

                            <input
                                type="text"
                                name="full_name"
                                class="form-control"
                                maxlength="120"
                                required
                            >

                        </div>



                        <!-- PHONE -->

                        <div class="col-md-6">

                            <label class="form-label">
                                Số điện thoại
                            </label>

                            <input
                                type="tel"
                                name="phone"
                                class="form-control"
                                maxlength="20"
                            >

                        </div>



                        <!-- EMAIL -->

                        <div class="col-md-6">

                            <label class="form-label">
                                Email
                            </label>

                            <input
                                type="email"
                                name="email"
                                class="form-control"
                                maxlength="190"
                            >

                        </div>



                        <!-- SUBJECT -->

                        <div class="col-md-6">

                            <label class="form-label">
                                Chủ đề
                            </label>

                            <input
                                type="text"
                                name="subject"
                                class="form-control"
                                maxlength="200"
                            >

                        </div>



                        <!-- MESSAGE -->

                        <div class="col-12">

                            <label class="form-label">
                                Nội dung *
                            </label>

                            <textarea
                                name="message"
                                class="form-control"
                                rows="7"
                                required
                            ></textarea>

                        </div>



                        <!-- SUBMIT -->

                        <div class="col-12">

                            <button
                                class="
                                    btn
                                    btn-primary
                                    btn-lg
                                "
                                type="submit"
                            >

                                <i
                                    class="
                                        bi
                                        bi-send
                                        me-2
                                    "
                                ></i>

                                Gửi liên hệ

                            </button>

                        </div>


                    </div>

                </form>

            </div>



            <!-- =====================================================
                 GOOGLE MAPS
            ====================================================== -->

            <?php if (
                is_valid_google_map_embed_url(
                    $shop[
                        'map_embed_url'
                    ]
                    ?? null
                )
            ): ?>

                <div
                    class="
                        ratio
                        ratio-16x9
                        mt-4
                        rounded
                        overflow-hidden
                    "
                >

                    <iframe
                        src="<?= htmlspecialchars(
                            $shop[
                                'map_embed_url'
                            ]
                        ) ?>"
                        title="Bản đồ <?= htmlspecialchars(
                            $shopName
                        ) ?>"
                        loading="lazy"
                        referrerpolicy="no-referrer-when-downgrade"
                        allowfullscreen
                    ></iframe>

                </div>

            <?php endif; ?>



            <!-- =====================================================
                 MẠNG XÃ HỘI
            ====================================================== -->

            <?php if ($socialLinks): ?>
    <div class="contact-social-wrap">
        <div class="contact-social-title">
            Theo dõi <?= htmlspecialchars($shop['shop_name'] ?? $shop['shop_name'] ?? 'PET SHOP') ?>:
        </div>

        <div class="contact-social-list">
            <?php foreach ($socialLinks as $social): ?>
                <?php
                    $platform = strtolower((string) ($social['platform'] ?? ''));
                    $iconClass = match ($platform) {
                        'facebook'  => 'bi bi-facebook',
                        'zalo'      => 'bi bi-chat-dots-fill',
                        'instagram' => 'bi bi-instagram',
                        'tiktok'    => 'bi bi-tiktok',
                        'youtube'   => 'bi bi-youtube',
                        default     => 'bi bi-link-45deg',
                    };
                ?>

                <a
                    class="contact-social-link"
                    href="<?= htmlspecialchars($social['url']) ?>"
                    target="_blank"
                    rel="noopener noreferrer"
                >
                    <i class="<?= $iconClass ?>"></i>
                    <span><?= htmlspecialchars(ucfirst($platform)) ?></span>
                </a>
            <?php endforeach; ?>
        </div>
    </div>
<?php endif; ?>


        </div>

    </div>


</div>

</section>

</main>


<?php

require BASE_PATH
    . '/app/views/layouts/footer.php';

?>