/*====================================================
COMMENTS RESPONSIVE
====================================================*/

@media (max-width:992px){

    .hh24-comments-wrapper{

        padding:0 20px;

        box-sizing:border-box;
    }

    .hh24-comments-section{

        padding:0 20px;

        box-sizing:border-box;
    }

    .hh24-comment-form-wrap{

        width:100%;
    }
}

@media (max-width:768px){

    .hh24-comments-wrapper{

        width:100%;

        margin:50px auto;

        padding:0 16px;

        box-sizing:border-box;
    }

    .hh24-comments-section{

        width:100%;

        margin:50px auto 0;

        padding:0 16px;

        box-sizing:border-box;
    }

    .hh24-comments-header{

        gap:10px;

        margin-bottom:24px;
    }

    .hh24-comments-header h2{

        font-size:22px;
    }

    .hh24-comments-count{

        width:30px;

        height:30px;

        font-size:13px;
    }

    .hh24-comment-form-wrap{

        width:100%;

        flex-direction:column;

        gap:16px;

        margin-bottom:40px;
    }

    .hh24-comment-avatar{

        width:40px;
    }

    .hh24-comment-avatar img{

        width:40px;

        height:40px;
    }

    .comment-form-comment textarea{

        width:100%;

        min-height:140px;

        padding:14px;

        font-size:16px;

        box-sizing:border-box;
    }

    .hh24-extra-fields{

        flex-direction:column;

        gap:12px;

        margin-top:14px;
    }

    .hh24-extra-field input{

        width:100%;

        height:46px;

        font-size:16px;
    }

    .form-submit{

        text-align:center;

        margin-top:18px;
    }

    .hh24-submit{

        width:100%;

        max-width:220px;

        height:42px;

        font-size:15px;
    }

    .hh24-comments-list{

        margin-top:32px;
    }

    .hh24-comment{

        gap:14px;

        margin-bottom:18px;

        padding:16px;
    }

    .hh24-comment-meta{

        flex-wrap:wrap;

        gap:8px;
    }

    .hh24-comment-author{

        font-size:13px;
    }

    .hh24-comment-date{

        font-size:11px;

        margin-bottom:10px;
    }

    .hh24-comment-text{

        font-size:15px;

        line-height:1.7;

        word-break:break-word;

        overflow-wrap:anywhere;
    }

    .hh24-comment-actions{

        flex-wrap:wrap;

        gap:14px;

        margin-top:14px;
    }

    .hh24-comment-actions button{

        font-size:13px;
    }

    .comment-reply-link{

        font-size:13px;
    }
}

@media (max-width:480px){

    .hh24-comments-wrapper{

        padding:0 12px;
    }

    .hh24-comments-section{

        padding:0 12px;
    }

    .hh24-comments-header h2{

        font-size:20px;
    }

    .hh24-comments-count{

        width:28px;

        height:28px;

        font-size:12px;
    }

    .hh24-submit{

        max-width:none;

        width:100%;
    }
}
