@use "./../abstract";

.theme-btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    letter-spacing: 0.1em;
    text-transform:uppercase;
    font-weight: 600;
    padding: 18px 22px;
    line-height: 19px;
    font-family: $body-font;
    transition: all .3s;
    &.style-one{
        background-color: $primary-color;
        color: $white-color;
        & i{
            margin-left: 10px;
            transition: all .3s;
        }
        &:hover{
            background-color: $primary-black-color;
            color: $white-color;
        }
    }
    &.style-two{
        padding: 17px 22px;
        border: 1px solid $primary-color;
        color: $primary-color;
        &:hover{
            background-color: $primary-color;
            border-color: transparent;
            color: $white-color;
        }
    }
}

.read-more{
    &.style-one{
        display: inline-flex;
        align-items: center;
        letter-spacing: 1.6px;
        font-weight: 600;
        text-transform: uppercase;
        &:after{
            display: inline-flex;
            content: '';
            width: 30px;
            height: 2px;
            background-color: $primary-black-color;
            margin-left: 10px;
        }
    }
}