// Images as card backgrounds
.card-img-bg {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-size: cover;
    border-radius: $card-border-radius;
    -webkit-backface-visibility: hidden;
    transition: all .7s cubic-bezier(.2,1,.22,1);
    -webkit-transition: all .7s cubic-bezier(.2,1,.22,1);
}

.card:hover .card-img-bg {
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
}

.card-img-bg ~ .card-body {
    position: relative;
}

 
// Pricing 

.card-pricing {
    .card-header {
        padding-top: 1.25rem;
        padding-bottom: 1.25rem;
    }
    .list-unstyled li {
        padding: .5rem 0;
        color: $gray-600;
    }
}

.card-pricing.popular {
    border: 3px solid theme-color("primary") !important;
}


// Card action buttons
.card-icon-actions a {
    display: inline-block;
    margin-right: 0.625rem;
    color: $gray-600;
    font-size: 0.875rem;
}
.card-icon-actions-lg a {
    font-size: 1.25rem;
    margin-right: 0.875rem;
}
.card-icon-actions a:last-of-type {
    margin-right: 0;
}
.card-icon-actions > a:hover,
.card-icon-actions > .active {
    color: $gray-800;
}
.card-icon-actions > .favorite:hover,
.card-icon-actions > .favorite.active {
    color: $favorite-color;
}
.card-icon-actions > .love:hover,
.card-icon-actions > .love.active {
    color: $love-color;
}

.card-icon-actions > .like:hover,
.card-icon-actions > .like.active {
    color: $like-color;
}


// Card comment box
.card-comment-box {
    input, 
    textarea {
        width: 100%;
        border: 0;
        background: transparent;
        padding: 0.3125rem 0;
        margin: 0;
        color: $gray-800;
        outline: none;
        resize: none;

        &:focus {
            background: transparent;
        }
    }
}