button.svelte-a8pzbb {
		border-radius: 0.5rem;
		cursor: pointer;
		height: max-content;
	}

	button.svelte-a8pzbb:focus {
		outline: none;
	}

	.textbutton {
		padding: 0.4rem 1rem 0.4rem 1rem;
	}

	.large.textbutton {
		padding: 0.4rem 1rem 0.4rem 1rem;
	}

	.icon.large {
		padding: 0.4rem 0 0 0;
		width: 3.5rem;
		height: 3.5rem;
	}

	.icon.normal {
		padding: 0.4rem 0 0 0;
		height: 2.75rem;
		width: 2.75rem;
	}

	.icon.transparent {
		border: 0;
		padding: 0;
		background-color: transparent;
		color: hsl(from var(--vats-text2) h s l / 50%);
	}

	.icon.transparent:hover {
		border: 0;
		background-color: transparent;
		color: red;
	}

	.transparent:hover {
		color: red;
	}

	.normal {
		height: 2.5rem;
		font-size: var(--vats-text-s);
		width: 100%;
	}

	.large {
		height: 3rem;
		font-size: var(--vats-text-m);
		padding: 0 1rem 0 1rem;
		width: 100%;
	}

	.transparent {
		color: hsl(from var(--vats-text2) h s l / 50%);
		border: 0px;
		background-color: transparent;
	}

	.transparent:hover {
		color: hsl(from var(--vats-text2) h s l / 90%);
	}

	.colored {
		background-color: hsl(from var(--vats-coloredtext) h s l / 20%);
		border: 1px solid hsl(from var(--vats-coloredtext) h s l / 50%);
		color: var(--vats-text);
	}

	.colored:hover {
		background-color: hsl(from var(--vats-coloredtext) h s l / 30%);
		border: 1px solid hsl(from var(--vats-coloredtext) h s l / 70%);
	}

	.blue {
		background-color: hsl(from var(--vats-blue) h s l / 0%);
		border: 1px solid var(--vats-blue);
		color: var(--vats-blue);
	}

	.blue:hover {
		background-color: hsl(from var(--vats-blue) h s l / 20%);
		border: 1px solid hsl(from var(--vats-blue) h s l / 70%);
	}

	.darkblue {
		background-color: var(--vats-thx-th);
		border: 1px solid var(--vats-thx-th);
		color: var(--vats-text-inverse);
	}

	.darkblue:hover {
		background-color: hsl(from var(--vats-thx-th) h s l / 80%);
		border: 1px solid var(--vats-thx-th);
	}

	.red {
		background-color: var(--vats-coloredtext);
		border: 1px solid var(--vats-coloredtext);
		color: var(--vats-text-inverse);
	}

	.red:hover {
		background-color: hsl(from var(--vats-coloredtext) h s l / 80%);
	}

	.light {
		background-color: transparent;
		border: 1px solid hsl(from var(--vats-text2) h s l / 30%);
		color: var(--vats-text3);
	}

	.light:hover {
		background-color: hsl(from var(--vats-text3) h s l / 30%);
		border: 1px solid hsl(from var(--vats-text2) h s l / 50%);
	}