._theme-default {

  /* Legacy styling */
  --wf-color-bg-secondary: var(--wf-gray-300);
  --wf-color-background-info: #bedcf1;
  --wf-color-text-warning: var(--wf-yellow-700);
  --wf-color-text-info: var(--wf-dark-blue-500);
  --wf-color-link-01: var(--wf-gray-700); /* Consolidate this */
  --wf-color-link-hover-01: var(--wf-gray-800); /* Consolidate this */

  --gray1: var(--wf-gray-800);
  --gray2: var(--wf-gray-700);
  --gray3: var(--wf-gray-500);
  --gray4: var(--wf-gray-400);
  --gray5: var(--wf-gray-300);
  --gray6: var(--wf-gray-200);
  --gray7: var(--wf-gray-100);
  --gray8: var(--wf-gray-0);
  --accent: var(--wf-blue-300);

  /* Refactored tokens */

  /* Backgrounds */
  --wf-background: var(--wf-gray-0);
  --wf-background-secondary: var(--wf-gray-100);
  --wf-background-tertiary: var(--wf-gray-200);
  --wf-page-background: var(--wf-gray-0);
  --wf-background-accent: var(--wf-blue-300);
  --wf-background-inverse: var(--wf-gray-800);
  --wf-background-inverse-transparent: var(--wf-black-opaque-5);

  /* Borders */
  --wf-border-default: var(--wf-gray-300);
  --wf-border-active: var(--wf-blue-300);
  --wf-border-subtle: var(--wf-gray-200);
  --wf-border-strong: var(--wf-gray-700);

  /* Text */
  --wf-text-primary: var(--wf-gray-800);
  --wf-text-secondary: var(--wf-gray-700);
  --wf-text-on-color: var(--wf-gray-0);
  --wf-text-inverse: var(--wf-gray-300);
  --wf-text-helper: var(--wf-gray-500);
  --wf-text-disabled: var(--wf-gray-400);
  --wf-text-error: var(--wf-red-500);

  /* Buttons */
  --wf-button-background: var(--wf-gray-200);
  --wf-button-background-primary: var(--wf-blue-300);
  --wf-button-background-primary-hover: var(--wf-blue-400);
  --wf-button-background-primary-active: var(--wf-blue-500);
  --wf-button-background-secondary: var(--wf-gray-300);
  --wf-button-background-secondary-hover: var(--wf-gray-400);
  --wf-button-background-secondary-active: var(--wf-gray-400);
  --wf-ghost-button-background-hover: var(--wf-gray-100);
  --wf-ghost-button-background-active: var(--wf-gray-200);
  --wf-button-background-danger: var(--wf-red-500);
  --wf-button-background-danger-hover: var(--wf-red-700);
  --wf-button-background-loading: var(--wf-gray-300);
  --wf-button-disabled: var(--wf-gray-200);

  /* Icons */
  --wf-icon-primary: var(--wf-gray-500);
  --wf-icon-secondary: var(--wf-gray-700);
  --wf-icon-tertiary: var(--wf-gray-300);
  --wf-icon-active: var(--wf-blue-300);

  /* Support */
  --wf-support-success: var(--wf-green-700);
  --wf-support-warning: var(--wf-yellow-200);
  --wf-support-error: var(--wf-red-500);

  /* Links */
  --wf-link-primary: var(--wf-gray-500);
  --wf-link-secondary: var(--wf-blue-300);

  /* Header */
  --wf-header-background: var(--wf-gray-0);
  --wf-header-border: var(--wf-gray-200);
  --wf-header-text: var(--wf-gray-500);
  --wf-header-icon: var(--wf-gray-500);
  --wf-header-text-secondary: var(--wf-gray-700);
  --wf-header-button-background-hover: var(--wf-gray-200); /* Header icon background hover */
  --wf-header-button-background-active: var(--wf-gray-300);
  --wf-header-button-background-disabled: var(--wf-gray-300);

  /* Menu */
  --wf-menu-background: var(--wf-gray-0);
  --wf-menu-text: var(--wf-gray-700);
  --wf-menu-border: var(--wf-gray-200);
  --wf-menu-icon: var(--wf-gray-700);

  /* Input */
  --wf-input-background: var(--wf-gray-0);
  --wf-input-background-hover: var(--wf-gray-300);
  --wf-input-default: var(--wf-gray-300);
  --wf-input-active: var(--wf-blue-300);

  /* Text, Highlight and Tag colors - Replace the #values with colour vars */
  --wf-tag-text: var(--wf-gray-800);
  --wf-tag-background: var(--wf-gray-300);
  --wf-tag-text-red: #E02424;
  --wf-tag-background-red: #FBD5D5;
  --wf-tag-text-orange: #D03801;
  --wf-tag-background-orange: #FCD9BD;
  --wf-tag-text-yellow: #9F580A;
  --wf-tag-background-yellow: #FCE96A;
  --wf-tag-text-green: #057A55;
  --wf-tag-background-green: #BCF0DA;
  --wf-tag-text-blue: #1C64F2;
  --wf-tag-background-blue: #C3DDFD;
  --wf-tag-text-purple: #7E3AF2;
  --wf-tag-background-purple: #DCD7FE;
  --wf-tag-text-gray: #64748B;
  --wf-tag-background-gray: #E2E8F0;
  --wf-tag-text-teal: #108190;
  --wf-tag-background-teal: #BCF0F0;
  --wf-tag-text-sky: #007AB8;
  --wf-tag-background-sky: #BAE6FD;
  --wf-tag-text-pink: #D60BC1;
  --wf-tag-background-pink: #FBD7FE;

  /* Misc */
  --wf-highlight: var(--wf-blue-200);
  --wf-search-highlight: var(--wf-yellow-100);
  --wf-icon-star: var(--wf-yellow-200);
  --wf-page-shadow: none;
  --wf-present-theme: default;
  --wf-payment-stripe-theme: stripe;

  --webkit-scrollbar-track: none; /* Scrollbar background color */
  --webkit-scrollbar-thumb: var(--wf-gray-300); /* Scrollbar drag handle color */
  --webkit-scrollbar-thumb-hover: var(--wf-gray-400); /* Scrollbar drag handle hover color */

  --text-annotation-icon-colors-mentioned: #38BDF8;
  --text-annotation-icon-colors-added: #31C48D;
  --text-annotation-icon-colors-moved: #AC94FA;
  --text-annotation-icon-colors-completed: #97A6BA;
  --text-annotation-icon-colors-edited: #E3A008;

  --text-annotation-background-colors-mentioned: #EEFAFF;
  --text-annotation-background-colors-added: #BCF0DB;
  --text-annotation-background-colors-moved: #DCD7FE;
  --text-annotation-background-colors-completed: #E2E8F0;
  --text-annotation-background-colors-edited: #FEF6BC;

  --root-thread-box-shadow: rgba(0, 0, 0, 0.2) 0px 7px 9px -4px, rgba(0, 0, 0, 0.14) 0px 14px 21px 2px, rgba(0, 0, 0, 0.12) 0px 5px 26px 4px;
  --comment-box-shadow: 0px 3px 3px -2px rgba(0, 0, 0, 0.2),
  0px 3px 4px 0px rgba(0, 0, 0, 0.14),
  0px 1px 8px 0px rgba(0, 0, 0, 0.12);

  --comment-box-shadow-stacked-2: 0px 3px 3px -2px rgba(0, 0, 0, 0.2),
  0px 3px 4px 0px rgba(0, 0, 0, 0.14),
  0px 1px 8px 0px rgba(0, 0, 0, 0.12),
  0 10px 0 -5px #FFFFFF,
  0px 13px 3px -7px rgba(0, 0, 0, 0.2),
  0px 13px 4px -5px rgba(0, 0, 0, 0.14),
  0px 11px 8px -5px rgba(0, 0, 0, 0.12),
  0 20px 0 -10px #FFFFFF,
  0px 23px 3px -12px rgba(0, 0, 0, 0.2),
  0px 23px 4px -10px rgba(0, 0, 0, 0.14),
  0px 21px 8px -10px rgba(0, 0, 0, 0.12);
}