/** Shopify CDN: Minification failed

Line 16:0 Unexpected "{"
Line 16:1 Unexpected "{"
Line 16:3 Expected identifier but found "'mega-menu.css'"
Line 17:0 Unexpected "{"
Line 17:1 Expected identifier but found "%"
Line 52:0 Unexpected "<"
Line 54:14 Expected identifier but found whitespace
Line 54:16 Unexpected "{"
Line 54:26 Expected ":"
Line 54:52 Expected ":"
... and 91 more hidden warnings

**/
{{ 'mega-menu.css' | asset_url | stylesheet_tag }}
{%- liquid
  assign main_menu = linklists[section.settings.main_menu_link_list]
  
 
  assign mobile_menu = linklists[section.settings.mobile_menu_link_list]
  if mobile_menu == blank
    assign mobile_menu = main_menu
  endif

  assign logo_alignment = 'left'
  assign nav_position = 'below'

  if section.settings.main_menu_alignment == 'left' or section.settings.main_menu_alignment == 'left-center'
    assign nav_position = 'beside'
  endif

  if section.settings.main_menu_alignment == 'below-center'
    assign nav_position = 'below'
  endif

  if section.settings.main_menu_alignment == 'center'
    assign logo_alignment = 'center'
  endif

  assign template_name = template | replace: '.', ' ' | truncatewords: 2, '' | handle

  assign overlay_header = false
  if template_name == 'index' and section.settings.sticky_index
    assign overlay_header = true
  endif
  if template_name contains 'collection' and collection.image and section.settings.sticky_collection
    assign overlay_header = true
  endif
-%}

<style>
  .site-nav__link {
    font-size: {{ settings.type_navigation_size }}px;
  }
  {% if settings.type_navigation_capitalize %}
    .site-nav__link {
      text-transform: uppercase;
      letter-spacing: 0.2em;
    }
  {% endif %}

  {% if mainmenu.length > 6 %}
    .site-nav__link {
      padding-left: 10px;
      padding-right: 10px;
    }
  {% endif %}

  /* Center dropdown links */
  .megamenu__col {
    text-align: center;
  }
  .megamenu__col .site-nav__dropdown-link {
    text-align: center;
  }

  /* Make second column heading (Vibrators) match regular link style — SHOP menu only */
  #site-nav-item--1 .megamenu__col:nth-child(2) .megamenu__col-title .site-nav__dropdown-link--top-level {
    font-weight: inherit !important;
    text-transform: none !important;
    font-size: inherit !important;
    letter-spacing: normal !important;
  }

  /* Evenly space mega menu columns side by side */
  .megamenu__cols {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-evenly !important;
    flex: 1;
    gap: 20px;
  }
  .megamenu__col {
    flex: 1 1 0 !important;
    min-width: 0;
  }

  /* Center search bar in below-center layout */
  [data-layout="below-center"] {
    display: flex;
    align-items: center;
  }
  [data-layout="below-center"] .header-item--search {
    flex: 1 1 auto;
    max-width: 600px;
    margin: 0 auto;
  }
  [data-layout="below-center"] .header-item--icons {
    flex-shrink: 0;
  }

  /* Give link columns more room when many columns are present */
  #SiteHeader .site-nav__dropdown.megamenu .custom-mega-wrapper {
    grid-template-columns: 1fr 1fr !important;
  }
  #SiteHeader .site-nav__dropdown.megamenu .custom-mega-wrapper.no-links {
    grid-template-columns: 1fr !important;
  }

  /* When 4+ link columns, stack images below links for breathing room */
  #SiteHeader .custom-mega-wrapper:has(.megamenu__col:nth-child(4)) {
    grid-template-columns: 1fr !important;
  }
  #SiteHeader .custom-mega-wrapper:has(.megamenu__col:nth-child(4)) .megamenu__cols {
    gap: 30px !important;
  }
  #SiteHeader .custom-mega-wrapper:has(.megamenu__col:nth-child(4)) .custom-mega-content-area {
    border-left: none !important;
    border-top: 1px solid #eee;
    padding-left: 0 !important;
    padding-top: 20px;
  }

  /* Desktop: center the navbar */
  @media only screen and (min-width: 769px) {
    .site-header__element--sub[data-type="nav"] .page-width {
      display: flex !important;
      justify-content: center !important;
    }
    .site-header__element--sub[data-type="nav"] .site-nav {
      flex: 0 0 auto !important;
      width: auto !important;
      justify-content: center !important;
    }
  }
  
  /* Mobile: hide search bar by default; revealed via JS toggle */
  @media only screen and (max-width: 768px) {
    .site-header__element--sub[data-type="search"] {
      display: none;
    }
    .site-header__element--sub[data-type="search"].mobile-search-open {
      display: block;
    }
  }
</style>

<div data-section-id="{{ section.id }}" data-section-type="header">
  <div id="HeaderWrapper" class="header-wrapper{% if overlay_header %} header-wrapper--overlay is-light{% endif %}">
    <header
      id="SiteHeader"
      class="site-header{% if settings.type_navigation_style == 'heading' %} site-header--heading-style{% endif %}"
      data-sticky="{{ section.settings.header_sticky }}"
      data-overlay="{{ overlay_header }}">

      <div class="site-header__element site-header__element--top">
        <div class="page-width">
          <div class="header-layout" data-layout="{{ section.settings.main_menu_alignment }}" data-nav="{{ nav_position }}" data-logo-align="{{ logo_alignment }}">

            {%- if nav_position == 'below' and logo_alignment == 'left' -%}
              <div class="header-item header-item--compress-nav small--hide">
                <button type="button" class="site-nav__link site-nav__link--icon site-nav__compress-menu">
                  <svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-hamburger" viewBox="0 0 64 64"><path d="M7 15h51">.</path><path d="M7 32h43">.</path><path d="M7 49h51">.</path></svg>
                  <span class="icon__fallback-text">{{ 'general.drawers.navigation' | t }}</span>
                </button>
              </div>
            {%- endif -%}

            {%- if logo_alignment == 'left' -%}
              <div class="header-item header-item--logo">
                {%- render 'header-logo-block', section: section -%}
              </div>
            {%- endif -%}

            {%- if nav_position == 'below' -%}
              <div class="header-item header-item--search small--hide">
                {%- if logo_alignment == 'center' -%}
                  <button type="button" class="site-nav__link site-nav__link--icon site-nav__compress-menu">
                    <svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-hamburger" viewBox="0 0 64 64"><path d="M7 15h51">.</path><path d="M7 32h43">.</path><path d="M7 49h51">.</path></svg>
                    <span class="icon__fallback-text">{{ 'general.drawers.navigation' | t }}</span>
                  </button>
                {%- endif -%}

                {%- render 'predictive-search', context: 'header' -%}
              </div>
            {%- endif -%}

            {%- if nav_position == 'beside' -%}
              <div class="header-item header-item--navigation{% if section.settings.main_menu_alignment == 'left-center' %} text-center{% endif %}" {% unless disable_aria %}role="navigation" aria-label="Primary"{% endunless %}>
                {%- render 'header-desktop-nav', main_menu: main_menu, nav_position: nav_position, show_mega_products: section.settings.mega_products, hover_menu: section.settings.hover_menu -%}
              </div>
            {%- endif -%}

            {%- if logo_alignment == 'center' -%}
              <div class="header-item header-item--logo">
                {%- render 'header-logo-block', section: section -%}
              </div>
            {%- endif -%}

            <div class="header-item header-item--icons">
              {%- render 'header-icons', section: section, nav_position: nav_position -%}
            </div>
          </div>
        </div>

        <div class="site-header__search-container">
          <div class="page-width">
            <div class="site-header__search">
              {%- render 'predictive-search', context: 'header' -%}
              <button type="button" class="text-link site-header__search-btn site-header__search-btn--cancel">
                <span class="medium-up--hide"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-close" viewBox="0 0 64 64"><path d="m19 17.61 27.12 27.13m0-27.13L19 44.74" style="stroke-miterlimit:10"/></svg></span>
                <span class="small--hide">{{ 'general.search.cancel' | t }}</span>
              </button>
            </div>
          </div>
        </div>
      </div>

      {%- if nav_position == 'below' -%}
        <div class="site-header__element site-header__element--sub" data-type="nav">
          <div class="page-width{% if logo_alignment == 'center' or section.settings.main_menu_alignment == 'below-center' %} text-center{% endif %}" {% unless disable_aria %}role="navigation" aria-label="Primary"{% endunless %}>
            {%- render 'header-desktop-nav', main_menu: main_menu, nav_position: nav_position, show_mega_products: section.settings.mega_products, hover_menu: section.settings.hover_menu -%}
          </div>
        </div>

        <div class="site-header__element site-header__element--sub" data-type="search">
          <div class="page-width medium-up--hide">
            {%- render 'predictive-search', context: 'header' -%}
          </div>
        </div>
      {%- endif -%}

      <div class="page-width site-header__drawers">
        <div class="site-header__drawers-container">
          <div class="site-header__drawer site-header__cart" id="HeaderCart">
            <div class="site-header__drawer-animate">
              {%- render 'header-cart-drawer' -%}
            </div>
          </div>

          <div class="site-header__drawer site-header__mobile-nav medium-up--hide" id="MobileNav">
            <div class="site-header__drawer-animate">
              {% comment %} --- CHANGE 2: Mobile menu pass karein --- {% endcomment %}
              {%- render 'header-mobile-nav', main_menu: mobile_menu -%}
              {%- if section.settings.header_footer_menu -%}
                <div id="MobileNavFooter"></div>
              {%- endif -%}
            </div>
          </div> 
        </div>
      </div>
    </header>
  </div>
</div>

<script>
(function () {
  document.addEventListener('DOMContentLoaded', function () {
    var searchSection = document.querySelector('.site-header__element--sub[data-type="search"]');
    if (!searchSection) return;

    document.addEventListener('click', function (e) {
      var btn = e.target.closest('.js-search-header');
      if (!btn) return;

      // Only intercept on mobile
      if (window.innerWidth > 768) return;

      e.preventDefault();
      e.stopPropagation();

      searchSection.classList.toggle('mobile-search-open');

      if (searchSection.classList.contains('mobile-search-open')) {
        var input = searchSection.querySelector('input[type="search"], input[type="text"]');
        if (input) setTimeout(function () { input.focus(); }, 50);
      }
    });
  });
}());
</script>

{% schema %}
{
  "name": "t:sections.header.name",
  "class": "header-section",
  "settings": [
    {
      "type": "link_list",
      "id": "main_menu_link_list",
      "label": "Desktop Menu",
      "default": "main-menu"
    },
  {
  "type": "link_list",
  "id": "mobile_menu_link_list",
  "label": "Mobile Menu",
  "default": "main-menu"
},
    {
      "type": "checkbox",
      "id": "hover_menu",
      "label": "t:sections.header.settings.hover_menu.label",
      "default": false
    },
    {
      "type": "select",
      "id": "main_menu_alignment",
      "label": "t:sections.header.settings.main_menu_alignment.label",
      "default": "below",
      "options": [
        {
          "value": "below",
          "label": "t:sections.header.settings.main_menu_alignment.options.below.label"
        },
        {
          "value": "below-center",
          "label": "Logo left, menu below centered"
        },
        {
          "value": "left",
          "label": "t:sections.header.settings.main_menu_alignment.options.left.label"
        },
        {
          "value": "left-center",
          "label": "t:sections.header.settings.main_menu_alignment.options.left-center.label"
        },
        {
          "value": "center",
          "label": "t:sections.header.settings.main_menu_alignment.options.center.label"
        }
      ]
    },
    {
      "type": "checkbox",
      "id": "mega_products",
      "label": "t:sections.header.settings.mega_products.label",
      "info": "t:sections.header.settings.mega_products.info",
      "default": true
    },
    {
      "type": "checkbox",
      "id": "header_sticky",
      "label": "t:sections.header.settings.header_sticky.label",
      "default": true,
      "info": "t:sections.header.settings.header_sticky.info"
    },
    {
      "type": "checkbox",
      "id": "header_footer_menu",
      "label": "t:sections.header.settings.header_footer_menu.label",
      "default": true,
      "info": "t:sections.header.settings.header_footer_menu.info"
    },
    {
      "type": "checkbox",
      "id": "sticky_index",
      "label": "t:sections.header.settings.sticky_index.label",
      "default": false
    },
    {
      "type": "checkbox",
      "id": "sticky_collection",
      "label": "t:sections.header.settings.sticky_collection.label",
      "info": "t:sections.header.settings.sticky_collection.info",
      "default": false
    },
     {
      "type": "text",
      "id": "best_sellers_title",
      "label": "Best Sellers Title",
      "default": "OUR BEST SELLERS"
    }
  ],
  "blocks": [
    {
      "type": "logo",
      "name": "t:sections.header.blocks.logo.name",
      "limit": 1,
      "settings": [
        {
          "type": "image_picker",
          "id": "logo",
          "label": "t:sections.header.blocks.logo.settings.logo.label"
        },
        {
          "type": "image_picker",
          "id": "logo-inverted",
          "label": "t:sections.header.blocks.logo.settings.logo-inverted.label",
          "info": "t:sections.header.blocks.logo.settings.logo-inverted.info"
        },
        {
          "type": "range",
          "id": "desktop_logo_width",
          "label": "t:sections.header.blocks.logo.settings.desktop_logo_width.label",
          "default": 200,
          "min": 100,
          "max": 400,
          "step": 10,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "mobile_logo_width",
          "label": "t:sections.header.blocks.logo.settings.mobile_logo_width.label",
          "default": 140,
          "min": 60,
          "max": 200,
          "step": 10,
          "unit": "px",
          "info": "t:sections.header.blocks.logo.settings.mobile_logo_width.info"
        }
      ]
    },
   {
      "type": "best_seller",
      "name": "Best Seller",
      "limit": 2,
      "settings": [
        {
          "type": "text",
          "id": "title",
          "label": "Heading",
          "default": "Ditch the tube; bite the Bit."
        },
        {
          "type": "text",
          "id": "link_text",
          "label": "Link Text",
          "default": "Shop Toothpaste Bits"
        },
        {
          "type": "url",
          "id": "link",
          "label": "Link"
        },
        {
          "type": "image_picker",
          "id": "image",
          "label": "Image"
        }
      ]
    },
 {
  "type": "mega_menu_custom",
  "name": "Mega Menu 4-Column Grid",
  "settings": [
    {
      "type": "text",
      "id": "menu_item",
      "label": "Menu Item Trigger",
      "info": "Enter the exact name of the menu item (e.g., 'About Us') to show this block."
    },
    {
  "type": "select",
  "id": "custom_class",
  "label": "Select Design",
  "options": [
    {
      "value": "design-1",
      "label": "Design 1"
    },
    {
      "value": "design-2",
      "label": "Design 2"
    }
  ],
  "default": "design-1"
},
    { "type": "header", "content": "Column 1" },
    { "type": "image_picker", "id": "image_1", "label": "Image" },
    { "type": "text", "id": "title_1", "label": "Title" },
    { "type": "url", "id": "link_1", "label": "Link" },
    { "type": "text", "id": "btn_text_1", "label": "Button Text", "default": "Shop Now" },
    { "type": "header", "content": "Column 2" },
    { "type": "image_picker", "id": "image_2", "label": "Image" },
    { "type": "text", "id": "title_2", "label": "Title" },
    { "type": "url", "id": "link_2", "label": "Link" },
    { "type": "text", "id": "btn_text_2", "label": "Button Text", "default": "Shop Now" },
    { "type": "header", "content": "Column 3" },
    { "type": "image_picker", "id": "image_3", "label": "Image" },
    { "type": "text", "id": "title_3", "label": "Title" },
    { "type": "url", "id": "link_3", "label": "Link" },
    { "type": "text", "id": "btn_text_3", "label": "Button Text", "default": "Shop Now" },
    { "type": "header", "content": "Column 4" },
    { "type": "image_picker", "id": "image_4", "label": "Image" },
    { "type": "text", "id": "title_4", "label": "Title" },
    { "type": "url", "id": "link_4", "label": "Link" },
    { "type": "text", "id": "btn_text_4", "label": "Button Text", "default": "Shop Now" },
    { "type": "header", "content": "Column 5" },
    { "type": "image_picker", "id": "image_5", "label": "Image" },
    { "type": "text", "id": "title_5", "label": "Title" },
    { "type": "url", "id": "link_5", "label": "Link" },
    { "type": "text", "id": "btn_text_5", "label": "Button Text", "default": "Shop Now" }
  ]
},
{
  "type": "mega_menu_image",
  "name": "Mega Menu Image",
  "limit": 7,
  "settings": [
    {
      "type": "text",
      "id": "menu_item",
      "label": "Menu Item Title"
    },
    {
      "type": "image_picker",
      "id": "image",
      "label": "Image"
    },
    {
      "type": "text",
      "id": "title",
      "label": "Title"
    },
    {
      "type": "url",
      "id": "link_url",
      "label": "Link URL"
    }
  ]
}
  ],
  "default": {
    "settings": {}
  },
  "disabled_on": {
    "groups": ["footer", "custom.popups"]
  }
}
{% endschema %}