.documentation-container.svelte-1y6thfy {
		background-color: var(--bg-main);
		color: var(--fg-main);
		display: flex;
		align-items: start;
		height: 100%;
		width: 100%;
		line-height: 1.5;
	}

	.service-list.svelte-1y6thfy {
		background-color: var(--bg-section);
		color: var(--fg-section);
		min-width: 230px;
		width: 20%;
		height: 100%;
		overflow-y: auto;
		overflow-wrap: anywhere
	}
	.service-list.svelte-1y6thfy h2:where(.svelte-1y6thfy),
	h3.svelte-1y6thfy {
		text-align: center;
		font-size: 1.6rem;
		padding: 0 0.5em;
		margin: 0;
		border-top: 1px solid var(--fg-section);
		font-weight: bold;
		font-size: 1.4rem;
		opacity: 0.5;
	}
	.service-list.svelte-1y6thfy a:where(.svelte-1y6thfy) {
		display: block;
		margin: 0;
		padding: 0.8em 2em;
	}
	.service-list.svelte-1y6thfy a:where(.svelte-1y6thfy):hover {
		background-color: var(--bg-section-hover);
		color: var(--fg-section-hover);
	}
	.service-list.svelte-1y6thfy a.selected:where(.svelte-1y6thfy) {
		background-color: var(--bg-section-selected);
		color: var(--fg-section-selected);
	}

	.service-content.svelte-1y6thfy {
		display: flex;
		justify-content: center;
		flex-grow: 1;
		height: 100%;
		padding: 16px 32px;
		overflow: auto;
	}