.jobs-filter-container {
    background-color: white;
    padding: 0.5rem;

    & .filter-group{
        &.collapsed{
            & .filter-group-values {
                max-height: 0;
                transform: scaleY(0.95);
                opacity: 0;
            }

            & .toggle-icon{
                transform: rotate(0deg);
            }
        }
        & .toggle-icon {
            display: inline-block;
            transition: transform 0.25s ease;
        }
        .filter-group-key-container {
            display: flex;
            justify-content: space-between;
            align-items: center;
            cursor: pointer;
            margin: 3px;

            &:focus-visible{
                --focus-outline-width: 3px;
            }

            & span.filter-group-key{
                font-family: Akkurat-Bold, sans-serif;
                font-size: 1rem;
            }

            & .filter-toggle-btn{
                border: none;
                background: none;
                font-size: 18px;
                cursor: pointer;
                transition: transform 0.25s ease;
                padding: 0;
                width: 2rem;
                height: 2rem;

                &:focus-visible{
                    color: inherit;
                }
            }
        }

        & ul.filter-group-values{
            list-style: none;
            padding: 0;
            max-height: 1000px;
            overflow: hidden;
            transform-origin: top;
            transition: max-height 0.35s ease, transform 0.35s ease, opacity 0.25s ease;
            margin-bottom: 0;
            & li{
                display: flex;
                align-items: center;
                padding: .2rem .5rem;
                transition: background-color .2s,border-color .2s,box-shadow .2s;
                margin: 2px;
                &:focus-visible{
                    --focus-outline-width: 2px;
                }
                &:hover {
                    cursor: pointer;
                    color: #3b3b3b;
                    background: #eaeaea;
                }
                &::marker{
                    content: "";
                }
                &.row-checked{
                    &:hover{
                        color: #ffffff;
                        background: #639a00;
                    }
                    color: #ffffff;
                    background: #639a00;
                    & .filter-checkbox {
                        border-color: #426700;
                        background: #426700 url(../icons/check-solid-full-white.svg);
                    }
                }
                & .filter-checkbox {
                    display: inline-block;
                    border: 2px solid #ced4da;
                    background: #f4f4f4;
                    width: 20px;
                    height: 20px;
                    color: #3b3b3b;
                    border-radius: 0;
                    transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s;
                    margin-right: 0.5em;
                    flex-shrink: 0;
                    &:hover{
                        border-color: #212121;
                    }
                }
                & .filter-value-text{
                    display: inline-block;
                    max-width: 20rem;
                }
            }
        }
    }
}
.jobs-listing-container {

    & .jobs-listing{
        list-style: none;
        padding-left: 0;
        & .job-entry{
            cursor: pointer;
            & a{
                color: inherit;
                & .job-entry-container {
                    background-color: white;
                    padding: 0.5rem;
                    margin-top: 1rem;
                    border-left: 3px solid transparent;
                    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
                    &:hover{
                        transform: translateX(6px);
                        border-left: 3px solid #639a00;
                        box-shadow: 0 4px 10px rgba(0,0,0,0.15);
                    }
                    & .job-entry-title {
                        font-family: Akkurat-Bold, sans-serif;
                        margin-bottom: 0.75rem;
                    }
                    & .job-entry-additional-info{
                        display: grid;
                        grid-template-columns: 1fr 1fr 1fr 1fr;
                        grid-column-gap: 1rem;
                        & p{
                            margin-bottom: 0;
                        }
                        & .job-entry-end-date {

                        }
                        & .job-entry-salary {

                        }
                        & .job-entry-extent {

                        }
                        & .job-entry-term {

                        }
                        & .clock-icon {
                            height: 1.25rem;
                        }
                    }


                }
                &:focus-visible, &:focus{
                    & .job-entry-container{
                        border-left: 3px solid #639a00;
                    }
                }
            }
            &.hidden{
                display: none;
            }
        }
    }

}
@media (max-width: 1024px){
    .additional-filter-menu{
        display: block;
    }
    .jobs-listing-container {
        & .jobs-listing {
            & .job-entry {
                & a {
                    & .job-entry-container {
                        & .job-entry-additional-info {
                            grid-template-columns: 1fr;
                            & p {
                                display: block;
                            }
                        }
                    }
                }
            }
        }
    }
}
@media (min-width: 1025px){
    .additional-filter-menu{
        display: none;
    }
}
.site-logo .navbar-brand img{
    margin: 0;
}
/*high contrast changes*/
[data-tudo-high-contrast='true']{
    & .jobs-filter-container {
        background-color: white;
        & ul.filter-group-values{
            & li{
                &:hover {
                    color: black;
                    background: white;
                }
                &.row-checked{
                    &:hover{
                        color: #ffffff;
                        background: black;
                    }
                    color: #ffffff;
                    background: black;
                    & .filter-checkbox {
                        border-color: white;
                        background: black url(../icons/check-solid-full-white.svg);
                    }
                }
                & .filter-checkbox {
                    border: 2px solid black;
                    background: white;
                    color: black;
                    &:hover{
                        border-color: white;
                    }
                }
            }
        }
    }
    & .jobs-listing-container {
        & .jobs-listing{
            & .job-entry{
                & a{
                    & .job-entry-container {
                        background-color: white;
                        &:hover{
                            border-left: 3px solid black;
                            box-shadow: 0 4px 10px rgba(0,0,0,0.15);
                        }
                    }
                    &:focus-visible, &:focus{
                        & .job-entry-container{
                            border-left: 3px solid black;
                        }
                    }
                }

            }

        }
    }
}
