/* В этом файле вы опишете значения переменных в разных цветовых схемах.
Придерживайтесь такого именования классов:
✦ theme-dark — класс тёмной темы
✦ theme-light — класс светлой темы
✦ не забудьте описать стили для изменения темы через медизапрос пользовательских предпочтений
*/

:root.theme-dark {
  --main-background-color: black;
  --color-accent: #00cc14;
  --main-text-color: #00cc14;
  --stroke-text-color: black;
  --button-background-color: black;
  --button-inverse-text-color: #00cc14;

  --font-weight-title: 785;
  --font-weight: 465;
  --background-gradient: repeating-linear-gradient(
      270deg,
      #000 0 2px,
      transparent 2px 4px
    ),
    repeating-linear-gradient(#000 0 2px, transparent 2px 4px),
    linear-gradient(#007f0c, #004306);
}

:root.theme-light {
  --main-background-color: white;
  --color-accent: black;
  --main-text-color: black;
  --stroke-text-color: white;
  --button-background-color: white;
  --button-inverse-text-color: white;

  --font-weight-title: 700;
  --font-weight: 400;
  --background-gradient: repeating-linear-gradient(
      270deg,
      #d3d3d3 0 2px,
      transparent 2px 4px
    ),
    repeating-linear-gradient(#d3d3d3 0 2px, transparent 2px 4px),
    linear-gradient(#e7e7e7 0.01%, #1a1a1a);
}

@media (prefers-color-scheme: dark) {
  :root {
    --main-background-color: black;
    --color-accent: #00cc14;
    --stroke-text-color: black;
    --button-background-color: black;
    --button-inverse-text-color: #00cc14;
    --main-text-color: #00cc14;


    --font-weight-title: 785;
    --font-weight: 465;
    --background-gradient: repeating-linear-gradient(
        270deg,
        #000 0 2px,
        transparent 2px 4px
      ),
      repeating-linear-gradient(#000 0 2px, transparent 2px 4px),
      linear-gradient(#007f0c, #004306);
  }
}