
/* === Yinga Reviews Grid (standaard) === */
.yinga-reviews {
  display: grid;
  gap: 20px;
	margin-bottom: 40px;
	
}


.yinga-review {
  word-wrap: break-word;
  white-space: normal;
}


.yinga-reviews.columns-1 { grid-template-columns: repeat(1, 1fr); }
.yinga-reviews.columns-2 { grid-template-columns: repeat(2, 1fr); }
.yinga-reviews.columns-3 { grid-template-columns: repeat(3, 1fr); }
.yinga-reviews.columns-4 { grid-template-columns: repeat(4, 1fr); }
.yinga-reviews.columns-5 { grid-template-columns: repeat(5, 1fr); }
.yinga-reviews.columns-6 { grid-template-columns: repeat(6, 1fr); }

/* Responsive overrides voor Grid */
@media screen and (max-width: 479px) {
  .yinga-reviews {
    grid-template-columns: 1fr !important;
  }
}

@media screen and (min-width: 480px) and (max-width: 991px) {
  .yinga-reviews.columns-1 { grid-template-columns: repeat(1, 1fr); }
  .yinga-reviews.columns-2 { grid-template-columns: repeat(2, 1fr); }
  .yinga-reviews.columns-3 { grid-template-columns: repeat(2, 1fr); }
  .yinga-reviews.columns-4 { grid-template-columns: repeat(2, 1fr); }
}

/* === Masonry Support (flex layout) === */
.yinga-reviews.masonry {
  display: flex !important;
  flex-wrap: wrap;
  gap: 20px;
  width: 100%;
}

.yinga-reviews.masonry .review-item {
  box-sizing: border-box;
  /* Breedtes worden nu door JS ingesteld */
}

/* Responsive fallback Masonry */
@media screen and (max-width: 479px) {
  .yinga-reviews.masonry .review-item {
    width: 100% !important;
  }
}

/* === Gelijke hoogte zonder Masonry === */
.yinga-reviews:not(.masonry) .review-item {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.yinga-reviews:not(.masonry) .yinga-review {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* Centering container and internal layout */
.yinga-reviews {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding: 0;
  box-sizing: border-box;
}


.yinga-pagination {
    text-align: center;
    margin-top: 20px;
}

.yinga-pagination ul {
    display: inline-flex;
    padding-left: 0;
    list-style: none;
}

.yinga-pagination li {
    margin: 0 3px;
}

.yinga-pagination a,
.yinga-pagination span {
    display: block;
    padding: 8px 14px;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    color: #333;
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* Alleen klasse-definities, geen kleur hier */
.yinga-pagination .current,
.yinga-pagination a:hover {
    color: #fff;
}
