.blog-details-page{
    background: #fff;
}
.blog-title {
    font-weight: 700;
    font-size: 2rem;
    color: #212529;
    margin-bottom: 30px;
}
.blog-user{
    align-items: center;
}
.blog-user img {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    margin-right: 10px;
}
.blog-user h6{
    margin: 0;
}
.blog-date {
    color: #757575;
    font-size: 14px;
    font-weight: 600;
}
.blog-date i {
    border-radius: 50%;
    height: 35px;
    width: 35px;
    line-height: 33px;
    border: 1px solid #ddd;
    text-align: center;
    font-size: 16px;
    color: #444;
}
.blog-content p {
    color: #444;
    line-height: 1.7;
}
.comment-box {

}
.comment-input {
    background: #f1f3f5;
    border: none;
    padding: 12px 15px;
    border-radius: 8px;
    width: 100%;
}
.comment-item {
    border-bottom: 1px solid #e9ecef;
    padding-bottom: 15px;
    margin-bottom: 20px;
}
.comment-item:last-child {
    border-bottom: none;
}
.comment-author {
    font-weight: 600;
    color: #1c1c1c;
}
.comment-text {
    color: #555;
    margin-top: 5px;
}
.comment-footer {
    font-size: 14px;
    color: #6c757d;
    margin-top: 10px;
}
.comment-footer a {
    text-decoration: none;
    color: #0d6efd;
}
.comment-footer a:hover {
    text-decoration: underline;
}
.comment-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    margin-right: 10px;
}

.nested-comments {
    padding-left: 20px;
    border-left: 2px solid #e9ecef;
}

.nested-comments .comment-item {
    padding-left: 15px;
}
.comment-input-box i {
    height: 40px;
    width: 40px;
    line-height: 38px;
    border-radius: 50%;
    transition: .4s;
    color: #444;
    font-size: 20px;
}
.comment-input-box i:hover {
    background: #ddd;
}

.comment-input-box .form-control,
.comment-input-box button {
    background: #F1F3F5 !important;
    border: none;
    box-shadow: none;
}

.comment-input-box .form-control:focus,
.comment-input-box button:focus {
    background: #F1F3F5;
    border: none;
    box-shadow: none;
    outline: none;
}
