ernestwisniewski/kbin

.theme--tokyo-night {
  --kbin-body-font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --kbin-body-font-size: 1rem;
  --kbin-body-font-weight: 400;
  --kbin-body-line-height: 1.5;
  --kbin-body-text-align: left;
  --kbin-body-bg: #1f202e;

  --kbin-bg: #1f202e;
  --kbin-bg-nth: #262636;

  --kbin-text-color: #e4e4e7;
  --kbin-link-color: #d6d6ff;
  --kbin-link-hover-color: #9999ff;
  --kbin-outline: #9999ff solid 4px;

  --kbin-primary-color: #363649;
  --kbin-text-muted-color: #9191a1;

  --kbin-success-color: #a1e87d;
  --kbin-danger-color: #ff6675;

  --kbin-own-color: var(--kbin-success-color);
  --kbin-author-color: var(--kbin-danger-color);

  // section
  --kbin-section-bg: #2a2a3c;
  --kbin-section-text-color: var(--kbin-text-color);
  --kbin-section-title-link-color: var(--kbin-link-color);
  --kbin-section-link-color: #9c9fc9;
  --kbin-section-link-hover-color: var(--kbin-link-hover-color);
  --kbin-section-border: 1px solid #414358;
  --kbin-author-border: 1px dashed var(--kbin-author-color);
  --kbin-own-border: 1px dashed var(--kbin-own-color);

  // meta
  --kbin-meta-bg: none;
  --kbin-meta-text-color: #d5d6dd;
  --kbin-meta-link-color: #d6ddff;
  --kbin-meta-link-hover-color: var(--kbin-link-hover-color);
  --kbin-meta-border: 1px dashed #4f5064;
  --kbin-avatar-border: 3px solid #414358;
  --kbin-avatar-border-active: 3px solid #54576e;
  --kbin-blockquote-color: var(--kbin-success-color);

  // options
  --kbin-options-bg: #2a2a3c;
  --kbin-options-text-color: #a5a5c0;
  --kbin-options-link-color: #a9b1d6;
  --kbin-options-link-hover-color: #e1e5ec;
  --kbin-options-border: 1px solid #414358;
  --kbin-options-link-hover-border: 3px solid #e1e5ec;

  // forms
  --kbin-input-bg: #1b1c27;
  --kbin-input-text-color: #d6d6ff;
  --kbin-input-border: 1px solid #414358;
  --kbin-input-placeholder-text-color: #9292b1;

  // buttons
  --kbin-button-primary-bg: #9eadfa;
  --kbin-button-primary-hover-bg: #6e79f7;
  --kbin-button-primary-text-color: #1c1c22;
  --kbin-button-primary-text-hover-color: #0b0b0e;
  --kbin-button-primary-border: 1px solid transparent;

  --kbin-button-secondary-bg: #16161d;
  --kbin-button-secondary-hover-bg: #9eadfa;
  --kbin-button-secondary-text-color: var(--kbin-meta-text-color);
  --kbin-button-secondary-text-hover-color: #1c1c22;
  --kbin-button-secondary-border: 1px solid #414358;

  // header
  --kbin-header-bg: #16161d;
  --kbin-header-text-color: #e8e8ee;
  --kbin-header-link-color: #e8e8ee;
  --kbin-header-link-hover-color: #e8e8e8;
  --kbin-header-link-active-bg: var(--kbin-options-bg);
  --kbin-header-border: 1px solid #e5eaec;
  --kbin-header-hover-border: 3px solid #e8e8ee;

  // topbar
  --kbin-topbar-bg: #292b3d;
  --kbin-topbar-active-bg: #b3b3ff;
  --kbin-topbar-active-link-color: #000;
  --kbin-topbar-hover-bg: #535679;
  --kbin-topbar-border: 1px solid #575775;

  // sidebar
  --kbin-sidebar-header-text-color: #9191aa;
  --kbin-sidebar-header-border: 1px solid #575975;
  --kbin-sidebar-settings-row-bg: #37384e;
  --kbin-sidebar-settings-switch-on-color: #1c1c22 ;
  --kbin-sidebar-settings-switch-on-bg: var(--kbin-button-primary-bg);
  --kbin-sidebar-settings-switch-off-color: var(--kbin-body-bg);
  --kbin-sidebar-settings-switch-off-bg: #16161d;
  --kbin-sidebar-settings-switch-hover-bg: #7575a3;

  // vote
  --kbin-vote-bg: #1c1d26;
  --kbin-vote-text-color: #d6d6ff;
  --kbin-vote-text-hover-color: #9999ff;
  --kbin-upvoted-color: var(--kbin-success-color);
  --kbin-downvoted-color: var(--kbin-danger-color);

   //boost
   --kbin-boosted-color: var(--kbin-upvoted-color);

  // alerts
  --kbin-alert-info-bg: #fff3cc;
  --kbin-alert-info-border: 1px solid #fff3cc;
  --kbin-alert-info-text-color: #261f0d;
  --kbin-alert-info-link-color: #664b00;

  --kbin-alert-danger-bg: #16161d;
  --kbin-alert-danger-border: 1px solid var(--kbin-alert-danger-text-color);
  --kbin-alert-danger-text-color: var(--kbin-danger-color);
  --kbin-alert-danger-link-color: var(--kbin-danger-color);

  // entry
  --kbin-entry-link-visited-color: #a4a4c1;

  // footer
  --kbin-footer-bg: var(--kbin-primary-color);
  --kbin-footer-text-color: #e8e8ee;
  --kbin-footer-link-color: #e8e8ee;
  --kbin-footer-link-hover-color: var(--kbin-header-link-hover-color);

  .options--top,
  .section--top {
    border-top: var(--kbin-options-border) !important;
    margin-top: 0.5rem !important;
  }

  &.rounded-edges {
    .options--top,
    .section--top {
      border-radius: 0.5rem !important;
    }
  }
}