/* Bouton "Retour en haut de page" (classes/class-back-to-top.php),
   affiché au-delà de 300px de scroll par assets/js/back-to-top.js.
   z-index sous l'overlay du menu mobile (100001, cf. header.css). */
.back-to-top {
	position: fixed;
	right: var(--wp--preset--spacing--30);
	bottom: var(--wp--preset--spacing--30);
	z-index: 50;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 50px;
	height: 50px;
	padding: 0;
	border: 3px solid var(--wp--preset--color--primary);
	border-radius: var(--wp--custom--radius--full);
	background-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
	box-shadow: var(--wp--preset--shadow--soft);
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	transform: translateY(10px);
	transition: opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1),
				transform 0.25s cubic-bezier(0.4, 0, 0.2, 1),
				visibility 0.25s,
				background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1),
				border-color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.back-to-top.is-visible {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.back-to-top:hover {
	background-color: var(--wp--custom--color--primary-hover);
	border-color: var(--wp--custom--color--primary-hover);
}

.back-to-top:focus-visible {
	outline: 3px solid var(--wp--preset--color--secondary);
	outline-offset: 3px;
}

/* Chevron du thème (même SVG que le style de bouton "Avec flèche", cf. style.css),
   pivoté vers le haut. */
.back-to-top::before {
	content: "";
	display: block;
	width: 13px;
	height: 17px;
	background-color: currentColor;
	-webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 13 17" fill="none"><path d="M11.3754 7.74966C11.7904 8.1647 11.7904 8.83872 11.3754 9.25376L5.00038 15.6288C4.58534 16.0438 3.91132 16.0438 3.49628 15.6288C3.08124 15.2137 3.08124 14.5397 3.49628 14.1247L9.12089 8.50005L3.4996 2.87544C3.08456 2.4604 3.08456 1.78638 3.4996 1.37134C3.91464 0.956299 4.58866 0.956299 5.0037 1.37134L11.3787 7.74634L11.3754 7.74966Z" fill="black"/></svg>') no-repeat center / contain;
	mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 13 17" fill="none"><path d="M11.3754 7.74966C11.7904 8.1647 11.7904 8.83872 11.3754 9.25376L5.00038 15.6288C4.58534 16.0438 3.91132 16.0438 3.49628 15.6288C3.08124 15.2137 3.08124 14.5397 3.49628 14.1247L9.12089 8.50005L3.4996 2.87544C3.08456 2.4604 3.08456 1.78638 3.4996 1.37134C3.91464 0.956299 4.58866 0.956299 5.0037 1.37134L11.3787 7.74634L11.3754 7.74966Z" fill="black"/></svg>') no-repeat center / contain;
	transform: rotate(-90deg);
	transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.back-to-top:hover::before {
	transform: rotate(-90deg) translateX(3px);
}

@media (width <= 768px) {
	.back-to-top {
		right: 1rem;
		bottom: 1rem;
		width: 44px;
		height: 44px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.back-to-top,
	.back-to-top::before {
		transition: none;
	}
}