/* Shared widget overrides, loaded after both base component styles. */

:is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-item__content{
    font-family: var(--ce-local-comment-font-family, inherit);
    font-size: var(--ce-local-comment-font-size, 16px);
    font-weight: var(--ce-local-comment-font-weight, inherit);
    text-transform: var(--ce-local-comment-text-transform, none);
    font-style: var(--ce-local-comment-font-style, normal);
    text-decoration: var(--ce-local-comment-text-decoration, none);
    line-height: var(--ce-local-comment-line-height, 1.5);
    letter-spacing: var(--ce-local-comment-letter-spacing, normal);
    word-spacing: var(--ce-local-comment-word-spacing, normal);
}

:is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-item__author, :is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-item__date{
    font-family: var(--ce-local-meta-font-family, inherit);
    font-size: var(--ce-local-meta-font-size, 13px);
    font-weight: var(--ce-local-meta-font-weight, inherit);
    text-transform: var(--ce-local-meta-text-transform, none);
    font-style: var(--ce-local-meta-font-style, normal);
    text-decoration: var(--ce-local-meta-text-decoration, none);
    line-height: var(--ce-local-meta-line-height, 1.5);
    letter-spacing: var(--ce-local-meta-letter-spacing, normal);
    word-spacing: var(--ce-local-meta-word-spacing, normal);
}

:is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-item__author{ font-weight: var(--ce-local-meta-font-weight, 600); }
:is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-item__content{ color: var(--ce-local-comment-color, inherit); }
:is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-item__date, :is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-empty, :is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-loading{ color: var(--ce-local-meta-color, var(--ce-muted-text, #666)); }

:is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-dialog__title{
    font-family: var(--ce-local-title-font-family, inherit);
    font-size: var(--ce-local-title-font-size, 16px);
    font-weight: var(--ce-local-title-font-weight, 600);
    text-transform: var(--ce-local-title-text-transform, none);
    font-style: var(--ce-local-title-font-style, normal);
    text-decoration: var(--ce-local-title-text-decoration, none);
    line-height: var(--ce-local-title-line-height, 1.5);
    letter-spacing: var(--ce-local-title-letter-spacing, normal);
    word-spacing: var(--ce-local-title-word-spacing, normal);
}

:is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-textarea, :is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-embed__textarea{
    font-family: var(--ce-local-input-font-family, var(--ce-input-font-family, inherit));
    font-size: var(--ce-local-input-font-size, var(--ce-input-font-size, 16px));
    font-weight: var(--ce-local-input-font-weight, inherit);
    text-transform: var(--ce-local-input-text-transform, none);
    font-style: var(--ce-local-input-font-style, normal);
    text-decoration: var(--ce-local-input-text-decoration, none);
    line-height: var(--ce-local-input-line-height, 1.5);
    letter-spacing: var(--ce-local-input-letter-spacing, normal);
    word-spacing: var(--ce-local-input-word-spacing, normal);
}

:is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-submit, :is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-embed__submit, :is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-reply-btn, :is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-reaction-btn, :is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-embed__auth-btn{
    font-family: var(--ce-local-action-font-family, var(--ce-submit-font-family, inherit));
    font-size: var(--ce-local-action-font-size, var(--ce-submit-font-size, 14px));
    font-weight: var(--ce-local-action-font-weight, 500);
    text-transform: var(--ce-local-action-text-transform, none);
    font-style: var(--ce-local-action-font-style, normal);
    text-decoration: var(--ce-local-action-text-decoration, none);
    line-height: var(--ce-local-action-line-height, 1.5);
    letter-spacing: var(--ce-local-action-letter-spacing, normal);
    word-spacing: var(--ce-local-action-word-spacing, normal);
}

:is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-list{ gap: var(--ce-local-item-gap, 10px); }
:is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-textarea, :is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-embed__textarea{
    min-height: var(--ce-local-input-height, 80px);
    padding: var(--ce-local-input-padding, 10px 12px);
    border-width: 1px;
    border-style: solid;
    border-radius: var(--ce-local-input-radius, var(--ce-global-submit-rad, 8px));
    border-color: var(--ce-local-input-border, var(--ce-border, #e0e0e0));
    background: var(--ce-local-input-bg, var(--ce-input-bg, rgba(0,0,0,.03)));
    color: var(--ce-local-input-text, inherit);
}
:is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-textarea::placeholder, :is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-embed__textarea::placeholder{
    color: var(--ce-local-placeholder-color, var(--ce-local-meta-color, var(--ce-muted-text, #666)));
    opacity: 1;
}
:is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-submit, :is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-embed__submit{
    background: var(--ce-local-submit-bg, var(--ce-submit-bg, var(--ce-accent, #2271b1))) !important;
    color: var(--ce-local-submit-text, var(--ce-submit-text, #ffffff)) !important;
    padding: var(--ce-local-submit-padding, 9px 20px);
    border: none;
    border-radius: var(--ce-local-submit-radius, var(--ce-submit-radius, 8px));
}
:is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-submit:hover:not(:disabled), :is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-embed__submit:hover:not(:disabled){
    background: var(--ce-local-submit-bg, var(--ce-submit-bg, var(--ce-accent, #2271b1))) !important;
    color: var(--ce-local-submit-text, var(--ce-submit-text, #ffffff)) !important;
    opacity: 1;
    filter: brightness(.92);
}
:is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-textarea:focus, :is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-embed__textarea:focus{
    border-color: var(--ce-accent, #2271b1);
}
:is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-submit:focus-visible, :is(.ce-comment-dialog, .ce-comment-embed) .ce-comment-embed__submit:focus-visible{
    outline: 2px solid var(--ce-accent, #2271b1);
    outline-offset: 3px;
}
