/* Dark mode styles */
body.dark__mode {
  background-color: #1f1f1f;
  color: #fff;
}

.dark__mode .c-card__image::after {
  background: #fff;
}

.dark__mode .c-card__link {
  color: #fff;
}

.dark__mode .c-card__detail {
  color: #fff;
}
.dark__mode .c-button {
  background: #fff;
  color: #2F3D5D;
  -webkit-box-shadow: inset 0 0 0 2px #fff;
  box-shadow: inset 0 0 0 2px #fff;
}

.dark__mode .c-button:hover,
.dark__mode .c-button:focus {
  background: transparent;
  -webkit-box-shadow: inset 0 0 0 4px currentColor;
  box-shadow: inset 0 0 0 4px currentColor;
  color: #fff;
}

.dark__mode .c-button--white {
  background: #2F3D5D;
  -webkit-box-shadow: inset 0 0 0 2px #2F3D5D;
  box-shadow: inset 0 0 0 2px #2F3D5D;
  color: #fff;
}

.dark__mode .c-button--white:hover,
.dark__mode .c-button--white:focus {
  background: transparent;
  -webkit-box-shadow: inset 0 0 0 4px currentColor;
  box-shadow: inset 0 0 0 4px currentColor;
  color: #2F3D5D;
}

.dark__mode .c-card.is-pinned::before {
  background: #fff;
  color: #2F3D5D;
}
.dark__mode .c-title{
    color:#fff;
}
.dark__mode .c-title::after{
    background-image:-webkit-gradient(linear, left top, right top, from(#fff), color-stop(33%, #fff), color-stop(33%, transparent), to(transparent));
    background-image:linear-gradient(to right, #fff 0%, #fff 33%, transparent 33%, transparent 100%);
}
.dark__mode .c-author__title {
    color: #fff;
}

.dark__mode .c-author__title a {
    color: #fff;
    -webkit-box-shadow: 0 2px 0 0 currentColor;
            box-shadow: 0 2px 0 0 currentColor;
}

.dark__mode .c-author__title a:hover,
.dark__mode .c-author__title a:focus {
    -webkit-box-shadow: 0 2px 0 0 #fff;
            box-shadow: 0 2px 0 0 #fff;
}
.dark__mode .c-comments__details {
  color: #fff;
}

.dark__mode .c-comments__username {
  color: #fff;
}

.dark__mode .c-comments__username:focus,
.dark__mode .c-comments__username:hover {
  box-shadow: 0 2px 0 0 currentColor, none;
}

.dark__mode .c-comments__date {
  color: #fff;
}

.dark__mode .c-comments__comment {
  color: #fff;
}

.dark__mode .c-comments__field {
  color: #fff;
  background-color: #404040;
}
.dark__mode .c-rating__star,
.dark__mode .c-rating__star.is-filled {
  -webkit-filter: invert(89%) sepia(95%) saturate(5%) hue-rotate(180deg) brightness(109%) contrast(86%);
  filter: invert(89%) sepia(95%) saturate(5%) hue-rotate(180deg) brightness(109%) contrast(86%);
}