/* BEGIN
forked from https://github.com/brian-jarvis/thelounge-theme-zenburn
 */

@import url('https://fonts.googleapis.com/css?family=Source+Code+Pro:400,400i');

* {
    font-family : 'Source Code Pro', monospace;
}

#chat.show-seconds .time, #chat.show-seconds .chat-view[data-type="channel"] .msg.highlight .time {
    width : auto;
}

/* END */

:root {
    --body-color               : #eee;
    --body-color-muted         : #9b9b9b;
    --border-color             : #222;
    --body-bg-color            : #000 !important;
    --body-bg-color-light      : #111;
    --button-color             : #2980b9;
    --button-color-muted       : #3498db;
    --button-text-color-hover  : #fff;
    --overlay-bg-color         : rgba(0, 0, 0, 0.5);
    --link-color               : #3498db;
    --window-bg-color          : #000;
    --window-heading-color     : #6c797a;
    --date-marker-color        : var(--button-color);
    --unread-marker-color      : var(--button-color);
    --highlight-bg-color       : var(--border-color);
    --highlight-border-color   : var(--button-color);
    --upload-progressbar-color : var(--button-color);
}

::-webkit-scrollbar:hover {
    background-color : var(--body-bg-color-light);
}

::-webkit-scrollbar-thumb:vertical {
    background-color : var(--border-color);
    border-radius    : 0;
}

::-webkit-scrollbar-thumb:vertical:active {
    background-color : #444;
}

body,
.input {
    background : var(--body-bg-color);
}

.input {
    border : 1px solid var(--border-color);
    color  : var(--body-color);
}

a:visited {
    color : #9b59b6;
}

.logo-container {
    display : none;
}

.channel-list-item[data-type=lobby] {
    color : var(--button-color);
}

.channel-list-item[data-type="lobby"]:hover,
.channel-list-item[data-type="lobby"].active {
    color : var(--button-color-muted);
}

.btn:active,
.btn:focus,
.input:focus {
    outline    : 0;
    box-shadow : 0 0 0 1px rgba(41, 128, 185, .5);
}

.input:not(:disabled):focus,
.input:not(:disabled):hover {
    border-color : var(--button-color);
}

#chat button.mentions,
#chat button.menu,
#viewport .lt,
#viewport .rt,
.topic-container .save-topic span,
.password-container .reveal-password span,
#form #submit,
#form #upload {
    color : var(--body-color-muted);
}

#form {
    background : inherit;
    color      : var(--body-color);
    border-top : 1px solid var(--border-color);
}

.jump-to-input .input {
    color : var(--body-color);
}

::placeholder {
    color : var(--body-color-muted);
}

#chat .header {
    border-bottom : 1px solid var(--border-color);
}

#chat .userlist,
#chat .content {
    border-left : 1px solid var(--border-color);
}

#chat .userlist .count {
    background : inherit;
}

#chat .msg[data-type=monospace_block] .text,
#chat .toggle-content,
#form #nick {
    background : var(--body-bg-color-light);
    color      : var(--body-color);
}

#footer button:hover,
#footer button.active,
.channel-list-item:hover {
    background-color : var(--body-bg-color-light);
    color            : var(--body-color);
}

#footer button {
    color : inherit;
}

#footer button.active,
.channel-list-item.active {
    background-color : var(--body-bg-color-light);
    color            : var(--body-color);
}

#sidebar {
    color : var(--body-color-muted);
}

.channel-list-item .badge {
    background : var(--border-color);
    color      : var(--body-color);
}

.channel-list-item .badge.highlight {
    background : var(--body-color);
    color      : var(--border-color);
}

#chat .msg[data-type=invite] .from:before,
#chat .msg[data-type="topic"] .from::before,
#chat .msg[data-type="mode"] .from::before,
#chat .msg[data-type="mode_channel"] .from::before,
#chat .msg[data-type=whois] .from:before,
#chat .msg[data-type=nick] .from:before,
#chat .msg[data-type=join] .from:before,
#chat .msg.self[data-type=raw] .from:before {
    color : var(--button-color);
}

code,
.irc-monospace {
    background-color : var(--border-color);
}

pre {
    background-color : #f5f5f5;
}

#context-menu {
    background : var(--body-bg-color);
    border     : 1px solid var(--border-color);
}

.context-menu-item {
    color : var(--body-color-muted);
}

.context-menu-item:hover {
    background : var(--body-bg-color-light);
    color      : var(--body-color);
}

#chat.colored-nicks .user.color-1 {color : #f7adf7}

#chat.colored-nicks .user.color-2 {color : #abf99f}

#chat.colored-nicks .user.color-3 {color : #86efdc}

#chat.colored-nicks .user.color-4 {color : #b76ee5}

#chat.colored-nicks .user.color-5 {color : #f9a4b3}

#chat.colored-nicks .user.color-6 {color : #f7999a}

#chat.colored-nicks .user.color-7 {color : #f497b9}

#chat.colored-nicks .user.color-8 {color : #f9a9d7}

#chat.colored-nicks .user.color-9 {color : #7fa2e2}

#chat.colored-nicks .user.color-10 {color : #a8b8ff}

#chat.colored-nicks .user.color-11 {color : #ad88fc}

#chat.colored-nicks .user.color-12 {color : #f4aead}

#chat.colored-nicks .user.color-13 {color : #fc71ab}

#chat.colored-nicks .user.color-14 {color : #ff72e0}

#chat.colored-nicks .user.color-15 {color : #8cb6ea}

#chat.colored-nicks .user.color-16 {color : #f9857c}

#chat.colored-nicks .user.color-17 {color : #ed9b82}

#chat.colored-nicks .user.color-18 {color : #8df484}

#chat.colored-nicks .user.color-19 {color : #ffcce3}

#chat.colored-nicks .user.color-20 {color : #efcc81}

#chat.colored-nicks .user.color-21 {color : #90a1ed}

#chat.colored-nicks .user.color-22 {color : #f4d484}

#chat.colored-nicks .user.color-23 {color : #97ea70}

#chat.colored-nicks .user.color-24 {color : #fcbbba}

#chat.colored-nicks .user.color-25 {color : #eef975}

#chat.colored-nicks .user.color-26 {color : #c7ff93}

#chat.colored-nicks .user.color-27 {color : #ffade1}

#chat.colored-nicks .user.color-28 { color : #98ecf2; }

#chat.colored-nicks .user.color-29 { color : #7187f2; }

#chat.colored-nicks .user.color-30 { color : #9676e2; }

#chat.colored-nicks .user.color-31 { color : #f2a4eb; }

#chat.colored-nicks .user.color-32 { color : #85f27d; }

/* Increase contrast of some IRC colors */
.irc-fg2 {
    color : #0074d9;
}

.irc-fg5 {
    color : #e969a7;
}

.irc-fg12 {
    color : #50a8ff;
}