/* Page-scoped styles: digestive
 * Identity: slug:wl-hlp--digestive
 * Extracted VERBATIM from packages/rexall-ds/src/styles/globals.css.
 * Every selector here carries the identity above, so these rules could only
 * ever match on this one page -- yet every route downloaded them.
 * Loaded by <PageScopedStyles> AFTER globals.css. Only rules proven not to
 * change any cascade outcome by that move were extracted; see
 * docs/plans/css-route-splitting.md for the ordering proof.
 */


.wl-hlp.wl-hlp--digestive {
  /* Kilter's `.page-main` contributes the outer 15px gutters before its 85%
     section wrapper: .85 * (100vw - 30px) = 85% - 25.5px. */
  --wl-digestive-article-rail: min(calc(85% - 26px), 1020px);
}
.wl-hlp.wl-hlp--digestive
  > .wl-hlp-content:has(.wl-hlp-content-media)
  .wl-hlp-content-row {
  gap: 20px;
}
.wl-hlp.wl-hlp--digestive
  > .wl-hlp-content:has(.wl-hlp-content-list-columns)
  .wl-hlp-content-list-columns {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  max-width: 750px;
  margin: 40px auto 0;
}

.wl-hlp.wl-hlp--digestive
  > .wl-hlp-content:has(.wl-hlp-content-list-columns)
  .wl-hlp-content-list-columns li::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 28px;
  height: 29px;
  background: url("/images/articles/icon-bulletleaf.png") center / contain no-repeat;
  content: "";
}

.wl-hlp.wl-hlp--digestive > .wl-hlp-callout--tint .wl-hlp-callout-inner::before {
  position: absolute;
  top: -53px;
  left: 50%;
  width: 106px;
  height: 105px;
  background: #ffffff url("/images/articles/icon-tips.png") center / 86px 86px no-repeat;
  border-radius: 50%;
  transform: translateX(-50%);
  content: "";
}

.wl-hlp.wl-hlp--digestive > .wl-hlp-callout--tint .wl-hlp-callout-heading::after {
  content: ":";
}
.wl-hlp.wl-hlp--digestive > .wl-hlp-slider {
  display: none;
}

.wl-hlp.wl-hlp--digestive > .wl-hlp-sources .wl-hlp-sources-heading {
  margin-bottom: 15px;
  font-size: 14px;
  line-height: 1.2;
}

.wl-hlp.wl-hlp--digestive > .wl-hlp-sources .wl-hlp-sources-list {
  padding-left: 0;
  list-style: none;
}

.wl-hlp.wl-hlp--digestive > .wl-hlp-sources .wl-hlp-source {
  margin-bottom: 10px;
}

@media (min-width: 768px) {

  .wl-hlp.wl-hlp--digestive
    > .wl-hlp-content:has(.wl-hlp-content-media)
    .wl-hlp-content-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 40px;
    align-items: center;
  }

  .wl-hlp.wl-hlp--digestive
    > .wl-hlp-content:has(.wl-hlp-content-list-columns)
    .wl-hlp-content-list-columns {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 40px;
  }

  .wl-hlp.wl-hlp--digestive > .wl-hlp-sources {
    padding: 50px 0;
  }
}
.wl-hlp--digestive .rxp-breadcrumb-trail--sage ol {
  font-weight: 400;
}