/*
  Специально для светлой темы при наличии класса.
  Здесь окажутся стили, которые нужно переопределить принудительно,
  переключая тему
*/

.page.theme_light {
  /* Переменные светлой темы */    
  --background-image: url('../images/cover-image-light.png');
  --background-color:rgba(255, 241, 247, 1);
  --title-text-color: rgba(255, 194, 230, 1);
  --subtitle-text-color: rgba(53, 52, 48, 1);
  --decorated-subtitle-text-color: rgba(53, 52, 48, 1);
  --main-text-color: rgba(53, 52, 48, 1);
  --accent-color: rgba(255, 141, 203, 1);
  --menu-color: rgba(53, 52, 48, 1);
  --menu-hover-color: rgba(53, 52, 48, 0.4);
  --visibility: hidden;
}

@media (prefers-color-scheme: light) {
  :root {
    /* Дублируем переменные светлой темы */ 
    --background-image: url('../images/cover-image-light.png');
    --background-color:rgba(255, 241, 247, 1);
    --title-text-color: rgba(255, 194, 230, 1);
    --subtitle-text-color: rgba(53, 52, 48, 1);
    --decorated-subtitle-text-color: rgba(53, 52, 48, 1);
    --main-text-color: rgba(53, 52, 48, 1);
    --accent-color: rgba(255, 141, 203, 1);
    --menu-color: rgba(53, 52, 48, 1);
    --menu-hover-color: rgba(53, 52, 48, 0.4);
    --visibility: hidden;
  }
}