.header-search {
	display: flex;
	justify-content: flex-end;
	margin-left: auto;

	.btn {
		width: 56px;
		height: 56px;
		min-width: auto;
	}

	.icon--close {
		display: none;
	}
}

.header-search__input {
	border-left: var(--border);
	width: 100%;
	height: 56px;
}

.header-search__wrap {
	border-left: var(--border);
	flex-shrink: 0;
}

.header-search__input-wrap {
	border-left: var(--border);
	flex: 0 1 0;
	width: 0;
	overflow: hidden;
	opacity: 0;

	transition: width var(--transition-surface-delay) ease, flex-basis var(--transition-surface-delay) ease, opacity .25s ease;
}

.header-search.is-open {
	flex: 1;

	.header-search__input-wrap {
		flex: 1 1 auto;
		width: auto;
		opacity: 1;
	}

	.icon--close {
		display: inline;
	}

	.icon--search {
		display: none;
	}
}

@media(width < 1024px) {
	.header-search {
		display: none;
	}
}