/* QAKK Venues – kort og slider/liste (farver/skrifter styres via CSS-variabler fra Divi) */

/* Placeholder i Visual Builder – simpel kasse i stedet for fuld visning */
.qakk-venues-vb-placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 120px;
	padding: 24px;
	background: #f0f0f0;
	border: 2px dashed #ccc;
	border-radius: 8px;
	font-size: 1.125rem;
	font-weight: 600;
	color: #333;
}

.qakk-venue-card {
	display: flex;
	flex-direction: column;
	flex-shrink: 0;
	background: var(--qakk-venue-card-bg, #1a365d);
	border-radius: var(--qakk-venue-card-border-radius, 12px);
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	transition: opacity 0.2s;
}

.qakk-venue-card:hover {
	opacity: 0.95;
}

.qakk-venue-card__image-wrap {
	display: block;
	position: relative;
	height: var(--qakk-venue-image-height, 240px);
	background: var(--qakk-venue-placeholder-bg, #ed8936);
	overflow: hidden;
}

.qakk-venue-card__image-wrap img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.qakk-venue-card__img-placeholder {
	width: 100%;
	height: 100%;
	background: var(--qakk-venue-placeholder-bg, #ed8936);
}

.qakk-venue-card__tag {
	position: absolute;
	top: 12px;
	right: 12px;
	background: var(--qakk-venue-tag-bg, #fff);
	color: var(--qakk-venue-tag-color, #1a365d);
	padding: 6px 12px;
	border-radius: var(--qakk-venue-tag-border-radius, 8px);
	font-size: 0.875rem;
	font-weight: 600;
}

.qakk-venue-card__content {
	padding: var(--qakk-venue-card-padding, 20px);
	flex: 1;
	display: flex;
	flex-direction: column;
}

.qakk-venue-card__info-row {
	display: flex;
	width: 100%;
	margin-bottom: 10px;
	border-bottom: 0.5px solid #fff;
	padding-bottom: 20px;
}

.qakk-venue-card__info-col {
	flex: 0 0 50%;
	max-width: 50%;
}

.qakk-venue-card__info-col--price {
	display: flex;
	justify-content: flex-end;
}

.qakk-venue-card__capacity,
.qakk-venue-card__price {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	color: var(--qakk-venue-capacity-color, rgba(255, 255, 255, 0.9));
	font-size: 13px;
	font-weight: 500;
}

.qakk-venue-card__capacity-icon,
.qakk-venue-card__price-icon {
	display: inline-flex;
	flex-shrink: 0;
	width: 18px;
	height: 18px;
	color: var(--qakk-venue-capacity-icon-color, #fff);
}

.qakk-venue-card__capacity-icon svg,
.qakk-venue-card__price-icon svg {
	width: 100%;
	height: 100%;
}

.qakk-venue-card__capacity-text,
.qakk-venue-card__price-text {
	line-height: 15px;
}

/* Shortcode-variant: venstrejusteret, sort tekst/ikon, én række */
.qakk-venue-info-shortcode .qakk-venue-card__info-row {
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 66px;
	border-bottom: 0.5px solid #00000070;
}

.qakk-venue-info-shortcode .qakk-venue-card__info-col {
	display: flex;
	flex: 1 1 calc((100% - 66px * 3) / 4);
	min-width: 0;
	max-width: calc((100% - 66px * 3) / 4);
	align-items: flex-start;
}

.qakk-venue-info-shortcode .qakk-venue-card__info-col--price,
.qakk-venue-info-shortcode .qakk-venue-card__info-col--map,
.qakk-venue-info-shortcode .qakk-venue-card__info-col--info {
	justify-content: flex-start;
	align-items: baseline;
}

.qakk-venue-info-shortcode .qakk-venue-card__map,
.qakk-venue-info-shortcode .qakk-venue-card__capacity,
.qakk-venue-info-shortcode .qakk-venue-card__price,
.qakk-venue-info-shortcode .qakk-venue-card__info {
	display: flex;
	align-items: center;
	gap: 8px;
	color: #000;
	font-size: 17px;
	font-weight: 500;
}

.qakk-venue-info-shortcode .qakk-venue-card__info {
	align-items: flex-start;
}

.qakk-venue-info-shortcode .qakk-venue-card__info-text {
	overflow-wrap: break-word;
	word-wrap: break-word;
	flex: 1;
	min-width: 0;
}

.qakk-venue-info-shortcode .qakk-venue-card__map-icon,
.qakk-venue-info-shortcode .qakk-venue-card__capacity-icon,
.qakk-venue-info-shortcode .qakk-venue-card__price-icon,
.qakk-venue-info-shortcode .qakk-venue-card__info-icon {
	color: #000;
	width: 30px;
	height: 30px;
	display: inline-flex;
	flex-shrink: 0;
}

.qakk-venue-info-shortcode .qakk-venue-card__map-icon svg,
.qakk-venue-info-shortcode .qakk-venue-card__info-icon svg {
	width: 100%;
	height: 100%;
}

.qakk-venue-card__title {
	margin: 0;
	color: var(--qakk-venue-title-color, #fff);
	font-size: 1.25rem;
	font-weight: 700;
	line-height: 1.3;
}

.qakk-venue-card__excerpt {
	margin: 0 0 16px;
	color: var(--qakk-venue-excerpt-color, rgba(255, 255, 255, 0.95));
	font-size: 0.9375rem;
	line-height: 1.5;
	flex: 1;
}

.qakk-venue-card__link {
	display: inline-block;
	position: relative;
	padding: 10px 20px;
	border: 1px solid var(--qakk-venue-btn-border, #fff);
	border-radius: var(--qakk-venue-btn-border-radius, 8px);
	color: var(--qakk-venue-btn-color, #fff);
	text-decoration: none;
	font-weight: 600;
	font-size: 0.9375rem;
	align-self: flex-end;
	transition: background 0.2s, color 0.2s, border-color 0.2s, padding 0.2s;
}

.qakk-venue-card__link[data-icon]:not([data-icon=""]):after {
	content: "\39";
	position: absolute;
	right: 15px;
	top: 12px;
	font-size: inherit !important;
	font-family: ETmodules !important;
	font-weight: 400 !important;
	opacity: 0;
	transition: opacity 0.2s;
}

.qakk-venue-card:hover .qakk-venue-card__link[data-icon]:not([data-icon=""]) {
	padding-right: 2.25em;
}

.qakk-venue-card:hover .qakk-venue-card__link[data-icon]:not([data-icon=""]):after {
	opacity: 1;
}

.qakk-venue-card:hover .qakk-venue-card__link {
	background: var(--qakk-venue-btn-border, #2E3E93);
	color: #fff !important;
}

/* Slider – fuld bredde, knapper overlay på yderste kort */
.qakk-venue-slider-wrap {
	position: relative;
	width: 100%;
	padding: 20px 0;
}

.qakk-venue-slider {
	width: 100%;
	overflow: hidden;
	--qakk-slider-gap: 24px;
	--qakk-slider-n: 3;
	--qakk-slider-card-width: calc((100% - (var(--qakk-slider-n) - 1) * var(--qakk-slider-gap)) / var(--qakk-slider-n));
}

.qakk-venue-slider__track {
	display: flex;
	gap: var(--qakk-slider-gap);
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	-ms-overflow-style: none;
	/* Forhindrer visuelt “hop” ved loop-reset */
	scroll-padding-inline: 0;
}

.qakk-venue-slider__track::-webkit-scrollbar {
	display: none;
}

.qakk-venue-slider__track .qakk-venue-card {
	scroll-snap-align: start;
	width: var(--qakk-slider-card-width);
	min-width: var(--qakk-slider-card-width);
	max-width: var(--qakk-slider-card-width);
}

.qakk-venue-slider__prev,
.qakk-venue-slider__next {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	width: 48px;
	height: 48px;
	background: var(--qakk-venue-nav-bg, #1a365d);
	color: var(--qakk-venue-nav-color, #fff);
	border: none;
	border-radius: var(--qakk-venue-nav-border-radius, 10px);
	cursor: pointer;
	font-size: 1.5rem;
	line-height: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: opacity 0.2s, background 0.2s, color 0.2s;
	pointer-events: auto;
}

.qakk-venue-slider__prev {
	left: -30px;
}

.qakk-venue-slider__next {
	right: -30px;
}

.qakk-venue-slider__prev:hover,
.qakk-venue-slider__next:hover {
	opacity: 0.9;
}

/* Liste */
.qakk-venue-list-wrap {
	padding: 20px 0;
}

.qakk-venue-filter {
	display: flex;
	flex-wrap: wrap;
	gap: 7px;
	margin-bottom: 24px;
}

.qakk-venue-filter__btn {
	padding: 10px;
	background: var(--qakk-venue-filter-bg, #e2e8f0);
	color: var(--qakk-venue-filter-color, #1a365d);
	border: none;
	border-radius: var(--qakk-venue-filter-border-radius, 8px);
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: background 0.2s, color 0.2s;
}

.qakk-venue-filter__btn:hover {
	background: var(--qakk-venue-filter-active-bg, #1a365d);
	color: var(--qakk-venue-filter-active-color, #fff);
}

.qakk-venue-filter__btn.active {
	background: var(--qakk-venue-filter-active-bg, #1a365d);
	color: var(--qakk-venue-filter-active-color, #fff);
}

.qakk-venue-list__items {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
}

.qakk-venue-list-wrap.qakk-venue-loading-more .qakk-venue-list__items::after {
	content: '';
	display: block;
	width: 100%;
	height: 40px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2336414a' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='10' opacity='0.25'/%3E%3Cpath d='M12 2a10 10 0 0 1 10 10'/%3E%3C/svg%3E") no-repeat center;
	background-size: 28px;
	animation: qakk-venue-spin 0.8s linear infinite;
}

@keyframes qakk-venue-spin {
	to { transform: rotate(360deg); }
}

.qakk-venue-list__items .qakk-venue-card {
	max-width: none;
	min-width: 0;
	width: calc(33.333% - 16px);
}

@media (max-width: 980px) {
	.qakk-venue-list__items .qakk-venue-card {
		width: calc(50% - 12px);
	}
}

@media (max-width: 980px) {
	.qakk-venue-slider {
		--qakk-slider-n: 2;
	}
}

@media (max-width: 600px) {
	.qakk-venue-list__items .qakk-venue-card {
		width: 100%;
	}

	.qakk-venue-slider {
		--qakk-slider-n: 1;
	}

	.qakk-venue-slider__prev {
		width: 40px;
		height: 40px;
		font-size: 1.25rem;
		left: 8px;
	}

	.qakk-venue-slider__next {
		width: 40px;
		height: 40px;
		font-size: 1.25rem;
		right: 8px;
	}
}
