#search {
    --edeco-search-primary-color: #00f;
	--edeco-search-primary-hover-color: #0000af;
	--edeco-search-close-button-bg-color: #d95839;
	--edeco-search-close-button-hover-bg-color: #ec603d;
	--edeco-search-close-button-color: #fff;
}

#search,
.search-form-wrapper-fixed {
    position: relative;
}

.suggestionss_result {
    position: absolute;
    z-index: 40;
    width: calc(100% - 3rem);
    padding: 0;
    background-color: #fff;
    border: 1px solid #adadad;
    border-top: 0;
    border-radius: 0 0 5px 5px;
}

.suggestionss_result.hidden {
    height: 0;
    overflow: hidden;
    border: unset;
}

.suggestionss_result.mobile {
    left: 15px;
    width: calc(100% - 31px);
    margin: unset;
}

.result_items {
    display: inline-block;
    width: 100%;
    height: auto;
    max-height: 300px;
    overflow: auto;
    line-height: 1em;
}

.result_items .not_found {
    color: #000;
}

.suggestionss_item {
    display: flex;
    flex-direction: row;
    padding: .75em 1em;
}

.suggestionss_item:nth-of-type(2n) {
    background-color: #f7f7f7;
    box-shadow: 0 0 2px #bfbfbf;
}

.suggestionss_item:hover {
    box-shadow: inset 0 0 1px #072b43;
}

.suggestionss_item .suggestionss_link {
    flex: 1 1 auto;
    line-height: 1.5em;
    align-items: center;
    display: flex;
}

.suggestionss_item img {
    min-width: 50px;
    max-width: 50px;
    padding: 5px;
    margin-left: 10px;
    overflow: hidden;
    background-color: #fff;
    border: 1px solid #bfbfbf;
}

.suggestionss_item .loader {
    width: 20px;
    height: 20px;
    margin: auto;
    border: 5px solid #f7f7f7;
    border-top: 5px solid #bfbfbf;
    border-radius: 50%;
    box-shadow: 0 0 2px #7d7d7d;
    animation: spin 1.5s linear infinite;
}

.suggestionss_result .loading {
    position: absolute;
    right: 0;
    bottom: 0;
    min-height: unset;
}

.suggestionss_result .loading.hidden {
    display: none;
}

.suggestionss_result .loading.initial {
    position: unset;
    right: unset;
    bottom: unset;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.suggestionss_headline {
    padding: 10px;
    color: #000;
    box-shadow: 0 1px 2px #bfbfbf;
}

.suggestionss_headline .keyword {
    display: inline-block;
    max-width: 8ch;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    line-height: 1em;
}

.suggestionss_headline .close-button,
.zoom_img .close-button {
    display: flex;
    align-items: center;
    width: 1.5em;
    height: 1.5em;
    color: #fff;
    text-align: center;
    background-color: var(--edeco-search-close-button-hover-bg-color);
    border: 1px solid var(--edeco-search-close-button-hover-bg-color);
    border-radius: 5px;
    transform: translateY(-0.3em);
}

.zoom_img .close-button.close {
    position: absolute;
    align-self: flex-end;
    aspect-ratio: 1;
    transform: translate(-2px, 2px);
}

.suggestionss_headline .close-button:hover,
.zoom_img .close-button:hover {
    background-color: var(--edeco-search-close-button-hover-bg-color);
}

.suggestionss_headline .close-button span,
.zoom_img .close-button span {
    flex: 1 1 auto;
    margin-top: -4px;
}

.suggestionss_result img.preview_img:hover {
    box-shadow: 0 0 1px var(--edeco-search-primary-hover-color);
    cursor: zoom-in;
}

.suggestionss_result .zoom_img {
    position: absolute;
    top: 56px;
    left: 15px;
    z-index: 10;
    width: calc(100% - 94px);
    height: auto;
    padding: 10px;
    text-align: center;
    background-color: #fff;
    border: 1px solid #bfbfbf;
    box-shadow: 0 0 1px var(--edeco-search-primary-hover-color);
}

.suggestionss_result .zoom_img.hidden {
    display: none;
}

.suggestionss_result .zoom_img img {
    width: auto;
    height: 100%;
    max-height: 250px;
}

/* --- Media Queries --- */

@media (max-width: 379px) {
    .search-wrapper .input-group-append {
        padding-left: unset;
        margin-left: unset;
    }

    .edeco-search-input {
        padding-left: unset;
    }

    .search-wrapper .input-group {
        flex-wrap: nowrap;
    }
}

@media (min-width: 400px) and (max-width: 991px) {
    .suggestionss_result .zoom_img img {
        width: auto;
        height: 100%;
    }
}

@media (max-width: 991px) {
    .suggestionss_result .zoom_img {
        display: flex;
        flex-direction: column;
        gap: 15px;
        height: 100%;
        max-height: calc(100% - 71px);
    }

    .suggestionss_result .zoom_img img {
        width: 100%;
        height: fit-content;
        margin: auto;
    }

    .suggestionss_result .zoom_img_content {
        display: flex;
        height: 100%;
    }
}

@media (min-width: 992px) {
    .zoom_img .close-button {
        display: none;
    }
}

@media (min-width: 992px) and (max-width: 1299px) {
    .suggestionss_result .zoom_img_content {
        width: 100%;
    }

    .suggestionss_result .zoom_img_content img {
        width: 100%;
        height: unset;
        max-height: unset;
    }
}