@model MenuModel.CategoryLineModel

@if (Model.Category.IncludeInMenu)
{
    <li class="@(Model.Category.SubCategories.Count() == 0 ? "category": "category -hasSubmenu" )">

        @if (Model.Category.SubCategories.Count() == 0)
        {
            <a href="@Url.RouteUrl("Category", new { SeName = Model.Category.SeName })">
                @if (!string.IsNullOrEmpty(Model.Category.Icon))
                {
                    <b-icon class="category-icon" icon="@Model.Category.Icon"></b-icon>
                }
                <span>@Model.Category.Name</span>
                @if (!string.IsNullOrEmpty(Model.Category.FlagStyle))
                {
                    <span class="badge @Model.Category.FlagStyle">@Model.Category.Flag</span>
                }
            </a>
        }
        else
        {
            <div>
                @if (!string.IsNullOrEmpty(Model.Category.Icon))
                {
                    <b-icon class="category-icon" icon="@Model.Category.Icon"></b-icon>
                }
                <span>@Model.Category.Name</span>
                @if (!string.IsNullOrEmpty(Model.Category.FlagStyle))
                {
                    <span class="badge @Model.Category.FlagStyle">@Model.Category.Flag</span>
                }
            </div>
        }

        @{
            //subcategories
            var subCategories =
                Model.Category.SubCategories.Where(x => x.IncludeInMenu).ToList();

            var levelClass = "";
            if (Model.Level == 0)
            {
                levelClass = "first-level";
                if (subCategories.Any())
                {
                    <ul>
                        <li class="back">
                            <b-icon icon="chevron-left"></b-icon>
                            <span>@Loc["Mobile.Categories.Back"]</span>
                        </li>
                        <li class="sub-cat-name-container">
                            <a class="bg-info" href="@Url.RouteUrl("Category", new { SeName = Model.Category.SeName })">
                                <span>@Loc["Mobile.Category.Show"] @Model.Category.Name</span>
                            </a>
                        </li>
                        @foreach (var subCategory in subCategories)
                        {
                            var categoryLineModel = new MenuModel.CategoryLineModel
                            {
                                Category = subCategory,
                                Level = Model.Level + 1,
                                ResponsiveMobileMenu = Model.ResponsiveMobileMenu
                            };
                            <partial name="Components/Menu/Partials/CategoryLine.Menu" model="categoryLineModel" />
                        }
                    </ul>
                }
            }
            if (Model.Level >= 1 && subCategories.Any())
            {
                levelClass = "next-level";
                <ul class="sublist @levelClass">
                    <li class="back">
                        <b-icon icon="chevron-left"></b-icon>
                        <span>@Loc["Mobile.Categories.Back"]</span>
                    </li>
                    <li class="sub-cat-name-container">
                        <a class="bg-info" href="@Url.RouteUrl("Category", new { SeName = Model.Category.SeName })">
                            <span>@Loc["Mobile.Category.Show"] @Model.Category.Name</span>
                        </a>
                    </li>
                    @foreach (var subCategory in subCategories)
                    {
                        var categoryLineModel = new MenuModel.CategoryLineModel
                        {
                            Category = subCategory,
                            Level = Model.Level + 1,
                            ResponsiveMobileMenu = Model.ResponsiveMobileMenu
                        };
                        <partial name="Components/Menu/Partials/CategoryLine.Menu" model="categoryLineModel" />
                    }
                </ul>
            }
        }
    </li>
}

