/* Algemene instellingen */

.emptySpace{
    width:49%;
}

.reviews-content {
    font-size: 0.9rem;
    list-style: none;
    padding: 0;
    margin: 0;
}
.margin-Bottom{
    margin-bottom:20px;
}
.small-on-mobile img{
    width:36px!important;
}

/* Flex wrapper omliggend de: review-overview-container */

.flex-wrapper{
    display:flex;
    justify-content:space-around;
    width:100%;
    margin: 0 auto !important;
    padding:0;
    gap:30px;

    
}   
.flex-wrapper-section{
position:absolute;
    width:48%;
}

.review-overview-container {
    display: flex;
    overflow: hidden;
    scroll-behavior: smooth;
    padding: 10px 0 50px 0;
    scrollbar-width: none;
    min-height: 305px;
    width:49%;
}
.review-info-container{
    width:49%;
}
.review-overview-container::-webkit-scrollbar {
    display: none;
}


.no-underline:where(:not(.wp-element-button)){

    text-decoration: none!important;
}

.reviewSummary {
  position: relative;

}
.reviewSummary a{
  inset: 0;
  z-index: 10;
}

.has-gradient-stroke{
    background: linear-gradient(white, white) padding-box,
    linear-gradient(106deg, #D9166e, #eb7924) border-box;
    border-radius: 15px;
    border: 4px solid transparent;

}
.last-Item{
    text-align:left;
}

.is-chevron-left::after{
    top: 4px;
    position: relative;
  content: "";
  -webkit-mask: url('data:image/svg+xml; utf8, <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 320 512"><path d="M310.6 246.6l-7.1-7.1c-4.7-4.7-12.3-4.7-17 0L160 365.5 33.4 239c-4.7-4.7-12.3-4.7-17 0l-7.1 7.1c-4.7 4.7-4.7 12.3 0 17l143 143c4.7 4.7 12.3 4.7 17 0l143-143c4.7-4.7 4.7-12.3 0-17z"/></svg>') no-repeat 50% 50%;
  mask: url('data:image/svg+xml; utf8, <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 320 512"><path d="M310.6 246.6l-7.1-7.1c-4.7-4.7-12.3-4.7-17 0L160 365.5 33.4 239c-4.7-4.7-12.3-4.7-17 0l-7.1 7.1c-4.7 4.7-4.7 12.3 0 17l143 143c4.7 4.7 12.3 4.7 17 0l143-143c4.7-4.7 4.7-12.3 0-17z"/></svg>') no-repeat 50% 50%;
  mask-size: auto;
  transform: rotate(-90deg);
  -webkit-mask-size: cover;
  mask-size: cover;
  width: 1rem;
  display: inline-block;
  height: 1rem;
  background-color:#D9166e;
}

/* Individuele review */
.single-review-wrapper {
    flex: 0 0 100%;
    min-height:200px;
    box-sizing: border-box;

    scroll-snap-align: start;
    
}
.top-wrapper-for-review{
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    gap: 15px;
    display:block!important;
    padding: 10px 10px 0px 0px;
}

.vestigingsNaam{
    display:inline;
    font-size:3.5rem;
    color: #333;
    margin:0;
    font-family: "Roboto Condensed", serif;
    font-optical-sizing: auto;
    font-weight: bold;
    font-style: normal;
    line-height:1;
    
}
.subText{
    font-size:1.5rem;
}
.totaalScore{
    color: #333;
   
    font-family: "Roboto Condensed", serif;
    font-optical-sizing: auto;
    font-weight: bold;
    font-style: normal;
    display: inline-block;
    position: relative;
    line-height:0.8;
    transition: transform 0.2s ease;
}

.compacteScore{
    font-size:1.5rem;
    font-weight:bold;
}
.block-display{
    display: block;
}


/* Sterren en stars-wrapper */
.stars-wrapper {
    display: inline-block;
    padding: 1rem 0 0 1.1rem;
    width: 51%;
    text-align: left;
}
/* Ster kleuren */
.single-review-wrapper .fa-star {
    color: gold;
    font-size:0.95rem;
}
.single-review-wrapper .fa-regular.fa-star {
    color: lightgray;
}

/* box wrapper - reviews' inner content */
.box-wrapper {
    margin: 0 0.2rem 0 0.2rem;
    border-radius: 10px;
    border: 2px solid #4AA147;
    overflow: hidden;
    max-height: 250px; 
    transition: max-height 0.3s ease-in-out;
    background:#fff;
}
.box-wrapper.expanded {
    max-height: none; 
}
.box-wrapper li {
    margin-right: 0.2rem;
    font-size: 0.9rem;
}
.read-more-link {
    color: #4AA147;
    cursor: pointer;
    font-size: inherit;
    text-align: left;
    font-style:italic;

}
.box-wrapper li.datumGeplaatst {
    display: inline-block;
    padding: 1.6rem 1rem 0 0;
    font-size: 0.7rem;
    width: 47%;
    text-align: right;
}

/* Content sectie */
.contentArea {
    padding: 1rem 1.1rem;
}
.contentArea .contentHeader {
    margin: 0.3rem 0 0.1rem;
    font-size: 0.7rem;
    font-style: italic;
    color: #4AA147;
}
.contentHeader:focus{
    outline-width: 0px;
    outline-style: none;
}
.contentArea .contentText {
    line-height: 1.5rem;
    padding: 0 1rem 1rem 0;
    min-height:100px;
}
.contentArea .naamReviewer {
    margin-top: 0.3rem;
    display: inline;
}
.contentArea .reviewURL {
    font-size: 0.55rem !important;
    color: #4AA147;
    font-style: italic;
    float: right;
    margin-top: 0.8rem;
  position: relative;
  right: 0;
}

.middle-position{
    height: 131px;
    display: inline-block;
    align-content: center;
}



/* Carrousel knoppen */
.carousel-controls {
    position:relative;
    width: 48%;
    top: 25px;
    text-align: center;


}
.carousel-controls button {
    display:inline;
    justify-content: space-between;
    gap: 10px;
    margin: 0px auto;
    background: #4AA147;
    color: white;
    border: none;
    padding: 7px 10px;
    font-size: 0.9rem;
    font-weight: 700;
    border-radius: 7px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}
.carousel-controls button:hover {
    background: #378334;
}
.carousel-controls button:focus {
    outline: none;
}


/* Categorie/filter knoppen */

.category-buttons{
    display:flex;
    justify-content: left;
    font-size:0.85rem;
    font-weight:bold;
    min-width:740px;
    gap:8px;
}
.filter-button {
    background: #D9166E;
    color: white;
    border: none;
    padding: 8px 10px;
    border-radius: 5px;
    cursor: pointer;
    transition: 0.3s;
    font-weight: 700;
    border:2px solid #D9166E;
    letter-spacing: 0.02rem;
 
}

.dropped {
    margin:0.15rem 0;
}

.filter-button:hover {
    background: #ffffff;
    color:#D9166E;


}

.filter-button.active {
    background: #f569a8;
}
.filter-hover{
    background: #D9166E;
    transition: 0.3s;
    border:2px solid #D9166E;

}
.filter-hover:hover{
    background: #ffffff;
    color:#D9166E!important;
    text-decoration:none!important;

}

.center-on-devices{
    justify-content:end;
}
.custom-columns{
    margin-bottom:20px!important;
}

/* Drop down - "meer" knop */
.dropdown-menu {
    display: none;
    position: absolute;
    background: white;
    border-radius:5px;
    box-shadow:0;
    padding: 8px;
    min-width: 150px;
    z-index: 100;
    justify-content:stretch;
    z-index: 1000;
    gap:2px;
}
.dropdown-toggle{
    border:2px solid #D9166E!important;
    border-radius:5px;
    color:#D9166E;
    background:none;
    border:0;
    padding: 8px 15px;
    cursor:pointer;

}
.dropdown-toggle{
    background: white;
    color:#D9166E;
}

.category-buttons button.active-category {
    background: white;


    color:#D9166E;
}
.dropdown:hover .dropdown-menu {
    display: block;
    cursor:pointer;
}
.dropdown-menu.show{
    display:grid!important;
    
}

/* Navigatie knoppen */
#prevBtn {
position:relative;

}
#nextBtn {
    position:relative;
}

/* Advieskeuze stempel */

.adviesCheck{
position:relative;

}
.adviesCheck img{
    position: absolute;
    top: 0px;
    right: 0;
    float: right;
}
.image-width{
    max-width:73px;
}

.wp-container-core-group-is-layout-4{
    gap:5px!important;
}

/* Responsive styling */
@media (max-width: 1320px) {
.stars-wrapper{
    width:50%;
}
}
@media (max-width: 920px) {
    .review-info-container, .review-overview-container{
        width:100%;
        min-height:305px;
        padding:10px 0 10px 0;
    }
    .review-info-container{
        text-align:center;
    }
    .center-on-devices{
        justify-content:center;
        margin-bottom:25px;
    }
    .content-wrapper{
        margin:0 0 1.5rem 0;
    }
    .category-buttons {
        display: grid;
        min-width:0;
            justify-content: center;
    }

    .box-wrapper{
        min-height:310px;
    }
    .dropdown-menu{
            position: relative;
            box-shadow: 0;
            padding: 0px;
            z-index: 100;
            justify-content: stretch;
            gap:3px;
 
    }
    .dropdown-toggle{
        width:100%;
        margin-bottom: 3px;

    }.contentArea{
        padding:1.8rem 1.1rem;
    }
    .contentArea .contentText{
        min-height:150px;
    }
.reviewSummary{
    text-align:center;
}
.margin-Bottom{
    margin-bottom:0px;
}
    .last-Item{
        margin-bottom:0px;
        
    }
    .filter-button{
        display:grid;
        width:100%;
        min-width:400px;
        justify-content:stretch;
    }

    .top-wrapper{
        margin-top:15px;
        text-align: center;
        padding:15px 10px 0 0;
    }
    .flex-wrapper{
        display:block;
    }

    .box-wrapper li.datumGeplaatst {
        
        margin-right:0;
        width: 48%;
    }
    .carousel-controls {

        width: 100%;
        top: 25px;
        text-align: center;
    }
    .carousel-controls button {

        background: none;
    }
    #prevBtn, #nextBtn {
        background: #4AA147;
        font-size:1rem;
        margin:0 auto;
        position: relative;
        display: inline-block;
    }
    .carousel-controls button:hover {
        color: white;
    }
    .adviesCheck img{
        position:static;

        }
}

@media (max-width: 648px) {
    .top-wrapper, .content-wrapper{
        margin-left:5px;
    }
    .box-wrapper li.datumGeplaatst{
        width:48%;
    }
.contentArea .reviewURL {
    margin-top: 1.2rem;
}
.flex-wrapper-section{
    width:100%;
}
.mobile-padding{
    margin-top:10px;
}
.compacteScore{
    font-size:0.9rem;


}
.image-width{
max-width: 38px !important;
    margin-top: 7px;
    margin-left: 3px;
  }


.wp-image-16609{
   width:36px; 
}
.wp-container-core-group-is-layout-ac64005c{
    gap:0px!important;
}


}