/* ==== Bouton hover animé ==== */
/* .is-style-primary .wp-block-button__link,
.is-style-secondary .wp-block-button__link,
.is-style-tertiary .wp-block-button__link {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    z-index: 1;
    border-radius: 100px;
    text-decoration: none;
    transition: color 0.3s ease;
}
.is-style-primary .wp-block-button__link::after,
.is-style-secondary .wp-block-button__link::after,
.is-style-tertiary .wp-block-button__link::after {
    content: "";
    position: absolute;
    inset: -1px;
    z-index: -2;
    border-radius: inherit;
}
.is-style-primary .wp-block-button__link::before,
.is-style-secondary .wp-block-button__link::before,
.is-style-tertiary .wp-block-button__link::before {
    content: "";
    position: absolute;
    inset: 0;
    width: 0;
    height: 100%;
    transition: width 0.4s ease;
    z-index: -1;
}
.is-style-primary .wp-block-button__link:hover::before,
.is-style-secondary .wp-block-button__link:hover::before,
.is-style-tertiary .wp-block-button__link:hover::before {
    width: 100%;
}

.wp-block-button__link .icon {
    margin-right: 0.5em;
    width: 1.2em;
    height: 1.2em;
    flex-shrink: 0; /* Empêche l'icône de rétrécir si le conteneur est trop petit */
/*} */
/* ==== Bouton Principal ==== */
/* .is-style-primary .wp-block-button__link {
    background-color: var(--wp--preset--color--btn-primary-bg);
    border: 1px solid var(--wp--preset--color--btn-primary-bg);
    color: var(--wp--preset--color--btn-primary-text);
}

.is-style-primary .wp-block-button__link::before {
    background-color: var(--wp--preset--color--btn-primary-bg-hover);
}
.is-style-primary .wp-block-button__link:hover {
    color: var(--wp--preset--color--btn-primary-text-hover);
} */

/* ==== Bouton Secondaire ==== */
/* .is-style-secondary .wp-block-button__link {
    background-color: var(--wp--preset--color--btn-secondary-bg);
    border: 1px solid var(--wp--preset--color--btn-secondary-bg);
    color: var(--wp--preset--color--btn-secondary-text);
}
.is-style-secondary .wp-block-button__link::after {
    background-color: var(--wp--preset--color--btn-secondary-bg);
}
.is-style-secondary .wp-block-button__link::before {
    background-color: var(--wp--preset--color--btn-secondary-bg-hover);
}
.is-style-secondary .wp-block-button__link:hover {
    color: var(--wp--preset--color--btn-secondary-text-hover);
} */

/* ==== Bouton Tertiaire ==== */
/* .is-style-tertiary .wp-block-button__link {
    background-color: var(--wp--preset--color--btn-tertiary-bg);
    border: 1px solid #D9D9D9;
    color: var(--wp--preset--color--btn-tertiary-text);
}
.is-style-tertiary .wp-block-button__link::after {
    background-color: var(--wp--preset--color--btn-tertiary-bg);
}
.is-style-tertiary .wp-block-button__link::before {
    background-color: var(--wp--preset--color--btn-tertiary-bg-hover);
}
.is-style-tertiary .wp-block-button__link:hover {
    color: var(--wp--preset--color--btn-tertiary-text-hover);
} */

/* ==========================================================================
   1. BASE COMMUNE & RESET (Gutenberg & FluentForm)
   ========================================================================== */

/* On cible .wp-block-button__link qui est commun aux deux */
.is-style-primary .wp-block-button__link,
.is-style-secondary .wp-block-button__link,
.is-style-tertiary .wp-block-button__link {
    position: relative;
    overflow: hidden;
    display: inline-flex; /* inline-flex est plus stable pour les boutons */
    align-items: center;
    justify-content: center;
    z-index: 1;
    border-radius: 100px;
    text-decoration: none;
    transition: all 0.3s ease;
    cursor: pointer;
    padding: 12px 40px;;
    
    /* Reset spécifique pour l'élément <button> de FluentForm */
    border: none;
    font-family: inherit;
    font-size: inherit;
    appearance: none;
    box-shadow: none;
}

/* On s'assure que le wrapper FluentForm ne limite pas la largeur */
.ff_submit_btn_wrapper.is-style-primary,
.ff_submit_btn_wrapper.is-style-secondary,
.ff_submit_btn_wrapper.is-style-tertiary {
    width: auto;
}

/* ==========================================================================
   2. ANIMATION HOVER (BEFORE/AFTER)
   ========================================================================== */

/* L'arrière-plan de base (optionnel selon ton design) */
.is-style-primary .wp-block-button__link::after,
.is-style-secondary .wp-block-button__link::after,
.is-style-tertiary .wp-block-button__link::after {
    content: "";
    position: absolute;
    inset: -1px;
    z-index: -2;
    border-radius: inherit;
}

/* Le volet qui glisse au hover */
.is-style-primary .wp-block-button__link::before,
.is-style-secondary .wp-block-button__link::before,
.is-style-tertiary .wp-block-button__link::before {
    content: "";
    position: absolute;
    inset: 0;
    width: 0;
    height: 100%;
    transition: width 0.4s ease;
    z-index: -1;
}

.is-style-primary .wp-block-button__link:hover::before,
.is-style-secondary .wp-block-button__link:hover::before,
.is-style-tertiary .wp-block-button__link:hover::before {
    width: 100%;
}

/* ==========================================================================
   3. VARIANTES DE COULEURS
   ========================================================================== */

/* ---- Principal (Primary) ---- */
.is-style-primary .wp-block-button__link {
    background-color: var(--wp--preset--color--btn-primary-bg) !important;
    border: 1px solid var(--wp--preset--color--btn-primary-bg) !important;
    color: var(--wp--preset--color--btn-primary-text) !important;
}

.is-style-primary .wp-block-button__link::before {
    background-color: var(--wp--preset--color--btn-primary-bg-hover);
}

.is-style-primary .wp-block-button__link:hover {
    color: var(--wp--preset--color--btn-primary-text-hover) !important;
}

/* ---- Secondaire (Secondary) ---- */
.is-style-secondary .wp-block-button__link {
    background-color: var(--wp--preset--color--btn-secondary-bg) !important;
    border: 1px solid var(--wp--preset--color--btn-secondary-bg) !important;
    color: var(--wp--preset--color--btn-secondary-text) !important;
}

.is-style-secondary .wp-block-button__link::before {
    background-color: var(--wp--preset--color--btn-secondary-bg-hover);
}

.is-style-secondary .wp-block-button__link:hover {
    color: var(--wp--preset--color--btn-secondary-text-hover) !important;
}

/* ---- Tertiaire (Tertiary) ---- */
.is-style-tertiary .wp-block-button__link {
    background-color: var(--wp--preset--color--btn-tertiary-bg) !important;
    border: 1px solid #D9D9D9 !important;
    color: var(--wp--preset--color--btn-tertiary-text) !important;
}

.is-style-tertiary .wp-block-button__link::before {
    background-color: var(--wp--preset--color--btn-tertiary-bg-hover);
}

.is-style-tertiary .wp-block-button__link:hover {
    color: var(--wp--preset--color--btn-tertiary-text-hover) !important;
}

/* ==========================================================================
   4. GESTION DE L'ICÔNE (Optionnel)
   ========================================================================== */
.wp-block-button__link .icon, 
.wp-block-button__link svg {
    margin-right: 0.5em;
    width: 1em;
    height: 1em;
    flex-shrink: 0;
}

/* ==========================================================================
   NEUTRALISATION DU HOVER PAR DÉFAUT DE FLUENTFORM
   ========================================================================== */

/* On cible spécifiquement le bouton au survol pour annuler les styles du plugin */
.ff-btn-submit:hover, 
.ff-btn-submit:focus, 
.ff-btn-submit:active {
    /* On force le fond à rester identique à l'état normal */
    background-color: var(--wp--preset--color--btn-primary-bg) !important;
    border-color: var(--wp--preset--color--btn-primary-bg) !important;
    
    /* On annule les effets de luminosité/opacité souvent utilisés par FF */
    filter: none !important;
    opacity: 1 !important;
    box-shadow: none !important;
    transform: none !important;
    
    /* Important : on s'assure que la couleur du texte ne change pas 
       (elle sera gérée par ton sélecteur précédent) */
    color: var(--wp--preset--color--btn-primary-text) !important;
}

/* On répète pour les variantes secondaire et tertiaire si nécessaire */
.is-style-secondary .ff-btn-submit:hover {
    background-color: var(--wp--preset--color--btn-secondary-bg) !important;
    border-color: var(--wp--preset--color--btn-secondary-bg) !important;
}

.is-style-tertiary .ff-btn-submit:hover {
    background-color: var(--wp--preset--color--btn-tertiary-bg) !important;
    border-color: #D9D9D9 !important;
}




