/*
 * Bouton fixé en bas de l'écran (mobile) sur les pages de services : même rendu que « Réserver ce
 * véhicule » (dégradé jaune, texte bleu marine, sans fond de barre). Visible après 10 % de défilement.
 */
.optr-sticky-cta {
	display: none;
}

@media (max-width: 767px) {
	.optr-sticky-cta {
		position: fixed;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 9980;
		display: block;
		padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px));
		pointer-events: none;
		opacity: 0;
		transform: translateY(100%);
		transition: opacity 0.3s ease, transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
	}

	.optr-sticky-cta.is-visible {
		pointer-events: auto;
		opacity: 1;
		transform: none;
	}

	.optr-sticky-cta__button {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 10px;
		width: 100%;
		padding: 16px 28px;
		border: 0;
		background-image: linear-gradient(180deg, var(--e-global-color-d8e2f4a, #ffdb6e), var(--e-global-color-e9a1b7c, #f4a91f));
		color: var(--e-global-color-primary, #002048);
		font-family: var(--e-global-typography-a1d0c3e-font-family, inherit), sans-serif;
		font-size: var(--e-global-typography-a1d0c3e-font-size, 16px);
		font-weight: var(--e-global-typography-a1d0c3e-font-weight, 400);
		line-height: 1.3;
		text-align: center;
		text-decoration: none;
		box-shadow: 0 10px 30px -10px rgba(0, 32, 72, 0.55);
		transition: color 0.3s ease, background-color 0.3s ease;
	}

	.optr-sticky-cta__button:hover,
	.optr-sticky-cta__button:focus-visible {
		background-color: var(--e-global-color-c0f5a1e, #fff);
		background-image: none;
		color: var(--e-global-color-primary, #002048);
	}

	.optr-sticky-cta__button.is-icon-after {
		flex-direction: row-reverse;
	}

	.optr-sticky-cta__button svg {
		width: 0.9em;
		height: 0.9em;
		fill: currentColor;
	}

	/* Le bas de page reste lisible au-dessus de la barre */
	body:has(.optr-sticky-cta) {
		padding-bottom: calc(78px + env(safe-area-inset-bottom, 0px));
	}

	/* Bulle WhatsApp et bandeau de cookies au-dessus de la barre */
	body:has(.optr-sticky-cta.is-visible) .optr-wa {
		bottom: calc(var(--optr-wa-y, 24px) + 78px + env(safe-area-inset-bottom, 0px));
	}

	body:has(.optr-sticky-cta.is-visible) .optr-consent {
		bottom: calc(90px + env(safe-area-inset-bottom, 0px));
	}

	.optr-wa {
		transition: bottom 0.35s cubic-bezier(0.22, 1, 0.36, 1);
	}
}

@media (prefers-reduced-motion: reduce) {
	.optr-sticky-cta,
	.optr-wa {
		transition: none;
	}
}