/*-------------------------------------------------------*/
/* Search
/*-------------------------------------------------------*/
.search-form {
	label {
		display: flex;
		margin-bottom: 0;
		font-family: inherit;
	}
}

.blockst-menu-search {
	&__trigger {
		display: block;
		background-color: transparent;
		color: var(--deo-nav-links-color);
		padding: 0;
		border: 0;
		transition: color 0.1s ease-in-out;

		&:hover,
		&:focus {
			background-color: transparent !important;
			color: initial;
		}
	}

	&__icon {
		display: block;
	}

	&-modal {
		background-color: transparent;
		position: fixed;
		overflow: hidden;
		width: 100vw;
		height: 100vh;
		top: 0;
		left: 0;
		z-index: 999;
		visibility: hidden;
		opacity: 0;
		transition: var(--deo-transition--all);

		&__inner {
			background-color: #fff;
			transition: var(--deo-transition--all);
			transform: scale(1, 0);
			transform-origin: 100% 0;
			will-change: transform;
			padding: 80px 0;

			.search-input {
				margin-bottom: 0;
				border: 0;
				border-radius: 0 !important;
				outline: 0;
				border-bottom: 1px solid var(--deo-border-color);
				background-color: transparent;

				&:focus {
					border-bottom-color: var(--deo-border-color);
				}
			}
		}

		&__close {
			position: absolute;
			top: 0;
			right: 0;
			width: 48px;
			height: 48px;
			padding: 0;
			border: 0;
			text-align: center;
			background-color: transparent;
			color: var(--wp--preset--color--tertiary);

			&:hover,
			&:focus {
				background-color: transparent;
				color: initial;
			}
		}

		&--is-open {
			background-color: rgba(0, 0, 0, 0.5);
			opacity: 1;
			visibility: visible;

			.blockst-menu-search-modal__inner {
				transform: scale(1, 1);
			}
		}
	}
}
