/**
 * File: assets/css/components/page-loader.css
 * Description: Page loader styles.
 *
 * MAGIDA GLOBAL UI PASS 4:
 * - Premium dark loader with cyan/violet ring.
 * - Safety animation hides loader if JS fails.
 */

.magida-page-loader {
	position: fixed;
	inset: 0;
	z-index: 2000;
	display: grid;
	place-items: center;
	gap: 18px;
	background:
		radial-gradient(
			circle at center,
			rgba(5, 223, 254, 0.08),
			transparent 24rem
		),
		radial-gradient(
			circle at 60% 45%,
			rgba(124, 106, 251, 0.1),
			transparent 28rem
		),
		var(--magida-black);
	opacity: 1;
	visibility: visible;
	transition:
		opacity 420ms ease,
		visibility 420ms ease;
	animation: magida-loader-safety 320ms ease 4s forwards;
}

.magida-page-loader.is-hidden {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

.magida-page-loader__mark {
	position: relative;
	display: grid;
	place-items: center;
	width: 84px;
	height: 84px;
}

.magida-page-loader__ring {
	position: absolute;
	inset: 0;
	border: 2px solid rgba(190, 189, 229, 0.12);
	border-top-color: var(--magida-cyan);
	border-right-color: var(--magida-violet);
	border-radius: var(--magida-radius-full);
	box-shadow: var(--magida-glow-soft);
	animation: magida-loader-spin 900ms linear infinite;
}

.magida-page-loader__dot {
	width: 14px;
	height: 14px;
	border-radius: var(--magida-radius-full);
	background: var(--magida-gradient-primary);
	box-shadow: var(--magida-glow-medium);
}

.magida-page-loader__text {
	color: var(--magida-text-soft);
	font-family: var(--magida-font-heading);
	font-size: 0.78rem;
	font-weight: 800;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

@keyframes magida-loader-spin {
	to {
		transform: rotate(360deg);
	}
}

@keyframes magida-loader-safety {
	to {
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.magida-page-loader__ring {
		animation: none;
	}

	.magida-page-loader {
		animation-duration: 1ms;
	}
}