/**
 * @file
 * Reusable non-PDS dependent utility classes.
 */
.reverse-stacking-column-order .row {
  flex-wrap: wrap-reverse;
}

/* Align items horizontally left/center/right */
.houston-align-center {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.houston-align-left {
  display: flex;
  align-items: start;
  justify-content: left;
  flex-direction: column;
}

.houston-align-right {
  display: flex;
  align-items: end;
  justify-content: right;
  flex-direction: column;
}

/* Remove margin utility */
.houston-remove-vertical-margin > :last-child, .houston-remove-vertical-margin p:last-of-type, .houston-remove-vertical-margin ul:last-child {
  margin-bottom: 0;
}
.houston-remove-vertical-margin > :first-child {
  margin-top: 0;
}

/**
 * Responsive height-constrained image class.
 *
 * By setting height + width to 'auto', SVG images need a `min-` property set,
 * specifically for height-constrained primary-navigation when the SVG uses
 * viewBox rather than height/width attributes at the root.
 *
 * @see .pds-u-responsive-image
 * @see .pds-u-responsive-image-raster
 * @todo Remove if PDS styles slots or includes a similar class.
 */
.houston-u-responsive-image {
  display: block;
  height: auto;
  line-height: 0;
  object-fit: contain;
  max-width: 100%;
  min-height: calc(var(--pds-base-unit) * 4);
  width: auto;
}

/* Multiple collapsible blocks or layout on top of each other to not have extra thick line. */
.has-pds-collapsible + .has-pds-collapsible {
  margin-top: -1px;
}

.reverse-stacking-column-order .row {
  flex-wrap: wrap-reverse;
}

/* Dark background text should be inverted to white */
.houston-text-invert {
  color: var(--pds-base-color-neutral-white);
  /* Dark background links should be inverted to white and dashed underline. */
  /* No underline for links in superscript tags (i.e. footnotes). */
  /* stylelint-disable-next-line no-descending-specificity */
}
.houston-text-invert a {
  color: var(--pds-base-color-neutral-white);
  border-bottom: 1px dashed;
  /* Solid underline for white links on hover. */
}
.houston-text-invert a:hover {
  border-bottom: 1px solid;
}
.houston-text-invert sup a {
  border-bottom: none;
  /* Hovering over footnote links should still be white and no underline. */
}
.houston-text-invert sup a:hover {
  color: var(--pds-base-color-neutral-white);
  border-bottom: none;
}
.houston-text-invert .pds-divider::before,
.houston-text-invert .pds-divider::after {
  border-color: var(--pds-base-color-neutral-white);
}
.houston-text-invert .recipe-quote .recipe-quote-attribution {
  color: var(--pds-base-color-neutral-white);
}

.houston-band-xs {
  padding-top: calc(var(--pds-base-unit) * 2);
  padding-bottom: calc(var(--pds-base-unit) * 2);
}

@media all and (min-width: 1024px) {
  .houston-container-padding {
    padding-left: calc(var(--pds-base-unit) * 5);
    padding-right: calc(var(--pds-base-unit) * 5);
  }
}

/* stylelint-disable-next-line no-descending-specificity */
.houston-card-grid-equal-height > .block,
.houston-card-grid-equal-height > .block > * {
  height: 100%;
}