/**
 * Mobile / tablet header — Old Postcards layout
 *
 * Row 1: logo | language switcher
 * Row 2: search | menu
 */

@media screen and (max-width: 992px) {
	.header-wrapper {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		grid-template-areas:
			"logo lang"
			"search menu";
		align-items: center;
		column-gap: 0.45rem;
		row-gap: 0.4rem;
		padding: 0.55rem 0.75rem 0.35rem !important;
		border-bottom: 1px solid var(--op-border, #e8e4de);
	}

	.header-wrapper > .wrapper,
	.header-wrapper .center-wrapper-mx-width {
		display: contents;
	}

	.header-wrapper > .clearfix {
		display: none;
	}

	.header-wrapper > .wrapper {
		padding-top: 0;
		width: auto;
		max-width: none;
		float: none;
	}

	.site-logo {
		grid-area: logo;
		position: static;
		float: none;
		display: flex;
		align-items: center;
		align-self: center;
		justify-self: start;
		width: 100%;
		max-width: none;
		min-width: 0;
		min-height: 40px;
		height: auto;
		margin: 0;
		padding: 0;
		text-align: left;
	}

	.site-logo > a,
	.site-logo .custom-logo-link {
		display: flex;
		align-items: center;
		padding-top: 0 !important;
		line-height: 0;
		min-width: 0;
	}

	.ls-header-toolbar {
		grid-area: lang;
		position: static;
		float: none;
		display: flex;
		align-items: center;
		align-self: center;
		justify-self: end;
		min-height: 40px;
		height: auto;
		width: auto;
		margin: 0;
		padding: 0;
	}

	.header-ads-adv-search {
		grid-area: search;
		justify-self: stretch;
		align-self: center;
		display: flex !important;
		align-items: center;
		width: 100%;
		min-height: 38px;
		max-width: none;
		min-width: 0;
		float: none !important;
		margin: 0 !important;
		padding: 0;
		text-align: left;
	}

	.navigation-wrapper {
		grid-area: menu;
		position: relative;
		display: flex;
		align-items: center;
		align-self: center;
		justify-self: end;
		min-height: 38px;
		height: 38px;
		padding-top: 0 !important;
		width: auto;
		margin: 0;
	}

	.header-wrapper #site-navigation {
		display: flex;
		align-items: center;
		height: 38px;
		min-height: 0;
		border: none;
		box-shadow: none;
		background: transparent;
	}

	.header-main-menu {
		display: none !important;
		height: 0 !important;
		min-height: 0 !important;
		overflow: hidden;
		margin: 0;
		padding: 0;
	}

	.header-main-menu.wrapper {
		display: none !important;
		width: auto;
		padding: 0;
	}

	.header-wrapper .header-main-menu .menu.special-menu-wrapper {
		display: none;
	}

	.header-wrapper .header-main-menu .menu {
		position: static;
	}

	.responsive-slick-menu {
		display: flex;
		align-items: center;
		width: auto;
		height: 38px;
		position: relative;
	}

	.slicknav_menu {
		background: transparent !important;
		padding: 0 !important;
		width: auto !important;
		line-height: 0;
	}

	.slicknav_btn {
		position: relative;
		top: auto;
		right: auto;
		float: none;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-shrink: 0;
		margin: 0;
		width: 38px;
		height: 38px;
		padding: 0;
		border-radius: 8px;
		vertical-align: middle;
	}

	.slicknav_btn::before {
		top: 50%;
		left: 50%;
		right: auto;
		transform: translate(-50%, -50%);
		margin: 0;
		width: 20px;
		box-shadow: 0 6px 0 0 #fff, 0 12px 0 0 #fff;
	}

	.slicknav_nav {
		position: absolute;
		top: calc(100% + 0.35rem);
		right: 0;
		left: auto;
		min-width: min(300px, calc(100vw - 1.5rem));
		z-index: 300;
		background: var(--op-navy, #202b5d);
		border-radius: 8px;
		overflow: hidden;
		box-shadow: 0 10px 28px rgba(32, 43, 93, 0.18);
	}

	.online-shop-enable-sticky-menu .slicknav_nav {
		max-height: min(70vh, 420px);
		overflow-y: auto;
	}

	.advance-product-search {
		display: flex;
		align-items: center;
		width: 100% !important;
		max-width: none !important;
		height: 38px;
		float: none !important;
		margin: 0 !important;
	}

	.header-ads-adv-search .widget_search,
	.header-ads-adv-search form {
		display: flex;
		align-items: center;
		width: 100%;
		height: 38px;
		margin: 0;
	}

	.advance-product-search .search-field,
	.header-ads-adv-search .widget_search input#s {
		width: 100%;
		height: 38px;
		line-height: 38px;
		border-radius: 999px;
		padding: 0 2.75rem 0 0.9rem;
		font-size: 0.875rem;
		border-color: var(--op-border, #e8e4de);
		background: var(--op-cream, #faf8f5);
	}

	.advance-product-search .searchsubmit,
	.header-ads-adv-search .widget_search #searchsubmit {
		width: 38px;
		height: 38px;
		line-height: 38px;
		right: 2px;
		border-radius: 999px;
	}

	.advance-product-search .select_products {
		display: none;
	}

	/* Breadcrumbs closer to search */
	.breadcrumbs.clearfix {
		margin: 10px 0 15px;
		padding: 8px 12px;
	}

	#online-shop-breadcrumbs .woocommerce-breadcrumb {
		margin: 0.5em 0.65rem;
	}
}

@media screen and (max-width: 767px) {
	.header-wrapper {
		padding: 0.5rem 0.65rem 0.3rem !important;
		column-gap: 0.45rem;
		row-gap: 0.35rem;
	}

	.site-logo .ls-brand-logo__img,
	.site-logo img.custom-logo {
		max-height: 38px;
	}

	.navigation-wrapper {
		height: 36px;
		min-height: 36px;
	}

	.header-wrapper #site-navigation {
		height: 36px;
	}

	.responsive-slick-menu {
		height: 36px;
	}

	.header-ads-adv-search {
		min-height: 36px;
	}

	.advance-product-search,
	.header-ads-adv-search .widget_search,
	.header-ads-adv-search form {
		height: 36px;
	}

	.advance-product-search .search-field,
	.header-ads-adv-search .widget_search input#s {
		height: 36px;
		line-height: 36px;
	}

	.advance-product-search .searchsubmit,
	.header-ads-adv-search .widget_search #searchsubmit {
		width: 36px;
		height: 36px;
		line-height: 36px;
	}

	.site-logo {
		min-height: 38px;
	}

	.ls-header-toolbar {
		min-height: 38px;
	}

	.slicknav_btn {
		width: 36px;
		height: 36px;
	}

	.ls-lang-switcher__list {
		padding: 2px;
	}

	.ls-lang-switcher__link {
		min-width: 1.95rem;
		padding: 0.34rem 0.45rem;
		font-size: 0.67rem;
	}

	.breadcrumbs.clearfix {
		margin: 8px 0 12px;
		padding: 6px 10px;
	}

	#online-shop-breadcrumbs .woocommerce-breadcrumb {
		margin: 0.35rem 0.5rem;
	}
}

@media screen and (max-width: 380px) {
	.ls-lang-switcher__link {
		min-width: 1.85rem;
		padding: 0.32rem 0.4rem;
	}
}
