/* Comment Summary - frontend styles */

.mutyun-comment-summary {
    margin: 10px 0 0 0;
    padding: 12px 14px 12px 16px;
    background: #eef5ff;
    border-left: 4px solid #2271b1;
    border-radius: 3px;
    color: #222;
    line-height: 1.6;
    font-size: 0.95em;
}

.mutyun-comment-summary__label {
    font-weight: bold;
    font-size: 1.05em;
    margin-bottom: 6px;
    color: #135e96;
}

.mutyun-comment-summary__body {
    font-size: 1em;
    line-height: 1.7;
    word-break: break-word;
}

.mutyun-comment-summary__disclaimer {
    margin-top: 8px;
    font-size: 0.85em;
    color: #888;
    line-height: 1.5;
}

/* Ensure the summary stays a normal block, even inside AA mode */
body.comment-aa-mode .mutyun-comment-summary,
body.comment-aa-mode .mutyun-comment-summary__body,
body.comment-aa-mode .mutyun-comment-summary__disclaimer,
body.comment-aa-mode .mutyun-comment-summary__label {
    white-space: normal !important;
    overflow-x: visible !important;
    font-family: inherit !important;
    line-height: 1.6 !important;
    letter-spacing: normal !important;
}

/* Dark mode */
html.mutyun-dark-mode body .mutyun-comment-summary {
    background-color: color-mix(in srgb, var(--mutyun-dm-bg) 88%, #fff 12%) !important;
    color: var(--mutyun-dm-text) !important;
    border-left-color: var(--mutyun-dm-link, #4ea1ff) !important;
}
html.mutyun-dark-mode body .mutyun-comment-summary__label {
    color: var(--mutyun-dm-link, #4ea1ff) !important;
}
html.mutyun-dark-mode body .mutyun-comment-summary__body {
    color: var(--mutyun-dm-text) !important;
}
html.mutyun-dark-mode body .mutyun-comment-summary__disclaimer {
    color: rgba(255, 255, 255, 0.55) !important;
}

/* Mobile */
@media (max-width: 600px) {
    .mutyun-comment-summary {
        padding: 10px 12px;
        font-size: 0.92em;
    }
    .mutyun-comment-summary__label {
        font-size: 1em;
    }
}