.vayuo-theme-toggle {
	--vayuo-toggle-size: var(--vayuo-touch-target, 44px);
	appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-width: var(--vayuo-toggle-size);
	min-height: var(--vayuo-toggle-size);
	padding: 0 13px;
	border: 1px solid color-mix(in srgb, var(--vayuo-border) 86%, transparent);
	border-radius: 999px;
	background: color-mix(in srgb, var(--vayuo-surface) 92%, transparent);
	color: var(--vayuo-text);
	font: inherit;
	line-height: 1;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
	transition:
		background-color var(--vayuo-transition, 220ms) ease,
		color var(--vayuo-transition, 220ms) ease,
		border-color var(--vayuo-transition, 220ms) ease,
		transform 180ms ease;
}

.vayuo-theme-toggle:hover {
	border-color: color-mix(in srgb, var(--vayuo-accent) 55%, var(--vayuo-border));
}

.vayuo-theme-toggle:active {
	transform: scale(.97);
}

.vayuo-theme-toggle:focus-visible {
	outline: 2px solid var(--vayuo-accent);
	outline-offset: 3px;
}

.vayuo-theme-toggle__icon {
	display: inline-flex;
	width: 18px;
	height: 18px;
}

.vayuo-theme-toggle__icon svg {
	display: block;
	width: 100%;
	height: 100%;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.vayuo-theme-toggle__label {
	font-size: 13px;
	font-weight: 650;
}

.vayuo-theme-toggle--icon {
	width: var(--vayuo-toggle-size);
	padding: 0;
}

.vayuo-theme-toggle--icon .vayuo-theme-toggle__label,
.vayuo-theme-toggle--text .vayuo-theme-toggle__icon {
	display: none;
}

html[data-vayuo-theme="light"] .vayuo-theme-toggle__icon--sun,
html[data-vayuo-theme="dark"] .vayuo-theme-toggle__icon--moon {
	display: none;
}

@media (prefers-reduced-motion: reduce) {
	.vayuo-theme-toggle {
		transition: none;
	}
}