
    .comment-section, .comment-list-wrap { width: 100%; margin-left: auto !important; margin-right: auto !important; box-sizing: border-box; font-family: tahoma, arial, sans-serif; }
    .comment-title1 { font-size:24px; font-weight:bold; margin-bottom:25px; margin-top:10px; padding-bottom:10px; color: #ff0000; border-bottom: 2px solid #8e44ad; }
    .comment-form { display: flex; flex-direction: column; gap: 15px; margin-bottom: 50px; }
    .comment-input { width: 100%; padding: 12px; border: 1px solid #ddd; border-radius: 5px; box-sizing: border-box; }
    .comment-fields-row { display: flex; gap: 20px; }
    .comment-fields-row p { flex: 1; margin: 0; }
    .submit-btn { padding: 10px 25px; background: #0073aa; color: #fff; border: none; border-radius: 4px; cursor: pointer; }
    .comment-list { padding: 0; list-style: none; }
    .custom-comment-row { display: flex; align-items: center; background: #fdfdfd; padding: 15px; border: 1px solid #eee; border-radius: 8px; margin-bottom: 10px; transition: all 0.3s; }
    .custom-comment-row:hover { background: #f5f5f5; border-color: #ccc; }
    .col-author { flex: 0 0 20%; font-weight: bold; color: #333; overflow: hidden; text-overflow: ellipsis; }
    .col-date   { flex: 0 0 12%; color: #888; font-size: 0.85em; text-align: center; }
    .col-text   { flex: 1; padding-right: 25px; line-height: 1.7; color: #444; }

    @media (max-width: 768px) {
        .custom-comment-row { flex-direction: column; align-items: flex-start; }
        .comment-fields-row { flex-direction: column; gap: 10px; }
        .col-author, .col-date, .col-text { flex: 0 0 100%; width: 100%; text-align: right; padding: 5px 0; }

.comment-list,
.comment-list .children {
list-style: none;
padding: 0;
}

.children {
margin-right: 40px;
padding-right: 15px;
border-right: 3px solid #8e44ad;
}

.comment.depth-2 .custom-comment-row {
background: #f8f3ff;
}


