:root {
    --accent: #aaa;
}

body {
    color: var(--foreground);
    background-color: var(--background);
}

a {
    color: var(--accent);
}

input {
    color: var(--foreground-secondary);
    background-color: var(--background-input);

    outline: 1px solid var(--border);
}

input:hover {
    outline: 2px solid var(--border);
}

input:focus {
    color: var(--foreground);

    outline: 2px solid var(--accent);
}

#NetworkNavigation, #NetworkNavigation a {
    background: var(--background-pane);

    color: var(--foreground-tertiary);
    fill: var(--foreground-tertiary);
}

#SpaceSidebar {
    background: var(--background-pane);
}

#SpaceIcon {
    color: var(--accent);
    fill: var(--accent);
}

#NetworkNavigation li NO {
    outline: 1px solid var(--border);
}

#NetworkNavigation li:hover {
    outline: 2px solid var(--border);
}

#NetworkNavigation li.selected {
    border-left: 4px solid var(--accent);
}

#SpaceNavigation li:hover {
    background-color: var(--background-input);
    outline: 2px solid var(--border);
}

#SpaceNavigation li.selected {
    border-left: 4px solid var(--accent);
}

#ThreadPins article {
    background-color: var(--background-pins);
}

.contentBlock:hover {
    border-color: var(--border);
}