.coolShoutbox{border:1px solid var(--wcfContentBorder);border-radius:var(--wcfBorderRadius);overflow:hidden}
.coolShoutbox .coolShoutbox__entries{max-height:260px;min-height:92px;overflow-y:auto;padding:7px 10px}
.coolShoutbox .coolShoutbox__entry{align-items:flex-start;display:flex;gap:8px;padding:5px 0}
.coolShoutbox .coolShoutbox__avatar{flex:0 0 32px;width:32px}.coolShoutbox .coolShoutbox__avatar img,.coolShoutbox .coolShoutbox__avatar .userAvatarImage{height:32px;width:32px}
.coolShoutbox .coolShoutbox__bubble{flex:1 1 auto;min-width:0}.coolShoutbox .coolShoutbox__meta{align-items:center;display:flex;gap:6px;min-height:24px}.coolShoutbox .coolShoutbox__meta strong{min-width:0}.coolShoutbox .coolShoutbox__meta time{color:var(--wcfContentText);font-size:11px;opacity:.7;white-space:nowrap}.coolShoutbox .coolShoutbox__entryOptions{margin-left:auto}.coolShoutbox .coolShoutbox__entryOptions>.button{background:transparent;border-color:transparent;min-width:30px;padding:2px 5px}
.coolShoutbox .coolShoutbox__message{line-height:1.45;overflow-wrap:anywhere}.coolShoutbox .coolShoutbox__message>:first-child{margin-top:0}.coolShoutbox .coolShoutbox__message>:last-child{margin-bottom:0}.coolShoutbox .coolShoutbox__empty{margin:4px 0}
.coolShoutbox .coolShoutbox__form{align-items:center;border-top:1px solid var(--wcfContentBorder);display:grid;gap:8px;grid-template-areas:"tools composer actions" "panel panel panel" "feedback feedback feedback";grid-template-columns:auto minmax(0,1fr) auto;padding:9px 10px}
.coolShoutbox .coolShoutbox__composer{grid-area:composer;min-width:0;border:1px solid var(--wcfContentBorder);border-radius:22px;overflow:hidden}
.coolShoutbox .coolShoutbox__tools{align-items:center;display:flex;gap:4px;grid-area:tools}
.coolShoutbox .coolShoutbox__actions{grid-area:actions}
.coolShoutbox .coolShoutbox__tool,.coolShoutbox .coolShoutbox__send{align-items:center;background:transparent!important;border:0!important;display:inline-flex;height:38px;justify-content:center;min-width:38px;padding:4px!important}
.coolShoutbox .coolShoutbox__formatToggle{font-size:19px;font-weight:700}
.coolShoutbox .coolShoutbox__tool.active,.coolShoutbox .coolShoutbox__formatToggle.active{color:var(--wcfContentLinkActive,var(--wcfContentLink))}
.coolShoutbox .coolShoutbox__send{color:var(--wcfContentLinkActive,var(--wcfContentLink))!important;min-width:42px}
.coolShoutbox .coolShoutbox__messageInput{box-sizing:border-box;min-height:40px;resize:none;width:100%}
.coolShoutbox .ck-editor{display:flex;flex-direction:column}
.coolShoutbox .ck-editor__top{order:1}
.coolShoutbox .ck-editor__main{order:2}
.coolShoutbox .ck.ck-editor__main>.ck-editor__editable,.coolShoutbox .ck-editor__editable_inline{background:transparent!important;border:0!important;box-shadow:none!important;max-height:76px;min-height:40px;overflow-y:auto;padding:8px 14px!important}
.coolShoutbox .ck-toolbar{display:none}
.coolShoutbox.coolShoutbox--formatting .ck-toolbar{display:flex;margin-bottom:6px}
.coolShoutbox .coolShoutbox__editorSmilies{display:none;grid-area:panel;min-width:0}
.coolShoutbox.coolShoutbox--smilies .coolShoutbox__editorSmilies{display:block;margin-top:2px}
.coolShoutbox.coolShoutbox--smilies .coolShoutbox__editorSmilies>.messageTabMenu>.messageTabMenuContent.messageTabMenu{display:block!important}
.coolShoutbox .coolShoutbox__editorSmilies .messageTabMenu{margin-bottom:0}
.coolShoutbox .coolShoutbox__editorSmilies .smileyList{max-height:160px;overflow-y:auto}
.coolShoutbox .coolShoutbox__feedback{color:var(--wcfStatusErrorText);grid-area:feedback;margin:0}
.coolShoutbox--box{border:0;border-radius:0}
@media(max-width:768px){.coolShoutbox .coolShoutbox__entries{max-height:250px;padding:6px 7px}.coolShoutbox .coolShoutbox__entry{gap:6px}.coolShoutbox .coolShoutbox__form{gap:5px;grid-template-columns:auto minmax(0,1fr) auto;padding:7px}.coolShoutbox .coolShoutbox__tools{gap:2px}.coolShoutbox .coolShoutbox__tool,.coolShoutbox .coolShoutbox__send{height:36px;min-width:34px}.coolShoutbox .ck.ck-editor__main>.ck-editor__editable,.coolShoutbox .ck-editor__editable_inline{max-height:68px;min-height:38px;padding:7px 11px!important}.coolShoutbox .coolShoutbox__editorSmilies{overflow-x:auto}}


/* 1.1.6: leichte optische Angleichung an die Retro Shoutbox */
.coolShoutbox .coolShoutbox__entries {
    padding: 10px 12px 8px;
    scroll-padding-top: 10px;
    scroll-padding-bottom: 10px;
}
.coolShoutbox .coolShoutbox__entry {
    gap: 8px;
    padding: 4px 0;
}
.coolShoutbox .coolShoutbox__bubble {
    background: var(--wcfContentBackground);
    border-radius: 14px;
    padding: 5px 10px 7px;
}
.coolShoutbox .coolShoutbox__meta {
    min-height: 20px;
}
.coolShoutbox .coolShoutbox__message {
    line-height: 1.4;
}
.coolShoutbox .coolShoutbox__form {
    gap: 6px;
    padding: 7px 10px;
}
.coolShoutbox .coolShoutbox__tools {
    gap: 2px;
}
.coolShoutbox .coolShoutbox__tool,
.coolShoutbox .coolShoutbox__send {
    height: 34px;
    min-width: 34px;
}
.coolShoutbox .coolShoutbox__send {
    min-width: 38px;
}
.coolShoutbox .coolShoutbox__composer {
    border-radius: 20px;
}
.coolShoutbox .coolShoutbox__messageInput {
    min-height: 36px;
}
.coolShoutbox .ck.ck-editor__main > .ck-editor__editable,
.coolShoutbox .ck-editor__editable_inline {
    min-height: 36px;
    max-height: 72px;
    padding: 6px 12px !important;
}
@media (max-width: 768px) {
    .coolShoutbox .coolShoutbox__entries {
        padding: 8px 7px 6px;
    }
    .coolShoutbox .coolShoutbox__entry {
        padding: 3px 0;
    }
    .coolShoutbox .coolShoutbox__bubble {
        border-radius: 12px;
        padding: 4px 8px 6px;
    }
    .coolShoutbox .coolShoutbox__form {
        gap: 4px;
        padding: 6px 7px;
    }
    .coolShoutbox .coolShoutbox__tool,
    .coolShoutbox .coolShoutbox__send {
        height: 32px;
        min-width: 32px;
    }
    .coolShoutbox .ck.ck-editor__main > .ck-editor__editable,
    .coolShoutbox .ck-editor__editable_inline {
        min-height: 34px;
        max-height: 64px;
        padding: 5px 10px !important;
    }
}
