'use client';
import { Swiper, SwiperSlide } from 'swiper/react';
import { Navigation, Pagination, Autoplay } from 'swiper/modules';

export default function ProductCategories() {
    return (
        <div className="home-product-container my-8">
            <div className="mb-16">
                <a href="">
                    <img src="images/homepage/banner-cate.png" className="block w-full"/>
                </a>
            </div>

            <div className="bg-white rounded-[24px] my-8 p-6">        
                <div className="flex items-center justify-between flex-wrap mb-5 gap-3">
                    <div className="group-title flex items-center">
                        <h2 className="font-600 text-[28px] leading-9 text-[#004BA4] m-0"> PC Render, Edit Video </h2>

                        <p className="m-0">
                            <i className="icons icon-wallet"></i>
                            <span> Trả góp 0% </span>
                        </p>

                        <p className="m-0">
                            <i className="icons icon-truck"></i>
                            <span> Miễn phí giao hàng </span>
                        </p>

                        <p className="m-0">
                            <i className="icons icon-world"></i>
                            <span> Giao hàng toàn quốc </span>
                        </p>

                        <p className="m-0">
                            <i className="icons icon-medal"></i>
                            <span> Bảo hành tận nơi </span>
                        </p>
                    </div>

                    <div className="flex flex-wrap items-center justify-end gap-2 leading-[30px] text-[#0678DB] font-600 text-16">
                        <a href="" className="px-2 rounded-[30px] bg-[#EAF1FF]"> Danh mục cấp 3 </a>
                        <a href="" className="px-2 rounded-[30px] bg-[#EAF1FF]"> HHPC 3D Lumion </a>
                        <a href=""> Xem tất cả <i className="bx bx-chevron-right text-20 align-middle"></i> </a>
                    </div>
                </div>

                <div className="relative z-[1] bg-white relative min-h-[300px] js-product-holder group">
                    <div className="custom-nav hidden">
                        <div className="button-icon swiper-button-prev"></div>
                        <div className="button-icon swiper-button-next"></div>
                    </div>

                    <Swiper
                        modules={[Navigation, Pagination, Autoplay]}
                        spaceBetween={24}
                        slidesPerView={5}
                        loop={true}
                        autoplay={{
                            delay: 3000,
                            disableOnInteraction: false,
                        }}
                        navigation={{
                            prevEl: '.custom-nav .swiper-button-prev',
                            nextEl: '.custom-nav .swiper-button-next',
                        }}
                        breakpoints={{
                            1600: {
                                slidesPerView: 6,
                            },
                        }}                        
                    >
                        <SwiperSlide>    
                            <div className="p-item">
                                <a href="" className="p-img">
                                    <img src="images/product-1.jpg" alt="" width="250" height="250"/>
                                </a>

                                <div className="p-text">
                                    <div className="p-price-group">
                                        <del>52.000.000 đ</del>
                                        <span className="p-discount">-10%</span>
                                        <p className="p-price"> 22.000.000 đ </p>
                                    </div>

                                    <a href="" className="p-name">
                                        <h3> Lorem ipsum dolor sit, amet consectetur adipisicing elit. Suscipit quos obcaecati totam, atque vel </h3>
                                    </a>

                                    <div className="p-btn-group flex items-center justify-between text-16 font-500 leading-[23px]">
                                        <div>
                                            <p className="m-0 text-[#00AD4F] flex items-center gap-1">
                                                <i className="bx bx-check-circle text-18 w-[18px]"></i>
                                                <span> Sẵn hàng </span>
                                            </p>

                                            {/* <p className="m-0 red flex items-center gap-1">
                                                <i className="bx bxs-phone text-18 w-[18px]"></i>
                                                <span> Liên hệ </span>
                                            </p> */}

                                            <p className="m-0 text-[#E16B10] flex items-center gap-1">
                                                <i className="bx bx-gift text-18 w-[18px]"></i>
                                                <span> Quà tặng </span>
                                            </p>
                                        </div>

                                        <button type="button" className="p-btn bx bx-plus bg-btn text-white rounded-full w-9 h-9 text-20" aria-label="Mua"></button>
                                    </div>
                                </div>

                                <div className="p-tooltip hidden">
                                    <div className="bg-white rounded-[20px] overflow-hidden border-2 border-[#EAECF0] shadow-[0px_6px_8px_-2px_#10182814]">
                                        <p className="tooltip-name px-5 py-4 text-white font-600 text-16 leading-[21px] bg-[linear-gradient(180.3deg,#259AFF_-18.56%,_#114CDD_100.92%)] m-0">
                                            [Tặng bàn phím] HHPC ULTRA 7 265K | 32GB DDR5 | NVIDIA RTX 3060 12GB
                                        </p>

                                        <div className="p-4 tooltip-content">
                                            <div className="last:border-0 last:p-0 last:m-0 text-16 border-b border-[#DEE4EC] mb-4 pb-4">
                                                <p className="m-0 flex items-center flex-wrap gap-1">
                                                    <b className="font-600"> Giá bán: </b>
                                                    <b className="font-600 text-[#FF4E2A] text-18"> 48.990.000 đ </b>
                                                    <del className="text-[#A0A5AC] font-300"> 52.000.000 đ </del> 
                                                    <span className="bg-[#FA354A] text-white text-11 px-[6px] leading-[18px] rounded-[20px]"> -6% </span>
                                                </p>

                                                <p className="m-0">
                                                    <b className="font-600"> Bảo hành: </b>
                                                    <span> Theo từng linh kiện </span>
                                                </p>
                                            </div>

                                            <div className="last:mb-0 mb-6 px-1">
                                                <p className="text-16 font-600 flex items-center leading-6 mb-2">
                                                    <i className="icons icon-screen"></i>
                                                    <span> Thông số sản phẩm </span>
                                                </p>

                                                <div className="tooltip-spec">
                                                    <div className="item"> CPU: INTEL CORE i5 13400F up 4.6GHz | 10 CORE | 16 THREAD </div>
                                                    <div className="item"> RAM: DDR4 16GB (1x16G) 3200 MHz </div>
                                                    <div className="item"> VGA: NVIDIA RTX 3060 12GB GDDR6 </div>
                                                </div>
                                            </div>

                                            <div className="rounded-[12px] bg-[linear-gradient(182.15deg,#FFA480_-18.44%,#EB0C23_60.76%)] p-1 pt-2">
                                                <p className="px-2 text-16 font-600 flex items-center leading-5 mb-2 text-white">
                                                    <i className="icons icon-gift"></i>
                                                    <span> Khuyến mại hấp dẫn </span>
                                                </p>

                                                <div className="tooltip-offer rounded-[8px] bg-[#FEF2F2] px-2 py-4">
                                                    <div className="item"> <p><span style={{ color: '#ff0000', fontSize: '12pt' }}><strong>⭐ Bảo Hành Tại Nơi Sử Dụng (Áp Dụng Nội Thành Hà Nội và Hồ Chí Minh)</strong></span></p> </div>
                                                    <div className="item"><p><span style={{ color: '#ff0000', fontSize: '12pt' }}><strong>⭐ Bảo Hành Siêu Tốc 1 Đổi 1 Trong 24h </strong></span></p></div> <div className="item"><p><span style={{ color: '#ff0000', fontSize: '12pt' }}><strong>⭐ Miễn Phí 100% Vận Chuyển Toàn Quốc </strong></span></p></div>
                                                </div>
                                            </div>

                                        </div>
                                    </div>
                                </div>
                            </div>
                        </SwiperSlide>

                        <SwiperSlide> <div className="p-item"><a href="" className="p-img"><img src="images/product-2.jpg" alt="" width="250" height="250" /></a><div className="p-text"><div className="p-price-group"><p className="p-price">22.000.000 đ</p></div><a href="" className="p-name"><h3>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Suscipit quos obcaecati totam, atque vel</h3></a><div className="p-btn-group flex items-center justify-between text-16 font-500 leading-[23px]"><div><p className="m-0 red flex items-center gap-1"><i className="bx bxs-phone text-18 w-[18px]"></i><span>Liên hệ</span></p></div><button type="button" className="p-btn bx bx-plus bg-btn text-white rounded-full w-9 h-9 text-20" aria-label="Mua"></button></div></div><div className="p-tooltip hidden"><div className="bg-white rounded-[20px] overflow-hidden border-2 border-[#EAECF0] shadow-[0px_6px_8px_-2px_#10182814]"><p className="tooltip-name px-5 py-4 text-white font-600 text-16 leading-[21px] bg-[linear-gradient(180.3deg,#259AFF_-18.56%,_#114CDD_100.92%)] m-0">[Tặng bàn phím] HHPC ULTRA 7 265K | 32GB DDR5 | NVIDIA RTX 3060 12GB</p><div className="p-4 tooltip-content"><div className="last:border-0 last:p-0 last:m-0 text-16 border-b border-[#DEE4EC] mb-4 pb-4"><p className="m-0 flex items-center flex-wrap gap-1"><b className="font-600">Giá bán:</b><b className="font-600 text-[#FF4E2A] text-18">48.990.000 đ</b><del className="text-[#A0A5AC] font-300">52.000.000 đ</del><span className="bg-[#FA354A] text-white text-11 px-[6px] leading-[18px] rounded-[20px]">-6%</span></p><p className="m-0"><b className="font-600">Bảo hành:</b><span>Theo từng linh kiện</span></p></div><div className="last:mb-0 mb-6 px-1"><p className="text-16 font-600 flex items-center leading-6 mb-2"><i className="icons icon-screen"></i><span>Thông số sản phẩm</span></p><div className="tooltip-spec"><div className="item">CPU: INTEL CORE i5 13400F up 4.6GHz | 10 CORE | 16 THREAD</div><div className="item">RAM: DDR4 16GB (1x16G) 3200 MHz</div><div className="item">VGA: NVIDIA RTX 3060 12GB GDDR6</div></div></div></div></div></div></div></SwiperSlide> <SwiperSlide><div className="p-item"><a href="" className="p-img"><img src="images/product-3.jpg" alt="" width="250" height="250" /></a><div className="p-text"><div className="p-price-group"><del>52.000.000 đ</del><span className="p-discount">-10%</span><p className="p-price">22.000.000 đ</p></div><a href="" className="p-name"><h3>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Suscipit quos obcaecati totam, atque vel</h3></a><div className="p-btn-group flex items-center justify-between text-16 font-500 leading-[23px]"><div><p className="m-0 red flex items-center gap-1"><i className="bx bxs-phone text-18 w-[18px]"></i><span>Liên hệ</span></p><p className="m-0 text-[#E16B10] flex items-center gap-1"><i className="bx bx-gift text-18 w-[18px]"></i><span>Quà tặng</span></p></div><button type="button" className="p-btn bx bx-plus bg-btn text-white rounded-full w-9 h-9 text-20" aria-label="Mua"></button></div></div><div className="p-tooltip hidden"><div className="bg-white rounded-[20px] overflow-hidden border-2 border-[#EAECF0] shadow-[0px_6px_8px_-2px_#10182814]"><p className="tooltip-name px-5 py-4 text-white font-600 text-16 leading-[21px] bg-[linear-gradient(180.3deg,#259AFF_-18.56%,_#114CDD_100.92%)] m-0">[Tặng bàn phím] HHPC ULTRA 7 265K | 32GB DDR5 | NVIDIA RTX 3060 12GB</p><div className="p-4 tooltip-content"><div className="last:border-0 last:p-0 last:m-0 text-16 border-b border-[#DEE4EC] mb-4 pb-4"><p className="m-0 flex items-center flex-wrap gap-1"><b className="font-600">Giá bán:</b><b className="font-600 text-[#FF4E2A] text-18">48.990.000 đ</b><del className="text-[#A0A5AC] font-300">52.000.000 đ</del><span className="bg-[#FA354A] text-white text-11 px-[6px] leading-[18px] rounded-[20px]">-6%</span></p><p className="m-0"><b className="font-600">Bảo hành:</b><span>Theo từng linh kiện</span></p></div><div className="last:mb-0 mb-6 px-1"><p className="text-16 font-600 flex items-center leading-6 mb-2"><i className="icons icon-screen"></i><span>Thông số sản phẩm</span></p><div className="tooltip-spec"><div className="item">CPU: INTEL CORE i5 13400F up 4.6GHz | 10 CORE | 16 THREAD</div><div className="item">RAM: DDR4 16GB (1x16G) 3200 MHz</div><div className="item">VGA: NVIDIA RTX 3060 12GB GDDR6</div></div></div><div className="rounded-[12px] bg-[linear-gradient(182.15deg,#FFA480_-18.44%,#EB0C23_60.76%)] p-1 pt-2"><p className="px-2 text-16 font-600 flex items-center leading-5 mb-2 text-white"><i className="icons icon-gift"></i><span>Khuyến mại hấp dẫn</span></p><div className="tooltip-offer rounded-[8px] bg-[#FEF2F2] px-2 py-4"><div className="item"><p><span style={{ color:'red',fontSize:'12pt' }}><strong>⭐ Bảo Hành Tại Nơi Sử Dụng (Áp Dụng Nội Thành Hà Nội và Hồ Chí Minh)</strong></span></p></div><div className="item"><p><span style={{ color:'red',fontSize:'12pt' }}><strong>⭐ Bảo Hành Siêu Tốc 1 Đổi 1 Trong 24h</strong></span></p></div><div className="item"><p><span style={{ color:'red',fontSize:'12pt' }}><strong>⭐ Miễn Phí 100% Vận Chuyển Toàn Quốc</strong></span></p></div></div></div></div></div></div></div></SwiperSlide> <SwiperSlide><div className="p-item"><a href="" className="p-img"><img src="images/product-4.jpg" alt="" width="250" height="250" /></a><div className="p-text"><div className="p-price-group"><del>52.000.000 đ</del><span className="p-discount">-10%</span><p className="p-price">22.000.000 đ</p></div><a href="" className="p-name"><h3>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Suscipit quos obcaecati totam, atque vel</h3></a><div className="p-btn-group flex items-center justify-between text-16 font-500 leading-[23px]"><div><p className="m-0 text-[#00AD4F] flex items-center gap-1"><i className="bx bx-check-circle text-18 w-[18px]"></i><span>Sẵn hàng</span></p></div><button type="button" className="p-btn bx bx-plus bg-btn text-white rounded-full w-9 h-9 text-20" aria-label="Mua"></button></div></div><div className="p-tooltip hidden"><div className="bg-white rounded-[20px] overflow-hidden border-2 border-[#EAECF0] shadow-[0px_6px_8px_-2px_#10182814]"><p className="tooltip-name px-5 py-4 text-white font-600 text-16 leading-[21px] bg-[linear-gradient(180.3deg,#259AFF_-18.56%,_#114CDD_100.92%)] m-0">[Tặng bàn phím] HHPC ULTRA 7 265K | 32GB DDR5 | NVIDIA RTX 3060 12GB</p><div className="p-4 tooltip-content"><div className="last:border-0 last:p-0 last:m-0 text-16 border-b border-[#DEE4EC] mb-4 pb-4"><p className="m-0 flex items-center flex-wrap gap-1"><b className="font-600">Giá bán:</b><b className="font-600 text-[#FF4E2A] text-18">48.990.000 đ</b><del className="text-[#A0A5AC] font-300">52.000.000 đ</del><span className="bg-[#FA354A] text-white text-11 px-[6px] leading-[18px] rounded-[20px]">-6%</span></p><p className="m-0"><b className="font-600">Bảo hành:</b><span>Theo từng linh kiện</span></p></div></div></div></div></div></SwiperSlide> <SwiperSlide><div className="p-item"><a href="" className="p-img"><img src="images/product-5.jpg" alt="" width="250" height="250" /></a><div className="p-text"><div className="p-price-group"><p className="p-price">22.000.000 đ</p></div><a href="" className="p-name"><h3>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Suscipit quos obcaecati totam, atque vel</h3></a><div className="p-btn-group flex items-center justify-between text-16 font-500 leading-[23px]"><div><p className="m-0 text-[#00AD4F] flex items-center gap-1"><i className="bx bx-check-circle text-18 w-[18px]"></i><span>Sẵn hàng</span></p></div><button type="button" className="p-btn bx bx-plus bg-btn text-white rounded-full w-9 h-9 text-20" aria-label="Mua"></button></div></div><div className="p-tooltip hidden"><div className="bg-white rounded-[20px] overflow-hidden border-2 border-[#EAECF0] shadow-[0px_6px_8px_-2px_#10182814]"><p className="tooltip-name px-5 py-4 text-white font-600 text-16 leading-[21px] bg-[linear-gradient(180.3deg,#259AFF_-18.56%,_#114CDD_100.92%)] m-0">[Tặng bàn phím] HHPC ULTRA 7 265K | 32GB DDR5 | NVIDIA RTX 3060 12GB</p><div className="p-4 tooltip-content"><div className="last:border-0 last:p-0 last:m-0 text-16 border-b border-[#DEE4EC] mb-4 pb-4"><p className="m-0 flex items-center flex-wrap gap-1"><b className="font-600">Giá bán:</b><b className="font-600 text-[#FF4E2A] text-18">48.990.000 đ</b></p><p className="m-0"><b className="font-600">Bảo hành:</b><span>Theo từng linh kiện</span></p></div></div></div></div></div></SwiperSlide> <SwiperSlide><div className="p-item"><a href="" className="p-img"><img src="images/product-7.jpg" alt="" width="250" height="250" /></a><div className="p-text"><div className="p-price-group"><del>52.000.000 đ</del><span className="p-discount">-10%</span><p className="p-price">22.000.000 đ</p></div><a href="" className="p-name"><h3>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Suscipit quos obcaecati totam, atque vel</h3></a><div className="p-btn-group flex items-center justify-between text-16 font-500 leading-[23px]"><div><p className="m-0 red flex items-center gap-1"><i className="bx bxs-phone text-18 w-[18px]"></i><span>Liên hệ</span></p><p className="m-0 text-[#E16B10] flex items-center gap-1"><i className="bx bx-gift text-18 w-[18px]"></i><span>Quà tặng</span></p></div><button type="button" className="p-btn bx bx-plus bg-btn text-white rounded-full w-9 h-9 text-20" aria-label="Mua"></button></div></div><div className="p-tooltip hidden"><div className="bg-white rounded-[20px] overflow-hidden border-2 border-[#EAECF0] shadow-[0px_6px_8px_-2px_#10182814]"><p className="tooltip-name px-5 py-4 text-white font-600 text-16 leading-[21px] bg-[linear-gradient(180.3deg,#259AFF_-18.56%,_#114CDD_100.92%)] m-0">[Tặng bàn phím] HHPC ULTRA 7 265K | 32GB DDR5 | NVIDIA RTX 3060 12GB</p><div className="p-4 tooltip-content"><div className="last:border-0 last:p-0 last:m-0 text-16 border-b border-[#DEE4EC] mb-4 pb-4"><p className="m-0 flex items-center flex-wrap gap-1"><b className="font-600">Giá bán:</b><b className="font-600 text-[#FF4E2A] text-18">48.990.000 đ</b><del className="text-[#A0A5AC] font-300">52.000.000 đ</del><span className="bg-[#FA354A] text-white text-11 px-[6px] leading-[18px] rounded-[20px]">-6%</span></p><p className="m-0"><b className="font-600">Bảo hành:</b><span>Theo từng linh kiện</span></p></div><div className="last:mb-0 mb-6 px-1"><p className="text-16 font-600 flex items-center leading-6 mb-2"><i className="icons icon-screen"></i><span>Thông số sản phẩm</span></p><div className="tooltip-spec"><div className="item">CPU: INTEL CORE i5 13400F up 4.6GHz | 10 CORE | 16 THREAD</div><div className="item">RAM: DDR4 16GB (1x16G) 3200 MHz</div><div className="item">VGA: NVIDIA RTX 3060 12GB GDDR6</div></div></div><div className="rounded-[12px] bg-[linear-gradient(182.15deg,#FFA480_-18.44%,#EB0C23_60.76%)] p-1 pt-2"><p className="px-2 text-16 font-600 flex items-center leading-5 mb-2 text-white"><i className="icons icon-gift"></i><span>Khuyến mại hấp dẫn</span></p><div className="tooltip-offer rounded-[8px] bg-[#FEF2F2] px-2 py-4"><div className="item"><p><span style={{ color:'red',fontSize:'12pt' }}><strong>⭐ Bảo Hành Tại Nơi Sử Dụng (Áp Dụng Nội Thành Hà Nội và Hồ Chí Minh)</strong></span></p></div><div className="item"><p><span style={{ color:'red',fontSize:'12pt' }}><strong>⭐ Bảo Hành Siêu Tốc 1 Đổi 1 Trong 24h</strong></span></p></div><div className="item"><p><span style={{ color:'red',fontSize:'12pt' }}><strong>⭐ Miễn Phí 100% Vận Chuyển Toàn Quốc</strong></span></p></div></div></div></div></div></div></div></SwiperSlide> <SwiperSlide><div className="p-item"><a href="" className="p-img"><img src="images/product-6.jpg" alt="" width="250" height="250" /></a><div className="p-text"><div className="p-price-group"><del>52.000.000 đ</del><span className="p-discount">-10%</span><p className="p-price">22.000.000 đ</p></div><a href="" className="p-name"><h3>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Suscipit quos obcaecati totam, atque vel</h3></a><div className="p-btn-group flex items-center justify-between text-16 font-500 leading-[23px]"><div><p className="m-0 text-[#00AD4F] flex items-center gap-1"><i className="bx bx-check-circle text-18 w-[18px]"></i><span>Sẵn hàng</span></p><p className="m-0 text-[#E16B10] flex items-center gap-1"><i className="bx bx-gift text-18 w-[18px]"></i><span>Quà tặng</span></p></div><button type="button" className="p-btn bx bx-plus bg-btn text-white rounded-full w-9 h-9 text-20" aria-label="Mua"></button></div></div><div className="p-tooltip hidden"><div className="bg-white rounded-[20px] overflow-hidden border-2 border-[#EAECF0] shadow-[0px_6px_8px_-2px_#10182814]"><p className="tooltip-name px-5 py-4 text-white font-600 text-16 leading-[21px] bg-[linear-gradient(180.3deg,#259AFF_-18.56%,_#114CDD_100.92%)] m-0">[Tặng bàn phím] HHPC ULTRA 7 265K | 32GB DDR5 | NVIDIA RTX 3060 12GB</p><div className="p-4 tooltip-content"><div className="last:border-0 last:p-0 last:m-0 text-16 border-b border-[#DEE4EC] mb-4 pb-4"><p className="m-0 flex items-center flex-wrap gap-1"><b className="font-600">Giá bán:</b><b className="font-600 text-[#FF4E2A] text-18">48.990.000 đ</b><del className="text-[#A0A5AC] font-300">52.000.000 đ</del><span className="bg-[#FA354A] text-white text-11 px-[6px] leading-[18px] rounded-[20px]">-6%</span></p><p className="m-0"><b className="font-600">Bảo hành:</b><span>Theo từng linh kiện</span></p></div><div className="last:mb-0 mb-6 px-1"><p className="text-16 font-600 flex items-center leading-6 mb-2"><i className="icons icon-screen"></i><span>Thông số sản phẩm</span></p><div className="tooltip-spec"><div className="item">CPU: INTEL CORE i5 13400F up 4.6GHz | 10 CORE | 16 THREAD</div><div className="item">RAM: DDR4 16GB (1x16G) 3200 MHz</div><div className="item">VGA: NVIDIA RTX 3060 12GB GDDR6</div></div></div><div className="rounded-[12px] bg-[linear-gradient(182.15deg,#FFA480_-18.44%,#EB0C23_60.76%)] p-1 pt-2"><p className="px-2 text-16 font-600 flex items-center leading-5 mb-2 text-white"><i className="icons icon-gift"></i><span>Khuyến mại hấp dẫn</span></p><div className="tooltip-offer rounded-[8px] bg-[#FEF2F2] px-2 py-4"><div className="item"><p><span style={{ color:'red',fontSize:'12pt' }}><strong>⭐ Bảo Hành Tại Nơi Sử Dụng (Áp Dụng Nội Thành Hà Nội và Hồ Chí Minh)</strong></span></p></div><div className="item"><p><span style={{ color:'red',fontSize:'12pt' }}><strong>⭐ Bảo Hành Siêu Tốc 1 Đổi 1 Trong 24h</strong></span></p></div><div className="item"><p><span style={{ color:'red',fontSize:'12pt' }}><strong>⭐ Miễn Phí 100% Vận Chuyển Toàn Quốc</strong></span></p></div></div></div></div></div></div></div></SwiperSlide>
                    </Swiper>
                </div>
            </div>
        </div>
    )
}