:root {
  /* basic */
  --body-bg: linear-gradient(220deg, #FFF, #F0F0F0 31%, #FFF 64%, #DFDFDF);
  --waiting-lock-bg: rgba(0, 0, 0, 0.2);
  --waiting-anim-bg: black;
  --button-bg: rgb(158, 158, 158);
  --button-bg-hover: rgb(190, 190, 190);
  --button-fg: white;
  --button-fg-hover: white;

  /* messages */
  --message-fg: black;

  /* theme chooser */
  --themechooser-bg: rgba(255, 255, 255, 1);
  --themechooser-bg-img-1: url('/assets/images/themes/theme-dark.svg');
  --themechooser-bg-img-2: url('/assets/images/themes/theme-solary.svg');
  --themechooser-bg-img-3: url('/assets/images/themes/theme-rosaly.svg');
  --themechooser-bg-img-4: url('/assets/images/themes/theme-light.svg');
  --themechooser-text-bg: rgba(0, 0, 0, 0.2);
  --themechooser-text-fg: black;
  --themechooser-text-border: rgba(0, 0, 0, 1);

  /* navbar */
  --navbar-bg: linear-gradient(to right, #DFDFDF, #FFF);
  --navbar-fg: black;
  --navbar-linkhover-bg: linear-gradient(to bottom, rgb(93, 109, 126), rgb(213, 219, 219));
  --navbar-shadow: rgba(0, 0, 0, 0.4);
  --navbar-dropdown-bg: rgba(255, 255, 255, 0.8);
  --navbar-dropdown-fg: black;

  /* footer */
  --footer-bg: rgb(213, 213, 213);
  --footer-fg: black;
  --footer-seperator-bg: rgba(0, 0, 0, 0.2);
  --footer-link-fg: grey;
  --footer-link-hover-fg: grey;
  --footer-copytext-link-fg: rgb(68, 68, 68);
  --footer-copytext-link-hover-fg: rgb(95, 95, 95);

  /* form */
  --shadow-color: rgba(0, 0, 0, 0.1);
  --form-bg: rgb(255, 255, 255);
  --form-fg: black;
  --form-button-bg: rgb(158, 158, 158);
  --form-button-hover-bg: rgb(190, 190, 190);
  --form-button-fg: rgb(255, 255, 255);
  --form-button-hover-fg: rgb(255, 255, 255);
  --form-input-border-color: rgb(204, 204, 204);
  --form-input-bg: rgb(255, 255, 255);
  --form-input-fg: black;
  --imageselector-border-color: black;
  --imageselector-hover-bg: rgba(0, 0, 0, 0.1);

  /* grids */
  --grid-bg: rgba(0, 0, 0, 0.1);
  --grid-fg: black;
  --grid-title-bg: rgba(0, 0, 0, 0.25);
  --grid-actions-bg: rgb(213, 213, 213);
  --grid-actions-border: rgba(0, 0, 0, 0.2);
  --grid-actions-shadow: rgba(0, 0, 0, 0.2);

  /* card */
  --card-bg: rgb(220, 220, 220);
  --card-fg: black;
  --card-link-fg: grey;
  --card-shadow: rgba(0, 0, 0, 0.1);
  --card-header-bg: rgba(0, 0, 0, 0.15);
  --card-header-fg: black;
  --card-footer-bg: rgba(0, 0, 0, 0.1);
  --card-footer-fg: black;

  /* presentation */
  --presentation-bg: rgb(233, 233, 233);
  --presentation-alt-bga: rgb(255, 255, 255);
  --presentation-alt-bgb: rgb(213, 213, 213);
  --presentation-fg: black;
  --presentation-button-bg: #00799fa1;

  /* popups */
  --popup-bg: rgb(220, 220, 220);
  --popup-fg: black;

  /*******************************************************/

  /* sidebar */
  --sidebar-bg: rgb(233, 233, 233);
  --sidebar-icon-bg: rgba(210, 210, 210);
  --sidebar-user-bg: rgba(210, 210, 210);
  --sidebar-link-fg: black;
  --sidebar-logo-invert-value: 0;

  /* tables */
  --table-bg: rgb(168, 168, 168);
  --table-fg: black;
  --table-row-head-bg: rgba(0, 0, 0, 0.25);
  --table-row-head-fg: gold;
  --table-row-odd-bg: rgba(0, 0, 0, 0.05);
  --table-row-even-bg: rgba(0, 0, 0, 0.1);
  --table-row-hover-bg: rgba(0, 0, 0, 0.02);

  /* header */
  --header-bg: rgb(220, 220, 220);

  /* userinfos */
  --userinfos-sep-bg: rgba(0, 0, 0, 0.2);
}