/**
 * Layout: Verhalen slider
 * Slug: verhalen_slider
 */

.workshop_overzicht-layout + .verhalen_slider-layout {
	background-color: var(--fdhl-darkblue);
	padding-block: max(4rem, calc(7 * var(--su)));
}
.workshop_overzicht-layout + .verhalen_slider-layout .pk-grid-container {
	background-color: var(--fdhl-darkblue-dark);
}
.workshop_overzicht-layout + .verhalen_slider-layout .content-col > .pk-heading {
	color: #ffffff;
}
.workshop_overzicht-layout + .verhalen_slider-layout .pk-grid-container .swiper-pagination,
body:has(.hero_hart-layout) .verhalen_slider-layout .pk-grid-container .swiper-pagination {
	--swiper-pagination-color: var(--fdhl-darkblue);
	--swiper-pagination-bullet-inactive-color: var(--fdhl-darkblue);
}

body:has(.hero_hart-layout) .verhalen_slider-layout {
	background-color: var(--fdhl-blue-light);
}
body:has(.hero_hart-layout) .verhalen_slider-layout .pk-grid-container {
	background-color: var(--fdhl-blue-dark);
}
body:has(.hero_hart-layout) .verhalen_slider-layout .content-col > .pk-heading {
	color: #ffffff;
}
body:has(.hero_hart-layout) .verhalen_slider-layout .swiper-slide .pk-button-group {
	--button-bg-1: var(--fdhl-blue-light);
	--button-bg-1-hover: var(--fdhl-blue);
}


.verhalen_slider-layout {
	background-color: rgba(199, 234, 228, 0.5);
	padding-bottom: max(2rem, calc(7 * var(--su)));
	/* padding-top: max(2rem, calc(7 * var(--su))); */
}
.verhalen_slider-layout .pk-grid-container {
	padding: max(3rem, calc(6 * var(--su)))
	max(1.5rem, calc(6 * var(--su)));
	padding-bottom: 2rem;
	background-color: var(--fdhl-green);
	border-radius: 0.75rem;
}

.verhalen_slider-layout .swiper-slide {
	display: flex;
	align-items: stretch;
	gap: 1rem;
	height: auto;
}
.verhalen_slider-layout .swiper-slide .slide-content {
	display: flex;
	flex-direction: column;
	width: 60%;
	background-color: #ffffff;
	padding: max(1.75rem, calc(5.75 * var(--su)))
	max(2rem, calc(7.5 * var(--su)))
	max(1.75rem, calc(5.75 * var(--su)))
	max(1.5rem, calc(5 * var(--su)));
	border-radius: 0.75rem;
}
.verhalen_slider-layout .swiper-slide:not(:has(.slide-image)) .slide-content {
	width: 100%;
}
.verhalen_slider-layout .swiper-slide .slide-content .pk-heading {
	font-family: var(--pk-text-font-family);
}
.verhalen_slider-layout .swiper-slide .slide-content .pk-text:not(:last-child) {
	margin-bottom: max(1rem, calc(1.25 * var(--su)));
}
.verhalen_slider-layout .swiper-slide .slide-content .slide-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: max(1rem, calc(1 * var(--su)));
	margin-top: auto;
}
.verhalen_slider-layout .swiper-slide .slide-content .pk-button-group {
	--button-bg-1: var(--fdhl-green-darker);
	--button-bg-1-hover: var(--fdhl-green-dark);
}
.verhalen_slider-layout .swiper-slide .slide-content .pk-button-group.blue {
	--button-bg-1: var(--fdhl-blue);
	--button-bg-1-hover: var(--fdhl-blue-dark);
}
.verhalen_slider-layout.workshop-module .swiper-slide .slide-content .pk-button-group {
	--button-bg-1: var(--fdhl-darkblue-light);
	--button-bg-1-hover: var(--fdhl-darkblue);
}
.verhalen_slider-layout.workshop-module .swiper-slide .slide-content .pk-button-group.blue {
	--button-bg-1: var(--fdhl-green-darker);
	--button-bg-1-hover: var(--fdhl-green-dark);
}

.verhalen_slider-layout .swiper-slide .slide-image {
	width: 40%;
	border-radius: 0.75rem;
	overflow: hidden;
}
.verhalen_slider-layout .swiper-slide .slide-image img {
	width: 100%;
	height: 100%;
	aspect-ratio: 43/52;
	object-fit: cover;
}

.verhalen_slider-layout .pk-grid-container .swiper-pagination {
	--swiper-pagination-color: var(--fdhl-green);
	--swiper-pagination-bullet-inactive-color: var(--fdhl-green);
	--swiper-pagination-bullet-inactive-opacity: 1;


	position: static;
	background-color: #ffffff;
	width: fit-content;
	margin-inline: auto;
	border-radius: 100px;
	line-height: 0;
	padding: 1rem 1.5rem;
}
.verhalen_slider-layout .pk-grid-container .swiper-pagination .swiper-pagination-bullet {
	border-radius: 100px;
	transition: width 0.2s ease-in-out;
}
.verhalen_slider-layout .pk-grid-container .swiper-pagination .swiper-pagination-bullet-active {
	width: 40px;
}


#verhaalPopup .gform_wrapper {
	--form-bg-color: #ffffff;
	--label-color: var(--pk-text-color);
	--border-color: var(--pk-text-color);
}

@media screen and (min-width: 993px) {
	.verhalen_slider-layout .content-col > .pk-button-group {
		position: relative;
		z-index: 10;
		justify-content: end;
		translate: 1rem -50%;
	}
}

@media screen and (max-width: 767px) {
	body .pk-page .verhalen_slider-layout {
		padding-inline: 0;
	}
	.verhalen_slider-layout .swiper-slide {
		flex-direction: column;
	}
	.verhalen_slider-layout .pk-grid-container .swiper-slide > * {
		width: 100%;
	}
	.verhalen_slider-layout .swiper-slide .slide-content .pk-heading {
		font-size: var(--scaling-h4);
	}

	.verhalen_slider-layout .content-col > .pk-button-group {
		margin-block: 1rem;
	}
}