/**
 * Default template
 */
.wpulike-default {

    button.wp_ulike_btn {
        color: #616161;
        background-color: #e0e0e0;
        min-height: 30px;
        min-width: 50px;

        &:hover,
        &:focus {
            color: #616161;
            background-color: #e0e0e0;
            text-decoration: none;
        }

        &[disabled=disabled],
        &:disabled {

            &:hover,
            &:active,
            &:focus {
                background-color: #e0e0e0;
            }
        }
    }

    .wp_ulike_is_liked {
        .wp_ulike_btn {
            color: #757575;
        }
    }

    .wp_ulike_put_image {

        &:after {
            content: '';
            display: block;
            background: url(../img/svg/like.svg) no-repeat;
            background-size: contain;
            width: 16px;
            height: 16px;
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translateX(-50%) translateY(-50%);
        }

        &.wp_ulike_btn_is_active {
            &:after {
                filter: invert(44%) sepia(40%) saturate(3852%) hue-rotate(329deg) brightness(100%) contrast(111%);
            }
        }
    }

    .count-box {
        position: relative;
        border-radius: .25em;
        font-size: 13px;
        text-decoration: none;
        background-color: #FFFFFF;
        margin-left: 8px;
        line-height: 30px;
        display: inline-block;
        padding: 0 10px;
        box-shadow: 0 0 0 1px #bdbdbd inset;
        color: #616161;
        vertical-align: middle;
        text-align: center;

        &:before {
            content: '';
            position: absolute;
            border: 1px solid transparent;
            background: #FFFFFF;
            border-bottom-color: #bdbdbd;
            left: -5px;
            top: 50%;
            border-left-color: #bdbdbd;
            transform: rotate(45deg) translatey(-50%);
            width: 5px;
            height: 5px;
            margin: 0;
            box-sizing: content-box;
        }
    }
}

#buddypress #activity-stream {

    .activity-meta,
    .activity-comments,
    .activity-inner {

        .wpulike-default {
            button.wp_ulike_btn {
                border-radius: 0;
                background-color: #ffffff;
                box-shadow: 0 0 0 1px #bdbdbd inset;
                font-size: initial;
                padding: 1em;
            }

            .wp_ulike_is_loading {
                button.wp_ulike_btn {
                    background-image: url(../img/svg/loader.svg);
                    background-repeat: no-repeat;
                    background-position: center center;
                }
            }
        }
    }
}