/* ==========================================================
   Loader de navigation (Barba)
   - recouvre le contenu, le header + player restent visibles au-dessus
   - fond qui apparaît vite, grenouille seulement si ça traîne
   ========================================================== */
#rg-loader {
	position: fixed;
	inset: 0;
	z-index: 99; /* sous le header (z-index 100) → player toujours cliquable */
	background: #fff url('https://cdn.radiogrenouille.com/2026/07/fond-2-e1679563049754_911px.webp') repeat center / 25%;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity 250ms ease, visibility 0s linear 250ms;
}

#rg-loader::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 230px;
	height: 160px;
	max-width: 60vw;
	background: url('https://www.radiogrenouille.com/wp-content/uploads/2026/10/LOADER_GRENOUILLE.gif') no-repeat center / contain;
	transform: translate3d(-50%, -50%, 0);
	opacity: 0;
	transition: opacity 200ms ease;
}

/* Affiché */
body.rg-loading #rg-loader {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transition: opacity 200ms ease, visibility 0s;
}

/* La grenouille n'apparaît que si le chargement dépasse ~400 ms
   (sinon on aurait un flash de gif sur les pages instantanées) */
body.rg-loading #rg-loader::before {
	opacity: 1;
	transition-delay: 400ms;
}

@media (prefers-reduced-motion: reduce) {
	#rg-loader,
	#rg-loader::before,
	body.rg-loading #rg-loader,
	body.rg-loading #rg-loader::before {
		transition: none;
	}
}
