@use "@sass-palette/hope-config";
.vp-page {
  &.vp-blog,
  &.vp-blog-home {
    display: flex;
    flex-flow: column;
    justify-content: space-between;

    box-sizing: border-box;
    padding-bottom: 2rem;

    background: var(--vp-c-bg);

    .theme-container.has-toc & {
      @media (min-width: hope-config.$pc) {
        // fix toc padding
        padding-inline-end: 0;
      }
    }
  }
}

.blog-page-wrapper {
  display: flex;
  align-items: flex-start;
  justify-content: center;

  box-sizing: border-box;
  width: 100%;
  margin: 0 auto;
  padding: 0 2rem;

  @media (max-width: hope-config.$pad) {
    padding: 0 1rem;
  }

  @media (max-width: hope-config.$mobile) {
    padding: 0;
  }
}