﻿@import '../default.less';
@import '../mixins.less';
//DON'T ADD IMPORTS, ABOVE ARE TO MAKE INTELLISENSE WORK

@media all and (min-width: 1440px)
{
	#site-main.search
	{
		#back-to-top
		{
			display: none;
		}
	}

	#site-search
	{
		width: 910px;
	}

	#search-results-with-filters.wide-result
	{
		.with-sidebar &
		{
			width: 76%;
		}
	}

	@left-right-margin: 47px;
	@dropdown-width: 160px;

	#site-holder.search.v7
	{
		div#product-promotion
		{
			padding-top: 25px;
			padding-bottom: 35px;
		}
		/*need #site-search inside #site-main for theme like cfi.knoema.org (Haiti open data)*/
		div#site-main.search div#site-search
		{
			left: auto;
			width: auto;

			html[dir='rtl'] &
			{
				right: auto;
			}

			form
			{
				width: 100%;

				input#search-query.dropdown-shown
				{
					width: ~'calc(100% - @{dropdown-width} - 2 * @{left-right-margin} + 2px - 50px)'; //50px - padding
					margin-left: @dropdown-width + @left-right-margin - 2px;

					html[dir='rtl'] &
					{
						.margin-left-right(0, @dropdown-width + @left-right-margin - 2px);
					}
				}

				.query-dropdown
				{
					left: @left-right-margin - 1px;

					html[dir='rtl'] &
					{
						left: auto;
						right: @left-right-margin - 1px;
					}
				}

				input#search-query
				{
					width: ~"calc(100% - 130px)";
					margin-left: 20px;

					html[dir='rtl'] &
					{
						.margin-left-right(auto; 20px);
					}
				}

				#site-search-button
				{
					top: auto;
					right: auto;
					left: ~"calc(100% - 80px)";

					html[dir='rtl'] &
					{
						left: auto;
						right: ~"calc(100% - 80px)";
					}
				}

				div#search-progress
				{
					right: 58px;
					left: auto;

					html[dir='rtl'] &
					{
						right: auto;
						left: 55px; //the center of magnifier should be aligned with loading circle, it's defferent for RTL
					}
				}
			}
		}

		.search-results div.instant-answer.left-container
		{
			max-width: 570px;
		}

		.search-teaser
		{
			.margin-left-right(0; 0);
		}

		div#full-search-results
		{
			.margin-left-right(0; 0);
		}

		#search-wrapper
		{
			.search-teaser
			{
				> *
				{
					max-width: ~"calc(100% - 2 * @{left-right-margin})";
					margin-left: @left-right-margin;

					html[dir="rtl"] &
					{
						margin-left: 0;
						margin-right: @left-right-margin;
					}
				}

				&.instant div.see-also.right-container
				{
					margin-right: @left-right-margin;

					html[dir="rtl"] &
					{
						margin-right: 0;
						margin-left: @left-right-margin;
					}
				}
			}

			#home-content #search-results
			{
				#search-empty-msg
				{
					width: ~"calc(100% - 100px)";
				}
			}
		}

		.no-search-results
		{
			#search-wrapper
			{
				margin-left: 50px;
				margin-right: 50px;
				width: auto;
			}
		}

		.with-sidebar
		{
			#search-wrapper
			{
				width: ~"calc(100% - 2 * @{left-right-margin})";
				.margin-left-right(@left-right-margin, @left-right-margin);
				.padding-left-right(0, 0);

				html[dir="rtl"] &
				{
					.margin-left-right(@left-right-margin, @left-right-margin);
					.padding-left-right(0, 0);
				}

				#home-content
				{
					width: ~"calc(100% - 240px)";

					#search-results-with-filters
					{
						width: 100%;
					}
				}
			}

			div.search-filters-container div.filter-container
			{
				width: ~"calc(133.33% - 25px)";
				.margin-left-right(-@left-right-margin, -@left-right-margin);
				.padding-left-right(@left-right-margin, @left-right-margin);
			}

			.premium-content-filter
			{
				width: ~"calc(133.33% - 55px)";
			}

			div.sticky
			{
				.premium-content-filter
				{
					width: 100%;
				}
			}
		}

		#search-filters-top
		{
			margin-left: @left-right-margin;

			html[dir='rtl'] &
			{
				.margin-left-right(0, @left-right-margin);
			}
		}
	}
}	

#site-holder:not(.community-v2)
{
	@media all and (min-width: 1440px)
	{
		#site-header .wrapper
		{
			margin: 0;
			padding: 0 15px 0 15px;
			width: auto;
			min-width: 940px;

			.v7&
			{
				padding: 0 45px;
			}
		}

		#site-main
		{
			width: auto;
		}

		.site-language.flags ul
		{
			right: 0;

			html[dir=rtl] &
			{
				left: 0;
				right: auto;
			}
		}

		.user-info-dlg
		{
			width: 200px;
			right: 15px;

			html[dir=rtl] &
			{
				right: auto;
				left: 15px;
			}
		}

		div.search-result-item
		{
			&.partner-content
			{
				table.partner-data
				{
					td
					{
						&.name
						{
							max-width: 520px;
							.padding-left-right(0, 40px);

							html[dir=rtl] &
							{
								.padding-left-right(40px, 0);
							}
						}

						&.value
						{
							max-width: 400px;
						}
					}
				}
			}
		}
	}
}
