@charset "utf-8";

.comment { max-width: 850px; width: 100%; margin: 40px auto 40px 0px; font-family: Arial, sans-serif; }

.comment-line { font-size: 24px; font-weight: 700; margin-bottom: 20px; color: rgb(28, 30, 33); }

.fb-post { background: rgb(255, 255, 255); }

.fb-comment__item-input { display: flex; align-items: center; gap: 12px; margin-bottom: 15px; }

.fb-comment__avatar, .fb-comment img { width: 42px; height: 42px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }

.btn_comm { flex: 1 1 0%; }

.comment-block-input__input { width: 100%; border: none; background: rgb(240, 242, 245); border-radius: 20px; padding: 12px 18px; font-size: 14px; cursor: pointer; }

.comment-block-input__input:focus { outline: none; }

.fb-comment__sort { font-size: 14px; font-weight: 600; color: rgb(101, 103, 107); padding-bottom: 12px; border-bottom: 1px solid rgb(221, 221, 221); margin-bottom: 20px; }

.fb-comment { display: flex; gap: 10px; margin-bottom: 18px; }

.fb-comment-body { flex: 1 1 0%; }

.fb-comment-box { background: rgb(240, 242, 245); border-radius: 18px; padding: 10px 14px; }

.fb-comment-name { font-size: 14px; font-weight: 700; color: rgb(5, 5, 5); margin-bottom: 4px; }

.fb-comment-text { font-size: 14px; line-height: 1.4; color: rgb(5, 5, 5); }

.fb-comment-actions { display: flex; gap: 15px; margin-top: 5px; margin-left: 14px; font-size: 12px; font-weight: 600; color: rgb(101, 103, 107); }

.fb-comment-actions span { cursor: pointer; }

.fb-comment-actions span:hover { text-decoration: underline; }

@media (max-width: 768px) {
  .comment { padding: 0px 10px; }
  .fb-comment-box { padding: 10px 12px; }
  .fb-comment__avatar, .fb-comment img { width: 38px; height: 38px; }
}
