.js-stylizedx-switcher {
	transition-property: color, background-color, border-color,
		text-decoration-color, fill, stroke;
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
	transition-duration: 150ms;
	padding: 0;
	background-color: #fff;
	border: 1px solid rgb(231 232 236);
	border-radius: 999px;
	width: 1.5rem;
	height: 1.5rem;
	display: inline-flex;
	justify-content: center;
	align-items: center;

	&:hover {
		background-color: #000;
		color: #fff;
	}

	svg {
		width: 0.875rem;
		height: 0.875rem;
		fill: currentColor;
	}
}

html[data-scheme="dark"] {
	.js-stylizedx-switcher {
		background-color: rgb(255 255 255 / 0.15);
		border-color: transparent;
		color: #fff;

		&:hover {
			background-color: #fff;

			svg {
				fill: #000;
			}
		}
	}

	.custom-logo {
		filter: invert(1);
	}
}