/* Tilpasning for Pinsekirken Betel Podcast: fargene er hentet fra omslagsbildet. */
:root {
	--betel-bg: #e6ded3;
	--betel-tekst: #4a453c;
	--betel-dempet: #5f584c;
	--betel-lenke: #4a453c;
	--betel-knapp: #d8cdbd;
	--betel-skygge: rgba(74, 69, 60, .28);
}

:root.theme-dark {
	--betel-bg: #1f1c18;
	--betel-tekst: #efe8dd;
	--betel-dempet: #c5bbab;
	--betel-lenke: #e2d6c4;
	--betel-knapp: #38332b;
	--betel-skygge: rgba(0, 0, 0, .55);
	color-scheme: dark;
}

@media (prefers-color-scheme: dark) {
	:root.theme-auto {
		--betel-bg: #1f1c18;
		--betel-tekst: #efe8dd;
		--betel-dempet: #c5bbab;
		--betel-lenke: #e2d6c4;
		--betel-knapp: #38332b;
		--betel-skygge: rgba(0, 0, 0, .55);
	}
}

:root.theme-light body,
:root.theme-dark body,
:root.theme-auto body {
	background-color: var(--betel-bg);
	color: var(--betel-tekst);
}

h1 {
	color: var(--betel-tekst);
	text-wrap: balance;
}

main > p {
	color: var(--betel-dempet);
	text-wrap: pretty;
}

.avatar.omslag {
	width: 15rem;
	height: 15rem;
	box-shadow: 0 10px 28px var(--betel-skygge);
}

footer {
	color: var(--betel-dempet);
}

:root.theme-light footer a:not(.button),
:root.theme-dark footer a:not(.button),
:root.theme-auto footer a:not(.button) {
	color: var(--betel-lenke);
}

.tema-knapp {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	min-width: 0;
	max-width: none;
	margin: 0;
	padding: 0;
	position: absolute;
	z-index: 10;
	touch-action: manipulation;
	top: calc(.75rem + env(safe-area-inset-top, 0px));
	right: max(.75rem, env(safe-area-inset-right, 0px));
	color: var(--betel-tekst);
	background-color: var(--betel-knapp);
	border: 0;
	border-radius: 50%;
	cursor: pointer;
}

.tema-knapp[hidden] {
	display: none;
}

.tema-knapp:hover {
	filter: brightness(.95);
}

/* Lys modus viser måne, mørk modus viser sol. */
.tema-sol {
	display: none;
}

:root.theme-dark .tema-sol {
	display: block;
}

:root.theme-dark .tema-maane {
	display: none;
}

@media (prefers-color-scheme: dark) {
	:root.theme-auto .tema-sol {
		display: block;
	}

	:root.theme-auto .tema-maane {
		display: none;
	}
}

.button-pocketcasts {
	--button-text: #ffffff;
	--button-background: #f43e37;
}

.button-overcast {
	--button-text: #ffffff;
	--button-background: #c85a00;
}

.button-castro {
	--button-text: #ffffff;
	--button-background: #00795a;
}

.button-podbean {
	--button-text: #ffffff;
	--button-background: #6b6256;
}

.button-rss {
	--button-text: #ffffff;
	--button-background: #b4540d;
}
