.dlms-toggle {
	--dlms-size: 48px;
	--dlms-isize: 22px;
	--dlms-radius: 50%;
	--dlms-x: 20px;
	--dlms-y: 20px;
	--dlms-lbg: #fff;
	--dlms-lfg: #111;
	--dlms-dbg: #1f1f1f;
	--dlms-dfg: #f5c518;

	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--dlms-size);
	height: var(--dlms-size);
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: var(--dlms-radius);
	cursor: pointer;
	line-height: 1;
	background: var(--dlms-lbg);
	color: var(--dlms-lfg);
	-webkit-tap-highlight-color: transparent;
	transition: transform .2s ease, background-color .2s ease, color .2s ease;
}
.dlms-toggle.dlms-shadow { box-shadow: 0 2px 10px rgba(0, 0, 0, .25); }
.dlms-toggle:hover { transform: scale(1.08); }
.dlms-toggle:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }

html[data-dlms-mode="dark"] .dlms-toggle {
	background: var(--dlms-dbg);
	color: var(--dlms-dfg);
}

.dlms-toggle .dlms-ic {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--dlms-isize);
	height: var(--dlms-isize);
	font-size: var(--dlms-isize);
	line-height: 1;
}
.dlms-toggle .dlms-ic svg,
.dlms-toggle .dlms-ic img {
	width: 100%;
	height: 100%;
	display: block;
	fill: currentColor;
}
.dlms-toggle .dlms-when-dark { display: none; }
html[data-dlms-mode="dark"] .dlms-toggle .dlms-when-dark { display: inline-flex; }
html[data-dlms-mode="dark"] .dlms-toggle .dlms-when-light { display: none; }

/* Floating positions */
.dlms-floating { position: fixed; z-index: var(--dlms-z, 9999); }
.dlms-pos-bottom-right { bottom: var(--dlms-y); right: var(--dlms-x); }
.dlms-pos-bottom-left  { bottom: var(--dlms-y); left: var(--dlms-x); }
.dlms-pos-top-right    { top: var(--dlms-y); right: var(--dlms-x); }
.dlms-pos-top-left     { top: var(--dlms-y); left: var(--dlms-x); }
.dlms-pos-middle-right { top: calc(50% - var(--dlms-size) / 2); right: var(--dlms-x); }
.dlms-pos-middle-left  { top: calc(50% - var(--dlms-size) / 2); left: var(--dlms-x); }

/* Device visibility */
@media (max-width: 767px) { .dlms-hide-mobile { display: none !important; } }
@media (min-width: 768px) { .dlms-hide-desktop { display: none !important; } }

/* Smooth switch */
html.dlms-transition,
html.dlms-transition *,
html.dlms-transition *::before,
html.dlms-transition *::after {
	transition: background-color .3s ease, color .3s ease, border-color .3s ease, fill .3s ease !important;
}