<header class="header-middle style-two bg-color-neutral">
    <div class="container container-lg">
        <nav class="header-inner flex-between">
            <div class="logo"><a href="index.html" class="link"><img src="views/assets/images/logo.jpg"
                        alt="Logo"></a></div>
            <div class="flex items-center md:gap-[16px] max-sm:gap-0">
                <div class="select-dropdown-for-home-two xl:hidden block">
                    <ul class="header-top__right style-two flex items-center flex-wrap">
                        <li class="on-hover-item border-right-item border-right-item-sm-space has-submenu arrow-white">
                            <a href="javascript:void(0)" class="selected-text text-heading text-sm py-8">Eng</a>
                            <ul
                                class="selectable-text-list on-hover-dropdown common-dropdown common-dropdown--sm max-h-200 scroll-sm !px-0 py-8">
                                <li><a href="javascript:void(0)"
                                        class="hover-bg-gray-100 text-gray-500 text-xs py-6 px-16 flex items-center gap-8 rounded-none"><img
                                            src="views/assets/images/flag1.png" alt="Image"
                                            class="w-16 h-12 rounded-4 border border-gray-100"> English</a></li>
                                <li><a href="javascript:void(0)"
                                        class="hover-bg-gray-100 text-gray-500 text-xs py-6 px-16 flex items-center gap-8 rounded-none"><img
                                            src="views/assets/images/flag2.png" alt="Image"
                                            class="w-16 h-12 rounded-4 border border-gray-100"> Japan</a></li>
                                <li><a href="javascript:void(0)"
                                        class="hover-bg-gray-100 text-gray-500 text-xs py-6 px-16 flex items-center gap-8 rounded-none"><img
                                            src="views/assets/images/flag3.png" alt="Image"
                                            class="w-16 h-12 rounded-4 border border-gray-100"> French</a></li>
                                <li><a href="javascript:void(0)"
                                        class="hover-bg-gray-100 text-gray-500 text-xs py-6 px-16 flex items-center gap-8 rounded-none"><img
                                            src="views/assets/images/flag4.png" alt="Image"
                                            class="w-16 h-12 rounded-4 border border-gray-100"> Germany</a></li>
                                <li><a href="javascript:void(0)"
                                        class="hover-bg-gray-100 text-gray-500 text-xs py-6 px-16 flex items-center gap-8 rounded-none"><img
                                            src="views/assets/images/flag6.png" alt="Image"
                                            class="w-16 h-12 rounded-4 border border-gray-100"> Bangladesh</a></li>
                                <li><a href="javascript:void(0)"
                                        class="hover-bg-gray-100 text-gray-500 text-xs py-6 px-16 flex items-center gap-8 rounded-none"><img
                                            src="views/assets/images/flag5.png" alt="Image"
                                            class="w-16 h-12 rounded-4 border border-gray-100"> South Korea</a></li>
                            </ul>
                        </li>
                        <li class="on-hover-item border-right-item border-right-item-sm-space has-submenu arrow-white">
                            <a href="javascript:void(0)" class="selected-text text-heading text-sm py-8">USD</a>
                            <ul
                                class="selectable-text-list on-hover-dropdown common-dropdown common-dropdown--sm max-h-200 scroll-sm px-0 py-8">
                                <li><a href="javascript:void(0)"
                                        class="hover-bg-gray-100 text-gray-500 text-xs py-6 px-16 flex items-center gap-8 rounded-none"><img
                                            src="views/assets/images/flag1.png" alt="Image"
                                            class="w-16 h-12 rounded-4 border border-gray-100"> USD</a></li>
                                <li><a href="javascript:void(0)"
                                        class="hover-bg-gray-100 text-gray-500 text-xs py-6 px-16 flex items-center gap-8 rounded-none"><img
                                            src="views/assets/images/flag2.png" alt="Image"
                                            class="w-16 h-12 rounded-4 border border-gray-100"> Yen</a></li>
                                <li><a href="javascript:void(0)"
                                        class="hover-bg-gray-100 text-gray-500 text-xs py-6 px-16 flex items-center gap-8 rounded-none"><img
                                            src="views/assets/images/flag3.png" alt="Image"
                                            class="w-16 h-12 rounded-4 border border-gray-100"> Franc</a></li>
                                <li><a href="javascript:void(0)"
                                        class="hover-bg-gray-100 text-gray-500 text-xs py-6 px-16 flex items-center gap-8 rounded-none"><img
                                            src="views/assets/images/flag4.png" alt="Image"
                                            class="w-16 h-12 rounded-4 border border-gray-100"> EURO</a></li>
                                <li><a href="javascript:void(0)"
                                        class="hover-bg-gray-100 text-gray-500 text-xs py-6 px-16 flex items-center gap-8 rounded-none"><img
                                            src="views/assets/images/flag6.png" alt="Image"
                                            class="w-16 h-12 rounded-4 border border-gray-100"> BDT</a></li>
                                <li><a href="javascript:void(0)"
                                        class="hover-bg-gray-100 text-gray-500 text-xs py-6 px-16 flex items-center gap-8 rounded-none"><img
                                            src="views/assets/images/flag5.png" alt="Image"
                                            class="w-16 h-12 rounded-4 border border-gray-100"> WON</a></li>
                            </ul>
                        </li>
                    </ul>
                </div>
                <form action="#" class="flex items-center flex-wrap form-location-wrapper">
                    <div class="search-category style-two h-48 search-form md:flex hidden"><select
                            class="js-example-basic-single border-gray-200 border-r-0 rounded-none border-0"
                            name="state">
                            <option value="1" selected="selected" disabled="disabled">All Categories</option>
                            <option value="1">Grocery</option>
                            <option value="1">Breakfast & Dairy</option>
                            <option value="1">Vegetables</option>
                            <option value="1">Milks and Dairies</option>
                            <option value="1">Pet Foods & Toy</option>
                            <option value="1">Breads & Bakery</option>
                            <option value="1">Fresh Seafood</option>
                            <option value="1">Fronzen Foods</option>
                            <option value="1">Noodles & Rice</option>
                            <option value="1">Ice Cream</option>
                        </select>
                        <div class="search-form__wrapper relative"><input
                                class="search-form__input common-input py-13 ps-16 pe-18 rounded-none border-0"
                                placeholder="Search for a product or brand"></div><button type="submit"
                            class="bg-main-two-600 items-center justify-center text-xl text-white flex-shrink-0 w-48 hover-bg-main-two-700 xl:flex hidden"><i
                                class="ph ph-magnifying-glass"></i></button>
                    </div>
                </form>
            </div>
            <div class="header-right items-center xl:block hidden">
                <div class="header-two-activities flex items-center flex-wrap gap-32"><button type="button"
                        class="items-center search-icon xl:hidden flex gap-4 item-hover-two"><span
                            class="text-2xl text-white flex relative item-hover__text"><i
                                class="ph ph-magnifying-glass"></i></span></button> <a href="account.php"
                        class="flex items-center flex-col gap-8 item-hover-two"><span
                            class="text-2xl text-white flex relative item-hover__text"><i class="ph ph-user"></i>
                        </span><span class="text-md text-white item-hover__text hidden xl:flex">Profile</span>
                    </a><a href="wishlist.html" class="flex items-center flex-col gap-8 item-hover-two"><span
                            class="text-2xl text-white flex relative me-6 mt-6 item-hover__text"><i
                                class="ph ph-heart"></i> <span
                                class="w-16 h-16 flex items-center justify-center rounded-[50%] bg-main-two-600 text-white text-xs absolute top-n6 end-n4">2</span>
                        </span><span class="text-md text-white item-hover__text hidden xl:flex">Wishlist</span>
                    </a><a href="cart.html" class="flex items-center flex-col gap-8 item-hover-two"><span
                            class="text-2xl text-white flex relative me-6 mt-6 item-hover__text"><i
                                class="ph-fill ph-shuffle"></i> <span
                                class="w-16 h-16 flex items-center justify-center rounded-[50%] bg-main-two-600 text-white text-xs absolute top-n6 end-n4">2</span>
                        </span><span class="text-md text-white item-hover__text hidden xl:flex">Compare</span>
                    </a><a href="cart.html" class="flex items-center flex-col gap-8 item-hover-two"><span
                            class="text-2xl text-white flex relative me-6 mt-6 item-hover__text"><i
                                class="ph ph-shopping-cart-simple"></i> <span
                                class="w-16 h-16 flex items-center justify-center rounded-[50%] bg-main-two-600 text-white text-xs absolute top-n6 end-n4">2</span>
                        </span><span class="text-md text-white item-hover__text hidden xl:flex">Cart</span></a>
                </div>
            </div>
        </nav>
    </div>
</header>