/*#region a-button*/
.a-button:hover:not(:disabled):after {
    width: 140%;
    padding-bottom: 140%;
    transition: 0.3s width padding-bottom ease-in-out;
}

.a-button:hover span {
    transition: 0.3s all ease-in-out;
}

.a-button:active:after {
    transition: 0.1s all ease-in-out;
}

/*#endregion */

/*#region a-button-primary*/

.a-button-primary:hover:after {
    background-color: var(--primary-dark-color);
}

.a-button-primary:hover span {
    color: var(--primary-dark-text-color);
}

.a-button-primary:active span {
    color: var(--primary-dark-text-color);
}

.a-button-primary:active:after {
    background-color: var(--primary-darker-color);
}

/*#endregion */

/*#region a-button-secondary*/
.a-button-secondary:hover:after {
    background-color: var(--primary-light-color);
}

.a-button-secondary:hover span {
    color: var(--primary-text-color);
}

.a-button-secondary:active span {
    color: var(--primary-text-color);
}

.a-button-secondary:active:after {
    background-color: var(--primary-color);
}

.a-button-secondary:hover:before{
    filter:brightness(0);
    transition:0.3s ease;
}

.a-button-secondary:active:before {
    filter: brightness(0);

}


/*#endregion */

/*#region a-button-third*/
.a-button-third:hover:after {
    background-color: var(--primary-lighter-color);
}

.a-button-third:hover span {
    color: var(--primary-color);
}

.a-button-third:active span {
    color: var(--primary-text-color);
}

.a-button-third:active:after {
    background-color: var(--primary-light-color);
}

/*#endregion */


/*#region a-button-fourth*/

.a-button-fourth:hover:after {
    background-color: var(--primary-lighter-color);
}

.a-button-fourth:hover span {
    color: var(--primary-color);
}

.a-button-fourth:active span {
    color: var(--primary-text-color);
}

.a-button-fourth:active:after {
    background-color: var(--primary-light-color);
}
/*#endregion */

/*#region a-button-destructive*/
.a-button-destructive:hover:after {
    background-color: var(--error-dark-color);
}

.a-button-destructive:hover span {
    color: var(--error-text-color);
}

.a-button-destructive:active span {
    color: var(--error-text-color);
}

.a-button-destructive:active:after {
    background-color: var(--error-darker-color);
}
/*#endregion */

/*#region a-button-destructive-third*/
.a-button-destructive-third:active {
    background-color: var(--error-dark-color);
}

.a-button-destructive-third:active span {
    color: white;
    transition:0s;
}

/*endregion*/

/*#region a-button-success*/
.a-button-success:hover:after {
    background-color: var(--success-dark-color);
}

.a-button-success:hover span {
    color: var(--success-text-color);
}

.a-button-success:active span {
    color: var(--success-text-color);
}

.a-button-success:active:after {
    background-color: var(--success-darker-color);
}
/*#endregion */


/*region a-button-secondary-secondary*/
.a-button-secondary-secondary:hover:after {
    background: var(--secondary-secondary-text-color);
}

    .a-button-secondary-secondary:hover:before {
        filter: brightness(0) invert(1);
    }

    .a-button-secondary-secondary:active:before {
        filter: brightness(0) invert(1);
    }

.a-button-secondary-secondary:hover span{
    color:white;
}

.a-button-secondary-secondary:active {
    background: var(--secondary-secondary-text-color);
}

    .a-button-secondary-secondary:active:before {
        /*ajouter plus blanc*/
    }

.a-button-secondary-secondary:active span{
    color:white;
}
    /*endregion*/