/* -------------------------------------------------------
   BASE : Styles communs aux boutons GMR (.gmr-btn)
--------------------------------------------------------- */

/* Transition douce du texte */
.gmr-btn .fl-module-content .uabb-module-content {
    transition: color .6s cubic-bezier(.165, .84, .44, 1);
}

/* Style du bouton */
.gmr-btn .fl-module-content .uabb-creative-button-wrap a.uabb-button {
    position: relative; /* nécessaire pour le :before */
	    padding: 24px 38px;
    border: 1px solid;
    background-clip: border-box;
    border-radius: 0;
    overflow: hidden; /* empêche l'animation de dépasser */
	
	width: 280px;
	/*display: flex;
	align-items: flex-start;*/
}

/* Texte & icône */
.gmr-btn .fl-module-content .uabb-creative-button-wrap .uabb-button-icon,
.gmr-btn .fl-module-content .uabb-creative-button-wrap .uabb-button-text {
    text-transform: uppercase;
    font-family: var(--figtree);
    font-size: 14px;
    line-height: 14px;
    font-weight: var(--semi-bold) !important;
    position: relative;
    z-index: 2;
	    transform-origin: center;
}

/* Mobile (≤768px) */
@media all and (max-width: 768px) {
	/* Style du bouton */
	.gmr-btn .fl-module-content .uabb-creative-button-wrap a.uabb-button {
		width: 100%;
		justify-content: center;
	}
}
/* -------------------------------------------------------
   ANIMATION DU BTN
--------------------------------------------------------- */
/* Animation background (entrée + sortie douces) */
.gmr-btn .fl-module-content .uabb-creative-button-wrap a.uabb-button::before {
    content: "";
    position: absolute;
    inset: 0;
    transform: scaleX(0);
    transform-origin: 0 0;
    transition: 
    transform .6s cubic-bezier(.25, .46, .45, .94), /* animation fluide */
    background-color .6s ease; /* fade doux */
    z-index: 0;
}

.gmr-btn .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover::before {
	transform: scaleX(1);
}

/* -------------------------------------------------------
   ANIMATION DE L’ICÔNE
--------------------------------------------------------- */
.gmr-btn .fl-module-content .uabb-creative-button-wrap .uabb-button-icon {
    display: inline-block;
    transform: rotate(-45deg) scale(1);
    transition: transform .35s cubic-bezier(.25, .46, .45, .94);
}

.gmr-btn .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover .uabb-button-icon {
    transform: rotate(0deg) scale(1);
}

/* -------------------------------------------------------
   ACCESSIBILITÉ
--------------------------------------------------------- */
.gmr-btn .fl-module-content .uabb-creative-button-wrap a.uabb-button:focus {
    outline: none;
}

.gmr-btn .fl-module-content .uabb-creative-button-wrap a.uabb-button:focus-visible {
    outline: 2px solid #0076FF;
    outline-offset: -1px;
}

/* -------------------------------------------------------
   STYLE 1 (.gmr-btn-style-1) - Bouton Turquoise Vif / Texte vert-fonce / Hover-Active Turquoice claire
--------------------------------------------------------- */

/* État normal */
.gmr-btn-style-1 .fl-module-content .uabb-creative-button-wrap a.uabb-button {
    border-color: var(--turquoise-vif);
    background-color: var(--turquoise-vif);
	color: var(--vert-fonce) !important;
}

/* Texte & icône par défaut */
.gmr-btn-style-1 .fl-module-content .uabb-creative-button-wrap .uabb-button-text,
.gmr-btn-style-1 .fl-module-content .uabb-creative-button-wrap .uabb-button-icon {
    color: var(--vert-fonce) !important;
}

/* Hover */
.gmr-btn-style-1 .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover {
    border-color: var(--turquoise-clair) !important;
	color: var(--vert-fonce);
}

.gmr-btn-style-1 .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover::before {
    background-color: var(--turquoise-clair) !important;
}

/* Active */
.gmr-btn-style-1 .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover .uabb-button-text,
.gmr-btn-style-1 .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover .uabb-button-icon,
.gmr-btn-style-1 .fl-module-content .uabb-creative-button-wrap a.uabb-button:focus .uabb-button-text,
.gmr-btn-style-1 .fl-module-content .uabb-creative-button-wrap a.uabb-button:focus .uabb-button-icon,
.gmr-btn-style-1 .fl-module-content .uabb-creative-button-wrap a.uabb-button:active .uabb-button-text,
.gmr-btn-style-1 .fl-module-content .uabb-creative-button-wrap a.uabb-button:active .uabb-button-icon {
    color: var(--vert-fonce);
}

/* -------------------------------------------------------
   STYLE 2 (.gmr-btn-style-2) - CTA Blanc / Texte vert-fonce / Hover-Active Turquoice claire
--------------------------------------------------------- */

/* État normal */
.gmr-btn-style-2 .fl-module-content .uabb-creative-button-wrap a.uabb-button {
    border-color: var(--vert-fonce);
    background-color: var(--blanc);
}

/* Texte & icône par défaut */
.gmr-btn-style-2 .fl-module-content .uabb-creative-button-wrap .uabb-button-text,
.gmr-btn-style-2 .fl-module-content .uabb-creative-button-wrap .uabb-button-icon {
    color: var(--vert-fonce) !important;
}

/* Hover */
.gmr-btn-style-2 .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover {
    border-color: var(--turquoise-clair) !important;
	color: var(--vert-fonce);
}

.gmr-btn-style-2 .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover::before {
    background-color: var(--turquoise-clair) !important;
}

/* Active */
.gmr-btn-style-2 .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover .uabb-button-text,
.gmr-btn-style-2 .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover .uabb-button-icon,
.gmr-btn-style-2 .fl-module-content .uabb-creative-button-wrap a.uabb-button:focus .uabb-button-text,
.gmr-btn-style-2 .fl-module-content .uabb-creative-button-wrap a.uabb-button:focus .uabb-button-icon,
.gmr-btn-style-2 .fl-module-content .uabb-creative-button-wrap a.uabb-button:active .uabb-button-text,
.gmr-btn-style-2 .fl-module-content .uabb-creative-button-wrap a.uabb-button:active .uabb-button-icon {
    color: var(--vert-fonce);
}

/* -------------------------------------------------------
   STYLE 3 (.gmr-btn-style-3) - CTA Transparent Border Turquoi vif / Texte blanc / Hover-Active Blanc
--------------------------------------------------------- */

/* État normal */
.gmr-btn-style-3 .fl-module-content .uabb-creative-button-wrap a.uabb-button {
    border-color: var(--turquoise-vif);
    background-color: transparent;
	color: var(--blanc) !important;
}

/* Texte & icône par défaut */
.gmr-btn-style-3 .fl-module-content .uabb-creative-button-wrap .uabb-button-text,
.gmr-btn-style-3 .fl-module-content .uabb-creative-button-wrap .uabb-button-icon {
    color: var(--blanc) !important;
}

/* Hover */
.gmr-btn-style-3 .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover {
    border-color: var(--blanc) !important;
	color: var(--vert-fonce);
}

.gmr-btn-style-3 .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover::before {
    background-color: var(--blanc) !important;
}

/* Active */
.gmr-btn-style-3 .fl-module-content .uabb-creative-button-wrap a.uabb-button:focus .uabb-button-text,
.gmr-btn-style-3 .fl-module-content .uabb-creative-button-wrap a.uabb-button:focus .uabb-button-icon {
	color: var(--blanc)!important;
}

.gmr-btn-style-3 .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover .uabb-button-text,
.gmr-btn-style-3 .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover .uabb-button-icon,
.gmr-btn-style-3 .fl-module-content .uabb-creative-button-wrap a.uabb-button:active .uabb-button-text,
.gmr-btn-style-3 .fl-module-content .uabb-creative-button-wrap a.uabb-button:active .uabb-button-icon {
    color: var(--vert-fonce)!important;
}

/* -------------------------------------------------------
   STYLE 4 (.gmr-btn-style-3) - CTA Transparent Border Vert Fonce / Texte Vert Fonce / Hover-Active Blanc
--------------------------------------------------------- */

/* État normal */
.gmr-btn-style-4 .fl-module-content .uabb-creative-button-wrap a.uabb-button {
    border-color: var(--vert-fonce);
    background-color: transparent;
	color: var(--blanc) !important;
}

/* Texte & icône par défaut */
.gmr-btn-style-4 .fl-module-content  .uabb-creative-button-wrap .uabb-button-text,
.gmr-btn-style-4 .fl-module-content  .uabb-creative-button-wrap .uabb-button-icon {
    color: var(--vert-fonce) !important;
}

/* Hover */
.gmr-btn-style-4 .fl-module-content  .uabb-creative-button-wrap a.uabb-button:hover {
    border-color: var(--blanc) !important;
	color: var(--vert-fonce);
}

.gmr-btn-style-4 .fl-module-content  .uabb-creative-button-wrap a.uabb-button:hover::before {
    background-color: var(--blanc) !important;
}

/* Active */
.gmr-btn-style-4 .fl-module-content  .uabb-creative-button-wrap a.uabb-button:focus .uabb-button-text,
.gmr-btn-style-4 .fl-module-content  .uabb-creative-button-wrap a.uabb-button:focus .uabb-button-icon {
	color: var(--blanc)!important;
}

.gmr-btn-style-4 .fl-module-content  .uabb-creative-button-wrap a.uabb-button:hover .uabb-button-text,
.gmr-btn-style-4 .fl-module-content  .uabb-creative-button-wrap a.uabb-button:hover .uabb-button-icon,
.gmr-btn-style-4 .fl-module-content  .uabb-creative-button-wrap a.uabb-button:active .uabb-button-text,
.gmr-btn-style-4 .fl-module-content  .uabb-creative-button-wrap a.uabb-button:active .uabb-button-icon {
    color: var(--vert-fonce)!important;
}
/* -------------------------------------------------------
   VERSION CTA
--------------------------------------------------------- */
/* -------------------------------------------------------
   BASE : Styles communs aux boutons GMR (.gmr-btn-inline)
--------------------------------------------------------- */

/* Transition douce du texte */
.gmr-btn-inline .fl-module-content .uabb-module-content {
    transition: color .6s cubic-bezier(.165, .84, .44, 1);
	text-align: left !important;
}

/* Style du bouton */
.gmr-btn-inline .fl-module-content .uabb-creative-button-wrap a.uabb-button {
    position: relative; /* nécessaire pour le :before */
    padding: 0px;
    border: 0;
    background: none;
    border-radius: 0;
	overflow:visible;
	/*display: flex;
	align-items: flex-start;*/
}

.gmr-btn-inline .fl-module-content .uabb-creative-button-wrap a.uabb-button:after {
	content: '';
	position: absolute;
	width: 0; 
	height: 1px;
	display: block;
	right: 0;
	transition: width .5s ease;
	background-color: var(--vert-fonce);
}

/* Texte & icône */
.gmr-btn-inline .fl-module-content .uabb-creative-button-wrap .uabb-button-icon,
.gmr-btn-inline .fl-module-content .uabb-creative-button-wrap .uabb-button-text {
    font-family: var(--figtree);
    font-size: 14px;
    line-height: 14px;
    font-weight: var(--semi-bold) !important;
    position: relative;
    z-index: 2;
}

/* -------------------------------------------------------
   ANIMATION DE L’ICÔNE
--------------------------------------------------------- */
.gmr-btn-inline .fl-module-content .uabb-creative-button-wrap .uabb-button-icon {
    display: inline-block;
    transform: rotate(-45deg) scale(1);
    transition: transform .35s cubic-bezier(.25, .46, .45, .94);
}

.gmr-btn-inline .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover .uabb-button-icon {
    transform: rotate(0deg) scale(1);
}

/* -------------------------------------------------------
   ACCESSIBILITÉ
--------------------------------------------------------- */
.gmr-btn-inline .fl-module-content .uabb-creative-button-wrap a.uabb-button:focus {
    outline: none;
}

.gmr-btn-inline .fl-module-content .uabb-creative-button-wrap a.uabb-button:focus-visible {
    outline: none;
	color:#0076FF !important;
}

.gmr-btn-inline .fl-module-content .uabb-creative-button-wrap a.uabb-button:focus-visible:after {
	  width: 100%;
	  left: 0;
}
.gmr-btn-inline .fl-module-content .uabb-creative-button-wrap a.uabb-button:focus-visible .uabb-button-text,
.gmr-btn-inline .fl-module-content .uabb-creative-button-wrap a.uabb-button:focus-visible .uabb-button-icon{
    color:#0076FF !important;
}
/* -------------------------------------------------------
   STYLE 1 & 2 -- VERSION UPPERCASE OR LOWERCASE
--------------------------------------------------------- */
/* État normal */
.gmr-btn-inline-style-1 .fl-module-content .uabb-creative-button-wrap a.uabb-button,
.gmr-btn-inline-style-2 .fl-module-content .uabb-creative-button-wrap a.uabb-button{
	color: var(--vert-fonce) !important;
	text-align: left !important;
}
/* Texte & icône par défaut */
.gmr-btn-inline-style-1 .fl-module-content .uabb-creative-button-wrap .uabb-button-text {
		text-transform: uppercase;
}
.gmr-btn-inline-style-2 .fl-module-content .uabb-creative-button-wrap .uabb-button-text {
		text-transform: initial;
}
.gmr-btn-inline-style-1 .fl-module-content .uabb-creative-button-wrap .uabb-button-text,
.gmr-btn-inline-style-1 .fl-module-content .uabb-creative-button-wrap .uabb-button-icon,
.gmr-btn-inline-style-2 .fl-module-content .uabb-creative-button-wrap .uabb-button-text,
.gmr-btn-inline-style-2 .fl-module-content .uabb-creative-button-wrap .uabb-button-icon {
    color: var(--vert-fonce) !important;
	height: 100%;
    display: inline-flex;
	transform-origin: center;
}
/* Hover */
.gmr-btn-inline-style-1 .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover,
.gmr-btn-inline-style-2 .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover{
	color: var(--turquoise-fonce)!important;
}
/* Active */
.gmr-btn-inline-style-1 .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover .uabb-button-text,
.gmr-btn-inline-style-1 .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover .uabb-button-icon,
.gmr-btn-inline-style-1 .fl-module-content .uabb-creative-button-wrap a.uabb-button:active .uabb-button-text,
.gmr-btn-inline-style-1 .fl-module-content .uabb-creative-button-wrap a.uabb-button:active .uabb-button-icon,
.gmr-btn-inline-style-2 .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover .uabb-button-text,
.gmr-btn-inline-style-2 .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover .uabb-button-icon,
.gmr-btn-inline-style-2 .fl-module-content .uabb-creative-button-wrap a.uabb-button:active .uabb-button-text,
.gmr-btn-inline-style-2 .fl-module-content .uabb-creative-button-wrap a.uabb-button:active .uabb-button-icon{
    color: var(--turquoise-fonce)!important;
}
.gmr-btm-inline-bi-color .fl-module-content .uabb-creative-button-wrap .uabb-button .uabb-button-icon {
	color: var(--turquoise-vif)!important;
}
.gmr-btm-inline-bi-color .fl-module-content .uabb-creative-button-wrap .uabb-button .uabb-button-text {
	color: var(--blanc) !important;
	text-align: left !important;
}
/* -------------------------------------------------------
   STYLE 3 -- Version underline
--------------------------------------------------------- */
/* État normal */
.gmr-btn-inline-style-3 .fl-module-content .uabb-creative-button-wrap a.uabb-button{
	color: var(--vert-fonce) !important;
}
/* Texte & icône par défaut */
.gmr-btn-inline-style-3 .fl-module-content .uabb-creative-button-wrap .uabb-button-text {
	text-transform: initial;
	font-weight: var(--regular) !important;
}
.gmr-btn-inline-style-3 .fl-module-content .uabb-creative-button-wrap .uabb-button-text,
.gmr-btn-inline-style-3 .fl-module-content .uabb-creative-button-wrap .uabb-button-icon {
    color: var(--vert-fonce) !important;
}
/* Hover */
.gmr-btn-inline-style-3 .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover{
	color: var(--turquoise-fonce)!important;
}
.gmr-btn-inline-style-3 .fl-module-content .uabb-creative-button-wrap a.uabb-button:after {
	background: var(--vert-fonce);
}
.gmr-btn-inline-style-3 .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover:after {
	background: var(--turquoise-fonce)!important;
	width: 100% !important;
	left: 0!important;
}
/* Active */
.gmr-btn-inline-style-3 .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover .uabb-button-text,
.gmr-btn-inline-style-3 .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover .uabb-button-icon,
.gmr-btn-inline-style-3 .fl-module-content .uabb-creative-button-wrap a.uabb-button:active .uabb-button-text,
.gmr-btn-inline-style-3 .fl-module-content .uabb-creative-button-wrap a.uabb-button:active .uabb-button-icon {
    color: var(--turquoise-fonce)!important;
}
/* Bouton partage sur la single article */
.gmr-btn-share .fl-module-content .uabb-creative-button-wrap a.uabb-button .uabb-button-icon {
	transform: rotate(0) scale(1) !important;	
	margin-right: 0 !important;
}

.gmr-btn-share .fl-module-content .uabb-creative-button-wrap a.uabb-button .uabb-button-icon {
  --icon-size-w: 15.315px;
  --icon-size-h: 12.759px;

  display: inline-flex;
  align-items: center;
  gap: 8px;
}

/* l'icône */
.gmr-btn-share .fl-module-content .uabb-creative-button-wrap a.uabb-button .uabb-button-icon:before {
  content: "";
  width: var(--icon-size-w);
  height: var(--icon-size-h);

  /* La couleur de l'icône = background-color */
  background-color: var(--vert-fonce);

  /* Le SVG sert de "masque" */
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15.315 12.759'%3E%3Cpath d='M19.681,12.109,14.055,6.845a.288.288,0,0,0-.223-.1c-.175.008-.4.132-.4.319v2.64a.17.17,0,0,1-.144.163c-5.594.857-7.951,5.044-8.784,9.39-.032.171.2.331.307.2a10.169,10.169,0,0,1,8.453-4.282.2.2,0,0,1,.167.191v2.592a.342.342,0,0,0,.578.211l5.666-5.355a.44.44,0,0,0,.14-.335A.534.534,0,0,0,19.681,12.109Z' transform='translate(-4.502 -6.75)'/%3E%3C/svg%3E") center / contain no-repeat;

  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15.315 12.759'%3E%3Cpath d='M19.681,12.109,14.055,6.845a.288.288,0,0,0-.223-.1c-.175.008-.4.132-.4.319v2.64a.17.17,0,0,1-.144.163c-5.594.857-7.951,5.044-8.784,9.39-.032.171.2.331.307.2a10.169,10.169,0,0,1,8.453-4.282.2.2,0,0,1,.167.191v2.592a.342.342,0,0,0,.578.211l5.666-5.355a.44.44,0,0,0,.14-.335A.534.534,0,0,0,19.681,12.109Z' transform='translate(-4.502 -6.75)'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: all .6s cubic-bezier(.165, .84, .44, 1);;
}

/* changement couleur au hover */

.gmr-btn-share .fl-module-content .uabb-creative-button-wrap a.uabb-button:hover .uabb-button-icon:before {
  background-color: var(--turquoise-fonce);
}



