<?php

$pageTitle =
    $product['name']
    . ' - PET SPA';


$pageDescription =
    $product['short_description']
    ?: 'Chi tiết sản phẩm tại PET SPA';


$pageScript =
    'product.js';


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


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


$hasSale =
    $product['sale_price'] !== null

    && (float)
    $product['sale_price']
    < (float)
    $product['price'];


$currentPrice =
    $hasSale
        ? (float)
        $product['sale_price']
        : (float)
        $product['price'];


$mainImage = null;


if (
    !empty(
        $product['featured_image']
    )
) {

    $mainImage =
        BASE_URL
        . '/'
        . ltrim(
            $product['featured_image'],
            '/'
        );
}

?>


<main>

    <section class="section">

        <div class="container">


            <!-- BREADCRUMB -->

            <nav aria-label="breadcrumb">

                <ol class="breadcrumb">

                    <li class="breadcrumb-item">

                        <a href="<?= BASE_URL ?>/">
                            Trang chủ
                        </a>

                    </li>


                    <li class="breadcrumb-item">

                        <a
                            href="<?= BASE_URL ?>/?url=products"
                        >
                            Sản phẩm
                        </a>

                    </li>


                    <li
                        class="breadcrumb-item active"
                    >

                        <?= htmlspecialchars(
                            $product['name']
                        ) ?>

                    </li>

                </ol>

            </nav>


            <div
                class="row g-5 mt-2"
            >


                <!-- ==================================================
                     IMAGE
                =================================================== -->

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

                    <div
                        class="product-detail-main-image"
                    >

                        <?php if ($mainImage): ?>

                            <img
                                id="mainProductImage"
                                src="<?= htmlspecialchars(
                                    $mainImage
                                ) ?>"
                                alt="<?= htmlspecialchars(
                                    $product['name']
                                ) ?>"
                            >

                        <?php else: ?>

                            <div
                                class="product-detail-placeholder"
                            >
                                🐾
                            </div>

                        <?php endif; ?>

                    </div>


                    <?php if (
                        !empty(
                            $productImages
                        )
                    ): ?>

                        <div
                            class="product-thumbnails"
                        >


                            <?php if ($mainImage): ?>

                                <button
                                    type="button"
                                    class="product-thumbnail active"
                                    data-image="<?= htmlspecialchars(
                                        $mainImage
                                    ) ?>"
                                >

                                    <img
                                        src="<?= htmlspecialchars(
                                            $mainImage
                                        ) ?>"
                                        alt=""
                                    >

                                </button>

                            <?php endif; ?>


                            <?php foreach (
                                $productImages
                                as $image
                            ): ?>


                                <?php

                                $thumbnailUrl =
                                    BASE_URL
                                    . '/'
                                    . ltrim(
                                        $image[
                                            'image_path'
                                        ],
                                        '/'
                                    );

                                ?>


                                <button
                                    type="button"
                                    class="product-thumbnail"
                                    data-image="<?= htmlspecialchars(
                                        $thumbnailUrl
                                    ) ?>"
                                >

                                    <img
                                        src="<?= htmlspecialchars(
                                            $thumbnailUrl
                                        ) ?>"
                                        alt=""
                                    >

                                </button>

                            <?php endforeach; ?>


                        </div>

                    <?php endif; ?>

                </div>


                <!-- ==================================================
                     PRODUCT INFO
                =================================================== -->

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

                    <div
                        class="product-detail-category"
                    >

                        <?= htmlspecialchars(
                            $product[
                                'category_name'
                            ]
                        ) ?>

                    </div>


                    <h1
                        class="product-detail-title"
                    >

                        <?= htmlspecialchars(
                            $product['name']
                        ) ?>

                    </h1>


                    <?php if (
                        !empty(
                            $product['brand']
                        )
                    ): ?>

                        <p class="text-muted">

                            Thương hiệu:

                            <strong>

                                <?= htmlspecialchars(
                                    $product['brand']
                                ) ?>

                            </strong>

                        </p>

                    <?php endif; ?>


                    <div
                        class="product-detail-price"
                    >

                        <span>

                            <?= number_format(
                                $currentPrice,
                                0,
                                ',',
                                '.'
                            ) ?>đ

                        </span>


                        <?php if ($hasSale): ?>

                            <del>

                                <?= number_format(
                                    (float)
                                    $product['price'],
                                    0,
                                    ',',
                                    '.'
                                ) ?>đ

                            </del>

                        <?php endif; ?>

                    </div>


                    <?php if (
                        !empty(
                            $product[
                                'short_description'
                            ]
                        )
                    ): ?>

                        <p
                            class="product-detail-short-description"
                        >

                            <?= nl2br(
                                htmlspecialchars(
                                    $product[
                                        'short_description'
                                    ]
                                )
                            ) ?>

                        </p>

                    <?php endif; ?>


                    <div
                        class="product-meta"
                    >

                        <?php if (
                            !empty(
                                $product['sku']
                            )
                        ): ?>

                            <div>

                                <span>
                                    Mã sản phẩm
                                </span>

                                <strong>

                                    <?= htmlspecialchars(
                                        $product['sku']
                                    ) ?>

                                </strong>

                            </div>

                        <?php endif; ?>


                        <div>

                            <span>
                                Dành cho
                            </span>

                            <strong>

                                <?php

                                echo match (
                                    $product[
                                        'pet_target'
                                    ]
                                ) {

                                    'dog' =>
                                        '🐶 Chó',

                                    'cat' =>
                                        '🐱 Mèo',

                                    default =>
                                        '🐶🐱 Chó & Mèo'
                                };

                                ?>

                            </strong>

                        </div>


                        <div>

                            <span>
                                Tình trạng
                            </span>


                            <?php if (
                                (int)
                                $product[
                                    'stock_quantity'
                                ] > 0
                            ): ?>

                                <strong
                                    class="text-success"
                                >
                                    Còn hàng
                                </strong>

                            <?php else: ?>

                                <strong
                                    class="text-danger"
                                >
                                    Hết hàng
                                </strong>

                            <?php endif; ?>

                        </div>

                    </div>


                    <?php if (
                        (int)
                        $product['stock_quantity']
                        > 0
                    ): ?>

                        <div
                            class="alert alert-light border mt-4"
                        >

                            <i
                                class="bi bi-box-seam me-2"
                            ></i>

                            Hiện còn

                            <strong>

                                <?= (int)
                                    $product[
                                        'stock_quantity'
                                    ]
                                ?>

                            </strong>

                            sản phẩm.

                        </div>

                    <?php endif; ?>


                    <?php if (
    (int)
    $product['stock_quantity']
    > 0

    && $product['status']
    === 'active'
): ?>

    <form
        action="<?= BASE_URL ?>/?url=cart/add"
        method="POST"
        class="add-cart-form mt-4"
    >

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

        <input
            type="hidden"
            name="product_id"
            value="<?= (int)
                $product['id']
            ?>"
        >


        <label
            class="form-label fw-semibold"
        >
            Số lượng
        </label>


        <div
            class="d-flex gap-3 align-items-center flex-wrap"
        >

            <div
                class="quantity-control"
            >

                <button
                    type="button"
                    class="quantity-minus"
                >
                    −
                </button>


                <input
                    type="number"
                    name="quantity"
                    value="1"
                    min="1"
                    max="<?= (int)
                        $product[
                            'stock_quantity'
                        ]
                    ?>"
                >


                <button
                    type="button"
                    class="quantity-plus"
                >
                    +
                </button>

            </div>


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

                <i
                    class="bi bi-bag-plus me-2"
                ></i>

                Thêm vào giỏ

            </button>

        </div>

    </form>

<?php else: ?>

    <button
        type="button"
        class="btn btn-secondary btn-lg w-100 mt-4"
        disabled
    >
        Sản phẩm đã hết hàng
    </button>

<?php endif; ?>


                    <div
                        class="product-benefits mt-4"
                    >

                        <div>

                            <i class="bi bi-truck"></i>

                            <span>
                                Giao hàng tiện lợi
                            </span>

                        </div>


                        <div>

                            <i
                                class="bi bi-shield-check"
                            ></i>

                            <span>
                                Thông tin sản phẩm rõ ràng
                            </span>

                        </div>


                        <div>

                            <i
                                class="bi bi-chat-heart"
                            ></i>

                            <span>
                                Hỗ trợ khách hàng
                            </span>

                        </div>

                    </div>

                </div>

            </div>


            <!-- ==================================================
                 DESCRIPTION
            =================================================== -->

            <div
                class="product-description-section"
            >

                <h2>
                    Mô tả sản phẩm
                </h2>


                <div
                    class="product-description-content"
                >

                    <?php if (
                        !empty(
                            $product[
                                'description'
                            ]
                        )
                    ): ?>

                        <?= nl2br(
                            htmlspecialchars(
                                $product[
                                    'description'
                                ]
                            )
                        ) ?>

                    <?php else: ?>

                        <p class="text-muted">

                            Sản phẩm chưa có mô tả chi tiết.

                        </p>

                    <?php endif; ?>

                </div>

            </div>


            <!-- ==================================================
                 RELATED PRODUCTS
            =================================================== -->
<?php

require BASE_PATH
    . '/app/views/products/reviews-section.php';

?>
            <?php if (
                !empty(
                    $relatedProducts
                )
            ): ?>

                <section class="mt-5">

                    <h2 class="mb-4">

                        Sản phẩm liên quan

                    </h2>


                    <div class="row g-4">


                        <?php foreach (
                            $relatedProducts
                            as $related
                        ): ?>


                            <?php

                            $relatedSale =
                                $related[
                                    'sale_price'
                                ] !== null

                                && (float)
                                $related[
                                    'sale_price'
                                ]

                                < (float)
                                $related[
                                    'price'
                                ];


                            $relatedPrice =
                                $relatedSale
                                    ? (float)
                                    $related[
                                        'sale_price'
                                    ]

                                    : (float)
                                    $related[
                                        'price'
                                    ];

                            ?>


                            <div
                                class="col-6 col-lg-3"
                            >

                                <article
                                    class="product-card h-100"
                                >

                                    <a
                                        href="<?= BASE_URL ?>/?url=product&slug=<?= urlencode(
                                            $related['slug']
                                        ) ?>"
                                        class="product-card-image"
                                    >

                                        <?php if (
                                            !empty(
                                                $related[
                                                    'featured_image'
                                                ]
                                            )
                                        ): ?>

                                            <img
                                                src="<?= BASE_URL ?>/<?= htmlspecialchars(
                                                    ltrim(
                                                        $related[
                                                            'featured_image'
                                                        ],
                                                        '/'
                                                    )
                                                ) ?>"
                                                alt="<?= htmlspecialchars(
                                                    $related['name']
                                                ) ?>"
                                            >

                                        <?php else: ?>

                                            <div
                                                class="product-placeholder"
                                            >
                                                🐾
                                            </div>

                                        <?php endif; ?>

                                    </a>


                                    <div
                                        class="product-card-body"
                                    >

                                        <h3
                                            class="product-title"
                                        >

                                            <a
                                                href="<?= BASE_URL ?>/?url=product&slug=<?= urlencode(
                                                    $related['slug']
                                                ) ?>"
                                            >

                                                <?= htmlspecialchars(
                                                    $related[
                                                        'name'
                                                    ]
                                                ) ?>

                                            </a>

                                        </h3>


                                        <div
                                            class="product-price"
                                        >

                                            <span
                                                class="current-price"
                                            >

                                                <?= number_format(
                                                    $relatedPrice,
                                                    0,
                                                    ',',
                                                    '.'
                                                ) ?>đ

                                            </span>

                                        </div>

                                    </div>

                                </article>

                            </div>

                        <?php endforeach; ?>


                    </div>

                </section>

            <?php endif; ?>


        </div>

    </section>

</main>


<?php

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

?>