/*
  v2
  Blog Pages
*/
.blog {
  img {
    max-width: 100%;
  }

  .blog-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--spacing-09);

    .card-header {
      margin-bottom: var(--margin-sm);
      padding: 0;
    }

    p {
      margin-top: 12.5px;
    }
  }

  .blog-post-container {
    @include media-breakpoint-up(lg) {
      padding-right: 0;
    }
  }

  .blog-post {
    @include media-breakpoint-up(lg) {
      margin-right: var(--spacing-09);
    }

    .blog-title {
      margin-bottom: var(--spacing-04);
    }

    .blog-date {
      display: block;
      margin-bottom: var(--spacing-08);
    }

    .blog-content {
      > *:last-child {
        margin-bottom: 0;
      }
    }

    .blog-footer-tags {
      margin-top: var(--spacing-12);
    }
  }

  .tags {
    margin-top: var(--margin-md);

    .tags-list {
      list-style: none;
      padding: 0;
      display: flex;
      gap: var(--spacing-05);
      flex-wrap: wrap;
    }

    li {
      display: inline-flex;
    }

    a {
      font-size: small;
    }
  }

  pre {
    border: 1px solid var(--neutral-40);
    border-radius: var(--border-radius-base);
    padding: var(--spacing-04);
  }

  .figure {
    background-color: #fff;
    border: 1px solid var(--neutral-40);
    display: inline-block;
    margin: 0 auto var(--margin-sm) 0;
    max-width: 100%;
    padding: var(--spacing-04);

    .figure-caption {
      padding-top: var(--spacing-04);
      font-size: small;
    }
  }
}