{% assign lang = page.lang %}
{% assign dataToShow = site.data.header[lang].data %}
{% assign file = page.fileName %}
{% assign folder = page.folderName %}
{% assign  Data= site.data[folder][lang][file] %}
<header class="nav-header">
   
    <nav class="navbar navbar-expand-lg py-3 px-sm-2">
        <div class="container px-0">
        {% if dataToShow.navbarBrandText != "" %}
        <a class="navbar-brand" href="/" title="{{dataToShow.navbarBrandText}}">{{dataToShow.navbarBrandText}}</a>
        {% else %}
        <a href="/">
            <img class="logo-height" src="{{ dataToShow.navbarBrandLogo }}"
                alt="{{ dataToShow.navbarBrandLogo }}">
        </a>
        {% endif %}
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
            aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
            <i class="fa fa-bars fa_bars" aria-hidden="true"></i>
        </button>

        <div class="collapse navbar-collapse" id="navbarSupportedContent">
          
              {%- if Data.megaMenu -%}
              <li class="nav-item nav__item">
                <a class="dropdown-toggle ml-lg-5" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                  {{Data.megaMenu.nav-link-name}}
                </a>
                <ul class="dropmenu dropdown-menu" aria-labelledby="navbarDropdown">
                    <div  class="inner-dropdown">
                    {%- for item in Data.megaMenu.dropdown -%}
                         <div class="catPad mb-4">
                            <li class="text-muted">{{item.categoryName}}</li>  
                           <div> {%- for item in item.links -%}
                               <li>
                              <a href="{{item.url}}">
                                {%- if item.iconSrc -%}
                                <img class="d-inline mr-2" loading="lazy" style="height:20px;width:20px;" src="{{item.iconSrc}}">
                                {%- endif -%}
                               {{item.name}}
                              </a></li>
                           {%- endfor -%}
                        </div>
                         </div>
                    {%- endfor -%}
                </div>
                </ul>
              </li>
              {%- else -%}
              {%- if dataToShow.megaMenu  -%}
              <li class="nav-item nav__item">
                  <a class="dropdown-toggle ml-lg-5" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                    {{dataToShow.megaMenu.nav-link-name}}
                  </a>
                  <ul class="dropmenu dropdown-menu" aria-labelledby="navbarDropdown">
                      <div  class="inner-dropdown">
                      {%- for item in dataToShow.megaMenu.dropdown -%}
                           <div class="catPad mb-4">
                              <li class="text-muted">{{item.categoryName}}</li>  
                             <div> {%- for item in item.links -%}
                                 <li>
                                <a href="{{item.url}}">
                                  {%- if item.iconSrc -%}
                                  <img class="d-inline mr-2" loading="lazy" style="height:20px;width:20px;" src="{{item.iconSrc}}">
                                  {%- endif -%}
                                 {{item.name}}</a> </li>
                             {%- endfor -%}
                          </div>
                           </div>
                      {%- endfor -%}
                  </div>
                  </ul>
                </li>
                {%- endif -%}
              {%- endif -%}

              
            <ul class="navbar-nav mr-auto ">
                {% for item in dataToShow.navItems %}
                <li class="nav-item nav__item">
                    <a href="{{item.url}}">{{item.name}}</a>
                </li>
                {% endfor %}
            </ul>
    </div>
</div>
</nav>

</header>