/*********************** blog single ******************/
.tags-social {
    span {
        color: var(--primary-color);
        text-transform: uppercase;
    }
    .tags-list {
        display: inline-flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 15px;

        a {
            padding: 10px 20px;
            border: 1px solid var(--light-stroke);
            color: var(--primary-color);
            font-size: 15px;
            &:hover {
                background-color: var(--primary-color);
                color: var(--white-color);
                border-color: var(--primary-color);
            }
        }
    }
    .social-share {
        a {
            display: inline-block;
            color: var(--primary-color);
            padding: 0 6px;
            &:hover {
                color: var(--secondary-color);
            }
        }
    }
}

.blog-author-box {
    .author-thumb {
        width: 210px;
        flex-shrink: 0;
    }
    .author-socials {
        a {
            width: 40px; 
            height: 40px;
            border: 1px solid var(--light-stroke);
            color: var(--primary-color);
            display: inline-block;
            text-align: center;
            line-height: 40px;
            margin-right: 10px;
            &:hover {
                color: var(--white-color); 
                background-color: var(--primary-color);
                border-color: var(--primary-color);
            }
        }
    }
}

.spacer {
    border-top: 1px solid var(--light-stroke);
}

.blog-comment-list {
    li {
        padding: 30px 0;
        + li {
            border-top: 1px solid var(--light-stroke);
        }
    }
    .client-thumb {
        width: 120px;
        flex-shrink: 0;
    }
    .reply-btn {
        font-weight: 500;
        position: absolute;
        right: 0;
        top: 0;
        text-transform: uppercase;
    }
    @include screen-768 {
        .reply-btn {
            position: initial;
            margin-top: 15px;
        }
    }
}