footer {
	flex-direction: column;
	align-items: center;
}
footer .bottom-footer {
	display: flex;
	flex-direction: column;
	padding: 1rem 0;
	justify-content: space-between;
	align-items: flex-start;
	align-self: stretch;
	gap: 1rem;
}
@media (min-width: 768px) {
	footer .bottom-footer {
		flex-direction: row;
		align-items: center;
		padding: 1.5rem 0;
	}
}
footer .bottom-footer .cc {
	padding: 0.875rem 0;
}
footer .controls {
	display: flex;
	align-items: flex-start;
	gap: 24px;
}
footer .controls button {
	font-size: 0.75rem;
}

.light-mode footer .mode-selector.light svg circle,
.dark-mode footer .mode-selector.dark svg circle {
	fill: var(--color-text);
}

.light-mode footer .mode-selector.light::after,
.dark-mode footer .mode-selector.dark::after {
	content: "";
	position: absolute;
	bottom: -0.25rem;
	left: 0;
	width: 100%;
	height: 0.125rem;
	background-color: var(--color-btn-inline-text);
}