html,
body {
	margin: 0;
}

#loading-container {
	font-size: 1em;
	display: flex;
	position: fixed;
	z-index: 1000;
	background: white;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	height: 100vh;
	width: 100vw;
}

#refresh {
	text-decoration: underline;
	display: none;
}

:root {
	--width: 150px;
	--duration: 2400ms;
	--posten-hard: oklch(0.5939 0.2176 29.1);
	--posten-soft: oklch(0.841 0.0872 24.27);
	--bring-hard: oklch(0.6888 0.1935 137.9);
	--bring-soft: oklch(0.8588 0.1048 133.57);
}

#posten-logo-loading {
	cursor: wait;
}

#posten-logo-loading svg {
	width: var(--width);
	transform-origin: 49.77% 36.72%;
	transform-box: view-box;
	animation: spin var(--duration) ease-in-out infinite;
	will-change: transform;
}

#posten-logo-loading #top {
	animation: morph-top var(--duration) ease-in-out infinite;
}

#posten-logo-loading #bottom {
	animation: morph-bottom var(--duration) ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce) {

	#posten-logo-loading svg,
	#posten-logo-loading #top,
	#posten-logo-loading #bottom {
		animation: none;
	}
}

@keyframes spin {
	0% {
		transform: rotate(0deg);
	}

	50% {
		transform: rotate(180deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

/* Posten top shape -> Bring bottom shape */
@keyframes morph-top {

	0%,
	100% {
		d: path("M19.793 20.3915C20.2314 14.9233 24.8575 10.6202 30.5043 10.6202C36.1509 10.6202 40.7773 14.9233 41.2154 20.3915H42.9511C42.4991 9.05465 33.0598 -0.000242274 21.4754 -0.000242274C9.89133 -0.000242274 0.451811 9.05465 0 20.3915H19.793Z");
		fill: var(--posten-soft);
	}

	50% {
		d: path("M19.58 20.4C20.01 14.93 24.59 10.63 30.17 10.63C35.75 10.63 40.32 14.93 40.75 20.4H42.47C42.02 9.06 32.69 0 21.24 0C9.79 0 0.46 9.06 0.01 20.4H19.58Z");
		fill: var(--bring-soft);
	}
}

/* Posten bottom shape -> Bring top shape */
@keyframes morph-bottom {

	0%,
	100% {
		d: path("M41.2154 22.3156C40.777 27.7838 36.1509 32.0868 30.5043 32.0868C24.8575 32.0868 20.2314 27.7838 19.793 22.3156H0C0.451811 33.653 9.89133 42.7079 21.4754 42.7079C33.0598 42.7079 42.4991 33.653 42.9511 22.3156H41.2154Z");
		fill: var(--posten-hard);
	}

	50% {
		d: path("M40.75 22.0996C40.32 27.5696 35.74 31.8696 30.16 31.8696C24.58 31.8696 20.01 27.5696 19.57 22.0996H0C0.46 33.4396 9.79 42.4996 21.24 42.4996C32.69 42.4996 42.02 33.4396 42.47 22.0996H40.75Z");
		fill: var(--bring-hard);
	}
}
