{%- liquid
  assign results_count = search.results_count

  assign search_terms = search.terms
  assign key_terms = search_terms
  if search_terms contains 'product_type:'
    assign arr_terms = search_terms | remove: 'product_type:' | replace_first: ' AND', ' AND ' | replace_first: '  ', ' ' | split: ' AND '
    assign product_type = arr_terms[0] | strip
    assign search_terms = arr_terms[1] | strip
    if search_terms == blank
      assign key_terms = key_terms | remove: ' AND '
      assign search_terms = product_type
    endif
  endif

	if linklists.theme_brands.links
	capture brand
		case template.name
			when "collection"
				echo collection.metafields.theme.brand.value.name
			when "product"
				if product.metafields.theme.brand
					echo product.metafields.theme.brand.value.name
				else
					for collection in product.collections
						if collection.metafields.theme.brand
							echo collection.metafields.theme.brand.value.name
							break
						endif
					endfor
				endif
			when "page"
				echo page.metafields.theme.brand.value.name
			when "blog" or "article"
				echo blog.metafields.theme.brand.value.name
		endcase
	endcapture

	assign index_active = 0
	assign count = 0
	for link in linklists.theme_brands.links
		if link.active or link.child_active or link.child_current or link.title == brand and index_active == 0
			assign count = count | plus: 1
			assign index_active = forloop.index0
			assign page_handle = link.handle
		endif
	endfor
endif
if count != 1
	assign page_handle = linklists.theme_brands.links[0].handle
endif

	assign products_suggests = pages[page_handle].metafields.theme.brand.value.search.value | default: settings.products_suggest
-%}
{{ 'hdt-search-form.css' | asset_url | stylesheet_tag }}
{%- comment -%}{{ 'hdt-card-products.css' | asset_url | stylesheet_tag }}{%- endcomment -%}

{% if settings.search_fullwidth %}
	<hdt-predictive-search data-section-id-results="hdt_predictive-search"{% if settings.predictive_search_enabled %} enabled{% endif %} id="drawer-search-form" class="hdt-drawer with-slot-sticky hdt-drawer-search hdt-hidden hdt-fixed hdt-search-fullwidth hdt-top-0 hdt-left-0 hdt-right-0" effect="right" effect-lg="top" color-scheme="{{ settings.color_scheme_search }}">
		<div slot="header" class="hdt-search-head lg:hdt-text-center">
			<h5 class="hdt-font-medium hdt-font-medium">{{ 'general.search.search_our_site' | t }}</h5>
		</div>
		<div slot="sticky" class="hdt-search-sticky lg:hdt-text-center">
			<div class="hdt-container">
				<form data-frm-search action="{{ routes.search_url }}" method="get" class="hdt-mini-search__frm hdt-pr" role="search">
          <input type="hidden" name="resources[options][fields]" value="title,product_type,variants.title,vendor,variants.sku,tag">
					<input type="hidden" name="resources[limit_scope]" value="each">
					<div class="hdt-search-inner hdt-relative hdt-oh">
						<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none" class="hdt-absolute hdt-top-0 hdt-bottom-0">
							<path d="M15.7548 14.394L12.1277 10.7669C13.0009 9.60434 13.4723 8.18932 13.4707 6.73536C13.4707 3.02151 10.4492 0 6.73536 0C3.02151 0 0 3.02151 0 6.73536C0 10.4492 3.02151 13.4707 6.73536 13.4707C8.18932 13.4723 9.60434 13.0009 10.7669 12.1277L14.394 15.7548C14.5776 15.9189 14.8171 16.0065 15.0632 15.9996C15.3094 15.9927 15.5436 15.8919 15.7177 15.7177C15.8919 15.5436 15.9927 15.3094 15.9996 15.0632C16.0065 14.8171 15.9189 14.5776 15.7548 14.394ZM1.92439 6.73536C1.92439 5.78384 2.20655 4.85369 2.73518 4.06253C3.26382 3.27137 4.01519 2.65473 4.89428 2.2906C5.77337 1.92647 6.7407 1.8312 7.67393 2.01683C8.60717 2.20246 9.4644 2.66066 10.1372 3.33349C10.8101 4.00632 11.2683 4.86355 11.4539 5.79679C11.6395 6.73002 11.5442 7.69735 11.1801 8.57644C10.816 9.45553 10.1994 10.2069 9.40819 10.7355C8.61703 11.2642 7.68688 11.5463 6.73536 11.5463C5.45988 11.5448 4.23708 11.0374 3.33518 10.1355C2.43328 9.23364 1.92592 8.01084 1.92439 6.73536Z" fill="currentColor"/>
						</svg>
						<input data-input-search class="hdt-input hdt-search-input hdt-text-base hdt-font-normal" autocomplete="off" type="search" name="q" placeholder="{{ 'general.search.search' | t }}" value="">
						<button data-submit-search class="hdt-hidden hdt-mini-search__submit" type="submit">
							<svg class="hdt-btn-op0" viewBox="0 0 18 19" width="16"><use href="#hdt-icon-search"></use></svg>
							<div class="hdt-loading__spinner hdt-hidden">
								<svg width="16" height="16" aria-hidden="true" focusable="false" role="presentation" class="hdt-svg__spinner" viewBox="0 0 66 66" xmlns="http://www.w3.org/2000/svg"><circle class="hdt-path" fill="none" stroke-width="6" cx="33" cy="33" r="30"></circle></svg>
							</div>
						</button>
					</div>
					{%- assign list_hotkey = settings.list_hotkey -%}
					{%- if settings.show_search_hotkey and list_hotkey != blank -%}
						{%- assign arr_keys = list_hotkey | replace: ' ,', ',' | replace: ', ', ',' | split: ',' -%}
						{%- assign arr_keys2 = arr_keys | join: ',|nt' | split: '|nt' -%}

						<div data-listKey class="hdt-mini-search__keys">
							<span class="hdt-mini-search__label">{{ 'general.search.quick_search' | t }}</span>
							<ul class="hdt-mini-search__listKey hdt-d-inline-block">
								{%- for key in arr_keys %}{% assign key_strip = key | strip -%}
								<li class="hdt-d-inline-block"><a data-key='{{ key_strip | escape }}' href="{{ routes.predictive_search_url }}?q={{ key | strip | url_encode }}">{{ arr_keys2[forloop.index0] }} </a></li>
								{% endfor -%}
							</ul>
						</div>
					{%- endif -%}
					<div data-listsuggest-search data-listKey class="hdt-mini-search__keys">
						{%- if predictive_search.resources.queries.size > 0 -%}
							<span class="hdt-mini-search__label">{{ 'general.search.suggestions' | t }}</span>
							<ul class="hdt-mini-search__listSuggest hdt-d-inline-block" style="--li-pl: 0px">
								{%- for query in predictive_search.resources.queries -%}
									<li id="query-{{ forloop.index }}" class="hdt-d-inline-block" role="option" aria-selected="false">
										<a href="{{ routes.predictive_search_url }}?q={{ query.text }}" data-key='{{ query.text | escape }}' class="hdt-mini-search-suggest" tabindex="-1" aria-label="{{ query.text }}">
											{{ query.styled_text }}{% unless forloop.last %},{% endunless %}
										</a>
									</li>
								{%- endfor -%}
							</ul>
						{%- endif -%}
					</div>
				</form>
			</div>
		</div>
		<div class="hdt-container">
			<div class="hdt-cart-hide-has-results">
				<div class="hdt-search-parent lg:hdt-flex">
					{% if settings.search_quick_link != blank or settings.search_quick_search != blank %}
						<div class="hdt-custom-col-2 hdt-col-quicklink">
							<h6 class="hdt-search-top-title hdt-font-medium">{{ 'general.search.quicklink_title' | t }}</h6>
							<ul class="hdt-quicklink-list">
								{%- if settings.search_quick_link != blank -%}
									{%- for link in settings.search_quick_link.links -%}
										<li class="hdt-quicklink-item">
											<a href="{{ link.url }}" class="hdt-quick-link hdt-text-base hdt-font-normal hdt-flex hdt-relative">
												{{ link.title }}
												<svg class="hdt-qicksearch-icon hdt-pe-none" xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 10 10" fill="none"><path d="M1.07692 10L0 8.92308L7.38462 1.53846H0.769231V0H10V9.23077H8.46154V2.61538L1.07692 10Z" fill="currentColor"></path></svg>
											</a>
										</li>
									{%- endfor -%}
								{%- endif -%}
								{%- if settings.search_quick_search != blank -%}
									{%- assign arr_qsearch = settings.search_quick_search | split: "," -%}
									{%- for q_search in arr_qsearch -%}
										<li class="hdt-quicklink-item">
											<hdt-quick-search class="hdt-contents">
												<a href="#{{ q_search }}" data-query="{{ q_search }}" class="hdt-quick-link hdt-text-base hdt-font-normal hdt-flex hdt-relative">
													{{ q_search }}
													<svg class="hdt-qicksearch-icon hdt-pe-none" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none" class="hdt-absolute hdt-top-0 hdt-bottom-0">
														<path d="M15.7548 14.394L12.1277 10.7669C13.0009 9.60434 13.4723 8.18932 13.4707 6.73536C13.4707 3.02151 10.4492 0 6.73536 0C3.02151 0 0 3.02151 0 6.73536C0 10.4492 3.02151 13.4707 6.73536 13.4707C8.18932 13.4723 9.60434 13.0009 10.7669 12.1277L14.394 15.7548C14.5776 15.9189 14.8171 16.0065 15.0632 15.9996C15.3094 15.9927 15.5436 15.8919 15.7177 15.7177C15.8919 15.5436 15.9927 15.3094 15.9996 15.0632C16.0065 14.8171 15.9189 14.5776 15.7548 14.394ZM1.92439 6.73536C1.92439 5.78384 2.20655 4.85369 2.73518 4.06253C3.26382 3.27137 4.01519 2.65473 4.89428 2.2906C5.77337 1.92647 6.7407 1.8312 7.67393 2.01683C8.60717 2.20246 9.4644 2.66066 10.1372 3.33349C10.8101 4.00632 11.2683 4.86355 11.4539 5.79679C11.6395 6.73002 11.5442 7.69735 11.1801 8.57644C10.816 9.45553 10.1994 10.2069 9.40819 10.7355C8.61703 11.2642 7.68688 11.5463 6.73536 11.5463C5.45988 11.5448 4.23708 11.0374 3.33518 10.1355C2.43328 9.23364 1.92592 8.01084 1.92439 6.73536Z" fill="currentColor"></path>
													</svg>
												</a>
											</hdt-quick-search>
										</li>
									{%- endfor -%}
								{%- endif -%}
							</ul>
						</div>
					{% endif %}
					<div class="hdt-col-content{% if settings.search_quick_link != blank or settings.search_quick_search != blank %} hdt-custom-col-10 {% else %} hdt-custom-col-12{% endif %}">
						<div class="hdt-search-hidden-inner">
							{%- if results_count == blank and products_suggests != blank -%}
								<h6 class="hdt-search-content-title hdt-font-medium">{{ 'general.search.content_title' | t }}</h6>
								<div data-products_suggest class="hdt-mini-search__content hdt-ratio--custom-pr hdt-object-cover hdt-text-center">
									<div class="hdt-row-grid hdt-row-products hdt-show-pr-price-{{ settings.predictive_search_show_price }} xl:hdt-grid-cols-5 lg:hdt-grid-cols-4 hdt-grid-cols-1 hdt-text-start">
										{%- liquid
											capture btn_wishlist_code
		                    if settings.wishlist_mode != '0'
		                      render 'btn-wishlist', class: 'hdt-card-product__btn-wishlist hdt-pr_btn', placement: 'top'
		                    endif
		                  endcapture -%}
										{%- for product in products_suggests limit: 5 -%}
											{%- render 'card-product1', card_product: product, class: "hdt-pr-style1", section_id: section.id, sizes: sizes, image_ratio: section.settings.image_ratio, color_list: color_list, size_list: size_list, product_url: product_url, btn_wishlist_code: btn_wishlist_code, show_vendor: settings.predictive_search_show_vendor, show_price: settings.predictive_search_show_price, action_atc: routes.root_url -%}
										{%- endfor -%}
									</div>
								</div>
							{%- endif -%}
						</div>
					</div>
				</div>
			</div>
			<div class="hdt-cart-show-has-results">
				<div data-skeleton-search class="hdt-skeleton_wrap hdt-hidden">
					<div class="hdt-row-grid hdt-row-products xl:hdt-grid-cols-4 lg:hdt-grid-cols-4 hdt-grid-cols-1 hdt-text-start">
						{%- for i in (1..4) -%}
							<div class="hdt-product hdt-pr-loop">
						    <div class="hdt-card-product__wrapper hdt-flex ">
						      <div class="hdt-skeleton_img"></div>
						      <div class="hdt-card-product__info">
						        <div class="hdt-skeleton_txt1"></div>
										<div class="hdt-skeleton_txt2"></div>
						      </div>
						    </div>
						  </div>
						{%- endfor -%}
					</div>
				</div>
				<hdt-scrollsnap data-results-search class="hdt-mini-search__content hdt-ratio--custom-pr hdt-object-cover hdt-text-center"></hdt-scrollsnap>
			</div>
		</div>
	</hdt-predictive-search> 
{%- else -%}
	<hdt-predictive-search data-section-id-results="hdt_predictive-search"{% if settings.predictive_search_enabled %} enabled{% endif %} id="drawer-search-form" class="hdt-drawer with-slot-sticky hdt-drawer-search hdt-hidden hdt-fixed hdt-search-hidden hdt-top-0 hdt-right-0 hdt-bottom-0" effect="right" color-scheme="{{ settings.color_scheme_search }}">
		<div slot="header" class="hdt-search-head hdt-px-15">
			<h5 class="hdt-font-medium hdt-font-medium">{{ 'general.search.search_our_site' | t }}</h5>
		</div>
		
		<div slot="sticky" class="hdt-search-sticky hdt-px-15">
			<form data-frm-search action="{{ routes.search_url }}" method="get" class="hdt-mini-search__frm hdt-pr" role="search">
        <input type="hidden" name="resources[options][fields]" value="title,product_type,variants.title,vendor,variants.sku">
				<input type="hidden" name="resources[limit_scope]" value="each">
				<div class="hdt-search-inner hdt-relative hdt-oh">
					<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none" class="hdt-absolute hdt-top-0 hdt-bottom-0">
						<path d="M15.7548 14.394L12.1277 10.7669C13.0009 9.60434 13.4723 8.18932 13.4707 6.73536C13.4707 3.02151 10.4492 0 6.73536 0C3.02151 0 0 3.02151 0 6.73536C0 10.4492 3.02151 13.4707 6.73536 13.4707C8.18932 13.4723 9.60434 13.0009 10.7669 12.1277L14.394 15.7548C14.5776 15.9189 14.8171 16.0065 15.0632 15.9996C15.3094 15.9927 15.5436 15.8919 15.7177 15.7177C15.8919 15.5436 15.9927 15.3094 15.9996 15.0632C16.0065 14.8171 15.9189 14.5776 15.7548 14.394ZM1.92439 6.73536C1.92439 5.78384 2.20655 4.85369 2.73518 4.06253C3.26382 3.27137 4.01519 2.65473 4.89428 2.2906C5.77337 1.92647 6.7407 1.8312 7.67393 2.01683C8.60717 2.20246 9.4644 2.66066 10.1372 3.33349C10.8101 4.00632 11.2683 4.86355 11.4539 5.79679C11.6395 6.73002 11.5442 7.69735 11.1801 8.57644C10.816 9.45553 10.1994 10.2069 9.40819 10.7355C8.61703 11.2642 7.68688 11.5463 6.73536 11.5463C5.45988 11.5448 4.23708 11.0374 3.33518 10.1355C2.43328 9.23364 1.92592 8.01084 1.92439 6.73536Z" fill="currentColor"/>
					</svg>
					<input data-input-search class="hdt-input hdt-search-input hdt-text-base hdt-font-normal" autocomplete="off" type="search" name="q" placeholder="{{ 'general.search.search' | t }}">
					<button data-submit-search class="hdt-hidden hdt-mini-search__submit" type="submit">
						<svg class="hdt-btn-op0" viewBox="0 0 18 19" width="16"><use href="#hdt-icon-search"></use></svg>
						<div class="hdt-loading__spinner hdt-hidden">
							<svg width="16" height="16" aria-hidden="true" focusable="false" role="presentation" class="hdt-svg__spinner" viewBox="0 0 66 66" xmlns="http://www.w3.org/2000/svg"><circle class="hdt-path" fill="none" stroke-width="6" cx="33" cy="33" r="30"></circle></svg>
						</div>
					</button>
				</div>
				{%- assign list_hotkey = settings.list_hotkey -%}
				{%- if settings.show_search_hotkey and list_hotkey != blank -%}
					{%- assign arr_keys = list_hotkey | replace: ' ,', ',' | replace: ', ', ',' | split: ',' -%}
					{%- assign arr_keys2 = arr_keys | join: ',|nt' | split: '|nt' -%}

					<div data-listKey class="hdt-mini-search__keys">
						<span class="hdt-mini-search__label">{{ 'general.search.quick_search' | t }}</span>
						<ul class="hdt-mini-search__listKey hdt-d-inline-block">
							{%- for key in arr_keys %}{% assign key_strip = key | strip -%}
							<li class="hdt-d-inline-block"><a data-key='{{ key_strip | escape }}' href="{{ routes.predictive_search_url }}?q={{ key | strip | url_encode }}">{{ arr_keys2[forloop.index0] }} </a></li>
							{% endfor -%}
						</ul>
					</div>
				{%- endif -%}
			</form>
		</div>
		<div class="hdt-search-content hdt-px-15">
			<div class="hdt-cart-hide-has-results">
				{%- if settings.search_quick_link != blank or settings.search_quick_search != blank -%}
					<div class="hdt-col-quicklink">
						<h6 class="hdt-search-content-title hdt-font-medium">{{ 'general.search.quicklink_title' | t }}</h6>
						<ul class="hdt-quicklink-list">
							{%- if settings.search_quick_link != blank -%}
								{%- for link in settings.search_quick_link.links -%}
									<li class="hdt-quicklink-item">
										<a href="{{ link.url }}" class="hdt-quick-link hdt-text-base hdt-font-normal hdt-flex hdt-relative">
											{{ link.title }}
											<svg class="hdt-qicksearch-icon hdt-pe-none" xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 10 10" fill="none"><path d="M1.07692 10L0 8.92308L7.38462 1.53846H0.769231V0H10V9.23077H8.46154V2.61538L1.07692 10Z" fill="currentColor"></path></svg>
										</a>
									</li>
								{%- endfor -%}
							{%- endif -%}
							{%- if settings.search_quick_search != blank -%}
								{%- assign arr_qsearch = settings.search_quick_search | split: "," -%}
								{%- for q_search in arr_qsearch -%}
									<li class="hdt-quicklink-item">
										<hdt-quick-search class="hdt-contents">
											<a href="#{{ q_search }}" data-query="{{ q_search }}" class="hdt-quick-link hdt-text-base hdt-font-normal hdt-flex hdt-relative">
												{{ q_search }}
												<svg class="hdt-qicksearch-icon hdt-pe-none" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none" class="hdt-absolute hdt-top-0 hdt-bottom-0">
													<path d="M15.7548 14.394L12.1277 10.7669C13.0009 9.60434 13.4723 8.18932 13.4707 6.73536C13.4707 3.02151 10.4492 0 6.73536 0C3.02151 0 0 3.02151 0 6.73536C0 10.4492 3.02151 13.4707 6.73536 13.4707C8.18932 13.4723 9.60434 13.0009 10.7669 12.1277L14.394 15.7548C14.5776 15.9189 14.8171 16.0065 15.0632 15.9996C15.3094 15.9927 15.5436 15.8919 15.7177 15.7177C15.8919 15.5436 15.9927 15.3094 15.9996 15.0632C16.0065 14.8171 15.9189 14.5776 15.7548 14.394ZM1.92439 6.73536C1.92439 5.78384 2.20655 4.85369 2.73518 4.06253C3.26382 3.27137 4.01519 2.65473 4.89428 2.2906C5.77337 1.92647 6.7407 1.8312 7.67393 2.01683C8.60717 2.20246 9.4644 2.66066 10.1372 3.33349C10.8101 4.00632 11.2683 4.86355 11.4539 5.79679C11.6395 6.73002 11.5442 7.69735 11.1801 8.57644C10.816 9.45553 10.1994 10.2069 9.40819 10.7355C8.61703 11.2642 7.68688 11.5463 6.73536 11.5463C5.45988 11.5448 4.23708 11.0374 3.33518 10.1355C2.43328 9.23364 1.92592 8.01084 1.92439 6.73536Z" fill="currentColor"></path>
												</svg>
											</a>
										</hdt-quick-search>
									</li>
								{%- endfor -%}
							{%- endif -%}
						</ul>
					</div>
				{%- endif -%}
				<div class="hdt-col-content">
					<h6 class="hdt-search-content-title hdt-font-medium">{{ 'general.search.content_title' | t }}</h6>
					<div class="hdt-search-hidden-inner">

						<div data-products_suggest class="hdt-mini-search__content hdt-show-pr-price-{{ settings.predictive_search_show_price }} hdt-ratio--custom-pr hdt-object-cover ">
							<div class="hdt-row-grid hdt-row-products hdt-grid-cols-1">
								{%- liquid
								 	if products_suggests != blank
										for product in products_suggests limit: 3
											render 'pr_loop_item', section_id: section.id, product: product, sizes: "68px", widths: "136, 150, 174, 240, 300", show_vendor: settings.predictive_search_show_vendor
										endfor
									endif -%}
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="hdt-cart-show-has-results">
				<div data-skeleton-search class="hdt-skeleton_wrap hdt-hidden">
					<div class="hdt-row-grid hdt-row-products hdt-grid-cols-1">
						{%- for i in (1..5) -%}
							<div class="hdt-product hdt-pr-loop">
						    <div class="hdt-card-product__wrapper hdt-flex ">
						      <div class="hdt-skeleton_img"></div>
						      <div class="hdt-card-product__info">
						        <div class="hdt-skeleton_txt1"></div>
										<div class="hdt-skeleton_txt2"></div>
						      </div>
						    </div>
						  </div>
						{%- endfor -%}
					</div>
				</div>
				<div data-results-search class="hdt-mini-search__content hdt-show-pr-price-{{ settings.predictive_search_show_price }} hdt-ratio--custom-pr hdt-object-cover"></div>
			</div>
		</div>
		<div slot="footer" class="hdt-search-bottom hdt-px-15 hdt-align-center hdt-justify-end hdt-hidden">
			<a class="hdt-view_all hdt-relative hdt-inline-flex hdt-align-center hdt-justify-center hdt-text-base hdt-font-semibold" href="{{ routes.search_url | append: "?q=" | append: search_terms }}">{{ 'sections.featured_collection.view_all' | t }}<svg xmlns="http://www.w3.org/2000/svg" width="8" height="8" viewBox="0 0 8 8" fill="none">  <path d="M0.861539 8L0 7.13846L5.90769 1.23077H0.615385V0H8V7.38462H6.76923V2.09231L0.861539 8Z" fill="currentColor"/></svg></a>
		</div>
	</hdt-predictive-search>
{%- endif -%}