/* Styles de base pour les boutons */
.wp-block-button__link {
    padding: .35rem 1rem;
    white-space: nowrap;
}

.wp-block-button[class*="has-icon__"].wp-block-button__width-100 .wp-block-button__link {
justify-content: center;
}


/* Style filled-orange */
.wp-block-button.is-style-filled-orange .wp-block-button__link {
    background-color: var(--wp--preset--color--orange);
    color: var(--wp--preset--color--dark-blue);
    padding: 0.5rem 2.25rem;
    font-weight: bold;
    border-radius: 30px;
    border: 1px solid transparent;
}

.wp-block-button.is-style-filled-orange .wp-block-button__link:hover {
    background-color: rgba(255, 255, 255, 0.85);
}


/* Style filled-jaune */
.wp-block-button.is-style-filled-jaune * {
    z-index: 10;
    position: relative;
    }


.wp-block-button.is-style-filled-jaune {
    background-color: var(--wp--preset--color--yellow);
    font-weight: bold;
    border-radius: 30px;
    border: 1px solid var(--wp--preset--color--yellow);;
    position: relative;
    overflow: hidden;
    transition: all ease-in 250ms;
}

.wp-block-button.is-style-filled-jaune .wp-block-button__link {
    color: var(--wp--preset--color--dark-blue);
}


.wp-block-button.is-style-filled-jaune:hover {
    background-color: transparent;
}

.wp-block-button.is-style-filled-jaune:hover  .wp-block-button__link {
    color: var(--wp--preset--color--yellow)
}

.wp-block-button.is-style-filled-jaune:after {
    content:"";
    top:1px;
    bottom:1px;
    width: 100%;
    position: absolute;
    background-color: var(--wp--preset--color--dark-blue);
    color:white;
   left: -100%;
    z-index: 0!important;
    transition: all ease-in 250ms;
    border-radius: 30px;

}

.wp-block-button.is-style-filled-jaune:hover:after {
    left: 0;
    right:1px;
    }





/* Style filled-dark-blue : plein bleu foncé, texte blanc. Au survol, il se vide
   et devient le pendant du style « Contour bleu foncé ».
   L'ancien survol laissait le texte blanc sur un fond blanc à 85 % : le libellé
   disparaissait. */
.wp-block-button.is-style-filled-dark-blue .wp-block-button__link {
    background-color: var(--wp--preset--color--dark-blue);
    color: var(--wp--preset--color--base);
    padding: calc(0.5rem - 1px) calc(2.25rem - 1px);
    font-weight: bold;
    border: 2px solid var(--wp--preset--color--dark-blue);
    border-radius: 30px;
    transition: background-color 250ms ease-in, color 250ms ease-in;
}

.wp-block-button.is-style-filled-dark-blue .wp-block-button__link:hover,
.wp-block-button.is-style-filled-dark-blue .wp-block-button__link:focus-visible {
    background-color: transparent;
    color: var(--wp--preset--color--dark-blue);
}



/* Style outline */ 

.wp-block-button.is-style-outline .wp-block-button__link {
    color:currentColor;
    position: relative;
    overflow: hidden;
}

.wp-block-button.is-style-outline .wp-block-button__link:before {
    content:"";
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: var(--wp--preset--color--dark-blue);
    color:white;
    border-color: var(--wp--preset--color--dark-blue);
    left: -100%;
    z-index: 0!important;
    transition: all ease-in 250ms;
}

.wp-block-button.is-style-outline .wp-block-button__link * {
z-index: 10;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover {
    color: white;
    border-color: var(--wp--preset--color--dark-blue);
}

.wp-block-button.is-style-outline .wp-block-button__link:hover:before {
left: 0;
}

/* Style contour-bleu : contour bleu foncé, fond transparent, texte bleu foncé.
   Au survol et au focus clavier, le bouton se remplit et le texte passe en blanc.
   Le contour est retranché des marges internes : la taille reste celle des
   boutons pleins, qui n'ont qu'un liseré d'un pixel. */
.wp-block-button.is-style-contour-bleu .wp-block-button__link {
    background-color: transparent;
    color: var(--wp--preset--color--dark-blue);
    border: 2px solid var(--wp--preset--color--dark-blue);
    padding: calc(0.5rem - 1px) calc(2.25rem - 1px);
    font-weight: bold;
    border-radius: 30px;
    transition: background-color 250ms ease-in, color 250ms ease-in;
}

.wp-block-button.is-style-contour-bleu .wp-block-button__link:hover,
.wp-block-button.is-style-contour-bleu .wp-block-button__link:focus-visible {
    background-color: var(--wp--preset--color--dark-blue);
    color: var(--wp--preset--color--base);
}


/* Style contour-blanc : le même, pour les fonds sombres. */
.wp-block-button.is-style-contour-blanc .wp-block-button__link {
    background-color: transparent;
    color: var(--wp--preset--color--base);
    border: 2px solid var(--wp--preset--color--base);
    padding: calc(0.5rem - 1px) calc(2.25rem - 1px);
    font-weight: bold;
    border-radius: 30px;
    transition: background-color 250ms ease-in, color 250ms ease-in;
}

.wp-block-button.is-style-contour-blanc .wp-block-button__link:hover,
.wp-block-button.is-style-contour-blanc .wp-block-button__link:focus-visible {
    background-color: var(--wp--preset--color--base);
    color: var(--wp--preset--color--dark-blue);
}


/* Style contour-blanc : le même, pour les fonds sombres. */
.wp-block-button.is-style-contour-jaune .wp-block-button__link {
    background-color: transparent;
    color: var(--wp--preset--color--yellow);
    border: 2px solid var(--wp--preset--color--yellow);
    padding: calc(0.5rem - 1px) calc(2.25rem - 1px);
    font-weight: bold;
    border-radius: 30px;
    transition: background-color 250ms ease-in, color 250ms ease-in;
}

.wp-block-button.is-style-contour-jaune .wp-block-button__link:hover,
.wp-block-button.is-style-contour-jaune .wp-block-button__link:focus-visible {
    background-color: var(--wp--preset--color--yellow);
    color: var(--wp--preset--color--dark-blue);
}


/* Style texte-bleu : ni fond ni contour, seulement le texte souligné.
   Au survol, le soulignement s'épaissit et la couleur ne bouge pas :
   l'orange des liens ne donne que 2,4:1 sur blanc, loin des 4,5:1 exigés. */
.wp-block-button.is-style-texte-bleu .wp-block-button__link {
    background-color: transparent;
    color: var(--wp--preset--color--dark-blue);
    border: 0;
    border-radius: 0;
    padding: 0.5rem 0;
    font-weight: bold;
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 0.3em;
    transition: text-decoration-thickness 250ms ease-in, text-underline-offset 250ms ease-in;
}

.wp-block-button.is-style-texte-bleu .wp-block-button__link:hover,
.wp-block-button.is-style-texte-bleu .wp-block-button__link:focus-visible {
    text-decoration-thickness: 4px;
    text-underline-offset: 0.22em;
}


@media (prefers-reduced-motion: reduce) {
    .wp-block-button.is-style-contour-bleu .wp-block-button__link,
    .wp-block-button.is-style-contour-blanc .wp-block-button__link,
    .wp-block-button.is-style-texte-bleu .wp-block-button__link {
        transition: none;
    }
}