/**
 * Kommande aktiviteter — dark section with event cards in a horizontal carousel.
 * Built with native Gutenberg blocks; this file styles those blocks.
 */
.kommande-aktiviteter {
	color: var(--wp--preset--color--parchment, #f2e3d6);
	padding-top: clamp(80px, 12vh, 170px);
	padding-bottom: clamp(80px, 12vh, 170px);
	padding-left: clamp(20px, 4vw, 60px);
	padding-right: clamp(20px, 4vw, 60px);
}

.kommande-aktiviteter__heading {
	text-align: center;
	max-width: 650px;
	margin: 0 auto clamp(40px, 6vh, 80px);
	font-family: var(--wp--preset--font-family--ivymode, "ivymode", serif);
	font-weight: 300;
	font-size: clamp(2.5rem, 5vw, 4rem);
	line-height: 1;
}

.kommande-aktiviteter__grid {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: 352px;
	gap: 36px;
	max-width: 1540px;
	margin: 0 auto;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-padding: 0 clamp(20px, 4vw, 60px);
	scrollbar-width: none;
	-ms-overflow-style: none;
	padding-bottom: 4px;
	cursor: grab;
	align-items: stretch;
}
.kommande-aktiviteter__grid > .kommande-aktiviteter__card {
	height: 100%;
}
/* WP's default `.wp-block-group + .wp-block-group` rule adds 24px top
   margin to every sibling group, including grid items. That pushes cards
   2+ visually down within the row (the row stretches, but the card itself
   sits 24px lower and its overflow:hidden bottom corner falls out of the
   row's visual bounds). Zero all margins on grid children. */
.kommande-aktiviteter__grid > * {
	margin: 0 !important;
}
.kommande-aktiviteter__grid::-webkit-scrollbar {
	display: none;
}
.kommande-aktiviteter__grid.is-dragging {
	cursor: grabbing;
	scroll-behavior: auto;
	user-select: none;
	-webkit-user-select: none;
}
.kommande-aktiviteter__grid.is-dragging * {
	pointer-events: none;
}

.kommande-aktiviteter__card {
	background-color: #fff;
	border-radius: 10px;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	color: var(--wp--preset--color--mine-shaft);
	scroll-snap-align: start;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
	will-change: transform;
}
.kommande-aktiviteter__card:hover,
.kommande-aktiviteter__card:focus-within {
	transform: translateY(-6px);
	box-shadow: 0 14px 32px rgba(0, 0, 0, 0.25);
}

@media (max-width: 600px) {
	.kommande-aktiviteter__grid {
		grid-auto-columns: 85%;
	}
}

.kommande-aktiviteter__card-image {
	margin: 0;
}
.kommande-aktiviteter__card-image img {
	width: 100%;
	height: 214px;
	object-fit: cover;
	display: block;
}

.kommande-aktiviteter__card-body {
	background-color: var(--wp--preset--color--cream, #faf4ef);
	padding: 28px 36px 36px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	flex: 1;
}

.kommande-aktiviteter__card-title {
	font-family: var(--wp--preset--font-family--ivymode, "ivymode", serif);
	font-weight: 300;
	font-size: 24px;
	line-height: 1.2;
	margin: 0 0 4px;
}

.kommande-aktiviteter__card-organizer {
	font-size: 16px;
	margin: 0 0 8px;
	opacity: 0.85;
}

/* Meta lines (date / time / location) — icons via CSS pseudo-element */
.kommande-aktiviteter__meta {
	margin: 0;
	font-size: 16px;
	display: flex;
	align-items: center;
	gap: 10px;
	padding-left: 0;
}
.kommande-aktiviteter__meta::before {
	content: "";
	display: inline-block;
	width: 20px;
	height: 20px;
	flex-shrink: 0;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}
.kommande-aktiviteter__meta--date::before {
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='20' viewBox='0 0 18 20' fill='none'><path d='M1 7h16M4 2v3M14 2v3M2 4h14a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1z' stroke='%23292929' stroke-width='1.5' stroke-linecap='round'/></svg>");
}
.kommande-aktiviteter__meta--time::before {
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'><circle cx='10' cy='10' r='8' stroke='%23292929' stroke-width='1.5'/><path d='M10 5v5l3 2' stroke='%23292929' stroke-width='1.5' stroke-linecap='round'/></svg>");
}
.kommande-aktiviteter__meta--location::before {
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='17' height='20' viewBox='0 0 17 20' fill='none'><path d='M8.5 19s6-5.7 6-11.5a6 6 0 1 0-12 0C2.5 13.3 8.5 19 8.5 19z' stroke='%23292929' stroke-width='1.5'/><circle cx='8.5' cy='7.5' r='2.5' stroke='%23292929' stroke-width='1.5'/></svg>");
}

.kommande-aktiviteter__card-cta-wrap {
	margin-top: auto;
	padding-top: 16px;
}
.kommande-aktiviteter__card-cta .wp-block-button__link {
	font-size: 14px !important;
	padding: 10px 20px !important;
	min-width: 0 !important;
}

/* ----- Carousel controls (auto-injected by carousel.js, also used by legacy explicit markup) ----- */
.ka-controls {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 32px;
	margin-top: 48px;
	color: #ffffff;
}

.ka-arrow {
	width: 36px;
	height: 36px;
	padding: 0;
	background: transparent;
	border: 0;
	color: inherit;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	transition: opacity 0.15s ease, background-color 0.15s ease;
}
.ka-arrow:hover:not(:disabled),
.ka-arrow:focus-visible:not(:disabled) {
	background-color: rgba(255, 255, 255, 0.12);
}
.ka-arrow:disabled {
	opacity: 0.3;
	cursor: not-allowed;
}
.ka-arrow--next svg {
	transform: scaleX(-1);
}

.ka-dots {
	display: flex;
	gap: 16px;
	list-style: none;
	margin: 0;
	padding: 0;
	align-items: center;
}
.ka-dots li {
	display: flex;
	list-style: none;
	margin: 0;
}
.ka-dot {
	width: 10px;
	height: 10px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	color: inherit;
	background-color: currentColor;
	cursor: pointer;
	transition: transform 0.15s ease, background-color 0.15s ease;
}
.ka-dot.is-active {
	transform: scale(1.3);
	background-color: var(--wp--preset--color--persimmon, #ff5e47);
}
.ka-dot:hover:not(.is-active),
.ka-dot:focus-visible:not(.is-active) {
	transform: scale(1.15);
}
