<nav class="offcanvas offcanvas-start" id="navbarNav" tabindex="-1" aria-labelledby="navbarNavLabel">
        <div class="offcanvas-header py-3">
            <h5 class="offcanvas-title" id="navbarNavLabel">Browse AsiaGolf</h5>
            <button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button>
        </div>
        <div class="offcanvas-body pt-0 pb-3">

            <!-- Navbar nav -->
            <div class="accordion" id="navigation">

                <!-- Categories collapse visible on screens < 992px wide (lg breakpoint) -->
                <div class="accordion-item border-0 d-lg-none">
                    <div class="accordion-header" id="headingCategories">
                        <button type="button" class="accordion-button animate-underline fw-medium collapsed py-2"
                            data-bs-toggle="collapse" data-bs-target="#categoriesMenu" aria-expanded="false"
                            aria-controls="categoriesMenu">
                            <i class="ci-grid fs-lg me-2"></i>
                            <span class="d-block animate-target py-1">Categories</span>
                        </button>
                    </div>
                    <div class="accordion-collapse collapse" id="categoriesMenu" aria-labelledby="headingCategories"
                        data-bs-parent="#navigation">
                        <div class="accordion-body pb-3">
                            <div class="dropdown-menu show position-static d-flex flex-column gap-4 shadow-none p-4">
                                <div>
                                    <div class="h6">Bakery &amp; bread</div>
                                    <ul class="nav flex-column gap-2 mt-n2">
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Shop all</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Bread</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Pastries</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Bakery cookies</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Cupcakes</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Buns &amp; rolls</a>
                                        </li>
                                    </ul>
                                    <div class="h6 pt-4">Meat products</div>
                                    <ul class="nav flex-column gap-2 mt-n2">
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Shop all</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Fresh meat</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Processed meat</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Seafood</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Poultry products</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Prepared meat</a>
                                        </li>
                                    </ul>
                                </div>
                                <div>
                                    <div class="h6">Vegetables</div>
                                    <ul class="nav flex-column gap-2 mt-n2">
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Shop all</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Leafy greens</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Root vegetables</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Allium vegetables</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Peppers and tomatoes</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Cruciferous</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Seasonal squashes</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Beans, peas &amp; lentils</a>
                                        </li>
                                    </ul>
                                    <div class="h6 pt-4">Sauces and ketchup</div>
                                    <ul class="nav flex-column gap-2 mt-n2">
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Shop all</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Tomato-based sauces</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Salad dressing</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Hot sauces</a>
                                        </li>
                                    </ul>
                                </div>
                                <div>
                                    <div class="h6">Fresh fruits</div>
                                    <ul class="nav flex-column gap-2 mt-n2">
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Shop all</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Citrus fruits</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Berries</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Tropical fruits</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Stone fruits</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Exotic fruits</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Melons</a>
                                        </li>
                                    </ul>
                                    <div class="h6 pt-4">Italian dinner</div>
                                    <ul class="nav flex-column gap-2 mt-n2">
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Shop all</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Pasta &amp; sauces</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Italian cheese</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Italian meats</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Desserts &amp; beverages</a>
                                        </li>
                                    </ul>
                                </div>
                                <div>
                                    <div class="h6">Beverages</div>
                                    <ul class="nav flex-column gap-2 mt-n2">
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Shop all</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Soft drinks</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Juices</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Sports &amp; energy drinks</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Tea and coffee</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Alcoholic beverages</a>
                                        </li>
                                    </ul>
                                    <div class="h6 pt-4">Dairy &amp; eggs</div>
                                    <ul class="nav flex-column gap-2 mt-n2">
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Shop all</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Chees</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Milk &amp; yogurt</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Sour cream</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Eggs</a>
                                        </li>
                                        <li class="d-flex w-100 pt-1">
                                            <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                href="{{ route('second', ['shop', 'catalog-grocery']) }}">Butter &amp; margarine</a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Rest of the menu -->
                <div class="accordion-item border-0">
                    <div class="accordion-header" id="headingHome">
                        <button type="button" class="accordion-button animate-underline fw-medium collapsed py-2"
                            data-bs-toggle="collapse" data-bs-target="#home" aria-expanded="false" aria-controls="home">
                            <span class="d-block animate-target py-1">Home</span>
                        </button>
                    </div>
                    <div class="accordion-collapse collapse" id="home" aria-labelledby="headingHome"
                        data-bs-parent="#navigation">
                        <div class="accordion-body pb-3">
                            <ul class="dropdown-menu show position-static shadow-none">
                                <li class="hover-effect-opacity px-2 mx-n2">
                                    <a class="dropdown-item d-block mb-0" href="{{ route('second', ['home', 'electronics']) }}">
                                        <span class="fw-medium">Electronics Store</span>
                                        <span class="d-block fs-xs text-body-secondary">Megamenu + Hero slider</span>
                                    </a>
                                </li>
                                <li class="hover-effect-opacity px-2 mx-n2">
                                    <a class="dropdown-item d-block mb-0" href="{{ route('second', ['home', 'fashion-v1']) }}">
                                        <span class="fw-medium">Fashion Store v.1</span>
                                        <span class="d-block fs-xs text-body-secondary">Hero promo slider</span>
                                    </a>
                                </li>
                                <li class="hover-effect-opacity px-2 mx-n2">
                                    <a class="dropdown-item d-block mb-0" href="{{ route('second', ['home', 'fashion-v2']) }}">
                                        <span class="fw-medium">Fashion Store v.2</span>
                                        <span class="d-block fs-xs text-body-secondary">Hero banner with hotspots</span>
                                    </a>
                                </li>
                                <li class="hover-effect-opacity px-2 mx-n2">
                                    <a class="dropdown-item d-block mb-0" href="{{ route('second', ['home', 'furniture']) }}">
                                        <span class="fw-medium">Furniture Store</span>
                                        <span class="d-block fs-xs text-body-secondary">Fancy product carousel</span>
                                    </a>
                                </li>
                                <li class="hover-effect-opacity px-2 mx-n2">
                                    <a class="dropdown-item d-block mb-0" href="{{ route('second', ['home', 'grocery']) }}">
                                        <span class="fw-medium">Grocery Store</span>
                                        <span class="d-block fs-xs text-body-secondary">Hero slider + Category cards</span>
                                    </a>
                                </li>
                                <li class="hover-effect-opacity px-2 mx-n2">
                                    <a class="dropdown-item d-block mb-0" href="{{ route('second', ['home', 'marketplace']) }}">
                                        <span class="fw-medium">Marketplace</span>
                                        <span class="d-block fs-xs text-body-secondary">Multi-vendor, digital goods</span>
                                    </a>
                                </li>
                                <li class="hover-effect-opacity px-2 mx-n2">
                                    <a class="dropdown-item d-block mb-0" href="{{ route('second', ['home', 'single-store']) }}">
                                        <span class="fw-medium">Single Product Store</span>
                                        <span class="d-block fs-xs text-body-secondary">Single product / mono brand</span>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="accordion-item border-0">
                    <div class="accordion-header" id="headingShop">
                        <button type="button" class="accordion-button animate-underline fw-medium collapsed py-2"
                            data-bs-toggle="collapse" data-bs-target="#shop" aria-expanded="false" aria-controls="shop">
                            <span class="d-block animate-target py-1">Shop</span>
                        </button>
                    </div>
                    <div class="accordion-collapse collapse" id="shop" aria-labelledby="headingShop"
                        data-bs-parent="#navigation">
                        <div class="accordion-body pb-3">
                            <div class="dropdown-menu show position-static shadow-none p-4">
                                <div class="d-flex flex-column gap-4">
                                    <div style="min-width: 190px">
                                        <div class="h6 mb-2">Electronics Store</div>
                                        <ul class="nav flex-column gap-2 mt-0">
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['shop', 'categories-electronics']) }}">Categories Page</a>
                                            </li>
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['shop', 'catalog-electronics']) }}">Catalog with Side Filters</a>
                                            </li>
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['shop', 'product-grocery']) }}">Product General Info</a>
                                            </li>
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['shop', 'product-details-electronics']) }}">Product Details</a>
                                            </li>
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['shop', 'product-reviews-electronics']) }}">Product Reviews</a>
                                            </li>
                                        </ul>
                                        <div class="h6 pt-4 mb-2">Fashion Store</div>
                                        <ul class="nav flex-column gap-2 mt-0">
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['shop', 'catalog-fashion']) }}">Catalog with Side Filters</a>
                                            </li>
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['shop', 'product-fashion']) }}">Product Page</a>
                                            </li>
                                        </ul>
                                        <div class="h6 pt-4 mb-2">Furniture Store</div>
                                        <ul class="nav flex-column gap-2 mt-0">
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['shop', 'catalog-furniture']) }}">Catalog with Top Filters</a>
                                            </li>
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['shop', 'product-furniture']) }}">Product Page</a>
                                            </li>
                                        </ul>
                                    </div>
                                    <div style="min-width: 190px">
                                        <div class="h6 mb-2">Grocery Store</div>
                                        <ul class="nav flex-column gap-2 mt-0">
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['shop', 'catalog-grocery']) }}">Catalog with Side Filters</a>
                                            </li>
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['shop', 'product-grocery']) }}">Product Page</a>
                                            </li>
                                        </ul>
                                        <div class="h6 pt-4 mb-2">Marketplace</div>
                                        <ul class="nav flex-column gap-2 mt-0">
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['shop', 'catalog-marketplace']) }}">Catalog with Top Filters</a>
                                            </li>
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['shop', 'product-marketplace']) }}">Digital Product Page</a>
                                            </li>
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['checkout', 'marketplace']) }}">Cart / Checkout</a>
                                            </li>
                                        </ul>
                                        <div class="h6 pt-4 mb-2">Checkout v.1</div>
                                        <ul class="nav flex-column gap-2 mt-0">
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['checkout', 'v1-cart']) }}">Shopping Cart</a>
                                            </li>
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['checkout', 'v1-delivery-1']) }}">Delivery Info (Step 1)</a>
                                            </li>
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['checkout', 'v1-delivery-2']) }}">Delivery Info (Step 2)</a>
                                            </li>
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['checkout', 'v1-shipping']) }}">Shipping Address</a>
                                            </li>
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['checkout', 'v1-payment']) }}">Payment</a>
                                            </li>
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['checkout', 'v1-thankyou']) }}">Thank You Page</a>
                                            </li>
                                        </ul>
                                    </div>
                                    <div style="min-width: 190px">
                                        <div class="h6 mb-2">Checkout v.2</div>
                                        <ul class="nav flex-column gap-2 mt-0">
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['checkout', 'v2-cart']) }}">Shopping Cart</a>
                                            </li>
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['checkout', 'v2-delivery']) }}">Delivery Info</a>
                                            </li>
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['checkout', 'v2-pickup']) }}">Pickup from Store</a>
                                            </li>
                                            <li class="d-flex w-100 pt-1">
                                                <a class="nav-link animate-underline animate-target d-inline fw-normal text-truncate p-0"
                                                    href="{{ route('second', ['checkout', 'v2-thankyou']) }}">Thank You Page</a>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="accordion-item border-0">
                    <div class="accordion-header" id="headingAccount">
                        <button type="button" class="accordion-button animate-underline fw-medium collapsed py-2"
                            data-bs-toggle="collapse" data-bs-target="#account" aria-expanded="false"
                            aria-controls="account">
                            <span class="d-block animate-target py-1">Account</span>
                        </button>
                    </div>
                    <div class="accordion-collapse collapse" id="account" aria-labelledby="headingAccount"
                        data-bs-parent="#navigation">
                        <div class="accordion-body pb-3">
                            <ul class="dropdown-menu show position-static shadow-none">
                                <li class="dropdown">
                                    <a class="dropdown-item dropdown-toggle" href="#!" role="button"
                                        data-bs-toggle="dropdown" aria-expanded="false">Auth Pages</a>
                                    <ul class="dropdown-menu position-static transform-none shadow-none">
                                        <li><a class="dropdown-item" href="{{ route('second', ['account', 'signin']) }}">Sign In</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['account', 'signup']) }}">Sign Up</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['account', 'password-recovery']) }}">Password
                                                Recovery</a></li>
                                    </ul>
                                </li>
                                <li class="dropdown">
                                    <a class="dropdown-item dropdown-toggle" href="#!" role="button"
                                        data-bs-toggle="dropdown" aria-expanded="false">Shop User</a>
                                    <ul class="dropdown-menu position-static transform-none shadow-none">
                                        <li><a class="dropdown-item" href="{{ route('second', ['account', 'orders']) }}">Orders History</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['account', 'wishlist']) }}">Wishlist</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['account', 'payment']) }}">Payment Methods</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['account', 'reviews']) }}">My Reviews</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['account', 'info']) }}">Personal Info</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['account', 'addresses']) }}">Addresses</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['account', 'notifications']) }}">Notifications</a>
                                        </li>
                                    </ul>
                                </li>
                                <li class="dropdown">
                                    <a class="dropdown-item dropdown-toggle" href="#!" role="button"
                                        data-bs-toggle="dropdown" aria-expanded="false">Marketplace User</a>
                                    <ul class="dropdown-menu position-static transform-none shadow-none">
                                        <li><a class="dropdown-item"
                                                href="{{ route('second', ['account', 'marketplace-dashboard']) }}">Dashboard</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['account', 'marketplace-products']) }}">Products</a>
                                        </li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['account', 'marketplace-sales']) }}">Sales</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['account', 'marketplace-payouts']) }}">Payouts</a>
                                        </li>
                                        <li><a class="dropdown-item"
                                                href="{{ route('second', ['account', 'marketplace-purchases']) }}">Purchases</a></li>
                                        <li><a class="dropdown-item"
                                                href="{{ route('second', ['account', 'marketplace-favorites']) }}">Favorites</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['account', 'marketplace-settings']) }}">Settings</a>
                                        </li>
                                    </ul>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="accordion-item border-0">
                    <div class="accordion-header" id="headingPages">
                        <button type="button" class="accordion-button animate-underline fw-medium collapsed py-2"
                            data-bs-toggle="collapse" data-bs-target="#pages" aria-expanded="false"
                            aria-controls="pages">
                            <span class="d-block animate-target py-1">Pages</span>
                        </button>
                    </div>
                    <div class="accordion-collapse collapse" id="pages" aria-labelledby="headingPages"
                        data-bs-parent="#navigation">
                        <div class="accordion-body pb-3">
                            <ul class="dropdown-menu show position-static shadow-none">
                                <li class="dropdown">
                                    <a class="dropdown-item dropdown-toggle" href="#!" role="button"
                                        data-bs-toggle="dropdown" aria-expanded="false">About</a>
                                    <ul class="dropdown-menu position-static transform-none shadow-none">
                                        <li><a class="dropdown-item" href="{{ route('second', ['about', 'v1']) }}">About v.1</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['about', 'v2']) }}">About v.2</a></li>
                                    </ul>
                                </li>
                                <li class="dropdown">
                                    <a class="dropdown-item dropdown-toggle" href="#!" role="button"
                                        data-bs-toggle="dropdown" aria-expanded="false">Blog</a>
                                    <ul class="dropdown-menu position-static transform-none shadow-none">
                                        <li><a class="dropdown-item" href="{{ route('second', ['blog', 'grid-v1']) }}">Grid View v.1</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['blog', 'grid-v2']) }}">Grid View v.2</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['blog', 'list']) }}">List View</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['blog', 'single-v1']) }}">Single Post v.1</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['blog', 'single-v2']) }}">Single Post v.2</a></li>
                                    </ul>
                                </li>
                                <li class="dropdown">
                                    <a class="dropdown-item dropdown-toggle" href="#!" role="button"
                                        data-bs-toggle="dropdown" aria-expanded="false">Contact</a>
                                    <ul class="dropdown-menu position-static transform-none shadow-none">
                                        <li><a class="dropdown-item" href="{{ route('second', ['contact', 'v1']) }}">Contact v.1</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['contact', 'v2']) }}">Contact v.2</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['contact', 'v3']) }}">Contact v.3</a></li>
                                    </ul>
                                </li>
                                <li class="dropdown">
                                    <a class="dropdown-item dropdown-toggle" href="#!" role="button"
                                        data-bs-toggle="dropdown" aria-expanded="false">Help Center</a>
                                    <ul class="dropdown-menu position-static transform-none shadow-none">
                                        <li><a class="dropdown-item" href="{{ route('second', ['help', 'topics-v1']) }}">Help Topics v.1</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['help', 'topics-v2']) }}">Help Topics v.2</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['help', 'single-article-v1']) }}">Help Single
                                                Article v.1</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['help', 'single-article-v2']) }}">Help Single
                                                Article v.2</a></li>
                                    </ul>
                                </li>
                                <li class="dropdown">
                                    <a class="dropdown-item dropdown-toggle" href="#!" role="button"
                                        data-bs-toggle="dropdown" aria-expanded="false">404 Error</a>
                                    <ul class="dropdown-menu position-static transform-none shadow-none">
                                        <li><a class="dropdown-item" href="{{ route('second', ['404', 'electronics']) }}">404 Electronics</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['404', 'fashion']) }}">404 Fashion</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['404', 'furniture']) }}">404 Furniture</a></li>
                                        <li><a class="dropdown-item" href="{{ route('second', ['404', 'grocery']) }}">404 Grocery</a></li>
                                    </ul>
                                </li>
                                <li><a class="dropdown-item" href="term{{ route('any', 'terms-and-conditions')}}">Terms &amp; Conditions</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>            
        </div>

        <!-- Account button visible on screens < 768px wide (md breakpoint) -->
        <div class="offcanvas-header flex-column align-items-start d-md-none">
            <a class="btn btn-lg btn-outline-secondary w-100 rounded-pill" href="{{ route('second', ['account', 'signin']) }}">
                <i class="ci-user fs-lg ms-n1 me-2"></i>
                Account
            </a>
        </div>
    </nav>