:root {
  /* colors */
  --color-bg: #000000;
  --text-color-primary: #f7f7f7;
  --text-color-secondary: #cccccc;
  --color-button-text: #000000;
  --color-accent: #3fd62b;
  --color-accent-gold: #f4bf3a;
  --color-purple: #9a4ffe;
  --background-gray: #242424;
  --background-dark-gray: #16181b;
  --background-dark: #171717;
  --background-gray-transparent: rgba(40, 43, 46, 0.4);
  --background-icon: #303746;
  --background-icon-glow: rgba(48, 55, 70, 0.5);
  --background-icon-transparent: rgba(48, 55, 70, 0);
  --buttons-gradient: linear-gradient(180deg, #3fd62b 32.12%, #0e7500 100%);
  --warning-shadow:
    0 15.504px 23.256px 0 rgba(0, 0, 0, 0.14),
    0 5.814px 29.07px 0 rgba(0, 0, 0, 0.12),
    0 7.752px 9.69px 0 rgba(0, 0, 0, 0.2);

  /* paddings */
  --padding-main: 16px;

  --radius-main: 16px;
  --radius-large: 24px;
  --radius-medium: 10px;
  --radius-small: 8px;

  /* font-size */
  --header-font-size-desktop: 24px;
  --header-font-size-mobile: 18px;
  --subheader-font-size-desktop: 20px;
  --subheader-font-size-mobile: 16px;
  --basic-font-size: 16px;
  --basic-font-size-mobile: 14px;
}