.page.theme_light {
  --bg-color: #fff1f7;
  --title-color: #ffc2e6;
  --text-color: #353430;
  --subtitle-color: var(--text-color);
  --accent-color: #ff8dcb;
  --hover-border: 1px solid rgb(53 52 48 / 40%);

  background-image: url("../images/cover-image-light.png");
}

.theme_light .header__theme-menu-button {
  color: var(--text-color);
}

.theme_light .header__theme-menu-button_active {
  border: 1px solid var(--text-color);
}

.theme_light .header__theme-menu-button:hover {
  border: var(--hover-border);
}

.theme_light .header__theme-menu-button:focus-visible {
  border-block-end: 1px solid var(--text-color);
}

.theme_light .header__decoration {
  display: none;
}

.theme_light .decorated-zone::before,
.theme_light .decorated-zone::after {
  border-color: var(--text-color);
}

.theme_light .content__title {
  color: var(--text-color);
}

@media (prefers-color-scheme: light) {
  .page.theme_auto {
    --bg-color: #fff1f7;
    --title-color: #ffc2e6;
    --text-color: #353430;
    --subtitle-color: var(--text-color);
    --accent-color: #ff8dcb;

    background-color: var(--bg-color);
    background-image: url("../images/cover-image-light.png");
  }

  .theme_auto .header__theme-menu-button {
    color: var(--text-color);
  }

  .theme_auto .header__theme-menu-button_active {
    border: 1px solid var(--text-color);
  }

  .theme_auto .header__theme-menu-button:hover {
    border: 1px solid rgb(53 52 48 / 40%);
  }

  .theme_auto .header__theme-menu-button:focus-visible {
    border-block-end: 1px solid var(--text-color);
  }

  .theme_auto .header__decoration {
    display: none;
  }

  .theme_auto .decorated-zone::before,
  .theme_auto .decorated-zone::after {
    border-color: var(--text-color);
  }

  .theme_auto .content__title {
    color: var(--text-color);
  }
}
