body {
    background-color: #0d1e30;
    background-image: url('bnet-bg.jpg');
    background-repeat: repeat;
    color: rgba(255,255,255,.7);
}

header {
    background: rgba(255,255,255,.1);
    padding: 8px;
    border-radius: 0;

    a { color: white; }
}

a, footer a { color: white; }

h2, .subheader .title { color: #fff; }

form .right {
    input:not([type=submit]), textarea, select {
        background-color: rgba(16,22,29,.8);
        color: #fff;
        border: 1px solid rgba(255,255,255,.3);

        &:hover { border: 1px solid rgba(255,255,255,.5); }
        &:focus { border: 1px solid #00aeff; }
    }
}

:is(.subheader .right .button, form input[type=submit]) {
    background-color: rgb(14, 134, 202);
    border: 1px solid rgb(16, 161, 222);
    border-radius: 0;
    text-transform: none;
    font-weight: normal;
    color: white;
    cursor: pointer;

    &:hover { background: rgb(16, 161, 222); }
}

.board, .post, .thread, .thread-warning, .flashed-message, .recent-post {
    border: 1px solid rgba(255, 255, 255, .15);
    box-shadow: 0 0 0 1px #000;
    background-color: rgba(255,255,255,.05);
    color: #fff;
    margin-bottom: 6px;
    padding: 8px 12px;
}

.post { padding-bottom: 4px; }

.board, .thread, .recent-post {
    &:hover { background-color: rgba(255,255,255,.1); }
}

.recent-attachments-gallery .recent-attachment {
    border: 1px solid rgba(255, 255, 255, .15);
    box-shadow: 0 0 0 1px #000;
    background-color: rgba(255,255,255,.05);

    &:hover { background-color: rgba(255,255,255,.1); }
}

.recent-post {
    .name { color: #fff; }
    .reply-count, .author, .time {
        color: rgba(255,255,255,.5);
        font-weight: normal;
    }
}

.thread {
    .reply-count, .view-count, .author, .time {
        color: rgba(255,255,255,.5);
        font-weight: normal;

        a { color: rgba(255,255,255,.5); }
    }
}

.post .time a { color: rgba(255,255,255,.5); }

.thread .reply-count, .thread .view-count, .board .thread-count, .board .post-count,
.recent-post:not(.mod) .author .icon, .recent-post .time .icon,
.recent-post .reply-count .icon,
.thread .author .icon, .thread .time .icon, .post .time .icon {
    color: rgba(255,255,255,.5);
}

.recent-post .icon, .thread .icon, .board .icon,
.recent-post.mod .author,
.post.mod .author .icon, .post.mod .author,
.thread.mod .name, .thread.mod .name .icon, .thread.mod .author,
.thread.mod .author .icon {
    color: #00b4ff;
}

.board .name .icon,
.recent-post .name .icon,
.thread .name .icon {
    color: #00d683;
}

.thread:visited {
    .name .icon { color: #aaa; }
    .name { color: #aaa; }
}
.thread.no-replies .reply-count .icon { color: #aaa; }

.thread .time:hover .icon { color: #fff; }

.post .time a:hover,
.thread .time a:hover,
.recent-post .time a:hover {
    color: #fff;
}

.board .name, .recent-post .name, .thread .name, .post .author {
    font-weight: normal;
}

.board .description, .thread .excerpt, .recent-post .excerpt,
.post .text {
    color: rgba(255,255,255,.7);
}

.subheader .title .thread-views { color: rgba(255,255,255,.5); }

mark {
    background: #7a6200;
    color: #fff;
}

.post .text {
    strong, span.title { color: #fff; }
}

.boards:not(.full-width) {
    margin-right: 6px;
    width: calc(50% - 6px);
}

.recent-posts {
    margin-left: 6px;
    width: calc(50% - 6px);
}

.posts { margin-bottom: 8px; }

.post, .thread, .recent-post {
    margin: 0;
    box-shadow: unset;
    border: 0 none;
    border-top: 1px solid rgba(255,255,255,.15);

    &:last-child { border-bottom: 1px solid rgba(255,255,255,.15); }
}

.post {
    .post-buttons .post-button {
        opacity: .3;
        background-color: rgba(0,0,0,.2);
        border-color: rgba(255,255,255,.3);
        color: #00aeff;

        &:active {
            background-color: #00aeff;
            border-color: #00aeff;
            color: #fff;
        }
    }
    &:hover .post-buttons .post-button { opacity: 1; }
}

.thread-warning { margin-top: 12px; }

.pager {
    span, a {
        border-radius: 0;
        font-weight: normal;
    }
    span {
        background-color: unset;
        border: 0 none;
        color: rgba(255,255,255,.5);

        &.current {
            background-color: #00aeff;
            border-color: #00aeff;
            color: #fff;
        }
    }
    a {
        background-color: rgba(0,0,0,.2);
        border-color: rgba(255,255,255,.3);
        color: #00aeff;

        &:hover {
            background-color: unset;
            border-color: rgba(255,255,255,.6);
            color: #fff;
        }
    }
}

.post-info { border-bottom: 1px solid rgba(255, 255, 255, .15); }

.recent-posts-header {
    h2 a { color: #fff; }
    .rss-icon { color: #fff; }
}
.recent-attachments h2 a { color: #fff; }

.posts .post-meta {
    border-top-color: rgba(255, 255, 255, .15);
    background: rgba(255, 255, 255, .05);

    a { color: rgba(255, 255, 255, .7); }
}

@media all and (max-width: 600px) {
    .board {
        border-left: 0 none;
        border-right: 0 none;
        margin-bottom: 6px;
    }

    .boards, .boards:not(.full-width), .recent-posts {
        width: unset;
        margin: 0;
    }
}

select { color-scheme: dark; }

/* contrast fixes: sort-bar links inherit .sort-bar a: #555 from base which is unreadable on dark bg */
.sort-bar { a { color: #00aeff; &.sort-active { color: #fff; } } }