// Colors

$grey: #979797 !default;
$dark-grey: #444444 !default;
$light-grey: #cecece !default;
$lighter-grey: #ececec !default;
$lightest-grey: #f6f6f6 !default;
$zero-grey: #fcfcfc !default;

$red: #c65555 !default;
$light-red: #fce2e2 !default;

$blue: #56a9c7 !default;
$dark-blue: #95a2a7 !default;
$light-blue: #e2f5fc !default;

$light-green: #eaffea !default;

$black: #1c1c1c !default;
$white: #fefefe !default;
$yellow: #ffffe9 !default;

:root {
  --st-text-prim: $dark-grey;
  --st-text-sec: $grey;
  --st-bg-prim: $white;
  --st-bg-sec: $light-grey;
  --st-bg-ter: $lighter-grey;
  --st-bg-qua: $lightest-grey;
  --st-bg-qui: $zero-grey;
  --st-text-selected-prim: $black;
  --st-highlight-prim: $red;
  --st-font-color: var(--st-text-prim);
  --st-bg-color: var(--st-bg-prim);
  --st-tab-selected: var(--st-text-selected-prim);
  --st-tab-highlighted: var(--st-highlight-prim);
  --st-bg-notification-item: var(--st-bg-qua);
  --st-bg-message-info: $light-blue;
  --st-text-message-info: $dark-blue;
  --st-bg-message-error: $light-red;
  --st-text-message-error: var(--st-highlight-prim);
  --st-header-logo: var(--st-text-prim);
  --st-bg-menu-item: var(--st-bg-qua);
  --st-nav-tab-selected: var(--st-text-selected-prim);
  --st-nav-tab-line: var(--st-bg-sec);
  --st-br-paginator-button: var(--st-bg-ter);
  --st-bg-unread: $light-blue;
  --st-br-topic-item: var(--st-bg-ter);
  --st-text-topic-item: var(--st-text-sec);
  --st-bg-topic-item: var(--st-bg-qui);
  --st-text-topic-comment-new: var(--st-highlight-prim);
  --st-text-topic-item-link: var(--st-text-prim);
  --st-text-topic-item-link-visited: var(--st-text-sec);
  --st-br-comment-item: var(--st-bg-ter);
  --st-bg-comment-user-admin: #a1a100;
  --st-bg-comment-user-mod: #259b20;
  --st-bg-comment-user-topic-owner: #207a9b;
  --st-br-comment-quote: var(--st-bg-sec);
  --st-bg-comment-poll-bar: var(--st-bg-sec);
  --st-bg-comment-badge: var(--st-bg-sec);
  --st-text-comment-badge: var(--st-text-sec);
  --st-bg-comment-diff-ins: $light-green;
  --st-bg-comment-diff-del: $light-red;
  --st-bg-user-pic: var(--st-bg-sec);
  --st-text-user-pic: $light-grey;
  --st-bg-admin-stat: var(--st-bg-qua);
  --st-br-textarea: var(--st-bg-sec);
  --st-br-input-focus: var(--st-highlight-prim);
  --st-bg-input: var(--st-bg-prim);
  --st-text-link: var(--st-text-sec);
  //--st-text-link-visited: var(--st-text-ter);
  --st-text-link-hover: var(--st-text-selected-prim);
  --st-bg-code: var(--st-bg-qua);
  --st-bg-selection: var(--st-bg-sec);
  --st-text-selection: var(--st-bg-prim);
  --st-text-button: var(--st-text-prim);
  --st-bg-button: var(--st-bg-sec);
  --st-bg-button-undo: var(--st-highlight-prim);
  --st-bg-checkbox: var(--st-bg-prim);
  --st-br-checkbox: var(--st-bg-sec);
  --st-text-error-list: var(--st-highlight-prim);
}

@media screen and (prefers-color-scheme: dark) {
  :root {
    --st-text-prim: $light-grey;
    --st-text-sec: $grey;
    //--st-text-ter: #707070;
    --st-bg-prim: #121212;
    --st-bg-sec: #222222;
    --st-bg-ter: #1c1c1c;
    --st-bg-qua: #181818;
    --st-bg-qui: #131313;
    --st-text-selected-prim: $lighter-grey;
    --st-highlight-prim: #830000;
    --st-text-button: var(--st-text-sec);
    --st-bg-input: #181818;
    --st-bg-checkbox: #black;
    --st-bg-comment-user-admin: #979733;
    --st-bg-comment-user-mod: #2e8f38;
    --st-bg-comment-user-topic-owner: #2e658f;
    --st-bg-message-info: #13232f;
    --st-text-message-info: $dark-blue;
    --st-bg-message-error: #5e0000;
    --st-bg-selection: $light-grey;
    --st-text-selection: $black;
    --st-bg-unread: #13232f;
    --st-bg-comment-diff-ins: #003e00;
    --st-bg-comment-diff-del: #5e0000;
  }
}
