@media screen and (prefers-color-scheme: dark) {
  :root {
    --text-color: #fff;

    --background-color: #14171a;
    --timeline-hover-bg-color: #2E3035;
    --room-list-background: #181c20;
    --room-list-background-overlay: rgba(0,0,0,0);
    --custom-event-content-background: #434343;
    --composer-background-color: #383A40;
    --right-panel-background-color: #1B1F23;
    --blockquote-border-color: #3b444a;
    --space-list-background-overlay: #16191d;
  }
}

@media screen and (prefers-color-scheme: light) {
  :root {
    --text-color: rgb(24, 28, 33);

    --background-color: #fff;
    --timeline-hover-bg-color: #fff;
    --room-list-background: #fff;
    --room-list-background-overlay: rgba(0,0,0,0);
    --custom-event-content-background: #fff;
    --composer-background-color: #fff;
    --right-panel-background-color: #fff;
    --blockquote-border-color: #d0d7de;
    --space-list-background-overlay: #F9FAFB;
  }
}

.right-panel-content {
    background-color: var(--right-panel-background-color);
}