/* Match the existing mypage top spacing while retaining the shared .breadcrumb style. */
.hana-mypage-subpage .hana-mypage-subpage__body {
  margin-top: 32px !important;
}

.hana-mypage-subpage > .breadcrumb {
  overflow-wrap: anywhere;
}

/* Generated pages: keep the same gap below the breadcrumb as the account pages.
   TokenJs and ModuleJs are platform hooks and must remain in their original place. */
.hana-generated-ui > .breadcrumb + .l-container__row,
.hana-generated-ui > .breadcrumb + #TokenJs + .l-container__row,
.hana-confirmation > .breadcrumb + .l-container__row,
.hana-confirmation > .breadcrumb + #ModuleJs + .l-container__row,
.hana-complete > .breadcrumb + .l-container__row {
  margin-top: 32px !important;
}

@media screen and (max-width: 719px) {
  .hana-generated-ui > .breadcrumb + .l-container__row,
  .hana-generated-ui > .breadcrumb + #TokenJs + .l-container__row,
  .hana-confirmation > .breadcrumb + .l-container__row,
  .hana-confirmation > .breadcrumb + #ModuleJs + .l-container__row,
  .hana-complete > .breadcrumb + .l-container__row {
    margin-top: 24px !important;
  }

  .hana-mypage-subpage .hana-mypage-subpage__body {
    margin-top: 24px !important;
  }

  /* The platform's mobile sidebar offset assumed there was no breadcrumb above it. */
  .hana-mypage-subpage .p-account__inner__menu {
    margin-top: 0;
  }
}