.mercurius-loader-overlay .centered {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -100px;
}
.mercurius-loader-overlay .spinner {
	 animation: rotator 1.4s linear infinite;
}
 @keyframes rotator {
	 0% {
		 transform: rotate(0deg);
	}
	 100% {
		 transform: rotate(270deg);
	}
}
 .mercurius-loader-overlay .path {
	 stroke: var(--mx-primary, #25639e);
	 stroke-dasharray: 187;
	 stroke-dashoffset: 0;
	 transform-origin: center;
	 animation: dash 1.4s ease-in-out infinite, colors 5.6s ease-in-out infinite;
}
 @keyframes colors {
	 0% {
		 stroke: #4285f4;
	}
	 25% {
		 stroke: #de3e35;
	}
	 50% {
		 stroke: #f7c223;
	}
	 75% {
		 stroke: #1b9a59;
	}
	 100% {
		 stroke: #4285f4;
	}
}
 @keyframes dash {
	 0% {
		 stroke-dashoffset: 187;
	}
	 50% {
		 stroke-dashoffset: 46.75;
		 transform: rotate(135deg);
	}
	 100% {
		 stroke-dashoffset: 187;
		 transform: rotate(450deg);
	}
}

/* Native request overlay; kept outside the content made inert while loading. */
.mercurius-loader-overlay {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 18px;
    padding: 24px;
    text-align: center;
    color: var(--mx-ink, #203d59);
    background: rgba(244, 247, 250, .75);
    cursor: wait;
    outline: none;
}
.mercurius-loader-overlay[hidden] { display: none !important; }
.mercurius-loader-message {
    max-width: 40ch;
    margin: 0;
    font-size: 1rem;
    font-weight: 500;
    overflow-wrap: anywhere;
}
.mercurius-loader-message[hidden] { display: none; }
@media (prefers-reduced-motion: reduce) {
    .mercurius-loader-overlay .spinner,
    .mercurius-loader-overlay .path { animation: none; }
}