/*
 * WF Light Carousel Tekst — Frontend stijlen
 * Pas dit bestand aan voor eigen styling.
 * Variabelen --contrast-3 en --contrast worden meegegeven door het GeneratePress thema.
 */

/* -----------------------------------------------------------------------
   Wrapper
----------------------------------------------------------------------- */
.wflt-carousel-wrapper {
	padding-bottom: 15px;
}

/* -----------------------------------------------------------------------
   Slide
----------------------------------------------------------------------- */
.wflt-swiper .swiper-slide {
	display: flex;
	align-items: center;
	justify-content: center;
}

/* -----------------------------------------------------------------------
   Item (icoon + tekst)
----------------------------------------------------------------------- */
.wflt-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 6px;
	padding: 8px 12px;

	--wflt-title-color:        inherit;
	--wflt-title-font:         inherit;
	--wflt-title-size:         1em;
	--wflt-quotes-color:       inherit;
	--wflt-quotes-font:        inherit;
	--wflt-text-size:          1em;
	--wflt-naam-size:          1em;
	--wflt-marks-color:        inherit;
	--wflt-marks-size:         1em;
}

.wflt-icon {
	color: var(--contrast-3, #f0a500);
	font-size: 1.1em;
	flex-shrink: 0;
}

.wflt-title {
	display: block;
	font-weight: 600;
	margin-bottom: 4px;
	color:       var(--wflt-title-color);
	font-family: var(--wflt-title-font);
	font-size:   var(--wflt-title-size);
}

.wflt-text {
	font-size:   var(--wflt-text-size);
	line-height: 1.5;
	white-space: pre-line;
}

.wflt-naam {
	display:     block;
	font-weight: 600;
	margin-top:  6px;
	font-size:   var(--wflt-naam-size);
}

.wflt-text--quotes {
	color:       var(--wflt-quotes-color);
	font-family: var(--wflt-quotes-font);
}