.gdrts-like-this {
    line-height: 1;
    display: inline-block;
    white-space: pre;

    &:not(.gdrts-state-active) {
        .gdrts-like {
            .gdrts-like-link {
                cursor: default;
            }
        }
    }

    &.gdrts-state-active {
        &:not(.gdrts-vote-saving) {
            .gdrts-like {
                .gdrts-like-link {
                    cursor: pointer;
                }
            }
        }
    }

    &:not(.gdrts-loop-saving) {
        .gdrts-like-link {
            &.gdrts-like-hover {
                &:hover {
                    .gdrts-liked-symbol {
                        display: none !important;
                    }

                    .gdrts-clear-symbol {
                        display: inline-block !important;
                    }
                }
            }
        }
    }
}

.gdrts-method-like-this {
    .gdrts-rating-text {
        &.gdrts-text-inline {
            display: inline-block;
            vertical-align: top;
        }
    }

    &.gdrts-vote-saving {
        .gdrts-rating-text {
            &.gdrts-text-inline {
                display: none;
            }
        }

        .gdrts-rating-please-wait {
            &.gdrts-text-inline {
                display: inline-block;
                vertical-align: top;
            }
        }
    }
}

.gdrts-with-image {
    &.gdrts-image-like {
        .gdrts-like-image {
            background: url('likes/like.png') no-repeat;
        }
    }

    .gdrts-like-image {
        display: inline-block;
    }

    .gdrts-liked-symbol {
        .gdrts-like-image {
            background-position: 0% 33.3333%;
        }
    }

    .gdrts-clear-symbol {
        .gdrts-like-image {
            background-position: 0% 0%;
        }
    }

    .gdrts-like-symbol {
        .gdrts-like-image {
            background-position: 0% 66.6666%;
        }
    }

    &.gdrts-state-active {
        &:not(.gdrts-vote-saving) {
            .gdrts-like {
                &:hover {
                    .gdrts-like-symbol {
                        .gdrts-like-image {
                            background-position: 0% 100%;
                        }
                    }
                }
            }
        }
    }
}

.gdrts-likes-theme-simple {
    .gdrts-like {
        padding: 0;
        background: none;
        display: inline-block;

        .gdrts-like-link {
            margin: 0 10px 0 0;
            line-height: 1em;
            height: 1em;
            display: inline-block;
            font-size: 1em;

            .gdrts-like-this-symbol {
                display: inline-block;
                height: 1em;
            }

            .gdrts-like-this-suffix {
                font-size: 0.8em;
                line-height: 1.25em;
                margin-left: 5px;
                vertical-align: top;
                display: inline-block;
            }
        }

        .gdrts-like-count {
            font-size: .8em;
            line-height: 1.25em;
            padding-left: 10px;
            border-left: 1px solid #111;
            display: inline-block;
            vertical-align: top;
        }
    }

    &.gdrts-state-active {
        &:not(.gdrts-vote-saving) {
            &:not(.gdrts-with-image) {
                .gdrts-like:hover {
                    .gdrts-like-link {
                        color: #0A0;
                    }
                }
            }
        }
    }
}

.gdrts-likes-theme-standard {
    .gdrts-like {
        .gdrts-like-link {
            display: inline-block;
            background: #333;
            border-radius: 4px;
            height: calc(1em + 10px);
            color: #FFF;
            padding: 5px 10px;
            white-space: pre;
            position: relative;

            .gdrts-like-this-symbol {
                display: inline-block;
            }

            .gdrts-like-this-suffix {
                font-size: 0.8em;
                line-height: 1.25em;
                margin-left: 5px;
                vertical-align: top;
                display: inline-block;
            }
        }

        .gdrts-like-count {
            background: #EEE;
            color: #111;
            display: inline-block;
            border-radius: 4px;
            font-size: .8em;
            padding: 5px 10px 5px 20px;
            height: calc(1.25em + 10px);
            line-height: 1.1em;
            border: 1px solid #111;
            vertical-align: top;
            margin-left: -10px;
            font-weight: bold;
        }
    }

    &.gdrts-state-active {
        &:not(.gdrts-vote-saving) {
            &:not(.gdrts-with-image) {
                .gdrts-like {
                    &:hover {
                        .gdrts-like-link {
                            color: #8F8;

                            &.gdrts-like-hover {
                                color: #F88;
                            }
                        }
                    }
                }
            }
        }
    }
}

.gdrts-likes-theme-expanding {
    .gdrts-like {
        .gdrts-like-link {
            display: inline-block;
            background: #333;
            border-radius: 4px;
            height: calc(1em + 10px);
            color: #FFF;
            padding: 5px 10px;
            white-space: pre;
            position: relative;

            .gdrts-like-this-symbol {
                display: inline-block;
            }

            .gdrts-like-this-suffix {
                font-size: 0.8em;
                line-height: 1.25em;
                margin-left: 0;
                vertical-align: top;
                display: inline-block;
                max-width: 0px;
                overflow: hidden;
            }
        }

        .gdrts-like-count {
            background: #EEE;
            color: #111;
            display: inline-block;
            border-radius: 4px;
            font-size: .8em;
            padding: 5px 8px 5px 0px;
            height: calc(1.25em + 10px);
            line-height: 1.1em;
            border: 1px solid #111;
            vertical-align: top;
            margin-left: -10px;
            font-weight: bold;
            max-width: 0px;
            overflow: hidden;
        }
    }

    &.gdrts-state-active {
        &:not(.gdrts-vote-saving) {
            &:not(.gdrts-with-image) {
                .gdrts-like {
                    &:hover {
                        .gdrts-like-link {
                            color: #8F8;

                            &.gdrts-like-hover {
                                color: #F88;
                            }
                        }
                    }
                }
            }
        }
    }
}

.gdrts-likes-theme-balloon {
    .gdrts-like {
        .gdrts-like-link {
            display: inline-block;
            background: #333;
            border-radius: 4px;
            height: calc(1em + 10px);
            color: #FFF;
            padding: 5px 10px;
            white-space: pre;
            position: relative;

            .gdrts-like-this-symbol {
                display: inline-block;
            }

            .gdrts-like-this-suffix {
                font-size: 0.8em;
                line-height: 1.25em;
                margin-left: 5px;
                vertical-align: top;
                display: inline-block;
            }
        }

        .gdrts-like-count {
            display: none;
        }
    }

    &.gdrts-state-active {
        &:not(.gdrts-vote-saving) {
            &:not(.gdrts-with-image) {
                .gdrts-like {
                    &:hover {
                        .gdrts-like-link {
                            color: #8F8;

                            &.gdrts-like-hover {
                                color: #F88;
                            }
                        }
                    }
                }
            }
        }
    }

    + .gdrts-rating-text {
        background: #FFF;
        border-radius: 4px;
        position: relative;
        border: #333 solid 1px;
        height: calc(1em + 10px);
        padding: 0 5px;
        margin: 0 0 0 8px;

        &:after {
            content: '';
            position: absolute;
            border-style: solid;
            border-width: 6px 6px 6px 0;
            border-color: transparent #FFF;
            display: block;
            width: 0;
            z-index: 1;
            margin-top: -6px;
            left: -6px;
            top: 50%;
        }

        &:before {
            content: '';
            position: absolute;
            border-style: solid;
            border-width: 6px 6px 6px 0;
            border-color: transparent #333;
            display: block;
            width: 0;
            z-index: 0;
            margin-top: -6px;
            left: -7px;
            top: 50%;
        }
    }
}

.gdrts-with-fonticon {
    &.gdrts-fonticon-font {
        .gdrts-like-link {
            .gdrts-like-this-symbol {
                font-family: "gdrts-icons";
            }
        }
    }
}