/*========================
*
* 				CTAS WEB STARTER
*
* ======================*/
/********************** STYLE DE BASE DE TOUS LES CTAS */
[class*="cta-"] .fl-module-content .uabb-module-content a {
	/* COMMUNS */
	padding: 10px 24px !important;
}
[class*="cta-"] .fl-module-content .uabb-module-content a span {
	text-transform: uppercase;
	letter-spacing: 0.05em;
}
/* --- cta-principal */
.cta-principal .fl-module-content .uabb-module-content a:visited,
.cta-principal .fl-module-content .uabb-module-content a:active,
.cta-principal .fl-module-content .uabb-module-content a:focus-visible,
.cta-principal .fl-module-content .uabb-module-content a:focus,
.cta-principal .fl-module-content .uabb-module-content a {
	background-color: var(--blanc);
	border: 1px solid transparent !important;
	border-radius: var(--radius-cta-principal) !important;
}

/*AVEC BORDURES*/
.cta-principal.cta-principal-border .fl-module-content .uabb-module-content a:visited,
.cta-principal.cta-principal-border .fl-module-content .uabb-module-content a:active,
.cta-principal.cta-principal-border .fl-module-content .uabb-module-content a:focus-visible,
.cta-principal.cta-principal-border .fl-module-content .uabb-module-content a:focus,
.cta-principal.cta-principal-border .fl-module-content .uabb-module-content a {
	border: 1px solid var(--couleur-principale) !important;
}

/* AVEC BG COULEUR PRINCIPAL */
/*cta-principal cta-principal-border cta-principal-bg*/
/**/
.cta-principal.cta-principal-border.cta-principal-bg .fl-module-content .uabb-module-content a:visited,
.cta-principal.cta-principal-border.cta-principal-bg .fl-module-content .uabb-module-content a:active,
.cta-principal.cta-principal-border.cta-principal-bg .fl-module-content .uabb-module-content a:focus-visible,
.cta-principal.cta-principal-border.cta-principal-bg .fl-module-content .uabb-module-content a:focus,
.cta-principal.cta-principal-border.cta-principal-bg .fl-module-content .uabb-module-content a {
	background-color: var(--couleur-principale) !important;
}

.cta-principal.cta-principal-border.cta-principal-bg .fl-module-content .uabb-module-content a:visited span,
.cta-principal.cta-principal-border.cta-principal-bg .fl-module-content .uabb-module-content a:active span,
.cta-principal.cta-principal-border.cta-principal-bg .fl-module-content .uabb-module-content a:focus-visible span,
.cta-principal.cta-principal-border.cta-principal-bg .fl-module-content .uabb-module-content a:focus span,
.cta-principal.cta-principal-border.cta-principal-bg .fl-module-content .uabb-module-content a:hover span,
.cta-principal.cta-principal-border.cta-principal-bg .fl-module-content .uabb-module-content a span {
	color: var(--blanc) !important;
}

.cta-principal .fl-module-content .uabb-module-content a:focus-visible {
	outline-width: 3px !important;
}

.cta-principal .fl-module-content .uabb-module-content a:visited span,
.cta-principal .fl-module-content .uabb-module-content a:active span,
.cta-principal .fl-module-content .uabb-module-content a:focus-visible span,
.cta-principal .fl-module-content .uabb-module-content a:focus span,
.cta-principal .fl-module-content .uabb-module-content a:hover span,
.cta-principal .fl-module-content .uabb-module-content a span {
	font-family: var(--typo-secondaire);
	font-weight: var(--medium);
	font-size: var(--size-cta-principal);
	color: var(--couleur-secondaire);
}

.cta-principal .fl-module-content .uabb-module-content a:hover {
	background-color: var(--couleur-3);
	border: 1px solid transparent !important;
	border-radius: var(--radius-cta-principal) !important;
}
/*AVEC BORDURES*/
.cta-principal.cta-principal-border .fl-module-content .uabb-module-content a:hover {
	border: 1px solid var(--couleur-principale) !important;
}
/**/
.cta-principal .fl-module-content .uabb-module-content a:hover span {
	color: var(--couleur-secondaire);
}

.cta-principal .fl-module-content .uabb-module-content a .uabb-button-icon {
	color: var(--couleur-secondaire);
}

.cta-principal .fl-module-content .uabb-module-content a:hover .uabb-button-icon {
	color: var(--couleur-secondaire);
}
/********************** ANIMATIONS */

/* Bouton */
[class*="cta-"] .fl-module-content .uabb-module-content a {
	transition:
		background-color 320ms ease,
		border-color 220ms ease,
		color 320ms ease,
		transform 320ms ease,
		box-shadow 320ms ease;
	will-change: transform;
}

/* Texte + icône */
[class*="cta-"] .fl-module-content .uabb-module-content a span,
[class*="cta-"] .fl-module-content .uabb-module-content a .uabb-button-icon {
	transition:
		color 320ms ease,
		transform 320ms ease;
}

/* Texte du CTA */
[class*="cta-"] .fl-module-content .uabb-module-content a .uabb-button-text {
	position: relative;
	display: inline-block;
	text-decoration: none;
}

/* Soulignement animé */
[class*="cta-"] .fl-module-content .uabb-module-content a .uabb-button-text::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0px;

	width: 100%;
	height: 1px;

	background-color: currentColor;

	transform: scaleX(0);
	transform-origin: left;
	transition: transform 320ms ease;
}

/* Hover / focus clavier : soulignement uniquement sur le texte */
[class*="cta-"] .fl-module-content .uabb-module-content a:hover .uabb-button-text::after,
[class*="cta-"] .fl-module-content .uabb-module-content a:focus-visible .uabb-button-text::after {
	transform: scaleX(1);
}

/* Micro mouvement au survol */
[class*="cta-"] .fl-module-content .uabb-module-content a:hover {
	transform: translateY(0);
}

/* Icône */
[class*="cta-"] .fl-module-content .uabb-module-content a .uabb-button-icon {
	font-size: 16px;
}

/* Icône légèrement poussée */
[class*="cta-"] .fl-module-content .uabb-module-content a:hover .uabb-button-icon,
[class*="cta-"] .fl-module-content .uabb-module-content a:focus-visible .uabb-button-icon {
	transform: translateX(6px);
}

/* Clic */
[class*="cta-"] .fl-module-content .uabb-module-content a:active {
	transform: translateY(0);
}
/*
 * Focus clavier accessible.
 * On évite le gros outline par défaut au clic souris,
 * mais on conserve un repère visuel propre lors de la navigation au clavier.
 */
:where(.fl-builder-content, .fl-page) :is(
	a[href],
	button,
	input,
	select,
	textarea,
	[tabindex]:not([tabindex="-1"])
):focus {
	outline: none;
}

:where(.fl-builder-content, .fl-page) :is(
	a[href],
	button,
	input,
	select,
	textarea,
	[tabindex]:not([tabindex="-1"])
):focus-visible {
	outline: 1px solid var(--couleur-principale);
	outline-offset: 2px;
}
/* Accessibilité */
@media (prefers-reduced-motion: reduce) {
	[class*="cta-"] .fl-module-content .uabb-module-content a,
	[class*="cta-"] .fl-module-content .uabb-module-content a span,
	[class*="cta-"] .fl-module-content .uabb-module-content a .uabb-button-icon,
	[class*="cta-"] .fl-module-content .uabb-module-content a .uabb-button-text::after {
		transition: none;
		transform: none;
	}
}

/*========== Responsive ==========*/
@media (max-width: 768px) {
	/* Largeur à 100% pour tous les CTAs à partir de 768px */
	[class*="cta-"] {
		width: 100%;
	}

	[class*="cta-"] .fl-module-content .uabb-module-content a {
		width: 100% !important;
	}
}