button{
    cursor: pointer;
    font-family: var(--font);
    font-size: var(--fons-normal);
    color: var(--color-txt);
    &:hover{
        color: var(--grey-100);
    }

    a{
        text-decoration: none;
        width: 100%;
        height: 100%;
    }
}

button:disabled{
    cursor: auto;

}

.soutenir{
    a{
        color: var(--color-accent);
        &:hover{
            color: var(--color-accent)!important;
            text-decoration: underline!important;
        }
    }
}



.btn--bold, 
.btn--bold-inline{
    display: block;
    height: calc(var(--h-block)*1);
    border: var(--border);
    border-radius: 4px;
    font-size: var(--fs-small);
    text-transform: uppercase;
    line-height: 1;
    overflow: hidden;
    white-space: nowrap;
    a{
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 100%;
        padding: 0 2ch;
        padding-top: 5px;
    }
    
}

.btn--bold{
    background-color: var(--color-txt);
    color: var(--color-bg);
    &:hover{
        background-color: var(--color-accent);
        border-color: var(--color-accent);
        a{
            color: var(--color-bg);  
        }
    }
  
}

.btn--bold-inline:hover{
    a{
        background-color: var(--grey-800);
        color: var(--color-txt);
    }
}





// DELETE ?

.btn__default{

    
    --size: calc(var(--h-block) - 8px);
    font-size: var(--fs-normal);
    font-weight: var(--fw-normal);
    height: var(--size);
    padding-right: 1.5ch;

    position: relative;


    display: flex;
    align-items: center;
    gap: 0ch;
    // padding-right: 0.5ch;
    color: var(--color-accent);
    font-weight: var(--fw-medium);
    text-decoration: none;

    cursor: pointer;


    .icon, .txt{ z-index: 10; }

    .icon{
        width: var(--size);
        height: var(--size);
        display: flex;
        align-items: center;
        justify-content: center;
        color: var(--color-bg);
        text-align: center;

        svg{
            fill: var(--color-bg);
            width: 80%;
        }
    }

    .txt{
        font-family: var(--font-title);
        color: var(--color-accent);
        font-size: var(--fs-normal);
        font-weight: var(--fw-bold);
        padding-left: 1ch;
    }

    &::after{
        content: '';
        display: block;
        background-color: var(--color-accent);
        border-radius: calc(var(--size)/2);
        width: var(--size);
        height: var(--size);
        position: absolute; 
        left: 0;
        z-index: 0;
        transition: width .2s
    }

    &:hover{
        // 
        .txt{
            color: var(--color-bg);
                        display: block;
                    }
        &::after{
            width: 100%;
        }
    }

    



   
}