:root {
  /* HERO UI BASE COLOURS */
  --base-default: #f6f8fc; /* midBackground */
  --base-primary: #e42313; /* accent */
  --base-primary-muted: #526ced22; /* (not a hero ui colour specifically) accentMuted */
  --base-secondary: #0d1a4d; /* primary-button-gradient-to, placeholder-gradient-to placeholder-gradient-short-to */
  --base-success: #4ebf83; /* new */
  --base-warning: #1399e0; /* new */
  --base-danger: #ff4b61; /* new */

  /* TEXT */
  --text-light: #ffffff; /* lightText */
  --text-mid: #6c757d; /* midText */
  --text-dark: #434343; /* darkText */
  --text-overlay-on-media: #ffffff;
  --text-ghost: #ffffffa1; /* new */

  /* BORDER */
  --border-overlay-on-media: #ffffff52; /*Use these tokens for floating UI over media-rich bgs (hero images, video, etc.) Primarily used for the context menu on the search hub.*/
  --border-ghost: #ffffff4d; /* new */
  --border-default: #e1e3e8; /* new midBorder darkBorder midDivider darkBorder */
  --border-dark: #bebebe; /* darkDivider */

  /*BACKGROUNDS */
  --bg-hub-navigation: #091238; /* navigationBackground */
  --bg-overlay-on-media: #44444470; /* new (e.g. dark image is used for a background, so this has to be set accordingly - used on hub search bar filter dropdown) */
  --bg-ghost: #ffffff5c; /*new */
  --bg-surface: #ffffff; /* new */
  --bg-light: #f5f7fb; /* lightBackground */
  --bg-mid: #f6f8fc; /* midBackground */
  --bg-dark: #edf2fc; /* darkBackground */

  /* GRADIENTS */
  --gradient-primary-button-start: #e42313; /* primary-button-gradient-from */
  --gradient-primary-button-end: #e42313; /* primary-button-gradient-to */
  --gradient-long-start: #6eabf5; /* placeholder-gradient-from */
  --gradient-long-end: #415ad7; /* placeholder-gradient-to */
  --gradient-short-start: #5e81e3; /* placeholder-gradient-short-from */
  --gradient-short-end: #5067d8; /* placeholder-gradient-short-to*/
  --gradient-hub-start: #223074ff; /* hub-gradient-start */
  --gradient-hub-via: #31267400; /* hub-gradient-via */
  --gradient-hub-end: #31267400; /* hub-gradient-end  */
}