.chatHeader { text-align: center; font-weight: bold; padding: 5px 0; color: var(--text-color-secondary); border-bottom: 1px solid var(--color-owncast-gray-700); font-variant: small-caps; } .toBottomWrap { display: flex; width: 100%; justify-content: center; position: absolute; bottom: 50px; color: var(--text-color-secondary); & .toBottomWrap { & .toBottomBtn { z-index: 9999; border: none; background-color: gray; } } } .nameChangeView { display: flex; font-size: 0.9rem; border-radius: var(--theme-rounded-corners); padding: 5px 15px; color: var(--color-owncast-gray-300); background-color: var(--color-owncast-background); & .nameChangeText { font-weight: bold; font-family: var(--theme-text-display-font-family); & .plain { font-weight: normal; font-family: var(--theme-text-body-font-family) !important; } } } .chatContainer { display: flex; flex-direction: column; background-color: var(--theme-color-components-chat-background); height: 100%; } .virtuoso { width: auto; flex-grow: 1; overflow-y: scroll; overflow-x: hidden; margin-bottom: 10px; } .virtuoso::-webkit-scrollbar { width: 5px; height: auto; background-color: var(--theme-color-components-chat-background); } .virtuoso::-webkit-scrollbar-thumb { background: var(--theme-color-components-scrollbar-thumb); } .chatTextField { border-top: 1px solid lightgray; }