/* Search */
.searchContainer{
    width:12em;
    height: 2em;
    position: relative;
    pointer-events: all;
}
.searchContainer input{
    width: 100%;
    height: 100%;
    background-color: #fff;
    border: none;
    border-radius: 2em;
    padding: 0 1.5em 0 2.1em;
    color: var(--colorText);
    font-size: 0.8em;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23000000"><path d="M762.69-160.92 524.46-399.16q-30 22.77-65.79 35.27-35.79 12.5-73.87 12.5-93.58 0-159.11-65.51-65.53-65.51-65.53-159.04 0-93.52 65.51-159.1 65.51-65.57 159.04-65.57 93.52 0 159.1 65.53 65.57 65.53 65.57 159.11 0 39.23-12.88 75.02-12.89 35.8-34.89 64.64l238.23 238.23-37.15 37.16ZM384.77-403.38q72.31 0 122.46-50.16 50.16-50.15 50.16-122.46t-50.16-122.46q-50.15-50.16-122.46-50.16t-122.46 50.16Q212.15-648.31 212.15-576t50.16 122.46q50.15 50.16 122.46 50.16Z"/></svg>');
    background-repeat: no-repeat;
    background-size: 1.7em;
    background-position: 0.3em;   
}
.clearSearch {
    user-select: none;
    width: 2em;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    cursor: pointer;
    align-items: center;
    font-size: 0.7em;
    justify-content: center;
}

.suggestions {
    background-color: var(--colorWhite);
    border-radius: 0.3em;
    margin-top: 0.2em;
    max-height: calc(100vh - 50vh);
    overflow-y: scroll;
}
.suggestions>div {
    font-size: 0.8em;
    padding: 0.2em 0.5em;
    transition: all 0.2s ease;
}
body.hasHover .suggestions>div:hover {
    background-color: var(--colorPrimaryBlue);
    color: #fff;
    cursor: pointer;
    transition-duration: 0s;
}
/* Search */