.filters{}
.searchBar{
    --radius: 40px;
    border-radius: var(--radius);
    height: 58px;
    width: 100%;
    /* max-width: 900px; */
    margin: 0 0 15px;
    background-color: white;
    padding: 0px 5px 0 20px;
    box-shadow: 3px 3px 16px 5px rgb(218 208 155 / 24%);
    display: flex;
    align-items: center;
    flex-direction: row;
}
.searchBar .searchButton {
    --size: 48px;
    border-radius: calc(var(--size) / 2);
    height: var(--size);
    width: auto;
    background-color: var(--themeGreen2);
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    gap: 10px;
    padding: 20px;
}
.searchBar input{border: none !important;}
.filterBar{
    display:flex;
    gap:10px;
    padding:15px 0;
    flex-wrap: wrap;
}
.filterBar .filterItem{
    display: flex;
    border-radius: 6px;
    color: var(--themeTextDark);
    font-size: 14px;
    font-weight: 400;
    align-items: center;
    gap: 8px;
    border: 1px solid #f2f4f7;
    padding: 7px;
    cursor:pointer;
    transition:all .1s ease-in-out;
    background-color: var(--themeGrey);
}
.filterBar .filterItem:hover,
.filterBar .filterItem.active{
    border-color:var(--themeGreen2);
    background-color:var(--themeGreen2);
    color:#fff;
}
.listBoxInfo{
    display:flex;
    align-items: center;
}
.listBoxInfo span{
    width: 100%;
    flex: 1;
    font-weight: 600;
}
.listBoxInfo select{
    flex: 0;
    width: max-content;
}
.listBox{
    display: flex;
    flex-direction: column;
    gap: 15px;
    align-items: stretch;
}
.listBox .camperinfo-item{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 20px;
    align-items: center;cursor:pointer;

}
.listBox .camperinfo-item .imageHolder{
    width: 160px;
    height: auto;
    aspect-ratio: 4/3;
    border-radius: 10px;
}

.listBox .notakkoord .imageHolder{
    /* filter: grayscale(1); */
}

.listBox .camperinfo-item .item-content{
    width: 100%;
    flex: 1;
}
.listBox .camperinfo-item .item-content h3{
    margin: 0;
}
.listBox .camperinfo-item .item-content h3 font{
    font-size:0.7em;
    color: var(--themeTextLightGrey2);
    display: inline-block;
    line-height: 0.2em;
    padding-left: 6px;
    font-weight: 300;
}
.listBox .camperinfo-item .item-content .score{
    display:flex;
    align-items: center;
    flex-direction: row;
    gap: 10px;
} 
.listBox .camperinfo-item .item-content .score .starScoreHolder span{
     font-weight:bold;   
}
.listBox .camperinfo-item .item-content .score > font{
    color: var(--themeBlueLight2);
    padding-top: 2px;
}
.listBox .camperinfo-item .item-content .score svg{
    width:15px;
    height:15px;
}
.listBox .camperinfo-item .item-content .locatie{
    font-size: 17px;
    color: #5b5b5b59;
    font-weight: 300;
}
.listBox .camperinfo-item .item-content .openstatus{}
.listBox .camperinfo-item .item-content .prijs{
    font-size: 20px;
    font-weight: 600;
}

.listBox .camperinfo-item:not(.notakkoord){
    
}
.listBox .camperinfo-item.notakkoord {
    /* filter: grayscale(1); */
    opacity: 0.6;
}

.listBox .camperinfo-item:not(.notakkoord) h3 svg{
    width: 20px;
    height: 17px;
    transform: translateY(2px);
}
.listBox .camperinfo-item:not(.notakkoord) h3 svg *{
    /* fill: var(--themeGreen2); */
}

.filterBar .spacer{
    width:100%;
    flex:1;
}
 
#editContent .subTitle {
    text-align: left;
    border-top: 1px solid var(--themeBlueLightBg);
    padding-top: 30px;
    margin-top: 23px;
}
#editContent .propertiesHolder{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 5px 15px;
}
#editContent .property{
    --textColor: var(--themeBlueLight2);
    --borderColor: var(--themeBlueLightBg);
    border: 1px solid var(--borderColor);
    color: var(--textColor);
    display: flex;
    width: 100%;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 300;
    align-items: center;
    gap: 8px;    
    padding: 6px 15px;
    padding-left: 30px;
    cursor: pointer;
    min-height: 46px;
}
#editContent .property label{
    display:flex;
    gap: 10px;
}
#editContent .property input,
#editContent .property select{
    margin:0;
    height: auto;
    line-height: 30px;
    border-radius: 4px;
}
#editContent .subsubTitle{
    font-size: 19px;
}
#editContent input{
    margin-bottom:5px;
}

.inputGroup {
    display: flex;
    flex-direction: row;
    gap: 4px;
}

.dataForm label.imageInput .upload_file.uploadFile {
    padding: 20px 15px 55px 15px;
}

/* .upload_file .imagePreview:not(.dummy):nth-of-type(1){
    margin-right: 20px;
    padding:20px;
    outline: 2px solid var(--themeTextLightGrey2);
}
.upload_file .imagePreview:not(.dummy):nth-of-type(1):before{
    position:absolute;
    top: 62px;
    width:100%;
    background-color: #f6f8f94d;
    left:0;
    right:0;
    content:'Logo';
    text-align: center;
    backdrop-filter: blur(2px);
    color: #fff;
    border-radius: 6px;
}
.upload_file .imagePreview:not(.dummy):nth-of-type(1):after{
    position: absolute;
    content:'';
    width:2px;
    height:100%;
    right: -17px;
    top: 0;
    background-color: var(--themeTextLightGrey2);
} */


.clearFilters{
    display: flex;
    border-radius: 6px;
    background-color: var(--themeBlueLightBg);
    color: var(--themeTextDark);
    font-size: 14px;
    font-weight: 400;
    align-items: center;
    gap: 8px;
    border: 1px solid #f2f4f7;
    padding: 7px;
    cursor:pointer;
    margin-bottom: 10px;
    transition:all .1s ease-in-out;
}
.clearFilters:hover,
.clearFilters.active{
    border-color:var(--themeGreen2);
    background-color:var(--themeGreen2);
    color:#fff;
}

.imagePreview.removeImage{
    outline:2px solid red !important;
    opacity:0.2;
}