﻿#search-term:lang(nl)::before {
    content: ' op ‘';
}

#search-term:lang(fr)::before {
    content: ' sur ‘';
}

#search-term::after {
    content: '’';
}

#search-app .search-result {
    margin: 0 calc(var(--container-padding-x) * -1);
    padding: 1.5rem 1rem;
}

    #search-app .search-result:nth-child(2n+1),
    #search-app .search-result:nth-child(2n+1) .is-restricted.contains-video:after,
    #search-app .search-result:nth-child(2n+1) .is-restricted.is-document:after
    {
        background: rgb(var(--dark-light));
    }

.pharmacybe-cta {
    display: flex;
    flex-direction: column;
    text-align: center;
    gap: 1rem;
    background: white;
    border-radius: .5rem;
    border: 1px solid rgb(var(--grey-light));
    padding: 1rem;
    align-items: center;
    margin: 1rem 0;
    overflow: hidden;
}

.pharmacybe-cta > img {
    display: none;
    height: 115px;
    background: rgb(var(--green));
    margin: -1rem 0 -1rem -1rem;
    padding: 1rem;
}

.pharmacybe-cta > .cta > img {
    height: 1.5rem;
}

.search-result__general-info {
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: .25rem;
    margin-bottom: .4rem
}

.search-result__categories {
    display: flex;
    gap: .25rem;
}

.search-result__title {
    display: table;
    color: rgb(var(--dark));
    font-size: 1.15rem;
    font-weight: 600;
    margin-bottom: .5rem;
}

.search-result__icon {
    margin-bottom: .5rem;
}

.search-result__caption {
    font-size: 1rem;
    margin-bottom: 0;
}

.search-result__date {
    color: rgb(var(--grey));
    font-weight: 600;
}

#search-app .page-sizer {
    display: none;
}

#search-app {
    display: flex; /**/
    flex-direction: column;
    padding: 1.5rem 0;
}

#search-app__sidebar {
    --search-sidebar-padding-top: 1.5rem;
    display: contents;
    flex: 0 0 auto;
    width: 25%;
    padding-top: var(--search-sidebar-padding-top);
}

.search-app__sidebar-container {
    position: sticky;
    top: calc(var(--header-height) + 1.5rem);
    z-index: var(--z-index-search-sidebar);
}

#search-app__filters-wrapper {
    position: sticky;
    top: calc(var(--header-height) + var(--search-sidebar-padding-top));
}

#advanced-options {
    margin: 0 calc(var(--tile-padding-y) * -1);
}

    #advanced-options > div {
        padding: .5rem 0;
    }

    #advanced-options > div > div {
        background: rgb(var(--primary-color-light));
        padding: 0 var(--tile-padding-y);
    }

    #advanced-options .button, #advanced-options input {
        box-shadow: none;
        background: transparent;
        border-color: rgb(var(--primary-color))
    }
.all-articles-option-btn {
    min-width: 7.5rem;
    width: 100% !important;
}
#advanced-options label {
    color: rgb(var(--dark));
}
.advanced-options-grouping {
    flex-wrap: wrap !important;
}

#search-app__filters-title {
    display: none;
}

#search-app__results-container {
    display: contents;
    padding: 1.5rem 0;
}

#search-app__title-container {
    display: contents;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

#advanced-filters-button {
    --button-background-color: var(--primary-color-light);
    --button-foreground-color: var(--primary-color);
    border: 1px solid rgb(var(--primary-color));
}

    #advanced-filters-button::after {
        content: '\e0ad';
        color: rgb(var(--primary-color));
        font-size: 1rem;
        transform: none;
    }

    #advanced-filters-button span {
        display: none;
    }

    #advanced-filters-button:not(.collapsed) span:nth-child(1) {
        display: block
    }

    #advanced-filters-button.collapsed span:nth-child(2) {
        display: block;
    }

#search-app .breadcrumb, #search-app h1 {
    order: -1;
}

#filters {
    padding: 0;
}

#filters * {
    padding: var(--tile-padding-y) var(--tile-padding-x)
}

.spinner {
    display: flex;
    justify-content: center;
    align-content: center;
    margin-top: 210px;
}

[v-cloak] > * {
    display: none;
}

[v-cloak]::before {
    display: none;
}

@media print, screen and (min-width: 768px) {
    .pharmacybe-cta {
        flex-direction: initial;
        text-align: initial;
    }

    .pharmacybe-cta > img {
        display: block;
    }
}

@media print, screen and (min-width: 992px) {
    #search-app {
        flex-direction: row;
        padding: 0;
    }

    #search-app__title-container {
        display: flex;
    }

    #search-app__sidebar, #search-app__results-container {
        display: flex;
        flex-direction: column;
        flex: 0 0 auto;
        width: 25%;
        padding: 0;
    }

    #search-app__filters-title {
        display: block;
        order: -3;
    }

    #search-app__search-bar-container {
        order: -2;
    }

    #search-app__active-filter-container {
        order: -1;
    }

    .button.button--contact {
        display: block;
    }

    #search-app__filters-container {
        display: contents;
    }

        #search-app__filters-container * {
            box-shadow: none;
        }

        #search-app__filters-container .search-bar .button {
            --button-background-color: var(--primary-color);
        }

    #search-app__results-container {
        display: block;
        flex: 0 0 auto;
        width: 75%;
        padding: 0;
    }

    #search-app .search-result {
        margin: 0;
    }

    #search-app .search-result__general-info {
        flex-direction: row;
        align-items: center;
        gap: .65rem;
    }

    #search-app .page-sizer {
        display: flex;
    }

    #advanced-options {
        background: initial;
        margin: 0;
        padding: 0;
    }

        #advanced-options > div, #advanced-options > div > div {
            background-color: transparent;
            padding: 0
        }

        #advanced-options input {
            border-color: rgb(var(--grey-light));
            background: rgb(var(--dark-light));
        }

        #advanced-options .button {
            background: rgb(var(--white));
            border-color: rgb(var(--grey-light));
        }

    #search-app__filters-container input {
        border-color: rgb(var(--grey-light));
    }

    .filter-container > div:first-of-type {
        display: flex !important;
    }

    .filter-container .overview-filter {
        margin-top: 0;
    }
}