:root {
  /**********************************/
  /*   Declared in the Theme.json   */
  /**********************************/

  --primary: "";
  --success: "";
  --warning: "";

  /**********************/
  /*   One-off colors   */
  /**********************/

  --keep: #e43730;
  --dark-blue: #343a3f;
  --not-black: #1d1d1d;

  /***************************/
  /*   Social share colors   */
  /***************************/

  --social-instagram: hsl(0, 0%, 0%);
  --social-facebook: hsl(214, 82%, 49%);
  --social-linkedin: hsl(210, 90%, 40%);
  --social-pinterest: hsl(0, 100%, 40%);
  --social-twitter: hsl(0, 0%, 0%);
  --social-whatsapp: hsl(142, 70%, 49%);

  /***********************/
  /*   Highlights page   */
  /***********************/

  --highlighted-primary-text: white;
  --highlighted-primary-background: hsl(207, 10%, 23%);
  --highlightedDocumentsSecondary-text: rgba(0, 0, 0, 0.87);
  --highlighted-secondary-background: #baab68;

  /*************/
  /*   Greys   */
  /*************/

  --darkest-grey: #111;
  --darker-grey: var(--not-black);
  --dark-grey: #545454;
  --medium-dark-grey: #b5b5b5;
  --medium-grey: #c7c7c7;
  --medium-light-grey: #f0f0f0;
  --light-grey: #f1f1f1;
  --lighter-grey: #f5f5f5;
  --lightest-grey: #f7f7f7;

  /*******************/
  /*   By function   */
  /*******************/

  --dark-overlay: rgba(0, 0, 0, 0.5);
  --default-background-color: var(--lightest-grey);
  --disabled: var(--medium-dark-grey);
  --highlight: #ffd791;
  --separator-color: var(--medium-light-grey);

  /********************/
  /*   By component   */
  /********************/

  /* Navbar */
  --navbar-bg-color: var(--not-black);
  --navbar-text-color: rgba(255, 255, 255, 1);
  --navbar-hover-color: rgba(255, 255, 255, 0.2);
  --navbar-active-border-color: var(--navbar-text-color);
  --navbar-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);

  /* Footer */
  --footer-bg-color: var(--not-black);
  --footer-text-color: white;
  --footer-link-color: var(--primary);
  --footer-title-color: white;
  --footer-fixed-bg-color: var(--not-black);
  --footer-fixed-text-color: white;

  /* Text */
  --text-primary-color: #111;
  --text-secondary-color: #545454;
}

/**************/
/*   Footer   */
/**************/

footer.theme__footer {
  background-color: var(--footer-bg-color);
}

footer.theme__footer .footer__title {
  color: var(--footer-title-color);
}

footer.theme__footer p.MuiTypography-root,
footer.theme__footer span,
footer.theme__footer p {
  color: var(--footer-text-color);
}

footer.theme__footer a.MuiTypography-root,
footer.theme__footer a {
  color: var(--footer-link-color);
}

/********************/
/*   Footer fixed   */
/********************/

footer.footer .footer__text {
  color: var(--footer-fixed-text-color);
}