@media (prefers-color-scheme: dark) {
  :root {
    --bg-color: #242424;
    --bg-color__section: #1b1c1c;
    --bg-color__section--gradient: linear-gradient(to right,
    		var(--bg-color__section), 60%,
    		var(--bg-color));
    --link-color: #5b89cb;
    --blend-mode: multiply;
    --text-color: #dee7f5;
    --text-color--dark: #e9eff8;
    --bg-color--transparent: rgba(36, 37, 38, 0.6);
    --bg-color__caption: #312d2d;
    --bg-color__caption--transparent: rgba(36, 36, 36, 0.6);
    --text-color--accent: #f7490c;
    --border-color: #000;
    --shadow__main: #171717;
    --shadow__bounce: #2f2f2f;
    --bg-color__input: #1d1d1d;
  }

  a .icon__logo {
    fill: #ccc;
  }

  input[type="text"], input[type="email"], textarea, textarea:focus {
    background-color: var(--bg-color__input);
    color: var(--text-color);
  }

  footer {
    --bg-color: #0f0f10;
    --link-color: #eef1f8;
    --text-color: #a2a8a7;
  }

  .card--shop {
    --link-color: var(--text-color);
  }

  figure,
  .card-header,
  .card-footer {
    --bg-color: var(--bg-color__caption);
  }

  .blog-post {
    box-shadow: 4px 4px 8px var(--shadow__main);
  }
  .blog-post .card-header {
    box-shadow: 0 2px 4px var(--shadow__main);
  }
  .blog-post .card-footer {
    box-shadow: 0 -2px 4px var(--shadow__main);
  }

  .navbar-toggler,
  .navbar-toggler[aria-expanded="true"] {
    --bg-color: #1b1c1c;
    --text-color: #727873;
    --bg-color__navbar-toggler--gradient:
    	linear-gradient(to bottom, var(--bg-color), #242526);
  }

  .bypostauthor {
    --bg-color__caption: var(--bg-color__section);
    --bg-color: #141516;
    --text-color: #dbe4ee;
  }
}