.loading-spin.sdmbridge-web-spinner {
	animation: none !important;
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	color: var(--fs-color-primary, var(--primary-color, var(--sdmb-spinner-primary-light, #1d2327))) !important;
	display: block !important;
	height: 40px;
	margin: 0 auto !important;
	opacity: .72 !important;
	overflow: visible !important;
	transform: none !important;
	width: 41px;
}

.loading-spin.sdmbridge-web-spinner::after,
.loading-spin.sdmbridge-web-spinner::before {
	content: none !important;
	display: none !important;
}

.sdmbridge-web-spinner > svg {
	display: block;
	height: 100%;
	overflow: visible;
	width: 100%;
}

.sdmbridge-spinner-write.is-s {
	animation: sdmbridge-write-s 3.4s linear infinite;
	stroke-dashoffset: 8660;
}

.sdmbridge-spinner-write.is-left {
	animation: sdmbridge-write-left 3.4s linear infinite;
	stroke-dashoffset: 937;
}

.sdmbridge-spinner-write.is-right {
	animation: sdmbridge-write-right 3.4s linear infinite;
	stroke-dashoffset: 937;
}

@keyframes sdmbridge-write-s {
	0%, 3.5% { stroke-dashoffset: 8660; }
	60%, 98.5% { stroke-dashoffset: 0; }
	100% { stroke-dashoffset: 8660; }
}

@keyframes sdmbridge-write-left {
	0%, 61% { stroke-dashoffset: 937; }
	76%, 98.5% { stroke-dashoffset: 0; }
	100% { stroke-dashoffset: 937; }
}

@keyframes sdmbridge-write-right {
	0%, 77% { stroke-dashoffset: 937; }
	92%, 98.5% { stroke-dashoffset: 0; }
	100% { stroke-dashoffset: 937; }
}

html.dark .loading-spin.sdmbridge-web-spinner,
body.dark-mode .loading-spin.sdmbridge-web-spinner,
[data-theme="dark"] .loading-spin.sdmbridge-web-spinner {
	color: var(--primary-color-dark, var(--sdmb-spinner-primary-dark, var(--sdmb-spinner-primary-light, #f7f9fc))) !important;
}

@media (prefers-reduced-motion: reduce) {
	.sdmbridge-spinner-write {
		animation: none !important;
		stroke-dashoffset: 0 !important;
	}
}