@use "vuepress-shared/styles/wrapper";

.vp-page-title {
  @include wrapper.horizontal-wrapper;

  position: relative;
  z-index: 1;
  padding-top: 1rem;
  padding-bottom: 0;

  @media print {
    // NOTE: Compatible with Android Wechat
    // padding-inline: 0!important;
    padding-inline-start: 0 !important;
    padding-inline-end: 0 !important;
  }

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

  h1 {
    margin-top: calc(0px - var(--navbar-height)) !important;
    margin-bottom: 1rem;
    padding-top: var(--navbar-height) !important;
    font-size: 2.2rem;

    @media (max-width: hope-config.$pad) {
      margin-bottom: 0.5rem;
    }

    .icon {
      margin-inline-end: 0.25em;
      color: var(--theme-color);
      font-size: 0.9em;
    }
  }
}

.theme-hope-content:not(.custom) {
  padding-top: 0 !important;

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    &:first-child {
      margin-top: calc(0.5rem - var(--navbar-height)) !important;
      padding-top: var(--navbar-height) !important;
    }
  }

  > h1:first-child {
    display: none;
  }
}