/*
 * Stil til det, plugin'et selv skriver ud.
 *
 * Alt andet på sitet sættes i Elementor. Her står kun det, som kortkoderne
 * danner, så de ser rigtige ud, uanset hvor de lægges ind — og så en redaktør
 * ikke kan komme til at slette formateringen ved et uheld.
 *
 * Farverne er de samme som Elementors globale: skovgrøn, sand og strandhavre.
 */

.vp-filer {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.vp-filer a {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	padding: 13px 16px;
	border: 1px solid #E6DFD0;
	border-radius: 10px;
	background: #FFFFFF;
	color: #1B3A2B;
	text-decoration: none;
	font-weight: 500;
	line-height: 1.4;
	transition: border-color .15s ease, background-color .15s ease;
}

.vp-filer a:hover,
.vp-filer a:focus-visible {
	border-color: #B8823C;
	background: #FDFBF6;
}

.vp-filer__maerke {
	flex: 0 0 auto;
	font-size: .8125rem;
	font-weight: 400;
	color: #5E665F;
	white-space: nowrap;
}

/* Knapvarianten: vandret række af mindre, tydelige knapper. */
.vp-filer--knapper {
	flex-direction: row;
	flex-wrap: wrap;
	gap: 10px;
}

.vp-filer--knapper a {
	flex-direction: column;
	align-items: flex-start;
	gap: 2px;
	padding: 11px 18px;
	background: #1B3A2B;
	border-color: #1B3A2B;
	color: #F7F4ED;
}

.vp-filer--knapper a:hover,
.vp-filer--knapper a:focus-visible {
	background: #4A6B57;
	border-color: #4A6B57;
}

.vp-filer--knapper .vp-filer__maerke {
	color: #BFCFC2;
}

@media (prefers-reduced-motion: reduce) {
	.vp-filer a {
		transition: none;
	}
}

/* Sprogvalget i sidehovedet. */

.vp-sprog {
	display: flex;
	gap: 16px;
	align-items: center;
}

.vp-sprog a {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-size: .875rem;
	font-weight: 500;
	color: #5E665F;
	text-decoration: none;
	white-space: nowrap;
}

.vp-sprog a:hover,
.vp-sprog a:focus-visible {
	color: #1B3A2B;
}

.vp-sprog__flag {
	height: 13px;
	width: auto;
	display: block;
	border-radius: 2px;
}

@media (max-width: 480px) {
	.vp-sprog {
		gap: 12px;
	}

	.vp-sprog a span {
		display: none;
	}
}
