:root {
  
  --bg-primary: #0b1021;
  --bg-lighter: #141b33;
  --bg-darker: #060913;
  
  --acsent: #00af9a;
  --very-dark-acsent: #092935;
  --third-acsent: #4f14ad;
  
  --white: #d8d8d8;
  --bright-white: #d8d8d8;
  --neutral: #7c7c7c;
  --success: #62d248;
  --warning: #f6f000;
  --danger: #f80363;
  
  --primary-bg-color: var(--bg-primary);
  --secondary-bg-color: var(--bg-lighter);
  --editor-bg-color: var(--bg-primary);
  --border-color: var(--very-dark-acsent);
  --ui-text-color: var(--white);
  --sn-stylekit-info-color: var(--acsent);
  --sn-stylekit-info-contrast-color: var(--bright-white);
  --sn-stylekit-neutral-color: var(--neutral);
  --sn-stylekit-neutral-contrast-color: var(--bright-white);
  --sn-stylekit-success-color: var(--success);
  --sn-stylekit-success-contrast-color: var(--bright-white);
  --sn-stylekit-warning-color: var(--warning);
  --sn-stylekit-warning-contrast-color: var(--bright-white);
  --sn-stylekit-danger-color: var(--danger);
  --sn-stylekit-danger-contrast-color: var(--bright-white);
  --sn-stylekit-grey-5: var(--bg-darker);

  --sn-desktop-titlebar-bg-color: var(--bg-primary);
  --sn-desktop-titlebar-border-color: var(--very-dark-acsent);
  --sn-desktop-titlebar-ui-color: var(--danger);
  --sn-desktop-titlebar-ui-hover-color: var(--acsent);
  
  --sn-stylekit-shadow-color: var(--bg-lighter);
  --sn-stylekit-background-color: var(--bg-primary);
  --sn-stylekit-border-color: var(--bg-darker);
  --sn-stylekit-foreground-color: var(--white);
  --sn-stylekit-contrast-background-color: var(--bg-lighter);
  --sn-stylekit-contrast-foreground-color: var(--white);
  --sn-stylekit-contrast-border-color: var(--very-dark-acsent);
  --sn-stylekit-secondary-background-color: var(--bg-darker);
  --sn-stylekit-secondary-foreground-color: var(--white);
  --sn-stylekit-secondary-border-color: var(--very-dark-acsent);
  --sn-stylekit-secondary-contrast-background-color: var(--third-acsent);
  --sn-stylekit-secondary-contrast-foreground-color: var(--white);
  --sn-stylekit-secondary-contrast-border-color: var(--third-acsent);
  --sn-stylekit-editor-background-color: var(--bg-color);
  --sn-stylekit-editor-foreground-color: var(--white);
  --sn-stylekit-paragraph-text-color: var(--white);
  --sn-stylekit-scrollbar-track-border-color: var(--very-dark-acsent);
  --sn-stylekit-scrollbar-thumb-color: var(--acsent);
}

// Fix for white color on notes in latest version
#notes-column .note:hover, .notes .note:hover,
#notes-column .note.selected, .notes .note.selected {
    background-color: var(--bg-darker);
    border-left: 3px solid #00af9a;
    transition: all 0.2s linear;
}