/* Fix for stray text appearing outside proper HTML containers */

/* Hide ALL paragraphs and text that appear in prod-mode before header */
.prod-mode > p,
.prod-mode > span,
.prod-mode
  > div:not(header):not(main):not(footer):not(.header-component-wrapper):not(
    .navigation-menus
  ):not(.bookmark-menu-container):not(.language-selector-container)
  > p {
  display: none !important;
}

/* Target the specific area between header and the breadcrumb */
header + p,
header ~ p:not(main p):not(footer p) {
  display: none !important;
}

/* Hide stray text appearing directly in __next */
#__next > p,
#__next > span:not(.logo-symbol) {
  display: none !important;
}

/* Hide any orphan paragraphs before main content */
.header-component ~ p {
  display: none !important;
}

/* Use clip to hide any overflow at the top of the page */
body {
  overflow-x: hidden;
}

/* Target text appearing right after the header-component-wrapper */
.header-component-wrapper + p,
.header-component-wrapper
  ~ p:not(main p):not(footer p):not(.freetext-component p):not(
    .share-component p
  ):not(.card-body p):not(.text-box p):not(.article-quote p) {
  display: none !important;
}

/* Hide orphaned content appearing at very top */
.prod-mode::before {
  content: none !important;
}

/* Make sure the header has proper background to cover stray content */
.header-component {
  position: relative;
  z-index: 100;
  background: #fff;
}

/* Push any stray content out of view */
.prod-mode {
  overflow: hidden;
}

/* Specifically hide paragraphs between prod-mode start and header */
.prod-mode > p:first-child,
.prod-mode > p:nth-child(2),
.prod-mode > p:nth-child(3),
.prod-mode > p:nth-child(4),
.prod-mode > p:nth-child(5) {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}
