/*
--------------------------------------
layout
--------------------------------------
*/
.main-header {
	display               : grid;
	grid-template-columns : var(--container-primary-margin) auto 1fr auto var(--container-primary-margin);
	align-items           : center;
}

.header-bg {
	grid-column : 1/-1;
	grid-row    : 1/4;
	align-self  : stretch;
	background  : var(--color-secondary);
	z-index     : 4;
}

.header-banner,
.header-infos,
.header-burger,
.header-logo,
.header-search,
.header-actions {
	z-index : 5;
}

.header-burger,
.header-logo,
.header-actions {
	padding : 15px 0;
}

.header-banner,
.header-infos {
	grid-column : 1/-1;
}

.header-banner {
	grid-row : 1;
}

.header-infos {
	grid-row : 2;
}

.header-burger,
.header-logo,
.header-actions {
	grid-row : 3;
}

.header-search {
	grid-row : 4;
}

.header-burger {
	grid-column : 2;
}

.header-logo {
	grid-column : 3;
}

.header-actions {
	grid-column : 4;
	grid-row    : 3;
	align-self  : stretch;
}

.header-search {
	grid-column : 2/-2;
}

.header-nav {
	z-index    : 5;
	box-shadow : 0 0 10px rgba(0, 0, 0, 0.19);
}

@media (min-width : 1200px) {

	.main-header {
		grid-template-columns : var(--container-primary-margin) 0.5fr 0.5fr 1fr 1fr var(--container-primary-margin);
	}

	.header-search {
		padding : 15px 0;
	}

	.header-search {
		grid-row : 3;
	}

	.header-banner,
	.header-infos,
	.header-nav {
		grid-column : 1/-1;
	}

	.header-burger {
		grid-column : 2;
	}

	body[data-is-desktop="true"] .header-burger {
		display : none;
	}

	.header-logo {
		grid-column : 3;
	}

	.header-search {
		grid-column : 4;
		padding     : 0 25px;
	}

	.header-actions {
		grid-column : 5;
	}

	.header-nav {
		z-index : 3;
	}

	.header-infos-container {
		max-width             : 1280px;
		display               : grid;
		grid-template-columns : repeat(2, 1fr);
		margin                : auto;
	}

	.search-widget form input[type=text] {
		min-height : 50px;
	}

}

/*
--------------------------------------
global
--------------------------------------
*/
.main-header {
	padding-bottom : 10px;
}

body[data-is-desktop="true"] .main-header {
	padding-bottom : 0;
}

/*
--------------------------------------
global
--------------------------------------
*/

.main-header {
	padding-bottom : 10px;
}

body[data-is-desktop="true"] .main-header {
	padding-bottom : 0;
}

#header {
	width  : 100%;
	margin : auto;
}

/*
--------------------------------------
Search
--------------------------------------
*/
.search-widget {
	width : 100%;
}

.search-widget form {
	position    : relative;
	display     : flex;
	align-items : center;
}


.search-widget input[type=text] {
	border-radius: 25px;
	box-shadow: 0 0 15px rgba(0, 0, 0, .1);
	width: 100%;
	padding: 10px 2em 10px 10px;
	color: var(--color-grey-font-default);
	border: none;
	transition: all .3s ease-out;
	height: 51px;
	margin-top: 5px;
}

/*.search-widget input[type=text]::placeholder {*/
/*	text-overflow : ellipsis;*/
/*	white-space   : nowrap;*/
/*	overflow      : hidden;*/
/*	width         : 200px;*/
/*}*/

.search-widget form input[type=text]:focus {
	border-color : var(--color-primary);
	outline      : none;
}

.search-widget form button[type=submit] {
	position: absolute;
	right: 0;
	height: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0 15px;
	text-align: center;
	color: #000;
	background: transparent;
	border: 1px solid transparent;
	border-radius: 0 30px 30px 0;
	outline: none;
	bottom: 0;
}

.search-widget form button[type=submit]:before {
	content          : "";
	width            : 1px;
	height           : 65%;
	background-color : #C9C9C9;
	margin-right     : 10px;
}


.featured-products-container {
	background-color : white;
	padding          : 4em 4em 8em;
}

.featured-products-container .c-title__subtitle {
	font-family    : var(--typo-secondary);
	font-size      : 16px;
	color          : #8D8D8D;
	letter-spacing : 2.4px;
	line-height    : 30px;
	text-transform: uppercase;
}

.featured-products-container .c-title {
	font-family    : var(--typo-secondary);
	font-size      : 40px;
	font-weight    : bold;
	color          : black;
	letter-spacing : 2px;
	line-height    : 49px;
	padding        : 0 0 2em;
}

.featured-products .wishlist-button-add {
	display : none;
}

@media (max-width : 1024px) {

	.featured-products-container {
		background-color : white;
		padding          : 2em 0em 8em;
	}

}