.mgh-ac-container { width:100%; }
.mgh-ac-row { display:flex; justify-content:space-between; margin-bottom:10px; align-items: center !important;}
.mgh-ac-col { flex:1; }
.mgh-ac-title {font-weight: 500; color: #292929;font-size: 1.2rem;}
.mgh-ac-action { text-align:left; }
.mgh-ac-comments-list { width:100%; margin-top: 1rem !important;}
.mgh-ac-comment {border: 0.01rem solid #9b9b9b; padding: 1rem 1.5rem; margin-bottom: 0.8rem; border-radius: 0.4rem;}
.mgh-ac-comment-meta {display: flex; justify-content: space-between; align-items: center; gap: 0.7rem; margin: 0.4rem 0;; }
.mgh-ac-comment-name {font-weight: 500; font-size: 0.95rem; color: #47615e;}
.mgh-ac-reply-button { background:none; border:none; cursor:pointer; }
.mgh-ac-form {position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #fff; padding: 1.3rem; z-index: 1001; width: 90%; max-width: 400px; border-radius: 0.8rem;}
.mgh-ac-popup-overlay { position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:1000; }
.mgh-ac-hidden { display:none; }
.mgh-ac-input-name, .mgh-ac-input-comment, .mgh-ac-input-captcha { width:100%; box-sizing:border-box; }
button.mgh-ac-new-comment {background: none !important; color: #292929 !important; font-size: 0.8rem !important; font-weight: 500 !important; border: 0.01rem solid #292929 !important; border-radius: 0.4rem; padding: 0.8rem 1rem !important;}
.mgh-ac-comment-text {margin-bottom: 0.8rem !important; color: #505050; font-size: 0.9rem; font-weight: 400; line-height: 1.6rem; text-align: justify;}
button.mgh-ac-reply-button {background: #e5e8e7 !important; color: #32685c !important; font-size: 0.75rem !important; font-weight: 500 !important; border-radius: 0.4rem; padding: 0.5rem 0.8rem !important}
p.mgh-ac-description {margin: 0.3em 0 0.5em 0; font-size: 1em; color: #484848; font-weight: 400;}
.mgh-ac-TitleBox {display: flex; flex-direction: column; align-items: flex-start; gap: 0.2rem;flex: 0 0 70%;}
p.mgh-ac-no-comments { background: #e5e8e7; color: #432a35; font-size: 0.9em; font-weight: 400; padding: 1rem 1rem; border-radius: 0.6rem;}
.mghBoxSubmit {display: block;}
button.mgh-ac-submit-button {width: 100% !important; color: white; background: #3D7570; border-radius: 0.3rem; font-size: 0.8rem; font-weight: 500; padding: 0rem;}
button.mgh-ac-submit-button:hover{background: #259a8f;color:white;}
input.mgh-ac-input-name, input.mgh-ac-input-captcha, textarea.mgh-ac-input-comment {border: 0.01rem solid #3D7570 !important; border-radius: 0.3rem !important; font-size: 0.85rem !important; color: #3D7570 !important; font-weight: 500 !important;}
.mgh-ac-row.mghBoxSubmit p {color: #2c605b; font-size: 0.85rem; font-weight: 500;}
.mgh-ac-comment-label-user {  background: #47615e; padding: 0.3rem 0.5rem; color: #FFFFFF; font-size: 0.7rem; font-weight: 400; border-radius: 0.3rem;}
.mgh-ac-comment-label-admin {  background: #003e50; padding: 0.3rem 0.5rem; color: #FFFFFF; font-size: 0.6rem; font-weight: 400; border-radius: 0.3rem;}
.mgh-comment-metaBox1 {display: flex; flex-direction: row; align-items: center; gap: 0.3rem;}
.mgh-comment-metaBox { display: flex ; flex-direction: column; align-items: flex-start; gap: 0.4rem;}
.mgh-ac-comment-date { font-size: 0.8rem; color: #47615e; font-weight: 400; word-spacing: 0.1rem;}
.mgh-ac-hidden { display: none !important; }
.mgh-ac-modal {position: fixed; top: 0; left: 0; right: 0; bottom: 0; display: flex; justify-content: center; align-items: center; background: rgba(0,0,0,0.5); z-index: 2000;}
.mgh-ac-modal-content {position: relative; background: #fff; padding: 2rem; border-radius: 0.6rem; text-align: center; max-width: 90%; box-shadow: 0 4px 12px rgba(0,0,0,0.15);}
.mgh-ac-popup-close { position: absolute; top: 0.5rem; right: 0.75rem; background: none; border: none; font-size: 1.5rem; cursor: pointer;}
.mgh-ac-popup-message {margin-top: 1rem; font-size: 1rem; line-height: 1.4;}
.mgh-ac-popup-message.error {color: #bc2c1d; font-size: 0.9rem; font-weight: 500; text-align: center;}
.mgh-ac-popup-message.success {color: #176e3c; font-size: 0.9rem; font-weight: 500; text-align: center;}
.mgh-ac-popup-animation-container {display: flex; flex-direction: row; justify-content: center;}

@media (max-width: 999px) {
    .mgh-ac-comment-meta {display: flex; align-items: center; gap: 0.7rem;margin: 0.4rem 0; flex-direction: column;}
    .mgh-comment-metaBox1 {gap: 0.6rem;}
    .mgh-comment-metaBox { display: flex; flex-direction: row; align-items: center; gap: 0.4rem; justify-content: space-around !important;}
    div.mghHeaderBox { display: flex ; flex-direction: column; align-items: center; gap: 0.6rem;}
    .mgh-ac-TitleBox { display: flex; flex-direction: column; align-items: center; gap: 0.3rem;}
    p.mgh-ac-description {text-align: center;}
    .mgh-ac-comment {padding: 1rem 1rem;}
    input.mgh-ac-input-name, input.mgh-ac-input-captcha, textarea.mgh-ac-input-comment {font-size: 0.8rem !important;}
    .mgh-ac-popup-message.error {color: #bc2c1d; font-size: 0.83rem; font-weight: 500; text-align: center;}
    .mgh-ac-popup-message.success {color: #176e3c; font-size: 0.83rem; font-weight: 500; text-align: center;}
    .mgh-ac-modal-content {padding: 1.3rem; margin-bottom: 1rem;}
}