

.tipico-search {
	position: relative;
	z-index: 9999;
}

/**
 * Custom seacrh suggestions 'popular' & 'latest' search
 */
.search-extension {
	position: absolute;
	z-index: 9999;
	width: 100%;
	top: 70px;
	padding-top: 20px;
	border-style: none;
	border-width: 0px;
	border-radius: 22px;
}

/* on the homepage the search bar is not in the header */
body.home .search-extension {
	top: 60px;
}

/**
 * Custom search overlay
 */
.tipico-custom-search-overlay {
	left: 0;
	top: calc(69px + var(--wp-admin--admin-bar--height));
	position: fixed;
	right: 0;
	bottom: 0;
	background: var(--wp--preset--color--background, #000000);
	opacity: 0.85;
}

/* on the homepage the search bar is not in the header */
body.home .tipico-custom-search-overlay {
	top: 0;
}

/* don't make multistep form z-index higher than the overlay */
.greyd_form .multistep_wrapper,
.greyd_form .step.active {
	z-index: initial;
}

/* hide results if overlay is inactive */
body:not(.has-search-overlay) .tipico-custom-search-bar .greyd-posts-slider,
html:not(:has(.tipico-custom-search-overlay)) .tipico-custom-search-bar .greyd-posts-slider {
	display: none;
}

/** do not show results if search input is empty */
.tipico-custom-search-bar:has( > form input[type="search"].is-empty ) .greyd-posts-slider {
	display: none;
}

/**
 * Adjust layout of results
 */
.tipico-custom-search-bar .greyd-posts-slider {
	position: absolute !important;
	z-index: 999;
	width: 100%;
	flex-direction: column !important;
	margin-top: 0;
	top: 70px;
}

/* on the homepage the search bar is not in the header */
body.home .tipico-custom-search-bar .greyd-posts-slider {
	top: 60px;
}

/* make first result box rounded */
.tipico-search:not(.mobile) .greyd-posts-slider article:first-child .greyd-content-box {
	border-style: none;
	border-width: 0px;
	border-top-left-radius: 22px;
	border-top-right-radius: 22px;
}

/* make last result box rounded */
.tipico-custom-search-bar .greyd-posts-slider article:last-child .greyd-content-box {
	border-style: none;
	border-width: 0px;
	border-bottom-left-radius: 22px;
	border-bottom-right-radius: 22px;
	padding-bottom: 15px;
}

/* fix an issue with <mark> tags inside the result buttons because of 'inline-flex' */
.tipico-custom-search-bar .greyd-posts-slider article .wp-block-greyd-buttons .button {
	display: block;
}



/**
 * Mobile search
 */
.tipico-search.mobile {
	position: absolute !important;
	top: 0;
	left: 0;
	width: 100%;
}

/* adjust overlay */
.tipico-search.mobile .tipico-custom-search-overlay {
	top: 0;
	height: 100vh;
}

.tipico-custom-search-overlay.mobile {
	top: 0;
}

/* adjust search suggestions */
.tipico-search.mobile .search-extension {
	top: 72px;
	border-radius: 0;
}

.tipico-search.mobile .greyd-posts-slider {
	top: 72px;
}

/**
 * add icons to 'popular search' results
 */
.tipico-custom-search-bar .popular-search ul li p::before,
.tipico-custom-search-bar .greyd-posts-slider article a::before {
	content: "";
	/* Search-Outline.svg from this folder */
	background: url( "./Search-Outline.svg" ) no-repeat;
	background-size: 20px;
	width: 20px;
	height: 20px;
	display: inline-block;
	margin-right: 10px;
	margin-bottom: -5px;
	padding-right: 25px;
}


/**
 * add custom icon to 'latest search' results
 */
.tipico-custom-search-bar .greyd_latest_search ul li a::before {
	content: "";
	/* Search-Outline.svg from this folder */
	background: url( "./Search-Outline.svg" ) no-repeat;
	background-size: 20px;
	width: 20px;
	height: 20px;
	display: inline-block;
	margin-right: 10px;
	margin-bottom: -5px;
	padding-right: 25px;
}

.tipico-custom-search-bar .greyd_latest_search,
.tipico-custom-search-bar .greyd_latest_search ul {
	gap: 1em;
}

/**
 * Style 'latest search' results on homepage
 */
.tipico-custom-search-bar .greyd_latest_search.inline ul li a {
	font-size: inherit;
}

.tipico-custom-search-bar .greyd_latest_search.inline ul li a::before {
	content: none;
}

.tipico-custom-search-bar .greyd_latest_search.inline,
.tipico-custom-search-bar .greyd_latest_search.inline ul {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 8px;
}

.tipico-custom-search-bar .greyd_latest_search .greyd_latest_search_title {
	margin-top: 0;
}

.tipico-custom-search-bar .greyd_latest_search.inline .greyd_latest_search_title {
	margin: 0;
}

.tipico-search .loading_spinner_wrapper {
	position: absolute !important;
	margin-top: 0 !important;
}

body.has-search-overlay .greyd_latest_search.inline {
	opacity: 0.15;
}


/**
 * Utility classes
 */
.position-unset {
	position: unset !important;
}