/*====================================================
COMMENTS WRAPPER
====================================================*/

.hh24-comments-wrapper{

    max-width:1146px;

    margin:80px auto;

    width:100%;
}

.hh24-comments-divider{

    width:100%;

    height:1px;

    background:linear-gradient(90deg, #d7d7d7 0%, #ececec 100%);

    margin-bottom:32px;
}

.hh24-comments-header{

    display:flex;

    align-items:center;

    gap:14px;

    margin-bottom:30px;
}

.hh24-comments-header h2{

    margin:0;

    font:700 24px "Poppins",sans-serif;
}

.hh24-comments-count{

    width:32px;

    height:32px;

    border-radius:50%;

    background:#dd111a;

    color:#fff;

    display:flex;

    align-items:center;

    justify-content:center;

    font:700 14px "Poppins",sans-serif;
}

/*====================================================
FORM
====================================================*/

.hh24-comment-form-wrap{
        
    width:1026px;

    display:flex;

    align-items:flex-start;

    gap:20px;

    margin-bottom:60px;
}

.hh24-comment-avatar{

    width:48px;

    flex-shrink:0;
}

.hh24-comment-avatar img{

    width:48px;

    height:48px;

    display:block;
}

.hh24-comment-form{

    flex:1;

    padding:18px;

    border:1px solid #ececec;

    border-radius:18px;

    background:#fff;

    box-shadow:0 12px 28px rgba(0,0,0,.04);
}

.comment-form{

    width:100%;
}

.comment-form-comment{

    margin:0;
}

.comment-form-comment textarea{

    width:100%;

    min-height:120px;

    padding:16px;

    border:1px solid #e2e2e2;

    border-radius:16px;

    background:#fafafa;

    font:400 16px "Poppins",sans-serif;

    resize:vertical;

    box-sizing:border-box;
}

.comment-form-comment textarea:focus{

    outline:none;

    border-color:#111;

    background:#fff;
}

.hh24-extra-fields{

    display:flex;

    gap:16px;

    margin-top:16px;
}

.hh24-extra-field{

    flex:1;
}

.hh24-extra-field input{

    width:100%;

    height:42px;

    padding:0 14px;

    border:1px solid #e2e2e2;

    border-radius:14px;

    background:#fafafa;

    box-sizing:border-box;

    font:400 14px "Poppins",sans-serif;
}

.hh24-extra-field input:focus{

    outline:none;

    border-color:#111;

    background:#fff;
}

.form-submit{

    margin-top:16px;

    text-align:right;
}

.hh24-submit{

    width:112px;

    height:36px;

    border:0;

    border-radius:999px;

    background:linear-gradient(135deg, #111827 0%, #2c3850 100%);

    color:#fff;

    font:600 12px "Poppins",sans-serif;

    letter-spacing:.08em;

    cursor:pointer;
}

.hh24-submit:hover{

    opacity:.92;
}

/*====================================================
COMMENTS LIST
====================================================*/

.hh24-comments-list{

    margin-top:44px;
}

.hh24-comment{

    display:flex;

    gap:20px;

    margin-bottom:20px;

    padding:18px;

    border:1px solid #ececec;

    border-radius:18px;

    background:#fff;

    box-shadow:0 10px 24px rgba(0,0,0,.03);
}

.hh24-comment-avatar{

    width:48px;

    flex-shrink:0;
}

.hh24-comment-body{

    flex:1;
}

.hh24-comment-meta{

    display:flex;

    align-items:center;

    gap:10px;

    margin-bottom:6px;
}

.hh24-comment-author{

    font:700 12px "Poppins",sans-serif;
}

.hh24-author-badge{

    padding:3px 8px;

    border-radius:20px;

    background:#dd111a;

    color:#fff;

    font:700 10px "Poppins",sans-serif;
}

.hh24-comment-date{

    margin-bottom:12px;

    color:#777;

    font:italic 12px "Poppins",sans-serif;
}

.hh24-comment-text{

    font:400 14px/24px "Poppins",sans-serif;

    color:#222;
}

.hh24-comment-actions{

    display:flex;

    align-items:center;

    gap:18px;

    margin-top:16px;
}

.hh24-comment-actions button{

    display:flex;

    align-items:center;

    gap:6px;

    background:none;

    border:0;

    cursor:pointer;

    padding:0;
}

.hh24-comment-actions img{

    width:16px;

    height:16px;
}

.comment-reply-link{

    text-decoration:none;

    color:#111;

    font:500 13px "Poppins",sans-serif;
}

.comment-reply-link:hover{

    color:#dd111a;
}

.comment-form-cookies-consent{

    display:none;
}

.hh24-comments-section{

    max-width:1146px;

    margin:80px auto 0;

    width:100%;

    clear:both;
}